diff --git a/.env.prod b/.env.prod
index ab3a7e0..eca740b 100644
--- a/.env.prod
+++ b/.env.prod
@@ -5,10 +5,13 @@ VITE_PORT = 8888
 VITE_OPEN = true
 
 # 本地环境
-ENV = 'development'
+ENV = 'prod'
 
 # ADMIN 服务地址
-VITE_ADMIN_PROXY_PATH = http://192.168.110.156:9999
+VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089
+
+# 图片访问基础地址
+VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api
 
 # 代码生成服务地址
-VITE_GEN_PROXY_PATH = http://192.168.110.156:5003
+VITE_GEN_PROXY_PATH = http://123.156.230.15:5003
diff --git a/package.json b/package.json
index 0b85dab..8c4350c 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
 	"scripts": {
 		"dev": "vite --force",
 		"build": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build",
-		"build:prod": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build",
+		"build:prod": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build --mode prod",
 		"build:docker": "cross-env NODE_OPTIONS=--max-old-space-size=4096 vite build --outDir ./docker/dist/",
 		"lint:eslint": "eslint --fix --ext .js,.ts,.vue ./src",
 		"prettier": "prettier --write ."
diff --git a/src/api/admin/menu.ts b/src/api/admin/menu.ts
index 714b93b..25cc670 100644
--- a/src/api/admin/menu.ts
+++ b/src/api/admin/menu.ts
@@ -1,50 +1,50 @@
 import request from '/@/utils/request';
 
 export const pageList = (params?: Object) => {
-    return request({
-        url: '/admin/menu/tree',
-        method: 'get',
-        params,
-    });
+	return request({
+		url: '/admin/menu/tree',
+		method: 'get',
+		params,
+	});
 };
 
 export const getObj = (obj: object) => {
-    return request({
-        url: `/admin/menu/details`,
-        method: 'get',
-        params: obj
-    });
+	return request({
+		url: `/admin/menu/details`,
+		method: 'get',
+		params: obj,
+	});
 };
 
 export const save = (data: Object) => {
-    return request({
-        url: '/admin/menu',
-        method: 'post',
-        data: data,
-    });
+	return request({
+		url: '/admin/menu',
+		method: 'post',
+		data: data,
+	});
 };
 
 export const putObj = (data: Object) => {
-    return request({
-        url: '/admin/menu',
-        method: 'put',
-        data: data,
-    });
+	return request({
+		url: '/admin/menu',
+		method: 'put',
+		data: data,
+	});
 };
 
 export const addObj = (data: Object) => {
-    return request({
-        url: '/admin/menu',
-        method: 'post',
-        data: data,
-    });
+	return request({
+		url: '/admin/menu',
+		method: 'post',
+		data: data,
+	});
 };
 
 export const delObj = (id: string) => {
-    return request({
-        url: '/admin/menu/' + id,
-        method: 'delete',
-    });
+	return request({
+		url: '/admin/menu/' + id,
+		method: 'delete',
+	});
 };
 
 /**
@@ -52,27 +52,27 @@ export const delObj = (id: string) => {
  * @method getAdminMenu 获取后端动态路由菜单(admin)
  */
 export function useMenuApi() {
-    return {
-        getAdminMenu: (params?: object) => {
-            return request({
-                url: '/admin/menu',
-                method: 'get',
-                params,
-            });
-        },
-    };
+	return {
+		getAdminMenu: (params?: object): any => {
+			return request({
+				url: '/admin/menu',
+				method: 'get',
+				params,
+			});
+		},
+	};
 }
 
 export function validateExist(rule: any, value: any, callback: any, isEdit: boolean) {
-    if (isEdit) {
-        return callback();
-    }
-    getObj({[rule.field]: value}).then((response) => {
-        const result = response.data;
-        if (result !== null && result.length > 0) {
-            callback(new Error('数据已经存在'));
-        } else {
-            callback();
-        }
-    });
+	if (isEdit) {
+		return callback();
+	}
+	getObj({ [rule.field]: value }).then((response) => {
+		const result = response.data;
+		if (result !== null && result.length > 0) {
+			callback(new Error('数据已经存在'));
+		} else {
+			callback();
+		}
+	});
 }
diff --git a/src/api/supermarket/supermarketCategory.ts b/src/api/supermarket/supermarketCategory.ts
new file mode 100644
index 0000000..f1f3e39
--- /dev/null
+++ b/src/api/supermarket/supermarketCategory.ts
@@ -0,0 +1,41 @@
+import request from "/@/utils/request"
+
+export function fetchList(query?: Object) {
+  return request({
+    url: '/supermarket/supermarketCategory/page',
+    method: 'get',
+    params: query
+  })
+}
+
+export function addObj(obj?: Object) {
+  return request({
+    url: '/supermarket/supermarketCategory',
+    method: 'post',
+    data: obj
+  })
+}
+
+export function getObj(id?: string) {
+  return request({
+    url: '/supermarket/supermarketCategory/' + id,
+    method: 'get'
+  })
+}
+
+export function delObjs(ids?: Object) {
+  return request({
+    url: '/supermarket/supermarketCategory',
+    method: 'delete',
+    data: ids
+  })
+}
+
+export function putObj(obj?: Object) {
+  return request({
+    url: '/supermarket/supermarketCategory',
+    method: 'put',
+    data: obj
+  })
+}
+
diff --git a/src/api/supermarket/supermarketSpu.ts b/src/api/supermarket/supermarketSpu.ts
index 22c1aa6..0e51f14 100644
--- a/src/api/supermarket/supermarketSpu.ts
+++ b/src/api/supermarket/supermarketSpu.ts
@@ -1,41 +1,54 @@
-import request from "/@/utils/request"
+import request from '/@/utils/request';
 
 export function fetchList(query?: Object) {
-  return request({
-    url: '/supermarket/supermarketSpu/page',
-    method: 'get',
-    params: query
-  })
+	return request({
+		url: '/supermarket/supermarketSpu/page',
+		method: 'get',
+		params: query,
+	});
 }
 
 export function addObj(obj?: Object) {
-  return request({
-    url: '/supermarket/supermarketSpu',
-    method: 'post',
-    data: obj
-  })
+	return request({
+		url: '/supermarket/supermarketSpu',
+		method: 'post',
+		data: obj,
+	});
 }
 
 export function getObj(id?: string) {
-  return request({
-    url: '/supermarket/supermarketSpu/' + id,
-    method: 'get'
-  })
+	return request({
+		url: '/supermarket/supermarketSpu/' + id,
+		method: 'get',
+	});
 }
 
 export function delObjs(ids?: Object) {
-  return request({
-    url: '/supermarket/supermarketSpu',
-    method: 'delete',
-    data: ids
-  })
+	return request({
+		url: '/supermarket/supermarketSpu',
+		method: 'delete',
+		data: ids,
+	});
 }
 
 export function putObj(obj?: Object) {
-  return request({
-    url: '/supermarket/supermarketSpu',
-    method: 'put',
-    data: obj
-  })
+	return request({
+		url: '/supermarket/supermarketSpu',
+		method: 'put',
+		data: obj,
+	});
 }
 
+export function getSupermarketCategory(): any {
+	return request({
+		url: '/supermarket/supermarketCategory/simpleAll',
+		method: 'get',
+	});
+}
+
+export function getSupermarketBrand(): any {
+	return request({
+		url: '/supermarket/supermarketBrand/simpleAll',
+		method: 'get',
+	});
+}
diff --git a/src/api/supermarket/supermarketUnit.ts b/src/api/supermarket/supermarketUnit.ts
new file mode 100644
index 0000000..88f56d1
--- /dev/null
+++ b/src/api/supermarket/supermarketUnit.ts
@@ -0,0 +1,40 @@
+import request from '/@/utils/request';
+
+export function fetchList(query?: Object) {
+	return request({
+		url: '/supermarket/supermarketUnit/page',
+		method: 'get',
+		params: query,
+	});
+}
+
+export function addObj(obj?: Object) {
+	return request({
+		url: '/supermarket/supermarketUnit',
+		method: 'post',
+		data: obj,
+	});
+}
+
+export function getObj(id?: string) {
+	return request({
+		url: '/supermarket/supermarketUnit/' + id,
+		method: 'get',
+	});
+}
+
+export function delObjs(ids?: Object) {
+	return request({
+		url: '/supermarket/supermarketUnit',
+		method: 'delete',
+		data: ids,
+	});
+}
+
+export function putObj(obj?: Object) {
+	return request({
+		url: '/supermarket/supermarketUnit',
+		method: 'put',
+		data: obj,
+	});
+}
diff --git a/src/api/supermarketerp/smErpSupplier.ts b/src/api/supermarketerp/smErpSupplier.ts
index 423b0c4..034bc16 100644
--- a/src/api/supermarketerp/smErpSupplier.ts
+++ b/src/api/supermarketerp/smErpSupplier.ts
@@ -1,41 +1,47 @@
-import request from "/@/utils/request"
+import request from '/@/utils/request';
 
 export function fetchList(query?: Object) {
-  return request({
-    url: '/supermarketerp/smErpSupplier/page',
-    method: 'get',
-    params: query
-  })
+	return request({
+		url: '/supermarketerp/smErpSupplier/page',
+		method: 'get',
+		params: query,
+	});
 }
 
 export function addObj(obj?: Object) {
-  return request({
-    url: '/supermarketerp/smErpSupplier',
-    method: 'post',
-    data: obj
-  })
+	return request({
+		url: '/supermarketerp/smErpSupplier',
+		method: 'post',
+		data: obj,
+	});
 }
 
 export function getObj(id?: string) {
-  return request({
-    url: '/supermarketerp/smErpSupplier/' + id,
-    method: 'get'
-  })
+	return request({
+		url: '/supermarketerp/smErpSupplier/' + id,
+		method: 'get',
+	});
 }
 
 export function delObjs(ids?: Object) {
-  return request({
-    url: '/supermarketerp/smErpSupplier',
-    method: 'delete',
-    data: ids
-  })
+	return request({
+		url: '/supermarketerp/smErpSupplier',
+		method: 'delete',
+		data: ids,
+	});
 }
 
 export function putObj(obj?: Object) {
-  return request({
-    url: '/supermarketerp/smErpSupplier',
-    method: 'put',
-    data: obj
-  })
+	return request({
+		url: '/supermarketerp/smErpSupplier',
+		method: 'put',
+		data: obj,
+	});
 }
 
+export function getSupplierTypeOptions(): any {
+	return request({
+		url: '/supermarketerp/smErpSupplierType/simpleAll',
+		method: 'get',
+	});
+}
diff --git a/src/components/TagList/index.vue b/src/components/TagList/index.vue
index bc5067d..32f55bd 100644
--- a/src/components/TagList/index.vue
+++ b/src/components/TagList/index.vue
@@ -1,50 +1,43 @@
 <template>
-  <div class="flex flex-wrap items-center gap-2 max-w-full">
-    <el-tag
-        v-for="tag in tags"
-        :key="tag"
-        :type="tagType"
-        closable
-        :disable-transitions="false"
-        @close="handleClose(tag)"
-    >
-      {{ tag }}
-    </el-tag>
-    <el-input
-        v-if="inputVisible"
-        ref="InputRef"
-        v-model="inputValue"
-        class="w-20"
-        size="small"
-        @keyup.enter="handleInputConfirm"
-        @blur="handleInputConfirm"
-    />
-    <el-button v-else class="button-new-tag" size="small" @click="showInput">
-      {{ buttonText }}
-    </el-button>
-  </div>
+	<div class="flex flex-wrap items-center gap-2 max-w-full">
+		<el-tag v-for="tag in tags" :key="tag" :type="tagType" closable :disable-transitions="false" @close="handleClose(tag)">
+			{{ tag }}
+		</el-tag>
+		<el-input
+			v-if="inputVisible"
+			ref="InputRef"
+			v-model="inputValue"
+			class="w-20"
+			size="small"
+			@keyup.enter="handleInputConfirm"
+			@blur="handleInputConfirm"
+		/>
+		<el-button v-else class="button-new-tag" size="small" @click="showInput">
+			{{ buttonText }}
+		</el-button>
+	</div>
 </template>
 
 <script lang="ts" setup>
-import {ref, nextTick, defineProps, defineEmits} from 'vue';
-import {ElInput} from 'element-plus';
+import { ref, nextTick } from 'vue';
+import { ElInput } from 'element-plus';
 
 const props = defineProps({
-  modelValue: {
-    type: Array as () => string[],
-    default: () => []
-  },
-  buttonText: {
-    type: String,
-    default: '+ New Tag'
-  },
-  tagType: {
-    type: String,
-    default: 'primary',
-    validator: (value: string) => {
-      return ['primary', 'success', 'info', 'warning', 'danger'].includes(value);
-    }
-  }
+	modelValue: {
+		type: Array as () => string[],
+		default: () => [],
+	},
+	buttonText: {
+		type: String,
+		default: '+ New Tag',
+	},
+	tagType: {
+		type: String,
+		default: 'primary',
+		validator: (value: string) => {
+			return ['primary', 'success', 'info', 'warning', 'danger'].includes(value);
+		},
+	},
 });
 
 const emits = defineEmits(['update:modelValue']);
@@ -56,27 +49,30 @@ const InputRef = ref<InstanceType<typeof ElInput>>();
 const tags = ref([...props.modelValue]);
 
 const handleClose = (tag: string) => {
-  tags.value.splice(tags.value.indexOf(tag), 1);
-  emits('update:modelValue', tags.value);
+	tags.value.splice(tags.value.indexOf(tag), 1);
+	emits('update:modelValue', tags.value);
 };
 
-watch(() => props.modelValue, (val) => {
-  tags.value = val;
-});
+watch(
+	() => props.modelValue,
+	(val) => {
+		tags.value = val;
+	}
+);
 
 const showInput = () => {
-  inputVisible.value = true;
-  nextTick(() => {
-    InputRef.value!.input!.focus();
-  });
+	inputVisible.value = true;
+	nextTick(() => {
+		InputRef.value!.input!.focus();
+	});
 };
 
 const handleInputConfirm = () => {
-  if (inputValue.value) {
-    tags.value.push(inputValue.value);
-    emits('update:modelValue', tags.value);
-  }
-  inputVisible.value = false;
-  inputValue.value = '';
+	if (inputValue.value) {
+		tags.value.push(inputValue.value);
+		emits('update:modelValue', tags.value);
+	}
+	inputVisible.value = false;
+	inputValue.value = '';
 };
 </script>
diff --git a/src/components/Upload/Image.vue b/src/components/Upload/Image.vue
index 080625b..5388b76 100644
--- a/src/components/Upload/Image.vue
+++ b/src/components/Upload/Image.vue
@@ -72,7 +72,7 @@ interface UploadFileProps {
 	borderRadius?: string; // 组件边框圆角 ==> 非必传（默认为 8px）
 	iconSize?: number;
 	dir?: string; // 文件目录
-	listType: string;
+	listType?: string;
 }
 
 // 接受父组件参数
diff --git a/src/i18n/lang/en.ts b/src/i18n/lang/en.ts
index 5736056..04ef22d 100644
--- a/src/i18n/lang/en.ts
+++ b/src/i18n/lang/en.ts
@@ -1,5 +1,10 @@
 export default {
 	router: {
+		systemManagement: 'systemManagement',
+		bizPlatform: 'bizPlatform',
+		baseTools: 'baseTools',
+		collaborativeOffic: 'collaborativeOffic',
+		platformDevelop: 'platformDevelop',
 		home: 'Home',
 		system: 'System',
 		systemMenu: 'System Menu',
@@ -115,7 +120,7 @@ export default {
 		fullscreen: 'Fullscreen',
 		closeFullscreen: 'Close Fullscreen',
 		favorite: 'Favorite',
-		favoriteMax: 'The number of shortcut navigation exceeds the upper limit. Please remove some shortcuts'
+		favoriteMax: 'The number of shortcut navigation exceeds the upper limit. Please remove some shortcuts',
 	},
 	notFound: {
 		foundTitle: 'Wrong Address Input, Please Re-enter the Address~',
diff --git a/src/i18n/lang/zh-cn.ts b/src/i18n/lang/zh-cn.ts
index 7c85e50..e351e8e 100644
--- a/src/i18n/lang/zh-cn.ts
+++ b/src/i18n/lang/zh-cn.ts
@@ -1,6 +1,11 @@
 // 定义内容
 export default {
 	router: {
+		systemManagement: '系统管理',
+		bizPlatform: '业务平台',
+		baseTools: '基础工具',
+		collaborativeOffic: '协同办公',
+		platformDevelop: '开发平台',
 		home: '首页',
 		system: '系统设置',
 		systemMenu: '菜单管理',
@@ -108,7 +113,7 @@ export default {
 		fullscreen: '当前页全屏',
 		closeFullscreen: '关闭全屏',
 		favorite: '收藏',
-		favoriteMax: '快捷导航数量超过上限，请移除部分'
+		favoriteMax: '快捷导航数量超过上限，请移除部分',
 	},
 	notFound: {
 		foundTitle: '地址输入错误，请重新输入地址~',
diff --git a/src/views/admin/system/menu/form.vue b/src/views/admin/system/menu/form.vue
index 0cf2666..d694fe1 100644
--- a/src/views/admin/system/menu/form.vue
+++ b/src/views/admin/system/menu/form.vue
@@ -1,127 +1,138 @@
 <template>
-  <el-dialog
-      :title="state.ruleForm.menuId ? $t('common.editBtn') : $t('common.addBtn')"
-      v-model="visible"
-      width="600"
-      :close-on-click-modal="false"
-      draggable
-  >
-    <el-form ref="menuDialogFormRef" :model="state.ruleForm" :rules="dataRules" label-width="100px" v-loading="loading">
-      <el-form-item :label="$t('sysmenu.menuType')" prop="menuType">
-        <el-radio-group v-model="state.ruleForm.menuType">
-          <el-radio border label="0">菜单</el-radio>
-          <el-radio border label="1">按钮</el-radio>
-        </el-radio-group>
-      </el-form-item>
-      <el-form-item :label="$t('sysmenu.parentId')" prop="parentId">
-        <el-tree-select
-            v-model="state.ruleForm.parentId"
-            :data="state.parentData"
-            :render-after-expand="false"
-            :props="{ value: 'id', label: 'name', children: 'children' }"
-            class="w100"
-            clearable
-            check-strictly
-            :placeholder="$t('sysmenu.inputParentIdTip')"
-        >
-        </el-tree-select>
-      </el-form-item>
-      <el-form-item prop="name">
-        <template #label>
-          {{ state.ruleForm.menuType === '0' ? t('sysmenu.name') : t('sysmenu.buttonName') }}
-        </template>
-        <el-input v-model="state.ruleForm.name" clearable :placeholder="$t('sysmenu.inputNameTip')"></el-input>
-      </el-form-item>
-      <el-form-item :label="$t('sysmenu.path')" prop="path" v-if="state.ruleForm.menuType === '0'">
-        <el-input v-model="state.ruleForm.path" :placeholder="$t('sysmenu.inputPathTip')"/>
-      </el-form-item>
-      <el-form-item :label="$t('sysmenu.permission')" prop="permission" v-if="state.ruleForm.menuType === '1'">
-        <template #label>
-          {{ t('sysmenu.permission') }}
-          <tip content="对应后台接口@PreAuthorize注解入参字符串"></tip>
-        </template>
-        <el-input v-model="state.ruleForm.permission" maxlength="30" :placeholder="$t('sysmenu.inputPermissionTip')"/>
-      </el-form-item>
-      <el-form-item :label="$t('sysmenu.sortOrder')" prop="sortOrder">
-        <el-input-number v-model="state.ruleForm.sortOrder" :min="0" controls-position="right"/>
-      </el-form-item>
-      <el-form-item :label="$t('sysmenu.icon')" prop="icon" v-if="state.ruleForm.menuType === '0'">
-        <IconSelector :placeholder="$t('sysmenu.inputIconTip')" v-model="state.ruleForm.icon"/>
-      </el-form-item>
-      <el-row>
-        <el-col :span="12">
-          <el-form-item prop="keepAlive" v-if="state.ruleForm.menuType === '0'">
-            <template #label> {{ $t('sysmenu.keepAlive') }}
-              <tip content="组件保留状态，避免重新渲染"/>
-            </template>
-            <el-radio-group v-model="state.ruleForm.keepAlive">
-              <el-radio border label="0">否</el-radio>
-              <el-radio border label="1">是</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item prop="visible" v-if="state.ruleForm.menuType === '0'">
-            <template #label> {{ $t('sysmenu.visible') }}
-              <tip content="左侧菜单树是否显示"/>
-            </template>
-            <el-radio-group v-model="state.ruleForm.visible">
-              <el-radio border label="0">否</el-radio>
-              <el-radio border label="1">是</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-      </el-row>
-      <el-row class="mt-4">
-        <el-col :span="12">
-          <el-form-item prop="param" v-if="state.ruleForm.menuType === '0'">
-            <template #label> {{ $t('sysmenu.param') }}
-              <tip content="多个路径指向同一个组件"/>
-            </template>
-            <el-radio-group v-model="state.ruleForm.param">
-              <el-radio border label="0">否</el-radio>
-              <el-radio border label="1">是</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-        <el-col :span="12">
-          <el-form-item prop="embedded"
-                        v-if="state.ruleForm.menuType === '0' && state.ruleForm.path?.startsWith('http')">
-            <template #label> {{ $t('sysmenu.embedded') }}
-              <tip content="iframe嵌套还是打开独立的Tab"/>
-            </template>
-            <el-radio-group v-model="state.ruleForm.embedded">
-              <el-radio border label="0">否</el-radio>
-              <el-radio border label="1">是</el-radio>
-            </el-radio-group>
-          </el-form-item>
-        </el-col>
-      </el-row>
+	<el-dialog
+		:title="state.ruleForm.menuId ? $t('common.editBtn') : $t('common.addBtn')"
+		v-model="visible"
+		width="600"
+		:close-on-click-modal="false"
+		draggable
+	>
+		<el-form ref="menuDialogFormRef" :model="state.ruleForm" :rules="dataRules" label-width="100px" v-loading="loading">
+			<el-form-item :label="$t('sysmenu.menuType')" prop="menuType">
+				<el-radio-group v-model="state.ruleForm.menuType">
+					<el-radio border label="0">菜单</el-radio>
+					<el-radio border label="1">按钮</el-radio>
+				</el-radio-group>
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.parentId')" prop="parentId">
+				<el-tree-select
+					v-model="state.ruleForm.parentId"
+					:data="state.parentData"
+					:render-after-expand="false"
+					:props="{ value: 'id', label: 'name', children: 'children' }"
+					class="w100"
+					clearable
+					check-strictly
+					:placeholder="$t('sysmenu.inputParentIdTip')"
+				>
+				</el-tree-select>
+			</el-form-item>
+			<el-form-item prop="name">
+				<template #label>
+					{{ state.ruleForm.menuType === '0' ? t('sysmenu.name') : t('sysmenu.buttonName') }}
+				</template>
+				<el-input v-model="state.ruleForm.name" clearable :placeholder="$t('sysmenu.inputNameTip')"></el-input>
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.path')" prop="path" v-if="state.ruleForm.menuType === '0'">
+				<el-input v-model="state.ruleForm.path" :placeholder="$t('sysmenu.inputPathTip')" />
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.permission')" prop="permission" v-if="state.ruleForm.menuType === '1'">
+				<template #label>
+					{{ t('sysmenu.permission') }}
+					<tip content="对应后台接口@PreAuthorize注解入参字符串"></tip>
+				</template>
+				<el-input v-model="state.ruleForm.permission" maxlength="40" :placeholder="$t('sysmenu.inputPermissionTip')" />
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.sortOrder')" prop="sortOrder">
+				<el-input-number v-model="state.ruleForm.sortOrder" :min="0" controls-position="right" />
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.icon')" prop="icon" v-if="state.ruleForm.menuType === '0'">
+				<IconSelector :placeholder="$t('sysmenu.inputIconTip')" v-model="state.ruleForm.icon" />
+			</el-form-item>
+			<el-form-item :label="$t('sysmenu.homeIcon')" prop="homeIcon" v-if="state.ruleForm.menuType === '0'">
+				<upload-img v-model:imageUrl="state.ruleForm.menuPic" />
+				<!-- <IconSelector :placeholder="$t('sysmenu.inputIconTip')" v-model="state.ruleForm.icon"/> -->
+			</el-form-item>
+			<el-row>
+				<el-col :span="12">
+					<el-form-item prop="keepAlive" v-if="state.ruleForm.menuType === '0'">
+						<template #label>
+							{{ $t('sysmenu.keepAlive') }}
+							<tip content="组件保留状态，避免重新渲染" />
+						</template>
+						<el-radio-group v-model="state.ruleForm.keepAlive">
+							<el-radio border label="0">否</el-radio>
+							<el-radio border label="1">是</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12">
+					<el-form-item prop="visible" v-if="state.ruleForm.menuType === '0'">
+						<template #label>
+							{{ $t('sysmenu.visible') }}
+							<tip content="左侧菜单树是否显示" />
+						</template>
+						<el-radio-group v-model="state.ruleForm.visible">
+							<el-radio border label="0">否</el-radio>
+							<el-radio border label="1">是</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+			</el-row>
+			<el-row class="mt-4">
+				<el-col :span="12">
+					<el-form-item prop="param" v-if="state.ruleForm.menuType === '0'">
+						<template #label>
+							{{ $t('sysmenu.param') }}
+							<tip content="多个路径指向同一个组件" />
+						</template>
+						<el-radio-group v-model="state.ruleForm.param">
+							<el-radio border label="0">否</el-radio>
+							<el-radio border label="1">是</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+				<el-col :span="12">
+					<el-form-item prop="embedded" v-if="state.ruleForm.menuType === '0' && state.ruleForm.path?.startsWith('http')">
+						<template #label>
+							{{ $t('sysmenu.embedded') }}
+							<tip content="iframe嵌套还是打开独立的Tab" />
+						</template>
+						<el-radio-group v-model="state.ruleForm.embedded">
+							<el-radio border label="0">否</el-radio>
+							<el-radio border label="1">是</el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
+			</el-row>
 
-      <el-form-item class="mt-4" :label="$t('sysmenu.component')" prop="component" v-if="state.ruleForm.menuType === '0'
-         && state.ruleForm.param === '1'">
-        <el-input v-model="state.ruleForm.component" :placeholder="$t('sysmenu.inputComponentTip')"/>
-      </el-form-item>
-    </el-form>
-    <template #footer>
+			<el-form-item
+				class="mt-4"
+				:label="$t('sysmenu.component')"
+				prop="component"
+				v-if="state.ruleForm.menuType === '0' && state.ruleForm.param === '1'"
+			>
+				<el-input v-model="state.ruleForm.component" :placeholder="$t('sysmenu.inputComponentTip')" />
+			</el-form-item>
+		</el-form>
+		<template #footer>
 			<span class="dialog-footer">
 				<el-button @click="visible = false">{{ $t('common.cancelButtonText') }}</el-button>
 				<el-button type="primary" @click="onSubmit" :disabled="loading">{{ $t('common.confirmButtonText') }}</el-button>
 			</span>
-    </template>
-  </el-dialog>
+		</template>
+	</el-dialog>
 </template>
 
 <script setup lang="ts" name="systemMenuDialog">
-import {useI18n} from 'vue-i18n';
-import {getObj, pageList, putObj, addObj, validateExist} from '/@/api/admin/menu';
-import {useMessage} from '/@/hooks/message';
-import {rule, validateNull} from "/@/utils/validate";
-import Tip from "/@/components/Tip/index.vue";
+import { useI18n } from 'vue-i18n';
+import { getObj, pageList, putObj, addObj, validateExist } from '/@/api/admin/menu';
+import { useMessage } from '/@/hooks/message';
+import { rule, validateNull } from '/@/utils/validate';
+import Tip from '/@/components/Tip/index.vue';
 
 // 定义子组件向父组件传值/事件
 const emit = defineEmits(['refresh']);
-const {t} = useI18n();
+const { t } = useI18n();
 // 引入组件
 const IconSelector = defineAsyncComponent(() => import('/@/components/IconSelector/index.vue'));
 
@@ -131,130 +142,146 @@ const loading = ref(false);
 const menuDialogFormRef = ref();
 // 定义需要的数据
 const state = reactive({
-  ruleForm: {
-    menuId: '',
-    name: '',
-    permission: '',
-    parentId: '',
-    icon: '',
-    path: '',
-    param: '0',
-    component: '',
-    sortOrder: 0,
-    menuType: '1',
-    keepAlive: '0',
-    visible: '1',
-    embedded: '0',
-  },
-  parentData: [] as any[], // 上级菜单数据
+	ruleForm: {
+		menuId: '',
+		name: '',
+		permission: '',
+		parentId: '',
+		icon: '',
+		menuPic: '',
+		path: '',
+		param: '0',
+		component: '',
+		sortOrder: 0,
+		menuType: '1',
+		keepAlive: '0',
+		visible: '1',
+		embedded: '0',
+	},
+	parentData: [] as any[], // 上级菜单数据
 });
 
 // 表单校验规则
 const dataRules = reactive({
-  menuType: [{required: true, message: '菜单类型不能为空', trigger: 'blur'}],
-  parentId: [{required: true, message: '上级菜单不能为空', trigger: 'blur'}],
-  name: [{validator: rule.overLength, trigger: 'blur'}, {
-    required: true,
-    message: '菜单不能为空',
-    trigger: 'blur'
-  }, {
-    validator: (rule: any, value: any, callback: any) => {
-      validateExist(rule, value, callback, state.ruleForm.menuId !== '' || state.ruleForm.menuType === '1');
-    },
-    trigger: 'blur',
-  }],
-  path: [{validator: rule.overLength, trigger: 'blur'}, {required: true, message: '路径不能为空', trigger: 'blur'}],
-  icon: [{validator: rule.overLength, trigger: 'blur'}, {required: true, message: '图标不能为空', trigger: 'blur'}],
-  permission: [{validator: rule.overLength, trigger: 'blur'}, {
-    required: true,
-    message: '权限代码不能为空',
-    trigger: 'blur'
-  }, {
-    validator: (rule: any, value: any, callback: any) => {
-      validateExist(rule, value, callback, state.ruleForm.menuId !== '');
-    },
-    trigger: 'blur',
-  }],
-  sortOrder: [{required: true, message: '排序不能为空', trigger: 'blur'}],
-  component: [{min: 5, max: 255, message: '组件名称长度必须介于 5 和 255 之间', trigger: 'blur'},
-    {
-      validator: (rule: any, value: any, callback: any) => {
-        if (state.ruleForm.menuType === '0' && state.ruleForm.param === '1' && validateNull(state.ruleForm.component)) {
-          callback(new Error('请输入组件名称'));
-        } else {
-          return callback();
-        }
-      },
-      trigger: 'blur',
-    }],
+	menuType: [{ required: true, message: '菜单类型不能为空', trigger: 'blur' }],
+	parentId: [{ required: true, message: '上级菜单不能为空', trigger: 'blur' }],
+	name: [
+		{ validator: rule.overLength, trigger: 'blur' },
+		{
+			required: true,
+			message: '菜单不能为空',
+			trigger: 'blur',
+		},
+		{
+			validator: (rule: any, value: any, callback: any) => {
+				validateExist(rule, value, callback, state.ruleForm.menuId !== '' || state.ruleForm.menuType === '1');
+			},
+			trigger: 'blur',
+		},
+	],
+	path: [
+		{ validator: rule.overLength, trigger: 'blur' },
+		{ required: true, message: '路径不能为空', trigger: 'blur' },
+	],
+	icon: [
+		{ validator: rule.overLength, trigger: 'blur' },
+		{ required: true, message: '图标不能为空', trigger: 'blur' },
+	],
+	permission: [
+		{ validator: rule.overLength, trigger: 'blur' },
+		{
+			required: true,
+			message: '权限代码不能为空',
+			trigger: 'blur',
+		},
+		{
+			validator: (rule: any, value: any, callback: any) => {
+				validateExist(rule, value, callback, state.ruleForm.menuId !== '');
+			},
+			trigger: 'blur',
+		},
+	],
+	sortOrder: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
+	component: [
+		{ min: 5, max: 255, message: '组件名称长度必须介于 5 和 255 之间', trigger: 'blur' },
+		{
+			validator: (rule: any, value: any, callback: any) => {
+				if (state.ruleForm.menuType === '0' && state.ruleForm.param === '1' && validateNull(state.ruleForm.component)) {
+					callback(new Error('请输入组件名称'));
+				} else {
+					return callback();
+				}
+			},
+			trigger: 'blur',
+		},
+	],
 });
 
 // 打开弹窗
 const openDialog = (type: string, row?: any) => {
-  state.ruleForm.menuId = '';
-  visible.value = true;
+	state.ruleForm.menuId = '';
+	visible.value = true;
 
-  nextTick(() => {
-    menuDialogFormRef.value?.resetFields();
-    state.ruleForm.parentId = row?.id || '-1';
-  });
+	nextTick(() => {
+		menuDialogFormRef.value?.resetFields();
+		state.ruleForm.parentId = row?.id || '-1';
+	});
 
-  if (row?.id && type === 'edit') {
-    state.ruleForm.menuId = row.id;
-    // 获取当前节点菜单信息
-    getMenuDetail(row.id);
-  }
-  // 渲染上级菜单列表树
-  getAllMenuData();
+	if (row?.id && type === 'edit') {
+		state.ruleForm.menuId = row.id;
+		// 获取当前节点菜单信息
+		getMenuDetail(row.id);
+	}
+	// 渲染上级菜单列表树
+	getAllMenuData();
 };
 
 // 获取菜单节点的详细信息
 const getMenuDetail = (id: string) => {
-  getObj({menuId: id}).then((res) => {
-    if (res.data[0].component) {
-      state.ruleForm.param = '1'
-    }
-    Object.assign(state.ruleForm, res.data[0]);
-  });
+	getObj({ menuId: id }).then((res) => {
+		if (res.data[0].component) {
+			state.ruleForm.param = '1';
+		}
+		Object.assign(state.ruleForm, res.data[0]);
+	});
 };
 
 // 从后端获取菜单信息（含层级）
 const getAllMenuData = () => {
-  state.parentData = [];
-  pageList({
-    type: '0',
-  }).then((res) => {
-    let menu = {
-      id: '-1',
-      name: '根菜单',
-      children: [],
-    };
-    menu.children = res.data;
-    state.parentData.push(menu);
-  });
+	state.parentData = [];
+	pageList({
+		type: '0',
+	}).then((res) => {
+		let menu = {
+			id: '-1',
+			name: '根菜单',
+			children: [],
+		};
+		menu.children = res.data;
+		state.parentData.push(menu);
+	});
 };
 
 // 保存数据
 const onSubmit = async () => {
-  const valid = await menuDialogFormRef.value.validate().catch(() => {
-  });
-  if (!valid) return false;
+	const valid = await menuDialogFormRef.value.validate().catch(() => {});
+	if (!valid) return false;
 
-  try {
-    loading.value = true;
-    state.ruleForm.menuId ? await putObj(state.ruleForm) : await addObj(state.ruleForm);
-    useMessage().success(t(state.ruleForm.menuId ? 'common.editSuccessText' : 'common.addSuccessText'));
-    visible.value = false;
-    emit('refresh');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  } finally {
-    loading.value = false;
-  }
+	try {
+		loading.value = true;
+		state.ruleForm.menuId ? await putObj(state.ruleForm) : await addObj(state.ruleForm);
+		useMessage().success(t(state.ruleForm.menuId ? 'common.editSuccessText' : 'common.addSuccessText'));
+		visible.value = false;
+		emit('refresh');
+	} catch (err: any) {
+		useMessage().error(err.msg);
+	} finally {
+		loading.value = false;
+	}
 };
 
 // 暴露变量 只有暴漏出来的变量 父组件才能使用
 defineExpose({
-  openDialog,
+	openDialog,
 });
 </script>
diff --git a/src/views/admin/system/menu/i18n/en.ts b/src/views/admin/system/menu/i18n/en.ts
index 29149d0..db73035 100644
--- a/src/views/admin/system/menu/i18n/en.ts
+++ b/src/views/admin/system/menu/i18n/en.ts
@@ -1,37 +1,38 @@
 export default {
-    sysmenu: {
-        index: '#',
-        name: 'menu name',
-        buttonName: 'button name',
-        sortOrder: 'sortOrder',
-        path: 'path',
-        menuType: 'menuType',
-        keepAlive: 'keepAlive',
-        permission: 'permission',
-        inputNameTip: 'input name',
-        parentId: 'parent menu',
-        embedded: 'embedded',
-        param: 'param',
-        component: 'component',
-        visible: 'visible',
-        icon: 'icon',
-        inputMenuIdTip: 'input menuId',
-        inputPermissionTip: 'input permission',
-        inputPathTip: 'input path',
-        inputParentIdTip: 'input parentId',
-        inputIconTip: 'input icon',
-        inputVisibleTip: 'input visible',
-        inputSortOrderTip: 'input sortOrder',
-        inputKeepAliveTip: 'input keepAlive',
-        inputMenuTypeTip: 'input menuType',
-        inputCreateByTip: 'input createBy',
-        inputCreateTimeTip: 'input createTime',
-        inputUpdateByTip: 'input updateBy',
-        inputUpdateTimeTip: 'input updateTime',
-        inputDelFlagTip: 'input delFlag',
-        inputTenantIdTip: 'input tenantId',
-        inputEmbeddedTip: 'input embedded',
-        inputComponentTip: 'input component',
-        deleteDisabledTip: 'menu inclusion subordinates cannot be deleted',
-    },
+	sysmenu: {
+		index: '#',
+		name: 'menu name',
+		buttonName: 'button name',
+		sortOrder: 'sortOrder',
+		path: 'path',
+		menuType: 'menuType',
+		keepAlive: 'keepAlive',
+		permission: 'permission',
+		inputNameTip: 'input name',
+		parentId: 'parent menu',
+		embedded: 'embedded',
+		param: 'param',
+		component: 'component',
+		visible: 'visible',
+		icon: 'icon',
+		homeIcon: 'homeIcon',
+		inputMenuIdTip: 'input menuId',
+		inputPermissionTip: 'input permission',
+		inputPathTip: 'input path',
+		inputParentIdTip: 'input parentId',
+		inputIconTip: 'input icon',
+		inputVisibleTip: 'input visible',
+		inputSortOrderTip: 'input sortOrder',
+		inputKeepAliveTip: 'input keepAlive',
+		inputMenuTypeTip: 'input menuType',
+		inputCreateByTip: 'input createBy',
+		inputCreateTimeTip: 'input createTime',
+		inputUpdateByTip: 'input updateBy',
+		inputUpdateTimeTip: 'input updateTime',
+		inputDelFlagTip: 'input delFlag',
+		inputTenantIdTip: 'input tenantId',
+		inputEmbeddedTip: 'input embedded',
+		inputComponentTip: 'input component',
+		deleteDisabledTip: 'menu inclusion subordinates cannot be deleted',
+	},
 };
diff --git a/src/views/admin/system/menu/i18n/zh-cn.ts b/src/views/admin/system/menu/i18n/zh-cn.ts
index 506901a..8095a1d 100644
--- a/src/views/admin/system/menu/i18n/zh-cn.ts
+++ b/src/views/admin/system/menu/i18n/zh-cn.ts
@@ -1,31 +1,32 @@
 export default {
-    sysmenu: {
-        index: '#',
-        name: '菜单名称',
-        buttonName: '按钮名称',
-        sortOrder: '排序',
-        path: '路由',
-        menuType: '类型',
-        keepAlive: '缓冲',
-        permission: '权限标识',
-        inputNameTip: '请输入菜单名称',
-        parentId: '上级菜单',
-        embedded: '内嵌',
-        param: '带参',
-        component: '组件',
-        visible: '显示',
-        icon: '图标',
-        inputMenuIdTip: '',
-        inputPermissionTip: '请输入权限标识',
-        inputPathTip: '请输入路由路径',
-        inputParentIdTip: '请选择上级菜单',
-        inputIconTip: '请选择图标',
-        inputVisibleTip: '请选择是否显示',
-        inputSortOrderTip: '请输入排序',
-        inputKeepAliveTip: '请选择是否缓冲',
-        inputMenuTypeTip: '请选择菜单类型',
-        inputEmbeddedTip: '请选择是否内嵌',
-        inputComponentTip: '请输入组件名称',
-        deleteDisabledTip: '菜单包含下级不能删除',
-    },
+	sysmenu: {
+		index: '#',
+		name: '菜单名称',
+		buttonName: '按钮名称',
+		sortOrder: '排序',
+		path: '路由',
+		menuType: '类型',
+		keepAlive: '缓冲',
+		permission: '权限标识',
+		inputNameTip: '请输入菜单名称',
+		parentId: '上级菜单',
+		embedded: '内嵌',
+		param: '带参',
+		component: '组件',
+		visible: '显示',
+		icon: '图标',
+		homeIcon: '首页图标',
+		inputMenuIdTip: '',
+		inputPermissionTip: '请输入权限标识',
+		inputPathTip: '请输入路由路径',
+		inputParentIdTip: '请选择上级菜单',
+		inputIconTip: '请选择图标',
+		inputVisibleTip: '请选择是否显示',
+		inputSortOrderTip: '请输入排序',
+		inputKeepAliveTip: '请选择是否缓冲',
+		inputMenuTypeTip: '请选择菜单类型',
+		inputEmbeddedTip: '请选择是否内嵌',
+		inputComponentTip: '请输入组件名称',
+		deleteDisabledTip: '菜单包含下级不能删除',
+	},
 };
diff --git a/src/views/gen/design/form.vue b/src/views/gen/design/form.vue
index 3b1652c..1b3f48a 100644
--- a/src/views/gen/design/form.vue
+++ b/src/views/gen/design/form.vue
@@ -13,7 +13,7 @@
 		<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
 	</el-drawer>
 </template>
-
+supermarket_supermarketAuxiliaryCode_ supermarket_supermarketAuxiliaryCode_export
 <script setup lang="ts" name="systemFormHistoryDialog">
 import { BasicTableProps, useTable } from '/@/hooks/table';
 import { delFormObj, fetchFormList } from '/@/api/gen/table';
@@ -57,9 +57,9 @@ const handleRollback = (id: string) => {
 
 // 打开弹窗
 const openDialog = () => {
-  const { tableName, dsName } = route.query;
+	const { tableName, dsName } = route.query;
 	visible.value = true;
-  state.queryForm.dsName = dsName;
+	state.queryForm.dsName = dsName;
 	state.queryForm.tableName = tableName;
 	getDataList();
 };
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index e3ecbb5..5db0505 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,24 +1,25 @@
 <template>
-  <div>
-    <div v-if="pageLoading">
-      <el-main>
-        <el-card shadow="never">
-          <el-skeleton :rows="1"></el-skeleton>
-        </el-card>
-        <el-card shadow="never" style="margin-top: 15px;">
-          <el-skeleton></el-skeleton>
-        </el-card>
-      </el-main>
-    </div>
-    <widgets/>
-  </div>
+	<navMmenu />
+	<!-- <div v-if="pageLoading">
+			<el-main>
+				<el-card shadow="never">
+					<el-skeleton :rows="1"></el-skeleton>
+				</el-card>
+				<el-card shadow="never" style="margin-top: 15px">
+					<el-skeleton></el-skeleton>
+				</el-card>
+			</el-main>
+		</div>
+		<widgets /> -->
 </template>
 
 <script setup lang="ts" name="dashboard">
-const Widgets = defineAsyncComponent(() => import('./widgets/index.vue'));
-const pageLoading = ref(true);
+import navMmenu from './navMenu/index.vue';
 
-onMounted(() => {
-  pageLoading.value = false;
-});
+// const Widgets = defineAsyncComponent(() => import('./widgets/index.vue'));
+// const pageLoading = ref(true);
+
+// onMounted(() => {
+// 	pageLoading.value = false;
+// });
 </script>
diff --git a/src/views/home/widgets/components/nav-menu.vue b/src/views/home/navMenu/index.vue
similarity index 58%
rename from src/views/home/widgets/components/nav-menu.vue
rename to src/views/home/navMenu/index.vue
index 86bad6a..dba8ad4 100644
--- a/src/views/home/widgets/components/nav-menu.vue
+++ b/src/views/home/navMenu/index.vue
@@ -1,27 +1,19 @@
-<script lang="ts">
-export default {
-	title: '首页导航菜单',
-	icon: 'Postcard',
-	description: '首页导航菜单展示',
-};
-</script>
-
 <template>
-	<el-card class="box-card p-10" v-loading="loading">
+	<el-card class="card" v-loading="loading">
 		<el-row>
-			<el-col :span="6" v-for="(item, index) in navMenuListTop" :key="index">
+			<el-col :span="4" v-for="(item, index) in navMenuListTop" :key="index">
 				<div :class="['nav-menu-item-top', item.id == currentActiveMenuId ? 'nav-menu-item-active' : '']" @click="currentActiveMenuId = item.id">
-					<el-icon class="nav-menu-item-icon"><List /></el-icon>
-					<div class="nav-menu-item-name">{{ item.name }}</div>
+					<el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" />
+					<div class="nav-menu-item-name">{{ $t(item.name) }}</div>
 				</div>
 			</el-col>
 		</el-row>
 		<br />
-		<el-row v-if="currentActiveMenuId" style="background-color: #eaf4fa; border-radius: 1rem; padding: 1rem">
-			<el-col :span="4" v-for="(item, index) in navMenuListBottom" :key="index">
+		<el-row v-if="currentActiveMenuId" style="background-color: #e2eff677; border-radius: 1rem; padding: 2rem 6rem">
+			<el-col :span="3" v-for="(item, index) in navMenuListBottom" :key="index">
 				<div class="nav-menu-item-bottom" @click="handleClickBottomMenu(item)">
-					<el-icon class="nav-menu-item-icon"><List /></el-icon>
-					<div class="nav-menu-item-name">{{ item.name }}</div>
+					<el-image class="nav-menu-item-icon" :src="imageBaseUrl + item.menuPic" fit="cover" />
+					<div class="nav-menu-item-name">{{ $t(item.name) }}</div>
 				</div>
 			</el-col>
 		</el-row>
@@ -30,25 +22,27 @@ export default {
 
 <script setup lang="ts">
 import { ref } from 'vue';
-import { pageList } from '/@/api/admin/menu';
 import { ElMessage } from 'element-plus';
+import { useMenuApi } from '/@/api/admin/menu';
 
 const router = useRouter();
+const menuApi = useMenuApi();
 const loading = ref(false);
 const navMenuList = ref<any>([]);
 const navMenuListTop = ref<any>([]);
 const currentActiveMenuId = ref('');
+const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
 
 // 获取菜单列表
 const getNavMenuList = async () => {
 	loading.value = true;
 	try {
-		const res = await pageList({ current: 1, size: 999 }).finally(() => {
+		const res = await menuApi.getAdminMenu().finally(() => {
 			loading.value = false;
 		});
 		if (res.code == 0 && res.data.length > 0) {
 			navMenuList.value = res.data;
-			navMenuListTop.value = res.data.map((item: any) => ({ id: item.id, name: item.name, path: item.path }));
+			navMenuListTop.value = res.data.map((item: any) => ({ id: item.id, name: item.name, path: item.path, menuPic: item.menuPic }));
 		}
 	} catch (error) {
 		navMenuList.value = [];
@@ -62,7 +56,7 @@ const navMenuListBottom = computed(() => {
 	if (navMenuList.value) {
 		const currentMenuItem = navMenuList.value.find((item: any) => item.id == currentActiveMenuId.value);
 		if (currentMenuItem && currentMenuItem.children) {
-			return currentMenuItem.children.map((item: any) => ({ id: item.id, name: item.name, path: item.path }));
+			return currentMenuItem.children.map((item: any) => ({ id: item.id, name: item.name, path: item.path, menuPic: item.menuPic }));
 		}
 	} else {
 		return [];
@@ -79,35 +73,43 @@ onMounted(async () => {
 </script>
 
 <style scoped lang="scss">
+.card {
+	padding: 5vw;
+	height: 100%;
+	background-image: linear-gradient(0deg, #ffffff 0%, #d3f9f1aa 100%);
+}
 .nav-menu-item-top {
-	height: 7rem;
-	padding: 1rem;
-	margin: 0.5rem;
+	height: 6.5vw;
+	padding: 0.5vw;
+	margin: 0.5vw;
 	display: flex;
 	flex-direction: column;
 	align-items: start;
 	justify-content: space-around;
 	background-color: #f9f9f9;
 	border-radius: 1rem;
-	cursor: pointer;
 	overflow: hidden;
+	cursor: pointer;
 
 	.nav-menu-item-icon {
-		width: 2rem;
-		height: 2rem;
+		width: 2.5vw;
+		height: 2.5vw;
 	}
 	.nav-menu-item-name {
-		font-size: 1.5rem;
+		font-size: 1.2vw;
 		font-weight: 600;
 	}
 }
+.nav-menu-item-top:hover {
+	color: #2e5cf6;
+}
 .nav-menu-item-active {
-	background-color: #eaf4fa;
+	background-color: #e2eff6;
 }
 
 .nav-menu-item-bottom {
-	width: 100%;
-	height: 6rem;
+	min-height: 4vw;
+	margin: 1vw 2vw;
 	display: flex;
 	flex-direction: column;
 	align-items: center;
@@ -116,16 +118,39 @@ onMounted(async () => {
 	cursor: pointer;
 
 	.nav-menu-item-icon {
-		width: 2rem;
-		height: 2rem;
-		background-color: aquamarine;
+		width: 2.3vw;
+		height: 2.3vw;
 	}
 	.nav-menu-item-name {
-		font-size: 1rem;
+		font-size: 1vw;
 		font-weight: 600;
 	}
 }
 .nav-menu-item-bottom:hover {
 	color: #2e5cf6;
 }
+
+@media (max-width: 768px) {
+	.nav-menu-item-top {
+		height: 10vw;
+		padding: 1vw;
+		margin: 1vw;
+		.nav-menu-item-icon {
+			display: none;
+		}
+		.nav-menu-item-name {
+			font-size: 2vw;
+		}
+	}
+	.nav-menu-item-bottom {
+		height: 4vw;
+
+		.nav-menu-item-icon {
+			display: none;
+		}
+		.nav-menu-item-name {
+			font-size: 1.8vw;
+		}
+	}
+}
 </style>
diff --git a/src/views/home/widgets/index.vue b/src/views/home/widgets/index.vue
index 9a3eb90..13561d0 100644
--- a/src/views/home/widgets/index.vue
+++ b/src/views/home/widgets/index.vue
@@ -150,7 +150,6 @@ const allCompsList = computed(() => {
 const myCompsList = computed(() => {
 	// 支持列表
 	const myGrid = [
-		'nav-menu',
 		'calendar',
 		'current-user',
 		'news',
@@ -229,9 +228,9 @@ onMounted(() => {
 </script>
 <style scoped lang="scss">
 .custom_btn {
-	position: absolute;
-	top: 7px;
-	right: 5px;
+	position: fixed;
+	bottom: 5px;
+	right: 20px;
 	z-index: 9;
 	color: white;
 }
diff --git a/src/views/supermarket/supermarketAuxiliaryCode/form.vue b/src/views/supermarket/supermarketAuxiliaryCode/form.vue
index 5930122..bb35880 100644
--- a/src/views/supermarket/supermarketAuxiliaryCode/form.vue
+++ b/src/views/supermarket/supermarketAuxiliaryCode/form.vue
@@ -1,74 +1,71 @@
 <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-col :span="12" class="mb20">
-      <el-form-item label="条码" prop="barCode">
-        <el-input v-model="form.barCode" placeholder="请输入条码"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="spuID" prop="spuId">
-          <el-select v-model="form.spuId" placeholder="请选择spuID">
-            <el-option label="请选择">0</el-option>
-          </el-select>
-        </el-form-item>
-      </el-col>
+	<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-form-item label="条码" prop="barCode">
+						<el-input v-model="form.barCode" placeholder="请输入条码" />
+					</el-form-item>
+				</el-col>
 
+				<el-col :span="12" class="mb20">
+					<el-form-item label="spuID" prop="spuId">
+						<el-select v-model="form.spuId" placeholder="请选择spuID">
+							<el-option label="1234" value="1234"></el-option>
+							<el-option label="5678" value="5678"></el-option>
+						</el-select>
+					</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>
+		</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>
 </template>
 
 <script setup lang="ts" name="SupermarketAuxiliaryCodeDialog">
-import { useDict } from '/@/hooks/dict';
-import { useMessage } from "/@/hooks/message";
-import { getObj, addObj, putObj } from '/@/api/supermarket/supermarketAuxiliaryCode'
-import { rule } from '/@/utils/validate';
+import { useMessage } from '/@/hooks/message';
+import { getObj, addObj, putObj } from '/@/api/supermarket/supermarketAuxiliaryCode';
 const emit = defineEmits(['refresh']);
 
 // 定义变量内容
 const dataFormRef = ref();
-const visible = ref(false)
-const loading = ref(false)
+const visible = ref(false);
+const loading = ref(false);
 // 定义字典
 
 // 提交表单数据
 const form = reactive({
-		id:'',
-	  barCode: '',
-	  spuId: '',
+	id: '',
+	barCode: '',
+	spuId: '',
 });
 
 // 定义校验规则
 const dataRules = ref({
-        barCode: [{required: true, message: '条码不能为空', trigger: 'blur'}],
-        spuId: [{required: true, message: 'spuID不能为空', trigger: 'blur'}],
-})
+	barCode: [{ required: true, message: '条码不能为空', trigger: 'blur' }],
+	spuId: [{ required: true, message: 'spuID不能为空', trigger: 'blur' }],
+});
 
 // 打开弹窗
 const openDialog = (id: string) => {
-  visible.value = true
-  form.id = ''
+	visible.value = true;
+	form.id = '';
 
-  // 重置表单数据
+	// 重置表单数据
 	nextTick(() => {
 		dataFormRef.value?.resetFields();
 	});
 
-  // 获取supermarketAuxiliaryCode信息
-  if (id) {
-    form.id = id
-    getsupermarketAuxiliaryCodeData(id)
-  }
+	// 获取supermarketAuxiliaryCode信息
+	if (id) {
+		form.id = id;
+		getsupermarketAuxiliaryCodeData(id);
+	}
 };
 
 // 提交
@@ -77,7 +74,7 @@ const onSubmit = async () => {
 	if (!valid) return false;
 
 	try {
-    loading.value = true;
+		loading.value = true;
 		form.id ? await putObj(form) : await addObj(form);
 		useMessage().success(form.id ? '修改成功' : '添加成功');
 		visible.value = false;
@@ -85,24 +82,25 @@ const onSubmit = async () => {
 	} catch (err: any) {
 		useMessage().error(err.msg);
 	} finally {
-    loading.value = false;
-  }
+		loading.value = false;
+	}
 };
 
-
 // 初始化表单数据
 const getsupermarketAuxiliaryCodeData = (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,
 });
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/supermarket/supermarketAuxiliaryCode/index.vue b/src/views/supermarket/supermarketAuxiliaryCode/index.vue
index 18c03ef..487128c 100644
--- a/src/views/supermarket/supermarketAuxiliaryCode/index.vue
+++ b/src/views/supermarket/supermarketAuxiliaryCode/index.vue
@@ -1,132 +1,149 @@
 <template>
-  <div class="layout-padding">
-    <div class="layout-padding-auto layout-padding-view">
-      <el-row v-show="showSearch">
-        <el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
-      <el-form-item label="条码" prop="barCode" >
-        <el-input placeholder="请输入条码" v-model="state.queryForm.barCode" />
-      </el-form-item>
-      <el-form-item label="spuID" prop="spuId">
-            <el-select v-model="state.queryForm.spuId" placeholder="请选择spuID">
-              <el-option label="请选择">0</el-option>
-            </el-select>
-      </el-form-item>
-          <el-form-item>
-            <el-button icon="search" type="primary" @click="getDataList">
-              查询
-            </el-button>
-            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-          </el-form-item>
-        </el-form>
-      </el-row>
-      <el-row>
-        <div class="mb8" style="width: 100%">
-          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
-            v-auth="'supermarket_supermarketAuxiliaryCode_add'">
-            新 增
-          </el-button>
-          <el-button plain :disabled="multiple" icon="Delete" type="primary"
-            v-auth="'supermarket_supermarketAuxiliaryCode_del'" @click="handleDelete(selectObjs)">
-            删除
-          </el-button>
-          <right-toolbar v-model:showSearch="showSearch" :export="'supermarket_supermarketAuxiliaryCode_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"
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row v-show="showSearch">
+				<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
+					<el-form-item label="条码" prop="barCode">
+						<el-input placeholder="请输入条码" v-model="state.queryForm.barCode" />
+					</el-form-item>
+					<el-form-item label="spuID" prop="spuId">
+						<el-select v-model="state.queryForm.spuId" placeholder="请选择spuID">
+							<el-option label="请选择">0</el-option>
+						</el-select>
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
+						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+					</el-form-item>
+				</el-form>
+			</el-row>
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button
+						icon="folder-add"
+						type="primary"
+						class="ml10"
+						@click="formDialogRef.openDialog()"
+						v-auth="'supermarket_supermarketAuxiliaryCode_add'"
+					>
+						新 增
+					</el-button>
+					<el-button
+						plain
+						:disabled="multiple"
+						icon="Delete"
+						type="primary"
+						v-auth="'supermarket_supermarketAuxiliaryCode_del'"
+						@click="handleDelete(selectObjs)"
+					>
+						删 除
+					</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarket_supermarketAuxiliaryCode_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-column type="selection" width="40" align="center" />
-        <el-table-column type="index" label="#" width="40" />
-          <el-table-column prop="barCode" label="条码"  show-overflow-tooltip/>
-          <el-table-column prop="spuId" label="spuID"  show-overflow-tooltip/>
-        <el-table-column label="操作" width="150">
-          <template #default="scope">
-            <el-button icon="edit-pen" text type="primary" v-auth="'supermarket_supermarketAuxiliaryCode_edit'"
-              @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
-            <el-button icon="delete" text type="primary" v-auth="'supermarket_supermarketAuxiliaryCode_del'" @click="handleDelete([scope.row.id])">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
-    </div>
+				@sort-change="sortChangeHandle"
+			>
+				<el-table-column type="selection" width="40" align="center" />
+				<el-table-column type="index" label="#" width="40" />
+				<el-table-column prop="barCode" label="条码" show-overflow-tooltip />
+				<el-table-column prop="spuId" label="spuID" show-overflow-tooltip />
+				<el-table-column label="操作" width="150">
+					<template #default="scope">
+						<el-button
+							icon="edit-pen"
+							text
+							type="primary"
+							v-auth="'supermarket_supermarketAuxiliaryCode_edit'"
+							@click="formDialogRef.openDialog(scope.row.id)"
+							>编辑</el-button
+						>
+						<el-button icon="delete" text type="primary" v-auth="'supermarket_supermarketAuxiliaryCode_del'" @click="handleDelete([scope.row.id])"
+							>删除</el-button
+						>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		</div>
 
-    <!-- 编辑、新增  -->
-    <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
-
-  </div>
+		<!-- 编辑、新增  -->
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
 </template>
 
 <script setup lang="ts" name="systemSupermarketAuxiliaryCode">
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObjs } from "/@/api/supermarket/supermarketAuxiliaryCode";
-import { useMessage, useMessageBox } from "/@/hooks/message";
-import { useDict } from '/@/hooks/dict';
+import { BasicTableProps, useTable } from '/@/hooks/table';
+import { fetchList, delObjs } from '/@/api/supermarket/supermarketAuxiliaryCode';
+import { useMessage, useMessageBox } from '/@/hooks/message';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
 
 // 定义变量内容
-const formDialogRef = ref()
+const formDialogRef = ref();
 // 搜索变量
-const queryRef = ref()
-const showSearch = ref(true)
+const queryRef = ref();
+const showSearch = ref(true);
 // 多选变量
-const selectObjs = ref([]) as any
-const multiple = ref(true)
+const selectObjs = ref([]) as any;
+const multiple = ref(true);
 
 const state: BasicTableProps = reactive<BasicTableProps>({
-  queryForm: {},
-  pageList: fetchList
-})
+	queryForm: {},
+	pageList: fetchList,
+});
 
 //  table hook
-const {
-  getDataList,
-  currentChangeHandle,
-  sizeChangeHandle,
-  sortChangeHandle,
-  downBlobFile,
-	tableStyle
-} = useTable(state)
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
 
 // 清空搜索条件
 const resetQuery = () => {
-  // 清空搜索条件
-  queryRef.value?.resetFields()
-  // 清空多选
-  selectObjs.value = []
-  getDataList()
-}
+	// 清空搜索条件
+	queryRef.value?.resetFields();
+	// 清空多选
+	selectObjs.value = [];
+	getDataList();
+};
 
 // 导出excel
 const exportExcel = () => {
-  downBlobFile('/supermarket/supermarketAuxiliaryCode/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketAuxiliaryCode.xlsx')
-}
+	downBlobFile('/supermarket/supermarketAuxiliaryCode/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketAuxiliaryCode.xlsx');
+};
 
 // 多选事件
 const selectionChangHandle = (objs: { id: string }[]) => {
-  selectObjs.value = objs.map(({ id }) => id);
-  multiple.value = !objs.length;
+	selectObjs.value = objs.map(({ id }) => id);
+	multiple.value = !objs.length;
 };
 
 // 删除操作
 const handleDelete = async (ids: string[]) => {
-  try {
-    await useMessageBox().confirm('此操作将永久删除');
-  } catch {
-    return;
-  }
+	try {
+		await useMessageBox().confirm('此操作将永久删除');
+	} catch {
+		return;
+	}
 
-  try {
-    await delObjs(ids);
-    getDataList();
-    useMessage().success('删除成功');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  }
+	try {
+		await delObjs(ids);
+		getDataList();
+		useMessage().success('删除成功');
+	} catch (err: any) {
+		useMessage().error(err.msg);
+	}
 };
-</script>
\ No newline at end of file
+</script>
diff --git a/src/views/supermarket/supermarketCategory/form.vue b/src/views/supermarket/supermarketCategory/form.vue
new file mode 100644
index 0000000..8b9aa67
--- /dev/null
+++ b/src/views/supermarket/supermarketCategory/form.vue
@@ -0,0 +1,137 @@
+<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-col :span="12" class="mb20">
+      <el-form-item label="父分类编号" prop="parentId">
+        <el-input v-model="form.parentId" placeholder="请输入父分类编号"/>
+      </el-form-item>
+      </el-col>
+
+    <el-col :span="12" 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-form-item label="分类图" prop="picUrl">
+    <upload-img v-model="form.picUrl"></upload-img>
+  </el-form-item>
+  </el-col>
+
+    <el-col :span="12" class="mb20">
+      <el-form-item label="分类排序" prop="sort">
+        <el-input-number :min="1" :max="1000" v-model="form.sort" placeholder="请输入分类排序"></el-input-number>
+      </el-form-item>
+    </el-col>
+
+    <el-col :span="12" 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 status" border :key="index">{{ item.label }}
+            </el-radio>
+            </el-radio-group>
+        </el-form-item>
+      </el-col>
+
+    <el-col :span="12" class="mb20">
+      <el-form-item label="部门id" prop="deptId">
+        <el-input v-model="form.deptId" placeholder="请输入部门id"/>
+      </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>
+</template>
+
+<script setup lang="ts" name="SupermarketCategoryDialog">
+import { useDict } from '/@/hooks/dict';
+import { useMessage } from "/@/hooks/message";
+import { getObj, addObj, putObj } from '/@/api/supermarket/supermarketCategory'
+import { rule } from '/@/utils/validate';
+const emit = defineEmits(['refresh']);
+
+// 定义变量内容
+const dataFormRef = ref();
+const visible = ref(false)
+const loading = ref(false)
+// 定义字典
+const { status } = useDict('status')
+
+// 提交表单数据
+const form = reactive({
+		id:'',
+	  parentId: '',
+	  name: '',
+	  picUrl: '',
+		sort: 0,
+	  status: '',
+	  deptId: '',
+});
+
+// 定义校验规则
+const dataRules = ref({
+        name: [{required: true, message: '分类名称不能为空', trigger: 'blur'}],
+})
+
+// 打开弹窗
+const openDialog = (id: string) => {
+  visible.value = true
+  form.id = ''
+
+  // 重置表单数据
+	nextTick(() => {
+		dataFormRef.value?.resetFields();
+	});
+
+  // 获取supermarketCategory信息
+  if (id) {
+    form.id = id
+    getsupermarketCategoryData(id)
+  }
+};
+
+// 提交
+const onSubmit = async () => {
+	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;
+  }
+};
+
+
+// 初始化表单数据
+const getsupermarketCategoryData = (id: string) => {
+  // 获取数据
+  loading.value = true
+  getObj(id).then((res: any) => {
+    Object.assign(form, res.data)
+  }).finally(() => {
+    loading.value = false
+  })
+};
+
+// 暴露变量
+defineExpose({
+  openDialog
+});
+</script>
diff --git a/src/views/supermarket/supermarketCategory/index.vue b/src/views/supermarket/supermarketCategory/index.vue
new file mode 100644
index 0000000..eb2508d
--- /dev/null
+++ b/src/views/supermarket/supermarketCategory/index.vue
@@ -0,0 +1,136 @@
+<template>
+  <div class="layout-padding">
+    <div class="layout-padding-auto layout-padding-view">
+      <el-row v-show="showSearch">
+        <el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
+      <el-form-item label="分类名称" prop="name" >
+        <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="Refresh" @click="resetQuery">重置</el-button>
+          </el-form-item>
+        </el-form>
+      </el-row>
+      <el-row>
+        <div class="mb8" style="width: 100%">
+          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
+            v-auth="'supermarket_supermarketCategory_add'">
+            新 增
+          </el-button>
+          <el-button plain :disabled="multiple" icon="Delete" type="primary"
+            v-auth="'supermarket_supermarketCategory_del'" @click="handleDelete(selectObjs)">
+            删除
+          </el-button>
+          <right-toolbar v-model:showSearch="showSearch" :export="'supermarket_supermarketCategory_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-column type="selection" width="40" align="center" />
+        <el-table-column type="index" label="#" width="40" />
+          <el-table-column prop="parentId" label="父分类编号"  show-overflow-tooltip/>
+          <el-table-column prop="name" label="分类名称"  show-overflow-tooltip/>
+          <el-table-column prop="picUrl" 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="status" :value="scope.row.status"></dict-tag>
+            </template>
+          </el-table-column>
+          <el-table-column prop="deptId" label="部门id"  show-overflow-tooltip/>
+        <el-table-column label="操作" width="150">
+          <template #default="scope">
+            <el-button icon="edit-pen" text type="primary" v-auth="'supermarket_supermarketCategory_edit'"
+              @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
+            <el-button icon="delete" text type="primary" v-auth="'supermarket_supermarketCategory_del'" @click="handleDelete([scope.row.id])">删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+    </div>
+
+    <!-- 编辑、新增  -->
+    <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+
+  </div>
+</template>
+
+<script setup lang="ts" name="systemSupermarketCategory">
+import { BasicTableProps, useTable } from "/@/hooks/table";
+import { fetchList, delObjs } from "/@/api/supermarket/supermarketCategory";
+import { useMessage, useMessageBox } from "/@/hooks/message";
+import { useDict } from '/@/hooks/dict';
+
+// 引入组件
+const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+// 定义查询字典
+
+const { status } = useDict('status')
+// 定义变量内容
+const formDialogRef = ref()
+// 搜索变量
+const queryRef = ref()
+const showSearch = ref(true)
+// 多选变量
+const selectObjs = ref([]) as any
+const multiple = ref(true)
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+  queryForm: {},
+  pageList: fetchList
+})
+
+//  table hook
+const {
+  getDataList,
+  currentChangeHandle,
+  sizeChangeHandle,
+  sortChangeHandle,
+  downBlobFile,
+	tableStyle
+} = useTable(state)
+
+// 清空搜索条件
+const resetQuery = () => {
+  // 清空搜索条件
+  queryRef.value?.resetFields()
+  // 清空多选
+  selectObjs.value = []
+  getDataList()
+}
+
+// 导出excel
+const exportExcel = () => {
+  downBlobFile('/supermarket/supermarketCategory/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketCategory.xlsx')
+}
+
+// 多选事件
+const selectionChangHandle = (objs: { id: string }[]) => {
+  selectObjs.value = objs.map(({ id }) => id);
+  multiple.value = !objs.length;
+};
+
+// 删除操作
+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);
+  }
+};
+</script>
diff --git a/src/views/supermarket/supermarketSpu/form.vue b/src/views/supermarket/supermarketSpu/form.vue
index 986cc39..4657bdd 100644
--- a/src/views/supermarket/supermarketSpu/form.vue
+++ b/src/views/supermarket/supermarketSpu/form.vue
@@ -1,355 +1,360 @@
 <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-col :span="12" class="mb20">
-      <el-form-item label="货号" prop="productCode">
-        <el-input v-model="form.productCode" placeholder="请输入货号"/>
-      </el-form-item>
-      </el-col>
+	<el-dialog :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="true" draggable>
+		<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="auto" v-loading="loading">
+			<el-tabs v-model="tabPaneActiveName">
+				<el-tab-pane label="基础信息" name="基础信息" disabled style="overflow-y: scroll; height: 50vh">
+					<el-row style="padding: 10px">
+						<el-col :span="12" class="mb20">
+							<el-form-item label="货号" prop="productCode">
+								<el-input v-model="form.productCode" placeholder="请输入货号" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="自编码/条码" prop="barcode">
+								<el-input v-model="form.barcode" placeholder="请输入自编码/条码" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="商品名称" prop="productName">
+								<el-input v-model="form.productName" placeholder="请输入商品名称" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="单位" prop="unit">
+								<el-input v-model="form.unit" placeholder="请输入单位" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="商品分类" prop="categoryId">
+								<el-select v-model="form.categoryId" placeholder="请选择商品分类">
+									<el-option v-for="item in categoryOptions" :key="item.id" :label="item.name" :value="item.id" />
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="品牌" prop="brandId">
+								<el-select v-model="form.brandId" placeholder="请选择品牌">
+									<el-option v-for="item in brandOptions" :key="item.id" :label="item.name" :value="item.id" />
+								</el-select>
+							</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>
+							</el-form-item>
+						</el-col>
+						<el-col :span="24" class="mb20">
+							<el-form-item label="商品轮播图" prop="sliderPicUrls">
+								<upload-imgs v-model:imageUrl="form.sliderPicUrls"></upload-imgs>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="排序字段" prop="sort">
+								<el-input-number :min="0" :max="1000" v-model="form.sort" placeholder="请输入排序字段"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" 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 status" border :key="index">{{ item.label }} </el-radio>
+								</el-radio-group>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="成本单价" prop="costPrice">
+								<el-input-number v-model="form.costPrice" placeholder="请输入成本单价，单位:分"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="库存" prop="stock">
+								<el-input-number v-model="form.stock" placeholder="请输入库存"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="赠送积分" prop="giveIntegral">
+								<el-input-number v-model="form.giveIntegral" placeholder="请输入赠送积分"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="商户编号" prop="merchantId">
+								<el-select v-model="form.merchantId" placeholder="请选择商户编号">
+									<el-option label="请选择" value="">???</el-option>
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="规格" prop="specification">
+								<el-input v-model="form.specification" placeholder="请输入规格" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="产地" prop="origin">
+								<el-input v-model="form.origin" placeholder="请输入产地" />
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="装数" prop="packingQuantity">
+								<el-input-number :min="0" v-model="form.packingQuantity" placeholder="请输入装数"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="零售价" prop="retailPrice">
+								<el-input-number v-model="form.retailPrice" placeholder="请输入零售价"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="进价" prop="purchasePrice">
+								<el-input-number v-model="form.purchasePrice" placeholder="请输入进价"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="货商" prop="supplierId">
+								<el-select v-model="form.supplierId" placeholder="请选择货商">
+									<el-option label="请选择" value="">???</el-option>
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="会员价1" prop="memberPrice1">
+								<el-input-number v-model="form.memberPrice1" placeholder="请输入会员价1"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="会员价2" prop="memberPrice2">
+								<el-input-number v-model="form.memberPrice2" placeholder="请输入会员价2"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="会员价3" prop="memberPrice3">
+								<el-input-number v-model="form.memberPrice3" placeholder="请输入会员价3"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="批发价1" prop="wholesalePrice1">
+								<el-input-number v-model="form.wholesalePrice1" placeholder="请输入批发价1"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="批发价2" prop="wholesalePrice2">
+								<el-input-number v-model="form.wholesalePrice2" placeholder="请输入批发价2"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="批发价3" prop="wholesalePrice3">
+								<el-input-number v-model="form.wholesalePrice3" placeholder="请输入批发价3"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="促销价" prop="promotionPrice">
+								<el-input-number v-model="form.promotionPrice" placeholder="请输入促销价"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="商品性质" prop="productNature">
+								<el-select v-model="form.productNature" placeholder="请选择商品性质">
+									<el-option :value="item.value" :label="item.label" v-for="(item, index) in supermarket_nature" :key="index"></el-option>
+								</el-select>
+							</el-form-item>
+						</el-col>
+						<el-col :span="24" class="mb20">
+							<el-form-item label="商品简介" prop="introduction">
+								<el-input type="textarea" v-model="form.introduction" rows="4" placeholder="请输入商品简介" maxlength="400" show-word-limit />
+							</el-form-item>
+						</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>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="库存上限" prop="inventoryUpperLimit">
+								<el-input-number v-model="form.inventoryUpperLimit" placeholder="请输入库存上限"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="库存下限" prop="inventoryLowerLimit">
+								<el-input-number v-model="form.inventoryLowerLimit" placeholder="请输入库存下限"></el-input-number>
+							</el-form-item>
+						</el-col>
+						<el-col :span="12" class="mb20">
+							<el-form-item label="毛利率" prop="grossMargin">
+								<el-input-number v-model="form.grossMargin" placeholder="请输入毛利率"></el-input-number>
+							</el-form-item>
+						</el-col>
+					</el-row>
+				</el-tab-pane>
+				<el-tab-pane label="包装单位" name="包装单位" disabled style="overflow-y: scroll; height: 50vh"> aaaa </el-tab-pane>
+				<el-tab-pane label="辅助条码" name="辅助条码" disabled style="overflow-y: scroll; height: 50vh">
+					<el-table
+						ref="auxiliaryCodeTableRef"
+						:data="auxiliaryCodeState.dataList"
+						v-loading="auxiliaryCodeState.loading"
+						border
+						:cell-style="tableStyle.cellStyle"
+						:header-cell-style="tableStyle.headerCellStyle"
+						:row-style="{ cursor: 'pointer' }"
+						@selection-change="auxiliaryCodeSelectionChangHandle"
+						@row-click="HandleAuxiliaryCodeRowClick"
+					>
+						<el-table-column type="selection" width="40" align="center" />
+						<el-table-column type="index" label="#" width="40" />
+						<el-table-column prop="barCode" label="条码" show-overflow-tooltip />
+						<el-table-column prop="spuId" label="spuID" show-overflow-tooltip />
+					</el-table>
+				</el-tab-pane>
+			</el-tabs>
+		</el-form>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="自编码/条码" prop="barcode">
-        <el-input v-model="form.barcode" placeholder="请输入自编码/条码"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="商品名称" prop="productName">
-        <el-input v-model="form.productName" placeholder="请输入商品名称"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="单位" prop="unit">
-        <el-input v-model="form.unit" placeholder="请输入单位"/>
-      </el-form-item>
-      </el-col>
-
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="商品分类" prop="categoryId">
-          <el-select v-model="form.categoryId" placeholder="请选择商品分类">
-            <el-option label="请选择">0</el-option>
-          </el-select>
-        </el-form-item>
-      </el-col>
-         <el-col :span="12" class="mb20">
-           <el-form-item label="品牌" prop="brandId">
-             <el-select v-model="form.brandId" placeholder="请选择品牌">
-               <el-option label="请选择">0</el-option>
-             </el-select>
-           </el-form-item>
-         </el-col>
-    <el-col :span="24" class="mb20">
-  <el-form-item label="商品封面图" prop="picUrl">
-    <upload-file v-model:imageUrl="form.picUrl"></upload-file>
-  </el-form-item>
-  </el-col>
-
-    <el-col :span="24" class="mb20">
-  <el-form-item label="商品轮播图" prop="sliderPicUrls">
-    <upload-file v-model:imageUrl="form.sliderPicUrls"></upload-file>
-  </el-form-item>
-  </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="排序字段" prop="sort">
-        <el-input-number :min="1" :max="1000" v-model="form.sort" placeholder="请输入排序字段"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" 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 status" border :key="index">{{ item.label }}
-            </el-radio>
-            </el-radio-group>
-        </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="成本单价" prop="costPrice">
-        <el-input-number  v-model="form.costPrice" placeholder="请输入成本单价，单位： 分"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="库存" prop="stock">
-        <el-input-number  v-model="form.stock" placeholder="请输入库存"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="赠送积分" prop="giveIntegral">
-        <el-input-number  v-model="form.giveIntegral" placeholder="请输入赠送积分"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="商户编号" prop="merchantId">
-          <el-select v-model="form.merchantId" placeholder="请选择商户编号">
-            <el-option label="请选择">0</el-option>
-          </el-select>
-        </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="规格" prop="specification">
-        <el-input v-model="form.specification" placeholder="请输入规格"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="产地" prop="origin">
-        <el-input v-model="form.origin" placeholder="请输入产地"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="装数" prop="packingQuantity">
-        <el-input-number :min="1"  v-model="form.packingQuantity" placeholder="请输入装数"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-         <el-col :span="12" class="mb20">
-           <el-form-item label="零售价" prop="retailPrice">
-             <el-input-number  v-model="form.retailPrice" placeholder="请输入零售价"></el-input-number>
-           </el-form-item>
-         </el-col>
-    <el-col :span="12" class="mb20">
-      <el-form-item label="进价" prop="purchasePrice">
-        <el-input-number  v-model="form.purchasePrice" placeholder="请输入进价"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-
-         <el-col :span="12" class="mb20">
-           <el-form-item label="货商" prop="supplierId">
-             <el-select v-model="form.supplierId" placeholder="请选择货商">
-               <el-option label="请选择">0</el-option>
-             </el-select>
-           </el-form-item>
-         </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会员价1" prop="memberPrice1">
-        <el-input-number  v-model="form.memberPrice1" placeholder="请输入会员价1"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会员价2" prop="memberPrice2">
-        <el-input-number  v-model="form.memberPrice2" placeholder="请输入会员价2"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="会员价3" prop="memberPrice3">
-        <el-input  v-model="form.memberPrice3" placeholder="请输入会员价3"></el-input>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="批发价1" prop="wholesalePrice1">
-        <el-input-number  v-model="form.wholesalePrice1" placeholder="请输入批发价1"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="批发价2" prop="wholesalePrice2">
-        <el-input-number v-model="form.wholesalePrice2" placeholder="请输入批发价2"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="批发价3" prop="wholesalePrice3">
-        <el-input-number  v-model="form.wholesalePrice3" placeholder="请输入批发价3"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="促销价" prop="promotionPrice">
-        <el-input-number  v-model="form.promotionPrice" placeholder="请输入促销价"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="商品性质" prop="productNature">
-          <el-select v-model="form.productNature" placeholder="请选择商品性质">
-            <el-option :value="item.value" :label="item.label" v-for="(item, index) in supermarket_nature" :key="index"></el-option>
-          </el-select>
-        </el-form-item>
-      </el-col>
-         <el-col :span="12" class="mb20">
-           <el-form-item label="商品简介" prop="introduction">
-             <el-input type="textarea" v-model="form.introduction" placeholder="请输入商品简介"/>
-           </el-form-item>
-         </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>
-           </el-form-item>
-         </el-col>
-<!--    <el-col :span="12" class="mb20">-->
-<!--      <el-form-item label="签名上锁" prop="archiverSignature">-->
-<!--            <el-radio-group v-model="form.archiverSignature">-->
-<!--           <el-radio label="签名上锁" border>签名上锁</el-radio>-->
-<!--            </el-radio-group>-->
-<!--        </el-form-item>-->
-<!--      </el-col>-->
-
-<!--    <el-col :span="12" class="mb20">-->
-<!--      <el-form-item label="区管理库存" prop="inventoryArea">-->
-<!--            <el-radio-group v-model="form.inventoryArea">-->
-<!--           <el-radio label="区管理库存" border>区管理库存</el-radio>-->
-<!--            </el-radio-group>-->
-<!--        </el-form-item>-->
-<!--      </el-col>-->
-
-<!--    <el-col :span="12" class="mb20">-->
-<!--      <el-form-item label="比例提成" prop="commissionRate">-->
-<!--          <el-select v-model="form.commissionRate" placeholder="请选择比例提成">-->
-<!--            <el-option label="请选择">0</el-option>-->
-<!--          </el-select>-->
-<!--        </el-form-item>-->
-<!--      </el-col>-->
-
-<!--    <el-col :span="12" class="mb20">-->
-<!--      <el-form-item label="联营扣率" prop="jointDeductionRate">-->
-<!--        <el-input v-model="form.jointDeductionRate" placeholder="请输入联营扣率"/>-->
-<!--      </el-form-item>-->
-<!--      </el-col>-->
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="库存上限" prop="inventoryUpperLimit">
-        <el-input-number  v-model="form.inventoryUpperLimit" placeholder="请输入库存上限"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="库存下限" prop="inventoryLowerLimit">
-        <el-input-number  v-model="form.inventoryLowerLimit" placeholder="请输入库存下限"></el-input-number>
-      </el-form-item>
-    </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="毛利率" prop="grossMargin">
-        <el-input-number  v-model="form.grossMargin" placeholder="请输入毛利率"></el-input-number>
-      </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>
+		<template #footer>
+			<span class="dialog-footer">
+				<el-button @click="visible = false">取消</el-button>
+				<el-button v-if="currentTabPaneIndex != 0" type="primary" @click="currentTabPaneIndex--">上一步</el-button>
+				<el-button v-if="currentTabPaneIndex != 2" type="primary" @click="currentTabPaneIndex++">下一步</el-button>
+				<el-button v-if="currentTabPaneIndex == 2" type="primary" @click="onSubmit" :disabled="loading">确 认</el-button>
+			</span>
+		</template>
+	</el-dialog>
 </template>
 
 <script setup lang="ts" name="SupermarketSpuDialog">
 import { useDict } from '/@/hooks/dict';
-import { useMessage } from "/@/hooks/message";
-import { getObj, addObj, putObj } from '/@/api/supermarket/supermarketSpu'
+import { useMessage } from '/@/hooks/message';
+import { getObj, addObj, putObj, getSupermarketCategory, getSupermarketBrand } from '/@/api/supermarket/supermarketSpu';
 import { rule } from '/@/utils/validate';
+import { BasicTableProps, useTable } from '/@/hooks/table';
+import { fetchList } from '/@/api/supermarket/supermarketAuxiliaryCode';
 const emit = defineEmits(['refresh']);
 
-// 定义变量内容
+const tabPaneEnum = ['基础信息', '包装单位', '辅助条码'];
 const dataFormRef = ref();
-const visible = ref(false)
-const loading = ref(false)
-// 定义字典
-const { supermarket_nature,status } = useDict('supermarket_nature','status')
+const visible = ref(false);
+const loading = ref(false);
+const currentTabPaneIndex = ref(0);
+const tabPaneActiveName = computed(() => tabPaneEnum[currentTabPaneIndex.value]);
 
 // 提交表单数据
 const form = reactive({
-		id:'',
-	  productCode: '',
-	  barcode: '',
-	  productName: '',
-	  unit: '',
-	  introduction: '',
-	  description: '',
-	  categoryId: '',
-	  picUrl: '',
-	  sliderPicUrls: '',
-		sort: 0,
-	  status: '',
-		costPrice: 0,
-		stock: 0,
-		giveIntegral: 0,
-	  merchantId: '',
-	  deptId: '',
-	  specification: '',
-	  origin: '',
-		packingQuantity: 0,
-		purchasePrice: 0,
-		retailPrice: 0,
-		memberPrice1: 0,
-		memberPrice2: 0,
-		memberPrice3: 0,
-		wholesalePrice1: 0,
-		wholesalePrice2: 0,
-		wholesalePrice3: 0,
-		promotionPrice: 0,
-	  productNature: '',
-	  archiverSignature: '',
-	  inventoryArea: '',
-	  commissionRate: '',
-	  jointDeductionRate: '',
-		inventoryUpperLimit: 0,
-		inventoryLowerLimit: 0,
-		grossMargin: 0,
-	  auxiliaryBarcodeId: '',
-	  brandId: '',
-	  supplierId: '',
+	id: '',
+	productCode: '',
+	barcode: '',
+	productName: '',
+	unit: '',
+	categoryId: '',
+	brandId: '',
+	picUrl: '',
+	sliderPicUrls: '',
+	sort: 0,
+	status: '',
+	costPrice: 0,
+	stock: 0,
+	giveIntegral: 0,
+	merchantId: '',
+	specification: '',
+	origin: '',
+	packingQuantity: 0,
+	retailPrice: 0,
+	purchasePrice: 0,
+	supplierId: '',
+	memberPrice1: 0,
+	memberPrice2: 0,
+	memberPrice3: 0,
+	wholesalePrice1: 0,
+	wholesalePrice2: 0,
+	wholesalePrice3: 0,
+	promotionPrice: 0,
+	productNature: '',
+	introduction: '',
+	description: '',
+	inventoryUpperLimit: 0,
+	inventoryLowerLimit: 0,
+	grossMargin: 0,
 });
-
 // 定义校验规则
-const dataRules = ref({
-        productCode: [{required: true, message: '货号不能为空', trigger: 'blur'}],
-        barcode: [{required: true, message: '自编码/条码不能为空', trigger: 'blur'}],
-        productName: [{required: true, message: '商品名称不能为空', trigger: 'blur'}],
-        unit: [{required: true, message: '单位不能为空', trigger: 'blur'}],
-        sort: [{ validator: rule.number, trigger: 'blur' }],
-        costPrice: [{ validator: rule.number, trigger: 'blur' }],
-    stock: [{required: true, message: '库存不能为空', trigger: 'blur'}, { validator: rule.number, trigger: 'blur' }],
-        giveIntegral: [{ validator: rule.number, trigger: 'blur' }],
-        packingQuantity: [{ validator: rule.number, trigger: 'blur' }],
-        purchasePrice: [{ validator: rule.number, trigger: 'blur' }],
-        retailPrice: [{ validator: rule.number, trigger: 'blur' }],
-        memberPrice1: [{ validator: rule.number, trigger: 'blur' }],
-        memberPrice2: [{ validator: rule.number, trigger: 'blur' }],
-        memberPrice3: [{ validator: rule.number, trigger: 'blur' }],
-        wholesalePrice1: [{ validator: rule.number, trigger: 'blur' }],
-        wholesalePrice2: [{ validator: rule.number, trigger: 'blur' }],
-        wholesalePrice3: [{ validator: rule.number, trigger: 'blur' }],
-        promotionPrice: [{ validator: rule.number, trigger: 'blur' }],
-        inventoryUpperLimit: [{ validator: rule.number, trigger: 'blur' }],
-        inventoryLowerLimit: [{ validator: rule.number, trigger: 'blur' }],
-})
+const dataRules = {
+	productCode: [{ required: true, message: '货号不能为空', trigger: 'blur' }],
+	barcode: [{ required: true, message: '自编码/条码不能为空', trigger: 'blur' }],
+	productName: [{ required: true, message: '商品名称不能为空', trigger: 'blur' }],
+	unit: [{ required: true, message: '单位不能为空', trigger: 'blur' }],
+	categoryId: [{ required: true, message: '商品分类不能为空', trigger: 'blur' }],
+	brandId: [{ required: true, message: '品牌不能为空', trigger: 'blur' }],
+	picUrl: [{ required: true, message: '商品封面图不能为空', trigger: 'blur' }],
+	status: [{ required: true, message: '请选择商品状态', trigger: 'blur' }],
+	merchantId: [{ required: true, message: '商户编号不能为空', trigger: 'blur' }],
+	supplierId: [{ required: true, message: '请选择货商', trigger: 'blur' }],
+};
+const { supermarket_nature, status } = useDict('supermarket_nature', 'status');
+const categoryOptions = ref<any>([]); // 商品分类的下拉选项
+const brandOptions = ref<any>([]); // 超市品牌的下拉选项
+
+// 辅助条码state
+const auxiliaryCodeState: BasicTableProps = reactive<BasicTableProps>({
+	queryForm: {},
+	pageList: fetchList,
+});
+const auxiliaryCodeTableRef = ref();
+// 辅助条码多选变量
+const auxiliaryCodeSelectObjs = ref([]) as any;
+const { getDataList: getAuxiliaryCodeList, tableStyle } = useTable(auxiliaryCodeState);
+// 辅助条码多选事件
+const auxiliaryCodeSelectionChangHandle = (objs: { id: string }[]) => {
+	auxiliaryCodeSelectObjs.value = objs;
+};
+// 表格行点击事件
+const HandleAuxiliaryCodeRowClick = (row: any) => {
+	auxiliaryCodeTableRef.value.toggleRowSelection(row);
+};
+
+// 初始化表单数据
+const getsupermarketSpuData = (id: string) => {
+	// 获取数据
+	loading.value = true;
+	getObj(id)
+		.then((res: any) => {
+			Object.assign(form, res.data);
+		})
+		.finally(() => {
+			loading.value = false;
+		});
+};
 
 // 打开弹窗
-const openDialog = (id: string) => {
-  visible.value = true
-  form.id = ''
+const openDialog = async (id: string) => {
+	visible.value = true;
+	form.id = '';
 
-  // 重置表单数据
+	// 重置表单数据
 	nextTick(() => {
 		dataFormRef.value?.resetFields();
 	});
 
-  // 获取supermarketSpu信息
-  if (id) {
-    form.id = id
-    getsupermarketSpuData(id)
-  }
+	// 获取supermarketSpu信息
+	if (id) {
+		form.id = id;
+		getsupermarketSpuData(id);
+	}
+
+	// 获取分类选项
+	if (categoryOptions.value.length <= 0) {
+		try {
+			const res = await getSupermarketCategory();
+			categoryOptions.value = res.data;
+		} catch (error) {
+			categoryOptions.value = [];
+		}
+	}
+
+	// 获取品牌选项
+	if (brandOptions.value.length <= 0) {
+		try {
+			const res = await getSupermarketBrand();
+			brandOptions.value = res.data;
+		} catch (error) {
+			brandOptions.value = [];
+		}
+	}
+
+	// 获取辅助条码列表
+	getAuxiliaryCodeList();
 };
 
 // 提交
@@ -358,7 +363,7 @@ const onSubmit = async () => {
 	if (!valid) return false;
 
 	try {
-    loading.value = true;
+		loading.value = true;
 		form.id ? await putObj(form) : await addObj(form);
 		useMessage().success(form.id ? '修改成功' : '添加成功');
 		visible.value = false;
@@ -366,24 +371,19 @@ const onSubmit = async () => {
 	} catch (err: any) {
 		useMessage().error(err.msg);
 	} finally {
-    loading.value = false;
-  }
-};
-
-
-// 初始化表单数据
-const getsupermarketSpuData = (id: string) => {
-  // 获取数据
-  loading.value = true
-  getObj(id).then((res: any) => {
-    Object.assign(form, res.data)
-  }).finally(() => {
-    loading.value = false
-  })
+		loading.value = false;
+	}
 };
 
 // 暴露变量
 defineExpose({
-  openDialog
+	openDialog,
 });
 </script>
+
+<style scoped lang="scss">
+:deep(.el-tabs__item.is-disabled) {
+	color: #2e5cf6;
+	cursor: default;
+}
+</style>
diff --git a/src/views/supermarket/supermarketSpu/index.vue b/src/views/supermarket/supermarketSpu/index.vue
index d26ea64..7bc8043 100644
--- a/src/views/supermarket/supermarketSpu/index.vue
+++ b/src/views/supermarket/supermarketSpu/index.vue
@@ -1,162 +1,170 @@
 <template>
-  <div class="layout-padding">
-    <div class="layout-padding-auto layout-padding-view">
-      <el-row v-show="showSearch">
-        <el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
-      <el-form-item label="货号" prop="productCode" >
-        <el-input placeholder="请输入货号" v-model="state.queryForm.productCode" />
-      </el-form-item>
-      <el-form-item label="自编码/条码" prop="barcode" >
-        <el-input placeholder="请输入自编码/条码" v-model="state.queryForm.barcode" />
-      </el-form-item>
-      <el-form-item label="商品名称" prop="productName" >
-        <el-input placeholder="请输入商品名称" v-model="state.queryForm.productName" />
-      </el-form-item>
-          <el-form-item>
-            <el-button icon="search" type="primary" @click="getDataList">
-              查询
-            </el-button>
-            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-          </el-form-item>
-        </el-form>
-      </el-row>
-      <el-row>
-        <div class="mb8" style="width: 100%">
-          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
-            v-auth="'supermarket_supermarketSpu_add'">
-            新 增
-          </el-button>
-          <el-button plain :disabled="multiple" icon="Delete" type="primary"
-            v-auth="'supermarket_supermarketSpu_del'" @click="handleDelete(selectObjs)">
-            删除
-          </el-button>
-          <right-toolbar v-model:showSearch="showSearch" :export="'supermarket_supermarketSpu_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"
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row v-show="showSearch">
+				<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
+					<el-form-item label="货号" prop="productCode">
+						<el-input placeholder="请输入货号" v-model="state.queryForm.productCode" />
+					</el-form-item>
+					<el-form-item label="自编码/条码" prop="barcode">
+						<el-input placeholder="请输入自编码/条码" v-model="state.queryForm.barcode" />
+					</el-form-item>
+					<el-form-item label="商品名称" prop="productName">
+						<el-input placeholder="请输入商品名称" v-model="state.queryForm.productName" />
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
+						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+					</el-form-item>
+				</el-form>
+			</el-row>
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()" v-auth="'supermarket_supermarketSpu_add'">
+						新 增
+					</el-button>
+					<el-button
+						plain
+						:disabled="multiple"
+						icon="Delete"
+						type="primary"
+						v-auth="'supermarket_supermarketSpu_del'"
+						@click="handleDelete(selectObjs)"
+					>
+						删 除
+					</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarket_supermarketSpu_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-column type="selection" width="40" align="center" />
-        <el-table-column type="index" label="#" width="40" />
-          <el-table-column prop="productCode" label="货号"  show-overflow-tooltip/>
-          <el-table-column prop="barcode" label="自编码/条码"  show-overflow-tooltip/>
-          <el-table-column prop="productName" label="商品名称"  show-overflow-tooltip/>
-          <el-table-column prop="unit" label="单位"  show-overflow-tooltip/>
-          <el-table-column prop="categoryId" label="商品分类"  show-overflow-tooltip/>
-          <el-table-column prop="picUrl" label="封面图"  show-overflow-tooltip/>
-          <el-table-column prop="status" label="商品状态" show-overflow-tooltip>
-      <template #default="scope">
-                <dict-tag :options="status" :value="scope.row.status"></dict-tag>
-            </template>
-          </el-table-column>
-          <el-table-column prop="costPrice" label="成本单价"  show-overflow-tooltip/>
-          <el-table-column prop="stock" label="库存"  show-overflow-tooltip/>
-<!--          <el-table-column prop="giveIntegral" label="赠送积分"  show-overflow-tooltip/>-->
-<!--          <el-table-column prop="merchantId" label="商户编号"  show-overflow-tooltip/>-->
-          <el-table-column prop="specification" label="规格"  show-overflow-tooltip/>
-<!--          <el-table-column prop="origin" label="产地"  show-overflow-tooltip/>-->
-          <el-table-column prop="packingQuantity" label="装数"  show-overflow-tooltip/>
-          <el-table-column prop="purchasePrice" label="进价）"  show-overflow-tooltip/>
-          <el-table-column prop="retailPrice" label="零售价"  show-overflow-tooltip/>
-          <el-table-column prop="promotionPrice" label="促销价"  show-overflow-tooltip/>
-          <el-table-column prop="productNature" label="商品性质" show-overflow-tooltip>
-      <template #default="scope">
-                <dict-tag :options="supermarket_nature" :value="scope.row.productNature"></dict-tag>
-            </template>
-          </el-table-column>
-<!--          <el-table-column prop="inventoryUpperLimit" label="库存上限"  show-overflow-tooltip/>-->
-<!--          <el-table-column prop="inventoryLowerLimit" label="库存下限"  show-overflow-tooltip/>-->
-<!--          <el-table-column prop="grossMargin" label="毛利率"  show-overflow-tooltip/>-->
-          <el-table-column prop="brandId" label="品牌"  show-overflow-tooltip/>
-        <el-table-column label="操作" width="150">
-          <template #default="scope">
-            <el-button icon="edit-pen" text type="primary" v-auth="'supermarket_supermarketSpu_edit'"
-              @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
-            <el-button icon="delete" text type="primary" v-auth="'supermarket_supermarketSpu_del'" @click="handleDelete([scope.row.id])">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
-    </div>
+				@sort-change="sortChangeHandle"
+			>
+				<el-table-column type="selection" width="40" align="center" fixed="left" />
+				<el-table-column type="index" label="#" width="40" />
+				<el-table-column prop="productCode" label="货号" show-overflow-tooltip />
+				<el-table-column prop="barcode" label="自编码/条码" show-overflow-tooltip width="100" />
+				<el-table-column prop="productName" label="商品名称" show-overflow-tooltip width="100" />
+				<el-table-column prop="unit" label="单位" show-overflow-tooltip />
+				<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip width="100" />
+				<el-table-column prop="picUrl" label="封面图" show-overflow-tooltip />
+				<el-table-column prop="status" label="商品状态" show-overflow-tooltip width="100">
+					<template #default="scope">
+						<dict-tag :options="status" :value="scope.row.status"></dict-tag>
+					</template>
+				</el-table-column>
+				<el-table-column prop="costPrice" label="成本单价" show-overflow-tooltip width="100" />
+				<el-table-column prop="stock" label="库存" show-overflow-tooltip />
+				<!--          <el-table-column prop="giveIntegral" label="赠送积分"  show-overflow-tooltip/>-->
+				<!--          <el-table-column prop="merchantId" label="商户编号"  show-overflow-tooltip/>-->
+				<el-table-column prop="specification" label="规格" show-overflow-tooltip />
+				<!--          <el-table-column prop="origin" label="产地"  show-overflow-tooltip/>-->
+				<el-table-column prop="packingQuantity" label="装数" show-overflow-tooltip />
+				<el-table-column prop="purchasePrice" label="进价）" show-overflow-tooltip />
+				<el-table-column prop="retailPrice" label="零售价" show-overflow-tooltip />
+				<el-table-column prop="promotionPrice" label="促销价" show-overflow-tooltip />
+				<el-table-column prop="productNature" label="商品性质" show-overflow-tooltip width="100">
+					<template #default="scope">
+						<dict-tag :options="supermarket_nature" :value="scope.row.productNature"></dict-tag>
+					</template>
+				</el-table-column>
+				<!--          <el-table-column prop="inventoryUpperLimit" label="库存上限"  show-overflow-tooltip/>-->
+				<!--          <el-table-column prop="inventoryLowerLimit" label="库存下限"  show-overflow-tooltip/>-->
+				<!--          <el-table-column prop="grossMargin" label="毛利率"  show-overflow-tooltip/>-->
+				<el-table-column prop="brandId" label="品牌" show-overflow-tooltip />
+				<el-table-column label="操作" width="150" fixed="right">
+					<template #default="scope">
+						<el-button icon="edit-pen" text type="primary" v-auth="'supermarket_supermarketSpu_edit'" @click="formDialogRef.openDialog(scope.row.id)">
+							编辑
+						</el-button>
+						<el-button icon="delete" text type="primary" v-auth="'supermarket_supermarketSpu_del'" @click="handleDelete([scope.row.id])">
+							删除
+						</el-button>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		</div>
 
-    <!-- 编辑、新增  -->
-    <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
-
-  </div>
+		<!-- 编辑、新增  -->
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
 </template>
 
 <script setup lang="ts" name="systemSupermarketSpu">
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObjs } from "/@/api/supermarket/supermarketSpu";
-import { useMessage, useMessageBox } from "/@/hooks/message";
+import { BasicTableProps, useTable } from '/@/hooks/table';
+import { fetchList, delObjs } from '/@/api/supermarket/supermarketSpu';
+import { useMessage, useMessageBox } from '/@/hooks/message';
 import { useDict } from '/@/hooks/dict';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
 // 定义查询字典
 
-const { supermarket_nature,status } = useDict('supermarket_nature','status')
+const { supermarket_nature, status } = useDict('supermarket_nature', 'status');
 // 定义变量内容
-const formDialogRef = ref()
+const formDialogRef = ref();
 // 搜索变量
-const queryRef = ref()
-const showSearch = ref(true)
+const queryRef = ref();
+const showSearch = ref(true);
 // 多选变量
-const selectObjs = ref([]) as any
-const multiple = ref(true)
+const selectObjs = ref([]) as any;
+const multiple = ref(true);
 
 const state: BasicTableProps = reactive<BasicTableProps>({
-  queryForm: {},
-  pageList: fetchList
-})
+	queryForm: {},
+	pageList: fetchList,
+});
 
 //  table hook
-const {
-  getDataList,
-  currentChangeHandle,
-  sizeChangeHandle,
-  sortChangeHandle,
-  downBlobFile,
-	tableStyle
-} = useTable(state)
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
 
 // 清空搜索条件
 const resetQuery = () => {
-  // 清空搜索条件
-  queryRef.value?.resetFields()
-  // 清空多选
-  selectObjs.value = []
-  getDataList()
-}
+	// 清空搜索条件
+	queryRef.value?.resetFields();
+	// 清空多选
+	selectObjs.value = [];
+	getDataList();
+};
 
 // 导出excel
 const exportExcel = () => {
-  downBlobFile('/supermarket/supermarketSpu/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketSpu.xlsx')
-}
+	downBlobFile('/supermarket/supermarketSpu/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketSpu.xlsx');
+};
 
 // 多选事件
 const selectionChangHandle = (objs: { id: string }[]) => {
-  selectObjs.value = objs.map(({ id }) => id);
-  multiple.value = !objs.length;
+	selectObjs.value = objs.map(({ id }) => id);
+	multiple.value = !objs.length;
 };
 
 // 删除操作
 const handleDelete = async (ids: string[]) => {
-  try {
-    await useMessageBox().confirm('此操作将永久删除');
-  } catch {
-    return;
-  }
+	try {
+		await useMessageBox().confirm('此操作将永久删除');
+	} catch {
+		return;
+	}
 
-  try {
-    await delObjs(ids);
-    getDataList();
-    useMessage().success('删除成功');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  }
+	try {
+		await delObjs(ids);
+		getDataList();
+		useMessage().success('删除成功');
+	} catch (err: any) {
+		useMessage().error(err.msg);
+	}
 };
 </script>
diff --git a/src/views/supermarket/supermarketUnit/form.vue b/src/views/supermarket/supermarketUnit/form.vue
new file mode 100644
index 0000000..0e25370
--- /dev/null
+++ b/src/views/supermarket/supermarketUnit/form.vue
@@ -0,0 +1,138 @@
+<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-col :span="12" class="mb20">
+					<el-form-item label="条码" prop="barCode">
+						<el-input placeholder="请输入条码" v-model="form.barCode" />
+					</el-form-item>
+				</el-col>
+
+				<el-col :span="12" class="mb20">
+					<el-form-item label="规格" prop="spec">
+						<el-input placeholder="请输入规格" v-model="form.spec" />
+					</el-form-item>
+				</el-col>
+
+				<el-col :span="12" class="mb20">
+					<el-form-item label="单位" prop="unit">
+						<el-input placeholder="请输入单位" v-model="form.unit" />
+					</el-form-item>
+				</el-col>
+
+				<el-col :span="12" class="mb20">
+					<el-form-item label="状态" prop="status">
+						<el-select v-model="form.status" placeholder="请选择状态">
+							<el-option label="正常" :value="0"></el-option>
+							<el-option label="停销" :value="1"></el-option>
+						</el-select>
+					</el-form-item>
+				</el-col>
+
+				<el-col :span="12" class="mb20">
+					<el-form-item label="内装数量" prop="packageNum">
+						<el-input-number v-model="form.packageNum" placeholder="请输入内装数量" />
+					</el-form-item>
+				</el-col>
+
+				<el-col :span="12" class="mb20">
+					<el-form-item label="spuId" prop="spuId">
+						<el-input placeholder="请输入spuId" v-model="form.spuId" />
+					</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>
+</template>
+
+<script setup lang="ts" name="SupermarketAuxiliaryCodeDialog">
+import { useMessage } from '/@/hooks/message';
+import { getObj, addObj, putObj } from '/@/api/supermarket/supermarketUnit';
+const emit = defineEmits(['refresh']);
+
+// 定义变量内容
+const dataFormRef = ref();
+const visible = ref(false);
+const loading = ref(false);
+// 定义字典
+
+// 提交表单数据
+const form = reactive({
+	id: '',
+	barCode: '',
+	spec: '',
+	unit: '',
+	status: '',
+	packageNum: '',
+	spuId: '',
+});
+
+// 定义校验规则
+const dataRules = ref({
+	barCode: [{ required: true, message: '条码不能为空', trigger: 'blur' }],
+	spec: [{ required: true, message: 'spec不能为空', trigger: 'blur' }],
+	unit: [{ required: true, message: '单位不能为空', trigger: 'blur' }],
+	status: [{ required: true, message: '状态不能为空', trigger: 'blur' }],
+	packageNum: [{ required: true, message: '内装数量不能为空', trigger: 'blur' }],
+	spuId: [{ required: true, message: 'spuId不能为空', trigger: 'blur' }],
+});
+
+// 打开弹窗
+const openDialog = (id: string) => {
+	visible.value = true;
+	form.id = '';
+
+	// 重置表单数据
+	nextTick(() => {
+		dataFormRef.value?.resetFields();
+	});
+
+	// 获取supermarketAuxiliaryCode信息
+	if (id) {
+		form.id = id;
+		getSupermarketUnitData(id);
+	}
+};
+
+// 提交
+const onSubmit = async () => {
+	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;
+	}
+};
+
+// 初始化表单数据
+const getSupermarketUnitData = (id: string) => {
+	// 获取数据
+	loading.value = true;
+	getObj(id)
+		.then((res: any) => {
+			Object.assign(form, res.data);
+		})
+		.finally(() => {
+			loading.value = false;
+		});
+};
+
+// 暴露变量
+defineExpose({
+	openDialog,
+});
+</script>
diff --git a/src/views/supermarket/supermarketUnit/index.vue b/src/views/supermarket/supermarketUnit/index.vue
new file mode 100644
index 0000000..2c74c03
--- /dev/null
+++ b/src/views/supermarket/supermarketUnit/index.vue
@@ -0,0 +1,149 @@
+<template>
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row v-show="showSearch">
+				<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
+					<el-form-item label="条码" prop="barCode">
+						<el-input placeholder="请输入条码" v-model="state.queryForm.barCode" />
+					</el-form-item>
+					<el-form-item label="规格" prop="spec">
+						<el-input placeholder="请输入规格" v-model="state.queryForm.spec" />
+					</el-form-item>
+					<el-form-item label="单位" prop="unit">
+						<el-input placeholder="请输入单位" v-model="state.queryForm.unit" />
+					</el-form-item>
+					<el-form-item label="状态" prop="status">
+						<el-select v-model="state.queryForm.status" placeholder="请选择状态">
+							<el-option label="正常" :value="0" />
+							<el-option label="停销" :value="1" />
+						</el-select>
+					</el-form-item>
+					<el-form-item label="内装数量" prop="packageNum">
+						<el-input placeholder="请输入内装数量" v-model="state.queryForm.packageNum" />
+					</el-form-item>
+					<el-form-item label="spuId" prop="spuId">
+						<el-input placeholder="请输入spuId" v-model="state.queryForm.spuId" />
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
+						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+					</el-form-item>
+				</el-form>
+			</el-row>
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()">新 增</el-button>
+					<el-button plain :disabled="multiple" icon="Delete" type="primary" @click="handleDelete(selectObjs)">删 除</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarket_supermarketUnit_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-column type="selection" width="40" align="center" />
+				<el-table-column type="index" label="#" width="40" />
+				<el-table-column prop="barCode" label="条码" show-overflow-tooltip />
+				<el-table-column prop="spec" label="规格" show-overflow-tooltip />
+				<el-table-column prop="unit" label="单位" show-overflow-tooltip />
+				<el-table-column prop="status" label="状态" show-overflow-tooltip>
+					<template #default="scope">
+						<el-tag v-if="scope.row.status == 0" type="success">正常</el-tag>
+						<el-tag v-if="scope.row.status == 1" type="danger">停销</el-tag>
+					</template>
+				</el-table-column>
+				<el-table-column prop="packageNum" label="内装数量" show-overflow-tooltip />
+				<el-table-column prop="purchasePrice" label="进价/单位分" show-overflow-tooltip />
+				<el-table-column prop="retailPrice" label="零售价/单位分" show-overflow-tooltip />
+				<el-table-column prop="spuId" label="spuId" show-overflow-tooltip />
+				<el-table-column prop="promotionPrice" label="促销价" show-overflow-tooltip />
+				<el-table-column prop="costPrice" label="成本价" show-overflow-tooltip />
+				<el-table-column label="操作" width="150">
+					<template #default="scope">
+						<el-button icon="edit-pen" text type="primary" @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
+						<el-button icon="delete" text type="primary" @click="handleDelete([scope.row.id])">删除</el-button>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		</div>
+
+		<!-- 编辑、新增  -->
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
+</template>
+
+<script setup lang="ts" name="systemSupermarketAuxiliaryCode">
+import { BasicTableProps, useTable } from '/@/hooks/table';
+import { fetchList, delObjs } from '/@/api/supermarket/supermarketUnit';
+import { useMessage, useMessageBox } from '/@/hooks/message';
+
+// 引入组件
+const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+
+// 定义变量内容
+const formDialogRef = ref();
+// 搜索变量
+const queryRef = ref();
+const showSearch = ref(true);
+// 多选变量
+const selectObjs = ref([]) as any;
+const multiple = ref(true);
+
+const state: BasicTableProps = reactive<BasicTableProps>({
+	queryForm: {},
+	pageList: fetchList,
+});
+
+//  table hook
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
+
+// 清空搜索条件
+const resetQuery = () => {
+	// 清空搜索条件
+	queryRef.value?.resetFields();
+	// 清空多选
+	selectObjs.value = [];
+	getDataList();
+};
+
+// 导出excel
+const exportExcel = () => {
+	downBlobFile('/supermarket/supermarketUnit/export', Object.assign(state.queryForm, { ids: selectObjs }), 'supermarketUnit.xlsx');
+};
+
+// 多选事件
+const selectionChangHandle = (objs: { id: string }[]) => {
+	selectObjs.value = objs.map(({ id }) => id);
+	multiple.value = !objs.length;
+};
+
+// 删除操作
+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);
+	}
+};
+</script>
diff --git a/src/views/supermarketerp/smErpSupplier/form.vue b/src/views/supermarketerp/smErpSupplier/form.vue
index df01ff5..889611b 100644
--- a/src/views/supermarketerp/smErpSupplier/form.vue
+++ b/src/views/supermarketerp/smErpSupplier/form.vue
@@ -1,158 +1,163 @@
 <template>
-    <el-dialog :title="form.supplierId ? '编辑' : '新增'" 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-form-item label="货商名称" prop="supplierName">
-        <el-input v-model="form.supplierName" placeholder="请输入货商名称"/>
-      </el-form-item>
-      </el-col>
+	<el-dialog :title="form.supplierId ? '编辑' : '新增'" 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-form-item label="货商名称" prop="supplierName">
+						<el-input v-model="form.supplierName" placeholder="请输入货商名称" />
+					</el-form-item>
+				</el-col>
 
-         <el-col :span="12" class="mb20">
-           <el-form-item label="货商类别" prop="supplierType">
-             <el-input v-model="form.supplierType" placeholder="请输入货商类别"/>
-           </el-form-item>
-         </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="货商类别" prop="supplierType">
+						<el-select v-model="form.supplierType" placeholder="请输入货商类别">
+							<el-option v-for="item in supplierTypeOptions" :key="item.id" :label="item.typeName" :value="item.id" />
+						</el-select>
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="24" class="mb20">
-      <el-form-item label="货商地址" prop="address">
-        <el-input type="textarea" v-model="form.address" placeholder="请输入货商地址"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="24" class="mb20">
+					<el-form-item label="货商地址" prop="address">
+						<el-input type="textarea" v-model="form.address" placeholder="请输入货商地址" />
+					</el-form-item>
+				</el-col>
 
-         <el-col :span="12" class="mb20">
-           <el-form-item label="联系人" prop="linkName">
-             <el-input v-model="form.linkName" placeholder="请输入联系人"/>
-           </el-form-item>
-         </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="联系人" prop="linkName">
+						<el-input v-model="form.linkName" placeholder="请输入联系人" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="电话号码" prop="phone">
-        <el-input v-model="form.phone" placeholder="请输入电话号码"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="电话号码" prop="phone">
+						<el-input v-model="form.phone" placeholder="请输入电话号码" />
+					</el-form-item>
+				</el-col>
 
+				<el-col :span="12" class="mb20">
+					<el-form-item label="开户行" prop="openName">
+						<el-input v-model="form.openName" placeholder="请输入开户行" />
+					</el-form-item>
+				</el-col>
 
-         <el-col :span="12" class="mb20">
-           <el-form-item label="开户行" prop="openName">
-             <el-input v-model="form.openName" placeholder="请输入开户行"/>
-           </el-form-item>
-         </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="开户行账号" prop="openAccount">
+						<el-input v-model="form.openAccount" placeholder="请输入开户行账号" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="开户行账号" prop="openAccount">
-        <el-input v-model="form.openAccount" placeholder="请输入开户行账号"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="税号" prop="tax">
+						<el-input v-model="form.tax" placeholder="请输入税号" />
+					</el-form-item>
+				</el-col>
 
-         <el-col :span="12" class="mb20">
-           <el-form-item label="税号" prop="tax">
-             <el-input v-model="form.tax" placeholder="请输入税号"/>
-           </el-form-item>
-         </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="邮箱地址" prop="email">
+						<el-input v-model="form.email" placeholder="请输入邮箱地址" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="邮箱地址" prop="email">
-        <el-input v-model="form.email" placeholder="请输入邮箱地址"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="货商地区" prop="supplierArea">
+						<el-input v-model="form.supplierArea" placeholder="请输入货商地区" />
+					</el-form-item>
+				</el-col>
 
+				<el-col :span="12" class="mb20">
+					<el-form-item label="合同号" prop="contractNumber">
+						<el-input v-model="form.contractNumber" placeholder="请输入合同号" />
+					</el-form-item>
+				</el-col>
 
+				<el-col :span="12" 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 status" border :key="index">{{ item.label }} </el-radio>
+						</el-radio-group>
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="货商地区" prop="supplierArea">
-        <el-input v-model="form.supplierArea" placeholder="请输入货商地区"/>
-      </el-form-item>
-      </el-col>
-
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="合同号" prop="contractNumber">
-        <el-input v-model="form.contractNumber" placeholder="请输入合同号"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" 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 status" border :key="index">{{ item.label }}
-            </el-radio>
-            </el-radio-group>
-        </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="拼音简码" prop="pinyinCod">
-        <el-input v-model="form.pinyinCod" placeholder="请输入拼音简码"/>
-      </el-form-item>
-      </el-col>
-
+				<el-col :span="12" class="mb20">
+					<el-form-item label="拼音简码" prop="pinyinCod">
+						<el-input v-model="form.pinyinCod" placeholder="请输入拼音简码" />
+					</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>
+		</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>
 </template>
 
 <script setup lang="ts" name="SmErpSupplierDialog">
 import { useDict } from '/@/hooks/dict';
-import { useMessage } from "/@/hooks/message";
-import { getObj, addObj, putObj } from '/@/api/supermarketerp/smErpSupplier'
+import { useMessage } from '/@/hooks/message';
+import { getObj, addObj, putObj, getSupplierTypeOptions } from '/@/api/supermarketerp/smErpSupplier';
 import { rule } from '/@/utils/validate';
 const emit = defineEmits(['refresh']);
 
 // 定义变量内容
 const dataFormRef = ref();
-const visible = ref(false)
-const loading = ref(false)
+const visible = ref(false);
+const loading = ref(false);
 // 定义字典
-const { status } = useDict('status')
+const { status } = useDict('status');
+const supplierTypeOptions = ref<any>([]); // 货商类别管理下拉选项
 
 // 提交表单数据
 const form = reactive({
-		supplierId:'',
-	  supplierName: '',
-	  address: '',
-	  phone: '',
-	  tax: '',
-	  linkName: '',
-	  openAccount: '',
-	  email: '',
-	  deptId: '',
-	  supplierType: '',
-	  supplierArea: '',
-	  passwordModifyTime: '',
-	  openName: '',
-	  contractNumber: '',
-	  status: '',
-	  pinyinCod: '',
+	supplierId: '',
+	supplierName: '',
+	address: '',
+	phone: '',
+	tax: '',
+	linkName: '',
+	openAccount: '',
+	email: '',
+	deptId: '',
+	supplierType: '',
+	supplierArea: '',
+	passwordModifyTime: '',
+	openName: '',
+	contractNumber: '',
+	status: '',
+	pinyinCod: '',
 });
 
 // 定义校验规则
 const dataRules = ref({
-        supplierName: [{required: true, message: '货商名称不能为空', trigger: 'blur'}],
-})
+	supplierName: [{ required: true, message: '货商名称不能为空', trigger: 'blur' }],
+});
 
 // 打开弹窗
-const openDialog = (id: string) => {
-  visible.value = true
-  form.supplierId = ''
+const openDialog = async (id: string) => {
+	visible.value = true;
+	form.supplierId = '';
 
-  // 重置表单数据
+	// 重置表单数据
 	nextTick(() => {
 		dataFormRef.value?.resetFields();
 	});
 
-  // 获取smErpSupplier信息
-  if (id) {
-    form.supplierId = id
-    getsmErpSupplierData(id)
-  }
+	// 获取smErpSupplier信息
+	if (id) {
+		form.supplierId = id;
+		getsmErpSupplierData(id);
+	}
+
+	if (supplierTypeOptions.value.length <= 0) {
+		try {
+			const res = await getSupplierTypeOptions();
+			supplierTypeOptions.value = res.data;
+		} catch (error) {
+			supplierTypeOptions.value = [];
+		}
+	}
 };
 
 // 提交
@@ -161,7 +166,7 @@ const onSubmit = async () => {
 	if (!valid) return false;
 
 	try {
-    loading.value = true;
+		loading.value = true;
 		form.supplierId ? await putObj(form) : await addObj(form);
 		useMessage().success(form.supplierId ? '修改成功' : '添加成功');
 		visible.value = false;
@@ -169,24 +174,25 @@ const onSubmit = async () => {
 	} catch (err: any) {
 		useMessage().error(err.msg);
 	} finally {
-    loading.value = false;
-  }
+		loading.value = false;
+	}
 };
 
-
 // 初始化表单数据
 const getsmErpSupplierData = (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,
 });
 </script>
diff --git a/src/views/supermarketerp/smErpSupplier/index.vue b/src/views/supermarketerp/smErpSupplier/index.vue
index b07429f..3b39302 100644
--- a/src/views/supermarketerp/smErpSupplier/index.vue
+++ b/src/views/supermarketerp/smErpSupplier/index.vue
@@ -1,148 +1,176 @@
 <template>
-  <div class="layout-padding">
-    <div class="layout-padding-auto layout-padding-view">
-      <el-row v-show="showSearch">
-        <el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
-      <el-form-item label="货商名称" prop="supplierName" >
-        <el-input placeholder="请输入货商名称" v-model="state.queryForm.supplierName" />
-      </el-form-item>
-      <el-form-item label="电话号码" prop="phone" >
-        <el-input placeholder="请输入电话号码" v-model="state.queryForm.phone" />
-      </el-form-item>
-      <el-form-item label="联系人" prop="linkName" >
-        <el-input placeholder="请输入联系人" v-model="state.queryForm.linkName" />
-      </el-form-item>
-          <el-form-item>
-            <el-button icon="search" type="primary" @click="getDataList">
-              查询
-            </el-button>
-            <el-button icon="Refresh" @click="resetQuery">重置</el-button>
-          </el-form-item>
-        </el-form>
-      </el-row>
-      <el-row>
-        <div class="mb8" style="width: 100%">
-          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
-            v-auth="'supermarketerp_smErpSupplier_add'">
-            新 增
-          </el-button>
-          <el-button plain :disabled="multiple" icon="Delete" type="primary"
-            v-auth="'supermarketerp_smErpSupplier_del'" @click="handleDelete(selectObjs)">
-            删除
-          </el-button>
-          <right-toolbar v-model:showSearch="showSearch" :export="'supermarketerp_smErpSupplier_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"
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row v-show="showSearch">
+				<el-form :model="state.queryForm" ref="queryRef" :inline="true" @keyup.enter="getDataList">
+					<el-form-item label="货商名称" prop="supplierName">
+						<el-input placeholder="请输入货商名称" v-model="state.queryForm.supplierName" />
+					</el-form-item>
+					<el-form-item label="电话号码" prop="phone">
+						<el-input placeholder="请输入电话号码" v-model="state.queryForm.phone" />
+					</el-form-item>
+					<el-form-item label="联系人" prop="linkName">
+						<el-input placeholder="请输入联系人" v-model="state.queryForm.linkName" />
+					</el-form-item>
+					<el-form-item>
+						<el-button icon="search" type="primary" @click="getDataList"> 查询 </el-button>
+						<el-button icon="Refresh" @click="resetQuery">重置</el-button>
+					</el-form-item>
+				</el-form>
+			</el-row>
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()" v-auth="'supermarketerp_smErpSupplier_add'">
+						新 增
+					</el-button>
+					<el-button
+						plain
+						:disabled="multiple"
+						icon="Delete"
+						type="primary"
+						v-auth="'supermarketerp_smErpSupplier_del'"
+						@click="handleDelete(selectObjs)"
+					>
+						删除
+					</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarketerp_smErpSupplier_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-column type="selection" width="40" align="center" />
-        <el-table-column type="index" label="#" width="40" />
-          <el-table-column prop="supplierName" label="货商名称"  show-overflow-tooltip/>
-          <el-table-column prop="phone" label="电话号码"  show-overflow-tooltip/>
-          <el-table-column prop="tax" label="税号"  show-overflow-tooltip/>
-          <el-table-column prop="linkName" label="联系人"  show-overflow-tooltip/>
-          <el-table-column prop="openAccount" label="开户行账号"  show-overflow-tooltip/>
-          <el-table-column prop="supplierType" label="货商类别"  show-overflow-tooltip/>
-          <el-table-column prop="supplierArea" label="货商地区"  show-overflow-tooltip/>
-          <el-table-column prop="openName" label="开户行"  show-overflow-tooltip/>
-          <el-table-column prop="contractNumber" label="合同号"  show-overflow-tooltip/>
-          <el-table-column prop="status" label="状态" show-overflow-tooltip>
-      <template #default="scope">
-                <dict-tag :options="status" :value="scope.row.status"></dict-tag>
-            </template>
-          </el-table-column>
-          <el-table-column prop="pinyinCod" label="拼音简码"  show-overflow-tooltip/>
-          <el-table-column prop="createTime" label="创建时间"  show-overflow-tooltip/>
-        <el-table-column label="操作" width="150">
-          <template #default="scope">
-            <el-button icon="edit-pen" text type="primary" v-auth="'supermarketerp_smErpSupplier_edit'"
-              @click="formDialogRef.openDialog(scope.row.supplierId)">编辑</el-button>
-            <el-button icon="delete" text type="primary" v-auth="'supermarketerp_smErpSupplier_del'" @click="handleDelete([scope.row.supplierId])">删除</el-button>
-          </template>
-        </el-table-column>
-      </el-table>
-      <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
-    </div>
+				@sort-change="sortChangeHandle"
+			>
+				<el-table-column type="selection" width="40" align="center" />
+				<el-table-column type="index" label="#" width="40" />
+				<el-table-column prop="supplierName" label="货商名称" show-overflow-tooltip />
+				<el-table-column prop="phone" label="电话号码" show-overflow-tooltip />
+				<el-table-column prop="tax" label="税号" show-overflow-tooltip />
+				<el-table-column prop="linkName" label="联系人" show-overflow-tooltip />
+				<el-table-column prop="openAccount" label="开户行账号" show-overflow-tooltip />
+				<el-table-column prop="supplierType" label="货商类别" show-overflow-tooltip>
+					<template #default="scope">{{
+						supplierType.length > 0 && supplierType.find((item: any) => item.id == scope.row.supplierType).typeName
+					}}</template>
+				</el-table-column>
+				<el-table-column prop="supplierArea" label="货商地区" show-overflow-tooltip />
+				<el-table-column prop="openName" label="开户行" show-overflow-tooltip />
+				<el-table-column prop="contractNumber" label="合同号" show-overflow-tooltip />
+				<el-table-column prop="status" label="状态" show-overflow-tooltip>
+					<template #default="scope">
+						<dict-tag :options="status" :value="scope.row.status"></dict-tag>
+					</template>
+				</el-table-column>
+				<el-table-column prop="pinyinCod" label="拼音简码" show-overflow-tooltip />
+				<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip />
+				<el-table-column label="操作" width="150">
+					<template #default="scope">
+						<el-button
+							icon="edit-pen"
+							text
+							type="primary"
+							v-auth="'supermarketerp_smErpSupplier_edit'"
+							@click="formDialogRef.openDialog(scope.row.supplierId)"
+							>编辑</el-button
+						>
+						<el-button icon="delete" text type="primary" v-auth="'supermarketerp_smErpSupplier_del'" @click="handleDelete([scope.row.supplierId])"
+							>删除</el-button
+						>
+					</template>
+				</el-table-column>
+			</el-table>
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		</div>
 
-    <!-- 编辑、新增  -->
-    <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
-
-  </div>
+		<!-- 编辑、新增  -->
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
 </template>
 
 <script setup lang="ts" name="systemSmErpSupplier">
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObjs } from "/@/api/supermarketerp/smErpSupplier";
-import { useMessage, useMessageBox } from "/@/hooks/message";
+import { BasicTableProps, useTable } from '/@/hooks/table';
+import { fetchList, delObjs, getSupplierTypeOptions } from '/@/api/supermarketerp/smErpSupplier';
+import { useMessage, useMessageBox } from '/@/hooks/message';
 import { useDict } from '/@/hooks/dict';
 
 // 引入组件
 const FormDialog = defineAsyncComponent(() => import('./form.vue'));
 // 定义查询字典
 
-const { status } = useDict('status')
+const { status } = useDict('status');
 // 定义变量内容
-const formDialogRef = ref()
+const formDialogRef = ref();
 // 搜索变量
-const queryRef = ref()
-const showSearch = ref(true)
+const queryRef = ref();
+const showSearch = ref(true);
 // 多选变量
-const selectObjs = ref([]) as any
-const multiple = ref(true)
+const selectObjs = ref([]) as any;
+const multiple = ref(true);
+const supplierType = ref<any>([]); // 货商类别
 
 const state: BasicTableProps = reactive<BasicTableProps>({
-  queryForm: {},
-  pageList: fetchList
-})
+	queryForm: {},
+	pageList: fetchList,
+});
 
 //  table hook
