我的报销：接口待测试

src/models/Staff.ts

@@ -125,17 +125,34 @@ export class InvoiceCommit {
     }
 }
 export interface Reimbursement {
-    reimbursementActualAmount:       number;
+    /**
-    reimbursementBillingTime:        string;
+     * 差旅补助金额
-    reimbursementId:                 number;
+     */
-    reimbursementKindId:             string;
+    reimbursementAdditionalAmount:      number;
-    reimbursementNote:               string;
+    reimbursementDepartureInvoiceId:    number;
+    reimbursementDepartureName:         string;
+    reimbursementDestinationInvoiceId?: number;
+    reimbursementDestinationName:       string;
+    reimbursementId:                    number;
+    /**
+     * 发票金额
+     */
+    reimbursementInvoiceAmount: number;
+    reimbursementNote?:         string;
+    /**
+     * 0: success
+     * 1: 待主管审批
+     * 2: 待财务审批
+     * 3: 待财务主管审批
+     * 4: 待总经理审批
+     * 5: 未通过
+     */
+    reimbursementStatus:             number;
     reimbursementSubmitDepartmentId: number;
     reimbursementSubmitStaffId:      string;
     reimbursementSubmitTime:         string;
-    approvalOpinion:                 string;
+    /**
-    approvalResult:                  number;
+     * 单位为天
-    approvalStaffId:                 string;
+     */
-    approvalStaffName:               string;
+    reimbursementTripDuration: number;
-    processOrder:                    number;
 }

src/pages/reimbursement/mine/MyReimbursement.tsx

@@ -1,4 +1,4 @@
-import {DownOutlined,ExclamationCircleOutlined} from '@ant-design/icons';
+import {DownOutlined, ExclamationCircleOutlined} from '@ant-design/icons';
 import type {ActionType, ProColumns, ProFormInstance} from '@ant-design/pro-components';
 import {ProTable} from '@ant-design/pro-components';
 import {Button, Dropdown, Input, Popover, Space, Typography} from 'antd';
@@ -8,6 +8,7 @@ import axiosInstance from "../../../utils/axiosInstance";
 import {FormProps} from "antd/es/form/Form";
 import {FormInstance} from "antd/es/form";
 import {SortOrder} from "antd/es/table/interface";
