From 1a8f5192cb0f31e06f7a7e2bd3859528ce7beadd Mon Sep 17 00:00:00 2001
From: ctw <>
Date: Wed, 8 Jan 2025 16:24:57 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E9=83=A8=E5=88=86=E4=BB=B7?=
 =?UTF-8?q?=E6=A0=BC=E6=8D=A2=E7=AE=97=EF=BC=8C=E8=B0=83=E6=95=B4=E9=83=A8?=
 =?UTF-8?q?=E5=88=86=E8=A1=A8=E5=8D=95=E5=B8=83=E5=B1=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env.development                              |  8 +-
 src/api/wallet/mch-manage.ts                  | 74 ++++++++--------
 src/components/Select/SelectCtcgd.vue         | 85 +++++++++++++++++++
 src/components/index.ts                       |  2 +
 src/views/canteen/boxesInfo/form.vue          | 14 +--
 src/views/canteen/boxesInfo/index.vue         | 12 ++-
 src/views/canteen/canteenCategory/form.vue    |  8 +-
 src/views/canteen/canteenCategory/index.vue   | 28 +++---
 src/views/canteen/canteenDailyMenu/index.vue  | 63 ++++++--------
 .../canteen/canteenOnlineCategory/form.vue    |  8 +-
 .../canteen/canteenOnlineCategory/index.vue   |  6 +-
 src/views/canteen/canteenOnlineSpu/form.vue   | 29 ++++---
 src/views/canteen/canteenOnlineSpu/index.vue  | 24 ++++--
 src/views/canteen/canteenSpu/form.vue         | 63 ++++++++------
 src/views/canteen/canteenSpu/index.vue        | 29 +++++--
 15 files changed, 290 insertions(+), 163 deletions(-)
 create mode 100644 src/components/Select/SelectCtcgd.vue

diff --git a/.env.development b/.env.development
index 54dfa3c..577906e 100644
--- a/.env.development
+++ b/.env.development
@@ -10,12 +10,14 @@ ENV = 'development'
 # ADMIN 服务地址
 # VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/
 # VITE_ADMIN_PROXY_PATH = http://pjcloud.center.takin.cc/
-VITE_ADMIN_PROXY_PATH = http://localhost:9999
+# VITE_ADMIN_PROXY_PATH = http://localhost:9999/
+VITE_ADMIN_PROXY_PATH = http://192.168.101.29:9999/ # 邓-本地
 
 # 图片访问基础地址
-# VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api
+# VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089
 # VITE_IMAGE_BASE_PATH = http://pjcloud.center.takin.cc
- VITE_IMAGE_BASE_PATH = http://localhost:9999
+# VITE_IMAGE_BASE_PATH = http://localhost:9999
+VITE_IMAGE_BASE_PATH = http://192.168.101.29:9999 # 邓-本地
 
 # 代码生成服务地址
 VITE_GEN_PROXY_PATH = http://192.168.110.156:5003
diff --git a/src/api/wallet/mch-manage.ts b/src/api/wallet/mch-manage.ts
index 58a1b4b..cf367c0 100644
--- a/src/api/wallet/mch-manage.ts
+++ b/src/api/wallet/mch-manage.ts
@@ -1,50 +1,50 @@
-import request from "/@/utils/request"
+import request from '/@/utils/request';
 
 export function pageJoin(query?: Object) {
-  return request({
-    url: '/wallet/mch-manage/page-join',
-    method: 'get',
-    params: query
-  })
+	return request({
+		url: '/wallet/mch-manage/page-join',
+		method: 'get',
+		params: query,
+	});
 }
 
 export function fetchList(query?: Object) {
-  return request({
-    url: '/wallet/mch-manage/page',
-    method: 'get',
-    params: query
-  })
+	return request({
+		url: '/wallet/mch-manage/page',
+		method: 'get',
+		params: query,
+	});
 }
 
 export function addObj(obj?: Object) {
-  return request({
-    url: '/wallet/mch-manage',
-    method: 'post',
-    data: obj
-  })
+	return request({
+		url: '/wallet/mch-manage',
+		method: 'post',
+		data: obj,
+	});
 }
 
 export function getObj(id?: string) {
-  return request({
-    url: '/wallet/mch-manage/' + id,
-    method: 'get'
-  })
+	return request({
+		url: '/wallet/mch-manage/' + id,
+		method: 'get',
+	});
 }
 
 export function delObjs(ids?: Object) {
-  return request({
-    url: '/wallet/mch-manage',
-    method: 'delete',
-    data: ids
-  })
+	return request({
+		url: '/wallet/mch-manage',
+		method: 'delete',
+		data: ids,
+	});
 }
 
 export function putObj(obj?: Object) {
-  return request({
-    url: '/wallet/mch-manage',
-    method: 'put',
-    data: obj
-  })
+	return request({
+		url: '/wallet/mch-manage',
+		method: 'put',
+		data: obj,
+	});
 }
 
 /**
@@ -52,11 +52,11 @@ export function putObj(obj?: Object) {
  * @param type
  */
 export function selectMerchantList(type?: string) {
-  return request({
-    url: '/wallet/mch-manage/selectMerchantList',
-    method: 'get',
-    params: {
-      type: type
-    }
-  })
+	return request({
+		url: '/wallet/mch-manage/selectMerchantList',
+		method: 'get',
+		params: {
+			type: type,
+		},
+	});
 }
