phx-react
Version:
PHX REACT
446 lines • 32.5 kB
JavaScript
"use strict";
'use client';
exports.__esModule = true;
exports.PHXTable = void 0;
var tslib_1 = require("tslib");
var apollo_wrapper_1 = require("../../lib/apollo-wrapper");
var client_1 = require("@apollo/client");
var react_1 = require("@headlessui/react");
var solid_1 = require("@heroicons/react/24/solid");
var react_2 = tslib_1.__importStar(require("react"));
var EmptySearchResult_1 = tslib_1.__importDefault(require("./EmptySearchResult"));
var Pagination_1 = tslib_1.__importDefault(require("./Pagination"));
var RowTable_1 = require("./RowTable");
var sort_1 = tslib_1.__importDefault(require("./sort"));
var Button_1 = require("../Button");
var EmptyRecord_1 = require("../EmptyRecord");
var useDebounce_1 = tslib_1.__importDefault(require("../Func/useDebounce"));
var Loading_1 = require("../Loading");
var Skeleton_1 = require("../Skeleton");
var types_1 = require("../types");
var constants_1 = require("../../utils/constants");
var PaginaitonSelected_1 = tslib_1.__importDefault(require("./PaginaitonSelected"));
function PHXTable(_a) {
var _this = this;
var actionName = _a.actionName, _b = _a.clickRow, clickRow = _b === void 0 ? true : _b, _c = _a.clickType, clickType = _c === void 0 ? 'edit' : _c, editActionLink = _a.editActionLink, graphqlEndpoint = _a.graphqlEndpoint, selectedBtn = _a.selectedBtn, slectedTitle = _a.slectedTitle, hidePagination = _a.hidePagination, list = _a.list, _d = _a.numericalOrder, numericalOrder = _d === void 0 ? {
enable: false,
title: 'STT'
} : _d, onChange = _a.onChange, onClick = _a.onClick, pagination = _a.pagination, paginationData = _a.paginationData, router = _a.router, routerCondition = _a.routerCondition, _e = _a.rowNumber, rowNumber = _e === void 0 ? 10 : _e, search = _a.search, selectArray = _a.selectArray, selectedAllPeople = _a.selectedAllPeople, setAggregate = _a.setAggregate, setHeaderLoading = _a.setHeaderLoading, sort = _a.sort, sortData = _a.sortData, sortSelectData = _a.sortSelectData, thBody = _a.thBody, thBodyComponent = _a.thBodyComponent, thBodyFilter = _a.thBodyFilter, thHeader = _a.thHeader, thHeaderComponent = _a.thHeaderComponent, _f = _a.typeLoading, typeLoading = _f === void 0 ? { type: 'table' } : _f, directDetail = _a.directDetail, _g = _a.filterLoading, filterLoading = _g === void 0 ? false : _g, _h = _a.fixedTableLayout, fixedTableLayout = _h === void 0 ? true : _h;
var checkbox = (0, react_2.useRef)();
var _j = (0, react_2.useState)(false), checked = _j[0], setChecked = _j[1];
var _k = (0, react_2.useState)(false), indeterminate = _k[0], setIndeterminate = _k[1];
var _l = (0, react_2.useState)(true), isMainLoading = _l[0], setIsMainLoading = _l[1];
var _m = (0, react_2.useState)([]), dataTable = _m[0], setDataTable = _m[1];
var _o = (0, react_2.useState)(''), searchValue = _o[0], setSearchValue = _o[1];
var _p = (0, react_2.useState)([]), selectedPeople = _p[0], setSelectedPeople = _p[1];
var _q = (0, react_2.useState)(false), isSearchLoading = _q[0], setIsSearchLoading = _q[1];
var _r = (0, react_2.useState)([]), searchDataResult = _r[0], setSearchDataResult = _r[1];
var _s = (0, react_2.useState)(0), pagi = _s[0], setPagi = _s[1];
var _t = (0, react_2.useState)(0), count = _t[0], setCount = _t[1];
var timKiemPlacholder = 'Tìm kiếm';
var _u = (0, react_2.useState)(false), isSearch = _u[0], setIsSearch = _u[1];
var _v = (0, react_2.useState)(sort === null || sort === void 0 ? void 0 : sort.defaultActive), activeMenu = _v[0], setActiveMenu = _v[1];
var _w = (0, react_2.useState)(false), isSelectSort = _w[0], setIsSelectSort = _w[1];
var _x = (0, react_2.useState)(false), isSort = _x[0], setIsSort = _x[1];
var _y = (0, react_2.useState)(false), isSortLoading = _y[0], setIsSortLoading = _y[1];
var _z = (0, react_2.useState)(rowNumber), rowQuantity = _z[0], setRowQuantity = _z[1];
var _0 = (0, react_2.useState)(false), isChangeRowQty = _0[0], setIsChangeRowQty = _0[1];
var queryHidePagi = list.query.replace(/limit\s*:\s*\d+\s*,?|offset\s*:\s*\d+\s*,?/g, '');
var queryWithLimitSelected = list.query
.replace(/limit\s*:\s*\d+/g, "limit: ".concat(rowQuantity))
.replace(/offset\s*:\s*\d+/g, "offset: ".concat(pagination * rowQuantity));
var dataQuery = (0, client_1.gql)(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hidePagination ? queryHidePagi : queryWithLimitSelected);
var fetchData = (0, client_1.useLazyQuery)(dataQuery, {
fetchPolicy: 'network-only',
notifyOnNetworkStatusChange: true
})[0];
var getToken = function () {
if (typeof window !== 'undefined') {
var authTokenInfo_1 = localStorage.getItem(constants_1.AUTH_TOKEN)
? JSON.parse(localStorage.getItem(constants_1.AUTH_TOKEN))
: null;
return authTokenInfo_1 ? "Bearer ".concat(authTokenInfo_1.token) : null;
}
return null;
};
var authTokenInfo = getToken();
var remoteListQuery = (0, client_1.useLazyQuery)(dataQuery, {
context: {
uri: graphqlEndpoint,
headers: {
'Content-Type': 'application/json',
Authorization: getToken()
}
},
fetchPolicy: 'network-only',
notifyOnNetworkStatusChange: true
})[0];
var filterQuery = function (query, value) { return query.replace(/%@value%/g, "\"\"%".concat(value, "%\"\"")); };
var searchQuery = search ? filterQuery(search.query, searchValue.trim()) : '';
var searchQueryHidePagi = searchQuery.replace(/limit\s*:\s*\d+\s*,?|offset\s*:\s*\d+\s*,?/g, '');
var searchQueryWithLimitSelected = searchQuery
.replace(/limit\s*:\s*\d+/g, "limit: ".concat(rowQuantity))
.replace(/offset\s*:\s*\d+/g, "offset: ".concat(pagination * rowQuantity));
var searchDataQuery = (0, client_1.gql)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n ", "\n "], ["\n ", "\n "])), hidePagination ? searchQueryHidePagi : searchQueryWithLimitSelected);
var client = (0, client_1.useApolloClient)();
var fetchSearchData = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var res, error_1;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 2, , 3]);
return [4 /*yield*/, client.query({
query: searchDataQuery,
fetchPolicy: 'network-only'
})];
case 1:
res = _a.sent();
return [2 /*return*/, res];
case 2:
error_1 = _a.sent();
console.log(error_1);
return [2 /*return*/];
case 3: return [2 /*return*/];
}
});
}); };
var remoteListSearchQuery = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var res, error_2;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 2, , 3]);
return [4 /*yield*/, client.query({
query: searchDataQuery,
context: {
uri: graphqlEndpoint,
headers: {
'Content-Type': 'application/json',
Authorization: authTokenInfo
}
},
fetchPolicy: 'network-only',
notifyOnNetworkStatusChange: true
})];
case 1:
res = _a.sent();
return [2 /*return*/, res];
case 2:
error_2 = _a.sent();
console.log(error_2);
return [2 /*return*/];
case 3: return [2 /*return*/];
}
});
}); };
var getData = function (option) { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var startTime, result, data, endTime, duration;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0:
startTime = performance.now();
return [4 /*yield*/, option()];
case 1:
result = _a.sent();
data = result.data;
endTime = performance.now();
duration = endTime - startTime;
if (!(duration < constants_1.requestMaxDuration)) return [3 /*break*/, 3];
console.info('promise delay...');
return [4 /*yield*/, new Promise(function (r) { return setTimeout(r, 100); })];
case 2:
_a.sent();
_a.label = 3;
case 3: return [2 /*return*/, data];
}
});
}); };
var bindDataToTable = function (dataTable) {
// @ts-ignore
var data = tslib_1.__spreadArray([], dataTable, true);
setDataTable(data);
setSearchDataResult(data);
};
var _1 = (0, react_2.useState)(false), isChangePageLoading = _1[0], setIsChangePageLoading = _1[1];
var _2 = (0, react_2.useState)(''), previousValue = _2[0], setPreviousValue = _2[1];
var _3 = (0, react_2.useState)(1), currentPage = _3[0], setCurrentPage = _3[1];
var handleChangePage = function (page) {
if (page > 0 && page <= Math.ceil(count / rowQuantity)) {
setIsChangePageLoading(true);
setCurrentPage(page);
setPagi(page - 1);
paginationData(page - 1);
}
};
(0, react_2.useLayoutEffect)(function () {
var isIndeterminate = selectedPeople.length > 0 && selectedPeople.length < dataTable.length;
setChecked(selectedPeople.length === dataTable.length && dataTable.length > 0);
setIndeterminate(isIndeterminate);
// @ts-ignore
if (checkbox.current) {
checkbox.current.indeterminate = isIndeterminate;
}
}, [selectedPeople]);
function toggleAll() {
// @ts-ignore
if (searchValue) {
setSelectedPeople(checked || indeterminate ? [] : searchDataResult.filter(function (item) { return !(item === null || item === void 0 ? void 0 : item.entered_school); }));
}
else {
setSelectedPeople(checked || indeterminate ? [] : dataTable.filter(function (item) { return !(item === null || item === void 0 ? void 0 : item.entered_school); }));
}
if (onChange)
onChange(checked || indeterminate ? [] : dataTable.filter(function (item) { return !(item === null || item === void 0 ? void 0 : item.entered_school); }));
setChecked(!checked && !indeterminate);
setIndeterminate(false);
}
function brSetSelectedPeople(value) {
setSelectedPeople(value);
}
function renderInclude(person) {
// @ts-ignore
return selectedPeople.includes(person);
}
function searchChange(e) {
var value = e.target.value;
// Loại bỏ ký tự "\" từ chuỗi
var replaceSensitiveValue = value.replace(/\\/g, '');
setSearchValue(replaceSensitiveValue);
paginationData(0);
if (replaceSensitiveValue !== previousValue) {
setPreviousValue(replaceSensitiveValue);
}
if (replaceSensitiveValue.trim().length === 0) {
setSearchDataResult(dataTable);
}
setCurrentPage(1);
}
var debouncedSearch = (0, useDebounce_1["default"])(searchValue, 300);
var sortOnChange = function (item) {
var isChangeSort = item.id !== activeMenu;
setIsSort(true);
sortData(item.field, item.sortDirection);
setActiveMenu(item.id);
if (isChangeSort) {
setIsSortLoading(true);
}
};
var sortSelectOnchange = function (item, columnName) {
var isChangeSort = item.id !== activeMenu;
setActiveMenu(item.id);
sortSelectData(item, columnName);
setIsSelectSort(true);
if (isChangeSort) {
setIsSortLoading(true);
}
};
var actionClickAll = function () {
actionName(selectedPeople, true);
};
var checkConditionRouter = function (rowData) {
if (routerCondition.conditionArray.some(function (item) { return item === rowData[routerCondition.conditionName]; })) {
return true;
}
return false;
};
var handleSearch = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var data, dataTable, countPage;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0:
setIsSearchLoading(true);
return [4 /*yield*/, getData(graphqlEndpoint && authTokenInfo ? remoteListSearchQuery : fetchSearchData)];
case 1:
data = _a.sent();
dataTable = search.keyResult;
countPage = search.keyResult + '_aggregate';
setCount(data[countPage].aggregate.count);
if (setAggregate) {
setAggregate(data[countPage].aggregate.count);
}
if (previousValue !== searchValue) {
setCurrentPage(1);
}
setSearchDataResult(data[dataTable]);
setIsSearchLoading(false);
setIsChangeRowQty(false);
// khi search sẽ reset những row đã select
setSelectedPeople([]);
return [2 /*return*/];
}
});
}); };
var queryData = function () { return tslib_1.__awaiter(_this, void 0, void 0, function () {
var data, dataTable_1, countPage, e_1;
return tslib_1.__generator(this, function (_a) {
switch (_a.label) {
case 0:
_a.trys.push([0, 2, , 3]);
return [4 /*yield*/, getData(graphqlEndpoint && authTokenInfo ? remoteListQuery : fetchData)];
case 1:
data = _a.sent();
if (!data)
return [2 /*return*/];
setIsMainLoading(true);
dataTable_1 = list.keyResult;
countPage = list.keyResult + '_aggregate';
bindDataToTable(data[dataTable_1]);
setCount(data[countPage].aggregate.count);
if (setAggregate) {
setAggregate(data[countPage].aggregate.count);
}
setIsMainLoading(false);
if (setHeaderLoading)
setHeaderLoading();
setIsSearchLoading(false);
setIsChangePageLoading(false);
setIsChangeRowQty(false);
if (setAggregate) {
setAggregate(data[countPage].aggregate.count);
}
return [3 /*break*/, 3];
case 2:
e_1 = _a.sent();
console.log(e_1);
return [3 /*break*/, 3];
case 3: return [2 /*return*/];
}
});
}); };
(0, react_2.useEffect)(function () {
if (searchValue === '') {
queryData();
}
else if (debouncedSearch) {
handleSearch();
}
}, [pagi, sort, debouncedSearch]);
(0, react_2.useEffect)(function () {
if (pagination) {
setCurrentPage(pagination + 1);
}
}, [pagination]);
(0, react_2.useEffect)(function () {
if (dataTable) {
setIsSortLoading(false);
}
}, [dataTable]);
(0, react_2.useEffect)(function () {
if ((!isChangePageLoading && filterLoading) || isChangeRowQty) {
queryData();
setIsMainLoading(true);
setSelectedPeople([]);
}
if (search && search.enable && isChangePageLoading)
setIsSearchLoading(true);
}, [list, queryWithLimitSelected]);
return (react_2["default"].createElement(apollo_wrapper_1.ApolloWrapper, null, isMainLoading ? (react_2["default"].createElement(Skeleton_1.PHXSkeleton, { filterQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.filterQty, reportQty: typeLoading === null || typeLoading === void 0 ? void 0 : typeLoading.reportQty, type: typeLoading.type })) : (react_2["default"].createElement(react_2["default"].Fragment, null,
react_2["default"].createElement("div", { className: 'rounded-lg bg-white shadow ring-1 ring-black ring-opacity-5' },
react_2["default"].createElement("div", { className: 'flex flex-col' },
(dataTable.length > 0 ||
(dataTable.length === 0 && isSearch) ||
(dataTable.length === 0 && isSelectSort) ||
(dataTable.length === 0 && isSort)) && (react_2["default"].createElement("div", { className: 'min-w-full align-middle' },
react_2["default"].createElement(react_1.Transition, { as: react_2.Fragment, enter: 'transition-all duration-500 overflow-hidden', enterFrom: 'transform scale-95 opacity-0 h-0', enterTo: 'transform scale-100 opacity-100 h-full', leaveFrom: 'transform scale-100 opacity-100 h-full', leaveTo: 'transform scale-95 opacity-0 h-0', show: isSearch },
react_2["default"].createElement("div", { className: (0, types_1.classNames)('flex flex-row items-center justify-center rounded-tl-lg rounded-tr-lg border-b bg-white px-3 py-1 pl-5 ring-opacity-5', !sort || !sort.enable ? 'mb-2' : '') },
react_2["default"].createElement("div", { className: 'relative mr-2 w-11/12' },
react_2["default"].createElement("input", { autoFocus: true, className: 'block w-full rounded-lg border-transparent bg-transparent text-xs hover:bg-gray-100 focus:border-indigo-800 focus:bg-gray-100 focus:ring-indigo-800', id: 'search-value', name: 'search-value', onInput: searchChange, placeholder: timKiemPlacholder, type: 'text', value: searchValue })),
react_2["default"].createElement("div", { className: 'flex w-14 justify-center pt-1' }, isSearchLoading ? react_2["default"].createElement(Loading_1.PHXSpinner, null) : null),
react_2["default"].createElement("div", null,
react_2["default"].createElement("button", { className: 'inline-flex items-center rounded-lg border-gray-300 px-2 py-1 text-xs font-medium text-gray-700 hover:bg-gray-200', onClick: function () {
setIsSearch(false);
setSearchValue('');
if (searchValue) {
setSelectedPeople([]);
}
}, type: 'button' }, "Cancel")))),
react_2["default"].createElement("div", { className: (0, types_1.classNames)((sort && sort.enable) || (search && search.enable)
? "mb-2 flex flex-row items-center rounded-tl-lg rounded-tr-lg bg-white px-3 py-1.5 pl-8 ring-opacity-5 ".concat(sort && sort.enable ? 'sm:justify-between' : 'sm:justify-end')
: '', isSearch && (!sort || !sort.enable) ? 'hidden' : '') },
sort && sort.enable ? (react_2["default"].createElement(react_2["default"].Fragment, null,
react_2["default"].createElement(sort_1["default"], { activeMenu: activeMenu, className: 'w-11/12', isSearch: isSearch, onChange: sortOnChange, onChangeSelect: sortSelectOnchange, selectArray: selectArray, sortList: sort.sortList }),
react_2["default"].createElement("div", { className: 'flex justify-center pt-1 lg:w-14' }, isSortLoading ? react_2["default"].createElement(Loading_1.PHXSpinner, null) : null))) : null,
!isSearch && (react_2["default"].createElement("div", { className: 'flex justify-center' }, isChangePageLoading ? react_2["default"].createElement(Loading_1.PHXSpinner, null) : null)),
search && search.enable && (react_2["default"].createElement("div", null, !isSearch && (react_2["default"].createElement("button", { className: 'ml-1 flex rounded-lg bg-white px-2 py-1 text-xs font-normal text-gray-900 shadow-sm ring-1 ring-inset ring-gray-300 hover:bg-gray-50 active:bg-gray-200 active:pb-[0.2rem] active:pt-[0.3rem] active:shadow-[0rem_0.125rem_0.1rem_0rem_#0004_inset] sm:ml-0', onClick: function () { return setIsSearch(true); }, type: 'button' },
react_2["default"].createElement(solid_1.MagnifyingGlassIcon, { className: 'mr-1 h-4 w-4' }),
react_2["default"].createElement(solid_1.Bars3CenterLeftIcon, { className: 'h-4 w-4' })))))))),
dataTable.length > 0 ? (react_2["default"].createElement("div", null, searchDataResult.length > 0 && !isMainLoading ? (react_2["default"].createElement("div", { className: '-my-2 overflow-x-auto' },
react_2["default"].createElement("div", { className: (0, types_1.classNames)('min-w-full pb-2 align-middle shadow ring-black ring-opacity-5', (search && search.enable) || (sort && sort.enable) ? '' : 'pt-0.5') },
react_2["default"].createElement("div", { className: (0, types_1.classNames)('relative overflow-auto', (search && search.enable) || (sort && sort.enable)
? 'ring-1 ring-black ring-opacity-5'
: 'mt-1.5') },
react_2["default"].createElement(react_2["default"].Fragment, null, selectedAllPeople && selectedAllPeople.enable ? (react_2["default"].createElement(react_2["default"].Fragment, null, selectedPeople.length > 0 && selectedAllPeople.title && (react_2["default"].createElement("div", { className: 'absolute left-12 top-4 flex h-fit items-center space-x-3 bg-gray-50 sm:left-16' },
react_2["default"].createElement(Button_1.PHXButton, { onClick: actionClickAll, secondary: true, size: 'micro' }, selectedAllPeople.title))))) : null),
react_2["default"].createElement("table", { className: (0, types_1.classNames)(fixedTableLayout ? 'table-fixed' : '', (search && search.enable) || (sort && sort.enable) ? 'border-t' : '',
// @ts-ignore
thHeader.length < 5
? "w-full ".concat((selectedPeople === null || selectedPeople === void 0 ? void 0 : selectedPeople.length) === 0 || selectedAllPeople.title
? 'divide-y divide-gray-300'
: '')
: "min-w-full ".concat((selectedPeople === null || selectedPeople === void 0 ? void 0 : selectedPeople.length) === 0 || selectedAllPeople.title
? 'divide-y divide-gray-300'
: '')) },
selectedPeople.length > 0 && (react_2["default"].createElement("div", { className: 'absolute top-0 min-w-full border-b bg-gray-50 px-2 py-1' },
react_2["default"].createElement("div", { className: 'flex items-center justify-between' },
react_2["default"].createElement("p", { className: 'mb-1 ml-14 text-xs font-medium text-gray-900' },
"\u0110\u00E3 ch\u1ECDn ", selectedPeople === null || selectedPeople === void 0 ? void 0 :
selectedPeople.length,
" ",
slectedTitle),
react_2["default"].createElement("div", { className: 'flex justify-end gap-2' }, selectedBtn === null || selectedBtn === void 0 ? void 0 : selectedBtn.map(function (item, index) { return (react_2["default"].createElement(Button_1.PHXButton, { key: index, deleted: item.type === 'danger', onClick: function () { return item.onClick(selectedPeople); }, secondary: item.type === 'secondary', size: 'micro' }, item.content)); }))))),
thHeaderComponent ? (thHeaderComponent) : (react_2["default"].createElement("thead", null,
react_2["default"].createElement("tr", null,
selectedAllPeople && selectedAllPeople.enable ? (react_2["default"].createElement("th", { className: 'relative w-12 rounded-lg bg-gray-50 px-6 sm:w-16 sm:px-8', scope: 'col' },
react_2["default"].createElement("input", { ref: checkbox, checked: checked, className: 'absolute left-4 top-1/2 -mt-2 block h-4 w-4 rounded border-[0.5px] border-gray-500 text-indigo-800 hover:cursor-pointer hover:bg-gray-100 focus:ring-transparent sm:left-6', onChange: toggleAll, type: 'checkbox' }))) : null,
numericalOrder.enable && (react_2["default"].createElement("th", { key: 'stt', className: (0, types_1.classNames)('min-w-[135px] bg-gray-50 px-3 py-2 pl-8 text-left align-top text-xs font-medium text-gray-500'), scope: 'col' }, numericalOrder.title)),
thHeader.map(function (item, index) {
return index === 0 ? (react_2["default"].createElement("th", { key: index, className: (0, types_1.classNames)('min-w-[160px] rounded-lg bg-gray-50 px-3 py-2 pl-8 text-left align-top text-xs font-medium text-gray-500', selectedAllPeople && selectedAllPeople.enable ? '' : 'rounded-lg'), scope: 'col' }, item)) : (react_2["default"].createElement("th", { key: index, className: (0, types_1.classNames)('min-w-[135px] bg-gray-50 px-3 py-2 pl-8 text-left align-top text-xs font-medium text-gray-500', index === thHeader.length - 1 && 'rounded-lg'), scope: 'col' }, item));
})))),
react_2["default"].createElement("tbody", { className: 'divide-y divide-gray-200' }, searchValue === ''
? dataTable.map(function (item, index) { return (
// @ts-ignore
react_2["default"].createElement("tr", { key: item.id, className: (0, types_1.classNames)(clickRow ? 'hover:cursor-pointer hover:bg-gray-50' : '', renderInclude(item) && !(item === null || item === void 0 ? void 0 : item.entered_school) ? 'bg-gray-50' : ''), onClick: function () {
if (clickRow) {
if (routerCondition) {
// eslint-disable-next-line no-unused-expressions
checkConditionRouter(item)
? router.push("".concat(routerCondition.link).concat(item.id))
: router.push("".concat(editActionLink).concat(item.id));
}
else if (clickType === 'edit') {
router.push("".concat(editActionLink).concat(item.id));
}
else {
// @ts-ignore
onClick(item);
}
}
} }, thBody.map(function (bodyItem, bodyIndex) { return (react_2["default"].createElement(RowTable_1.RowTable, { numericalOrder: tslib_1.__assign(tslib_1.__assign({}, numericalOrder), { order: pagi * 10 + index + 1 }), key: bodyIndex, bodyIndex: bodyIndex, brSetSelectedPeople: brSetSelectedPeople, editActionLink: editActionLink, itemBody: item, onChange: onChange, selectedAllPeople: selectedAllPeople, selectedPeople: selectedPeople, thBody: thBody, thBodyComponent: thBodyComponent, thBodyFilter: thBodyFilter, directDetail: directDetail })); }))); })
: searchDataResult.map(function (item, index) { return (
// @ts-ignore
react_2["default"].createElement("tr", { key: item.id, className: (0, types_1.classNames)(clickRow ? 'hover:cursor-pointer hover:bg-gray-50' : '', renderInclude(item) && !(item === null || item === void 0 ? void 0 : item.entered_school) ? 'bg-gray-50' : ''), onClick: function () {
if (clickRow) {
if (routerCondition) {
// eslint-disable-next-line no-unused-expressions
checkConditionRouter(item)
? router.push("".concat(routerCondition.link).concat(item.id))
: router.push("".concat(editActionLink).concat(item.id));
}
else if (clickType === 'edit') {
router.push("".concat(editActionLink).concat(item.id));
}
else {
// @ts-ignore
onClick(item);
}
}
} }, thBody.map(function (bodyItem, bodyIndex) { return (react_2["default"].createElement(RowTable_1.RowTable, { numericalOrder: tslib_1.__assign(tslib_1.__assign({}, numericalOrder), { order: pagi * 10 + index + 1 }), key: bodyIndex, bodyIndex: bodyIndex, brSetSelectedPeople: brSetSelectedPeople, editActionLink: editActionLink, itemBody: item, selectedAllPeople: selectedAllPeople, selectedPeople: selectedPeople, thBody: thBody, thBodyComponent: thBodyComponent, thBodyFilter: thBodyFilter, directDetail: directDetail })); }))); }))))))) : (react_2["default"].createElement(EmptySearchResult_1["default"], null)))) : (dataTable.length === 0 && isSearch) ||
(dataTable.length === 0 && isSelectSort) ||
(dataTable.length === 0 && isSort) ? (react_2["default"].createElement(EmptySearchResult_1["default"], null)) : (react_2["default"].createElement(EmptyRecord_1.PHXEmptyRecord, null))),
dataTable.length > 0 && !hidePagination && (react_2["default"].createElement("div", { className: 'flex items-center justify-between rounded-lg rounded-tl-none rounded-tr-none border-t border-gray-200 bg-[#F9FAFB] py-2 pl-7 pr-2' },
react_2["default"].createElement(PaginaitonSelected_1["default"], { rowQuantity: rowQuantity, setIsChangeRowQty: setIsChangeRowQty, setRowQuantity: setRowQuantity }),
react_2["default"].createElement(Pagination_1["default"], { pagination: pagination, rowQuantity: rowQuantity, count: count, currentPage: currentPage, handleChangePage: handleChangePage, totalPages: Math.ceil(count / rowQuantity) }))))))));
}
exports.PHXTable = PHXTable;
var templateObject_1, templateObject_2;
//# sourceMappingURL=Table.js.map