商品管理改动

src/views/supermarketerp/supermarketSpu/components/supermarketAuxiliaryCode.vue

@@ -0,0 +1,108 @@
+<template>
+	<div class="w-full h-full p-1">
+		<el-row class="my-1">
+			<el-button type="primary" @click="pushEvent">新增</el-button>
+			<el-button @click="removeSelectRowEvent">删除选中</el-button>
+		</el-row>
+
+		<vxe-table
+			ref="editableTableRef"
+			border
+			show-overflow
+			max-height="380"
+			:column-config="{ resizable: true }"
+			:row-config="{ isHover: true }"
+			:resizable-config="{ dragMode: 'fixed' }"
+			:data="supermarketAuxiliaryCodeEntityList"
+			:edit-rules="validRules"
+			:edit-config="{
+					trigger: 'click',
+					mode: 'cell',
+					beforeEditMethod({ row, column }:any) {
+						// 禁止编辑
+						if (column.property === '') {
+							return false
+						}
+						return true
+					},
+				}"
+			size="mini"
+			align="center"
+		>
+			<vxe-column type="checkbox" width="40" fixed="left" />
+			<vxe-column type="seq" width="50" fixed="left" />
+			<vxe-column field="barCode" title="条码" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input v-model.trim="row.barCode" />
+				</template>
+			</vxe-column>
+		</vxe-table>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { nanoid } from "nanoid"
+
+const supermarketAuxiliaryCodeEntityList = defineModel("supermarketAuxiliaryCodeEntityList", {
+	default: [
+		{
+			id: nanoid(5),
+			barCode: "",
+		},
+	],
+})
+
+const editableTableRef = ref()
+const validRules = {
+	barCode: [{ required: true, message: "条码不能为空", trigger: "blur" }],
+}
+
+// 底部表格行新增
+const pushEvent = () => {
+	const newRow: any = {
+		id: nanoid(5),
+		barCode: "",
+		isNew: true,
+	}
+	supermarketAuxiliaryCodeEntityList.value.push(newRow)
+	nextTick(() => {
+		const $table = editableTableRef.value
+		if ($table) {
+			$table.setEditRow(newRow)
+		}
+	})
+}
+
+// 删除选中的行
+const removeSelectRowEvent = () => {
+	const $table = editableTableRef.value
+	if ($table) {
+		const selectRecords = $table.getCheckboxRecords()
+		if (selectRecords.length > 0) {
+			supermarketAuxiliaryCodeEntityList.value = supermarketAuxiliaryCodeEntityList.value.filter(
+				(item: any) => !selectRecords.some((row: any) => row.id === item.id),
+			)
+		}
+	}
+}
+
+// 校验可编辑表格 成功返回 true 失败返回 false
+const editableTableValidate = async () => {
+	// 全量校验
+	const $table = editableTableRef.value
+	if ($table) {
+		const errMap = await $table.validate(true)
+		if (errMap) {
+			console.log("全量校验失败！", errMap)
+			return false
+		} else {
+			console.log("全量校验成功！")
+			return true
+		}
+	}
+}
+
+defineExpose({
+	editableTableValidate,
+})
+</script>

src/views/supermarketerp/supermarketSpu/components/supermarketAuxiliaryCode/form.vue

@@ -1,90 +0,0 @@
-<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="24" class="mb20">
-					<el-form-item label="条码" prop="barCode">
-						<el-input v-model.trim="form.barCode" 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>
-</template>
-
-<script setup lang="ts" name="SupermarketAuxiliaryCodeDialog">
-import { nanoid } from "nanoid"
-
-const emit = defineEmits(["refresh"])
-
-// 定义变量内容
-const dataFormRef = ref()
-const visible = ref(false)
-const loading = ref(false)
-
-// 提交表单数据
-const form = reactive<any>({
-	id: "",
-	barCode: "",
-})
-
-// 定义校验规则
-const dataRules = ref({
-	barCode: [{ required: true, message: "条码不能为空", trigger: "blur" }],
-})
-
-// 打开弹窗
-const openDialog = (rowData: any = null) => {
-	visible.value = true
-	form.id = nanoid(5)
-
-	// 重置表单数据
-	dataFormRef.value?.resetFields()
-	form.barCode = ""
-
-	if (rowData) {
-		Object.assign(form, rowData)
-	}
-}
-
-// 提交
-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 ? '修改成功' : '添加成功');
-	emit("refresh", { ...form })
-	visible.value = false
-	// } catch (err: any) {
-	// 	useMessage().error(err.msg);
-	// } finally {
-	// 	loading.value = false;
-	// }
-}
-
-// 初始化表单数据
-// const getsupermarketAuxiliaryCodeData = (id: string) => {
-// 	// 获取数据
-// 	loading.value = true;
-// 	getObj(id)
-// 		.then((res: any) => {
-// 			Object.assign(form, res.data);
-// 		})
-// 		.finally(() => {
-// 			loading.value = false;
-// 		});
-// };
-
-// 暴露变量
-defineExpose({
-	openDialog,
-})
-</script>

