feat:食堂菜品购买统计(按月统计)

src/api/hard/hard-total.ts

@@ -27,7 +27,7 @@ export function productTotalByDept(query: any) {
 }
 
 /**
- * 食堂统计
+ * 食堂统计(按天)
  */
 export function canteenProudctTotal(query: any) {
 	return request({
@@ -41,6 +41,21 @@ export function canteenProudctTotal(query: any) {
 	})
 }
 
+/**
+ * 食堂统计(按月)
+ */
+export function canteenProudctTotalByMonth(query: any) {
+	return request({
+		url: "/hard/hard-canteen-total-log/proudct-total-by-month",
+		method: "post",
+		params: {
+			current: query.current,
+			size: query.size,
+		},
+		data: query,
+	})
+}
+
 /**
  * 食堂统计
  */

src/views/act/act-cancel/index.vue

@@ -24,38 +24,22 @@
 			</el-form>
 			<el-row>
 				<div class="mb8" style="width: 100%">
-					<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()" v-auth="'wallet_actCancel_add'">
+					<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
+						v-auth="'wallet_actCancel_add'">
 						新 增
 					</el-button>
-					<el-button
-						plain
-						:disabled="multiple"
-						icon="Delete"
-						type="primary"
-						v-auth="'wallet_actCancel_del'"
-						@click="handleDelete(selectObjs)"
-					>
+					<el-button plain :disabled="multiple" icon="Delete" type="primary" v-auth="'wallet_actCancel_del'"
+						@click="handleDelete(selectObjs)">
 						删除
 					</el-button>
-					<right-toolbar
-						v-model:showSearch="showSearch"
-						:export="'wallet_actCancel_export'"
-						@exportExcel="exportExcel"
-						class="ml10 mr20"
-						style="float: right"
-						@queryTable="getDataList"
-					></right-toolbar>
+					<right-toolbar v-model:showSearch="showSearch" :export="'wallet_actCancel_export'"
+						@exportExcel="exportExcel" class="ml10 mr20" style="float: right"
+						@queryTable="getDataList"></right-toolbar>
 				</div>
 			</el-row>
-			<el-table
-				:data="state.dataList"
-				v-loading="state.loading"
-				border
-				:cell-style="tableStyle.cellStyle"
-				:header-cell-style="tableStyle.headerCellStyle"
-				@selection-change="selectionChangHandle"
-				@sort-change="sortChangeHandle"
-			>
+			<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
+				:header-cell-style="tableStyle.headerCellStyle" @selection-change="selectionChangHandle"
+				@sort-change="sortChangeHandle">
 				<el-table-column type="selection" width="40" align="center" />
 				<el-table-column type="index" label="#" width="40" />
 				<el-table-column prop="merchantName" label="活动商户" show-overflow-tooltip />
@@ -68,14 +52,8 @@
 				</el-table-column>
 				<el-table-column prop="actStatus" label="活动状态" min-width="120" align="center">
 					<template #default="{ row }">
-						<el-switch
-							active-value="1"
-							inactive-value="2"
-							active-text="开启活动"
-							inactive-text="关闭活动"
-							v-model="row.actStatus"
-							@change="updateActStatusChange(row)"
-						/>
+						<el-switch active-value="1" inactive-value="2" active-text="开启活动" inactive-text="关闭活动"
+							v-model="row.actStatus" @change="updateActStatusChange(row)" />
 					</template>
 				</el-table-column>
 				<el-table-column prop="actStatus" label="预约总数" show-overflow-tooltip>
@@ -95,14 +73,17 @@
 				</el-table-column>
 				<el-table-column label="操作" width="150">
 					<template #default="{ row }">
-						<el-button icon="edit-pen" text type="primary" v-auth="'wallet_actCancel_edit'" @click="formDialogRef.openDialog(row.id)">
+						<el-button icon="edit-pen" text type="primary" v-auth="'wallet_actCancel_edit'"
+							@click="formDialogRef.openDialog(row.id)">
 							编辑
 						</el-button>
-						<el-button icon="delete" text type="primary" v-auth="'wallet_actCancel_del'" @click="handleDelete([row.id])"> 删除 </el-button>
+						<el-button icon="delete" text type="primary" v-auth="'wallet_actCancel_del'"
+							@click="handleDelete([row.id])"> 删除 </el-button>
 					</template>
 				</el-table-column>
 			</el-table>
-			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
+				v-bind="state.pagination" />
 		</div>
 
 		<!-- 编辑、新增  -->

src/views/hard/canteen-product-total/components/product-total-table-by-day.vue

@@ -0,0 +1,180 @@
+<template>
+    <div class="w-full">
+        <el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
+            :header-cell-style="tableStyle.headerCellStyle" :summary-method="getSummaries" :show-summary="true"
+            row-class-name="success-row" @selection-change="selectionChangHandle" @sort-change="sortChangeHandle"
+            @expand-change="tableExpandChange">
+            <el-table-column type="expand" width="60">
+                <template #default="{ row }">
+                    <div class="ml-[60px] my-2">
+                        <el-table :data="getTableChildrenMap(row.uniqueCode)" border :cell-style="tableStyle.cellStyle"
+                            :header-cell-style="tableStyle.headerCellStyle" row-class-name="warning-row">
+                            <el-table-column type="index" label="#" width="50" />
+                            <el-table-column prop="userDeptName" align="center" label="部门" width="200" />
+                            <el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
+                                <template #default="{ row }">
+                                    <dict-tag :options="daily_menu" :value="row.hourType" />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
+                                <template #default="{ row }">
+                                    <span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="交易次数" width="150" align="center" prop="timeCount">
+                                <template #default="{ row }">
+                                    <span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
+                                <template #default="{ row }">
+                                    <span class="color-success"> {{ row.payCount || 0 }}份 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="总价" width="150" prop="totalPrice" align="center">
+                                <template #default="{ row }">
+                                    <span>{{ displayPrice(row.totalPrice) }}</span>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                </template>
+            </el-table-column>
+
+            <el-table-column type="index" label="#" width="50" />
+            <el-table-column label="用餐时间(天)" align="center" width="200" prop="createTime">
+                <template #default="{ row }">
+                    <span>{{ parseTime(row.createTime, "{y}-{m}-{d}") }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
+                <template #default="{ row }">
+                    <dict-tag :options="daily_menu" :value="row.hourType" />
+                </template>
+            </el-table-column>
+            <el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
+                <template #default="{ row }">
+                    <span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="交易次数" width="150" align="center" prop="timeCount">
+                <template #default="{ row }">
+                    <span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
+                <template #default="{ row }">
+                    <span class="color-success"> {{ row.payCount || 0 }}份 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="总价" width="150" prop="totalPrice" align="center">
+                <template #default="{ row }">
+                    <span>{{ displayPrice(row.totalPrice) }}</span>
+                </template>
+            </el-table-column>
+
+            <el-table-column fixed="right" label="操作">
+                <template #default="{ row }">
+                    <el-button icon="Tickets" text type="primary"
+                        @click="productTotalTableRef.openDialog(parseTime(row.createTime, '{y}-{m}-{d}'), row.hourType, '0')">
+                        菜品详情
+                    </el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+        <product-total-table ref="productTotalTableRef" />
+    </div>
+</template>
+
+<script setup lang="ts" name="product-total-table-by-day">
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { displayPrice } from "/@/utils/formatMoney"
+import { useDict } from "/@/hooks/dict"
+import { parseTime } from "/@/utils/formatTime"
+
+import * as hardTotalApi from "/@/api/hard/hard-total"
+
+// 定义查询字典
+const { daily_menu } = useDict("daily_menu")
+
+const ProductTotalTable = defineAsyncComponent(() => import("./product-total-table.vue"))
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+    createdIsNeed: false,
+    queryForm: {},
+    pageList: hardTotalApi.canteenProudctTotal,
+})
+
+//  table hook
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, postDownBlobFile, tableStyle } = useTable(state)
+
+// 多选变量
+const selectObjs = ref([]) as any
+const multiple = ref(true)
+
+const productTotalTableRef = ref()
+const tableChildrenMap = ref(new Map<string, any>())
+
+const getTableChildrenMap = (key: string) => {
+    return tableChildrenMap.value.get(key)
+}
+
+const getSummaries = (param: any) => {
+    const { columns, data } = param
+    const totalColumns = ["payUserCount", "timeCount", "payCount", "totalPrice"]
+    const totalRow = Array.from({ length: columns.length })
+    totalRow[0] = "合计"
+    columns.forEach((i: any, index: number) => {
+        if (totalColumns.includes(i.property)) {
+            const total = data
+                .filter((v: any) => v[i.property] != null)
+                .map((v: any) => Number(v[i.property]))
+                .reduce((pren: number, next: number) => pren + next, 0)
+            if (i.property.includes("Price")) {
+                totalRow[index] = displayPrice(total)
+            } else {
+                totalRow[index] = total
+            }
+        }
+    })
+    return totalRow
+}
+
+// 多选事件
+const selectionChangHandle = (objs: { id: string }[]) => {
+    selectObjs.value = objs.map(({ id }) => id)
+    multiple.value = !objs.length
+}
+
+// 点击table展开行
+const tableExpandChange = async (e: any) => {
+    try {
+        const { data } = await hardTotalApi.productTotalByDept({
+            hourType: e.hourType,
+            createTimeStr: parseTime(e.createTime, '{y}-{m}-{d}'),
+        })
+        if (data && data.length) {
+            tableChildrenMap.value.set(e.uniqueCode, data)
+        }
+    } catch (error: any) {
+        console.error(error);
+    }
+}
+
+const doSearch = (params: any) => {
+    state.queryForm = params
+    getDataList()
+}
+
+const doCancel = (params: any) => {
+    state.queryForm = params
+    selectObjs.value = []
+    getDataList()
+}
+
+defineExpose({
+    doSearch,
+    doCancel
+})
+</script>

