277 lines
8.3 KiB
Vue
277 lines
8.3 KiB
Vue
<!-- 搜索表单 -->
|
|
<template>
|
|
<a-space class="flex items-center" :size="10" style="flex-wrap: wrap">
|
|
<span class="text-gray-400">付款状态</span>
|
|
<a-select
|
|
v-model:value="where.payStatus"
|
|
style="width: 150px"
|
|
placeholder="付款状态筛选"
|
|
@change="search"
|
|
>
|
|
<a-select-option value="">全部</a-select-option>
|
|
<a-select-option :value="1">已付款</a-select-option>
|
|
<a-select-option :value="2">未付款</a-select-option>
|
|
</a-select>
|
|
<span class="text-gray-400">订单状态</span>
|
|
<a-select
|
|
v-model:value="where.orderStatus"
|
|
style="width: 150px"
|
|
placeholder="订单状态筛选"
|
|
@change="search"
|
|
>
|
|
<a-select-option value="">全部</a-select-option>
|
|
<a-select-option :value="1">已完成</a-select-option>
|
|
<a-select-option :value="2">未使用</a-select-option>
|
|
<a-select-option :value="3">已取消</a-select-option>
|
|
<a-select-option :value="4">退款中</a-select-option>
|
|
<a-select-option :value="5">退款被拒</a-select-option>
|
|
<a-select-option :value="6">退款成功</a-select-option>
|
|
</a-select>
|
|
<span class="text-gray-400">付款方式</span>
|
|
<a-select
|
|
v-model:value="where.payType"
|
|
style="width: 150px"
|
|
placeholder="付款方式筛选"
|
|
@change="search"
|
|
>
|
|
<a-select-option value="">全部</a-select-option>
|
|
<a-select-option :value="1">微信支付</a-select-option>
|
|
<a-select-option :value="2">余额支付</a-select-option>
|
|
<a-select-option :value="3">支付宝</a-select-option>
|
|
<a-select-option :value="4">现金</a-select-option>
|
|
<a-select-option :value="5">POS机</a-select-option>
|
|
<a-select-option :value="6">VIP月卡</a-select-option>
|
|
<a-select-option :value="7">VIP年卡</a-select-option>
|
|
<a-select-option :value="8">VIP次卡</a-select-option>
|
|
<a-select-option :value="9">IC月卡</a-select-option>
|
|
<a-select-option :value="10">IC年卡</a-select-option>
|
|
<a-select-option :value="11">IC次卡</a-select-option>
|
|
<a-select-option :value="12">免费</a-select-option>
|
|
<a-select-option :value="13">VIP充值卡</a-select-option>
|
|
<a-select-option :value="14">IC充值卡</a-select-option>
|
|
<a-select-option :value="15">积分支付</a-select-option>
|
|
<a-select-option :value="16">VIP季卡</a-select-option>
|
|
<a-select-option :value="17">IC季卡</a-select-option>
|
|
</a-select>
|
|
<span class="text-gray-400">开票状态</span>
|
|
<a-select
|
|
v-model:value="where.isInvoice"
|
|
style="width: 150px"
|
|
placeholder="开票状态筛选"
|
|
@change="search"
|
|
>
|
|
<a-select-option value="1">已开票</a-select-option>
|
|
<a-select-option :value="2">未开票</a-select-option>
|
|
<a-select-option :value="3">不能开票</a-select-option>
|
|
</a-select>
|
|
<ThinkSelectSite
|
|
:placeholder="`选择场馆`"
|
|
class="input-item"
|
|
v-model:value="where.siteName"
|
|
@done="chooseSiteId"
|
|
/>
|
|
<a-range-picker
|
|
v-model:value="dateRange"
|
|
@change="search"
|
|
value-format="YYYY-MM-DD"
|
|
class="ele-fluid"
|
|
/>
|
|
<a-input-search
|
|
allow-clear
|
|
placeholder="请输入订单号|编号|手机号"
|
|
v-model:value="where.keywords"
|
|
@pressEnter="search"
|
|
@search="search"
|
|
style="width: 380px"
|
|
/>
|
|
<a-button @click="reset">重置</a-button>
|
|
<a-button @click="setHasInvoice" :disabled="!selection?.length"
|
|
>设置已开票
|
|
</a-button>
|
|
<a-button class="ele-btn-icon" @click="handleExport">
|
|
<span>导出订单</span>
|
|
</a-button>
|
|
</a-space>
|
|
</template>
|
|
|
|
<script lang="ts" setup>
|
|
import useSearch from '@/utils/use-search';
|
|
import { ref, watch } from 'vue';
|
|
import { ThinkOrderInfoParam } from '@/api/think/thinkOrderInfo/model';
|
|
import { utils, writeFile } from 'xlsx';
|
|
import { message } from 'ant-design-vue';
|
|
import { toDateString } from 'ele-admin-pro';
|
|
import dayjs from 'dayjs';
|
|
import {
|
|
listThinkOrder,
|
|
updateBatchThinkOrder,
|
|
updateThinkOrder
|
|
} from '@/api/think/thinkOrder';
|
|
import { ThinkOrder, ThinkOrderParam } from '@/api/think/thinkOrder/model';
|
|
import { ThinkSite } from '@/api/think/thinkSite/model';
|
|
|
|
const props = withDefaults(
|
|
defineProps<{
|
|
// 选中的角色
|
|
selection?: ThinkOrder[];
|
|
}>(),
|
|
{}
|
|
);
|
|
|
|
const emit = defineEmits<{
|
|
(e: 'search', where?: ThinkOrderInfoParam): void;
|
|
(e: 'add'): void;
|
|
(e: 'remove'): void;
|
|
(e: 'advanced'): void;
|
|
(e: 'export'): void;
|
|
}>();
|
|
|
|
// 表单数据
|
|
const { where, resetFields } = useSearch<ThinkOrderParam>({
|
|
sid: undefined,
|
|
siteName: undefined,
|
|
createTimeStart: undefined,
|
|
createTimeEnd: undefined,
|
|
timeStart: undefined,
|
|
timeEnd: undefined,
|
|
categoryId: undefined,
|
|
keywords: undefined,
|
|
payStatus: undefined,
|
|
orderStatus: undefined,
|
|
payType: undefined,
|
|
isInvoice: undefined
|
|
});
|
|
// 请求状态
|
|
const loading = ref(false);
|
|
// 日期范围选择
|
|
const dateRange = ref<[string, string]>(['', '']);
|
|
const orders = ref<ThinkOrder[] | any[]>();
|
|
const xlsFileName = ref<string>();
|
|
|
|
/* 搜索 */
|
|
const search = () => {
|
|
const [d1, d2] = dateRange.value ?? [];
|
|
xlsFileName.value = `${d1}至${d2}`;
|
|
where.timeStart = d1 ? dayjs(d1).valueOf() / 1000 : undefined;
|
|
where.timeEnd = d2 ? dayjs(d2).valueOf() / 1000 : undefined;
|
|
// where.createTimeStart = d1 ? d1 + ' 00:00:00' : undefined;
|
|
// where.createTimeEnd = d2 ? d2 + ' 00:00:00' : undefined;
|
|
emit('search', {
|
|
...where
|
|
});
|
|
};
|
|
|
|
const chooseSiteId = (data: ThinkSite) => {
|
|
where.sid = data.id;
|
|
where.siteName = data.name;
|
|
search();
|
|
};
|
|
|
|
/* 重置 */
|
|
const reset = () => {
|
|
resetFields();
|
|
search();
|
|
};
|
|
|
|
const handleExport = () => {
|
|
const [d1, d2] = dateRange.value ?? [];
|
|
xlsFileName.value = `${d1}至${d2}`;
|
|
where.forAdmin = true;
|
|
where.limit = 5000;
|
|
where.page = 1;
|
|
where.timeStart = d1 ? dayjs(d1).valueOf() / 1000 : undefined;
|
|
where.timeEnd = d2 ? dayjs(d2).valueOf() / 1000 : undefined;
|
|
emit('export', {
|
|
...where
|
|
});
|
|
};
|
|
|
|
// 导出
|
|
const handleExport2 = async () => {
|
|
loading.value = true;
|
|
const array: (string | number)[][] = [
|
|
[
|
|
'订单号',
|
|
'订单编号',
|
|
'姓名',
|
|
'电话号码',
|
|
'预定信息',
|
|
'消费金额',
|
|
'实付金额',
|
|
'下单日期'
|
|
]
|
|
];
|
|
if (!where.timeStart) {
|
|
message.error('请选择导出的开始日期、结束日期,每次最多导出5000条记录');
|
|
return false;
|
|
}
|
|
await listThinkOrder(where)
|
|
.then((list) => {
|
|
orders.value = list;
|
|
orders.value?.forEach((d: ThinkOrder) => {
|
|
array.push([
|
|
`${d.id}`,
|
|
`${d.orderNum}`,
|
|
`${d.name}`,
|
|
`${d.phone}`,
|
|
`${d.siteName} ${d.dateTime} ${d.totalPrice}`,
|
|
`${d.totalPrice}`,
|
|
`${d.payPrice}`,
|
|
`${toDateString(d.payTime)}`
|
|
]);
|
|
});
|
|
const sheetName = `订单数据导出`;
|
|
const workbook = {
|
|
SheetNames: [sheetName],
|
|
Sheets: {}
|
|
};
|
|
const sheet = utils.aoa_to_sheet(array);
|
|
workbook.Sheets[sheetName] = sheet;
|
|
// 设置列宽
|
|
sheet['!cols'] = [
|
|
{ wch: 10 },
|
|
{ wch: 10 },
|
|
{ wch: 10 },
|
|
{ wch: 10 },
|
|
{ wch: 20 },
|
|
{ wch: 40 },
|
|
{ wch: 10 }
|
|
];
|
|
message.loading('正在导出...');
|
|
setTimeout(() => {
|
|
writeFile(
|
|
workbook,
|
|
`${
|
|
where.createTimeEnd ? xlsFileName.value + '_' : ''
|
|
}${sheetName}.xlsx`
|
|
);
|
|
loading.value = false;
|
|
}, 2000);
|
|
})
|
|
.catch((msg) => {
|
|
message.error(msg);
|
|
loading.value = false;
|
|
})
|
|
.finally(() => {});
|
|
};
|
|
|
|
const setHasInvoice = async () => {
|
|
const hide = message.loading('请求中..', 0);
|
|
if (props.selection) {
|
|
props.selection
|
|
.filter((item) => item.isInvoice === 2)
|
|
.map(async (item) => {
|
|
item.isInvoice = 1;
|
|
await updateThinkOrder(item);
|
|
});
|
|
}
|
|
hide();
|
|
message.success('设置成功');
|
|
};
|
|
|
|
watch(
|
|
() => props.selection,
|
|
() => {}
|
|
);
|
|
</script>
|