From a7a3f80376785784e36ba904d9b59a9fa2da1fdf Mon Sep 17 00:00:00 2001
From: weiwei <ctw@example.com>
Date: Thu, 13 Feb 2025 22:32:36 +0800
Subject: [PATCH] =?UTF-8?q?=E9=87=87=E8=B4=AD=E8=AE=A1=E5=88=92=E5=8F=AF?=
 =?UTF-8?q?=E7=BC=96=E8=BE=91=E8=A1=A8=E6=A0=BC?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |   3 +-
 src/main.ts                                   |  35 +-
 src/router/route.ts                           |  84 ++--
 .../smErpCgPlan/createCgPlan.vue              | 413 ++++++++++++++++++
 src/views/supermarketerp/smErpCgPlan/form.vue | 291 ++++++------
 .../supermarketerp/smErpCgPlan/index.vue      | 269 +++++++-----
 .../smErpCgPlan/smErpCgPlanItem/index.vue     | 159 +++----
 7 files changed, 850 insertions(+), 404 deletions(-)
 create mode 100644 src/views/supermarketerp/smErpCgPlan/createCgPlan.vue

diff --git a/package.json b/package.json
index 67917ff..7cdab72 100644
--- a/package.json
+++ b/package.json
@@ -55,7 +55,8 @@
 		"vue-router": "^4.1.6",
 		"vue3-tree-org": "^4.2.2",
 		"vue3-video-play": "1.3.1-beta.6",
