phx-react
Version:
PHX REACT
183 lines • 12.8 kB
JavaScript
import { useState } from 'react';
import ModalAddBookBorrow from './modal-add-book';
import { PHXCard, PHXClientQueryV3, PHXDropdown, PHXFuncGetLoggedInfo, PHXInput, PHXSpinner, PHXTableStatic, } from '../../../../..';
import { fomartBookCode, getValidBookCodeLength, triggerMessage } from '../helper';
import { searchBookBorrowQuery } from '../query';
import { BORROWED_STATE_CODE, LOST_BOOK_STATE_CODE, SCHEDULE_BORROW_STATE_CODE, STOP_BORROW_STATE_CODE, MAX_BORROW_BOOK_INDIVIDUAL, MAX_BORROW_BOOK_STUDENT, STAFF_BORROW_INDIVIDUAL_CODE, STUDENT_BORROW_INDIVIDUAL_CODE, TEACHER_BORROW_INDIVIDUAL_CODE, } from '../constants';
import React from 'react';
import { FORM_TYPE } from '../../../constant';
export default function BookBorrowInfo({ bookBorrowerId, listBookBorrower, onChange, prefixQrCode, warehouseId, }) {
const [showModalAdd, setShowModalAdd] = useState(false);
const [searchBookLoading, setSearchBookLoading] = useState(false);
const userInfo = PHXFuncGetLoggedInfo();
const [listBook, setListBook] = useState([]);
const validateMaxBorrowBook = () => {
var _a, _b, _c, _d;
const totalBook = listBook.length;
if (bookBorrowerId === ((_a = listBookBorrower.find((item) => item.code === STUDENT_BORROW_INDIVIDUAL_CODE)) === null || _a === void 0 ? void 0 : _a.id) &&
totalBook >= MAX_BORROW_BOOK_STUDENT) {
return 'Học sinh chỉ được mượn tối đa ' + MAX_BORROW_BOOK_STUDENT + ' cuốn';
}
const role = bookBorrowerId === ((_b = listBookBorrower.find((item) => item.code === TEACHER_BORROW_INDIVIDUAL_CODE)) === null || _b === void 0 ? void 0 : _b.id)
? 'Giáo viên'
: 'Nhân viên';
const isStaffOrTeacher = bookBorrowerId === ((_c = listBookBorrower.find((item) => item.code === TEACHER_BORROW_INDIVIDUAL_CODE)) === null || _c === void 0 ? void 0 : _c.id) ||
bookBorrowerId === ((_d = listBookBorrower.find((item) => item.code === STAFF_BORROW_INDIVIDUAL_CODE)) === null || _d === void 0 ? void 0 : _d.id);
if (isStaffOrTeacher && totalBook >= MAX_BORROW_BOOK_INDIVIDUAL) {
return role + ' chỉ được mượn tối đa ' + MAX_BORROW_BOOK_INDIVIDUAL + ' cuốn';
}
return '';
};
const handleGetBookByCode = async (searchValue, inputEventRef) => {
var _a, _b, _c;
if (!searchValue || searchValue.length < getValidBookCodeLength(prefixQrCode)) {
return;
}
setSearchBookLoading(true);
try {
const searchCode = searchValue.toUpperCase();
const isExistBook = listBook.some((item) => item.code === searchCode);
if (isExistBook) {
triggerMessage({
type: FORM_TYPE.CUSTOM,
message: 'Sách đã được chọn',
});
return;
}
const validateMaxBorrowCountMessage = validateMaxBorrowBook();
if (validateMaxBorrowCountMessage) {
triggerMessage({
type: FORM_TYPE.CUSTOM,
message: validateMaxBorrowCountMessage,
});
return;
}
const { data: { library_dang_ki_ca_biet: book }, } = await PHXClientQueryV3({
query: searchBookBorrowQuery,
variables: {
code: searchCode,
school_id: userInfo === null || userInfo === void 0 ? void 0 : userInfo.school_id,
warehouseId,
},
});
if ((book === null || book === void 0 ? void 0 : book.length) === 0) {
triggerMessage({
type: FORM_TYPE.CUSTOM,
message: 'Sách không tồn tại',
isFailure: true,
});
return;
}
const { code, id, library_book_copy, library_state, state_id } = book[0];
const arrBookStateCode = [
STOP_BORROW_STATE_CODE,
LOST_BOOK_STATE_CODE,
BORROWED_STATE_CODE,
SCHEDULE_BORROW_STATE_CODE,
];
if (arrBookStateCode.includes(library_state.code)) {
triggerMessage({
type: FORM_TYPE.CUSTOM,
message: library_state === null || library_state === void 0 ? void 0 : library_state.name,
});
return;
}
const newList = [
{
id,
code,
title: (_a = library_book_copy === null || library_book_copy === void 0 ? void 0 : library_book_copy.library_book) === null || _a === void 0 ? void 0 : _a.title,
image: (_c = (_b = library_book_copy === null || library_book_copy === void 0 ? void 0 : library_book_copy.library_book_images) === null || _b === void 0 ? void 0 : _b[0]) === null || _c === void 0 ? void 0 : _c.url,
stateId: state_id,
},
...listBook,
];
setListBook(newList);
onChange(newList);
}
catch (e) {
console.log(e);
triggerMessage({
type: FORM_TYPE.ADD,
isFailure: true,
});
}
finally {
setSearchBookLoading(false);
inputEventRef.target.value = '';
// Focus lại vào input sau khi quét mã
requestAnimationFrame(() => inputEventRef.target.focus());
}
};
const handleInputChange = (e) => {
var _a;
if (searchBookLoading)
return; // Nếu hệ thống đang xử lí thì không làm j cả
const currValue = (_a = e.target.value) === null || _a === void 0 ? void 0 : _a.trim();
const formatedValue = fomartBookCode(currValue, prefixQrCode);
e.target.value = formatedValue;
if (formatedValue.length >= getValidBookCodeLength(prefixQrCode)) {
handleGetBookByCode(formatedValue, e);
e.target.value = '';
}
};
const handleChangeBookByModal = (newData) => {
const uniqueBooks = newData.filter((item) => !listBook.some((currBook) => currBook.code === item.code));
const newList = [...uniqueBooks, ...listBook];
setListBook(newList);
onChange(newList);
};
const handleShowModal = () => {
const validateMaxBorrowCountMessage = validateMaxBorrowBook();
if (validateMaxBorrowCountMessage) {
triggerMessage({
type: FORM_TYPE.CUSTOM,
message: validateMaxBorrowCountMessage,
});
return;
}
setShowModalAdd(true);
};
return (React.createElement(React.Fragment, null,
React.createElement(ModalAddBookBorrow, { onChange: handleChangeBookByModal, setShow: setShowModalAdd, show: showModalAdd, warehouseId: warehouseId }),
React.createElement(PHXCard, { border: false, headerAction: {
content: 'Thêm mới',
onClick: handleShowModal,
}, primaryHeader: true, title: 'Th\u00F4ng tin m\u01B0\u1EE3n s\u00E1ch' },
React.createElement("div", { className: 'space-y-3' },
React.createElement("div", { className: ' relative' },
React.createElement(PHXInput, { className: 'mb-4', disabled: searchBookLoading, label: `Danh sách mã sách (${listBook.length})`, onChange: handleInputChange, placeholder: 'T\u00ECm ki\u1EBFm m\u00E3 s\u00E1ch / Qu\u00E9t m\u00E3 s\u00E1ch', prefixIcon: 'MagnifyingGlassIcon' }),
searchBookLoading && React.createElement(PHXSpinner, { className: ' absolute right-3 top-[30px] h-4 w-4' })),
React.createElement(PHXTableStatic, { bodyData: listBook, numericalOrder: {
title: 'STT',
enable: true,
}, thBody: ['title', 'code', 'action'], thComponent: {
action(_value, item) {
return (React.createElement(PHXDropdown, { options: [
{
content: 'Xoá',
destructive: true,
onClick: () => {
const filteredListBook = listBook.filter((curr) => curr.id !== item.id);
setListBook(filteredListBook);
onChange(filteredListBook);
},
},
], origin: 'right', type: 'ellipsis-icon' }));
},
title(value, item) {
const isHaveImage = item === null || item === void 0 ? void 0 : item.image;
return (React.createElement("div", { className: 'flex w-[45ch] items-center gap-x-6 whitespace-normal' },
React.createElement("div", { className: `flex h-10 w-10 shrink-0 items-center justify-center overflow-hidden rounded-lg border border-gray-200 ${!isHaveImage && 'bg-[#F7F7F7]'}` }, isHaveImage ? (React.createElement("img", { alt: value, className: 'h-full w-auto', src: item.image })) : (React.createElement("svg", { fill: 'none', height: '13', viewBox: '0 0 13 13', width: '13', xmlns: 'http://www.w3.org/2000/svg' },
React.createElement("path", { d: 'M9 5.5C9.82843 5.5 10.5 4.82843 10.5 4C10.5 3.17157 9.82843 2.5 9 2.5C8.17157 2.5 7.5 3.17157 7.5 4C7.5 4.82843 8.17157 5.5 9 5.5Z', fill: '#8A8A8A' }),
React.createElement("path", { clipRule: 'evenodd', d: 'M5.5179 1.86555e-07H7.48211C8.29494 -7.05843e-06 8.95056 -1.29007e-05 9.48147 0.043364C10.0281 0.088026 10.5082 0.182385 10.9525 0.408726C11.6581 0.768251 12.2317 1.34193 12.5913 2.04754C12.8176 2.49175 12.912 2.9719 12.9566 3.51853C13 4.04944 13 4.70505 13 5.51788V7.48212C13 8.29496 13 8.95056 12.9566 9.48147C12.912 10.0281 12.8176 10.5082 12.5913 10.9525C12.2317 11.6581 11.6581 12.2317 10.9525 12.5913C10.5082 12.8176 10.0281 12.912 9.48147 12.9566C8.95056 13 8.29495 13 7.48212 13H5.51788C4.70505 13 4.04944 13 3.51853 12.9566C2.9719 12.912 2.49175 12.8176 2.04754 12.5913C1.34193 12.2317 0.768251 11.6581 0.408726 10.9525C0.182385 10.5082 0.088026 10.0281 0.043364 9.48147C-1.29007e-05 8.95056 -7.05843e-06 8.29495 1.86555e-07 7.48212V5.5179C-7.05843e-06 4.70506 -1.29007e-05 4.04944 0.043364 3.51853C0.088026 2.9719 0.182385 2.49175 0.408726 2.04754C0.768251 1.34193 1.34193 0.768251 2.04754 0.408726C2.49175 0.182385 2.9719 0.088026 3.51853 0.043364C4.04944 -1.29007e-05 4.70506 -7.05843e-06 5.5179 1.86555e-07ZM3.64068 1.53838C3.18681 1.57547 2.92604 1.6446 2.72852 1.74524C2.30516 1.96095 1.96095 2.30516 1.74524 2.72852C1.6446 2.92604 1.57547 3.18681 1.53838 3.64068C1.50058 4.10331 1.5 4.69755 1.5 5.55V6.9785L2.2228 6.11114C2.88159 5.32059 4.07697 5.26637 4.80462 5.99402L7.49999 8.68939L8.67963 7.50974C9.41716 6.77222 10.632 6.8395 11.2836 7.65396L11.4997 7.92404C11.5 7.77538 11.5 7.61768 11.5 7.45V5.55C11.5 4.69755 11.4994 4.10331 11.4616 3.64068C11.4245 3.18681 11.3554 2.92604 11.2548 2.72852C11.039 2.30516 10.6948 1.96095 10.2715 1.74524C10.074 1.6446 9.8132 1.57547 9.35932 1.53838C8.89669 1.50058 8.30245 1.5 7.45 1.5H5.55C4.69755 1.5 4.10331 1.50058 3.64068 1.53838ZM1.53838 9.35932C1.53622 9.33282 1.53417 9.30589 1.53225 9.2785C1.54743 9.26317 1.56209 9.24707 1.57615 9.23019L3.37513 7.07141C3.46924 6.95848 3.64001 6.95073 3.74396 7.05468L6.96966 10.2804C7.26255 10.5733 7.73742 10.5733 8.03032 10.2804L9.74029 8.5704C9.84565 8.46504 10.0192 8.47465 10.1123 8.59101L11.3252 10.1071C11.3037 10.1674 11.2803 10.2214 11.2548 10.2715C11.039 10.6948 10.6948 11.039 10.2715 11.2548C10.074 11.3554 9.8132 11.4245 9.35932 11.4616C8.89669 11.4994 8.30245 11.5 7.45 11.5H5.55C4.69755 11.5 4.10331 11.4994 3.64068 11.4616C3.18681 11.4245 2.92604 11.3554 2.72852 11.2548C2.30516 11.039 1.96095 10.6948 1.74524 10.2715C1.6446 10.074 1.57547 9.8132 1.53838 9.35932Z', fill: '#8A8A8A', fillRule: 'evenodd' })))),
React.createElement("p", null, value)));
},
}, thHeader: [
// @ts-ignore
React.createElement("p", { key: 'name', className: 'pl-16' }, "T\u00EAn s\u00E1ch"),
'Mã sách',
'Thao tác',
] })))));
}
//# sourceMappingURL=book-borrow-info.js.map