优化商品和商品类别管理，添加许愿功能及状态控制
This commit is contained in:
parent
1759dbb28d
commit
3024a09fc9
@ -13,7 +13,7 @@ export interface ProductVO {
|
||||
* 商品名称
|
||||
*/
|
||||
productName: string;
|
||||
|
||||
status: string | number;
|
||||
/**
|
||||
* 商品图片
|
||||
*/
|
||||
@ -57,7 +57,6 @@ export interface ProductVO {
|
||||
* 备注
|
||||
*/
|
||||
remark: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ProductForm extends BaseEntity {
|
||||
@ -65,7 +64,7 @@ export interface ProductForm extends BaseEntity {
|
||||
* ID
|
||||
*/
|
||||
id?: string | number;
|
||||
|
||||
status?: string | number;
|
||||
/**
|
||||
* 商品类别id
|
||||
*/
|
||||
@ -94,7 +93,7 @@ export interface ProductForm extends BaseEntity {
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
sortOrder?: number;
|
||||
sortNum?: number;
|
||||
|
||||
/**
|
||||
* 商品状态
|
||||
@ -105,16 +104,14 @@ export interface ProductForm extends BaseEntity {
|
||||
* 备注
|
||||
*/
|
||||
remark?: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ProductQuery extends PageQuery {
|
||||
|
||||
/**
|
||||
* 商品类别id
|
||||
*/
|
||||
categoryId?: string | number;
|
||||
|
||||
status?: string | number;
|
||||
/**
|
||||
* 商品名称
|
||||
*/
|
||||
@ -138,18 +135,15 @@ export interface ProductQuery extends PageQuery {
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
sortOrder?: number;
|
||||
sortNum?: number;
|
||||
|
||||
/**
|
||||
* 商品状态
|
||||
*/
|
||||
productStatus?: string;
|
||||
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@ -61,3 +61,15 @@ export const delProductCategory = (id: string | number | Array<string | number>)
|
||||
method: 'delete'
|
||||
});
|
||||
};
|
||||
/**
|
||||
* 获取许愿列表
|
||||
* @param query
|
||||
* @returns
|
||||
*/
|
||||
export const userWishList = (query: any) => {
|
||||
return request({
|
||||
url: '/manage/userWish/list',
|
||||
method: 'get',
|
||||
params: query
|
||||
});
|
||||
};
|
||||
|
||||
@ -3,7 +3,7 @@ export interface ProductCategoryVO {
|
||||
* 唯一标识ID
|
||||
*/
|
||||
id: string | number;
|
||||
|
||||
wishCount?: number | string;
|
||||
/**
|
||||
* 类别
|
||||
*/
|
||||
@ -28,7 +28,6 @@ export interface ProductCategoryVO {
|
||||
* 备注
|
||||
*/
|
||||
remark: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ProductCategoryForm extends BaseEntity {
|
||||
@ -41,7 +40,8 @@ export interface ProductCategoryForm extends BaseEntity {
|
||||
* 类别
|
||||
*/
|
||||
category?: string;
|
||||
|
||||
sortNum?: number;
|
||||
image?: any;
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
@ -51,11 +51,9 @@ export interface ProductCategoryForm extends BaseEntity {
|
||||
* 备注
|
||||
*/
|
||||
remark?: string;
|
||||
|
||||
}
|
||||
|
||||
export interface ProductCategoryQuery extends PageQuery {
|
||||
|
||||
/**
|
||||
* 类别
|
||||
*/
|
||||
@ -64,13 +62,10 @@ export interface ProductCategoryQuery extends PageQuery {
|
||||
/**
|
||||
* 排序
|
||||
*/
|
||||
firstLevelCategoryOrder?: number;
|
||||
sortNum?: number | string;
|
||||
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
/**
|
||||
* 日期范围参数
|
||||
*/
|
||||
params?: any;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
@ -63,7 +63,7 @@ const settingRef = ref<InstanceType<typeof Settings>>();
|
||||
|
||||
onMounted(() => {
|
||||
nextTick(() => {
|
||||
navbarRef.value?.initTenantList();
|
||||
// navbarRef.value?.initTenantList();
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
@ -1,3 +1,4 @@
|
||||
<!-- 文章管理 -->
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
|
||||
@ -186,7 +187,7 @@ const data = reactive<PageData<ArticleForm, ArticleQuery>>({
|
||||
{ required: true, message: "内容不能为空", trigger: "blur" }
|
||||
],
|
||||
tagId_copy: [
|
||||
{ required: true, message: "标签id，以逗号分隔不能为空", trigger: "blur" }
|
||||
{ required: true, message: "标签不能为空", trigger: "blur" }
|
||||
],
|
||||
}
|
||||
});
|
||||
@ -249,6 +250,13 @@ const resetQuery = () => {
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
for (let i = 0; i < selection.length; i++) {
|
||||
const element = selection[i];
|
||||
if (element.status==2) {
|
||||
proxy.$modal.msgError('已发布的数据不能修改或删除');
|
||||
return
|
||||
}
|
||||
}
|
||||
ids.value = selection.map(item => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
|
||||
@ -20,10 +20,10 @@
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd"
|
||||
v-hasPermi="['system:article:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
<!-- <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
v-hasPermi="['system:article:edit']">修改</el-button>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"
|
||||
v-hasPermi="['system:article:remove']">删除</el-button>
|
||||
v-hasPermi="['system:article:remove']">删除</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
|
||||
@ -9,10 +9,9 @@
|
||||
<el-input class="inputWidth" v-model="queryParams.productName" placeholder="请输入商品名称" clearable
|
||||
@keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="商品类别" prop="productShows">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择类别" clearable class="inputWidth">
|
||||
<el-option label="封禁" value="0"></el-option>
|
||||
<el-option label="正常" value="1"></el-option>
|
||||
<el-form-item label="商品状态" prop="productShows">
|
||||
<el-select class="inputWidth" v-model="queryParams.status" placeholder="请选择商品状态" clearable>
|
||||
<el-option v-for="dict in sys_shelf_status" :key="dict.value" :label="dict.label" :value="dict.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
@ -20,32 +19,43 @@
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd"
|
||||
v-hasPermi="['manage:product:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
<!-- <el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
v-hasPermi="['manage:product:edit']">修改</el-button>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"
|
||||
v-hasPermi="['manage:product:remove']">删除</el-button>
|
||||
v-hasPermi="['manage:product:remove']">删除</el-button> -->
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-table v-loading="loading" :height="autoTableHeight" :data="productList"
|
||||
<el-table v-loading="loading" border :height="autoTableHeight" :data="productList"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="商品ID" align="center" prop="id" v-if="true" width="180px" />
|
||||
<el-table-column label="商品名称" align="center" prop="productName" />
|
||||
<el-table-column label="商品类别" align="center" prop="categoryId" />
|
||||
<el-table-column label="商品类别" align="center" prop="categoryId">
|
||||
<template #default="scope">
|
||||
<span>{{ formatCategoryName(scope.row.categoryId)}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品图片" align="center" prop="productImageUrl" width="100">
|
||||
<template #default="scope">
|
||||
<image-preview :src="scope.row.productImageUrl" :width="50" :height="50" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="商品说明" align="center" prop="productShows" />
|
||||
<el-table-column label="供应商" align="center" prop="vendorId" />
|
||||
<el-table-column label="排序" align="center" prop="sortOrder" />
|
||||
<el-table-column label="商品状态" align="center" prop="productStatus" />
|
||||
<el-table-column label="操作者" align="center" prop="updateBy" />
|
||||
<el-table-column label="排序" align="center" prop="sortNum" />
|
||||
<el-table-column label="商品状态" align="center" prop="status">
|
||||
<template #default="scope">
|
||||
<dict-tag :options="sys_shelf_status" :value="scope.row.status" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="供应商" align="center" prop="vendorId">
|
||||
<template #default="scope">
|
||||
<span>{{ formatVendorName(scope.row.vendorId) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作者" align="center" prop="updateByName" />
|
||||
<el-table-column label="操作时间" align="center" prop="updateTime" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
|
||||
@ -53,15 +63,15 @@
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['manage:product:edit']">上架</el-button>
|
||||
<el-button link type="primary" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['manage:product:edit']">下架</el-button>
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" @click="handleStatus(scope.row,'1')" v-hasPermi="['manage:product:edit']"
|
||||
v-if="scope.row.status==0">上架</el-button>
|
||||
<el-button link type="primary" @click="handleStatus(scope.row,'0')" v-hasPermi="['manage:product:edit']"
|
||||
v-if="scope.row.status==1">下架</el-button>
|
||||
<el-tooltip content="修改" placement="top" v-if="scope.row.status==0">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['manage:product:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-tooltip content="删除" placement="top" v-if="scope.row.status==0">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['manage:product:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
@ -80,17 +90,21 @@
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12">
|
||||
<el-form-item label="商品类别" prop="categoryId">
|
||||
<el-input v-model="form.categoryId" placeholder="请输入商品类别id" />
|
||||
<el-select v-model="form.categoryId" placeholder="请选择商品类别" clearable>
|
||||
<el-option v-for="dict in productCategoryList" :key="dict.id" :label="dict.category" :value="dict.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="排序" prop="sortOrder">
|
||||
<el-input-number v-model="form.sortOrder" :min="1" :max="10000" />
|
||||
<el-form-item label="排序" prop="sortNum">
|
||||
<el-input-number v-model="form.sortNum" :min="1" :max="10000" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-form-item label="供应商" prop="vendorId">
|
||||
<el-input v-model="form.vendorId" placeholder="请输入供应商id" />
|
||||
<el-select v-model="form.vendorId" placeholder="请选择供应商" clearable>
|
||||
<el-option v-for="dict in listVendorList" :key="dict.id" :label="dict.vendorName" :value="dict.id" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="商品图片" prop="productImage">
|
||||
<image-upload v-model="form.productImage" />
|
||||
@ -110,6 +124,9 @@
|
||||
</template>
|
||||
|
||||
<script setup name="Product" lang="ts">
|
||||
import { listProductCategory } from '@/api/manage/productCategory';
|
||||
import { listVendor } from '@/api/manage/vendor';
|
||||
|
||||
import { listProduct, getProduct, delProduct, addProduct, updateProduct } from '@/api/manage/product';
|
||||
import { ProductVO, ProductQuery, ProductForm } from '@/api/manage/product/types';
|
||||
|
||||
@ -123,7 +140,9 @@ const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const { sys_shelf_status } = toRefs<any>(
|
||||
proxy?.useDict('sys_shelf_status')
|
||||
);
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const productFormRef = ref<ElFormInstance>();
|
||||
|
||||
@ -139,9 +158,10 @@ const initFormData: ProductForm = {
|
||||
productImage: undefined,
|
||||
productShows: undefined,
|
||||
vendorId: undefined,
|
||||
sortOrder: 0,
|
||||
sortNum: 0,
|
||||
productStatus: undefined,
|
||||
remark: undefined
|
||||
remark: undefined,
|
||||
status: undefined
|
||||
}
|
||||
const data = reactive<PageData<ProductForm, ProductQuery>>({
|
||||
form: {...initFormData},
|
||||
@ -153,35 +173,26 @@ const data = reactive<PageData<ProductForm, ProductQuery>>({
|
||||
productImage: undefined,
|
||||
productShows: undefined,
|
||||
vendorId: undefined,
|
||||
sortOrder: undefined,
|
||||
sortNum: undefined,
|
||||
productStatus: undefined,
|
||||
params: {
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
id: [
|
||||
{ required: true, message: "ID不能为空", trigger: "blur" }
|
||||
],
|
||||
categoryId: [
|
||||
{ required: true, message: "商品类别id不能为空", trigger: "blur" }
|
||||
{ required: true, message: "商品类别不能为空", trigger: "blur" }
|
||||
],
|
||||
productName: [
|
||||
{ required: true, message: "商品名称不能为空", trigger: "blur" }
|
||||
],
|
||||
productImage: [
|
||||
{ required: true, message: "商品图片不能为空", trigger: "blur" }
|
||||
{ required: false, message: "商品图片不能为空", trigger: "blur" }
|
||||
],
|
||||
productShows: [
|
||||
{ required: true, message: "商品说明不能为空", trigger: "blur" }
|
||||
],
|
||||
vendorId: [
|
||||
{ required: true, message: "供应商id不能为空", trigger: "blur" }
|
||||
],
|
||||
sortOrder: [
|
||||
{ required: true, message: "排序不能为空", trigger: "blur" }
|
||||
],
|
||||
productStatus: [
|
||||
{ required: true, message: "商品状态不能为空", trigger: "change" }
|
||||
{ required: true, message: "供应商不能为空", trigger: "blur" }
|
||||
],
|
||||
remark: [
|
||||
{ required: true, message: "备注不能为空", trigger: "blur" }
|
||||
@ -247,7 +258,18 @@ const handleUpdate = async (row?: ProductVO) => {
|
||||
dialog.visible = true;
|
||||
dialog.title = "修改商品信息";
|
||||
}
|
||||
|
||||
/**
|
||||
* 上架 下架 商品
|
||||
* @param row
|
||||
*/
|
||||
const handleStatus = async (row: ProductVO,type: string) => {
|
||||
await proxy?.$modal.confirm('是否确认' + (type == '0' ? '下架' : '上架') + '名称为"' + row.productName + '"的数据项？');
|
||||
row.status = type;
|
||||
buttonLoading.value = true;
|
||||
await updateProduct(row).finally(() => buttonLoading.value = false);
|
||||
proxy?.$modal.msgSuccess('操作成功');
|
||||
getList();
|
||||
}
|
||||
/** 提交按钮 */
|
||||
const submitForm = () => {
|
||||
productFormRef.value?.validate(async (valid: boolean) => {
|
||||
@ -256,6 +278,7 @@ const submitForm = () => {
|
||||
if (form.value.id) {
|
||||
await updateProduct(form.value).finally(() => buttonLoading.value = false);
|
||||
} else {
|
||||
form.value.status = 0;
|
||||
await addProduct(form.value).finally(() => buttonLoading.value = false);
|
||||
}
|
||||
proxy?.$modal.msgSuccess("操作成功");
|
||||
@ -280,9 +303,50 @@ const handleExport = () => {
|
||||
...queryParams.value
|
||||
}, `product_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
|
||||
/**
|
||||
* 商品类别列表
|
||||
*/
|
||||
const productCategoryList = ref([]);
|
||||
const getProductCategoryList = async () => {
|
||||
let res = await listProductCategory({ pageNum: 1, pageSize: 9999 });
|
||||
productCategoryList.value = res.rows;
|
||||
}
|
||||
/**
|
||||
* 供应商列表
|
||||
*/
|
||||
const listVendorList = ref([]);
|
||||
const getlistVendor = async () => {
|
||||
let res = await listVendor({ pageNum: 1, pageSize: 9999 });
|
||||
listVendorList.value = res.rows;
|
||||
}
|
||||
/**
|
||||
* 格式化商品类别名称
|
||||
* @param row
|
||||
*/
|
||||
const formatCategoryName = (id:any) => {
|
||||
for (let i = 0; i < productCategoryList.value.length; i++) {
|
||||
const element = productCategoryList.value[i];
|
||||
if (element.id == id) {
|
||||
return element.category;
|
||||
}
|
||||
}
|
||||
}
|
||||
/**
|
||||
* 格式化 供应商名称
|
||||
* @param id
|
||||
*/
|
||||
const formatVendorName = (id:any) => {
|
||||
for (let i = 0; i < listVendorList.value.length; i++) {
|
||||
const element = listVendorList.value[i];
|
||||
if (element.id == id) {
|
||||
return element.vendorName;
|
||||
}
|
||||
}
|
||||
}
|
||||
onMounted(() => {
|
||||
getList();
|
||||
getlistVendor(); //供应商列表
|
||||
getProductCategoryList(); //商品类别列表
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
|
||||
@ -1,80 +1,84 @@
|
||||
<template>
|
||||
<div class="p-2">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]">
|
||||
<transition :enter-active-class="proxy?.animate.searchAnimate.enter"
|
||||
:leave-active-class="proxy?.animate.searchAnimate.leave">
|
||||
<div v-show="showSearch" class="mb-[10px]" id="search_div">
|
||||
<el-card shadow="hover">
|
||||
<el-form ref="queryFormRef" :model="queryParams" :inline="true">
|
||||
<el-form-item label="类别" prop="category">
|
||||
<el-input v-model="queryParams.category" placeholder="请输入类别" clearable @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="firstLevelCategoryOrder">
|
||||
<el-input v-model="queryParams.firstLevelCategoryOrder" placeholder="请输入排序" clearable @keyup.enter="handleQuery" />
|
||||
<el-form-item label="类别名称" prop="category">
|
||||
<el-input v-model="queryParams.category" class="inputWidth" placeholder="请输入类别名称" clearable
|
||||
@keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery">重置</el-button>
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd"
|
||||
v-hasPermi="['manage:productCategory:add']">新增</el-button>
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()"
|
||||
v-hasPermi="['manage:productCategory:edit']">修改</el-button>
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()"
|
||||
v-hasPermi="['manage:productCategory:remove']">删除</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
<el-card shadow="never">
|
||||
<template #header>
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['manage:productCategory:add']">新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate()" v-hasPermi="['manage:productCategory:edit']">修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete()" v-hasPermi="['manage:productCategory:remove']">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="warning" plain icon="Download" @click="handleExport" v-hasPermi="['manage:productCategory:export']">导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
</template>
|
||||
<el-table v-loading="loading" :height="autoTableHeight" border :data="productCategoryList"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="类别名称" align="center" prop="category" />
|
||||
<el-table-column label="类别排序" align="center" prop="sortNum" />
|
||||
<el-table-column label="商品图" align="center" prop="image.imgUrl">
|
||||
<template #default="scope">
|
||||
<!-- <el-image :src="scope.row.image?.imgUrl" fit="contain" :width="50" :height="50">
|
||||
<template #error>
|
||||
<div class="image-slot">
|
||||
<el-icon><icon-picture /></el-icon>
|
||||
</div>
|
||||
</template>
|
||||
</el-image> -->
|
||||
<image-preview :src="scope.row.image?.imgUrl" :width="50" :height="50" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="许愿人数" align="center" prop="remark">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" @click="handleMakeWish(scope.row)">{{ scope.row.wishCount }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作者" align="center" prop="updateByName" />
|
||||
<el-table-column label="操作时间" align="center" prop="updateTime" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['manage:productCategory:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
|
||||
v-hasPermi="['manage:productCategory:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-table v-loading="loading" :data="productCategoryList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<el-table-column label="唯一标识ID" align="center" prop="id" v-if="true" />
|
||||
<el-table-column label="类别" align="center" prop="category" />
|
||||
<el-table-column label="排序" align="center" prop="firstLevelCategoryOrder" />
|
||||
<el-table-column label="更新者" align="center" prop="updateBy" />
|
||||
<el-table-column label="更新时间" align="center" prop="updateTime" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" prop="remark" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template #default="scope">
|
||||
<el-tooltip content="修改" placement="top">
|
||||
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['manage:productCategory:edit']"></el-button>
|
||||
</el-tooltip>
|
||||
<el-tooltip content="删除" placement="top">
|
||||
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['manage:productCategory:remove']"></el-button>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
</el-card>
|
||||
<pagination v-show="total > 0" id="table_page" :total="total" v-model:page="queryParams.pageNum"
|
||||
v-model:limit="queryParams.pageSize" @pagination="getList" />
|
||||
<!-- 添加或修改商品类别对话框 -->
|
||||
<el-dialog :title="dialog.title" v-model="dialog.visible" width="500px" append-to-body>
|
||||
<el-form ref="productCategoryFormRef" :model="form" :rules="rules" label-width="80px">
|
||||
<el-form-item label="类别" prop="category">
|
||||
<el-form-item label="类别名称" prop="category">
|
||||
<el-input v-model="form.category" placeholder="请输入类别" />
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="firstLevelCategoryOrder">
|
||||
<el-input v-model="form.firstLevelCategoryOrder" placeholder="请输入排序" />
|
||||
<el-form-item label="排序" prop="sortNum">
|
||||
<el-input-number v-model="form.sortNum" :min="1" :max="10000" />
|
||||
</el-form-item>
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input v-model="form.remark" placeholder="请输入备注" />
|
||||
<el-form-item label="商品图片" prop="remark">
|
||||
<image-upload v-model="form.image" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
@ -84,15 +88,34 @@
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
<!-- 许愿人数 -->
|
||||
<el-dialog title="许愿用户" v-model="makeWish.visible" width="700px" append-to-body>
|
||||
<el-table v-loading="loading" height="300px" border :data="wishList">
|
||||
<el-table-column label="用户ID" align="center" prop="userId" />
|
||||
<el-table-column label="用户昵称" align="center" prop="nickName" />
|
||||
<el-table-column label="许愿时间" align="center" prop="updateTime" width="180">
|
||||
<template #default="scope">
|
||||
<span>{{ parseTime(scope.row.updateTime, '{y}-{m}-{d}') }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination v-show="wishTotal > 0" :total="wishTotal" v-model:page="wishParams.pageNum"
|
||||
v-model:limit="wishParams.pageSize" @pagination="getWishUserList" />
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button @click="cancel">关 闭</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="ProductCategory" lang="ts">
|
||||
import { listProductCategory, getProductCategory, delProductCategory, addProductCategory, updateProductCategory } from '@/api/manage/productCategory';
|
||||
import { listProductCategory, getProductCategory, delProductCategory, addProductCategory, updateProductCategory,userWishList } from '@/api/manage/productCategory';
|
||||
import { ProductCategoryVO, ProductCategoryQuery, ProductCategoryForm } from '@/api/manage/productCategory/types';
|
||||
|
||||
import { Picture as IconPicture } from '@element-plus/icons-vue'
|
||||
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
||||
|
||||
const autoTableHeight = ref<number>(750);
|
||||
const productCategoryList = ref<ProductCategoryVO[]>([]);
|
||||
const buttonLoading = ref(false);
|
||||
const loading = ref(true);
|
||||
@ -101,19 +124,26 @@ const ids = ref<Array<string | number>>([]);
|
||||
const single = ref(true);
|
||||
const multiple = ref(true);
|
||||
const total = ref(0);
|
||||
|
||||
const wishTotal=ref(0);//许愿人数弹层总数
|
||||
const queryFormRef = ref<ElFormInstance>();
|
||||
const productCategoryFormRef = ref<ElFormInstance>();
|
||||
|
||||
const wishParams = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
id: undefined,
|
||||
})
|
||||
const dialog = reactive<DialogOption>({
|
||||
visible: false,
|
||||
title: ''
|
||||
});
|
||||
|
||||
const makeWish = reactive({
|
||||
visible: false,
|
||||
list: []
|
||||
})
|
||||
const initFormData: ProductCategoryForm = {
|
||||
id: undefined,
|
||||
category: undefined,
|
||||
firstLevelCategoryOrder: undefined,
|
||||
sortNum: 0,
|
||||
remark: undefined
|
||||
}
|
||||
const data = reactive<PageData<ProductCategoryForm, ProductCategoryQuery>>({
|
||||
@ -122,22 +152,19 @@ const data = reactive<PageData<ProductCategoryForm, ProductCategoryQuery>>({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
category: undefined,
|
||||
firstLevelCategoryOrder: undefined,
|
||||
sortNum: undefined,
|
||||
params: {
|
||||
}
|
||||
},
|
||||
rules: {
|
||||
id: [
|
||||
{ required: true, message: "唯一标识ID不能为空", trigger: "blur" }
|
||||
],
|
||||
category: [
|
||||
{ required: true, message: "类别不能为空", trigger: "blur" }
|
||||
{ required: true, message: "类别名称不能为空", trigger: "blur" }
|
||||
],
|
||||
firstLevelCategoryOrder: [
|
||||
sortNum: [
|
||||
{ required: true, message: "排序不能为空", trigger: "blur" }
|
||||
],
|
||||
remark: [
|
||||
{ required: true, message: "备注不能为空", trigger: "blur" }
|
||||
image: [
|
||||
{ required: false, message: "商品图片不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
});
|
||||
@ -147,7 +174,7 @@ const { queryParams, form, rules } = toRefs(data);
|
||||
/** 查询商品类别列表 */
|
||||
const getList = async () => {
|
||||
loading.value = true;
|
||||
const res = await listProductCategory(queryParams.value);
|
||||
const res = await listProductCategory(queryParams.value).finally(() => loading.value = false);
|
||||
productCategoryList.value = res.rows;
|
||||
total.value = res.total;
|
||||
loading.value = false;
|
||||
@ -157,6 +184,8 @@ const getList = async () => {
|
||||
const cancel = () => {
|
||||
reset();
|
||||
dialog.visible = false;
|
||||
makeWish.visible=false;
|
||||
wishParams.pageNum = 1;
|
||||
}
|
||||
|
||||
/** 表单重置 */
|
||||
@ -233,8 +262,56 @@ const handleExport = () => {
|
||||
...queryParams.value
|
||||
}, `productCategory_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
|
||||
// 许愿人数
|
||||
const wishList=ref([]);
|
||||
const handleMakeWish = async (row: ProductCategoryVO) => {
|
||||
if (row.wishCount==0) {
|
||||
proxy?.$modal.msgError('该商品类别没有许愿人数');
|
||||
return
|
||||
}
|
||||
loading.value = true;
|
||||
wishParams.id= row.id;
|
||||
getWishUserList();
|
||||
makeWish.visible = true;
|
||||
}
|
||||
const getWishUserList = async () => {
|
||||
const res = await userWishList(wishParams).finally(() => loading.value = false);
|
||||
wishList.value= res.rows;
|
||||
wishTotal.value=res.total;
|
||||
}
|
||||
onMounted(() => {
|
||||
getList();
|
||||
nextTick(() => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
});
|
||||
window.onresize = () => {
|
||||
autoTableHeight.value = proxy?.autoTableHeight();
|
||||
};
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.el-card :deep(.el-card__body) {
|
||||
padding-bottom: 0px !important;
|
||||
}
|
||||
|
||||
#table_page {
|
||||
height: 50px !important;
|
||||
margin-top: 10px !important;
|
||||
padding-bottom: 10px !important;
|
||||
}
|
||||
|
||||
.image-slot {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: var(--el-fill-color-light);
|
||||
color: var(--el-text-color-secondary);
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
.el-icon {
|
||||
font-size: 30px;
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -128,7 +128,8 @@
|
||||
<span>{{ scope.row.status == 0 ? '未发布' : scope.row.status == 1 ? '审核中' : scope.row.status == 2 ? '已发布' : '草稿' }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="介绍" align="center" prop="intro" /> -->
|
||||
<el-table-column label="操作人" align="center" prop="updateByName" width="120px" />
|
||||
<el-table-column label="操作时间" align="center" prop="updateTime" width="160px" />
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" fixed="right" width="170px">
|
||||
<template #default="scope">
|
||||
<el-button link type="primary" v-if="scope.row.status == 0" @click="updateRow(scope.row, '2')"
|
||||
@ -715,6 +716,13 @@ const resetQuery = () => {
|
||||
|
||||
/** 多选框选中数据 */
|
||||
const handleSelectionChange = (selection: ArticleVO[]) => {
|
||||
for (let i = 0; i < selection.length; i++) {
|
||||
const element = selection[i];
|
||||
if (element.status=='2') {
|
||||
proxy.$modal.msgError('已发布的数据不能修改或删除');
|
||||
return
|
||||
}
|
||||
}
|
||||
ids.value = selection.map((item) => item.id);
|
||||
single.value = selection.length != 1;
|
||||
multiple.value = !selection.length;
|
||||
@ -772,6 +780,10 @@ const handleUpdate = async (row?: any) => {
|
||||
reset();
|
||||
const _id = row?.id || ids.value[0];
|
||||
const res = await getArticle(_id);
|
||||
if (res.data.status=='2') {
|
||||
proxy?.$modal.msgError('已发布的文章，无法修改');
|
||||
return
|
||||
}
|
||||
res.data.tagId_copy = res.data.tagId?.split(',');
|
||||
if (res.data.region == null) {
|
||||
res.data.region = res.data.city;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user