diff --git a/src/components/Select/SelectCtcgd.vue b/src/components/Select/SelectCtcgd.vue
new file mode 100644
index 0000000..c48a8a5
--- /dev/null
+++ b/src/components/Select/SelectCtcgd.vue
@@ -0,0 +1,85 @@
+<template>
+	<el-select
+		style="width: 100%"
+		v-model="state.selectId"
+		:placeholder="props.placeholder"
+		clearable
+		remote-show-suffix
+		filterable
+		remote
+		:remote-method="remoteSearch"
+		:loading="state.loading"
+		@visible-change="(e: boolean) => e && getOptions()"
+	>
+		<el-option v-for="v in state.options" :key="v.id" :label="`${v.name}`" :value="v.id">
+			<!-- <div class="flex items-center">
+				<div class="color-primary">{{ v.name }}</div>
+				<div class="flex items-center just ml5">
+					<el-tag size="small">
+						{{ v.deptName }}
+					</el-tag>
+				</div>
+			</div> -->
+		</el-option>
+	</el-select>
+</template>
+
+<script setup lang="ts" name="select-merchant">
+import { reactive, computed, defineModel, withDefaults, defineProps } from 'vue';
+import { fetchList as getCanteenCategory } from '/@/api/canteen/canteenCategory';
+
+const selectId = defineModel();
+
+export type Props = {
+	placeholder?: string;
+};
+const props = withDefaults(defineProps<Props>(), {
+	placeholder: '请选择',
+});
+
+const queryForm = reactive<any>({
+	current: 1,
+	size: 9999,
+});
+
+const state = reactive<any>({
+	loading: true,
+	selectId: selectId,
+	options: [],
+});
+
+watch(
+	selectId,
+	(newVal, oldValue) => {
+		if (newVal == oldValue) return;
+		state.selectId = newVal;
+		getOptions();
+	},
+	{ immediate: true }
+);
+
+async function getOptions() {
+	try {
+		state.loading = true;
+		const _pa = {
+			...queryForm,
+		};
+		const { data } = await getCanteenCategory(_pa);
+		state.options = data.records ?? [];
+	} finally {
+		setTimeout(() => (state.loading = false), 500);
+	}
+}
+
+function remoteSearch(params: string) {
+	if (params != queryForm.name) {
+		queryForm.name = params;
+		getOptions();
+	}
+}
+
+function clear() {
+	state.selectId = null;
+	getOptions();
+}
+</script>
diff --git a/src/components/index.ts b/src/components/index.ts
index d3f3a02..5d54803 100644
--- a/src/components/index.ts
+++ b/src/components/index.ts
@@ -19,6 +19,7 @@ import SelectWalletType from '/@/components/Select/SelectWalletType.vue';
 import SelectMch from '/@/components/Select/SelectMch.vue';
 import SelectDept from '/@/components/Select/SelectDept.vue';
 import SelectCtcg from '/@/components/Select/SelectCtcg.vue';
+import SelectCtcgd from '/@/components/Select/SelectCtcgd.vue';
 
 // 第三方组件
 import ElementPlus from 'element-plus';