-		"vuedraggable": "^4.1.0"
+		"vuedraggable": "^4.1.0",
+		"vxe-table": "^4.10.15"
 	},
 	"devDependencies": {
 		"@types/crypto-js": "^4.2.2",
diff --git a/src/main.ts b/src/main.ts
index 491e22a..27263a3 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,31 +1,34 @@
-import { createApp } from 'vue';
-import pinia from '/@/stores/index';
-import App from './App.vue';
-import router from './router';
-import { directive } from '/@/directive';
-import Components from '/@/components';
-import { i18n } from '/@/i18n';
-import { properties } from '/@/utils/globalProperties';
-import { initAntiDebug } from '/@/utils/anti-debug';
+import { createApp } from "vue"
+import pinia from "/@/stores/index"
+import App from "./App.vue"
+import router from "./router"
+import { directive } from "/@/directive"
+import Components from "/@/components"
+import { i18n } from "/@/i18n"
+import { properties } from "/@/utils/globalProperties"
+import { initAntiDebug } from "/@/utils/anti-debug"
 import "/@/assets/styles/global.scss"
+import VxeUITable from "vxe-table"
+import "vxe-table/lib/style.css"
 
 // Initialize anti-debug protection
-initAntiDebug();
+initAntiDebug()
 
 // 导入全局样式
-import '/@/theme/tailwind.css';
-import '/@/theme/index.scss';
+import "/@/theme/tailwind.css"
+import "/@/theme/index.scss"
 
-const app = createApp(App);
+const app = createApp(App)
 
 // 全局自定方法挂载
-properties(app);
+properties(app)
 // 全局自定义指令挂载
-directive(app);
+directive(app)
 
 app
 	.use(pinia) // pinia 存储
 	.use(router) // 路由
 	.use(Components) // 全局引入自定义的组件&第三方的组件
 	.use(i18n) // 国际化
-	.mount('#app');
+	.use(VxeUITable)
+	.mount("#app")
diff --git a/src/router/route.ts b/src/router/route.ts
index bab69c4..0b754ae 100644
--- a/src/router/route.ts
+++ b/src/router/route.ts
@@ -1,4 +1,4 @@
-import { RouteRecordRaw } from 'vue-router';
+import { RouteRecordRaw } from "vue-router"
 
 /**
  * 建议：路由 path 路径与文件夹名称相同，找文件可浏览器地址找，方便定位文件位置
@@ -18,16 +18,16 @@ import { RouteRecordRaw } from 'vue-router';
  */
 
 // 扩展 RouteMeta 接口
-declare module 'vue-router' {
+declare module "vue-router" {
 	interface RouteMeta {
-		isLink?: string;
-		isHide?: boolean;
-		isAuth?: boolean;
-		isKeepAlive?: boolean;
-		isAffix?: boolean;
-		isIframe?: boolean;
-		roles?: string[];
-		icon?: string;
+		isLink?: string
+		isHide?: boolean
+		isAuth?: boolean
+		isKeepAlive?: boolean
+		isAffix?: boolean
+		isIframe?: boolean
+		roles?: string[]
+		icon?: string
 	}
 }
 
@@ -37,71 +37,79 @@ declare module 'vue-router' {
  */
 export const dynamicRoutes: Array<RouteRecordRaw> = [
 	{
-		path: '/home',
-		name: 'router.home',
-		component: () => import('/@/views/home/index.vue'),
+		path: "/home",
+		name: "router.home",
+		component: () => import("/@/views/home/index.vue"),
 		meta: {
-			isLink: '',
+			isLink: "",
 			isHide: false,
 			isKeepAlive: true,
 			isAffix: true,
 			isIframe: false,
-			icon: 'iconfont icon-shouye',
+			icon: "iconfont icon-shouye",
 		},
 	},
 	{
-		path: '/personal',
-		name: 'router.personal',
-		component: () => import('/@/views/admin/system/user/personal.vue'),
+		path: "/personal",
+		name: "router.personal",
+		component: () => import("/@/views/admin/system/user/personal.vue"),
 		meta: {
 			isHide: true,
 		},
 	},
-];
+	{
+		path: "/createCgPlan",
+		name: "创建采购计划",
+		component: () => import("/@/views/supermarketerp/smErpCgPlan/createCgPlan.vue"),
+		meta: {
+			isHide: true,
+		},
+	},
+]
 
 /**
  * 定义静态路由（默认路由）
  */
 export const staticRoutes: Array<RouteRecordRaw> = [
 	{
-		path: '/login',
-		name: 'staticRoutes.login',
-		component: () => import('/@/views/login/index.vue'),
+		path: "/login",
+		name: "staticRoutes.login",
+		component: () => import("/@/views/login/index.vue"),
 		meta: {
 			isAuth: false,
 		},
 	},
 	{
-		path: '/authredirect',
-		name: 'staticRoutes.authredirect',
-		component: () => import('/@/views/login/component/authredirect.vue'),
+		path: "/authredirect",
+		name: "staticRoutes.authredirect",
+		component: () => import("/@/views/login/component/authredirect.vue"),
 		meta: {
 			isAuth: false,
 		},
 	},
-];
+]
 
 /**
  * 定义404、401界面
  */
 export const notFoundAndNoPower = [
 	{
-		path: '/:path(.*)*',
-		name: 'staticRoutes.notFound',
-		component: () => import('/@/views/error/404.vue'),
+		path: "/:path(.*)*",
+		name: "staticRoutes.notFound",
+		component: () => import("/@/views/error/404.vue"),
 		meta: {
 			isHide: true,
 		},
 	},
 	{
-		path: '/401',
-		name: 'staticRoutes.noPower',
-		component: () => import('/@/views/error/401.vue'),
+		path: "/401",
+		name: "staticRoutes.noPower",
+		component: () => import("/@/views/error/401.vue"),
 		meta: {
 			isHide: true,
 		},
 	},
-];
+]
 
 /**
  *  基础性路由
@@ -110,13 +118,13 @@ export const notFoundAndNoPower = [
  */
 export const baseRoutes: Array<RouteRecordRaw> = [
 	{
-		path: '/',
-		name: '/',
-		component: () => import('/@/layout/index.vue'),
-		redirect: '/home',
+		path: "/",
+		name: "/",
+		component: () => import("/@/layout/index.vue"),
+		redirect: "/home",
 		meta: {
 			isKeepAlive: true,
 		},
 		children: [],
 	},
-];
+]
diff --git a/src/views/supermarketerp/smErpCgPlan/createCgPlan.vue b/src/views/supermarketerp/smErpCgPlan/createCgPlan.vue
new file mode 100644
index 0000000..98d3699
--- /dev/null
+++ b/src/views/supermarketerp/smErpCgPlan/createCgPlan.vue
@@ -0,0 +1,413 @@
+<template>
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view" style="overflow: scroll">
+			<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="140px" v-loading="loading">
+				<el-row>
+					<el-form-item label="采购计划编号" prop="planCode">
+						<el-input v-model="form.planCode" placeholder="请输入采购计划编号" />
+					</el-form-item>
+
+					<el-form-item label="采购计划单据日期" prop="planDate">
+						<el-input v-model="form.planDate" placeholder="请输入采购计划单据日期" />
+					</el-form-item>
+
+					<el-form-item label="仓库id" prop="warehouseId">
+						<el-input v-model="form.warehouseId" placeholder="请输入仓库id" />
+					</el-form-item>
+
+					<el-form-item label="经办人id" prop="handlerUserId">
+						<el-input v-model="form.handlerUserId" placeholder="请输入经办人id" />
+					</el-form-item>
+
+					<el-form-item label="审批状态" prop="checkStatus">
+						<el-input v-model="form.checkStatus" placeholder="请输入审批状态" />
+					</el-form-item>
+
+					<el-form-item label="审批人id" prop="checkUserId">
+						<el-input v-model="form.checkUserId" placeholder="请输入审批人id" />
+					</el-form-item>
+
+					<el-form-item label="审核日期" prop="checkTime">
+						<el-input v-model="form.checkTime" placeholder="请输入审核日期" />
+					</el-form-item>
+
+					<el-form-item label="商户编号" prop="merchantId">
+						<el-input v-model="form.merchantId" placeholder="请输入商户编号" />
+					</el-form-item>
+
+					<el-form-item label="部门id" prop="deptId">
+						<el-input v-model="form.deptId" placeholder="请输入部门id" />
+					</el-form-item>
+
+					<el-form-item label="出入库数量" prop="quantity">
+						<el-input v-model="form.quantity" placeholder="请输入出入库数量" />
+					</el-form-item>
+
+					<el-form-item label="累计进货数量" prop="totalNumber">
+						<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量" />
+					</el-form-item>
+
+					<el-form-item label="累计总金额" prop="totalAmount">
+						<el-input v-model="form.totalAmount" placeholder="请输入累计总金额" />
+					</el-form-item>
+
+					<el-form-item label="货商" prop="supplierId">
+						<el-input v-model="form.supplierId" placeholder="请输入货商" />
+					</el-form-item>
+
+					<el-form-item label="备注" prop="remark">
+						<el-input v-model="form.remark" placeholder="请输入备注" />
+					</el-form-item>
+
+					<el-form-item label="订单编号" prop="orderNumber">
+						<el-input v-model="form.orderNumber" placeholder="请输入订单编号" />
+					</el-form-item>
+				</el-row>
+			</el-form>
+
+			<el-row class="my-3">
+				<el-button @click="addEvent">新增（顶部）</el-button>
+				<el-button @click="pushEvent">新增（尾部）</el-button>
+				<el-button @click="insertEvent">
+					在第
+					<el-input-number
+						@click.stop
+						v-model="state.insertRowNumber"
+						:min="0"
+						:max="state.tableData.length"
+						:precision="0"
+						size="small"
+						controls-position="right"
+						style="min-width: 50px; margin: 0 5px"
+					/>
+					行新增
+				</el-button>
+				<el-button @click="removeSelectRowEvent" :disabled="state.selectedRowsIds.length <= 0">删除选中</el-button>
+			</el-row>
+
+			<vxe-table
+				ref="tableRef"
+				border
+				:loading="loading"
+				show-overflow
+				max-height="400"
+				:edit-config="{
+					trigger: 'click',
+					mode: 'cell',
+					beforeEditMethod({ row, column }:any) {
+						// name 为 'x' 开头的列禁止编辑
+						if (column.property === 'quantity') {
+							return false
+						}
+						return true
+					},
+				}"
+				:column-config="{ resizable: true }"
+				:row-config="{ isHover: true }"
+				:resizable-config="{ dragMode: 'fixed' }"
+				:data="state.tableData"
+				:edit-rules="validRules"
+				@checkbox-all="selectChangeEvent"
+				@checkbox-change="selectChangeEvent"
+				size="mini"
+				empty-text="无数据"
+				align="center"
+			>
+				<vxe-column type="checkbox" width="40" fixed="left"></vxe-column>
+
+				<vxe-column type="seq" width="70" fixed="left"></vxe-column>
+
+				<vxe-column field="planId" title="采购id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.planId" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="erpSpuId" title="库存商品id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.erpSpuId" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="merchantId" title="商户编号" :edit-render="{ autoFocus: 'input', placeholder: '请选择' }">
+					<template #edit="{ row }">
+						<select-mch v-model="row.merchantId" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="deptId" title="部门id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.deptId" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="quantity" title="数量" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.quantity" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="unitPrice" title="进价" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.unitPrice" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="totalAmount" title="累计总金额" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.totalAmount" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="remark" title="备注" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.remark" />
+					</template>
+				</vxe-column>
+
+				<vxe-column field="unitId" title="包装单位id" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+					<template #edit="{ row }">
+						<el-input v-model="row.unitId" />
+					</template>
+				</vxe-column>
+			</vxe-table>
+
+			<el-row class="my-3">
+				<el-button type="primary" plain @click="onSubmit">取消</el-button>
+				<el-button type="primary" plain @click="onSubmit">继续添加</el-button>
+				<el-button type="primary" plain @click="onSubmit">保存</el-button>
+			</el-row>
+		</div>
+	</div>
+</template>
+
+<script setup lang="ts" name="SmErpCgPlanDialog">
+import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
+import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgPlan"
+import { VxeTableEvents, VxeTablePropTypes, VxeUI, type VxeTableInstance } from "vxe-table"
+
+interface RowVO {
+	id: string
+	planId: string
+	erpSpuId: string
+	merchantId: string
+	deptId: string
+	quantity: number | null
+	unitPrice: number | null
+	totalAmount: number | null
+	remark: string
+	unitId: string
+}
+
+// 定义变量内容
+const loading = ref(false)
+const dataFormRef = ref()
+const tableRef = ref<VxeTableInstance<RowVO>>()
+
+// 提交表单数据
+const form = reactive({
+	id: "",
+	planCode: "",
+	planDate: "",
+	warehouseId: "",
+	handlerUserId: "",
+	checkStatus: "",
+	checkUserId: "",
+	checkTime: "",
+	merchantId: "",
+	deptId: "",
+	quantity: "",
+	totalNumber: "",
+	totalAmount: "",
+	supplierId: "",
+	remark: "",
+	orderNumber: "",
+})
+const state = reactive<{
+	tableData: RowVO[]
+	insertRecords: RowVO[]
+	selectedRowsIds: string[]
+	insertRowNumber: number
+}>({
+	tableData: [
+		{
+			id: "11",
+			planId: "11",
+			erpSpuId: "11",
+			merchantId: "11",
+			deptId: "11",
+			quantity: 11,
+			unitPrice: 11,
+			totalAmount: 11,
+			remark: "11",
+			unitId: "11",
+		},
+		{
+			id: "22",
+			planId: "22",
+			erpSpuId: "22",
+			merchantId: "22",
+			deptId: "22",
+			quantity: 11,
+			unitPrice: 11,
+			totalAmount: 11,
+			remark: "22",
+			unitId: "22",
+		},
+	],
+	insertRecords: [],
+	selectedRowsIds: [],
+	insertRowNumber: 0,
+})
+
+// 定义校验规则
+const dataRules = ref({
+	planCode: [{ required: true, message: "采购计划编号不能为空", trigger: "blur" }],
+	planDate: [{ required: true, message: "采购计划单据日期不能为空", trigger: "blur" }],
+})
+
+// 表格校验规则
+const validRules = ref<VxeTablePropTypes.EditRules<RowVO>>({
+	planId: [{ required: true, message: "必须填写" }],
+	totalAmount: [{ required: true, type: "number", min: 18, max: 28, message: "数值范围18~28" }],
+})
+
+// 表格行勾选
+const selectChangeEvent: VxeTableEvents.CheckboxChange<RowVO> = ({ checked }) => {
+	const $table = tableRef.value
+	if ($table) {
+		const records = $table.getCheckboxRecords()
+		console.log(checked ? "勾选事件" : "取消事件", records)
+		state.selectedRowsIds = records.map((item) => item.id)
+	}
+}
+
+// 顶部表格行新增
+const addEvent = () => {
+	const newRow: RowVO = {
+		id: "22",
+		planId: "",
+		erpSpuId: "",
+		merchantId: "",
+		deptId: "",
+		quantity: null,
+		unitPrice: null,
+		totalAmount: null,
+		remark: "",
+		unitId: "",
+	}
+	state.tableData.unshift(newRow)
+	state.insertRecords.push(newRow)
+	nextTick(() => {
+		const $table = tableRef.value
+		if ($table) {
+			$table.setEditRow(newRow)
+		}
+	})
+}
+
+// 底部表格行新增
+const pushEvent = () => {
+	const newRow: RowVO = {
+		id: "22",
+		planId: "",
+		erpSpuId: "",
+		merchantId: "",
+		deptId: "",
+		quantity: null,
+		unitPrice: null,
+		totalAmount: null,
+		remark: "",
+		unitId: "",
+	}
+	state.tableData.push(newRow)
+	state.insertRecords.push(newRow)
+	nextTick(() => {
+		const $table = tableRef.value
+		if ($table) {
+			$table.setEditRow(newRow)
+		}
+	})
+}
+
+// 在指定行插入
+const insertEvent = () => {
+	const newRow: RowVO = {
+		id: "22",
+		planId: "",
+		erpSpuId: "",
+		merchantId: "",
+		deptId: "",
+		quantity: null,
+		unitPrice: null,
+		totalAmount: null,
+		remark: "",
+		unitId: "",
+	}
+	state.tableData.splice(state.insertRowNumber, 0, newRow)
+	state.insertRecords.push(newRow)
+	nextTick(() => {
+		const $table = tableRef.value
+		if ($table) {
+			$table.setEditRow(newRow)
+		}
+	})
+}
+
+// 删除选中的行
+const removeSelectRowEvent = () => {
+	const $table = tableRef.value
+	if ($table) {
+		const selectRecords = $table.getCheckboxRecords()
+		if (selectRecords.length > 0) {
+			state.tableData = state.tableData.filter((item) => !selectRecords.some((row) => row.id === item.id))
+		}
+	}
+}
+
+// 提交
+const onSubmit = async () => {
+	console.log(state.tableData)
+
+	// 全量校验
+	const $table = tableRef.value
+	if ($table) {
+		const errMap = await $table.validate(true)
+		if (errMap) {
+			console.log("全量校验失败！")
+			return
+		} else {
+			console.log("全量校验成功！")
+			return
+		}
+	}
+}
+// 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 ? "修改成功" : "添加成功")
+// 	} catch (err: any) {
+// 		useMessage().error(err.msg)
+// 	} finally {
+// 		loading.value = false
+// 	}
+// }
+
+// 初始化表单数据
+// const getsmErpCgPlanData = (id: string) => {
+// 	// 获取数据
+// 	loading.value = true
+// 	getObj(id)
+// 		.then((res: any) => {
+// 			Object.assign(form, res.data)
+// 		})
+// 		.finally(() => {
+// 			loading.value = false
+// 		})
+// }
+</script>
diff --git a/src/views/supermarketerp/smErpCgPlan/form.vue b/src/views/supermarketerp/smErpCgPlan/form.vue
index 7e3b908..a79a479 100644
--- a/src/views/supermarketerp/smErpCgPlan/form.vue
+++ b/src/views/supermarketerp/smErpCgPlan/form.vue
@@ -1,197 +1,196 @@
 <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="planCode">
