diff --git a/src/pages/reimbursement/mine/MyReimbursement.tsx b/src/pages/reimbursement/mine/MyReimbursement.tsx index e025809..cb67d1c 100644 --- a/src/pages/reimbursement/mine/MyReimbursement.tsx +++ b/src/pages/reimbursement/mine/MyReimbursement.tsx @@ -1,34 +1,86 @@ import { DownOutlined } from '@ant-design/icons'; import type { ProColumns } from '@ant-design/pro-components'; import { ProTable } from '@ant-design/pro-components'; -import { Button } from 'antd'; +import {Button, Dropdown, Input, Space, Typography} from 'antd'; +import React from "react"; +import Search from "antd/es/input/Search"; const valueEnum = { - 0: 'close', - 1: 'running', - 2: 'online', - 3: 'error', + 0: 'success', + 1: 'wait1', + 2: 'wait2', + 3: 'wait3', + 4: 'wait4', + 5: 'failure' }; export type TableListItem = { id:string; kind: string; - invoiceKind: string; + amount: number; status: string; department: string; - submitDateTime: string; + submitDateTime: number; + detail: string; }; const tableListDataSource: TableListItem[] = [ + { id:"123", kind: "string", - invoiceKind: "string", - amount: 1234, - status: "string", + amount: 1200.0, + status: valueEnum[5], department: "string", - submitDateTime: "string", - } + submitDateTime: Date.now()-100000000, + detail: "查看详情", + }, + { + id:"123", + kind: "string", + detail: "查看详情", + amount: 1200.0, + status: valueEnum[4], + department: "string", + submitDateTime: Date.now()-100000000, + }, + + { + id:"123", + kind: "string", + detail: "查看详情", + amount: 1200.0, + status: valueEnum[3], + department: "string", + submitDateTime: Date.now()-100000000, + }, + { + id:"123", + kind: "string", + detail: "查看详情", + amount: 500, + status: valueEnum[2], + department: "string", + submitDateTime: Date.now(), + }, + { + id:"123", + kind: "string", + detail: "查看详情", + amount: 1200.0, + status: valueEnum[1], + department: "string", + submitDateTime: Date.now()-100000000, + }, + { + id:"123", + kind: "string", + detail: "查看详情", + amount: 1200.0, + status: valueEnum[0], + department: "string", + submitDateTime: Date.now()-100000000, + }, ]; @@ -37,43 +89,64 @@ const columns: ProColumns[] = [ title: '报销单号', width: 80, dataIndex: 'id', - render: (_) => {_}, + search:false, + //render: (_) => {_}, }, { - title: '申请事由', + title: '报销类型', width: 80, dataIndex: 'kind', - render: (_) => {_}, - }, - { - title: '发票类型', - width: 80, - dataIndex: 'invoiceKind', - render: (_) => {_}, + search:false, + //render: (_) => {_}, }, { title: '金额', width: 80, dataIndex: 'amount', - render: (_) => {_}, + search:false, + //render: (_) => {_}, sorter:(a,b)=> a.amount - b.amount }, { title: '状态', width: 80, dataIndex: 'status', - render: (_) => {_}, + filters: true, + onFilter: true, + search:false, + valueEnum: { + wait1: { text: '待主管审批', status: 'Processing' }, + wait2: { text: '待财务审批', status: 'Processing' }, + wait3: { text: '待财务主管审批', status: 'Processing' }, + wait4: { text: '待总经理审批', status: 'Processing' }, + success: { text: '已报销', status: 'Success' }, + failure: { text: '审批未通过', status: 'Error' }, + }, + + //render: (_) => {_}, }, { title: '申请部门', width: 80, + search:false, dataIndex: 'department', - render: (_) => {_}, + //render: (_) => {_}, }, { title: '申请时间', width: 80, dataIndex: 'submitDateTime', + valueType: 'dateTime', + search:false, + sorter:(a,b)=> a.submitDateTime-b.submitDateTime + //render: (_) => {_}, + }, + + { + title: '申请详情', + width: 80, + dataIndex: 'detail', + search:false, render: (_) => {_}, }, ]; @@ -92,32 +165,62 @@ function makeTable() { }} rowKey="key" pagination={{ + pageSize:5, showQuickJumper: true, }} + // toolbar={{ + // title: '这里是标题', + // subTitle: '这里是子标题', + // tooltip: '这是一个段描述', + // search: { + // onSearch: (value: string) => { + // alert(value); + // }, + // }, + // }} search={{ - optionRender: false, - collapsed: false, + defaultCollapsed: false, + labelWidth: 'auto', + resetText:" ", + optionRender: ({ searchText }, { form }) => { + // console.log(searchConfig, formProps, dom) + return [ + { + + }} + style={{width: 304,marginLeft:-30}} + enterButton + + />, + + ] + } }} dateFormatter="string" - headerTitle="表格标题" - toolBarRender={() => [ - , - , - , - ]} + // toolBarRender={() => [ + // , + // , + // , + // ]} /> ); }; function MyReimbursement() { return( -
我的报销 + <> {makeTable()} -
+ ) } export default MyReimbursement \ No newline at end of file