src/views/supermarketerp/supermarketSpu/components/supermarketAuxiliaryCode/index.vue

@@ -1,176 +0,0 @@
-<template>
-	<div style="width: 100%">
-		<!-- <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-input v-model="state.queryForm.spuId" placeholder="请输入spuID" />
-				</el-form-item>
-				<el-form-item>
-					<el-button icon="search" type="primary" v-auth="'supermarket_supermarketAuxiliaryCode_view'" @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(selectedCodeIds)"
-				>
-					删 除
-				</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-form-item label="" prop="supermarketAuxiliaryCodeEntityList">
-			<el-table
-				:data="supermarketAuxiliaryCodeEntityList"
-				border
-				:cell-style="tableStyle.cellStyle"
-				:header-cell-style="tableStyle.headerCellStyle"
-			>
-				<!-- <el-table-column type="selection" width="40" align="center" fixed /> -->
-				<el-table-column type="index" label="#" width="50" />
-				<el-table-column prop="barCode" 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_supermarketAuxiliaryCode_edit'"
-							@click="formDialogRef.openDialog(scope.row)"
-						>
-							编辑
-						</el-button>
-						<el-button
-							icon="delete"
-							text
-							type="primary"
-							v-auth="'supermarket_supermarketAuxiliaryCode_del'"
-							@click="handleDelete(scope.row)"
-						>
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-		</el-form-item>
-		<!-- <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" /> -->
-
-		<!-- 编辑、新增  -->
-		<form-dialog ref="formDialogRef" @refresh="getDataList" />
-	</div>
-</template>
-
-<script setup lang="ts">
-// import { BasicTableProps, useTable } from '/@/hooks/table';
-const FormDialog = defineAsyncComponent(() => import("./form.vue"))
-
-const supermarketAuxiliaryCodeEntityList = defineModel<any>("supermarketAuxiliaryCodeEntityList", { default: [] })
-
-// 定义变量内容
-const formDialogRef = ref()
-// 搜索变量
-// const queryRef = ref();
-// const showSearch = ref(true);
-// 多选变量
-// const selectedCodeIds = ref<any>([]); // 已勾选的行的id集合
-// const multiple = ref(true);
-
-// const state: BasicTableProps = reactive<BasicTableProps>({
-// 	queryForm: {},
-// 	pageList: fetchList,
-// });
-
-//  table hook
-// const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
-
-const tableStyle = {
-	cellStyle: { textAlign: "center" },
-	headerCellStyle: {
-		textAlign: "center",
-		background: "var(--el-table-row-hover-bg-color)",
-		color: "var(--el-text-color-primary)",
-	},
-}
-
-const getDataList = (formData: any) => {
-	console.log(formData)
-	const index = supermarketAuxiliaryCodeEntityList.value?.findIndex((item: any) => item.id === formData.id)
-	if (supermarketAuxiliaryCodeEntityList.value == null || index == undefined) {
-		supermarketAuxiliaryCodeEntityList.value = [{ ...formData, isNew: true }]
-	} else if (index === -1) {
-		supermarketAuxiliaryCodeEntityList.value.push({ ...formData, isNew: true })
-	} else {
-		supermarketAuxiliaryCodeEntityList.value[index] = formData
-	}
-}
-// 清空搜索条件
-// const resetQuery = () => {
-// 	// 清空搜索条件
-// 	queryRef.value?.resetFields();
-// 	// 清空多选
-// 	selectedCode.value = [];
-// 	selectedCodeIds.value = [];
-// 	getDataList();
-// };
-
-// 导出excel
-// const exportExcel = () => {
-// 	downBlobFile(
-// 		'/supermarket/supermarketAuxiliaryCode/export',
-// 		Object.assign(state.queryForm, { ids: selectedCodeIds.value }),
-// 		'supermarketAuxiliaryCode.xlsx'
-// 	);
-// };
-
-// 多选事件
-// const selectionChangHandle = (objs: { id: string }[]) => {
-// 	selectedCode.value = objs;
-// 	selectedCodeIds.value = objs.map(({ id }) => id);
-// 	multiple.value = !objs.length;
-// };
-
-// 删除操作
-const handleDelete = async (rowData: any) => {
-	supermarketAuxiliaryCodeEntityList.value = supermarketAuxiliaryCodeEntityList.value.filter(
-		(item: any) => item.id !== rowData.id,
-	)
-	// try {
-	// 	await useMessageBox().confirm('此操作将永久删除');
-	// } catch {
-	// 	return;
-	// }
-	// try {
-	// 	await delObjs(ids);
-	// 	getDataList();
-	// 	useMessage().success('删除成功');
-	// } catch (err: any) {
-	// 	useMessage().error(err.msg);
-	// }
-}
-</script>

