From a5f3098f6454cc7c759e4f57c06ecd882594e4f5 Mon Sep 17 00:00:00 2001
From: ctw <>
Date: Wed, 25 Dec 2024 14:36:26 +0800
Subject: [PATCH] =?UTF-8?q?=E6=AF=8F=E6=97=A5=E8=8F=9C=E8=B0=B1=E7=9A=84?=
 =?UTF-8?q?=E9=A4=90=E6=AE=B5=E5=BC=B9=E6=A1=86=E4=B8=AD=E9=80=89=E6=8B=A9?=
 =?UTF-8?q?=E8=8F=9C=E5=93=81=E5=9B=9E=E6=98=BE=E8=8F=9C=E5=93=81=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/canteen/canteenDailyMenu/form.vue | 238 ++++++++++----------
 src/views/canteen/canteenSpu/index.vue      |   1 -
 2 files changed, 120 insertions(+), 119 deletions(-)

diff --git a/src/views/canteen/canteenDailyMenu/form.vue b/src/views/canteen/canteenDailyMenu/form.vue
index 49985be..c980747 100644
--- a/src/views/canteen/canteenDailyMenu/form.vue
+++ b/src/views/canteen/canteenDailyMenu/form.vue
@@ -1,159 +1,161 @@
 <template>
-  <el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible"
-             :close-on-click-modal="false" draggable>
-    <el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
-<!--      <el-row :gutter="24">-->
+	<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
+		<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="90px" v-loading="loading">
+			<el-form-item label="日期" prop="hourType">
+				<p>{{ form.startTime }}</p>
+			</el-form-item>
 
-        <el-form-item label="日期" prop="hourType">
-          <p>{{ form.startTime }}</p>
-        </el-form-item>
+			<el-form-item label="时间" prop="hourType">
+				<p v-if="form.hourType == 1">早餐</p>
+				<p v-else-if="form.hourType == 2">午餐</p>
+				<p v-else-if="form.hourType == 3">晚餐</p>
+				<p v-else>未知类型</p>
+			</el-form-item>
 
-        <el-form-item label="时间" prop="hourType">
-          <p v-if="form.hourType == 1">早餐</p>
-          <p v-else-if="form.hourType == 2">午餐</p>
-          <p v-else-if="form.hourType == 3">晚餐</p>
-          <p v-else>未知类型</p>
-        </el-form-item>
+			<el-form-item label="菜品" prop="spuId">
+				<el-select v-model="spuIds" placeholder="请选择菜品" multiple>
+					<el-option v-for="item in foodData" :key="item.id" :label="item.name" :value="item.id" />
+				</el-select>
+			</el-form-item>
 
-        <el-form-item label="菜品" prop="spuId">
-          <el-select v-model="spuIds" placeholder="请选择菜品" multiple>
-            <el-option v-for="item in foodData" :key="item.id" :label="item.name" :value="item.id"/>
-          </el-select>
-        </el-form-item>
+			<!-- <el-col :span="12" class="mb20">
+				<el-form-item label="归属时间 1早餐 2午餐 3晚餐" prop="hourType">
+					<el-input v-model="form.hourType" placeholder="请输入归属时间 1早餐 2午餐 3晚餐" />
+				</el-form-item>
+			</el-col> -->
+		</el-form>
 
-<!--        <el-col :span="12" class="mb20">
-          <el-form-item label="归属时间 1早餐 2午餐 3晚餐" prop="hourType">
-            <el-input v-model="form.hourType" placeholder="请输入归属时间 1早餐 2午餐 3晚餐"/>
-          </el-form-item>
-        </el-col>-->
-<!--      </el-row>-->
-    </el-form>
-    <template #footer>
-        <span class="dialog-footer">
-          <el-button @click="visible = false">取消</el-button>
-          <el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
-        </span>
-    </template>
-  </el-dialog>
+		<h1 style="font-size: 16px; font-weight: bold; color: #000000; margin: 20px 0">预览图</h1>
+		<div style="width: 100%; display: flex; flex-wrap: wrap">
+			<img style="width: 250px; height: 200px; margin: 10px" v-for="(image, index) in spuImages" :key="index" :src="image" />
+		</div>
+
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="visible = false">取消</el-button>
+				<el-button type="primary" @click="onSubmit" :disabled="loading">确认</el-button>
+			</span>
+		</template>
+	</el-dialog>
 </template>
 
 <script setup lang="ts" name="CanteenDailyMenuDialog">
-import {useDict} from '/@/hooks/dict';
-import {useMessage} from "/@/hooks/message";
-import {getObj, addObj, putObj} from '/@/api/canteen/canteenDailyMenu'
-import {selectFoodList} from "/@/api/canteen/canteenDailyMenu";
-import {rule} from '/@/utils/validate';
+import { useDict } from '/@/hooks/dict';
+import { useMessage } from '/@/hooks/message';
+import { getObj, addObj, putObj } from '/@/api/canteen/canteenDailyMenu';
+import { selectFoodList } from '/@/api/canteen/canteenDailyMenu';
+import { rule } from '/@/utils/validate';
 
 const emit = defineEmits(['refresh']);
 
 //业务变量
-const foodData = ref([])
-const spuIds = ref([])
-const spuImages = ref([])
+const foodData = ref<any>([]);
+const spuIds = ref([]);
+const spuImages = ref<string[]>([]);
 // 定义变量内容
 const dataFormRef = ref();