-        <el-input v-model="form.planCode" placeholder="请输入采购计划编号"/>
-      </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="planCode">
+						<el-input v-model="form.planCode" placeholder="请输入采购计划编号" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="采购计划单据日期" prop="planDate">
-        <el-input v-model="form.planDate" placeholder="请输入采购计划单据日期"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="采购计划单据日期" prop="planDate">
+						<el-input v-model="form.planDate" placeholder="请输入采购计划单据日期" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="仓库id" prop="warehouseId">
-        <el-input v-model="form.warehouseId" placeholder="请输入仓库id"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="仓库id" prop="warehouseId">
+						<el-input v-model="form.warehouseId" placeholder="请输入仓库id" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="经办人id" prop="handlerUserId">
-        <el-input v-model="form.handlerUserId" placeholder="请输入经办人id"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="经办人id" prop="handlerUserId">
+						<el-input v-model="form.handlerUserId" placeholder="请输入经办人id" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="审批状态" prop="checkStatus">
-        <el-input v-model="form.checkStatus" placeholder="请输入审批状态"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="审批状态" prop="checkStatus">
+						<el-input v-model="form.checkStatus" placeholder="请输入审批状态" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="审批人id" prop="checkUserId">
-        <el-input v-model="form.checkUserId" placeholder="请输入审批人id"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="审批人id" prop="checkUserId">
+						<el-input v-model="form.checkUserId" placeholder="请输入审批人id" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="审核日期" prop="checkTime">
-        <el-input v-model="form.checkTime" placeholder="请输入审核日期"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="审核日期" prop="checkTime">
+						<el-input v-model="form.checkTime" placeholder="请输入审核日期" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="商户编号" prop="merchantId">
-        <el-input v-model="form.merchantId" placeholder="请输入商户编号"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="商户编号" prop="merchantId">
+						<el-input v-model="form.merchantId" placeholder="请输入商户编号" />
+					</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-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-col :span="12" class="mb20">
-      <el-form-item label="出入库数量" prop="quantity">
-        <el-input v-model="form.quantity" placeholder="请输入出入库数量"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="出入库数量" prop="quantity">
+						<el-input v-model="form.quantity" placeholder="请输入出入库数量" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="累计进货数量" prop="totalNumber">
-        <el-input v-model="form.totalNumber" placeholder="请输入累计进货数量"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="累计进货数量" prop="totalNumber">
+						<el-input v-model="form.totalNumber" placeholder="请输入累计进货数量" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="累计总金额" prop="totalAmount">
-        <el-input v-model="form.totalAmount" placeholder="请输入累计总金额"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="累计总金额" prop="totalAmount">
+						<el-input v-model="form.totalAmount" placeholder="请输入累计总金额" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="货商" prop="supplierId">
-        <el-input v-model="form.supplierId" placeholder="请输入货商"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="货商" prop="supplierId">
+						<el-input v-model="form.supplierId" placeholder="请输入货商" />
+					</el-form-item>
+				</el-col>
 