src/views/supermarketerp/supermarketSpu/components/supermarketInventory.vue

@@ -0,0 +1,5 @@
+<template></template>
+
+<script setup lang="ts">
+const supermarketInventory = defineModel("supermarketInventory", { type: Object, default: () => {} })
+</script>

src/views/supermarketerp/supermarketSpu/components/supermarketUnit.vue

@@ -0,0 +1,191 @@
+<template>
+	<div class="w-full h-full p-1">
+		<el-row class="my-1">
+			<el-button type="primary" @click="pushEvent">新增</el-button>
+			<el-button @click="removeSelectRowEvent">删除选中</el-button>
+			<el-tooltip effect="light" placement="right">
+				<template #content>
+					<el-alert class="w-[500px] h-24" type="warning" show-icon :closable="false">
+						<p>
+							注：内装数据必须为该商品的最小售卖的基本单位,否则无法完成库存数量转换，影响erp库存自动扣减操作。
+							例如：一瓶矿泉水内装填'1',为售卖的最小基础单位，如果想按箱卖，在继续添加包装单位为箱，内装为24
+						</p>
+					</el-alert>
+				</template>
+				<el-icon class="text-xl my-auto ml-4 text-yellow-600"><WarningFilled /></el-icon>
+			</el-tooltip>
+		</el-row>
+
+		<vxe-table
+			ref="editableTableRef"
+			border
+			show-overflow
+			max-height="380"
+			:column-config="{ resizable: true }"
+			:row-config="{ isHover: true }"
+			:resizable-config="{ dragMode: 'fixed' }"
+			:data="supermarketUnitEntityList"
+			:edit-rules="validRules"
+			:edit-config="{
+					trigger: 'click',
+					mode: 'cell',
+					beforeEditMethod({ row, column }:any) {
+						// 禁止编辑
+						if (column.property === '') {
+							return false
+						}
+						return true
+					},
+				}"
+			size="mini"
+			align="center"
+		>
+			<vxe-column type="checkbox" width="40" fixed="left" />
+			<vxe-column type="seq" width="50" fixed="left" />
+			<vxe-column field="barCode" title="条码" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input v-model.trim="row.barCode" />
+				</template>
+			</vxe-column>
+			<vxe-column field="spec" title="规格" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input v-model.trim="row.spec" />
+				</template>
+			</vxe-column>
+			<vxe-column field="unit" title="单位" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input v-model.trim="row.unit" />
+				</template>
+			</vxe-column>
+			<vxe-column field="status" title="状态" :edit-render="{ autoFocus: 'input', placeholder: '请选择' }">
+				<template #edit="{ row }">
+					<el-select v-model="row.status">
+						<el-option label="正常" :value="0"></el-option>
+						<el-option label="停销" :value="1"></el-option>
+					</el-select>
+				</template>
+				<template #default="{ row }">
+					<span v-if="row.status === 0">正常</span>
+					<span v-else-if="row.status === 1">停销</span>
+					<span v-else style="color: #c0c4cf">请选择</span>
+				</template>
+			</vxe-column>
+			<vxe-column field="packageNum" title="内装数" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input-number v-model="row.packageNum" controls-position="right" :min="0" :precision="0" />
+				</template>
+			</vxe-column>
+			<vxe-column field="purchasePrice" title="进价(元)" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input-number v-model="row.purchasePrice" controls-position="right" :min="0" :precision="2" />
+				</template>
+			</vxe-column>
+			<vxe-column field="retailPrice" title="零售价(元)" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input-number v-model="row.retailPrice" controls-position="right" :min="0" :precision="2" />
+				</template>
+			</vxe-column>
+			<vxe-column field="promotionPrice" title="促销价(元)" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input-number v-model="row.promotionPrice" controls-position="right" :min="0" :precision="2" />
+				</template>
+			</vxe-column>
+			<vxe-column field="costPrice" title="成本价(元)" :edit-render="{ autoFocus: 'input', placeholder: '请输入' }">
+				<template #edit="{ row }">
+					<el-input-number v-model="row.costPrice" controls-position="right" :min="0" :precision="2" />
+				</template>
+			</vxe-column>
+		</vxe-table>
+	</div>
+</template>
+
+<script setup lang="ts">
+import { nanoid } from "nanoid"
+
+const supermarketUnitEntityList = defineModel("supermarketUnitEntityList", {
+	default: [
+		{
+			id: nanoid(5),
+			barCode: "",
+			spec: "",
+			unit: "",
+			status: "",
+			packageNum: 0,
+			purchasePrice: 0,
+			retailPrice: 0,
+			promotionPrice: 0,
+			costPrice: 0,
+		},
+	],
+})
+
+const editableTableRef = ref()
+const validRules = {
+	barCode: [{ required: true, message: "条码不能为空", trigger: "blur" }],
+	spec: [{ required: true, message: "规格不能为空", trigger: "blur" }],
+	unit: [{ required: true, message: "单位不能为空", trigger: "blur" }],
+	status: [{ required: true, message: "状态不能为空", trigger: "blur" }],
+	packageNum: [{ required: true, message: "内装数不能为空", trigger: "blur" }],
+	retailPrice: [{ required: true, message: "零售价不能为空", trigger: "blur" }],
+	purchasePrice: [{ required: true, message: "进价不能为空", trigger: "blur" }],
+	promotionPrice: [{ required: true, message: "促销价不能为空", trigger: "blur" }],
+	costPrice: [{ required: true, message: "成本价不能为空", trigger: "blur" }],
+}
+
+// 底部表格行新增
+const pushEvent = () => {
+	const newRow: any = {
+		id: nanoid(5),
+		barCode: "",
+		spec: "",
+		unit: "",
+		status: "",
+		packageNum: 0,
+		purchasePrice: 0,
+		retailPrice: 0,
+		promotionPrice: 0,
+		costPrice: 0,
+		isNew: true,
+	}
+	supermarketUnitEntityList.value.push(newRow)
+	nextTick(() => {
+		const $table = editableTableRef.value
+		if ($table) {
+			$table.setEditRow(newRow)
+		}
+	})
+}
+
+// 删除选中的行
+const removeSelectRowEvent = () => {
+	const $table = editableTableRef.value
+	if ($table) {
+		const selectRecords = $table.getCheckboxRecords()
+		if (selectRecords.length > 0) {
+			supermarketUnitEntityList.value = supermarketUnitEntityList.value.filter(
+				(item: any) => !selectRecords.some((row: any) => row.id === item.id),
+			)
+		}
+	}
+}
+
+// 校验可编辑表格 成功返回 true 失败返回 false
+const editableTableValidate = async () => {
+	// 全量校验
+	const $table = editableTableRef.value
+	if ($table) {
+		const errMap = await $table.validate(true)
+		if (errMap) {
+			console.log("全量校验失败！", errMap)
+			return false
+		} else {
+			console.log("全量校验成功！")
+			return true
+		}
+	}
+}
+
+defineExpose({
+	editableTableValidate,
+})
+</script>

