恢复代码

This commit is contained in:
2025-04-23 10:03:37 +08:00
parent 90c79c16cb
commit 70adbd0e1b
16 changed files with 2795 additions and 987 deletions
@@ -0,0 +1,325 @@
<template>
<ele-modal
:width="`80%`"
:visible="visible"
:confirm-loading="loading"
title="订单列表"
:body-style="{ paddingBottom: '8px', background: '#f3f3f3' }"
@update:visible="updateVisible"
:maskClosable="false"
:footer="null"
>
<a-card :bordered="false" :body-style="{ padding: '16px' }">
<ele-pro-table
ref="tableRef"
row-key="id"
:columns="columns"
:datasource="datasource"
:customRow="customRow"
:scroll="{ x: 800 }"
tool-class="ele-toolbar-form"
class="sys-org-table"
>
<template #toolbar>
<a-input v-model:value="keywords" allow-clear @input="reload" style="width: 300px;"
placeholder="姓名/手机号搜索"></a-input>
</template>
<template #bodyCell="{ column, record }">
<template v-if="column.key === 'image'">
<a-image :src="record.image" :width="50" />
</template>
<template v-if="column.key === 'dateTime'">
<div>{{ record.siteName }}</div>
<div>{{ record.dateTime }} ¥{{ record.totalPrice }}元</div>
</template>
<template v-if="column.key === 'payType'">
<template v-if="record.payStatus == 1">
<a-tag v-if="record.payType == 0">余额支付</a-tag>
<a-tag v-if="record.payType == 1">
<WechatOutlined class="tag-icon" />
微信支付
</a-tag>
<a-tag v-if="record.payType == 2">积分</a-tag>
<a-tag v-if="record.payType == 3">
<AlipayCircleOutlined class="tag-icon" />
支付宝
</a-tag>
<a-tag v-if="record.payType == 4">
<IdcardOutlined class="tag-icon" />
现金
</a-tag>
<a-tag v-if="record.payType == 5">
<IdcardOutlined class="tag-icon" />
POS机
</a-tag>
<a-tag v-if="record.payType == 6">
<IdcardOutlined class="tag-icon" />
VIP月卡
</a-tag>
<a-tag v-if="record.payType == 7">
<IdcardOutlined class="tag-icon" />
VIP年卡
</a-tag>
<a-tag v-if="record.payType == 8">
<IdcardOutlined class="tag-icon" />
VIP次卡
</a-tag>
<a-tag v-if="record.payType == 9">
<IdcardOutlined class="tag-icon" />
IC月卡
</a-tag>
<a-tag v-if="record.payType == 10">
<IdcardOutlined class="tag-icon" />
IC年卡
</a-tag>
<a-tag v-if="record.payType == 11">
<IdcardOutlined class="tag-icon" />
IC次卡
</a-tag>
<a-tag v-if="record.payType == 12">
<IdcardOutlined class="tag-icon" />
免费
</a-tag>
<a-tag v-if="record.payType == 13">
<IdcardOutlined class="tag-icon" />
VIP充值卡
</a-tag>
<a-tag v-if="record.payType == 14">
<IdcardOutlined class="tag-icon" />
IC充值卡
</a-tag>
<a-tag v-if="record.payType == 15">
<IdcardOutlined class="tag-icon" />
积分支付
</a-tag>
<a-tag v-if="record.payType == 16">
<IdcardOutlined class="tag-icon" />
VIP季卡
</a-tag>
<a-tag v-if="record.payType == 17">
<IdcardOutlined class="tag-icon" />
IC季卡
</a-tag>
</template>
<template v-else>
<span></span>
</template>
</template>
<template v-if="column.key === 'payStatus'">
<a-tag v-if="record.payStatus == 2" color="error">
<CloseOutlined class="tag-icon" />
未付款
</a-tag>
<a-tag v-if="record.payStatus == 1" color="green">
<CheckOutlined class="tag-icon" />
已付款
</a-tag>
<a-tag
v-if="record.payStatus == 3 || record.payStatus == 0"
color="cyan">
<CoffeeOutlined class="tag-icon" />
未付款,占场中
</a-tag>
</template>
<template v-if="column.key === 'orderInfo'">
{{ record.orderInfoList }}
</template>
<template v-if="column.key === 'status'">
<a-tag v-if="record.status === 0" color="green">显示</a-tag>
<a-tag v-if="record.status === 1" color="red">隐藏</a-tag>
</template>
<template v-if="column.key === 'code'">
<span v-if="record.card">{{ record.card.code }}</span>
<span v-if="record.thinkVip">{{ record.thinkVip.code }}</span>
</template>
<template v-if="column.key === 'expiredTime'">
<span v-if="record.card">{{ dayjs(record.card.expireTime * 1000).format("YYYY-MM-DD HH:mm:ss") }}</span>
<span v-if="record.thinkVip">{{ dayjs(record.thinkVip.expireTime * 1000).format("YYYY-MM-DD HH:mm:ss")
}}</span>
</template>
</template>
</ele-pro-table>
</a-card>
</ele-modal>
</template>
<script lang="ts" setup>
import { ref } from "vue";
import {
CheckOutlined,
CloseOutlined,
AlipayCircleOutlined
} from "@ant-design/icons-vue";
import { EleProTable, toDateString } from "ele-admin-pro";
import type {
DatasourceFunction,
ColumnItem
} from "ele-admin-pro/es/ele-pro-table/types";
import {
pageThinkOrder
} from "@/api/think/thinkOrder";
import type {
ThinkOrder,
ThinkOrderParam
} from "@/api/think/thinkOrder/model";
import { formatNumber } from "ele-admin-pro/es";
import dayjs from "dayjs";
const props = defineProps<{
// 弹窗是否打开
visible: boolean;
sid: number;
createTimeStart: number;
createTimeEnd: number;
payType: number[];
}>();
const emit = defineEmits<{
(e: "done"): void;
}>();
const updateVisible = (value: boolean) => {
emit("update:visible", value);
};
// 表格实例
const tableRef = ref<InstanceType<typeof EleProTable> | null>(null);
// 表格选中数据
const selection = ref<ThinkOrder[]>([]);
// 加载状态
const loading = ref(true);
const keywords = ref();
// 表格数据源
const datasource: DatasourceFunction = ({
page,
limit,
where,
orders,
filters
}) => {
if (filters) {
where.status = filters.status;
}
if (keywords.value) {
where.keywords = keywords.value;
}
where.payTypeList = props.payType.join();
where.payStatus = 1;
where.forAdmin = true;
where.sid = props.sid;
where.createTimeStart = props.createTimeStart;
where.createTimeEnd = props.createTimeEnd;
console.log(where, props.sid)
return pageThinkOrder({
...where,
...orders,
page,
limit
});
};
// 表格列配置
const columns = ref<ColumnItem[]>([
{
title: "场馆名称",
dataIndex: "siteName",
key: "iod",
width: 90
},
{
title: "下单时间",
dataIndex: "createTime",
align: "center",
customRender: ({ text }) => toDateString(text, "yyyy-MM-dd HH:mm:ss")
},
{
title: "手机号",
dataIndex: "phone",
key: "phone",
width: 120,
align: "center"
},
{
title: "实际转账单位/个人",
dataIndex: "name",
key: "name",
align: "center"
},
{
title: "价格",
dataIndex: "totalPrice",
key: "totalPrice",
align: "center",
sorter: true,
customRender: ({ text }) => `¥${formatNumber(text)}`
},
{
title: "积分",
dataIndex: "totalPrice",
key: "totalPrice",
align: "center",
sorter: true,
customRender: ({ text }) => `¥${formatNumber(text)}`
},
{
title: "支付方式",
dataIndex: "payType",
key: "payType",
align: "center"
},
{
title: "预付卡号",
key: "code",
align: "center"
},
{
title: "预付卡到期时间",
key: "expiredTime",
align: "center",
sorter: true
}
]);
/* 搜索 */
const reload = (where?: ThinkOrderParam) => {
selection.value = [];
tableRef?.value?.reload({ where: where });
};
/* 查询 */
const query = () => {
loading.value = true;
};
/* 自定义行属性 */
const customRow = (record: ThinkOrder) => {
return {
// 行点击事件
onClick: () => {
// console.log(record);
},
// 行双击事件
onDblclick: () => {
openEdit(record);
}
};
};
query();
</script>
<script lang="ts">
import * as MenuIcons from "@/layout/menu-icons";
export default {
name: "ThinkOrder",
components: MenuIcons
};
</script>
<style lang="less" scoped>
.tag-icon {
padding-right: 6px;
}
</style>
@@ -0,0 +1,98 @@
<!-- 搜索表单 -->
<template>
<div class="search">
<a-space class="flex items-center" :size="10" style="flex-wrap: wrap">
<a-range-picker
v-model:value="dateRange"
value-format="YYYY-MM-DD"
class="ele-fluid"
/>
<a-button @click="search" type="primary">搜索</a-button>
<a-button @click="reload">重置</a-button>
<a-button class="ele-btn-icon" :disabled="loading" @click="handleExport">
<template #icon>
<download-outlined />
</template>
<span>导出报表</span>
</a-button>
</a-space>
</div>
</template>
<script lang="ts" setup>
import useSearch from "@/utils/use-search";
import { ref, watch } from "vue";
import { ThinkOrderInfoParam } from "@/api/think/thinkOrderInfo/model";
import { messageLoading } from "ele-admin-pro";
import dayjs from "dayjs";
import { thinkOrderExportData } from "@/api/think/thinkOrder";
import { ThinkOrder, ThinkOrderParam } from "@/api/think/thinkOrder/model";
const props = withDefaults(
defineProps<{
// 选中的角色
selection?: [];
}>(),
{}
);
const emit = defineEmits<{
(e: "search", where?: ThinkOrderInfoParam): void;
(e: "reload"): void;
(e: "add"): void;
(e: "remove"): void;
(e: "advanced"): void;
}>();
// 表单数据
const { where, resetFields } = useSearch<ThinkOrderParam>({
sid: undefined,
siteName: undefined,
createTimeStart: undefined,
createTimeEnd: undefined,
timeStart: undefined,
timeEnd: undefined,
categoryId: undefined,
payStatus: undefined,
orderStatus: undefined,
payType: undefined,
isInvoice: undefined,
keywords: undefined
});
// 请求状态
const loading = ref(false);
// 日期范围选择
const dateRange = ref<[string, string]>([dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD 23:59:59')]);
const orders = ref<ThinkOrder[] | any[]>();
const xlsFileName = ref<string>();
/* 搜索 */
const search = () => {
const [d1, d2] = dateRange.value ?? [];
where.createTimeStart = d1 ? dayjs(d1).format('YYYY-MM-DD') : undefined;
where.createTimeEnd = d2 ? dayjs(d2).format('YYYY-MM-DD 23:59:59') : undefined;
emit("search", {
...where
});
};
/* 重置 */
const reload = () => {
dateRange.value = [dayjs().format('YYYY-MM-DD'), dayjs().format('YYYY-MM-DD')];
emit('reload')
};
// 导出
const handleExport = async () => {
const hide = messageLoading("导出中...", 0);
const res = await thinkOrderExportData(where);
hide();
window.open(res.url);
};
watch(
() => props.selection,
() => {
}
);
</script>
+285
View File
@@ -0,0 +1,285 @@
<template>
<div class="page">
<div class="ele-body">
<a-card :bordered="false" :body-style="{ padding: '16px' }">
<a-space style="margin-bottom: 1rem">
<a-button @click="changeType(0)" :type="type === 0 ? 'primary' : ''">收款汇总表</a-button>
<a-button @click="changeType(1)" :type="type === 1 ? 'primary' : ''">收入日报表及汇总表</a-button>
</a-space>
<a-spin :spinning="loading">
<search
@search="searchData"
@reload="reload"
/>
<a-table v-if="type === 0"
:scroll="{ y: tableHeight }"
:data-source="list"
:columns="columns"
:pagination="false"
/>
<a-table v-else
:scroll="{ y: tableHeight }"
:data-source="list"
:columns="columns1"
:pagination="false"
/>
</a-spin>
</a-card>
</div>
<OrderList v-model:visible="showList" v-if="showList" :pay-type="payTypeList" :sid="sid"
:create-time-start="createTimeStart"
:create-time-end="createTimeEnd" />
</div>
</template>
<script lang="ts" setup>
import { createVNode, ref } from "vue";
import type {
ColumnItem
} from "ele-admin-pro/es/ele-pro-table/types";
import Search from "./components/search.vue";
import {
getThinkOrderExcelData, getThinkOrderExcelDataForCard
} from "@/api/think/thinkOrder";
import type {
ThinkOrder, ThinkOrderParam
} from "@/api/think/thinkOrder/model";
import OrderList from "./components/OrderList.vue";
import dayjs from "dayjs";
// 加载状态
const loading = ref(true);
const type = ref(0);
const changeType = (val) => {
type.value = val;
getList();
};
const tableHeight = document.body.clientHeight - 330;
console.log(tableHeight);
const createTimeStart = ref();
const createTimeEnd = ref();
const list = ref<any[]>([]);
const getList = async () => {
loading.value = true;
list.value = [];
if (type.value === 0) {
list.value = await getThinkOrderExcelData({
createTimeStart: createTimeStart.value ? dayjs(createTimeStart.value).unix() : undefined,
createTimeEnd: createTimeEnd.value ? dayjs(createTimeEnd.value).unix() : undefined
});
} else {
list.value = await getThinkOrderExcelDataForCard({
createTimeStart: createTimeStart.value ? dayjs(createTimeStart.value).unix() : undefined,
createTimeEnd: createTimeEnd.value ? dayjs(createTimeEnd.value).unix() : undefined
});
}
loading.value = false;
};
createTimeStart.value = dayjs().format("YYYY-MM-DD");
createTimeEnd.value = dayjs().format("YYYY-MM-DD 23:59:59");
getList();
const sid = ref<number>(0);
const columns1 = ref<ColumnItem[]>([
{
title: "场馆名称",
dataIndex: "siteName"
},
{
title: "卡类型",
children: [
{
title: "次卡",
dataIndex: "timeCardIncome",
customCell: (row) => {
return {
onClick: () => {
console.log(row);
payTypeList.value = [8, 11];
showList.value = true;
}
};
}
},
{
title: "期间卡(指月卡、季卡、年卡)",
dataIndex: "monthCardIncome",
customCell: (row) => {
return {
onClick: () => {
console.log(row);
payTypeList.value = [6, 7, 9, 10, 16, 17];
showList.value = true;
}
};
}
},
{
title: "充值卡(会员卡、IC卡)",
dataIndex: "chargeCardIncome",
customCell: (row) => {
return {
onClick: () => {
console.log(row);
payTypeList.value = [13, 14];
showList.value = true;
}
};
}
},
{
title: "散客订单",
dataIndex: "guest",
customRender: () => 0
},
{
title: "其他",
dataIndex: "otherIncome",
customCell: (row) => {
return {
onClick: () => {
console.log(row);
payTypeList.value = [2, 3, 12, 15];
showList.value = true;
}
};
}
},
{
title: "小计",
dataIndex: "siteIncome"
}
]
}
]);
// 表格列配置
const columns = ref<ColumnItem[]>([
{
title: "场馆名称",
dataIndex: "siteName"
},
{
title: "收款方式",
children: [
{
title: "微信支付",
dataIndex: "wechatIncome",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
payTypeList.value = [1];
showList.value = true;
}
};
}
},
{
title: "微信支付退款",
dataIndex: "wechatRefund",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
}
};
}
},
{
title: "POS机",
dataIndex: "posIncome",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
payTypeList.value = [5];
showList.value = true;
}
};
}
},
{
title: "对公转账",
dataIndex: "businessIncome",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
payTypeList.value = [18];
showList.value = true;
}
};
}
},
{
title: "现金收款",
dataIndex: "cashIncome",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
payTypeList.value = [4];
showList.value = true;
}
};
}
},
{
title: "其他",
dataIndex: "otherIncome",
customCell: (row) => {
return {
onClick: () => {
sid.value = row.sid;
payTypeList.value = [2, 3, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17];
showList.value = true;
}
};
}
},
{
title: "小计",
dataIndex: "siteIncome"
}
]
}
]);
/* 搜索 */
const searchData = (param: ThinkOrderParam) => {
createTimeStart.value = param.createTimeStart;
createTimeEnd.value = param.createTimeEnd;
console.log(createTimeEnd.value);
getList();
};
const reload = () => {
createTimeStart.value = dayjs().format("YYYY-MM-DD");
createTimeEnd.value = dayjs().format("YYYY-MM-DD");
getList();
};
const payTypeList = ref<number[]>([]);
const showList = ref(false);
</script>
<script lang="ts">
import * as MenuIcons from "@/layout/menu-icons";
export default {
name: "ThinkOrder",
components: MenuIcons
};
</script>
<style lang="less" scoped>
.tag-icon {
padding-right: 6px;
}
</style>