-    <el-col :span="12" class="mb20">
-      <el-form-item label="备注" prop="remark">
-        <el-input v-model="form.remark" placeholder="请输入备注"/>
-      </el-form-item>
-      </el-col>
-
-    <el-col :span="12" class="mb20">
-      <el-form-item label="订单编号" prop="orderNumber">
-        <el-input v-model="form.orderNumber" placeholder="请输入订单编号"/>
-      </el-form-item>
-      </el-col>
+				<el-col :span="12" class="mb20">
+					<el-form-item label="备注" prop="remark">
+						<el-input v-model="form.remark" placeholder="请输入备注" />
+					</el-form-item>
+				</el-col>
 
+				<el-col :span="12" class="mb20">
+					<el-form-item label="订单编号" prop="orderNumber">
+						<el-input v-model="form.orderNumber" 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="SmErpCgPlanDialog">
-import { useDict } from '/@/hooks/dict';
-import { useMessage } from "/@/hooks/message";
-import { getObj, addObj, putObj } from '/src/api/supermarketerp/smErpCgPlan'
-import { rule } from '/@/utils/validate';
-const emit = defineEmits(['refresh']);
+import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
+import { getObj, addObj, putObj } from "/@/api/supermarketerp/smErpCgPlan"
+import { rule } from "/@/utils/validate"
+const emit = defineEmits(["refresh"])
 
 // 定义变量内容