src/views/supermarketerp/supermarketSpu/components/supermarketUnit/form.vue

@@ -1,161 +0,0 @@
-<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="110px" v-loading="loading">
-			<el-row :gutter="24">
-				<el-col :span="14" class="mb20">
-					<el-form-item label="条码" prop="barCode">
-						<el-input placeholder="请输入条码" v-model.trim="form.barCode" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="14" class="mb20">
-					<el-form-item label="规格" prop="spec">
-						<el-input placeholder="请输入规格" v-model.trim="form.spec" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="14" class="mb20">
-					<el-form-item label="单位" prop="unit">
-						<el-input placeholder="请输入单位" v-model.trim="form.unit" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="14" 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="14" class="mb20">
-					<el-form-item label="内装" prop="packageNum">
-						<el-alert type="warning" show-icon :closable="false">
-							<p>
-								注：内装数据必须为该商品的最小售卖的基本单位,否则无法完成库存数量转换，影响erp库存自动扣减操作。
-								例如：一瓶矿泉水内装填'1',为售卖的最小基础单位，如果想按箱卖，在继续添加包装单位为箱，内装为24
-							</p>
-						</el-alert>
-						<el-input-number v-model="form.packageNum" :min="0" :precision="0" />
-					</el-form-item>
-				</el-col>
-				<el-col :span="14" class="mb20">
-					<el-form-item label="零售价" prop="retailPrice">
-						<el-input-number v-model="form.retailPrice" :min="0" :precision="2" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="14" class="mb20">
-					<el-form-item label="促销价" prop="promotionPrice">
-						<el-input-number v-model="form.promotionPrice" :min="0" :precision="2" />
-					</el-form-item>
-				</el-col>
-				<el-col :span="14" class="mb20">
-					<el-form-item label="进价" prop="purchasePrice">
-						<el-input-number v-model="form.purchasePrice" :min="0" :precision="2" />
-					</el-form-item>
-				</el-col>
-
-				<el-col :span="14" class="mb20">
-					<el-form-item label="成本价" prop="costPrice">
-						<el-input-number v-model="form.costPrice" :min="0" :precision="2" />
-					</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 { nanoid } from "nanoid"
-
-const emit = defineEmits(["refresh"])
-
-// 定义变量内容
-const dataFormRef = ref()
-const visible = ref(false)
-const loading = ref(false)
-
-// 提交表单数据
-const form = reactive({
-	id: "",
-	barCode: "",
-	spec: "",
-	unit: "",
-	status: "",
-	packageNum: 0,
-	purchasePrice: "",
-	retailPrice: "",
-	promotionPrice: "",
-	costPrice: "",
-})
-
-// 定义校验规则
-const dataRules = ref({
-	barCode: [{ required: true, message: "条码不能为空", trigger: "blur" }],
-	// spec: [{ required: true, message: "规格不能为空", trigger: "blur" }],
-	unit: [{ required: true, message: "单位不能为空", trigger: "blur" }],
-	status: [{ required: true, message: "状态不能为空", trigger: "blur" }],
-	packageNum: [{ required: true, message: "内装数不能为空", trigger: "blur" }],
-	retailPrice: [{ required: true, message: "零售价不能为空", trigger: "blur" }],
-	purchasePrice: [{ required: true, message: "进价不能为空", trigger: "blur" }],
-	promotionPrice: [{ required: true, message: "促销价不能为空", trigger: "blur" }],
-	costPrice: [{ required: true, message: "成本价不能为空", trigger: "blur" }],
-})
-
-// 打开弹窗
-const openDialog = (rowData: any = null) => {
-	visible.value = true
-	form.id = nanoid(5)
-
-	// 重置表单数据
-	dataFormRef.value?.resetFields()
-
-	if (rowData) {
-		Object.assign(form, rowData)
-	}
-}
-
-// 提交
-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 ? '修改成功' : '添加成功');
-	emit("refresh", { ...form })
-	visible.value = false
-	// } 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>

