phx-react
Version:
PHX REACT
80 lines • 6 kB
JavaScript
import React, { useState } from 'react';
import { PHXTable } from '../components/Table';
import { ApolloWrapper } from '../lib/apollo-wrapper';
import { PHXBadge } from '../components/Badge';
import PHXFuncGetLoggedInfo from '../components/Func/getLoginInfo';
export var list = function (pagination, fieldSort, sortDirection, school_id) {
return {
keyResult: 'bus',
query: "query MyQuery {\n bus(\n limit: 10,\n offset: ".concat(pagination * 10, ", \n order_by: {").concat(fieldSort, ": ").concat(sortDirection, "}\n where: {\n school_id: {_eq: ").concat(school_id, "},\n deleted_at: {_is_null: true}}, \n ) {\n id\n name\n plate_number\n created_at\n status\n bus_driver {\n name\n }\n bus_routes {\n name\n }\n user {\n full_name\n }\n }\n \n bus_aggregate(where: {school_id: {_eq: ").concat(school_id, "}, deleted_at: {_is_null: true}}) {\n aggregate {\n count\n }\n }\n }")
};
};
export var search = function (pagination, fieldSort, sortDirection, school_id) {
return {
enable: true,
keyResult: 'bus',
query: "query MyQuery {\n bus(\n limit: 10, \n offset: ".concat(pagination * 10, ",\n order_by: {").concat(fieldSort, ": ").concat(sortDirection, "},\n where: {school_id: {_eq: ").concat(school_id, "}, _or: [{name: {_ilike: \"%@value%\"}}], deleted_at: {_is_null: true}}\n ){\n id\n name\n plate_number\n created_at\n status\n bus_driver {\n name\n }\n bus_routes {\n name\n }\n user {\n full_name\n }\n }\n \n bus_aggregate(\n where: {school_id: {_eq: ").concat(school_id, "}, _or: [{name: {_ilike: \"%@value%\"}}], deleted_at: {_is_null: true}}\n ){\n aggregate {\n count\n }\n }\n }")
};
};
// const dateStrToDate = (date: string) =>
// date ? date.slice(8, 10) + '/' + date.slice(5, 7) + '/' + date.slice(0, 4) : ''
var TableDemo = function () {
var userInfo = PHXFuncGetLoggedInfo();
// const router = useRouter()
// const pathname = usePathname()
var _a = useState('created_at'), fieldSort = _a[0], setFieldSort = _a[1];
var _b = useState('desc'), sortDirection = _b[0], setSortDirection = _b[1];
var sortData = function (fieldSortParam, sortDirectionParam) {
setFieldSort(fieldSortParam);
setSortDirection(sortDirectionParam);
};
var _c = useState(0), pagination = _c[0], setPagination = _c[1];
var paginationData = function (pagi) {
setPagination(pagi);
};
var thHeader = ['Tên xe', 'Biển số xe', 'Tên lái xe', 'Tên Monitor', 'Tuyến', 'Trạng thái'];
var thBody = ['id', 'name', 'plate_number', 'bus_driver.name', 'user.full_name', 'bus_routes', 'status'];
var thBodyFilter = function (value) { return value; };
var thComponent = {
// @ts-ignore
bus_routes: function bind(value, itemBody) {
var _a;
return React.createElement("td", { className: 'text-xs text-gray-900' }, (_a = itemBody.bus_routes[0]) === null || _a === void 0 ? void 0 : _a.name);
},
// @ts-ignore
status: function bind(value, itemBody) {
switch (itemBody.status) {
case 0:
return React.createElement(PHXBadge, { text: 'K\u1EBFt th\u00FAc', type: 'default' });
case 1:
return React.createElement(PHXBadge, { text: '\u0110ang \u0111\u1EBFn tr\u01B0\u1EDDng', type: 'informational' });
case 2:
return React.createElement(PHXBadge, { text: '\u0110ang v\u1EC1 nh\u00E0', type: 'attention' });
default:
return React.createElement(PHXBadge, { text: 'K\u1EBFt th\u00FAc', type: 'default' });
}
}
};
// const editLink = '/vehicle/all/'
var searchQuery = search(pagination, fieldSort, sortDirection, userInfo === null || userInfo === void 0 ? void 0 : userInfo.school_id);
var listQuery = list(pagination, fieldSort, sortDirection, userInfo === null || userInfo === void 0 ? void 0 : userInfo.school_id);
var actionName = function (selectedPeople, action) {
console.log('people selected', selectedPeople, 'action', action);
};
return (React.createElement(ApolloWrapper, null,
React.createElement(PHXTable, { actionName: actionName, list: listQuery, paginationData: paginationData, search: searchQuery,
// sort={sort}
sortData: sortData,
// selectedAllPeople={selectedAllPeople}
// actionName={actionName}
thBody: thBody, thBodyComponent: thComponent,
// @ts-ignore
thBodyFilter: thBodyFilter, thHeader: thHeader, hidePagination: false, selectedAllPeople: { enable: true, title: 'Title' }, directDetail: {
enable: true,
onClick: function (item) {
console.log(item);
}
} })));
};
export default TableDemo;
//# sourceMappingURL=TableDemo.js.map