project/chuhai-payment-frontend
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:sort is now available

Browse Source
This commit is contained in:
LittleBoy 2024-07-28 18:50:47 +08:00
parent b4062b1a08
commit 895c032532
3 changed files with 32 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
src/components/bill/search-form.tsx
View File

@ -21,6 +21,7 @@ type SearchFormFields = {
payment_channel?: string;
bill_status?: string;
apply_status?: string;
sort_by?: string;
}
const SearchForm: React.FC<SearchFormProps> = (props) => {
const formSubmit = (value: SearchFormFields) => {
@ -54,6 +55,12 @@ const SearchForm: React.FC<SearchFormProps> = (props) => {
if (value.payment_channel) {
params.payment_channel = value.payment_channel;
}
// 排序
if(value.sort_by){
const [field, order] = value.sort_by.split(' ')
params.sort_field = field
params.sort_order = order?.toUpperCase() || 'DESC'
}
props.onSearch?.(params);
}
const {t, i18n} = useTranslation();
@ -102,14 +109,14 @@ const SearchForm: React.FC<SearchFormProps> = (props) => {
</Form.Select>
</Col>
<Col xxl={6} xl={6} md={8}>
<Form.Select showClear field="payment_channel" label={t('bill.title_pay_sort')}
<Form.Select showClear field="sort_by" label={t('bill.title_pay_sort')}
placeholder={t('base.please_select')} style={{width: '100%'}}>
<Form.Select.Option value="id desc">ID {t('bill.sort_desc')}</Form.Select.Option>
<Form.Select.Option value="id asc">ID {t('bill.sort_asc')}</Form.Select.Option>
<Form.Select.Option value="student_number desc">{t('base.student_number')} {t('bill.sort_desc')}</Form.Select.Option>
<Form.Select.Option value="student_number asc">{t('base.student_number')} {t('bill.sort_asc')}</Form.Select.Option>
<Form.Select.Option value="bill_number desc">{t('base.bill_number')} {t('bill.sort_desc')}</Form.Select.Option>
<Form.Select.Option value="bill_number asc">{t('base.bill_number')} {t('bill.sort_asc')}</Form.Select.Option>
<Form.Select.Option value="application_number desc">{t('base.bill_number')} {t('bill.sort_desc')}</Form.Select.Option>
<Form.Select.Option value="application_number asc">{t('base.bill_number')} {t('bill.sort_asc')}</Form.Select.Option>
<Form.Select.Option value="paid_at desc">{t('bill.title_paid_at')} {t('bill.sort_desc')}</Form.Select.Option>
<Form.Select.Option value="paid_at asc">{t('bill.title_paid_at')} {t('bill.sort_asc')}</Form.Select.Option>

38
src/pages/bill/query.tsx
View File

@ -25,18 +25,16 @@ const DownloadButton = ({bill, text}: { bill: BillModel; text: string }) => {
// }
const BillQuery = () => {
const {user} = useAuth();
const [state, setState] = useSetState<{
updateBill?: BillModel
updateLoading?: boolean
confirmBill?: BillModel
}>({})
const [showBill, setShowBill] = useState<BillModel>()
const [queryParams, setBillQueryParams] = useState<BillQueryParams>({});
const {data, loading, refresh} = useRequest(() => billList({
...queryParams,
department: user?.department == 'RO' ? 'RO' : 'FO',
}), {
const [queryParams, setBillQueryParams] = useState<BillQueryParams>({
sort_field: 'id', sort_order: 'DESC'
});
const {data, loading, refresh} = useRequest(() => billList(queryParams), {
refreshDeps: [queryParams],
onError: (e) => {
Notification.error({title: 'Error', content: e.message})
@ -156,21 +154,23 @@ const BillQuery = () => {
>
{state.confirmBill && <>
<div><BillDetailItems bill={state.confirmBill}/></div>
<div className="confirm-container" style={{padding:'15px 0'}}>
<div className="confirm-container" style={{padding: '15px 0'}}>
{
state.confirmBill.details.map((it, idx) => (<div key={idx} className="confirm-item align-center space-between">
<Space spacing={10}>
<span>{it.id}.</span>
<span>{it.bill_type}</span>
<div>
<MoneyFormat money={it.amount}/>
</div>
</Space>
<div className="confirm-item-btn">
{!!it.confirm_status ? <Tag color='light-blue'>CONFIRMED</Tag>:<Button>{t('base.confirm')}</Button>}
state.confirmBill.details.map((it, idx) => (
<div key={idx} className="confirm-item align-center space-between">
<Space spacing={10}>
<span>{it.id}.</span>
<span>{it.bill_type}</span>
<div>
<MoneyFormat money={it.amount}/>
</div>
</Space>
<div className="confirm-item-btn">
{!!it.confirm_status ? <Tag color='light-blue'>CONFIRMED</Tag> :
<Button>{t('base.confirm')}</Button>}
</div>
</div>))
</div>
</div>))
}
</div>
</>}

3
src/types/bill.d.ts vendored
View File

@ -15,6 +15,7 @@ declare type BillDetail = {
confirm_status?: number;
amount: decimal;
}
declare type SortOrderType = 'ASC'|'DESC' | string;
/**
* 账单查询参数
*/
@ -30,6 +31,8 @@ declare type BillQueryParam = {
start_date:string;
end_date:string;
department:string;
sort_field:string;
sort_order:SortOrderType;
}
/**
* 账单模型