src/views/supermarketerp/supermarketSpu/components/supermarketUnit/index.vue

@@ -1,226 +0,0 @@
-<template>
-	<div style="width: 100%">
-		<!-- <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="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 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>
-					<el-button icon="search" type="primary" v-auth="'supermarket_supermarketUnit_view'" @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"
-					v-auth="'supermarket_supermarketUnit_add'"
-					@click="formDialogRef.openDialog()"
-				>
-					新 增
-				</el-button>
-				<!-- <el-button
-					plain
-					:disabled="multiple"
-					icon="Delete"
-					type="primary"
-					v-auth="'supermarket_supermarketUnit_del'"
-					@click="handleDelete(selectedUnitIds)"
-					>删 除</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-form-item label="" prop="supermarketUnitEntityList">
-			<el-table :data="supermarketUnitEntityList" border :cell-style="tableStyle.cellStyle" :header-cell-style="tableStyle.headerCellStyle">
-				<!-- <el-table-column type="selection" width="40" align="center" fixed /> -->
-				<el-table-column type="index" label="#" width="50" />
-				<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="promotionPrice" label="促销价(元)" show-overflow-tooltip />
-				<el-table-column prop="costPrice" label="成本价(元)" show-overflow-tooltip />
-				<el-table-column label="操作" width="150" fixed="right">
-					<template #default="scope">
-						<el-button
-							v-if="scope.row.flag !== 'default'"
-							icon="edit-pen"
-							text
-							type="primary"
-							v-auth="'supermarket_supermarketUnit_edit'"
-							@click="formDialogRef.openDialog(scope.row)"
-						>
-							编辑
-						</el-button>
-						<el-button
-							v-if="scope.row.flag !== 'default'"
-							icon="delete"
-							text
-							type="primary"
-							v-auth="'supermarket_supermarketUnit_del'"
-							@click="handleDelete(scope.row)"
-						>
-							删除
-						</el-button>
-					</template>
-				</el-table-column>
-			</el-table>
-		</el-form-item>
-		<!-- <pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" v-bind="state.pagination" /> -->
-
-		<!-- 编辑、新增  -->
-		<form-dialog ref="formDialogRef" @refresh="getDataList" />
-	</div>
-</template>
-
-<script setup lang="ts">
-// import { BasicTableProps, useTable } from '/@/hooks/table';
-const FormDialog = defineAsyncComponent(() => import("./form.vue"))
-
-const supermarketUnitEntityList = defineModel<any>("supermarketUnitEntityList", { default: [] })
-
-const formDialogRef = ref()
-// 搜索变量
-// const queryRef = ref();
-// const showSearch = ref(true);
-// 多选变量
-// const selectedUnitIds = ref<any>([]); // 已勾选的行的id集合
-// const multiple = ref(true);
-
-// const state: BasicTableProps = reactive<BasicTableProps>({
-// 	queryForm: {},
-// 	pageList: fetchList,
-// });
-
-//  table hook
-// const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
-
-const tableStyle = {
-	cellStyle: { textAlign: "center" },
-	headerCellStyle: {
-		textAlign: "center",
-		background: "var(--el-table-row-hover-bg-color)",
-		color: "var(--el-text-color-primary)",
-	},
-}
-
-// 根据基础信息的部分填写项自动生成一条默认包装单位
-// watch(
-// 	() => props.defaultSpuUnit,
-// 	(newValue, oldValue) => {
-// 		console.log(newValue, oldValue)
-
-// 		const defaultSpuUnitIndex = supermarketUnitEntityList.value.findIndex((item: any) => {
-// 			return (
-// 				item.barCode == oldValue.barCode &&
-// 				item.unit == oldValue.unit &&
-// 				item.packageNum == oldValue.packageNum &&
-// 				item.retailPrice == oldValue.retailPrice &&
-// 				item.purchasePrice == oldValue.purchasePrice &&
-// 				item.promotionPrice == oldValue.promotionPrice &&
-// 				item.costPrice == oldValue.costPrice
-// 			)
-// 		})
-// 		console.log(defaultSpuUnitIndex)
-
-// 		if (defaultSpuUnitIndex !== -1) {
-// 			supermarketUnitEntityList.value[defaultSpuUnitIndex] = newValue
-// 		} else {
-// 			supermarketUnitEntityList.value.push(newValue)
-// 		}
-// 		console.log(supermarketUnitEntityList.value)
-// 	},
-// 	{
-// 		deep: true,
-// 		immediate: true,
-// 	},
-// )
-
-const getDataList = (formData: any) => {
-	console.log(formData)
-	const index = supermarketUnitEntityList.value?.findIndex((item: any) => item.id === formData.id)
-	if (supermarketUnitEntityList.value == null || index == undefined) {
-		supermarketUnitEntityList.value = [{ ...formData, isNew: true }]
-	} else if (index === -1) {
-		supermarketUnitEntityList.value.push({ ...formData, isNew: true })
-	} else {
-		supermarketUnitEntityList.value[index] = formData
-	}
-}
-
-// 清空搜索条件
-// const resetQuery = () => {
-// 	// 清空搜索条件
-// 	queryRef.value?.resetFields();
-// 	// 清空多选
-// 	// selectedUnitIds.value = [];
-// 	// selectedUnit.value = [];
-// 	getDataList();
-// };
-
-// 导出excel
-// const exportExcel = () => {
-// 	downBlobFile('/supermarket/supermarketUnit/export', Object.assign(state.queryForm, { ids: selectedUnitIds.value }), 'supermarketUnit.xlsx');
-// };
-
-// 多选事件
-// const selectionChangHandle = (objs: { id: string }[]) => {
-// 	selectedUnit.value = objs;
-// 	selectedUnitIds.value = objs.map(({ id }) => id);
-// 	multiple.value = !objs.length;
-// };
-
-// 删除操作
-const handleDelete = async (rowData: any) => {
-	supermarketUnitEntityList.value = supermarketUnitEntityList.value.filter((item: any) => item.id !== rowData.id)
-	// try {
-	// 	await useMessageBox().confirm('此操作将永久删除');
-	// } catch {
-	// 	return;
-	// }
-	// try {
-	// 	await delObjs(ids);
-	// 	// getDataList();
-	// 	useMessage().success('删除成功');
-	// } catch (err: any) {
-	// 	useMessage().error(err.msg);
-	// }
-}
-</script>