@@ -59,6 +60,7 @@ export default {
 		app.component('SelectMch', SelectMch);
 		app.component('SelectDept', SelectDept);
 		app.component('SelectCtcg', SelectCtcg);
+		app.component('SelectCtcgd', SelectCtcgd);
 
 		// 导入全部的elmenet-plus的图标
 		for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
diff --git a/src/views/canteen/boxesInfo/form.vue b/src/views/canteen/boxesInfo/form.vue
index aa5b34f..6a76685 100644
--- a/src/views/canteen/boxesInfo/form.vue
+++ b/src/views/canteen/boxesInfo/form.vue
@@ -2,28 +2,28 @@
 	<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-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商户" prop="merchantId">
 						<select-mch v-model="form.merchantId" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="包厢名称" prop="name">
 						<el-input v-model="form.name" placeholder="请输入包厢名称" />
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="包厢图片" prop="images">
-						<upload-img v-model="form.images"></upload-img>
+						<upload-img v-model:imageUrl="form.images"></upload-img>
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="容纳人数" prop="capacity">
 						<el-input v-model="form.capacity" placeholder="请输入容纳人数" />
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="12" class="mb20">
+				<el-col :span="24" class="mb20">
 					<el-form-item label="包厢状态" prop="status">
 						<el-radio-group v-model="form.status">
 							<el-radio :label="item.value" v-for="(item, index) in boxes_status" border :key="index">{{ item.label }} </el-radio>
@@ -129,7 +129,9 @@ const getboxesInfoData = (id: string) => {
 	loading.value = true;
 	getObj(id)
 		.then((res: any) => {
-			Object.assign(form, res.data);
+			Object.assign(form, res.data, {
+				status: '' + res.data.status,
+			});
 		})
 		.finally(() => {
 			loading.value = false;
diff --git a/src/views/canteen/boxesInfo/index.vue b/src/views/canteen/boxesInfo/index.vue
index 4990ffd..a59bd3b 100644
--- a/src/views/canteen/boxesInfo/index.vue
+++ b/src/views/canteen/boxesInfo/index.vue
@@ -40,20 +40,24 @@
 				@sort-change="sortChangeHandle"
 			>
 				<el-table-column type="selection" width="40" align="center" />
-				<el-table-column type="index" label="#" width="40" />
+				<el-table-column type="index" label="#" width="50" />
 				<el-table-column prop="name" label="包厢名称" show-overflow-tooltip />
 				<el-table-column prop="capacity" label="容纳人数" show-overflow-tooltip />
 				<el-table-column prop="description" label="包厢描述" show-overflow-tooltip />
 				<el-table-column prop="address" label="包厢地址" show-overflow-tooltip />
-				<el-table-column prop="images" label="包厢图片" show-overflow-tooltip />
+				<el-table-column prop="images" label="包厢图片" show-overflow-tooltip>
+					<template #default="scope">
+						<preview-image :src="scope.row.images" />
+					</template>
+				</el-table-column>
 				<el-table-column prop="status" label="包厢状态" show-overflow-tooltip>
 					<template #default="scope">
-						<dict-tag :options="boxes_status" :value="scope.row.status"></dict-tag>
+						<dict-tag :options="boxes_status" :value="scope.row.status" />
 					</template>
 				</el-table-column>
 				<el-table-column prop="price" label="包厢价格单位分" show-overflow-tooltip />
 				<el-table-column prop="merchantId" label="商户id" show-overflow-tooltip />
-				<el-table-column label="操作" width="150">
+				<el-table-column label="操作" width="150" fixed="right">
 					<template #default="scope">
 						<el-button icon="edit-pen" text type="primary" v-auth="'canteen_boxesInfo_edit'" @click="formDialogRef.openDialog(scope.row.id)">
 							编辑
diff --git a/src/views/canteen/canteenCategory/form.vue b/src/views/canteen/canteenCategory/form.vue
index b38dc3f..0474317 100644
--- a/src/views/canteen/canteenCategory/form.vue
+++ b/src/views/canteen/canteenCategory/form.vue
@@ -2,12 +2,12 @@
 	<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-col :span="24" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="分类名称" prop="name">
 						<el-input v-model="form.name" placeholder="请输入分类名称" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="餐段类型" prop="categoryType">
 						<el-select v-model="form.categoryType" placeholder="请选择餐段类型" multiple>
 							<el-option :value="item.value" :label="item.label" v-for="(item, index) in daily_menu" :key="index"></el-option>
@@ -16,11 +16,11 @@
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="分类图" prop="picUrl">
-						<upload-img v-model="form.picUrl"></upload-img>
+						<upload-img v-model:imageUrl="form.picUrl"></upload-img>
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="24" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="分类排序" prop="sort">
 						<el-input v-model="form.sort" placeholder="请输入分类排序" />
 					</el-form-item>
diff --git a/src/views/canteen/canteenCategory/index.vue b/src/views/canteen/canteenCategory/index.vue
index f00ea30..8641c10 100644
--- a/src/views/canteen/canteenCategory/index.vue
+++ b/src/views/canteen/canteenCategory/index.vue
@@ -7,7 +7,7 @@
 						<el-input placeholder="请输入分类名称" v-model="state.queryForm.name" />
 					</el-form-item>
 					<el-form-item>
-						<el-button icon="search" type="primary" @click="getDataList"> 查询 </el-button>
+						<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
 						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
 					</el-form-item>
 				</el-form>
@@ -18,7 +18,7 @@
 						新 增
 					</el-button>
 					<el-button plain :disabled="multiple" icon="Delete" type="primary" v-auth="'canteen_canteenCategory_del'" @click="handleDelete(selectObjs)">
-						删除
+						删 除
 					</el-button>
 					<right-toolbar
 						v-model:showSearch="showSearch"
@@ -40,22 +40,26 @@
 				@sort-change="sortChangeHandle"
 			>
 				<el-table-column type="selection" width="40" align="center" />
-				<el-table-column type="index" label="#" width="40" />
-				<el-table-column prop="name" label="分类名称" show-overflow-tooltip />
+				<el-table-column type="index" label="#" width="50" />
+				<el-table-column prop="name" label="分类名称" show-overflow-tooltip min-width="100" />
 				<el-table-column prop="categoryType" label="餐段类型" show-overflow-tooltip width="180">
 					<template #default="scope">
 						<dict-tag :options="daily_menu" :value="scope.row.categoryType?.split(',')"></dict-tag>
 					</template>
 				</el-table-column>
-				<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip />
-				<el-table-column prop="createBy" label="创建者" show-overflow-tooltip />
-				<el-table-column prop="updateBy" label="更新者" show-overflow-tooltip />
-				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip />
-				<el-table-column label="操作" width="150">
+				<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip>
 					<template #default="scope">
-						<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenCategory_edit'" @click="formDialogRef.openDialog(scope.row.id)"
-							>编辑</el-button
-						>
+						<preview-image :src="scope.row.picUrl" />
+					</template>
+				</el-table-column>
+				<el-table-column prop="createBy" label="创建者" show-overflow-tooltip min-width="100" />
+				<el-table-column prop="updateBy" label="更新者" show-overflow-tooltip min-width="100" />
+				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
+				<el-table-column label="操作" width="150" fixed="right">
+					<template #default="scope">
+						<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenCategory_edit'" @click="formDialogRef.openDialog(scope.row.id)">
+							编辑
+						</el-button>
 						<el-button icon="delete" text type="primary" v-auth="'canteen_canteenCategory_del'" @click="handleDelete([scope.row.id])">删除</el-button>
 					</template>
 				</el-table-column>
diff --git a/src/views/canteen/canteenDailyMenu/index.vue b/src/views/canteen/canteenDailyMenu/index.vue
index 097fdb9..bdaf4d3 100644
--- a/src/views/canteen/canteenDailyMenu/index.vue
+++ b/src/views/canteen/canteenDailyMenu/index.vue
@@ -29,7 +29,6 @@
 						<img @click="delteData(item.tid)" :src="item.picUrl" class="imageCss" />
 					</td>
 				</tr>
-
 				<tr class="food" style="margin: 0px 5px 5px 0px">
 					<td @click="addFood(2)">中餐</td>
 					<td v-for="(item, index) in foodData2" :key="index">
@@ -44,6 +43,7 @@
 				</tr>
 			</table>
 		</div>
+
 		<!-- 编辑、新增  -->
 		<form-dialog ref="formDialogRef" @success="selectTimeFood" />
 	</div>
@@ -53,11 +53,10 @@
 import { delObjs, selectTimeFoodApi, selectWeekInfo } from '/@/api/canteen/canteenDailyMenu';
 import { useMessage, useMessageBox } from '/@/hooks/message';
 import { useDict } from '/@/hooks/dict';
-import { selectMerchantList } from '/@/api/canteen/merchantInfo';
+import { pageJoin } from '/@/api/wallet/mch-manage';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
 
 const { daily_menu } = useDict('daily_menu');
 // 定义变量内容
@@ -73,14 +72,14 @@ const weekData = reactive({
 const weekParams = reactive({
 	index: 0,
 });
-const foodData1 = ref({});
-const foodData2 = ref({});
-const foodData3 = ref({});
+const foodData1 = ref<any>({});
+const foodData2 = ref<any>({});
+const foodData3 = ref<any>({});
 let isActive = ref(-1);
 let timedata = '';
 const merchantId = ref();
 const merchantStatus = ref(true);
-const merchantInfo = ref([]);
+const merchantInfo = ref<any>([]);
 let tableWitch = 1000;
 
 const addFood = async (hourType: number) => {
@@ -136,7 +135,7 @@ const selectTimeFood = async () => {
 	//最大长度
 	let count = 0;
 	const result = await selectTimeFoodApi(params);
-	result.data.forEach((r) => {
+	result.data.forEach((r: any) => {
 		if (r.dailyMenuVOS.length > count) {
 			count = r.dailyMenuVOS.length;
 		}
@@ -167,45 +166,35 @@ const delteData = async (tid: number) => {
 };
 
 // 删除操作
-const handleDelete = async (ids: string[]) => {
-	try {
-		await useMessageBox().confirm('此操作将永久删除');
-	} catch {
-		return;
-	}
+// const handleDelete = async (ids: string[]) => {
+// 	try {
+// 		await useMessageBox().confirm('此操作将永久删除');
+// 	} catch {
+// 		return;
+// 	}
 
-	try {
-		await delObjs(ids);
-		// getDataList();
-		useMessage().success('删除成功');
-	} catch (err: any) {
-		useMessage().error(err.msg);
-	}
-};
-/** 查询列表 */
-// const getList = async () => {
-//   loading.value = true
-//   try {
-//     const data = await fetchList(queryParams)
-//     list.value = data.list
-//     total.value = data.total
-//   } finally {
-//     loading.value = false
-//   }
-// }
+// 	try {
+// 		await delObjs(ids);
+// 		// getDataList();
+// 		useMessage().success('删除成功');
+// 	} catch (err: any) {
+// 		useMessage().error(err.msg);
+// 	}
+// };
 
 /** 初始化下拉框 */
 const merchantInit = async () => {
-	// 获取下拉框
-	let res = await selectMerchantList('1');
-	merchantInfo.value = res.data;
+	// 获取下拉框选项
+	let res = await pageJoin({ current: 1, size: 9999 });
+	merchantInfo.value = res.data.records;
+
 	//默认选中第一个
 	if (merchantInfo.value) {
 		merchantId.value = merchantInfo.value[0].id;
+
 		if (merchantInfo.value.length > 1) {
 			merchantStatus.value = false;
 		}
-		// getList()
 		fetchData();
 	}
 };
diff --git a/src/views/canteen/canteenOnlineCategory/form.vue b/src/views/canteen/canteenOnlineCategory/form.vue
index 3116164..83be525 100644
--- a/src/views/canteen/canteenOnlineCategory/form.vue
+++ b/src/views/canteen/canteenOnlineCategory/form.vue
@@ -2,22 +2,22 @@
 	<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-col :span="24" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商户" prop="merchantId">
 						<select-mch v-model="form.merchantId" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="分类名称" prop="name">
 						<el-input v-model="form.name" placeholder="请输入分类名称" />
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="分类图" prop="picUrl">
-						<upload-img v-model="form.picUrl"></upload-img>
+						<upload-img v-model:imageUrl="form.picUrl" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="分类排序" prop="sort">
 						<el-input-number v-model="form.sort" placeholder="请输入分类排序" />
 					</el-form-item>
diff --git a/src/views/canteen/canteenOnlineCategory/index.vue b/src/views/canteen/canteenOnlineCategory/index.vue
index 6f2ba8f..9c04360 100644
--- a/src/views/canteen/canteenOnlineCategory/index.vue
+++ b/src/views/canteen/canteenOnlineCategory/index.vue
@@ -50,8 +50,8 @@
 				<el-table-column type="index" label="#" width="40" />
 				<el-table-column prop="name" label="分类名称" show-overflow-tooltip />
 				<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip>
-					<template #default="scope">
-						<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
+					<template #default="{ row }">
+						<preview-image :src="row.picUrl" />
 					</template>
 				</el-table-column>
 				<el-table-column prop="sort" label="分类排序" show-overflow-tooltip />
@@ -86,10 +86,8 @@ import { BasicTableProps, useTable } from '/@/hooks/table';
 import { fetchList, delObjs } from '/@/api/canteen/canteenOnlineCategory';
 import { useMessage, useMessageBox } from '/@/hooks/message';
 
-const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
 
 // 定义变量内容
 const formDialogRef = ref();
diff --git a/src/views/canteen/canteenOnlineSpu/form.vue b/src/views/canteen/canteenOnlineSpu/form.vue
index 4465c98..42eb444 100644
--- a/src/views/canteen/canteenOnlineSpu/form.vue
+++ b/src/views/canteen/canteenOnlineSpu/form.vue
@@ -2,52 +2,52 @@
 	<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="110px" v-loading="loading">
 			<el-row :gutter="24">
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商户" prop="merchantId">
 						<select-mch v-model="form.merchantId" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品名称" prop="name">
 						<el-input v-model="form.name" placeholder="请输入商品名称" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品分类" prop="categoryId">
 						<select-ctcg v-model="form.categoryId" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品价格" prop="price">
 						<el-input-number v-model="form.price" :precision="2" placeholder="请输入商品价格" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="市场价" prop="marketPrice">
 						<el-input-number v-model="form.marketPrice" :precision="2" placeholder="请输入市场价" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="库存" prop="stock">
 						<el-input-number v-model="form.stock" placeholder="请输入库存" />
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商品封面图" prop="picUrl">
-						<upload-img v-model:imageUrl="form.picUrl"></upload-img>
+						<upload-img v-model:imageUrl="form.picUrl" />
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商品轮播图" prop="sliderPicUrls">
-						<upload-imgs v-model="form.sliderPicUrls"></upload-imgs>
+						<upload-imgs v-model="form.sliderPicUrls" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="排序字段" prop="sort">
 						<el-input-number v-model="form.sort" placeholder="请输入排序字段" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="24" class="mb20">
 					<el-form-item label="商品状态" prop="status">
 						<el-radio-group v-model="form.status">
 							<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }} </el-radio>
@@ -56,11 +56,12 @@
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商品详情" prop="description">
-						<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情"></editor>
+						<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情" />
 					</el-form-item>
 				</el-col>
 			</el-row>
 		</el-form>
+
 		<template #footer>
 			<span class="dialog-footer">
 				<el-button @click="visible = false">取消</el-button>
@@ -91,7 +92,7 @@ const form = reactive({
 	merchantId: '',
 	name: '',
 	introduction: '',
-	description: '',
+	description: '<p></p>',
 	categoryId: '',
 	picUrl: '',
 	sliderPicUrls: '',
@@ -160,8 +161,8 @@ const getcanteenOnlineSpuData = (id: string) => {
 	getObj(id)
 		.then((res: any) => {
 			Object.assign(form, res.data, {
-				price: displayPrice(res.data.price, ''),
-				marketPrice: displayPrice(res.data.marketPrice, ''),
+				price: Number(displayPrice(res.data.price, '')),
+				marketPrice: Number(displayPrice(res.data.marketPrice, '')),
 			});
 		})
 		.finally(() => {
diff --git a/src/views/canteen/canteenOnlineSpu/index.vue b/src/views/canteen/canteenOnlineSpu/index.vue
index 39df1c2..fb305f9 100644
--- a/src/views/canteen/canteenOnlineSpu/index.vue
+++ b/src/views/canteen/canteenOnlineSpu/index.vue
@@ -52,10 +52,14 @@
 				<el-table-column type="selection" width="40" align="center" />
 				<el-table-column type="index" label="#" width="50" />
 				<el-table-column prop="name" label="商品名称" show-overflow-tooltip min-width="100" />
-				<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip min-width="100" />
+				<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip min-width="100">
+					<template #default="{ row }">
+						{{ categoryOptions?.find((item: any) => item?.id === row?.categoryId)?.name }}
+					</template>
+				</el-table-column>
 				<el-table-column prop="picUrl" label="商品封面图" show-overflow-tooltip min-width="100">
 					<template #default="scope">
-						<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
+						<preview-image :src="scope.row.picUrl" />
 					</template>
 				</el-table-column>
 				<el-table-column prop="sort" label="排序字段" show-overflow-tooltip min-width="100" />
@@ -102,11 +106,10 @@ import { fetchList, delObjs } from '/@/api/canteen/canteenOnlineSpu';
 import { useMessage, useMessageBox } from '/@/hooks/message';
 import { useDict } from '/@/hooks/dict';
 import { displayPrice } from '/@/utils/formatMoney';
+import { fetchList as getCanteenOnlineCategory } from '/@/api/canteen/canteenOnlineCategory';
 
-const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
 
 const { spu_status } = useDict('spu_status');
 // 定义变量内容
@@ -117,13 +120,22 @@ const showSearch = ref(true);
 // 多选变量
 const selectObjs = ref([]) as any;
 const multiple = ref(true);
-
+const categoryOptions = ref<any>([]); // 商品分类选项
 const state: BasicTableProps = reactive<BasicTableProps>({
 	queryForm: {},
 	pageList: fetchList,
 });
 
-//  table hook
+onMounted(async () => {
+	try {
+		const res = await getCanteenOnlineCategory();
+		categoryOptions.value = res.data.records;
+	} catch (error) {
+		categoryOptions.value = [];
+	}
+});
+
+// table hook
 const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
 
 // 清空搜索条件
diff --git a/src/views/canteen/canteenSpu/form.vue b/src/views/canteen/canteenSpu/form.vue
index 9bdcda4..2f25823 100644
--- a/src/views/canteen/canteenSpu/form.vue
+++ b/src/views/canteen/canteenSpu/form.vue
@@ -2,24 +2,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-row :gutter="24">
-				<el-col :span="24" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商户" prop="merchantId">
 						<select-mch v-model="form.merchantId" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品名称" prop="name">
 						<el-input v-model="form.name" placeholder="请输入商品名称" />
 					</el-form-item>
 				</el-col>
-				<el-col :span="12" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品分类" prop="categoryId">
-						<select-ctcg v-model="form.categoryId" />
+						<select-ctcgd v-model="form.categoryId" />
 					</el-form-item>
 				</el-col>
 				<el-col :span="24" class="mb20">
 					<el-form-item label="商品封面图" prop="picUrl">
-						<upload-img v-model:imageUrl="form.picUrl"></upload-img>
+						<upload-img v-model:imageUrl="form.picUrl" />
 					</el-form-item>
 				</el-col>
 				<!--				<el-col :span="12" class="mb20">-->
@@ -34,35 +34,35 @@
 				<!--					</el-form-item>-->
 				<!--				</el-col>-->
 
-				<el-col :span="8" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="排序" prop="sort">
 						<el-input v-model="form.sort" placeholder="请输入排序" />
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="8" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品状态" prop="status">
 						<el-radio-group v-model="form.status">
-							<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }} </el-radio>
+							<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }}</el-radio>
 						</el-radio-group>
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="8" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="商品价格" prop="price">
-						<el-input v-model="form.price" placeholder="请输入商品价格" />
+						<el-input-number v-model="form.price" :precision="2" placeholder="请输入商品价格" />
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="8" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="市场价" prop="marketPrice">
-						<el-input v-model="form.marketPrice" placeholder="请输入市场价" />
+						<el-input-number v-model="form.marketPrice" :precision="2" placeholder="请输入市场价" />
 					</el-form-item>
 				</el-col>
 
-				<el-col :span="8" class="mb20">
+				<el-col :span="14" class="mb20">
 					<el-form-item label="库存" prop="stock">
-						<el-input v-model="form.stock" placeholder="请输入库存" />
+						<el-input-number v-model="form.stock" placeholder="请输入库存" />
 					</el-form-item>
 				</el-col>
 
@@ -100,6 +100,7 @@ import { useMessage } from '/@/hooks/message';
 import { getObj, addObj, putObj } from '/@/api/canteen/canteenSpu';
 import { getAllSimple } from '/@/api/canteen/canteenCategory';
 import { rule } from '/@/utils/validate';
+import { displayPrice, storePrice } from '/@/utils/formatMoney';
 const emit = defineEmits(['refresh']);
 
 // 定义变量内容
@@ -121,10 +122,10 @@ const form = reactive({
 	sliderPicUrls: '',
 	sort: '',
 	status: '0',
-	price: '',
-	marketPrice: '',
+	price: 0,
+	marketPrice: 0,
 	costPrice: '',
-	stock: '',
+	stock: 0,
 	giveIntegral: '',
 	salesCount: '',
 	virtualSalesCount: '',
@@ -134,14 +135,25 @@ const form = reactive({
 
 // 定义校验规则
 const dataRules = ref({
+	categoryId: [{ required: true, message: '商品分类不能为空', trigger: 'blur' }],
 	merchantId: [{ required: true, message: '商户不能为空', trigger: 'blur' }],
 	name: [{ required: true, message: '商品名称不能为空', trigger: 'blur' }],
 	picUrl: [{ required: true, message: '商品封面图不能为空', trigger: 'blur' }],
+	status: [{ required: true, message: '商品状态不能为空', trigger: 'blur' }],
 	sort: [{ validator: rule.number, trigger: 'blur' }],
-	price: [{ validator: rule.number, trigger: 'blur' }],
-	marketPrice: [{ validator: rule.number, trigger: 'blur' }],
+	price: [
+		{ validator: rule.number, trigger: 'blur' },
+		{ required: true, message: '商品状态不能为空', trigger: 'blur' },
+	],
+	marketPrice: [
+		{ validator: rule.number, trigger: 'blur' },
+		{ required: true, message: '商品状态不能为空', trigger: 'blur' },
+	],
 	costPrice: [{ validator: rule.number, trigger: 'blur' }],
-	stock: [{ validator: rule.number, trigger: 'blur' }],
+	stock: [
+		{ validator: rule.number, trigger: 'blur' },
+		{ required: true, message: '商品状态不能为空', trigger: 'blur' },
+	],
 	giveIntegral: [{ validator: rule.number, trigger: 'blur' }],
 	salesCount: [{ validator: rule.number, trigger: 'blur' }],
 	virtualSalesCount: [{ validator: rule.number, trigger: 'blur' }],
@@ -164,14 +176,13 @@ const openDialog = async (id: string) => {
 
 // 提交
 const onSubmit = async () => {
-	console.log(form);
-
 	const valid = await dataFormRef?.value.validate().catch(() => {});
 	if (!valid) return false;
 
 	try {
 		loading.value = true;
-		form.id ? await putObj(form) : await addObj(form);
+		const _pa = { ...form, price: storePrice(form.price), marketPrice: storePrice(form.marketPrice) };
+		form.id ? await putObj(_pa) : await addObj(_pa);
 		useMessage().success(form.id ? '修改成功' : '添加成功');
 		visible.value = false;
 		emit('refresh');
@@ -188,7 +199,11 @@ const getcanteenSpuData = (id: string) => {
 	loading.value = true;
 	getObj(id)
 		.then((res: any) => {
-			Object.assign(form, res.data);
+			Object.assign(form, res.data, {
+				price: Number(displayPrice(res.data.price, '')),
+				marketPrice: Number(displayPrice(res.data.marketPrice, '')),
+				status: '' + res.data.status,
+			});
 		})
 		.finally(() => {
 			loading.value = false;
diff --git a/src/views/canteen/canteenSpu/index.vue b/src/views/canteen/canteenSpu/index.vue
index 0c10a95..a90d2b7 100644
--- a/src/views/canteen/canteenSpu/index.vue
+++ b/src/views/canteen/canteenSpu/index.vue
@@ -43,19 +43,23 @@
 				@sort-change="sortChangeHandle"
 			>
 				<el-table-column type="selection" width="40" align="center" />
-				<el-table-column type="index" label="#" width="40" />
+				<el-table-column type="index" label="#" width="50" />
 				<el-table-column prop="name" label="商品名称" width="120px" show-overflow-tooltip />
-				<el-table-column prop="categoryId" label="商品分类编号" width="120px" show-overflow-tooltip />
+				<el-table-column prop="categoryId" label="商品分类" width="100px" show-overflow-tooltip>
+					<template #default="{ row }">
+						{{ categoryOptions?.find((item: any) => item?.id === row?.categoryId)?.name }}
+					</template>
+				</el-table-column>
 				<el-table-column prop="picUrl" label="商品封面图" align="center" width="160px" show-overflow-tooltip>
 					<template #default="scope">
-						<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
+						<preview-image :src="scope.row.picUrl" />
 					</template>
 				</el-table-column>
 				<!-- <el-table-column prop="sliderPicUrls" label="商品轮播图" show-overflow-tooltip /> -->
 				<el-table-column prop="sort" label="排序字段" show-overflow-tooltip />
 				<el-table-column prop="status" label="上架状态" show-overflow-tooltip>
 					<template #default="scope">
-						<dict-tag :options="spu_status" :value="scope.row.status"></dict-tag>
+						<dict-tag :options="spu_status" :value="scope.row.status" />
 					</template>
 				</el-table-column>
 				<el-table-column prop="price" label="商品价格" show-overflow-tooltip>
@@ -73,7 +77,7 @@
 				<!-- <el-table-column prop="giveIntegral" label="赠送积分" show-overflow-tooltip /> -->
 				<el-table-column prop="salesCount" label="商品销量" show-overflow-tooltip />
 				<!-- <el-table-column prop="virtualSalesCount" label="虚拟销量" show-overflow-tooltip /> -->
-				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip />
+				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
 				<el-table-column label="操作" width="150" fixed="right">
 					<template #default="scope">
 						<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenSpu_edit'" @click="formDialogRef?.openDialog(scope.row.id)">
@@ -97,10 +101,10 @@ import { fetchList, delObjs } from '/@/api/canteen/canteenSpu';
 import { useMessage, useMessageBox } from '/@/hooks/message';
 import { useDict } from '/@/hooks/dict';
 import { displayPrice } from '/@/utils/formatMoney';
+import { fetchList as getCanteenCategory } from '/@/api/canteen/canteenCategory';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
 
 const { spu_status } = useDict('spu_status');
 // 定义变量内容
@@ -111,14 +115,23 @@ const showSearch = ref(true);
 // 多选变量
 const selectObjs = ref([]) as any;
 const multiple = ref(true);
-const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
+const categoryOptions = ref<any>([]); // 商品分类选项
 
 const state: BasicTableProps = reactive<BasicTableProps>({
 	queryForm: {},
 	pageList: fetchList,
 });
 
-//  table hook
+onMounted(async () => {
+	try {
+		const res = await getCanteenCategory();
+		categoryOptions.value = res.data.records;
+	} catch (error) {
+		categoryOptions.value = [];
+	}
+});
+
+// table hook
 const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
 
 // 清空搜索条件