菜品分类时段改为多选。商品管理显示封面图。

This commit is contained in:
ctw committed 2024-12-31 17:13:29 +08:00
1 parent 57059f7d99
commit 8e22166f2e
4 files changed
+204 -199

No files matched your search

+12 -12
View File
@@ -1,8 +1,8 @@
<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-tabs v-model="tabPaneActiveName">
<el-tab-pane label="基础信息" name="基础信息" disabled style="overflow-y: auto; height: 60vh">
<el-tabs v-model="tabPaneActiveName" @tab-change="handleTabChange">
<el-tab-pane label="基础信息" name="基础信息" style="overflow-y: auto; height: 60vh">
<el-row style="padding: 10px">
<el-col :span="12" class="mb20">
<el-form-item label="货号" prop="productCode">
@@ -27,7 +27,7 @@
<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-option v-for="item in categoryOptions" :key="item?.id" :label="item?.name" :value="item?.id" />
</el-select>
</el-form-item>
</el-col>
@@ -183,10 +183,10 @@
</el-col>
</el-row>
</el-tab-pane>
<el-tab-pane label="包装单位" name="包装单位" disabled style="overflow-y: auto; height: 60vh">
<el-tab-pane label="包装单位" name="包装单位" style="overflow-y: auto; height: 60vh">
<supermarketUnit v-model:supermarketUnitEntityList="form.supermarketUnitEntityList" />
</el-tab-pane>
<el-tab-pane label="辅助条码" name="辅助条码" disabled style="overflow-y: auto; height: 60vh">
<el-tab-pane label="辅助条码" name="辅助条码" style="overflow-y: auto; height: 60vh">
<supermarketAuxiliaryCode v-model:supermarketAuxiliaryCodeEntityList="form.supermarketAuxiliaryCodeEntityList" />
</el-tab-pane>
</el-tabs>
@@ -213,6 +213,7 @@ import { fetchList } from '/@/api/supermarketerp/smErpSupplier';
import { rule } from '/@/utils/validate';
import supermarketAuxiliaryCode from './components/supermarketAuxiliaryCode/index.vue';
import supermarketUnit from './components/supermarketUnit/index.vue';
import { TabPaneName } from 'element-plus';
const emit = defineEmits(['refresh']);
@@ -310,6 +311,7 @@ const getsupermarketSpuData = (id: string) => {
// 打开弹窗
const openDialog = async (id: string) => {
visible.value = true;
currentTabPaneIndex.value = 0;
form.id = '';
form.supermarketUnitEntityList = [];
form.supermarketAuxiliaryCodeEntityList = [];
@@ -356,6 +358,11 @@ const openDialog = async (id: string) => {
}
};
// tab栏切换
const handleTabChange = (name: TabPaneName) => {
currentTabPaneIndex.value = tabPaneEnum.findIndex((item) => item === name);
};
// 提交
const onSubmit = async () => {
console.log(form);
@@ -391,10 +398,3 @@ defineExpose({
openDialog,
});
</script>
<style scoped lang="scss">
:deep(.el-tabs__item.is-disabled) {
color: #2e5cf6;
cursor: default;
}
</style>
@@ -60,11 +60,15 @@
<el-table-column prop="unit" label="单位" show-overflow-tooltip />
<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip width="100">
<template #default="scope">
{{ supermarketCategory?.find((item: any) => item.id === scope.row.categoryId).name }}
{{ supermarketCategory?.find((item: any) => item.id === scope.row.categoryId)?.name }}
</template>
</el-table-column>
<el-table-column prop="picUrl" label="封面图" show-overflow-tooltip />
<el-table-column prop="status" label="商品状态" show-overflow-tooltip width="100">
<el-table-column prop="picUrl" label="封面图" width="140">
<template #default="scope">
<el-image style="width: 100px; height: 100px" :src="imageBaseUrl + scope.row.picUrl" fit="cover" />
</template>
</el-table-column>
<el-table-column prop="status" label="商品状态" width="100">
<template #default="scope">
<dict-tag :options="status" :value="scope.row.status"></dict-tag>
</template>
@@ -112,6 +116,7 @@ import { BasicTableProps, useTable } from '/@/hooks/table';
import { fetchList, delObjs, getSupermarketCategory } from '/@/api/supermarket/supermarketSpu';
import { useMessage, useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));