From c60817f529906f8a55bd2ab4bea76c27e277931f Mon Sep 17 00:00:00 2001 From: Amin Ghasempoor Date: Mon, 11 Sep 2023 14:28:58 +0330 Subject: [PATCH] TF-4 user management final changes --- public/locales/fa/app.json | 4 +- .../dashboard/commercial-chief/index.jsx | 3 + .../dashboard/development-assistant/index.jsx | 3 + .../dashboard/inspector-expert/index.jsx | 3 + .../dashboard/machinary-office/index.jsx | 3 + .../navgan-loan-management/index.jsx | 3 + .../navgan-province-manager/index.jsx | 3 + .../dashboard/passenger-boss/index.jsx | 3 + .../dashboard/passenger-office/index.jsx | 3 + .../dashboard/province-head-expert/index.jsx | 3 + .../refahi-loan-management/index.jsx | 3 + .../refahi-province-manager/index.jsx | 3 + .../transportation-assistance/index.jsx | 3 + .../dashboard/user-management/index.jsx | 8 +- src/core/components/DataTable.jsx | 180 +++++++----------- 15 files changed, 112 insertions(+), 116 deletions(-) diff --git a/public/locales/fa/app.json b/public/locales/fa/app.json index ae67ef2..5552301 100644 --- a/public/locales/fa/app.json +++ b/public/locales/fa/app.json @@ -354,7 +354,7 @@ "button-delete": "حذف کردن" }, "AddDialog": { - "add": "اضافه کردن", + "add": "کاربر جدید", "phone_number": "شماره تلفن", "phone_number_positive": "شماره تلفن باید مثبت باشد", "phone_number_error": "وارد کردن شماره تلفن الزامیست", @@ -372,6 +372,6 @@ "type_id": "نوع کاربر", "navgan_id": "کد ناوگان", "button-cancel": "انصراف", - "button-add": "اضافه کردن" + "button-add": "ثبت" } } diff --git a/src/components/dashboard/commercial-chief/index.jsx b/src/components/dashboard/commercial-chief/index.jsx index ab514a5..b04253a 100644 --- a/src/components/dashboard/commercial-chief/index.jsx +++ b/src/components/dashboard/commercial-chief/index.jsx @@ -133,6 +133,9 @@ function DashboardCommercialChiefComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/development-assistant/index.jsx b/src/components/dashboard/development-assistant/index.jsx index ab35636..0e058dd 100644 --- a/src/components/dashboard/development-assistant/index.jsx +++ b/src/components/dashboard/development-assistant/index.jsx @@ -136,6 +136,9 @@ function DashboardDevelopmentAssistantComponent() { enableLastUpdate={true} enablePinning={true} enableDensityToggle={false} + sorting={[{ + id: 'id', desc: false + }]} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) enableColumnFilters={true} enableHiding={true} diff --git a/src/components/dashboard/inspector-expert/index.jsx b/src/components/dashboard/inspector-expert/index.jsx index 53a2661..d1c959e 100644 --- a/src/components/dashboard/inspector-expert/index.jsx +++ b/src/components/dashboard/inspector-expert/index.jsx @@ -134,6 +134,9 @@ function DashboardInspectorExpertComponent() { enableCustomToolbar={false} enableLastUpdate={true} enablePinning={true} + sorting={[{ + id: 'id', desc: false + }]} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) enableColumnFilters={true} diff --git a/src/components/dashboard/machinary-office/index.jsx b/src/components/dashboard/machinary-office/index.jsx index b341529..2dfbbb1 100644 --- a/src/components/dashboard/machinary-office/index.jsx +++ b/src/components/dashboard/machinary-office/index.jsx @@ -164,6 +164,9 @@ function DashboardMachinaryOfficeComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/navgan-loan-management/index.jsx b/src/components/dashboard/navgan-loan-management/index.jsx index 57d3227..97879be 100644 --- a/src/components/dashboard/navgan-loan-management/index.jsx +++ b/src/components/dashboard/navgan-loan-management/index.jsx @@ -134,6 +134,9 @@ function DashboardNavganLoanManagementComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/navgan-province-manager/index.jsx b/src/components/dashboard/navgan-province-manager/index.jsx index a529336..d2dc745 100644 --- a/src/components/dashboard/navgan-province-manager/index.jsx +++ b/src/components/dashboard/navgan-province-manager/index.jsx @@ -165,6 +165,9 @@ function DashboardNavganProvinceManagerComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/passenger-boss/index.jsx b/src/components/dashboard/passenger-boss/index.jsx index 4f5f553..392cac3 100644 --- a/src/components/dashboard/passenger-boss/index.jsx +++ b/src/components/dashboard/passenger-boss/index.jsx @@ -165,6 +165,9 @@ function DashboardPassengerOfficeComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/passenger-office/index.jsx b/src/components/dashboard/passenger-office/index.jsx index 92335ad..7d9e39a 100644 --- a/src/components/dashboard/passenger-office/index.jsx +++ b/src/components/dashboard/passenger-office/index.jsx @@ -165,6 +165,9 @@ function DashboardPassengerOfficeComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/province-head-expert/index.jsx b/src/components/dashboard/province-head-expert/index.jsx index 6a20fa4..a647af9 100644 --- a/src/components/dashboard/province-head-expert/index.jsx +++ b/src/components/dashboard/province-head-expert/index.jsx @@ -134,6 +134,9 @@ function DashboardProvinceHeadExpertComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/refahi-loan-management/index.jsx b/src/components/dashboard/refahi-loan-management/index.jsx index 762c026..6bb3753 100644 --- a/src/components/dashboard/refahi-loan-management/index.jsx +++ b/src/components/dashboard/refahi-loan-management/index.jsx @@ -133,6 +133,9 @@ function DashboardRefahiLoanManagementComponent() { columns={columns} selectableRow={false} enableCustomToolbar={false} + sorting={[{ + id: 'id', desc: false + }]} enableLastUpdate={true} enablePinning={true} enableDensityToggle={false} diff --git a/src/components/dashboard/refahi-province-manager/index.jsx b/src/components/dashboard/refahi-province-manager/index.jsx index 25f7527..b649948 100644 --- a/src/components/dashboard/refahi-province-manager/index.jsx +++ b/src/components/dashboard/refahi-province-manager/index.jsx @@ -133,6 +133,9 @@ function DashboardRefahiProvinceManagerComponent() { columns={columns} selectableRow={false} enableCustomToolbar={false} + sorting={[{ + id: 'id', desc: false + }]} enableLastUpdate={true} enablePinning={true} enableDensityToggle={false} diff --git a/src/components/dashboard/transportation-assistance/index.jsx b/src/components/dashboard/transportation-assistance/index.jsx index 351107c..0786159 100644 --- a/src/components/dashboard/transportation-assistance/index.jsx +++ b/src/components/dashboard/transportation-assistance/index.jsx @@ -165,6 +165,9 @@ function DashboardTransportationAssistanceComponent() { selectableRow={false} enableCustomToolbar={false} enableLastUpdate={true} + sorting={[{ + id: 'id', desc: false + }]} enablePinning={true} enableDensityToggle={false} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) diff --git a/src/components/dashboard/user-management/index.jsx b/src/components/dashboard/user-management/index.jsx index 527fb23..8a69647 100644 --- a/src/components/dashboard/user-management/index.jsx +++ b/src/components/dashboard/user-management/index.jsx @@ -16,6 +16,7 @@ function DashboardUserManagementComponent() { const columns = useMemo(() => [{ accessorFn: (row) => row.id, id: "id", + sortDescFirst: true, header: t("UserManagement.id"), enableColumnFilter: true, datatype: "numeric", @@ -104,9 +105,7 @@ function DashboardUserManagementComponent() { column.setFilterValue(null); }} sx={{ - color: column.getFilterValue() ? "rgba(0, 0, 0, 0.54)" : "#bfbfbf", - marginTop: 7, - height: 25 + color: column.getFilterValue() ? "rgba(0, 0, 0, 0.54)" : "#bfbfbf", marginTop: 7, height: 25 }} > @@ -125,6 +124,9 @@ function DashboardUserManagementComponent() { enableLastUpdate={true} enablePinning={true} enableDensityToggle={false} + sorting={[{ + id: 'id', desc: true + }]} initialState={{density: 'compact'}} //compact (small) //comfortable (medium) //spacious (large) enableColumnFilters={true} enableHiding={true} diff --git a/src/core/components/DataTable.jsx b/src/core/components/DataTable.jsx index 8d06a02..1ec20b4 100644 --- a/src/core/components/DataTable.jsx +++ b/src/core/components/DataTable.jsx @@ -11,8 +11,7 @@ function DataTable(props) { const requestServer = useRequest({auth: true}) const fetcher = (...args) => { return requestServer(args, 'get', { - pending: false, - success: {notification: {show: false}} + pending: false, success: {notification: {show: false}} }).then((response) => { setRowCount(response.data.meta.totalRowCount); return response.data.data; @@ -22,14 +21,12 @@ function DataTable(props) { const t = useTranslations(); const {languageApp, languageList} = useLanguage(); const [columnFilters, setColumnFilters] = useState([]); - const [sorting, setSorting] = useState([]); + const [sorting, setSorting] = useState(props.sorting || []); const [pagination, setPagination] = useState({pageIndex: 0, pageSize: 10}); const [rowCount, setRowCount] = useState(0); const [columnFilterFns, setColumnFilterFns] = useState(() => { let output = {}; - const list = props.columns.map((item) => - item.enableColumnFilter ? {[item.id]: item.filterFn} : {[item.id]: ""} - ); + const list = props.columns.map((item) => item.enableColumnFilter ? {[item.id]: item.filterFn} : {[item.id]: ""}); for (var key in list) { var nestedObj = list[key]; for (var nestedKey in nestedObj) { @@ -39,22 +36,13 @@ function DataTable(props) { return output; }); - const [updateTime, setupdateTime] = useState( - moment().format("HH:mm | jYYYY/jM/jD") - ); + const [updateTime, setupdateTime] = useState(moment().format("HH:mm | jYYYY/jM/jD")); - const tableLocalization = useMemo( - () => - languageList.find((item) => item.key == languageApp).tableLocalization, - [languageApp, languageList] - ); + const tableLocalization = useMemo(() => languageList.find((item) => item.key == languageApp).tableLocalization, [languageApp, languageList]); const fetchUrl = useMemo(() => { const url = new URL(props.tableUrl); - url.searchParams.set( - "start", - `${pagination.pageIndex * pagination.pageSize}` - ); + url.searchParams.set("start", `${pagination.pageIndex * pagination.pageSize}`); const filters = columnFilters.map((filter) => { let datatype; for (const i in props.columns) { @@ -63,114 +51,84 @@ function DataTable(props) { } } return { - ...filter, - fn: columnFilterFns[filter.id], - datatype: datatype, + ...filter, fn: columnFilterFns[filter.id], datatype: datatype, }; }); url.searchParams.set("size", pagination.pageSize); url.searchParams.set("filters", JSON.stringify(filters ?? [])); url.searchParams.set("sorting", JSON.stringify(sorting ?? [])); return url; - }, [ - props.tableUrl, - columnFilters, - columnFilterFns, - pagination, - sorting, - props.columns, - ]); + }, [props.tableUrl, columnFilters, columnFilterFns, pagination, sorting, props.columns,]); const {data, isValidating, mutate} = useSWR(fetchUrl, fetcher, { - revalidateIfStale: false, - revalidateOnFocus: false, - revalidateOnReconnect: false + revalidateIfStale: false, revalidateOnFocus: false, revalidateOnReconnect: false }); useEffect(() => { setupdateTime(moment().format("HH:mm | jYYYY/jM/jD")); }, [isValidating, languageApp]); - return ( - (<> + {props.enableCustomToolbar /* send condition */ ? + /* send component */ : ""} + )} + renderBottomToolbarCustomActions={({table}) => (<> + {props.enableLastUpdate /* send condition */ ? ( ( - <> - {props.enableCustomToolbar /* send condition */ - ? /* send component */ - : ""} - - )} - renderBottomToolbarCustomActions={({table}) => ( - <> - {props.enableLastUpdate /* send condition */ ? ( - - {t("last_updated_at")}: {updateTime} - - ) : ( - "" - )} - - )} - state={{ - isLoading: isValidating, - columnFilters, - columnFilterFns, - pagination, - sorting, - }} - positionActionsColumn={"last"} - enableRowActions={props.enableRowActions} - renderRowActions={({row}) => } - {...props} - /> - ); + alignSelf: "center", + whiteSpace: "nowrap", + maxWidth: {xs: 100, sm: "100%"}, + overflowX: "scroll", + }} + variant="caption" + > + {t("last_updated_at")}: {updateTime} + ) : ("")} + )} + state={{ + isLoading: isValidating, columnFilters, columnFilterFns, pagination, sorting, + }} + positionActionsColumn={"last"} + enableRowActions={props.enableRowActions} + renderRowActions={({row}) => } + {...props} + />); } export default DataTable; \ No newline at end of file