src/views/hard/canteen-product-total/components/product-total-table-by-month.vue

@@ -0,0 +1,180 @@
+<template>
+    <div class="w-full">
+        <el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
+            :header-cell-style="tableStyle.headerCellStyle" :summary-method="getSummaries" :show-summary="true"
+            row-class-name="success-row" @selection-change="selectionChangHandle" @sort-change="sortChangeHandle"
+            @expand-change="tableExpandChange">
+            <el-table-column type="expand" width="60">
+                <template #default="{ row }">
+                    <div class="ml-[60px] my-2">
+                        <el-table :data="getTableChildrenMap(row.uniqueCode)" border :cell-style="tableStyle.cellStyle"
+                            :header-cell-style="tableStyle.headerCellStyle" row-class-name="warning-row">
+                            <el-table-column type="index" label="#" width="50" />
+                            <el-table-column prop="userDeptName" align="center" label="部门" width="200" />
+                            <el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
+                                <template #default="{ row }">
+                                    <dict-tag :options="daily_menu" :value="row.hourType" />
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
+                                <template #default="{ row }">
+                                    <span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="交易次数" width="150" align="center" prop="timeCount">
+                                <template #default="{ row }">
+                                    <span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
+                                <template #default="{ row }">
+                                    <span class="color-success"> {{ row.payCount || 0 }}份 </span>
+                                </template>
+                            </el-table-column>
+                            <el-table-column label="总价" width="150" prop="totalPrice" align="center">
+                                <template #default="{ row }">
+                                    <span>{{ displayPrice(row.totalPrice) }}</span>
+                                </template>
+                            </el-table-column>
+                        </el-table>
+                    </div>
+                </template>
+            </el-table-column>
+
+            <el-table-column type="index" label="#" width="50" />
+            <el-table-column label="用餐时间(月)" align="center" width="200" prop="createTime">
+                <template #default="{ row }">
+                    <span>{{ row.createTimeStr }}</span>
+                </template>
+            </el-table-column>
+            <el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
+                <template #default="{ row }">
+                    <dict-tag :options="daily_menu" :value="row.hourType" />
+                </template>
+            </el-table-column>
+            <el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
+                <template #default="{ row }">
+                    <span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="交易次数" width="150" align="center" prop="timeCount">
+                <template #default="{ row }">
+                    <span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
+                <template #default="{ row }">
+                    <span class="color-success"> {{ row.payCount || 0 }}份 </span>
+                </template>
+            </el-table-column>
+            <el-table-column label="总价" width="150" prop="totalPrice" align="center">
+                <template #default="{ row }">
+                    <span>{{ displayPrice(row.totalPrice) }}</span>
+                </template>
+            </el-table-column>
+
+            <el-table-column fixed="right" label="操作">
+                <template #default="{ row }">
+                    <el-button icon="Tickets" text type="primary"
+                        @click="productTotalTableRef.openDialog(row.createTimeStr, row.hourType, '1')">
+                        菜品详情
+                    </el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+        <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+        <product-total-table ref="productTotalTableRef" />
+    </div>
+</template>
+
+<script setup lang="ts" name="product-total-table-by-day">
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { displayPrice } from "/@/utils/formatMoney"
+import { useDict } from "/@/hooks/dict"
+import { parseTime } from "/@/utils/formatTime"
+
+import * as hardTotalApi from "/@/api/hard/hard-total"
+
+// 定义查询字典
+const { daily_menu } = useDict("daily_menu")
+
+const ProductTotalTable = defineAsyncComponent(() => import("./product-total-table.vue"))
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+    createdIsNeed: false,
+    queryForm: {},
+    pageList: hardTotalApi.canteenProudctTotalByMonth,
+})
+
+//  table hook
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, postDownBlobFile, tableStyle } = useTable(state)
+
+// 多选变量
+const selectObjs = ref([]) as any
+const multiple = ref(true)
+
+const productTotalTableRef = ref()
+const tableChildrenMap = ref(new Map<string, any>())
+
+const getTableChildrenMap = (key: string) => {
+    return tableChildrenMap.value.get(key)
+}
+
+const getSummaries = (param: any) => {
+    const { columns, data } = param
+    const totalColumns = ["payUserCount", "timeCount", "payCount", "totalPrice"]
+    const totalRow = Array.from({ length: columns.length })
+    totalRow[0] = "合计"
+    columns.forEach((i: any, index: number) => {
+        if (totalColumns.includes(i.property)) {
+            const total = data
+                .filter((v: any) => v[i.property] != null)
+                .map((v: any) => Number(v[i.property]))
+                .reduce((pren: number, next: number) => pren + next, 0)
+            if (i.property.includes("Price")) {
+                totalRow[index] = displayPrice(total)
+            } else {
+                totalRow[index] = total
+            }
+        }
+    })
+    return totalRow
+}
+
+// 多选事件
+const selectionChangHandle = (objs: { id: string }[]) => {
+    selectObjs.value = objs.map(({ id }) => id)
+    multiple.value = !objs.length
+}
+
+// 点击table展开行
+const tableExpandChange = async (e: any) => {
+    try {
+        const { data } = await hardTotalApi.productTotalByDept({
+            hourType: e.hourType,
+            createTimeStr: parseTime(e.createTime, '{y}-{m}-{d}'),
+        })
+        if (data && data.length) {
+            tableChildrenMap.value.set(e.uniqueCode, data)
+        }
+    } catch (error: any) {
+        console.error(error);
+    }
+}
+
+const doSearch = (params: any) => {
+    state.queryForm = params
+    getDataList()
+}
+
+const doCancel = (params: any) => {
+    state.queryForm = params
+    selectObjs.value = []
+    getDataList()
+}
+
+defineExpose({
+    doSearch,
+    doCancel
+})
+</script>