src/views/supermarketerp/supermarketSpu/form.vue

@@ -1,6 +1,6 @@
 <template>
-	<el-dialog width="60%" :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
-		<el-form ref="dataFormRef" :model="form" :rules="dataRules" formDialogRef label-width="auto" v-loading="loading">
+	<el-dialog width="80%" :title="form.id ? '编辑' : '新增'" v-model="visible" :close-on-click-modal="false" draggable>
+		<el-form ref="dataFormRef" :model="form" :rules="dataRules" label-width="auto" v-loading="loading">
 			<el-tabs v-model="tabPaneActiveName" @tab-change="handleTabChange">
 				<el-tab-pane label="基础信息" name="基础信息" style="overflow-y: auto; height: 60vh">
 					<el-row>
@@ -145,21 +145,26 @@
 					</el-row>
 				</el-tab-pane>
 				<el-tab-pane label="包装单位" name="包装单位" style="overflow-y: auto; height: 60vh">
-					<supermarketUnit v-model:supermarketUnitEntityList="form.smErpUnitEntityList" />
+					<supermarket-unit ref="supermarketUnitEntityListRef" v-model:supermarketUnitEntityList="form.smErpUnitEntityList" />
+				</el-tab-pane>
+				<el-tab-pane label="库存" name="库存" style="overflow-y: auto; height: 60vh">
+					<!-- form.supermarketInventory -->
+					<supermarket-inventory ref="supermarketInventoryRef" v-model:supermarketInventory="form.supermarketInventory" />
 				</el-tab-pane>
 				<el-tab-pane label="辅助条码" name="辅助条码" style="overflow-y: auto; height: 60vh">
