diff --git a/package.json b/package.json index 6922e35..f2b9457 100644 --- a/package.json +++ b/package.json @@ -10,10 +10,10 @@ "preview": "vite preview" }, "dependencies": { - "antd": "^5.21.2", "ag-grid-community": "^31.3.2", "ag-grid-enterprise": "^31.3.2", "ag-grid-react": "^31.3.2", + "antd": "^5.21.2", "axios": "^1.7.7", "crypto-js": "^4.2.0", "dayjs": "^1.11.13", diff --git a/src/apps/admin/layout/components/default-value.tsx b/src/apps/admin/pages/components/default-value.tsx similarity index 98% rename from src/apps/admin/layout/components/default-value.tsx rename to src/apps/admin/pages/components/default-value.tsx index 310bc42..7e07d20 100644 --- a/src/apps/admin/layout/components/default-value.tsx +++ b/src/apps/admin/pages/components/default-value.tsx @@ -118,7 +118,7 @@ export default function DefaultValue() { - +
DEFAULT PERCENTAGE
@@ -136,7 +136,7 @@ export default function DefaultValue() {
- +
CURRENT PERCENTAGE
diff --git a/src/apps/admin/pages/components/scheduling-data.tsx b/src/apps/admin/pages/components/scheduling-data.tsx new file mode 100644 index 0000000..c8fb989 --- /dev/null +++ b/src/apps/admin/pages/components/scheduling-data.tsx @@ -0,0 +1,207 @@ +import dayjs from 'dayjs'; +import axios from 'axios'; +import { App, Button, Card, Col, Flex, List, notification, Pagination, Row, Tag, Tooltip } from 'antd'; +import { useEffect, useState } from 'react'; +import { makeColorStatus, STATUS_DATA } from '@pos/base'; + +import { DeleteOutlined, EditOutlined, LockOutlined, UnlockOutlined } from '@ant-design/icons'; + +export default function SchedulingData() { + const { modal } = App.useApp(); + + const [loadingTable, setLoadingTable] = useState(false); + const [schedulingData, setSchedulingData] = useState([]); + const [meta, setMeta] = useState(); + + const handleGetData = async (page: number) => { + setLoadingTable(true); + await axios + .get('v1/data-scheduling', { params: { page: page, limit: 10 } }) + .then((resp: any) => { + const data = resp?.data?.data ?? []; + const meta = resp?.data?.meta; + setMeta(meta); + setSchedulingData(data); + setLoadingTable(false); + }) + .catch(() => { + setLoadingTable(false); + }); + }; + + const handleActivate = async (id: string) => { + await axios + .patch(`v1/data-scheduling/${id}/active`) + .then(() => { + handleGetData(meta?.currentPage); + }) + .catch((err: any) => { + notification.error({ + message: 'Gagal mengaktifkan data.', + description: + err?.message ?? err?.response?.data?.message ?? 'Terjadi kesalahan saat mengaktifkan konfigurasi', + }); + }); + }; + + const handleDeactivate = async (id: string) => { + await axios + .patch(`v1/data-scheduling/${id}/inactive`) + .then(() => { + handleGetData(meta?.currentPage); + }) + .catch((err: any) => { + notification.error({ + message: 'Gagal menonaktifkan data.', + description: + err?.message ?? err?.response?.data?.message ?? 'Terjadi kesalahan saat menonaktifkan konfigurasi', + }); + }); + }; + + const handleDelete = async (id: string) => { + await axios + .delete(`v1/data-scheduling/${id}`) + .then(() => { + handleGetData(meta?.currentPage); + }) + .catch((err: any) => { + notification.error({ + message: 'Gagal menghapus data.', + description: err?.message ?? err?.response?.data?.message ?? 'Terjadi kesalahan saat menghapus konfigurasi', + }); + }); + }; + + function makeColorText(value: number) { + if (value <= 30) { + return 'text-red-500'; + } else if (value > 30 && value <= 80) { + return 'text-yellow-500'; + } else if (value > 80 && value <= 100) { + return 'text-green-500'; + } + } + + useEffect(() => { + handleGetData(1); + }, []); + + return ( +
+ +
+ ( + + + + + + +
+
{item.name}
+
{`${dayjs(item?.schedule_date_from).format('DD MMM YYYY')} - ${dayjs(item?.schedule_date_to).format('DD MMM YYYY')}`}
+
+
+ + + +
{`${item.indexing_key} %`}
+ {item.status} +
+ +
+ + +
+ ); +} diff --git a/src/apps/admin/pages/setting.tsx b/src/apps/admin/pages/setting.tsx index 030ecbc..f9eb924 100644 --- a/src/apps/admin/pages/setting.tsx +++ b/src/apps/admin/pages/setting.tsx @@ -2,7 +2,10 @@ import { ACCESS_SETTING, UserDataState } from '@pos/base'; import { useEffect } from 'react'; import { useNavigate } from 'react-router-dom'; import { useRecoilValue } from 'recoil'; -import DefaultValue from '../layout/components/default-value'; + +import DefaultValue from './components/default-value'; +import SchedulingData from './components/scheduling-data'; +import { Flex } from 'antd'; export default function SettingModule() { const user = useRecoilValue(UserDataState); @@ -21,11 +24,13 @@ export default function SettingModule() { if (!checkAllowAccessSetting()) { navigate('/app'); } + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); return ( -
+ -
+ +
); }