src/views/hard/canteen-product-total/components/product-total-table.vue

@@ -83,10 +83,11 @@ const selectionChangHandle = (objs: { id: string }[]) => {
 	multiple.value = !objs.length
 }
 
-const openDialog = (createTimeStr: any, hourType: any) => {
+const openDialog = (createTimeStr: any, hourType: any, createTimeType: any) => {
 	visible.value = true
 	state.queryForm.createTimeStr = createTimeStr
 	state.queryForm.hourType = hourType
+	state.queryForm.createTimeType = createTimeType ?? ""
 	getDataList()
 }
 

src/views/hard/canteen-product-total/index.vue

@@ -5,7 +5,7 @@
 				@getSelectNode="handleGetSelectNode" switch-inactive-text="包含" switch-active-text="不包含"
 				:defaultTreeWidth="20" :nodeClickable="false">
 				<template #default>
-					<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="getDataList">
+					<el-form ref="queryRef" :inline="true" :model="state.queryForm" @keyup.enter="search">
 						<el-row>
 							<el-form-item style="width: 250px" label="用餐时间段" prop="hourType">
 								<dict-select v-model="state.queryForm.hourType" dict-code="daily_menu" />
@@ -19,213 +19,103 @@
 									value-format="YYYY-MM-DD HH:mm:ss" type="daterange" />
 							</el-form-item>
 							<el-form-item>
-								<el-button icon="Search" type="primary" @click="doSearch">{{ $t("common.queryBtn")
-								}}</el-button>
+								<el-button icon="Search" type="primary" @click="search">
+									{{ $t("common.queryBtn") }}
+								</el-button>
 								<el-button icon="Refresh" @click="resetQuery">{{ $t("common.resetBtn") }}</el-button>
 							</el-form-item>
 						</el-row>
 					</el-form>
-					<el-row>
-						<div class="mb8" style="width: 100%">
+					<el-row class="flex">
+						<el-tabs class="flex-1" v-model="activeTab">
+							<el-tab-pane v-for="(v) in tabPane" :key="v.name" :label="v.label" :name="v.name">
+							</el-tab-pane>
+						</el-tabs>
+						<div class="mb8">
 							<right-toolbar :search="false" v-model:showSearch="showSearch"
 								:export="'wallet_walletTransaction_export'" @exportExcel="exportExcel" class="ml10 mr20"
-								style="float: right" @queryTable="getDataList"></right-toolbar>
+								style="float: right" @queryTable="search"></right-toolbar>
 						</div>
 					</el-row>
-					<el-table :data="state.dataList" v-loading="state.loading" border :cell-style="tableStyle.cellStyle"
-						:header-cell-style="tableStyle.headerCellStyle" :summary-method="getSummaries"
-						:show-summary="true" row-class-name="success-row" @selection-change="selectionChangHandle"
-						@sort-change="sortChangeHandle" @expand-change="tableExpandChange">
-						<el-table-column v-if="false" type="selection" width="80" align="center" />
-
-						<el-table-column type="expand" width="50">
-							<template #default="{ row }">
-								<div class="ml-[50px] my-2">
-									<el-table :data="getTableChildrenMap(row.uniqueCode)" border
-										:cell-style="tableStyle.cellStyle"
-										:header-cell-style="tableStyle.headerCellStyle" row-class-name="warning-row">
-										<el-table-column type="index" label="#" width="50" />
-										<el-table-column prop="userDeptName" align="center" label="部门" width="200" />
-										<el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
-											<template #default="{ row }">
-												<dict-tag :options="daily_menu" :value="row.hourType" />
-											</template>
-										</el-table-column>
-										<el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
-											<template #default="{ row }">
-												<span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
-											</template>
-										</el-table-column>
-										<el-table-column label="交易次数" width="150" align="center" prop="timeCount">
-											<template #default="{ row }">
-												<span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
-											</template>
-										</el-table-column>
-										<el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
-											<template #default="{ row }">
-												<span class="color-success"> {{ row.payCount || 0 }}份 </span>
-											</template>
-										</el-table-column>
-										<el-table-column label="总价" width="150" prop="totalPrice" align="center">
-											<template #default="{ row }">
-												<span>{{ displayPrice(row.totalPrice) }}</span>
-											</template>
-										</el-table-column>
-									</el-table>
-								</div>
-							</template>
-						</el-table-column>
-
-						<el-table-column type="index" label="#" width="50" />
-						<el-table-column label="用餐时间" align="center" width="200" prop="createTime">
-							<template #default="{ row }">
-								<span>{{ parseTime(row.createTime, "{y}-{m}-{d}") }}</span>
-							</template>
-						</el-table-column>
-						<el-table-column label="用餐时间段" width="100" align="center" prop="hourType">
-							<template #default="{ row }">
-								<dict-tag :options="daily_menu" :value="row.hourType" />
-							</template>
-						</el-table-column>
-						<el-table-column label="交易人数" width="150" align="center" prop="payUserCount">
-							<template #default="{ row }">
-								<span class="color-primary"> {{ row.payUserCount || 0 }}人 </span>
-							</template>
-						</el-table-column>
-						<el-table-column label="交易次数" width="150" align="center" prop="timeCount">
-							<template #default="{ row }">
-								<span class="color-primary"> {{ row.timeCount || 0 }}次 </span>
-							</template>
-						</el-table-column>
-						<el-table-column label="售出商品数量" width="150" align="center" prop="payCount">
-							<template #default="{ row }">
-								<span class="color-success"> {{ row.payCount || 0 }}份 </span>
-							</template>
-						</el-table-column>
-						<el-table-column label="总价" width="150" prop="totalPrice" align="center">
-							<template #default="{ row }">
-								<span>{{ displayPrice(row.totalPrice) }}</span>
-							</template>
-						</el-table-column>
-
-						<el-table-column fixed="right" label="操作">
-							<template #default="{ row }">
-								<el-button icon="Tickets" text type="primary"
-									@click="productTotalTableRef.openDialog(parseTime(row.createTime, '{y}-{m}-{d}'), row.hourType)">
-									菜品详情
-								</el-button>
-							</template>
-						</el-table-column>
-					</el-table>
-					<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle"
-						v-bind="state.pagination" />
+					<product-total-table-by-day v-if="activeTab === 'DAY'" ref="productTotalTableByDayRef" />
+					<ProductTotalTableByMonth v-if="activeTab === 'MONTH'" ref="productTotalTableByMonthRef" />
 				</template>
 			</DraggableDepTree>
 		</div>
-		<product-total-table ref="productTotalTableRef" />
+
 	</div>
 </template>
 
 <script setup lang="ts" name="hard-sb">
-import { BasicTableProps, useTable } from "/@/hooks/table"
-import { displayPrice } from "/@/utils/formatMoney"
-import { useDict } from "/@/hooks/dict"
-import { parseTime } from "/@/utils/formatTime"
+import { ElMessage } from "element-plus"
 
-import * as hardTotalApi from "/@/api/hard/hard-total"
+import other from "/@/utils/other"
+import { formatDate } from '/@/utils/formatTime';
 
-const ProductTotalTable = defineAsyncComponent(() => import("./components/product-total-table.vue"))
+const ProductTotalTableByDay = defineAsyncComponent(() => import("./components/product-total-table-by-day.vue"))
+const ProductTotalTableByMonth = defineAsyncComponent(() => import("./components/product-total-table-by-month.vue"))
+
+// 组件变量
+const productTotalTableByDayRef = ref()
+const productTotalTableByMonthRef = ref()
 
 // 搜索变量
 const queryRef = ref()
 const showSearch = ref(true)
-const productTotalTableRef = ref()
 
 // 多选变量
-const selectObjs = ref([]) as any
-const multiple = ref(true)
 const draggableDepTreeRef = ref() // 树组件ref引用
 
-const tableChildrenMap = ref(new Map<string, any>())
+// tab变量
+const tabPane = ref([
+	{
+		label: "按天统计",
+		name: "DAY"
+	},
+	{
+		label: "按月统计",
+		name: "MONTH"
+	}
+])
+const activeTab = ref("DAY")
 
-// 定义查询字典
-const { daily_menu } = useDict("daily_menu")
-
-const state: BasicTableProps = reactive<BasicTableProps>({
-	queryForm: {},
-	pageList: hardTotalApi.canteenProudctTotal,
+const state = reactive<any>({
+	queryForm: {
+		hourType: "",
+		merchantId: "",
+		createTimeList: [],
+	}
 })
 
-//  table hook
-const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, postDownBlobFile, tableStyle } = useTable(state)
-
-// 导出excel
-const exportExcel = () => {
-	postDownBlobFile("/hard/hard-total/export-sb", Object.assign(state.queryForm), "设备交易记录.xlsx")
-}
-
-// 点击table展开行
-const tableExpandChange = async (e: any) => {
-	try {
-		const { data } = await hardTotalApi.productTotalByDept({
-			hourType: e.hourType,
-			createTimeStr: parseTime(e.createTime, '{y}-{m}-{d}'),
-		})
-		if (data && data.length) {
-			tableChildrenMap.value.set(e.uniqueCode, data)
-		}
-	} catch (error: any) {
-		console.error(error);
+watch(() => [activeTab.value, productTotalTableByDayRef.value, productTotalTableByMonthRef.value], () => {
+	if (activeTab.value === "DAY" && productTotalTableByDayRef.value?.doSearch) {
+		productTotalTableByDayRef.value.doSearch(state.queryForm)
 	}
-}
-
-const getTableChildrenMap = (key: string) => {
-	return tableChildrenMap.value.get(key)
-}
-
-const getSummaries = (param: any) => {
-	const { columns, data } = param
-	const totalColumns = ["payUserCount", "timeCount", "payCount", "totalPrice"]
-	const totalRow = Array.from({ length: columns.length })
-	totalRow[0] = "合计"
-	columns.forEach((i: any, index: number) => {
-		if (totalColumns.includes(i.property)) {
-			const total = data
-				.filter((v: any) => v[i.property] != null)
-				.map((v: any) => Number(v[i.property]))
-				.reduce((pren: number, next: number) => pren + next, 0)
-			if (i.property.includes("Price")) {
-				totalRow[index] = displayPrice(total)
-			} else {
-				totalRow[index] = total
-			}
-		}
-	})
-	return totalRow
-}
+	if (activeTab.value === "MONTH" && productTotalTableByMonthRef.value?.doSearch) {
+		productTotalTableByMonthRef.value.doSearch(state.queryForm)
+	}
+})
 
 // 清空搜索条件
 const resetQuery = () => {
 	// 清空搜索条件
 	queryRef.value?.resetFields()
-	// 清空多选
-	selectObjs.value = []
 	state.queryForm.deptId = ""
 	state.queryForm.userDeptIds = []
 	draggableDepTreeRef.value.resetData()
-	getDataList()
+	cancel()
 }
 
-// 多选事件
-const selectionChangHandle = (objs: { id: string }[]) => {
-	selectObjs.value = objs.map(({ id }) => id)
-	multiple.value = !objs.length
-}
-
-// 搜索
-const doSearch = () => {
-	productTotalTableRef.value.updateQueryParams(state.queryForm)
-	getDataList()
+const exportExcel = () => {
+	ElMessage.info("下载中，请稍后")
+	switch (activeTab.value) {
+		case "DAY":
+			other.postDownBlobFile("/hard/hard-canteen-total-log/proudct-total-export-by-day", state.queryForm, formatDate(new Date(), "YYYY年mm月dd日 HH时MM分SS秒 ") + "食堂菜品购买统计(按天).xlsx")
+			break;
+		case "MONTH":
+			other.postDownBlobFile("/hard/hard-canteen-total-log/proudct-total-export-by-month", state.queryForm, formatDate(new Date(), "YYYY年mm月dd日 HH时MM分SS秒 ") + "食堂菜品购买统计(按月).xlsx")
+			break;
+	}
 }
 
 // 树节点选择时
@@ -233,7 +123,29 @@ const handleGetSelectNode = (curClickedNode: any, checkedTreeNodes: any, isDeepT
 	state.queryForm.deptId = curClickedNode.id
 	state.queryForm.userDeptIds = checkedTreeNodes.map((item: any) => item.id)
 	state.queryForm.isInclude = !isDeepTree
-	getDataList()
+	search()
+}
+
+const search = () => {
+	switch (activeTab.value) {
+		case "DAY":
+			productTotalTableByDayRef.value.doSearch(state.queryForm)
+			break;
+		case "MONTH":
+			productTotalTableByMonthRef.value.doSearch(state.queryForm)
+			break;
+	}
+}
+
+const cancel = () => {
+	switch (activeTab.value) {
+		case "DAY":
+			productTotalTableByDayRef.value.doCancel(state.queryForm)
+			break;
+		case "MONTH":
+			productTotalTableByMonthRef.value.doCancel(state.queryForm)
+			break;
+	}
 }
 </script>