-const dataFormRef = ref();
+const dataFormRef = ref()
 const visible = ref(false)
 const loading = ref(false)
 // 定义字典
 
 // 提交表单数据
 const form = reactive({
-		id:'',
-	  planCode: '',
-	  planDate: '',
-	  warehouseId: '',
-	  handlerUserId: '',
-	  checkStatus: '',
-	  checkUserId: '',
-	  checkTime: '',
-	  merchantId: '',
-	  deptId: '',
-	  quantity: '',
-	  totalNumber: '',
-	  totalAmount: '',
-	  supplierId: '',
-	  remark: '',
-	  orderNumber: '',
-});
+	id: "",
+	planCode: "",
+	planDate: "",
+	warehouseId: "",
+	handlerUserId: "",
+	checkStatus: "",
+	checkUserId: "",
+	checkTime: "",
+	merchantId: "",
+	deptId: "",
+	quantity: "",
+	totalNumber: "",
+	totalAmount: "",
+	supplierId: "",
+	remark: "",
+	orderNumber: "",
+})
 
 // 定义校验规则
 const dataRules = ref({
-        planCode: [{required: true, message: '采购计划编号不能为空', trigger: 'blur'}],
-        planDate: [{required: true, message: '采购计划单据日期不能为空', trigger: 'blur'}],
+	planCode: [{ required: true, message: "采购计划编号不能为空", trigger: "blur" }],
+	planDate: [{ required: true, message: "采购计划单据日期不能为空", trigger: "blur" }],
 })
 
 // 打开弹窗
 const openDialog = (id: string) => {
-  visible.value = true
-  form.id = ''
+	visible.value = true
+	form.id = ""
 
-  // 重置表单数据
+	// 重置表单数据
 	nextTick(() => {
-		dataFormRef.value?.resetFields();
-	});
+		dataFormRef.value?.resetFields()
+	})
 