-					<supermarketAuxiliaryCode v-model:supermarketAuxiliaryCodeEntityList="form.smErpAuxiliaryCodeEntityList" />
+					<supermarket-auxiliaryCode
+						ref="supermarketAuxiliaryCodeEntityList"
+						v-model:supermarketAuxiliaryCodeEntityList="form.smErpAuxiliaryCodeEntityList"
+					/>
 				</el-tab-pane>
 			</el-tabs>
 		</el-form>
 
 		<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>
+			<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>
 		</template>
 	</el-dialog>
 </template>
@@ -170,21 +175,25 @@ import { useMessage } from "/@/hooks/message"
 import { getObj, addObj, putObj, getSupermarketCategory, getSupermarketBrand } from "/@/api/supermarketerp/supermarketSpu"
 import { getSupplierTypeOptions } from "/@/api/supermarketerp/smErpSupplier"
 import { rule } from "/@/utils/validate"
-import supermarketAuxiliaryCode from "./components/supermarketAuxiliaryCode/index.vue"
-import supermarketUnit from "./components/supermarketUnit/index.vue"
+import SupermarketUnit from "./components/supermarketUnit.vue"
+import supermarketInventory from "./components/supermarketInventory.vue"
+import SupermarketAuxiliaryCode from "./components/supermarketAuxiliaryCode.vue"
 import { TabPaneName } from "element-plus"
 import { displayPrice, storePrice } from "/@/utils/formatMoney"
 
 const emit = defineEmits(["refresh"])
 
-const tabPaneEnum = ["基础信息", "包装单位", "辅助条码"]
+const supermarketUnitEntityListRef = ref()
+const supermarketInventoryRef = ref()
+const supermarketAuxiliaryCodeEntityList = ref()
+const tabPaneEnum = ["基础信息", "包装单位", "库存", "辅助条码"]
 const dataFormRef = ref()
 const visible = ref(false)
 const loading = ref(false)
 const currentTabPaneIndex = ref(0)
 const tabPaneActiveName = computed(() => tabPaneEnum[currentTabPaneIndex.value])
 // 提交表单数据
