zianxin/pj_admin_cloud
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

菜品分类，菜品列表

Browse Source
This commit is contained in:
zjf committed 2024-12-10 17:22:25 +08:00
1 parent 676cda61e2
commit 4818a067a9
4 files changed
+78 -88
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/api/canteen/canteenCategory.ts
+8
View File
@@ -39,3 +39,11 @@ export function putObj(obj?: Object) {
})
}
export function getAllSimple(query?: Object) {
return request({
url: '/canteen/canteenCategory/getAllSimple',
method: 'get',
params: query
})
}
src/components/Upload/Image.vue
+3 -1
View File
@@ -72,6 +72,7 @@ interface UploadFileProps {
borderRadius?: string; // 组件边框圆角 ==> 非必传（默认为 8px）
iconSize?: number;
dir?: string; // 文件目录
listType:string;
}
// 接受父组件参数
@@ -85,7 +86,8 @@ const props = withDefaults(defineProps<UploadFileProps>(), {
height: '150px',
width: '150px',
borderRadius: '8px',
dir: ''
dir: '',
listType:''
});
// 生成组件唯一id
src/views/canteen/canteenSpu/form.vue
+58 -73
View File
@@ -8,115 +8,90 @@
<el-input v-model="form.name" placeholder="请输入商品名称"/>
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-form-item label="商品分类" prop="categoryId">
<el-select v-model="form.categoryId" placeholder="请选择商品分类">
<el-option
placeholder="请选择商品分类"
v-for="item in categoryList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
<!-- <el-option v-for="categoryList" :key="item.value" :label="item.label"-->
<!-- :value="item.value"></el-option>-->
</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="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="12" class="mb20">
<el-form-item label="商品详情" prop="description">
<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情"></editor>
<el-col :span="24" class="mb20">
<el-form-item label="商品轮播图" prop="sliderPicUrls">
<upload-img listType="picture-card" v-model:imageUrl="form.sliderPicUrls"></upload-img>
<!-- <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="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="picUrl">
<upload-file v-model:imageUrl="form.picUrl"></upload-file>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品轮播图地址
数组，以逗号分隔
最多上传15张" 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 v-model="form.sort" placeholder="请输入排序字段"/>
<el-col :span="8" class="mb20">
<el-form-item label="排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入排序"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品状态: 1 上架（开启） 0 下架（禁用） -1 回收" prop="status">
<el-col :span="8" class="mb20">
<el-form-item label="商品状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio label="商品状态: 1 上架（开启） 0 下架（禁用） -1 回收" border>商品状态: 1 上架（开启） 0 下架（禁用） -1 回收</el-radio>
<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }}
</el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品价格，单位使用：分" prop="price">
<el-input v-model="form.price" placeholder="请输入商品价格，单位使用：分"/>
<el-col :span="8" class="mb20">
<el-form-item label="商品价格" prop="price">
<el-input v-model="form.price" placeholder="请输入商品价格"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="市场价，单位使用：分" prop="marketPrice">
<el-input v-model="form.marketPrice" placeholder="请输入市场价，单位使用：分"/>
<el-col :span="8" class="mb20">
<el-form-item label="市场价" prop="marketPrice">
<el-input v-model="form.marketPrice" placeholder="请输入市场价"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="成本价，单位： 分" prop="costPrice">
<el-input v-model="form.costPrice" placeholder="请输入成本价，单位： 分"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="8" class="mb20">
<el-form-item label="库存" prop="stock">
<el-input v-model="form.stock" placeholder="请输入库存"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="8" class="mb20">
<el-form-item label="赠送积分" prop="giveIntegral">
<el-input v-model="form.giveIntegral" placeholder="请输入赠送积分"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品销量" prop="salesCount">
<el-input v-model="form.salesCount" placeholder="请输入商品销量"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="8" class="mb20">
<el-form-item label="虚拟销量" prop="virtualSalesCount">
<el-input v-model="form.virtualSalesCount" placeholder="请输入虚拟销量"/>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-form-item label="商品点击量" prop="browseCount">
<el-input v-model="form.browseCount" 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="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-row>
</el-form>
<template #footer>
@@ -132,6 +107,7 @@
import { useDict } from '/@/hooks/dict';
import { useMessage } from "/@/hooks/message";
import { getObj, addObj, putObj } from '/@/api/canteen/canteenSpu'
import {getAllSimple} from "/@/api/canteen/canteenCategory";
import { rule } from '/@/utils/validate';
const emit = defineEmits(['refresh']);
@@ -140,6 +116,7 @@ const dataFormRef = ref();
const visible = ref(false)
const loading = ref(false)
// 定义字典
const { spu_status } = useDict('spu_status')
// 提交表单数据
const form = reactive({
@@ -151,7 +128,7 @@ const form = reactive({
picUrl: '',
sliderPicUrls: '',
sort: '',
status: '',
status: '0',
price: '',
marketPrice: '',
costPrice: '',
@@ -224,9 +201,17 @@ const getcanteenSpuData = (id: string) => {
loading.value = false
})
};
const categoryList = ref([]) // 商品分类树
onMounted(async () => {
const params={
systemType: 2
}
const data =await getAllSimple(params);
categoryList.value=data.data
})
// 暴露变量
defineExpose({
openDialog
});
</script>
</script>
src/views/canteen/canteenSpu/index.vue
+9 -14
View File
@@ -34,23 +34,22 @@
@queryTable="getDataList"></right-toolbar>
</div>
</el-row>
<el-table :data="state.dataList" v-loading="state.loading" border
<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="name" label="商品名称" show-overflow-tooltip/>
<el-table-column prop="introduction" label="商品简介" show-overflow-tooltip/>
<el-table-column prop="description" 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="sliderPicUrls" label="商品轮播图地址
数组，以逗号分隔
最多上传15张" show-overflow-tooltip/>
<el-table-column prop="sliderPicUrls" label="商品轮播图" show-overflow-tooltip/>
<el-table-column prop="sort" label="排序字段" show-overflow-tooltip/>
<el-table-column prop="status" label="商品状态: 1 上架（开启） 0 下架（禁用） -1 回收" show-overflow-tooltip/>
<el-table-column prop="specType" label="规格类型：0 单规格 1 多规格" show-overflow-tooltip/>
<el-table-column prop="status" label="上架状态" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="spu_status" :value="scope.row.status"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="price" label="商品价格，单位使用：分" show-overflow-tooltip/>
<el-table-column prop="marketPrice" label="市场价，单位使用：分" show-overflow-tooltip/>
<el-table-column prop="costPrice" label="成本价，单位： 分" show-overflow-tooltip/>
@@ -58,11 +57,6 @@
<el-table-column prop="giveIntegral" label="赠送积分" show-overflow-tooltip/>
<el-table-column prop="salesCount" label="商品销量" show-overflow-tooltip/>
<el-table-column prop="virtualSalesCount" label="虚拟销量" show-overflow-tooltip/>
<el-table-column prop="browseCount" label="商品点击量" show-overflow-tooltip/>
<el-table-column prop="deleted" label="是否删除" show-overflow-tooltip/>
<el-table-column prop="systemType" label="系统类型 2每日 3在线订餐" 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="createTime" label="创建时间" show-overflow-tooltip/>
<el-table-column label="操作" width="150">
<template #default="scope">
@@ -91,6 +85,7 @@ import { useDict } from '/@/hooks/dict';
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
const { spu_status } = useDict('spu_status')
// 定义变量内容
const formDialogRef = ref()
// 搜索变量
@@ -151,4 +146,4 @@ const handleDelete = async (ids: string[]) => {
useMessage().error(err.msg);
}
};
</script>
</script>