-  // 获取smErpCgPlan信息
-  if (id) {
-    form.id = id
-    getsmErpCgPlanData(id)
-  }
-};
+	// 获取smErpCgPlan信息
+	if (id) {
+		form.id = id
+		getsmErpCgPlanData(id)
+	}
+}
 
 // 提交
 const onSubmit = async () => {
-	const valid = await dataFormRef.value.validate().catch(() => {});
-	if (!valid) return false;
+	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');
+		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);
+		useMessage().error(err.msg)
 	} finally {
-    loading.value = false;
-  }
-};
-
+		loading.value = false
+	}
+}
 
 // 初始化表单数据
 const getsmErpCgPlanData = (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/smErpCgPlan/index.vue b/src/views/supermarketerp/smErpCgPlan/index.vue
index 0bb5268..d353b04 100644
--- a/src/views/supermarketerp/smErpCgPlan/index.vue
+++ b/src/views/supermarketerp/smErpCgPlan/index.vue
@@ -1,94 +1,125 @@
 <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="planCode" >
-        <el-input placeholder="请输入采购计划编号" v-model="state.queryForm.planCode" />
-      </el-form-item>
-      <el-form-item label="采购计划单据日期" prop="planDate">
-      <el-date-picker type="date" placeholder="请输入采购计划单据日期" v-model="state.queryForm.planDate"></el-date-picker>
-      </el-form-item>
-      <el-form-item label="经办人id" prop="handlerUserId">
-            <el-select v-model="state.queryForm.handlerUserId" placeholder="请选择经办人id">
-              <el-option label="请选择">0</el-option>
-            </el-select>
-      </el-form-item>
-      <el-form-item label="审批状态" prop="checkStatus">
-            <el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
-              <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_smErpCgPlan_add'">
-            新 增
-          </el-button>
-          <el-button plain :disabled="multiple" icon="Delete" type="primary"
-            v-auth="'supermarket_smErpCgPlan_del'" @click="handleDelete(selectObjs)">
-            删除
-          </el-button>
-          <right-toolbar v-model:showSearch="showSearch" :export="'supermarket_smErpCgPlan_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="planCode">
+						<el-input placeholder="请输入采购计划编号" v-model="state.queryForm.planCode" />
+					</el-form-item>
+					<el-form-item label="采购计划单据日期" prop="planDate">
+						<el-date-picker type="date" placeholder="请输入采购计划单据日期" v-model="state.queryForm.planDate" />
+					</el-form-item>
+					<el-form-item label="经办人id" prop="handlerUserId">
+						<el-select v-model="state.queryForm.handlerUserId" placeholder="请选择经办人id">
+							<el-option label="请选择" value="00" />
+						</el-select>
+					</el-form-item>
+					<el-form-item label="审批状态" prop="checkStatus">
+						<el-select v-model="state.queryForm.checkStatus" placeholder="请选择审批状态">
+							<el-option label="请选择" value="00" />
+						</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="handleClickCreateCgPlan"
+						v-auth="'supermarket_smErpCgPlan_add'"
+					>
+						新 增
+					</el-button>
+					<el-button
+						plain
+						:disabled="multiple"
+						icon="Delete"
+						type="primary"
+						v-auth="'supermarket_smErpCgPlan_del'"
+						@click="handleDelete(selectObjs)"
+					>
+						删 除
+					</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarket_smErpCgPlan_export'"
+						@exportExcel="exportExcel"
+						class="ml10 mr20"
+						style="float: right"
+						@queryTable="getDataList"
+					/>
+				</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="planCode" label="采购计划编号"  show-overflow-tooltip/>
-          <el-table-column prop="planDate" label="采购计划单据日期"  show-overflow-tooltip/>
-          <el-table-column prop="warehouseId" label="仓库id"  show-overflow-tooltip/>
-          <el-table-column prop="handlerUserId" label="经办人id"  show-overflow-tooltip/>
-          <el-table-column prop="checkStatus" label="审批状态"  show-overflow-tooltip/>
-          <el-table-column prop="checkUserId" label="审批人id"  show-overflow-tooltip/>
-          <el-table-column prop="checkTime" label="审核日期"  show-overflow-tooltip/>
-          <el-table-column prop="merchantId" label="商户编号"  show-overflow-tooltip/>
-          <el-table-column prop="deptId" label="部门id"  show-overflow-tooltip/>
-          <el-table-column prop="quantity" label="出入库数量"  show-overflow-tooltip/>
-          <el-table-column prop="totalNumber" label="累计进货数量"  show-overflow-tooltip/>
-          <el-table-column prop="totalAmount" label="累计总金额"  show-overflow-tooltip/>
-          <el-table-column prop="supplierId" label="货商"  show-overflow-tooltip/>
-          <el-table-column prop="remark" label="备注"  show-overflow-tooltip/>
-          <el-table-column prop="orderNumber" label="订单编号"  show-overflow-tooltip/>
-        <el-table-column label="操作" width="150">
-          <template #default="scope">
-            <el-button icon="edit-pen" text type="primary" v-auth="'supermarket_smErpCgPlan_edit'"
-              @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
-            <el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgPlan_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="50" />
+				<el-table-column prop="planCode" label="采购计划编号" show-overflow-tooltip />
+				<el-table-column prop="planDate" label="采购计划单据日期" show-overflow-tooltip />
+				<el-table-column prop="warehouseId" label="仓库id" show-overflow-tooltip />
+				<el-table-column prop="handlerUserId" label="经办人id" show-overflow-tooltip />
+				<el-table-column prop="checkStatus" label="审批状态" show-overflow-tooltip />
+				<el-table-column prop="checkUserId" label="审批人id" show-overflow-tooltip />
+				<el-table-column prop="checkTime" label="审核日期" show-overflow-tooltip />
+				<el-table-column prop="merchantId" label="商户编号" show-overflow-tooltip />
+				<el-table-column prop="deptId" label="部门id" show-overflow-tooltip />
+				<el-table-column prop="quantity" label="出入库数量" show-overflow-tooltip />
+				<el-table-column prop="totalNumber" label="累计进货数量" show-overflow-tooltip />
+				<el-table-column prop="totalAmount" label="累计总金额" show-overflow-tooltip />
+				<el-table-column prop="supplierId" label="货商" show-overflow-tooltip />
+				<el-table-column prop="remark" label="备注" show-overflow-tooltip />
+				<el-table-column prop="orderNumber" label="订单编号" show-overflow-tooltip />
+				<el-table-column label="操作" width="150">
+					<template #default="scope">
+						<el-button
+							icon="edit-pen"
+							text
+							type="primary"
+							v-auth="'supermarket_smErpCgPlan_edit'"
+							@click="formDialogRef.openDialog(scope.row.id)"
+						>
+							编辑
+						</el-button>
+						<el-button
+							icon="delete"
+							text
+							type="primary"
+							v-auth="'supermarket_smErpCgPlan_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="systemSmErpCgPlan">
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObjs } from "/src/api/supermarketerp/smErpCgPlan";
-import { useMessage, useMessageBox } from "/@/hooks/message";
-import { useDict } from '/@/hooks/dict';
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { fetchList, delObjs } from "/@/api/supermarketerp/smErpCgPlan"
+import { useMessage, useMessageBox } from "/@/hooks/message"
 
 // 引入组件
