fix(): 修改布局
This commit is contained in:
@@ -58,40 +58,57 @@ const FinanceTransactionLogs: React.FC = () => {
|
||||
|
||||
return (
|
||||
<Card bordered={false} title={<Typography.Title level={4} style={{ margin: 0 }}>用户流水</Typography.Title>}>
|
||||
<Form form={form} layout="inline" onFinish={() => fetchList(1, size)} style={{ marginBottom: 12 }}>
|
||||
<Form.Item name="user_id" label="用户id">
|
||||
<Input allowClear placeholder="用户id" style={{ width: 180 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="order_id" label="订单id">
|
||||
<Input allowClear placeholder="订单id" style={{ width: 180 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="type" label="流水类型">
|
||||
<Select allowClear placeholder="recharge/refund/consume" style={{ width: 200 }}
|
||||
options={[
|
||||
{ label: 'recharge', value: 'recharge' },
|
||||
{ label: 'refund', value: 'refund' },
|
||||
{ label: 'consume', value: 'consume' },
|
||||
]}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item name="status" label="状态">
|
||||
<Select allowClear placeholder="success/failed/pending" style={{ width: 200 }}
|
||||
options={[
|
||||
{ label: 'success', value: 'success' },
|
||||
{ label: 'failed', value: 'failed' },
|
||||
{ label: 'pending', value: 'pending' },
|
||||
]}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item name="range" label="时间范围">
|
||||
<DatePicker.RangePicker />
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Space>
|
||||
<Button type="primary" htmlType="submit" onClick={() => { setPage(1); }}>查询</Button>
|
||||
<Button onClick={() => { form.resetFields(); fetchList(1, size); setPage(1); }}>重置</Button>
|
||||
</Space>
|
||||
</Form.Item>
|
||||
<Form
|
||||
form={form}
|
||||
onFinish={() => fetchList(1, size)}
|
||||
style={{ marginBottom: 20 }}
|
||||
>
|
||||
<div style={{ display: 'flex', flexDirection: 'column', gap: '16px' }}>
|
||||
{/* 第一行:用户ID、订单编号、流水类型、状态、时间范围 */}
|
||||
<div style={{ display: 'flex', gap: '16px', flexWrap: 'wrap', alignItems: 'center' }}>
|
||||
<Form.Item name="user_id" label="用户PID:" style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<Input allowClear placeholder="用户ID" style={{ width: 200 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="order_id" label="订单编号:" style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<Input allowClear placeholder="订单编号" style={{ width: 200 }} />
|
||||
</Form.Item>
|
||||
<Form.Item name="type" label="流水类型:" style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<Select allowClear placeholder="充值/退款/消费" style={{ width: 220 }}
|
||||
options={[
|
||||
{ label: 'recharge', value: 'recharge' },
|
||||
{ label: 'refund', value: 'refund' },
|
||||
{ label: 'consume', value: 'consume' },
|
||||
]}
|
||||
/>
|
||||
</Form.Item>
|
||||
<Form.Item name="status" label="状态:" style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<Select allowClear placeholder="成功/失败/待定" style={{ width: 220 }}
|
||||
options={[
|
||||
{ label: 'success', value: 'success' },
|
||||
{ label: 'failed', value: 'failed' },
|
||||
{ label: 'pending', value: 'pending' },
|
||||
]}
|
||||
/>
|
||||
</Form.Item>
|
||||
</div>
|
||||
|
||||
{/* 第二行:时间范围和按钮 */}
|
||||
<div style={{ display: 'flex', gap: '16px', alignItems: 'center', flexWrap: 'wrap' }}>
|
||||
<Form.Item name="range" label="时间范围:" style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<DatePicker.RangePicker style={{ width: 300 }} />
|
||||
</Form.Item>
|
||||
<Form.Item style={{ margin: 0, flex: '0 0 auto' }}>
|
||||
<Space size="middle">
|
||||
<Button type="primary" htmlType="submit" onClick={() => { setPage(1); }} size="middle">
|
||||
查 询
|
||||
</Button>
|
||||
<Button onClick={() => { form.resetFields(); fetchList(1, size); setPage(1); }} size="middle">
|
||||
重 置
|
||||
</Button>
|
||||
</Space>
|
||||
</Form.Item>
|
||||
</div>
|
||||
</div>
|
||||
</Form>
|
||||
<Table
|
||||
rowKey={(r) => r.id || r.transaction_id}
|
||||
|
||||
Reference in New Issue
Block a user