New API for dashboard

cope2n-fe/src/components/report-detail/report-overview-table.tsx

@@ -30,15 +30,19 @@ const columns: TableColumnsType<DataType> = [
     width: '100px',
     render: (_, record) => {
       if (record.subSidiaries === '+') return '';
-      return record.subSidiaries;
+      return String(record.subSidiaries).toUpperCase();
     },
     filters: [
-      { text: 'all', value: 'all' },
-      { text: 'sesp', value: 'sesp' },
-      { text: 'seau', value: 'seau' },
+      { text: 'ALL', value: 'ALL' },
+      { text: 'SEAU', value: 'SEAU' },
+      { text: 'SESP', value: 'SESP' },
+      { text: 'SME', value: 'SME' },
+      { text: 'SEPCO', value: 'SEPCO' },
+      { text: 'TSE', value: 'TSE' },
+      { text: 'SEIN', value: 'SEIN' },
     ],
     filterMode: 'menu',
-    onFilter: (value: string, record) => record.subSidiaries.includes(value),
+    onFilter: (value: string, record) => record.subSidiaries.includes(String(value).toUpperCase()),
   },
   {
     title: 'OCR extraction date',
@@ -216,23 +220,11 @@ const columns: TableColumnsType<DataType> = [
 ];
 
 interface ReportOverViewTableProps {
-  pagination: {
-    page: number;
-    page_size: number;
-  };
-  setPagination: React.Dispatch<
-    React.SetStateAction<{
-      page: number;
-      page_size: number;
-    }>
-  >;
   isLoading: boolean;
   data: any;
 }
 
 const ReportOverViewTable: React.FC<ReportOverViewTableProps> = ({
-  pagination,
-  setPagination,
   isLoading,
   data,
 }) => {
@@ -270,20 +262,6 @@ const ReportOverViewTable: React.FC<ReportOverViewTableProps> = ({
         bordered
         size='small'
         scroll={{ x: 2000 }}
-        pagination={{
-          current: pagination.page,
-          pageSize: 10,
-          total: dataSubsRows?.length,
-          // showTotal: (total, range) =>
-          //   `${range[0]}-${range[1]} of ${total} items`,
-          onChange: (page, pageSize) => {
-            setPagination({
-              page,
-              page_size: pageSize || 10,
-            });
-          },
-          showSizeChanger: false,
-        }}
       />
     </div>
   );

cope2n-fe/src/models/report.ts

@@ -53,6 +53,11 @@ export type ReportListParams = {
   subsidiary?: string;
 };
 
+export type DashboardOverviewParams = {
+  duration?: string;
+  subsidiary?: string;
+};
+
 export interface MakeReportResponse {
   report_id: string;
 }

cope2n-fe/src/pages/dashboard/index.tsx

@@ -1,8 +1,7 @@
 import { t } from '@lingui/macro';
-import { Button, DatePicker, Form, Select } from 'antd';
+import { Button, Form, Select } from 'antd';
 import { SbtPageHeader } from 'components/page-header';
 import { ReportOverViewTable } from 'components/report-detail';
-import { Dayjs } from 'dayjs';
 import { useOverViewReport } from 'queries/report';
 import { useState } from 'react';
 import { useNavigate } from 'react-router-dom';
@@ -11,55 +10,18 @@ import { downloadDashboardReport } from 'request/report';
 
 export interface ReportFormValues {
   duration: string;
-  dateRange: [Dayjs, Dayjs];
   subsidiary: string;
 }
 
 const Dashboard = () => {
   const navigate = useNavigate();
   const [duration, setDuration] = useState<string>('30d');
-  const [subsidiary, setSubsidiary] = useState<string>('all');
+  const [subsidiary, setSubsidiary] = useState<string>('ALL');
   const [form] = Form.useForm<ReportFormValues>();
-  const [pagination, setPagination] = useState({
-    page: 1,
-    page_size: 10,
-  });
-  const [fromData, setFormData] = useState<{
-    start_date: string;
-    end_date: string;
-    subsidiary: string;
-  }>({
-    start_date: '',
-    end_date: '',
-    subsidiary: '',
-  });
   const { isLoading, data } = useOverViewReport({
-    start_date: fromData.start_date,
-    end_date: fromData.end_date,
-    subsidiary: fromData.subsidiary,
-    page: pagination.page,
-    page_size: 30,
+    duration: duration,
+    subsidiary: subsidiary,
   });
-  const get30dDateRangeDayJS = () => {
-    const prev = new Date();
-    prev.setDate(prev.getDate() - 30);
-    const today = new Date();
-    return [prev, today];
-  };
-  const formatDate = (date: Date) => {
-    // YYYY-MM-DDTHH:mm:ssZ
-    const formated = date.toISOString().split('.')[0] + '+0000';
-    console.log('formated >>>', formated);
-    return formated;
-  }
-  const changeView = () => {
-    const dateRange = get30dDateRangeDayJS();
-    setFormData({
-      start_date: formatDate(dateRange[0]),
-      end_date: formatDate(dateRange[1]),
-      subsidiary: subsidiary,
-    });
-  };
 
   const handleDownloadReport = async () => {
     console.log('duration >>>', duration);
@@ -112,6 +74,7 @@ const Dashboard = () => {
             style={{ width: 200 }}
             options={[
               { value: '30d', label: 'Last 30 days' },
+              { value: '7d', label: 'Last 7 days' },
             ]}
             value={duration}
             onChange={(value) => {
@@ -129,11 +92,15 @@ const Dashboard = () => {
             placeholder='Select a subsidiary'
             style={{ width: 200 }}
             options={[
-              { value: 'all', label: 'ALL' },
-              { value: 'sesp', label: 'SESP' },
-              { value: 'seau', label: 'SEAU' },
+              { value: 'ALL', label: 'ALL' },
+              { value: 'SEAU', label: 'SEAU' },
+              { value: 'SESP', label: 'SESP' },
+              { value: 'SME', label: 'SME' },
+              { value: 'SEPCO', label: 'SEPCO' },
+              { value: 'TSE', label: 'TSE' },
+              { value: 'SEIN', label: 'SEIN' },
             ]}
-            defaultValue={'all'}
+            defaultValue='ALL'
             value={subsidiary}
             onChange={(value) => {
               setSubsidiary(value);
@@ -142,15 +109,12 @@ const Dashboard = () => {
         </Form.Item>
         <Form.Item>
           <Button type='primary' style={{ height: 38 }}
-            onClick={changeView}
           >
             View
           </Button>
         </Form.Item>
       </Form>
       <ReportOverViewTable
-        pagination={pagination}
-        setPagination={setPagination}
         isLoading={isLoading}
         data={data}
       />

cope2n-fe/src/pages/reports/index.tsx

@@ -105,9 +105,13 @@ const ReportsPage = () => {
               placeholder='Select a subsidiary'
               style={{ width: 200 }}
               options={[
-                { value: 'all', label: 'ALL' },
-                { value: 'sesp', label: 'SESP' },
-                { value: 'seau', label: 'SEAU' },
+                { value: 'ALL', label: 'ALL' },
+                { value: 'SEAU', label: 'SEAU' },
+                { value: 'SESP', label: 'SESP' },
+                { value: 'SME', label: 'SME' },
+                { value: 'SEPCO', label: 'SEPCO' },
+                { value: 'TSE', label: 'TSE' },
+                { value: 'SEIN', label: 'SEIN' },
               ]}
             />
           </Form.Item>

cope2n-fe/src/queries/report.ts

@@ -1,5 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import { ReportListParams } from 'models';
+import { ReportListParams, DashboardOverviewParams } from 'models';
 import {
   getOverViewReport,
   getReportDetailList,
@@ -42,7 +42,7 @@ export function useReportList(params?: ReportListParams, options?: any) {
   });
 }
 
-export function useOverViewReport(params?: ReportListParams, options?: any) {
+export function useOverViewReport(params?: DashboardOverviewParams, options?: any) {
   return useQuery({
     queryKey: ['overview-report', params],
     queryFn: () => getOverViewReport(params),

cope2n-fe/src/request/report.ts

@@ -7,6 +7,7 @@ import {
   ReportDetailListParams,
   ReportListParams,
   ReportListType,
+  DashboardOverviewParams,
 } from 'models';
 import { API } from './api';
 
@@ -68,14 +69,11 @@ export async function getReportList(params?: ReportListParams) {
   }
 }
 
-export async function getOverViewReport(params?: ReportListParams) {
+export async function getOverViewReport(params?: DashboardOverviewParams) {
   try {
     const response = await API.get<OverViewDataResponse>('/ctel/overview/', {
       params: {
-        page: params?.page,
-        page_size: params?.page_size,
-        start_date: params?.start_date,
-        end_date: params?.end_date,
+        duration: params?.duration,
         subsidiary: params?.subsidiary,
       },
     });
@@ -104,8 +102,6 @@ export async function downloadReport(report_id: string) {
     const file = new Blob([response.data], {
       type: 'application/vnd.ms-excel',
     });
-    // const fileURL = URL.createObjectURL(file);
-    // window.open(fileURL);
     return {
       file: file,
       filename: filename,