-const FormDialog = defineAsyncComponent(() => import('./form.vue'));
-// 定义查询字典
+// const FormDialog = defineAsyncComponent(() => import("./form.vue"))
 
 // 定义变量内容
 const formDialogRef = ref()
@@ -100,54 +131,62 @@ 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/smErpCgPlan/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpCgPlan.xlsx')
+	downBlobFile(
+		"/supermarket/smErpCgPlan/export",
+		Object.assign(state.queryForm, { ids: selectObjs }),
+		"smErpCgPlan.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)
+	}
+}
+// ==========================================================
+
+import { useRouter } from "vue-router"
+
+const router = useRouter()
+
+// 点击创建采购清单
+const handleClickCreateCgPlan = () => {
+	router.push("/createCgPlan")
+}
 </script>
diff --git a/src/views/supermarketerp/smErpCgPlan/smErpCgPlanItem/index.vue b/src/views/supermarketerp/smErpCgPlan/smErpCgPlanItem/index.vue
index f3aa83d..83b99b9 100644
--- a/src/views/supermarketerp/smErpCgPlan/smErpCgPlanItem/index.vue
+++ b/src/views/supermarketerp/smErpCgPlan/smErpCgPlanItem/index.vue
@@ -1,61 +1,54 @@
 <template>
-  <div class="layout-padding">
-    <div class="layout-padding-auto layout-padding-view">
-      <el-row>
-        <div class="mb8" style="width: 100%">
-          <el-button icon="folder-add" type="primary" class="ml10" @click="formDialogRef.openDialog()"
-            v-auth="'supermarket_smErpCgPlanItem_add'">
-            新 增
-          </el-button>
-          <el-button plain :disabled="multiple" icon="Delete" type="primary"
-            v-auth="'supermarket_smErpCgPlanItem_del'" @click="handleDelete(selectObjs)">
-            删除
-          </el-button>
-          <right-toolbar v-model:showSearch="showSearch" :export="'supermarket_smErpCgPlanItem_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="planId" label="采购id"  show-overflow-tooltip/>
-          <el-table-column prop="erpSpuId" label="库存商品id"  show-overflow-tooltip/>
-          <el-table-column prop="merchantId" label="商户编号"  show-overflow-tooltip/>
-          <el-table-column prop="deptId" label="部门id"  show-overflow-tooltip/>
-          <el-table-column prop="quantity" label="数量"  show-overflow-tooltip/>
-          <el-table-column prop="unitPrice" label="进价"  show-overflow-tooltip/>
-          <el-table-column prop="totalAmount" label="累计总金额"  show-overflow-tooltip/>
-          <el-table-column prop="remark" label="备注"  show-overflow-tooltip/>
-          <el-table-column prop="unitId" 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_smErpCgPlanItem_edit'"
-              @click="formDialogRef.openDialog(scope.row.id)">编辑</el-button>
-            <el-button icon="delete" text type="primary" v-auth="'supermarket_smErpCgPlanItem_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>
+	<div class="layout-padding">
+		<div class="layout-padding-auto layout-padding-view">
+			<el-row>
+				<div class="mb8" style="width: 100%">
+					<el-button
+						icon="folder-add"
+						type="primary"
+						class="ml10"
+						@click="formDialogRef.openDialog()"
+						v-auth="'supermarket_smErpCgPlanItem_add'"
+					>
+						新 增
+					</el-button>
+					<el-button
+						plain
+						:disabled="multiple"
+						icon="Delete"
+						type="primary"
+						v-auth="'supermarket_smErpCgPlanItem_del'"
+						@click="handleDelete(selectObjs)"
+					>
+						删除
+					</el-button>
+					<right-toolbar
+						v-model:showSearch="showSearch"
+						:export="'supermarket_smErpCgPlanItem_export'"
+						@exportExcel="exportExcel"
+						class="ml10 mr20"
+						style="float: right"
+						@queryTable="getDataList"
+					></right-toolbar>
+				</div>
+			</el-row>
 
