每日菜谱添加loading效果，默认选中当天

src/views/canteen/canteenDailyMenu/form.vue

@@ -132,13 +132,13 @@
 			<el-table-column prop="salesCount" label="商品销量" show-overflow-tooltip />
 			<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
 		</el-table>
-		<pagination
+		<!-- <pagination
 			@size-change="sizeChangeHandle"
 			@current-change="currentChangeHandle"
 			v-model:current-page="foodQueryForm.current"
 			v-model:page-size="foodQueryForm.size"
 			:total="total"
-		/>
+		/> -->
 
 		<template #footer>
 			<div class="dialog-footer">

src/views/canteen/canteenDailyMenu/index.vue

@@ -1,11 +1,11 @@
 <template>
-	<div class="layout-padding">
+	<div class="layout-padding" v-loading="loading">
 		<el-form-item label="商户" prop="merchantId" class="w-60 ml-10 my-6">
 			<select-mch v-model="merchantId" />
 		</el-form-item>
 		<h1 class="mx-auto text-5xl mt-[-40px]">今日菜谱</h1>
 
-		<table class="w-11/12 border-collapse cursor-pointer mx-auto">
+		<table v-if="weekData.data.length > 0" class="w-11/12 border-collapse cursor-pointer mx-auto">
 			<tr>
 				<div class="text-4xl mr-2 text-right" @click="addClick(-1)">&lt;</div>
 				<td
@@ -24,7 +24,7 @@
 		<div class="dataDiv">
 			<table>
 				<tr class="food">
-					<td class="text-center" @click="addFood(1)">早餐</td>
+					<td v-if="!loading" class="text-center" @click="addFood(1)">早餐</td>
 					<div class="food_list">
 						<td class="food_list_item" v-for="(item, index) in foodData1" :key="index" @click="delteData(item.tid)">
 							<el-image style="width: 80px; height: 80px" :src="imageBaseUrl + item.picUrl" fit="cover" />
@@ -38,7 +38,7 @@
 					</div>
 				</tr>
 				<tr class="food">
-					<td class="text-center" @click="addFood(2)">中餐</td>
+					<td v-if="!loading" class="text-center" @click="addFood(2)">中餐</td>
 					<div class="food_list">
 						<td class="food_list_item" v-for="(item, index) in foodData2" :key="index" @click="delteData(item.tid)">
 							<el-image style="width: 80px; height: 80px" :src="imageBaseUrl + item.picUrl" fit="cover" />
@@ -52,7 +52,7 @@
 					</div>
 				</tr>
 				<tr class="food">
-					<td class="text-center" @click="addFood(3)">晚餐</td>
+					<td v-if="!loading" class="text-center" @click="addFood(3)">晚餐</td>
 					<div class="food_list">
 						<td class="food_list_item" v-for="(item, index) in foodData3" :key="index" @click="delteData(item.tid)">
 							<el-image style="width: 80px; height: 80px" :src="imageBaseUrl + item.picUrl" fit="cover" />
@@ -88,9 +88,9 @@ const loading = ref(true)
 
 const message = useMessage() // 消息弹窗
 
-const foodData1 = ref<any>({})
-const foodData2 = ref<any>({})
-const foodData3 = ref<any>({})
+const foodData1 = ref<any>([])
+const foodData2 = ref<any>([])
+const foodData3 = ref<any>([])
 
 let timedata = ""
 let isActive = ref(-1)
@@ -135,9 +135,9 @@ watch(merchantId, () => {
 })
 
 const fetchData = async () => {
-	const weekDataRes = await selectWeekInfo(weekParams)
+	const weekDataRes = await selectWeekInfo(weekParams).finally(() => (loading.value = false))
 	weekData.data = weekDataRes.data
-	isActive.value = 0
+	isActive.value = new Date().getDay() === 0 ? 6 : new Date().getDay() - 1
 	timedata = weekData.data[0]
 	// 时间格式
 	timedata = timedata.substring(0, timedata.indexOf("("))
@@ -154,7 +154,8 @@ const selectTimeFood = async () => {
 	}
 	//最大长度
 	let count = 0
-	const result = await selectTimeFoodApi(params)
+	loading.value = true
+	const result = await selectTimeFoodApi(params).finally(() => (loading.value = false))
 	result.data.forEach((r: any) => {
 		if (r.dailyMenuVOS.length > count) {
 			count = r.dailyMenuVOS.length
@@ -177,17 +178,20 @@ const selectTimeFood = async () => {
 const delteData = async (tid: number) => {
 	await message.delConfirm("确定删除菜品吗？", "今日菜品?")
 	try {
+		loading.value = true
 		await delObjs([tid], merchantId.value)
 		message.success("删除成功")
 	} catch (error) {
 		message.error("删除失败")
+	} finally {
+		loading.value = false
 	}
 	selectTimeFood()
 }
 
 // 获取下拉框选项
 const merchantInit = async () => {
-	const res = await pageJoin({ current: 1, size: 9999 })
+	const res = await pageJoin({ current: 1, size: 9999 }).finally(() => (loading.value = false))
 	merchantInfo.value = res.data.records
 
 	//默认选中第一个
@@ -200,10 +204,7 @@ const merchantInit = async () => {
 const canteenCategoryOption = ref<any>([])
 // 获取菜品分类
 const getCanteenCategory = async () => {
-	const res = await fetchList({
-		current: 1,
-		size: 9999,
-	})
+	const res = await fetchList({ current: 1, size: 9999 })
 	if (res.code === 0) {
 		canteenCategoryOption.value = res.data.records
 	}