+import {Reimbursement} from "../../../models/Staff";
 
 const valueEnum = {
     0: 'success',
@@ -22,7 +23,7 @@ export type Department = {
     departmentName: string;
 }
 export type TableListItem = {
-    id: string;
+    id: number;
     beginDate: number;
     duration: number;
     endDate: number;
@@ -35,30 +36,35 @@ export type TableListItem = {
     departmentId: number;
     submitDateTime: number;
     detail: string;
-    back:boolean;
+    back: boolean;
 };
 let fakeData: TableListItem[] = [];
-for (let i = 0; i < 94; i++)
+for (let i = 0; i < 94; i++) {
-    {
+    fakeData.push({
-        fakeData.push({
+        id: i + 1,
-                id: "AX2022-" + i.toString(),
+        beginDate: Date.UTC(2022, i % 11 + 1, i % 28 + 1),
-                beginDate: Date.UTC(2022, i % 11 + 1, i % 28 + 1),
+        endDate: Date.UTC(2022, i % 11 + 1, i % 28 + 1) + 1000 * 60 * 60 * 24 * i + 1,
-                endDate: Date.UTC(2022, i % 11 + 1, i % 28 + 1) + 1000 * 60 * 60 * 24 * i + 1,
+        duration: Math.ceil(Math.abs(1000 * 60 * 60 * 24 * i + 1) / 1000 / 60 / 60 / 24),
-                duration: Math.ceil(Math.abs(1000 * 60 * 60 * 24 * i + 1) / 1000 / 60 / 60 / 24),
+        detail: "查看详情",
-                detail: "查看详情",
+        OD: ['上海', '北京'],
-                OD: ['上海', '北京'],
+        amount: i + i * 100 + 20 + i / 100,
-                amount: i + i,
+        invoiceAmount: i * 100,
-                invoiceAmount: i,
+        additionalAmount: i + 20 + i / 100,
-                additionalAmount: i,
+        status: (i % 6),
-                status: (i%6),
+        departmentId: i % 3 + 1,
-                departmentId: i%3+1,
+        submitDateTime: Date.now() - 100000000,
-                submitDateTime: Date.now() - 100000000,
+        back: (i & 1) === 1,
-                back:(i&1)===1,
+    })
-            })
+}
-    }
-
-
 
+const statusEnum = {
+    0: {text: '已报销', status: 'Success'},
+    1: {text: '待主管审批', status: 'Processing'},
+    2: {text: '待财务审批', status: 'Processing'},
+    3: {text: '待财务主管审批', status: 'Processing'},
+    4: {text: '待总经理审批', status: 'Warning'},
+    5: {text: '审批未通过', status: 'Error'},
+}
 class Subpage extends React.Component<any, any> {
     tableAction = React.createRef<ActionType>();
 
@@ -69,14 +75,16 @@ class Subpage extends React.Component<any, any> {
         }
         this.pullDepartment()
     }
+
     department = new Map<number, string>()
 
     columns: ProColumns<TableListItem>[] = [
         {
             title: '报销单号',
-            width: 80,
+            width: 70,
             dataIndex: 'id',
             search: false,
+            sorter: true,
             //render: (_) => <a>{_}</a>,
         },
         {
@@ -84,11 +92,11 @@ class Subpage extends React.Component<any, any> {
             width: 80,
             dataIndex: 'OD',
             search: false,
-            render: (_, row) => <>{row.OD[0] + (row.back?"⇌":"→") + row.OD[1]}</>,
+            render: (_, row) => <>{row.OD[0] + (row.back ? " ⇌ " : " → ") + row.OD[1]}</>,
         },
         {
             title: '出发日期',
-            width: 80,
+            width: 70,
             dataIndex: 'beginDate',
             search: false,
             valueType: 'date',
@@ -96,20 +104,22 @@ class Subpage extends React.Component<any, any> {
         },
         {
             title: '出差天数',
-            width: 80,
+            width: 50,
             dataIndex: 'duration',
             search: false,
+            sorter: true,
             //valueType: 'date',
             render: (_) => <>{_}天</>,
         },
         {
             title: '总金额',
-            width: 80,
+            width: 60,
             dataIndex: 'amount',
             search: false,
-            render: (_,item) =>
+            render: (_, item) =>
                 <>{item.amount.toFixed(2)}元
-                    <Popover  content={<>报销金额：{item.invoiceAmount.toFixed(2)}元<br/>补贴金额：{item.additionalAmount.toFixed(2)}元</>}>
+                    <Popover
+                        content={<>报销金额：{item.invoiceAmount.toFixed(2)}元<br/>补贴金额：{item.additionalAmount.toFixed(2)}元</>}>
                         <ExclamationCircleOutlined style={{marginLeft: 5}}/>
                     </Popover>
                 </>
@@ -120,17 +130,9 @@ class Subpage extends React.Component<any, any> {
             width: 80,
             dataIndex: 'status',
             filters: true,
-            onFilter: true,
+            onFilter: false,
             search: false,
-            valueEnum: {
+            valueEnum: statusEnum,
-                0: {text: '已报销', status: 'Success'},
-                1: {text: '待主管审批', status: 'Processing'},
-                2: {text: '待财务审批', status: 'Processing'},
-                3: {text: '待财务主管审批', status: 'Processing'},
-                4: {text: '待总经理审批', status: 'Warning'},
-                5: {text: '审批未通过', status: 'Error'},
-            },
-
             //render: (_) => <a>{_}</a>,
         },
         {
@@ -140,7 +142,7 @@ class Subpage extends React.Component<any, any> {
             dataIndex: 'departmentId',
             valueEnum: this.department,
             filters: true,
-            onFilter: true,
+            onFilter: false,
             //render: (_) => <a>{_}</a>,
         },
         {
@@ -149,19 +151,20 @@ class Subpage extends React.Component<any, any> {
             dataIndex: 'submitDateTime',
             valueType: 'dateTime',
             search: false,
+            sorter: true,
             //render: (_) => <a>{_}</a>,
         },
 
         {
             title: '申请详情',
-            width: 80,
+            width: 60,
             dataIndex: 'detail',
             search: false,
             render: (_, row, index, action) => [
                 <a
                     key="a"
                     onClick={() => {
-                        this.showDetail(row)
+                        this.showDetail(row.id)
                         this.tableAction.current?.reload()
                     }}
                 >
@@ -185,64 +188,90 @@ class Subpage extends React.Component<any, any> {
         alert("123")
     }
 
-    showDetail(row: TableListItem) {
+    showDetail(reimbursementId: number) {
         //TODO
-        alert((new Date(row.submitDateTime)))
+        alert(reimbursementId)
     }
 
-    converter(value: any) {
+    async getInvoiceDate(invoiceId: number | undefined) {
-        let result: TableListItem[] = []
+        //TODO
+        return Date.now()
+    }
 
+    async converter(value: Reimbursement[], pageSize: number | undefined) {
+        let result: TableListItem[] = []
+        for (let i = 0; i < value.length; i++) {
+            result.push({
+                id: value[i].reimbursementId,
+                beginDate: await this.getInvoiceDate(value[i].reimbursementDepartureInvoiceId),
+                endDate: await this.getInvoiceDate(value[i].reimbursementDestinationInvoiceId),
+                duration: value[i].reimbursementTripDuration,
+                OD: [value[i].reimbursementDepartureName, value[i].reimbursementDestinationName],
+                amount: value[i].reimbursementInvoiceAmount + value[i].reimbursementAdditionalAmount,
+                invoiceAmount: value[i].reimbursementInvoiceAmount,
+                additionalAmount: value[i].reimbursementAdditionalAmount,
+                status: value[i].reimbursementStatus % 6,
+                departmentId: value[i].reimbursementSubmitDepartmentId,
+                submitDateTime: (new Date(value[i].reimbursementSubmitTime)).getTime(),
+                detail: "查看详情",
+                back: value[i].reimbursementDestinationInvoiceId !== undefined,
+            })
+        }
         return result
     }
 
     pullDepartment() {
         this.department.clear()
         axiosInstance.get('common/department').then(response => {
-            console.log(response.data)
             response.data.forEach((value: any) => {
                     this.department.set(value.departmentId, value.departmentName)
                 }
             )
-            console.log(this.department)
+            this.tableAction.current?.reload()
-            // @ts-ignore
-            this.tableAction.current?.reset()
         })
 
     }
 
-    updateRequest(current: number | undefined, pageSize: number | undefined, sort: Record<string, SortOrder>, filter: Record<string, React.ReactText[] | null>) {
+    async updateRequest(current: number | undefined, pageSize: number | undefined, sort: Record<string, SortOrder>, filter: Record<string, React.ReactText[] | null>) {
         let tableListDataSource: TableListItem[] = []
         let totalRecordLength = 0
+        console.log(filter)
+        console.log(sort)
         if (this.state.searchWord.trim() === "") {
             current = (current === undefined ? 0 : current)
             pageSize = (pageSize === undefined ? 5 : pageSize)
-            let params = {
+            let params:any= {
                 current: current,
-                pageSize: pageSize
+                pageSize: pageSize,
             }
-            axiosInstance.get('common/reimbursement', {
+            if(filter.status !== undefined && filter.status !== null && filter.status.length !== 0){
-                params: params
+                params['reimbursementStatuses'] = filter.status
-            }).then(response => {
+            }
-                console.log(response.data)
+            if(filter.departmentId !== undefined && filter.departmentId !== null && filter.departmentId.length !== 0){
-                tableListDataSource = this.converter(response.data.records)
+                params['reimbursementSubmitDepartments'] = filter.departmentId
-                totalRecordLength = response.data.total
+            }
-            }).catch(function (error) {
+            if(sort.id !== undefined && sort.id !== null){
-                console.log(error)
+                params['sortBy']="reimbursementId"
-            })
+                params['asc'] = (sort.id === "ascend")
-
+            }
-            tableListDataSource = fakeData.slice(pageSize * current - pageSize, pageSize * current)
+            if(sort.duration !== undefined && sort.duration !== null){
-            totalRecordLength = fakeData.length
+                params['sortBy']="reimbursementTripDuration"
+                params['asc'] = (sort.duration === "ascend")
+            }
+            if(sort.submitDateTime !== undefined && sort.submitDateTime !== null){
+                params['sortBy']="reimbursementSubmitTime"
+                params['asc'] = (sort.submitDateTime === "ascend")
+            }
+            console.log(params)
+            let response = await axiosInstance.get('common/reimbursement', {params: params})
+            tableListDataSource =await this.converter(response.data.records, pageSize)
+            console.log(response.data.records)
+            totalRecordLength = response.data.total
 
         } else {
-            axiosInstance.get('common/reimbursement/' + this.state.searchWord.trim(), {}).then(response => {
+            let response = await axiosInstance.get('common/reimbursement/' + this.state.searchWord.trim(), {})
-                console.log(response.data)
+            tableListDataSource =await this.converter(response.data.records, pageSize)
-                tableListDataSource = this.converter(response.data.records)
+            totalRecordLength = tableListDataSource.length
-                totalRecordLength = tableListDataSource.length
-            }).catch(function (error) {
-                console.log(error)
-            })
-
         }
 
         return Promise.resolve({