-    <!-- 编辑、新增  -->
-    <form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+			<pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" />
+		</div>
 
-  </div>
+		<!-- 编辑、新增  -->
+		<form-dialog ref="formDialogRef" @refresh="getDataList(false)" />
+	</div>
 </template>
 
 <script setup lang="ts" name="systemSmErpCgPlanItem">
-import { BasicTableProps, useTable } from "/@/hooks/table";
-import { fetchList, delObjs } from "/@/api/supermarket/smErpCgPlanItem";
-import { useMessage, useMessageBox } from "/@/hooks/message";
-import { useDict } from '/@/hooks/dict';
+import { BasicTableProps, useTable } from "/@/hooks/table"
+import { fetchList, delObjs } from "/@/api/supermarket/smErpCgPlanItem"
+import { useMessage, useMessageBox } from "/@/hooks/message"
+import { useDict } from "/@/hooks/dict"
 
 // 引入组件
-const FormDialog = defineAsyncComponent(() => import('./form.vue'));
+const FormDialog = defineAsyncComponent(() => import("./form.vue"))
 // 定义查询字典
 
 // 定义变量内容
@@ -64,58 +57,48 @@ 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
+	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/smErpCgPlanItem/export', Object.assign(state.queryForm, { ids: selectObjs }), 'smErpCgPlanItem.xlsx')
+	downBlobFile(
+		"/supermarket/smErpCgPlanItem/export",
+		Object.assign(state.queryForm, { ids: selectObjs }),
+		"smErpCgPlanItem.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 useMessageBox().confirm("此操作将永久删除")
+	} catch {
+		return
+	}
 
-  try {
-    await delObjs(ids);
-    getDataList();
-    useMessage().success('删除成功');
-  } catch (err: any) {
-    useMessage().error(err.msg);
-  }
-};
-</script>
\ No newline at end of file
+	try {
+		await delObjs(ids)
+		getDataList()
+		useMessage().success("删除成功")
+	} catch (err: any) {
+		useMessage().error(err.msg)
+	}
+}
+</script>