fix: 资金流水记录
This commit is contained in:
10
apps/web-antd/src/views/finance/fund-water/api/index.ts
Normal file
10
apps/web-antd/src/views/finance/fund-water/api/index.ts
Normal file
@@ -0,0 +1,10 @@
|
||||
import { requestClient } from '#/api/request';
|
||||
|
||||
const prefix = 'fund-water/';
|
||||
/**
|
||||
* 资金流水记录
|
||||
* @param data
|
||||
*/
|
||||
export async function getFundWaterListApi(data: any) {
|
||||
return requestClient.get<any>(`${prefix}list`, { params: data });
|
||||
}
|
||||
29
apps/web-antd/src/views/finance/fund-water/config/search.ts
Normal file
29
apps/web-antd/src/views/finance/fund-water/config/search.ts
Normal file
@@ -0,0 +1,29 @@
|
||||
import type { VbenFormProps } from '#/adapter/form';
|
||||
|
||||
import dayjs from 'dayjs';
|
||||
|
||||
export const formOptions: VbenFormProps = {
|
||||
// 默认展开
|
||||
collapsed: false,
|
||||
schema: [
|
||||
{
|
||||
component: 'RangePicker',
|
||||
componentProps: {
|
||||
format: 'YYYY-MM-DD', // 确保格式与你需要的一致
|
||||
},
|
||||
defaultValue: [dayjs().startOf('month'), dayjs()],
|
||||
fieldName: 'search_time',
|
||||
label: '时间范围',
|
||||
},
|
||||
],
|
||||
// 控制表单是否显示折叠按钮
|
||||
showCollapseButton: true,
|
||||
submitButtonOptions: {
|
||||
content: '查询',
|
||||
},
|
||||
// 是否在字段值改变时提交表单
|
||||
// submitOnChange: true,
|
||||
// submitOnChange: true,
|
||||
// 按下回车时是否提交表单
|
||||
submitOnEnter: true,
|
||||
};
|
||||
81
apps/web-antd/src/views/finance/fund-water/config/table.ts
Normal file
81
apps/web-antd/src/views/finance/fund-water/config/table.ts
Normal file
@@ -0,0 +1,81 @@
|
||||
import type { VxeGridProps } from '#/adapter/vxe-table';
|
||||
|
||||
import { getFundWaterListApi } from '../api';
|
||||
|
||||
interface RowType {
|
||||
id: string;
|
||||
name: string;
|
||||
logo: string;
|
||||
introduce: string;
|
||||
created_at: string;
|
||||
}
|
||||
|
||||
export const gridOptions: VxeGridProps<RowType> = {
|
||||
checkboxConfig: {
|
||||
highlight: true,
|
||||
labelField: '',
|
||||
},
|
||||
columns: [
|
||||
{ field: 'id', align: 'left', title: 'ID' },
|
||||
{ field: 'store.name', title: '诊所' },
|
||||
{ field: 'doctor_info.name', title: '医生' },
|
||||
{ field: 'price', title: '金额' },
|
||||
{ field: 'order_type', title: '订单类型', slots: { default: 'order-type' } },
|
||||
{ field: 'type', title: '流水类型', slots: { default: 'type' } },
|
||||
{ field: 'created_at', title: '记录时间' },
|
||||
{
|
||||
type: 'html',
|
||||
title: '操作',
|
||||
align: 'right',
|
||||
slots: { default: 'action' },
|
||||
width: 200,
|
||||
},
|
||||
],
|
||||
keepSource: true,
|
||||
pagerConfig: {},
|
||||
columnConfig: {
|
||||
useKey: true,
|
||||
},
|
||||
rowConfig: {
|
||||
useKey: true,
|
||||
},
|
||||
// scrollY: {
|
||||
// enabled: true,
|
||||
// gt: 0,
|
||||
// },
|
||||
proxyConfig: {
|
||||
ajax: {
|
||||
// 请求后端接口方法
|
||||
query: async ({ page }, formValues) => {
|
||||
return await getFundWaterListApi({
|
||||
page: page.currentPage,
|
||||
pageSize: page.pageSize,
|
||||
...formValues,
|
||||
});
|
||||
},
|
||||
},
|
||||
},
|
||||
height: 'auto',
|
||||
border: false,
|
||||
toolbarConfig: {
|
||||
// 是否显示搜索表单控制按钮
|
||||
// @ts-ignore 正式环境时有完整的类型声明
|
||||
search: true,
|
||||
refresh: true, // 刷新
|
||||
print: false, // 打印
|
||||
export: false, // 导出
|
||||
// custom: true, // 自定义列
|
||||
zoom: true, // 最大化最小化
|
||||
slots: {
|
||||
buttons: 'toolbar-buttons',
|
||||
},
|
||||
custom: {
|
||||
// 自定义列-图标
|
||||
icon: 'vxe-icon-menu',
|
||||
},
|
||||
},
|
||||
expandConfig: {
|
||||
// expandAll: true,
|
||||
},
|
||||
showOverflow: false,
|
||||
};
|
||||
99
apps/web-antd/src/views/finance/fund-water/index.vue
Normal file
99
apps/web-antd/src/views/finance/fund-water/index.vue
Normal file
@@ -0,0 +1,99 @@
|
||||
<script lang="ts" setup>
|
||||
import type { VxeGridListeners } from '#/adapter/vxe-table';
|
||||
|
||||
import { ref } from 'vue';
|
||||
|
||||
import { Page } from '@vben/common-ui';
|
||||
|
||||
import { Button, Tag } from 'ant-design-vue';
|
||||
|
||||
import { useVbenVxeGrid } from '#/adapter/vxe-table';
|
||||
import { TableAction } from '#/components/table-action';
|
||||
|
||||
import { formOptions } from './config/search';
|
||||
import { gridOptions } from './config/table';
|
||||
import DetailModal from '#/views/business/order/product-order/components/detail.vue';
|
||||
import { getChargeCashPayRecordListApi } from '#/views/finance/charge-cash-pay-record/api';
|
||||
import StatisticsReconciliation from "#/views/finance/reconciliation/components/statistics.vue";
|
||||
|
||||
const [Grid, gridApi] = useVbenVxeGrid({
|
||||
formOptions,
|
||||
gridOptions,
|
||||
});
|
||||
|
||||
const statistics = ref();
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<Page auto-content-height title="订单管理">
|
||||
<StatisticsReconciliation
|
||||
v-if="statistics"
|
||||
:statistics="statistics"
|
||||
/>
|
||||
<Grid>
|
||||
<template #toolbar-buttons>
|
||||
<TableAction
|
||||
:actions="[]"
|
||||
:drop-down-actions="[]"
|
||||
>
|
||||
<template #more>
|
||||
<Button style="margin-left: 16px">
|
||||
批量操作
|
||||
<Icon icon="ant-design:down-outlined" />
|
||||
</Button>
|
||||
</template>
|
||||
</TableAction>
|
||||
</template>
|
||||
<template #order-type="{ row }">
|
||||
<div class="mt-3">
|
||||
<Tag v-if="row.order_type === 1" color="purple">产品订单</Tag>
|
||||
<Tag v-else-if="row.order_type === 2" color="green">挂号订单</Tag>
|
||||
<Tag v-else-if="row.order_type === 3" color="blue">问诊订单</Tag>
|
||||
</div>
|
||||
</template>
|
||||
<template #type="{ row }">
|
||||
<div class="mt-3">
|
||||
<Tag v-if="row.type === 'refund'" color="purple">出账</Tag>
|
||||
<Tag v-else-if="row.type === 'enter'" color="green">入账</Tag>
|
||||
<Tag v-else-if="row.type === 'withdraw'" color="orange">提现</Tag>
|
||||
</div>
|
||||
</template>
|
||||
<template #toolbar-tools></template>
|
||||
<template #action="{ row }">
|
||||
<TableAction
|
||||
:actions="[]"
|
||||
/>
|
||||
</template>
|
||||
</Grid>
|
||||
</Page>
|
||||
</template>
|
||||
<style scoped lang="scss">
|
||||
.custom-list {
|
||||
list-style-type: none;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
.custom-list-item {
|
||||
background-color: rgba(64, 158, 255, 0.04);
|
||||
border-radius: 4px;
|
||||
margin-bottom: 8px;
|
||||
padding: 8px 12px;
|
||||
font-size: 14px;
|
||||
transition: background-color 0.3s;
|
||||
|
||||
&:hover {
|
||||
background-color: rgba(64, 158, 255, 0.1);
|
||||
}
|
||||
|
||||
&::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 6px;
|
||||
height: 6px;
|
||||
background-color: #409eff;
|
||||
border-radius: 50%;
|
||||
margin-right: 8px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user