-const {
-  getDataList,
-  currentChangeHandle,
-  sizeChangeHandle,
-  sortChangeHandle,
-  downBlobFile,
-	tableStyle
-} = useTable(state)
+const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
+
+// 获取货商类别
+onMounted(async () => {
+	try {
+		const res = await getSupplierTypeOptions();
+		supplierType.value = res.data;
+	} catch (error) {
+		supplierType.value = [];
+	}
+});
 
 // 清空搜索条件
 const resetQuery = () => {
-  // 清空搜索条件
-  queryRef.value?.resetFields()
-  // 清空多选
-  selectObjs.value = []
-  getDataList()
-}
+	// 清空搜索条件
+	queryRef.value?.resetFields();
+	// 清空多选
+	selectObjs.value = [];
+	getDataList();
+};
 
 // 导出excel
 const exportExcel = () => {
-  downBlobFile('/supermarketerp/smErpSupplier/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpSupplier.xlsx')
-}
+	downBlobFile('/supermarketerp/smErpSupplier/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpSupplier.xlsx');
+};
 
 // 多选事件
 const selectionChangHandle = (objs: { supplierId: string }[]) => {
-  selectObjs.value = objs.map(({ supplierId }) => supplierId);
-  multiple.value = !objs.length;
+	selectObjs.value = objs.map(({ supplierId }) => supplierId);
+	multiple.value = !objs.length;
 };
 
 // 删除操作
 const handleDelete = async (ids: string[]) => {
-  try {
-    await useMessageBox().confirm('此操作将永久删除');
-  } catch {
-    return;
-  }
+	try {
+		await useMessageBox().confirm('此操作将永久删除');
+	} catch {
+		return;
+	}
 
-  try {
-    await delObjs(ids);
-    getDataList();
-    useMessage().success('删除成功');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  }
+	try {
+		await delObjs(ids);
+		getDataList();
+		useMessage().success('删除成功');
+	} catch (err: any) {
+		useMessage().error(err.msg);
+	}
 };
 </script>