✨ confirm
This commit is contained in:
parent
034d767647
commit
f9761015c3
@ -11,9 +11,10 @@ import './bill.less'
|
||||
type BillListProps = {
|
||||
type: 'query' | 'reconciliation';
|
||||
operationRender?: (record: BillModel) => React.ReactNode;
|
||||
onRowSelection?: (selectedRowKeys?: (string | number)[]) => void;
|
||||
onRowSelection?: (selectedRowKeys: (string | number)[]) => void;
|
||||
source?: RecordList<BillModel>;
|
||||
onPageChange: () => void;
|
||||
onPageChange: (pageIndex:number) => void;
|
||||
tableFooter?: React.ReactNode;
|
||||
loading?: boolean;
|
||||
}
|
||||
|
||||
@ -93,6 +94,7 @@ export const BillList: React.FC<BillListProps> = (props) => {
|
||||
dataIndex: 'pay_amount',
|
||||
width: 150,
|
||||
render: (_, record) => {
|
||||
|
||||
if (record.service_charge && record.service_charge > 0) {
|
||||
return <div>
|
||||
<MoneyFormat money={record.payment_amount}/><br/>
|
||||
@ -101,7 +103,7 @@ export const BillList: React.FC<BillListProps> = (props) => {
|
||||
</Typography.Text>
|
||||
</div>
|
||||
}
|
||||
return (<div>HK$ {_}</div>)
|
||||
return (<div><MoneyFormat money={record.payment_amount}/></div>)
|
||||
},
|
||||
},
|
||||
{
|
||||
@ -114,16 +116,18 @@ export const BillList: React.FC<BillListProps> = (props) => {
|
||||
title: t('bill.title_pay_method'),
|
||||
dataIndex: 'pay_method',
|
||||
width: 120,
|
||||
render: (_, {payment_method, payment_channel}) => (<div>
|
||||
{payment_channel}<br/>
|
||||
<Typography.Text type={'quaternary'} size={'small'} style={{position: "absolute"}}>
|
||||
({payment_method})
|
||||
</Typography.Text>
|
||||
</div>),
|
||||
render: (_, {payment_method, payment_channel}) => (payment_channel?(
|
||||
<div>
|
||||
{payment_channel}<br/>
|
||||
<Typography.Text type={'quaternary'} size={'small'} style={{position: "absolute"}}>
|
||||
({payment_method})
|
||||
</Typography.Text>
|
||||
</div>
|
||||
):'N/A'),
|
||||
},
|
||||
{
|
||||
title: t('bill.title_bill_status'),
|
||||
dataIndex: 'bill_status',
|
||||
dataIndex: 'status',
|
||||
width: 150,
|
||||
// render: value => dayjs(value).format('YYYY-MM-DD'),
|
||||
},
|
||||
@ -141,7 +145,7 @@ export const BillList: React.FC<BillListProps> = (props) => {
|
||||
title: '',
|
||||
dataIndex: 'operate',
|
||||
fixed: 'right',
|
||||
width: 300,
|
||||
width: props.type == 'reconciliation'?120:300,
|
||||
render: (_, record) => props.operationRender?.(record),
|
||||
})
|
||||
}
|
||||
@ -177,12 +181,18 @@ export const BillList: React.FC<BillListProps> = (props) => {
|
||||
pageSize: props.source?.pagination.pageSize,
|
||||
total: props.source?.pagination.total,
|
||||
onPageChange: props.onPageChange,
|
||||
formatPageText: (params) => (
|
||||
<div className="bill-list-pagination">
|
||||
{props.tableFooter}
|
||||
<span>显示第 {params?.currentStart} 条 - 第 {params?.currentEnd} 条，共 {params?.total} 条</span>
|
||||
</div>
|
||||
)
|
||||
}}
|
||||
loading={props.loading}
|
||||
rowSelection={props.onRowSelection ? {
|
||||
fixed: true,
|
||||
onChange: (selectedRowKeys) => {
|
||||
props.onRowSelection?.(selectedRowKeys)
|
||||
selectedRowKeys && props.onRowSelection?.(selectedRowKeys)
|
||||
}
|
||||
} : undefined}
|
||||
/>
|
||||
|
||||
@ -66,7 +66,7 @@ const SearchForm: React.FC<SearchFormProps> = (props) => {
|
||||
<Form<SearchFormFields> onSubmit={formSubmit}>
|
||||
<Row type={'flex'} gutter={20}>
|
||||
<Col span={4}>
|
||||
<Form.DatePicker type={'dateRange'} field="dateRange" label='Transaction Date'
|
||||
<Form.DatePicker type={'dateRange'} field="dateRange" label={t('bill.bill_date')}
|
||||
style={{width: '100%'}}>
|
||||
</Form.DatePicker>
|
||||
</Col>
|
||||
|
||||
@ -7,7 +7,12 @@
|
||||
"student_number": "Student Number"
|
||||
},
|
||||
"bill": {
|
||||
"bill_date": "Date",
|
||||
"bill_number": "Bill Number",
|
||||
"confirm": "Confirm",
|
||||
"confirm_batch": "Batch Confirm",
|
||||
"confirm_select_empty": "Require confirm bill data",
|
||||
"confirmed": "Confirmed",
|
||||
"download_receipt": "Download receipt",
|
||||
"pay_status": "Bill Status",
|
||||
"pay_status_canceled": "Canceled",
|
||||
|
||||
@ -7,7 +7,12 @@
|
||||
"student_number": "学号"
|
||||
},
|
||||
"bill": {
|
||||
"bill_date": "日期",
|
||||
"bill_number": "账单编号",
|
||||
"confirm": "对账",
|
||||
"confirm_batch": "批量对账",
|
||||
"confirm_select_empty": "对账账单为空",
|
||||
"confirmed": "已对账",
|
||||
"download_receipt": "下载收据",
|
||||
"pay_status": "账单状态",
|
||||
"pay_status_canceled": "已作废",
|
||||
|
||||
@ -7,7 +7,12 @@
|
||||
"student_number": "学号"
|
||||
},
|
||||
"bill": {
|
||||
"bill_date": "日期",
|
||||
"bill_number": "账单编号",
|
||||
"confirm": "对账",
|
||||
"confirm_batch": "批量对账",
|
||||
"confirm_select_empty": "对账账单为空",
|
||||
"confirmed": "已对账",
|
||||
"download_receipt": "下载收据",
|
||||
"pay_status": "账单状态",
|
||||
"pay_status_canceled": "已作废",
|
||||
|
||||
@ -9,7 +9,6 @@ import {useRequest} from "ahooks";
|
||||
import {billList, BillQueryParams} from "@/service/api/bill.ts";
|
||||
|
||||
const BillQuery = () => {
|
||||
// const [data, ] = useState<RecordList<BillModel>>();
|
||||
const [showBill, setShowBill] = useState<BillModel>()
|
||||
const [queryParams, setBillQueryParams] = useState<BillQueryParams>({});
|
||||
const {data, loading} = useRequest(() => billList(queryParams), {
|
||||
|
||||
@ -1,23 +1,54 @@
|
||||
import {BillList} from "@/components/bill/list.tsx";
|
||||
import {useState} from "react";
|
||||
import SearchForm from "@/components/bill/search-form.tsx";
|
||||
import {TabPane, Tabs } from "@douyinfe/semi-ui";
|
||||
import {Button, Space, TabPane, Tabs,Notification} from "@douyinfe/semi-ui";
|
||||
import {billList, BillQueryParams} from "@/service/api/bill.ts";
|
||||
import {useRequest, useSetState} from "ahooks";
|
||||
import {useTranslation} from "react-i18next";
|
||||
import {useState} from "react";
|
||||
|
||||
const BillReconciliation = () => {
|
||||
const [data, ] = useState<RecordList<BillModel>>({
|
||||
list: [], pagination: {current: 0, pageSize: 0, total: 0}
|
||||
const {t} = useTranslation()
|
||||
const [queryParams, setBillQueryParams] = useSetState<BillQueryParams>({});
|
||||
const {data, loading} = useRequest(() => billList(queryParams), {
|
||||
refreshDeps: [queryParams]
|
||||
})
|
||||
const [selectKeys,setSelectedKeys] = useState<(string|number)[]>([])
|
||||
const confirmBill = (records: (string|number)[]) => {
|
||||
if(records.length == 0) {
|
||||
Notification.error({title:'Notice',content:t('bill.confirm_select_empty')})
|
||||
return
|
||||
}
|
||||
console.log(records)
|
||||
}
|
||||
const operation = (_record: BillModel) => {
|
||||
return (<Space>
|
||||
<Button onChange={() => confirmBill([_record.id])} size={'small'} theme={'solid'}
|
||||
type={'primary'}>{t('bill.confirm')}</Button>
|
||||
</Space>)
|
||||
}
|
||||
|
||||
return (<div>
|
||||
|
||||
<SearchForm searchHeader={<Tabs className={'no-border'}>
|
||||
<TabPane tab={<span>未对账</span>} itemKey="1" />
|
||||
<TabPane tab={<span>已对账</span>} itemKey="2" />
|
||||
</Tabs>} />
|
||||
<BillList source={data} type={'reconciliation'} onRowSelection={(keys) => {
|
||||
console.log('xxx', keys);
|
||||
}} onPageChange={function (): void {
|
||||
throw new Error("Function not implemented.");
|
||||
}} />
|
||||
<SearchForm searchHeader={(
|
||||
<Tabs className={'no-border'} onChange={(apply_status) => setBillQueryParams({apply_status})}>
|
||||
<TabPane tab={<span>{t('bill.reconciliation_status_pending')}</span>} itemKey="pending"/>
|
||||
<TabPane tab={<span>{t('bill.reconciliation_status_submitted')}</span>} itemKey="confirmed"/>
|
||||
</Tabs>
|
||||
)} loading={loading} onSearch={setBillQueryParams}/>
|
||||
<BillList
|
||||
source={data} type={'reconciliation'}
|
||||
operationRender={queryParams.apply_status == 'confirmed' ? undefined : operation}
|
||||
onRowSelection={queryParams.apply_status == 'confirmed' ? undefined : (keys: (number|string)[]) => {
|
||||
setSelectedKeys(keys);
|
||||
}}
|
||||
loading={loading}
|
||||
onPageChange={(page_number) => setBillQueryParams({page_number})}
|
||||
tableFooter={queryParams.apply_status == 'confirmed' ? undefined : (
|
||||
<Button style={{marginRight:10}} onClick={()=>confirmBill(selectKeys)}>
|
||||
{t('bill.confirm_batch')}
|
||||
</Button>
|
||||
)}
|
||||
/>
|
||||
</div>)
|
||||
}
|
||||
export default BillReconciliation
|
||||
Loading…
x
Reference in New Issue
Block a user