-const form = reactive({
+const form = reactive<any>({
 	id: "",
 	merchantId: "",
 	productCode: "",
@@ -248,19 +257,6 @@ const { supermarket_nature, status } = useDict("supermarket_nature", "status")
 const categoryOptions = ref<any>([]) // 商品分类的下拉选项
 const brandOptions = ref<any>([]) // 超市品牌的下拉选项
 const supplierOptions = ref<any>([]) // 货商的下拉选项
-// 默认包装单位
-// const defaultSpuUnit = computed(() => ({
-// 	flag: "default",
-// 	barCode: form.barcode,
-// 	unit: form.unit,
-// 	packageNum: form.packageNum,
-// 	retailPrice: form.retailPrice,
-// 	purchasePrice: form.purchasePrice,
-// 	promotionPrice: form.promotionPrice,
-// 	costPrice: form.costPrice,
-// 	spec: form.spec,
-// 	status: "0",
-// }))
 
 // 打开弹窗
 const openDialog = async (id: string) => {
@@ -295,69 +291,69 @@ const openDialog = async (id: string) => {
 const getsupermarketSpuData = async (id: string) => {
 	// 获取数据
 	loading.value = true
-	const res = await getObj(id).finally(() => (loading.value = false))
-	if (res.code === 0) {
-		res.data.smErpUnitEntityList.map((item: any) => {
-			// 格式化数据
-			item.retailPrice = displayPrice(item.retailPrice, "")
-			item.promotionPrice = displayPrice(item.promotionPrice, "")
-			item.purchasePrice = displayPrice(item.purchasePrice, "")
-			item.costPrice = displayPrice(item.costPrice, "")
-		})
+	try {
+		const res = await getObj(id).finally(() => (loading.value = false))
+		if (res.code === 0) {
+			res.data.smErpUnitEntityList = res.data.smErpUnitEntityList.map((item: any) => {
+				// 格式化数据
+				item.retailPrice = displayPrice(item.retailPrice, "")
+				item.promotionPrice = displayPrice(item.promotionPrice, "")
+				item.purchasePrice = displayPrice(item.purchasePrice, "")
+				item.costPrice = displayPrice(item.costPrice, "")
+				return item
+			})
 
-		Object.assign(form, res.data)
-		console.log(res.data)
+			Object.assign(form, res.data)
+			console.log("获取的商品详情：", res.data)
+		}
+	} catch (error: any) {
+		loading.value = false
+		useMessage().error(error.msg)
 	}
 }
 
 // tab栏切换
-const handleTabChange = (name: TabPaneName) => {
-	currentTabPaneIndex.value = tabPaneEnum.findIndex((item) => item === name)
-}
+const handleTabChange = (name: TabPaneName) => (currentTabPaneIndex.value = tabPaneEnum.findIndex((item) => item === name))
+
+// 整理包装单位列表
+const handleUnit = computed(() => {
+	return form.smErpUnitEntityList.map((item: any) => {
+		item.costPrice = storePrice(item.costPrice)
+		item.promotionPrice = storePrice(item.promotionPrice)
+		item.purchasePrice = storePrice(item.purchasePrice)
+		item.retailPrice = storePrice(item.retailPrice)
+		if (item.isNew) {
+			item.id = ""
+			delete item.isNew
+		}
+	})
+})
+
+// 整理辅助条码列表
+const handleAuxiliaryCode = computed(() => {
+	return form.smErpAuxiliaryCodeEntityList.map((item: any) => {
+		if (item.isNew) {
+			item.id = ""
+			delete item.isNew
+		}
+	})
+})
 
 // 提交
 const onSubmit = async () => {
-	console.log(form)
+	console.log("提交的数据", form)
 
 	const valid = await dataFormRef.value.validate().catch(() => {})
-	if (!valid) useMessage().warning("基础信息必填项未填写完整")
-	if (!form.smErpUnitEntityList || form.smErpUnitEntityList.length <= 0) useMessage().warning("请添加包装单位")
-	if (!form.smErpAuxiliaryCodeEntityList || form.smErpAuxiliaryCodeEntityList.length <= 0) useMessage().warning("请添加辅助条码")
-	if (!valid) return false
+	if (!valid) return useMessage().warning("基础信息必填项未填写完整")
+	if (!form.smErpUnitEntityList || form.smErpUnitEntityList.length <= 0) return useMessage().warning("请添加包装单位")
+	if (!form.smErpAuxiliaryCodeEntityList || form.smErpAuxiliaryCodeEntityList.length <= 0) return useMessage().warning("请添加辅助条码")
+	if (!(await supermarketUnitEntityListRef.value.editableTableValidate())) return useMessage().warning("包装单位必填项未填写完整")
+	if (!(await supermarketAuxiliaryCodeEntityList.value.editableTableValidate())) return useMessage().warning("辅助条码必填项未填写完整")
 
 	try {
 		loading.value = true
-		if (form.id) {
-			form.smErpUnitEntityList.map((item: any) => {
-				item.costPrice = storePrice(item.costPrice)
-				item.promotionPrice = storePrice(item.promotionPrice)
-				item.purchasePrice = storePrice(item.purchasePrice)
-				item.retailPrice = storePrice(item.retailPrice)
-				if (item.isNew) {
-					item.id = ""
-					delete item.isNew
-				}
-			})
-			form.smErpAuxiliaryCodeEntityList.map((item: any) => {
-				if (item.isNew) {
-					item.id = ""
-					delete item.isNew
-				}
-			})
-			await putObj(form)
-		} else {
-			form.smErpUnitEntityList.map((item: any) => {
-				item.id = ""
-				item.costPrice = storePrice(item.costPrice)
-				item.promotionPrice = storePrice(item.promotionPrice)
-				item.purchasePrice = storePrice(item.purchasePrice)
-				item.retailPrice = storePrice(item.retailPrice)
-			})
-			form.smErpAuxiliaryCodeEntityList.map((item: any) => {
-				item.id = ""
-			})
-			await addObj(form)
-		}
+		const _pa = { ...form, smErpUnitEntityList: handleUnit.value, smErpAuxiliaryCodeEntityList: handleAuxiliaryCode.value }
+		form.id ? await putObj(_pa) : await addObj(_pa)
 		useMessage().success(form.id ? "修改成功" : "添加成功")
 		visible.value = false
 		emit("refresh")
@@ -368,7 +364,6 @@ const onSubmit = async () => {
 	}
 }
 
-// 暴露变量
 defineExpose({
 	openDialog,
 })