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:
ctw committed 2025-01-08 16:24:57 +08:00
1 parent 39bc822b2c
commit 1a8f5192cb
15 files changed
+290 -163
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

.env.development
+5 -3
View File
@@ -10,12 +10,14 @@ ENV = 'development'
# ADMIN 服务地址
# VITE_ADMIN_PROXY_PATH = http://123.156.230.15:8089/api/
# VITE_ADMIN_PROXY_PATH = http://pjcloud.center.takin.cc/
VITE_ADMIN_PROXY_PATH = http://localhost:9999
# VITE_ADMIN_PROXY_PATH = http://localhost:9999/
VITE_ADMIN_PROXY_PATH = http://192.168.101.29:9999/ # 邓-本地
# 图片访问基础地址
# VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089/api
# VITE_IMAGE_BASE_PATH = http://123.156.230.15:8089
# VITE_IMAGE_BASE_PATH = http://pjcloud.center.takin.cc
VITE_IMAGE_BASE_PATH = http://localhost:9999
# VITE_IMAGE_BASE_PATH = http://localhost:9999
VITE_IMAGE_BASE_PATH = http://192.168.101.29:9999 # 邓-本地
# 代码生成服务地址
VITE_GEN_PROXY_PATH = http://192.168.110.156:5003
src/api/wallet/mch-manage.ts
+37 -37
View File
@@ -1,50 +1,50 @@
import request from "/@/utils/request"
import request from '/@/utils/request';
export function pageJoin(query?: Object) {
return request({
url: '/wallet/mch-manage/page-join',
method: 'get',
params: query
})
return request({
url: '/wallet/mch-manage/page-join',
method: 'get',
params: query,
});
}
export function fetchList(query?: Object) {
return request({
url: '/wallet/mch-manage/page',
method: 'get',
params: query
})
return request({
url: '/wallet/mch-manage/page',
method: 'get',
params: query,
});
}
export function addObj(obj?: Object) {
return request({
url: '/wallet/mch-manage',
method: 'post',
data: obj
})
return request({
url: '/wallet/mch-manage',
method: 'post',
data: obj,
});
}
export function getObj(id?: string) {
return request({
url: '/wallet/mch-manage/' + id,
method: 'get'
})
return request({
url: '/wallet/mch-manage/' + id,
method: 'get',
});
}
export function delObjs(ids?: Object) {
return request({
url: '/wallet/mch-manage',
method: 'delete',
data: ids
})
return request({
url: '/wallet/mch-manage',
method: 'delete',
data: ids,
});
}
export function putObj(obj?: Object) {
return request({
url: '/wallet/mch-manage',
method: 'put',
data: obj
})
return request({
url: '/wallet/mch-manage',
method: 'put',
data: obj,
});
}
/**
@@ -52,11 +52,11 @@ export function putObj(obj?: Object) {
* @param type
*/
export function selectMerchantList(type?: string) {
return request({
url: '/wallet/mch-manage/selectMerchantList',
method: 'get',
params: {
type: type
}
})
return request({
url: '/wallet/mch-manage/selectMerchantList',
method: 'get',
params: {
type: type,
},
});
}
src/components/Select/SelectCtcgd.vue
+85
View File
@@ -0,0 +1,85 @@
<template>
<el-select
style="width: 100%"
v-model="state.selectId"
:placeholder="props.placeholder"
clearable
remote-show-suffix
filterable
remote
:remote-method="remoteSearch"
:loading="state.loading"
@visible-change="(e: boolean) => e && getOptions()"
>
<el-option v-for="v in state.options" :key="v.id" :label="`${v.name}`" :value="v.id">
<!-- <div class="flex items-center">
<div class="color-primary">{{ v.name }}</div>
<div class="flex items-center just ml5">
<el-tag size="small">
{{ v.deptName }}
</el-tag>
</div>
</div> -->
</el-option>
</el-select>
</template>
<script setup lang="ts" name="select-merchant">
import { reactive, computed, defineModel, withDefaults, defineProps } from 'vue';
import { fetchList as getCanteenCategory } from '/@/api/canteen/canteenCategory';
const selectId = defineModel();
export type Props = {
placeholder?: string;
};
const props = withDefaults(defineProps<Props>(), {
placeholder: '请选择',
});
const queryForm = reactive<any>({
current: 1,
size: 9999,
});
const state = reactive<any>({
loading: true,
selectId: selectId,
options: [],
});
watch(
selectId,
(newVal, oldValue) => {
if (newVal == oldValue) return;
state.selectId = newVal;
getOptions();
},
{ immediate: true }
);
async function getOptions() {
try {
state.loading = true;
const _pa = {
...queryForm,
};
const { data } = await getCanteenCategory(_pa);
state.options = data.records ?? [];
} finally {
setTimeout(() => (state.loading = false), 500);
}
}
function remoteSearch(params: string) {
if (params != queryForm.name) {
queryForm.name = params;
getOptions();
}
}
function clear() {
state.selectId = null;
getOptions();
}
</script>
src/components/index.ts
+2
View File
@@ -19,6 +19,7 @@ import SelectWalletType from '/@/components/Select/SelectWalletType.vue';
import SelectMch from '/@/components/Select/SelectMch.vue';
import SelectDept from '/@/components/Select/SelectDept.vue';
import SelectCtcg from '/@/components/Select/SelectCtcg.vue';
import SelectCtcgd from '/@/components/Select/SelectCtcgd.vue';
// 第三方组件
import ElementPlus from 'element-plus';
@@ -59,6 +60,7 @@ export default {
app.component('SelectMch', SelectMch);
app.component('SelectDept', SelectDept);
app.component('SelectCtcg', SelectCtcg);
app.component('SelectCtcgd', SelectCtcgd);
// 导入全部的elmenet-plus的图标
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
src/views/canteen/boxesInfo/form.vue
+8 -6
View File
@@ -2,28 +2,28 @@
<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-col :span="14" class="mb20">
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="包厢名称" prop="name">
<el-input v-model="form.name" placeholder="请输入包厢名称" />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="包厢图片" prop="images">
<upload-img v-model="form.images"></upload-img>
<upload-img v-model:imageUrl="form.images"></upload-img>
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="容纳人数" prop="capacity">
<el-input v-model="form.capacity" placeholder="请输入容纳人数" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="24" class="mb20">
<el-form-item label="包厢状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" v-for="(item, index) in boxes_status" border :key="index">{{ item.label }} </el-radio>
@@ -129,7 +129,9 @@ const getboxesInfoData = (id: string) => {
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data);
Object.assign(form, res.data, {
status: '' + res.data.status,
});
})
.finally(() => {
loading.value = false;
src/views/canteen/boxesInfo/index.vue
+8 -4
View File
@@ -40,20 +40,24 @@
@sort-change="sortChangeHandle"
>
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="40" />
<el-table-column type="index" label="#" width="50" />
<el-table-column prop="name" label="包厢名称" show-overflow-tooltip />
<el-table-column prop="capacity" label="容纳人数" show-overflow-tooltip />
<el-table-column prop="description" label="包厢描述" show-overflow-tooltip />
<el-table-column prop="address" label="包厢地址" show-overflow-tooltip />
<el-table-column prop="images" label="包厢图片" show-overflow-tooltip />
<el-table-column prop="images" label="包厢图片" show-overflow-tooltip>
<template #default="scope">
<preview-image :src="scope.row.images" />
</template>
</el-table-column>
<el-table-column prop="status" label="包厢状态" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="boxes_status" :value="scope.row.status"></dict-tag>
<dict-tag :options="boxes_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column prop="price" label="包厢价格单位分" show-overflow-tooltip />
<el-table-column prop="merchantId" label="商户id" show-overflow-tooltip />
<el-table-column label="操作" width="150">
<el-table-column label="操作" width="150" fixed="right">
<template #default="scope">
<el-button icon="edit-pen" text type="primary" v-auth="'canteen_boxesInfo_edit'" @click="formDialogRef.openDialog(scope.row.id)">
编辑
src/views/canteen/canteenCategory/form.vue
+4 -4
View File
@@ -2,12 +2,12 @@
<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-col :span="14" class="mb20">
<el-form-item label="分类名称" prop="name">
<el-input v-model="form.name" placeholder="请输入分类名称" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="餐段类型" prop="categoryType">
<el-select v-model="form.categoryType" placeholder="请选择餐段类型" multiple>
<el-option :value="item.value" :label="item.label" v-for="(item, index) in daily_menu" :key="index"></el-option>
@@ -16,11 +16,11 @@
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="分类图" prop="picUrl">
<upload-img v-model="form.picUrl"></upload-img>
<upload-img v-model:imageUrl="form.picUrl"></upload-img>
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="分类排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入分类排序" />
</el-form-item>
src/views/canteen/canteenCategory/index.vue
+16 -12
View File
@@ -7,7 +7,7 @@
<el-input placeholder="请输入分类名称" v-model="state.queryForm.name" />
</el-form-item>
<el-form-item>
<el-button icon="search" type="primary" @click="getDataList"> 查询 </el-button>
<el-button icon="search" type="primary" @click="getDataList">查询</el-button>
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
@@ -18,7 +18,7 @@
新 增
</el-button>
<el-button plain :disabled="multiple" icon="Delete" type="primary" v-auth="'canteen_canteenCategory_del'" @click="handleDelete(selectObjs)">
删除
删 除
</el-button>
<right-toolbar
v-model:showSearch="showSearch"
@@ -40,22 +40,26 @@
@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 type="index" label="#" width="50" />
<el-table-column prop="name" label="分类名称" show-overflow-tooltip min-width="100" />
<el-table-column prop="categoryType" label="餐段类型" show-overflow-tooltip width="180">
<template #default="scope">
<dict-tag :options="daily_menu" :value="scope.row.categoryType?.split(',')"></dict-tag>
</template>
</el-table-column>
<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip />
<el-table-column prop="createBy" label="创建者" show-overflow-tooltip />
<el-table-column prop="updateBy" label="更新者" show-overflow-tooltip />
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip />
<el-table-column label="操作" width="150">
<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip>
<template #default="scope">
<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenCategory_edit'" @click="formDialogRef.openDialog(scope.row.id)"
>编辑</el-button
>
<preview-image :src="scope.row.picUrl" />
</template>
</el-table-column>
<el-table-column prop="createBy" label="创建者" show-overflow-tooltip min-width="100" />
<el-table-column prop="updateBy" label="更新者" show-overflow-tooltip min-width="100" />
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
<el-table-column label="操作" width="150" fixed="right">
<template #default="scope">
<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenCategory_edit'" @click="formDialogRef.openDialog(scope.row.id)">
编辑
</el-button>
<el-button icon="delete" text type="primary" v-auth="'canteen_canteenCategory_del'" @click="handleDelete([scope.row.id])">删除</el-button>
</template>
</el-table-column>
src/views/canteen/canteenDailyMenu/index.vue
+26 -37
View File
@@ -29,7 +29,6 @@
<img @click="delteData(item.tid)" :src="item.picUrl" class="imageCss" />
</td>
</tr>
<tr class="food" style="margin: 0px 5px 5px 0px">
<td @click="addFood(2)">中餐</td>
<td v-for="(item, index) in foodData2" :key="index">
@@ -44,6 +43,7 @@
</tr>
</table>
</div>
<!-- 编辑、新增 -->
<form-dialog ref="formDialogRef" @success="selectTimeFood" />
</div>
@@ -53,11 +53,10 @@
import { delObjs, selectTimeFoodApi, selectWeekInfo } from '/@/api/canteen/canteenDailyMenu';
import { useMessage, useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
import { selectMerchantList } from '/@/api/canteen/merchantInfo';
import { pageJoin } from '/@/api/wallet/mch-manage';
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
const { daily_menu } = useDict('daily_menu');
// 定义变量内容
@@ -73,14 +72,14 @@ const weekData = reactive({
const weekParams = reactive({
index: 0,
});
const foodData1 = ref({});
const foodData2 = ref({});
const foodData3 = ref({});
const foodData1 = ref<any>({});
const foodData2 = ref<any>({});
const foodData3 = ref<any>({});
let isActive = ref(-1);
let timedata = '';
const merchantId = ref();
const merchantStatus = ref(true);
const merchantInfo = ref([]);
const merchantInfo = ref<any>([]);
let tableWitch = 1000;
const addFood = async (hourType: number) => {
@@ -136,7 +135,7 @@ const selectTimeFood = async () => {
//最大长度
let count = 0;
const result = await selectTimeFoodApi(params);
result.data.forEach((r) => {
result.data.forEach((r: any) => {
if (r.dailyMenuVOS.length > count) {
count = r.dailyMenuVOS.length;
}
@@ -167,45 +166,35 @@ const delteData = async (tid: number) => {
};
// 删除操作
const handleDelete = async (ids: string[]) => {
try {
await useMessageBox().confirm('此操作将永久删除');
} catch {
return;
}
// const handleDelete = async (ids: string[]) => {
// try {
// await useMessageBox().confirm('此操作将永久删除');
// } catch {
// return;
// }
try {
await delObjs(ids);
// getDataList();
useMessage().success('删除成功');
} catch (err: any) {
useMessage().error(err.msg);
}
};
/** 查询列表 */
// const getList = async () => {
// loading.value = true
// try {
// const data = await fetchList(queryParams)
// list.value = data.list
// total.value = data.total
// } finally {
// loading.value = false
// }
// }
// try {
// await delObjs(ids);
// // getDataList();
// useMessage().success('删除成功');
// } catch (err: any) {
// useMessage().error(err.msg);
// }
// };
/** 初始化下拉框 */
const merchantInit = async () => {
// 获取下拉框
let res = await selectMerchantList('1');
merchantInfo.value = res.data;
// 获取下拉框选项
let res = await pageJoin({ current: 1, size: 9999 });
merchantInfo.value = res.data.records;
//默认选中第一个
if (merchantInfo.value) {
merchantId.value = merchantInfo.value[0].id;
if (merchantInfo.value.length > 1) {
merchantStatus.value = false;
}
// getList()
fetchData();
}
};
src/views/canteen/canteenOnlineCategory/form.vue
+4 -4
View File
@@ -2,22 +2,22 @@
<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-col :span="14" class="mb20">
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="分类名称" prop="name">
<el-input v-model="form.name" placeholder="请输入分类名称" />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="分类图" prop="picUrl">
<upload-img v-model="form.picUrl"></upload-img>
<upload-img v-model:imageUrl="form.picUrl" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="分类排序" prop="sort">
<el-input-number v-model="form.sort" placeholder="请输入分类排序" />
</el-form-item>
src/views/canteen/canteenOnlineCategory/index.vue
+2 -4
View File
@@ -50,8 +50,8 @@
<el-table-column type="index" label="#" width="40" />
<el-table-column prop="name" label="分类名称" show-overflow-tooltip />
<el-table-column prop="picUrl" label="分类图" show-overflow-tooltip>
<template #default="scope">
<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
<template #default="{ row }">
<preview-image :src="row.picUrl" />
</template>
</el-table-column>
<el-table-column prop="sort" label="分类排序" show-overflow-tooltip />
@@ -86,10 +86,8 @@ import { BasicTableProps, useTable } from '/@/hooks/table';
import { fetchList, delObjs } from '/@/api/canteen/canteenOnlineCategory';
import { useMessage, useMessageBox } from '/@/hooks/message';
const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
// 定义变量内容
const formDialogRef = ref();
src/views/canteen/canteenOnlineSpu/form.vue
+15 -14
View File
@@ -2,52 +2,52 @@
<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="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入商品名称" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品分类" prop="categoryId">
<select-ctcg v-model="form.categoryId" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品价格" prop="price">
<el-input-number v-model="form.price" :precision="2" placeholder="请输入商品价格" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="市场价" prop="marketPrice">
<el-input-number v-model="form.marketPrice" :precision="2" placeholder="请输入市场价" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="库存" prop="stock">
<el-input-number v-model="form.stock" placeholder="请输入库存" />
</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>
<upload-img v-model:imageUrl="form.picUrl" />
</el-form-item>
</el-col>
<el-col :span="24" class="mb20">
<el-form-item label="商品轮播图" prop="sliderPicUrls">
<upload-imgs v-model="form.sliderPicUrls"></upload-imgs>
<upload-imgs v-model="form.sliderPicUrls" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="排序字段" prop="sort">
<el-input-number v-model="form.sort" placeholder="请输入排序字段" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="24" class="mb20">
<el-form-item label="商品状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }} </el-radio>
@@ -56,11 +56,12 @@
</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>
<editor v-if="visible" v-model:get-html="form.description" placeholder="请输入商品详情" />
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="visible = false">取消</el-button>
@@ -91,7 +92,7 @@ const form = reactive({
merchantId: '',
name: '',
introduction: '',
description: '',
description: '<p></p>',
categoryId: '',
picUrl: '',
sliderPicUrls: '',
@@ -160,8 +161,8 @@ const getcanteenOnlineSpuData = (id: string) => {
getObj(id)
.then((res: any) => {
Object.assign(form, res.data, {
price: displayPrice(res.data.price, ''),
marketPrice: displayPrice(res.data.marketPrice, ''),
price: Number(displayPrice(res.data.price, '')),
marketPrice: Number(displayPrice(res.data.marketPrice, '')),
});
})
.finally(() => {
src/views/canteen/canteenOnlineSpu/index.vue
+18 -6
View File
@@ -52,10 +52,14 @@
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="50" />
<el-table-column prop="name" label="商品名称" show-overflow-tooltip min-width="100" />
<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip min-width="100" />
<el-table-column prop="categoryId" label="商品分类" show-overflow-tooltip min-width="100">
<template #default="{ row }">
{{ categoryOptions?.find((item: any) => item?.id === row?.categoryId)?.name }}
</template>
</el-table-column>
<el-table-column prop="picUrl" label="商品封面图" show-overflow-tooltip min-width="100">
<template #default="scope">
<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
<preview-image :src="scope.row.picUrl" />
</template>
</el-table-column>
<el-table-column prop="sort" label="排序字段" show-overflow-tooltip min-width="100" />
@@ -102,11 +106,10 @@ import { fetchList, delObjs } from '/@/api/canteen/canteenOnlineSpu';
import { useMessage, useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
import { displayPrice } from '/@/utils/formatMoney';
import { fetchList as getCanteenOnlineCategory } from '/@/api/canteen/canteenOnlineCategory';
const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
const { spu_status } = useDict('spu_status');
// 定义变量内容
@@ -117,13 +120,22 @@ const showSearch = ref(true);
// 多选变量
const selectObjs = ref([]) as any;
const multiple = ref(true);
const categoryOptions = ref<any>([]); // 商品分类选项
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: fetchList,
});
// table hook
onMounted(async () => {
try {
const res = await getCanteenOnlineCategory();
categoryOptions.value = res.data.records;
} catch (error) {
categoryOptions.value = [];
}
});
// table hook
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
// 清空搜索条件
src/views/canteen/canteenSpu/form.vue
+39 -24
View File
@@ -2,24 +2,24 @@
<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-col :span="14" class="mb20">
<el-form-item label="商户" prop="merchantId">
<select-mch v-model="form.merchantId" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品名称" prop="name">
<el-input v-model="form.name" placeholder="请输入商品名称" />
</el-form-item>
</el-col>
<el-col :span="12" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品分类" prop="categoryId">
<select-ctcg v-model="form.categoryId" />
<select-ctcgd v-model="form.categoryId" />
</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>
<upload-img v-model:imageUrl="form.picUrl" />
</el-form-item>
</el-col>
<!-- <el-col :span="12" class="mb20">-->
@@ -34,35 +34,35 @@
<!-- </el-form-item>-->
<!-- </el-col>-->
<el-col :span="8" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入排序" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio :label="item.value" v-for="(item, index) in spu_status" border :key="index">{{ item.label }} </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="8" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="商品价格" prop="price">
<el-input v-model="form.price" placeholder="请输入商品价格" />
<el-input-number v-model="form.price" :precision="2" placeholder="请输入商品价格" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="市场价" prop="marketPrice">
<el-input v-model="form.marketPrice" placeholder="请输入市场价" />
<el-input-number v-model="form.marketPrice" :precision="2" placeholder="请输入市场价" />
</el-form-item>
</el-col>
<el-col :span="8" class="mb20">
<el-col :span="14" class="mb20">
<el-form-item label="库存" prop="stock">
<el-input v-model="form.stock" placeholder="请输入库存" />
<el-input-number v-model="form.stock" placeholder="请输入库存" />
</el-form-item>
</el-col>
@@ -100,6 +100,7 @@ import { useMessage } from '/@/hooks/message';
import { getObj, addObj, putObj } from '/@/api/canteen/canteenSpu';
import { getAllSimple } from '/@/api/canteen/canteenCategory';
import { rule } from '/@/utils/validate';
import { displayPrice, storePrice } from '/@/utils/formatMoney';
const emit = defineEmits(['refresh']);
// 定义变量内容
@@ -121,10 +122,10 @@ const form = reactive({
sliderPicUrls: '',
sort: '',
status: '0',
price: '',
marketPrice: '',
price: 0,
marketPrice: 0,
costPrice: '',
stock: '',
stock: 0,
giveIntegral: '',
salesCount: '',
virtualSalesCount: '',
@@ -134,14 +135,25 @@ const form = reactive({
// 定义校验规则
const dataRules = ref({
categoryId: [{ required: true, message: '商品分类不能为空', trigger: 'blur' }],
merchantId: [{ required: true, message: '商户不能为空', trigger: 'blur' }],
name: [{ required: true, message: '商品名称不能为空', trigger: 'blur' }],
picUrl: [{ required: true, message: '商品封面图不能为空', trigger: 'blur' }],
status: [{ required: true, message: '商品状态不能为空', trigger: 'blur' }],
sort: [{ validator: rule.number, trigger: 'blur' }],
price: [{ validator: rule.number, trigger: 'blur' }],
marketPrice: [{ validator: rule.number, trigger: 'blur' }],
price: [
{ validator: rule.number, trigger: 'blur' },
{ required: true, message: '商品状态不能为空', trigger: 'blur' },
],
marketPrice: [
{ validator: rule.number, trigger: 'blur' },
{ required: true, message: '商品状态不能为空', trigger: 'blur' },
],
costPrice: [{ validator: rule.number, trigger: 'blur' }],
stock: [{ validator: rule.number, trigger: 'blur' }],
stock: [
{ validator: rule.number, trigger: 'blur' },
{ required: true, message: '商品状态不能为空', trigger: 'blur' },
],
giveIntegral: [{ validator: rule.number, trigger: 'blur' }],
salesCount: [{ validator: rule.number, trigger: 'blur' }],
virtualSalesCount: [{ validator: rule.number, trigger: 'blur' }],
@@ -164,14 +176,13 @@ const openDialog = async (id: string) => {
// 提交
const onSubmit = async () => {
console.log(form);
const valid = await dataFormRef?.value.validate().catch(() => {});
if (!valid) return false;
try {
loading.value = true;
form.id ? await putObj(form) : await addObj(form);
const _pa = { ...form, price: storePrice(form.price), marketPrice: storePrice(form.marketPrice) };
form.id ? await putObj(_pa) : await addObj(_pa);
useMessage().success(form.id ? '修改成功' : '添加成功');
visible.value = false;
emit('refresh');
@@ -188,7 +199,11 @@ const getcanteenSpuData = (id: string) => {
loading.value = true;
getObj(id)
.then((res: any) => {
Object.assign(form, res.data);
Object.assign(form, res.data, {
price: Number(displayPrice(res.data.price, '')),
marketPrice: Number(displayPrice(res.data.marketPrice, '')),
status: '' + res.data.status,
});
})
.finally(() => {
loading.value = false;
src/views/canteen/canteenSpu/index.vue
+21 -8
View File
@@ -43,19 +43,23 @@
@sort-change="sortChangeHandle"
>
<el-table-column type="selection" width="40" align="center" />
<el-table-column type="index" label="#" width="40" />
<el-table-column type="index" label="#" width="50" />
<el-table-column prop="name" label="商品名称" width="120px" show-overflow-tooltip />
<el-table-column prop="categoryId" label="商品分类编号" width="120px" show-overflow-tooltip />
<el-table-column prop="categoryId" label="商品分类" width="100px" show-overflow-tooltip>
<template #default="{ row }">
{{ categoryOptions?.find((item: any) => item?.id === row?.categoryId)?.name }}
</template>
</el-table-column>
<el-table-column prop="picUrl" label="商品封面图" align="center" width="160px" show-overflow-tooltip>
<template #default="scope">
<preview-image style="width: 50px; height: 50px" :src="imageBaseUrl + scope.row.picUrl" />
<preview-image :src="scope.row.picUrl" />
</template>
</el-table-column>
<!-- <el-table-column prop="sliderPicUrls" label="商品轮播图" show-overflow-tooltip /> -->
<el-table-column prop="sort" label="排序字段" show-overflow-tooltip />
<el-table-column prop="status" label="上架状态" show-overflow-tooltip>
<template #default="scope">
<dict-tag :options="spu_status" :value="scope.row.status"></dict-tag>
<dict-tag :options="spu_status" :value="scope.row.status" />
</template>
</el-table-column>
<el-table-column prop="price" label="商品价格" show-overflow-tooltip>
@@ -73,7 +77,7 @@
<!-- <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="createTime" label="创建时间" show-overflow-tooltip />
<el-table-column prop="createTime" label="创建时间" show-overflow-tooltip min-width="160" />
<el-table-column label="操作" width="150" fixed="right">
<template #default="scope">
<el-button icon="edit-pen" text type="primary" v-auth="'canteen_canteenSpu_edit'" @click="formDialogRef?.openDialog(scope.row.id)">
@@ -97,10 +101,10 @@ import { fetchList, delObjs } from '/@/api/canteen/canteenSpu';
import { useMessage, useMessageBox } from '/@/hooks/message';
import { useDict } from '/@/hooks/dict';
import { displayPrice } from '/@/utils/formatMoney';
import { fetchList as getCanteenCategory } from '/@/api/canteen/canteenCategory';
// 引入组件
const FormDialog = defineAsyncComponent(() => import('./form.vue'));
// 定义查询字典
const { spu_status } = useDict('spu_status');
// 定义变量内容
@@ -111,14 +115,23 @@ const showSearch = ref(true);
// 多选变量
const selectObjs = ref([]) as any;
const multiple = ref(true);
const imageBaseUrl = import.meta.env.VITE_IMAGE_BASE_PATH;
const categoryOptions = ref<any>([]); // 商品分类选项
const state: BasicTableProps = reactive<BasicTableProps>({
queryForm: {},
pageList: fetchList,
});
// table hook
onMounted(async () => {
try {
const res = await getCanteenCategory();
categoryOptions.value = res.data.records;
} catch (error) {
categoryOptions.value = [];
}
});
// table hook
const { getDataList, currentChangeHandle, sizeChangeHandle, sortChangeHandle, downBlobFile, tableStyle } = useTable(state);
// 清空搜索条件