-const visible = ref(false)
-const loading = ref(false)
+const visible = ref(false);
+const loading = ref(false);
 // 定义字典
-const {daily_menu} = useDict('daily_menu')
+const { daily_menu } = useDict('daily_menu');
+const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
 
 // 提交表单数据
-const form = reactive({
-  id: '',
-  startTime: '',
-  spuId: '',
-  hourType: '',
-  merchantId: '',
-  deptId: '',
-  spuIds:''
+const form = reactive<any>({
+	id: '',
+	startTime: '',
+	spuId: '',
+	hourType: '',
+	merchantId: '',
+	deptId: '',
+	spuIds: '',
 });
 
 // 定义校验规则
-const dataRules = ref({})
+const dataRules = ref({});
 
 // 打开弹窗
-const openDialog = (id: string,time?: string, hourType?: number,merchantId?:number) => {
-  visible.value = true
-  form.id = ''
+const openDialog = (id: string, time?: string, hourType?: number, merchantId?: number) => {
+	visible.value = true;
+	form.id = '';
 
-  // 重置表单数据
-  nextTick(() => {
-    dataFormRef.value?.resetFields();
-  });
-
-  // 获取canteenDailyMenu信息
-  if (id) {
-    form.id = id
-    getcanteenDailyMenuData(id)
-  }
-  if (time) {
-    form.startTime = time
-  }
-  if (hourType) {
-    form.hourType = hourType
-  }
-  form.merchantId = merchantId
+	// 重置表单数据
+	nextTick(() => {
+		dataFormRef.value?.resetFields();
+	});
 
+	// 获取canteenDailyMenu信息
+	if (id) {
+		form.id = id;
+		getcanteenDailyMenuData(id);
+	}
+	if (time) {
+		form.startTime = time;
+	}
+	if (hourType) {
+		form.hourType = hourType;
+	}
+	form.merchantId = merchantId;
 };
 watch(spuIds, (newValue, oldValue) => {
-  spuImages.value = []
-  form.spuIds = newValue
-  //更新值
-  if (newValue) {
-    const newValues = newValue.toString().split(',')
-    for (let index = 0; index < newValues.length; index++) {
-      const data = newValues[index]
-      foodData.value.forEach((sData) => {
-        if (sData.id?.toString() === data) {
-          spuImages.value.push(sData.picUrl?.toString())
-        }
-      })
-    }
-  }
-})
+	spuImages.value = [];
+	form.spuIds = newValue;
+	//更新值
+	if (newValue) {
+		const newValues = newValue.toString().split(',');
+		for (let index = 0; index < newValues.length; index++) {
+			const data = newValues[index];
+			foodData.value.forEach((sData: any) => {
+				if (sData.id?.toString() === data) {
+					spuImages.value.push(imageBaseUrl + sData.picUrl?.toString());
+				}
+			});
+		}
+	}
+});
 // 提交
 const onSubmit = async () => {
-  if (spuIds.value.length<=0){
-    useMessage().warning("请选择菜品")
-    return
-  }
-  const valid = await dataFormRef.value.validate().catch(() => {
-  });
-  if (!valid) return false;
+	if (spuIds.value.length <= 0) {
+		useMessage().warning('请选择菜品');
+		return;
+	}
+	const valid = await dataFormRef.value.validate().catch(() => {});
+	if (!valid) return false;
 
-  try {
-    loading.value = true;
-    form.id ? await putObj(form) : await addObj(form);
-    useMessage().success(form.id ? '修改成功' : '添加成功');
-    visible.value = false;
-    emit('refresh');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  } finally {
-    loading.value = false;
-  }
+	try {
+		loading.value = true;
+		form.id ? await putObj(form) : await addObj(form);
+		useMessage().success(form.id ? '修改成功' : '添加成功');
+		visible.value = false;
+		emit('refresh');
+	} catch (err: any) {
+		useMessage().error(err.msg);
+	} finally {
+		loading.value = false;
+	}
 };
 
-
 // 初始化表单数据
 const getcanteenDailyMenuData = (id: string) => {
-  // 获取数据
-  loading.value = true
-  getObj(id).then((res: any) => {
-    Object.assign(form, res.data)
-  }).finally(() => {
-    loading.value = false
-  })
+	// 获取数据
+	loading.value = true;
+	getObj(id)
+		.then((res: any) => {
+			Object.assign(form, res.data);
+		})
+		.finally(() => {
+			loading.value = false;
+		});
 };
 
 // 暴露变量
 defineExpose({
-  openDialog
+	openDialog,
 });
 /** 初始化 **/
 onMounted(async () => {
-  // 获取菜品列表
-  let axiosResponse = await selectFoodList();
-  foodData.value = axiosResponse.data
-})
+	// 获取菜品列表
+	let axiosResponse = await selectFoodList();
+	foodData.value = axiosResponse.data;
+});
 </script>
diff --git a/src/views/canteen/canteenSpu/index.vue b/src/views/canteen/canteenSpu/index.vue
index 834ab56..0698924 100644
--- a/src/views/canteen/canteenSpu/index.vue
+++ b/src/views/canteen/canteenSpu/index.vue
@@ -105,7 +105,6 @@ const showSearch = ref(true);
 const selectObjs = ref([]) as any;
 const multiple = ref(true);
 const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
-console.log('aa', imageBaseUrl);
 
 const state: BasicTableProps = reactive<BasicTableProps>({
 	queryForm: {},