商品上架审核设置模块开发
This commit is contained in:
parent
f70341a24a
commit
c7ecaa82fc
@ -5,5 +5,5 @@ VITE_APP_TITLE = 运营云后台管理系统
|
||||
VITE_APP_ENV = 'development'
|
||||
|
||||
# 开发环境
|
||||
VITE_APP_BASE_API = 'http://192.168.18.151:8080'
|
||||
VITE_APP_BASE_API = 'http://192.168.18.99:8080/'
|
||||
VITE_APP_PLATFORM = 'http://localhost:9000/platform'
|
||||
@ -155,3 +155,11 @@ export function deleteContraband(id) {
|
||||
method: "delete",
|
||||
});
|
||||
}
|
||||
//商品审核
|
||||
export function goodaudit(data) {
|
||||
return request({
|
||||
url: '/goods/goodInfoManage/goodExamine',
|
||||
method: 'put',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
||||
@ -46,10 +46,6 @@
|
||||
width: 100px;
|
||||
text-align: right;
|
||||
padding-right: 8px;
|
||||
.el-button-gry{
|
||||
background-color: #25bf82;
|
||||
border:none
|
||||
}
|
||||
}
|
||||
|
||||
.demo-form-inline {
|
||||
@ -307,3 +303,8 @@
|
||||
justify-content: flex-start;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.el-button-gry{
|
||||
background-color: #25bf82;
|
||||
border:none
|
||||
}
|
||||
|
||||
@ -92,6 +92,12 @@ export const constantRoutes = [
|
||||
component: () => import('@/views/goods/goodsManage/editGoods'),
|
||||
name: 'editGoods',
|
||||
meta: { title: '编辑商品', icon: '' }
|
||||
},
|
||||
{
|
||||
path: '/goods/goodsReview/auditGoods/:activeTab?',
|
||||
component: () => import('@/views/goods/goodsReview/auditGoods'),
|
||||
name: 'auditGoods',
|
||||
meta: { title: '审核商品', icon: '' }
|
||||
}
|
||||
]
|
||||
},
|
||||
@ -198,7 +204,19 @@ export const constantRoutes = [
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
}
|
||||
},
|
||||
{
|
||||
path: 'goods/goodsReview',
|
||||
component: () => import('@/views/goods/goodsReview/index'),
|
||||
name: 'goodsReview',
|
||||
hidden: false,
|
||||
meta: {
|
||||
title: "上架审核设置",
|
||||
icon: "",
|
||||
noCache: false,
|
||||
link: null,
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
|
||||
@ -64,7 +64,7 @@
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button type="primary" icon="Search" @click="onSubmit"
|
||||
<el-button class="el-button-gry" type="primary" icon="Search" @click="onSubmit"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button
|
||||
@ -100,34 +100,9 @@
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-tooltip effect="dark" placement="bottom-end">
|
||||
<template #content>
|
||||
<div class="custom-tooltip-content">
|
||||
<el-icon
|
||||
class="el-icon-custom"
|
||||
@click="seeDetails(slotProps.row)"
|
||||
>
|
||||
<View />
|
||||
</el-icon>
|
||||
<el-icon
|
||||
class="el-icon-custom"
|
||||
@click="handleEdit(slotProps.row)"
|
||||
>
|
||||
<Edit />
|
||||
</el-icon>
|
||||
<el-icon
|
||||
class="el-icon-custom"
|
||||
@click="handleDelete(slotProps.row)"
|
||||
>
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<span class="el-dropdown-link">
|
||||
<el-icon><More /></el-icon>
|
||||
</span>
|
||||
</el-tooltip>
|
||||
<el-button text class="el-button-custom" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||
<el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
@ -201,7 +176,7 @@ const columns = ref([
|
||||
{ prop: "userCategory", label: "用户分类" },
|
||||
{ prop: "unitPrice", label: "客单价" },
|
||||
{ prop: "ordersNums", label: "订单数目" },
|
||||
{ prop: "action", label: "操作", slotName: "action" },
|
||||
{ prop: "action", label: "操作", slotName: "action",width: "140",align: "center" },
|
||||
]);
|
||||
|
||||
// 生成食物主题昵称
|
||||
|
||||
@ -85,9 +85,9 @@
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button text class="el-button-custom" :dark="isDark" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||
<el-button text class="el-button-custom" :dark="isDark" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" :dark="isDark" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
<el-button text class="el-button-custom" @click="seeDetails(slotProps.row)">查看</el-button>
|
||||
<el-button text class="el-button-custom" @click="handleEdit(slotProps.row)">编辑</el-button>
|
||||
<el-button text class="el-button-delete" @click="handleDelete(slotProps.row)">删除</el-button>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
|
||||
632
src/views/goods/goodsReview/addGoods.vue
Normal file
632
src/views/goods/goodsReview/addGoods.vue
Normal file
@ -0,0 +1,632 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="customer-box">
|
||||
<el-form ref="formRef" :model="formInline" :rules="rules" class="demo-form-inline" :label-width="'auto'">
|
||||
<!-- 商品名称 -->
|
||||
<el-form-item label="商品名称" prop="goodName">
|
||||
<el-input v-model="formInline.goodName" clearable show-word-limit maxlength="30" placeholder="请输入商品名称"
|
||||
style="width: 800px" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 商品分类 -->
|
||||
<el-form-item label="商品分类" required>
|
||||
<div style="display: flex; gap: 16px;">
|
||||
<el-form-item prop="categoryId1">
|
||||
<el-select v-model="formInline.categoryId1" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory1($event)">
|
||||
<el-option v-for="item in categoryList1" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="categoryId2">
|
||||
<el-select v-model="formInline.categoryId2" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory2($event)">
|
||||
<el-option v-for="item in categoryList2" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="categoryId3">
|
||||
<el-select v-model="formInline.categoryId3" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory3($event)">
|
||||
<el-option v-for="item in categoryList3" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 公共品牌 -->
|
||||
<el-form-item label="公共品牌" prop="brandId" v-show="formInline.goodCategorySelectType == 1">
|
||||
<el-input v-model="formInline.brandId" clearable placeholder="请输入公共品牌" style="width: 800px" />
|
||||
</el-form-item>
|
||||
<!-- 溯源编码 -->
|
||||
<el-form-item label="溯源编码" prop="traceCode" v-show="formInline.goodCategorySelectType == 1">
|
||||
<el-input v-model="formInline.traceCode" clearable placeholder="请输入溯源编码" style="width: 800px" />
|
||||
</el-form-item>
|
||||
<!-- 商品图片 -->
|
||||
<el-form-item label="商品图片" prop="goodUrl" required>
|
||||
<div>
|
||||
<myUploadImage v-model="formInline.goodUrl"></myUploadImage>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 规格样式 -->
|
||||
<el-form-item label="规格样式" prop="specStyle" required>
|
||||
<el-radio-group v-model="formInline.specStyle" style="margin-top: -3px;">
|
||||
<el-radio value="1" size="large">单规格</el-radio>
|
||||
<el-radio value="2" size="large">多规格</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div v-if="formInline.specStyle == 1">
|
||||
<!-- 销售价格 -->
|
||||
<el-form-item label="销售价格" prop="salePrice" required>
|
||||
<el-input-number v-model="formInline.salePrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
<span style="padding: 0 10px;">元</span>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 库存数量 -->
|
||||
<el-form-item label="库存数量" prop="stock" required>
|
||||
<el-input-number v-model="formInline.stock" :min="1" :controls="false" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 净含量 -->
|
||||
<el-form-item label="净含量" prop="netContent" required>
|
||||
<el-input-number v-model="formInline.netContent" :min="1" :controls="false" />
|
||||
<el-select v-model="formInline.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="ml" value="ml" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<!-- 多规格 -->
|
||||
<div v-else>
|
||||
<el-form-item label="商品规格" prop="netWeight" required>
|
||||
<div v-for="(item, index) in formInline.netWeight" :key="index" class="attr-item">
|
||||
<el-input v-model="item.goodSpecs" :value="item.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
<el-icon size="20px" v-if="index !== 0" @click="deleteSpecs(index)" style="cursor: pointer;">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加属性</el-button>
|
||||
</el-form-item>
|
||||
<!-- 价格库存 -->
|
||||
<el-form-item label="价格库存" prop="netWeight" required>
|
||||
<div class="attr-box">
|
||||
<div class="attr-row">
|
||||
<div class="attr-clomn color-gray">商品规格</div>
|
||||
<div class="attr-clomn200 color-gray">销售价格</div>
|
||||
<div class="attr-clomn color-gray">库存数量</div>
|
||||
<div class="attr-clomn220 color-gray">净含量</div>
|
||||
</div>
|
||||
<div v-for="(item, index) in formInline.netWeight" :key="index" class="attr-row">
|
||||
<div class="attr-clomn">{{ item.goodSpecs }}</div>
|
||||
<div class="attr-clomn200 flex-left-top">
|
||||
<el-input-number v-model="item.goodPrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
<span style="padding: 0 10px;">元</span>
|
||||
</div>
|
||||
<div class="attr-clomn">
|
||||
<el-input-number v-model="item.goodStock" :min="1" :controls="false" />
|
||||
</div>
|
||||
<div class="attr-clomn220 flex-left-top">
|
||||
<el-input-number v-model="item.netContent" :min="1" :controls="false" />
|
||||
<el-select v-model="item.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="ml" value="ml" />
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 商品属性 -->
|
||||
<el-form-item label="商品属性" prop="attribute" required>
|
||||
<div v-for="(item, index) in formInline.attribute" :key="index" class="attr-item">
|
||||
<el-input v-model="item.name" :value="item.name" class="attr-input" placeholder="请输入属性名称" />
|
||||
<el-icon size="20px" v-if="index !== 0" @click="deleteAttr(index)" style="cursor: pointer;">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加属性</el-button>
|
||||
</el-form-item>
|
||||
<!-- 属性内容 -->
|
||||
<el-form-item label="属性内容" prop="attribute" required>
|
||||
<div class="attr-box">
|
||||
<div class="attr-row">
|
||||
<div class="attr-input color-gray">属性名称</div>
|
||||
<div class="attr-input color-gray">属性内容</div>
|
||||
</div>
|
||||
<div v-for="(item, index) in formInline.attribute" :key="index" class="attr-row">
|
||||
<div class="attr-input">{{ item.name }}</div>
|
||||
<el-input v-model="item.value" class="attr-input" />
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 发货地址 -->
|
||||
<el-form-item label="发货地址" required>
|
||||
<div style="display: flex; gap: 16px;">
|
||||
<el-form-item prop="selectedAddress">
|
||||
<!-- 省市区级联选择器 -->
|
||||
<el-cascader v-model="formInline.selectedAddress" :options="addressOptions" :props="cascaderProps"
|
||||
placeholder="请选择省市区" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item prop="detailAddress">
|
||||
<!-- 详细地址输入框 -->
|
||||
<el-input v-model="formInline.detailAddress" placeholder="详细地址（如街道、门牌号等）" style="width: 220px;" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 保障服务 -->
|
||||
<el-form-item label="保障服务" prop="safeguard" required style="margin-bottom: 10px;">
|
||||
<el-checkbox v-model="isSafeguardSelected" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item) in formInline.safeguard.options" :key="item.id">服务承诺：{{ item.text }}
|
||||
</div>
|
||||
</el-checkbox>
|
||||
</el-form-item>
|
||||
<!-- 优惠折扣 -->
|
||||
<el-form-item label="优惠折扣" style="margin-bottom: 10px;">
|
||||
<div style="width: 100%;">
|
||||
<el-checkbox v-model="isDiscountSettings" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item) in formInline.discountSettings.options" :key="item.id">
|
||||
优惠设置：{{
|
||||
item.text }}</div>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div style="width: 100%;">
|
||||
<el-checkbox v-model="isDiscountRebate" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item) in formInline.discountSettings.options" :key="item.id">
|
||||
折扣设置：{{
|
||||
item.text }}</div>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 商品详情 -->
|
||||
<el-form-item label="商品详情" prop="detailUrl">
|
||||
<div>
|
||||
<myUploadImage v-model="formInline.detailUrl" :isShowSubscript="false"></myUploadImage>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 商品视频 -->
|
||||
<el-form-item label="商品视频" prop="videoUrl">
|
||||
<div>
|
||||
<myUploadVideo v-model="formInline.videoUrl"></myUploadVideo>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<el-button type="primary" @click="onSubmit" style="margin: 10px 0 0 80px;width: 150px;">确认新增</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="addGoods">
|
||||
import { ca } from "element-plus/es/locales.mjs";
|
||||
import { ref, reactive, nextTick, onMounted } from "vue";
|
||||
import myUploadImage from "@/components/myUploadImage.vue";
|
||||
import myUploadVideo from "@/components/myUploadVideo.vue";
|
||||
import { getGoodType, goodAdd, getActiveInfos } from "@/api/goods/info";
|
||||
import { getRegion } from "@/api/common";
|
||||
import { ElMessage } from "element-plus";
|
||||
import areaList from "./areaList";
|
||||
|
||||
const formRef = ref(null)
|
||||
const formInline = reactive({
|
||||
goodName: "",
|
||||
categoryId: "", //给后端的最后一级,
|
||||
categoryId1: "", //一级,
|
||||
categoryId2: "", //二级
|
||||
categoryId3: "", //三级
|
||||
goodUrl: "", //逗号分割的多个图片地址字符串
|
||||
goodCategorySelectType: 2, // 商品分类一级选项
|
||||
brandId: "", //品牌
|
||||
traceCode: "", //溯源码
|
||||
|
||||
specStyle: "1",//规格样式 1单规格 2多规格
|
||||
salePrice: 1,//销售价格-单规格
|
||||
stock: 1,//库存数量-单规格
|
||||
netContent: 1,//净含量-单规格
|
||||
unit: "kg",//净含量单位-单规格
|
||||
netWeight: [ //多规格集合
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodPrice: 1,
|
||||
goodStock: 1,
|
||||
netContent: 1,
|
||||
unit: "kg"
|
||||
}
|
||||
], //规格
|
||||
attribute: [
|
||||
{
|
||||
name: '', //属性
|
||||
value: '', //内容
|
||||
},
|
||||
],
|
||||
selectedAddress: [], //选中的省市区编码数组
|
||||
areaAddress: '', //区域地址
|
||||
detailAddress: "", //详细地址
|
||||
sendAddress: "",
|
||||
safeguard: {
|
||||
isSelected: 1, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 10, text: '该商品，支持【七天无理由退货】服务' },
|
||||
]
|
||||
}, //保障服务
|
||||
discountSettings: {
|
||||
isSelected: 0, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 11, text: '支持【满100减10元】优惠活动' },
|
||||
// { id: 13, text: '支持【满200减20元】优惠活动' },
|
||||
]
|
||||
}, //优惠设置
|
||||
discountRebate: {
|
||||
isSelected: 0, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 12, text: '支持【满两件-打8折】优惠活动' },
|
||||
// { id: 14, text: '支持【单件-打905折】优惠活动' },
|
||||
]
|
||||
}, //优惠折扣
|
||||
detailUrl: "",
|
||||
brandId: "",
|
||||
traceCode: "",
|
||||
videoUrl: "",
|
||||
});
|
||||
const rules = reactive({
|
||||
goodName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入商品名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
],
|
||||
categoryId1: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
categoryId2: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
categoryId3: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
goodUrl: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (value === "" || value.trim() === "") {
|
||||
callback(new Error('请至少上传一张商品图片'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
specStyle: [
|
||||
{ required: true, message: '请选择规格样式', trigger: 'change' }
|
||||
],
|
||||
salePrice: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入销售价格'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
stock: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入库存数量'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
netContent: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入净含量'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
netWeight: formInline.specStyle === '2' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 检查是否至少有一个属性
|
||||
if (!value || value.length === 0) {
|
||||
return callback(new Error('至少需要添加一个属性'))
|
||||
}
|
||||
|
||||
// 检查每个属性名称是否已填写
|
||||
const emptyNames = value.filter(item => !item.goodSpecs?.trim())
|
||||
if (emptyNames.length > 0) {
|
||||
return callback(new Error('请填写所有商品规格'))
|
||||
}
|
||||
|
||||
callback()
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
] : [],
|
||||
attribute: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 检查是否至少有一个属性
|
||||
if (!value || value.length === 0) {
|
||||
return callback(new Error('至少需要添加一个属性'))
|
||||
}
|
||||
|
||||
// 检查每个属性名称是否已填写
|
||||
const emptyNames = value.filter(item => !item.name?.trim())
|
||||
if (emptyNames.length > 0) {
|
||||
return callback(new Error('请填写所有属性名称和内容'))
|
||||
}
|
||||
|
||||
callback()
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
selectedAddress: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || value.length !== 3) {
|
||||
callback(new Error('请选择完整的省市区'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
detailAddress: [
|
||||
{ required: true, message: '请输入详细地址', trigger: 'blur' }
|
||||
],
|
||||
safeguard: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
console.log(value);
|
||||
if (value.isSelected !== 1) { // 如果值不是 1（未选中）
|
||||
callback(new Error('必须选择保障服务')); // 报错
|
||||
} else {
|
||||
callback(); // 校验通过
|
||||
}
|
||||
},
|
||||
trigger: 'change', // 触发时机
|
||||
},
|
||||
],
|
||||
});
|
||||
|
||||
const addSpecs = () => {
|
||||
formInline.netWeight.push({
|
||||
goodSpecs: "",
|
||||
goodPrice: 1.00,
|
||||
goodStock: 1,
|
||||
netContent: 1,
|
||||
unit: "kg"
|
||||
})
|
||||
}
|
||||
const deleteSpecs = (index) => {
|
||||
formInline.netWeight.splice(index, 1)
|
||||
}
|
||||
|
||||
const addAttr = () => {
|
||||
formInline.attribute.push({
|
||||
name: '',
|
||||
value: '',
|
||||
})
|
||||
}
|
||||
const deleteAttr = (index) => {
|
||||
formInline.attribute.splice(index, 1)
|
||||
}
|
||||
|
||||
// 选中的省市区编码数组（如：['云南省', '昆明市', '呈贡区']）
|
||||
const selectedAddress = ref([]);
|
||||
const detailAddress = ref('');
|
||||
// 级联选择器配置
|
||||
const cascaderProps = ref({
|
||||
label: 'areaName', // 选项标签字段名
|
||||
value: 'areaCode', // 选项值字段名
|
||||
children: 'areaChildVOS', // 子选项字段名
|
||||
emitPath: true,
|
||||
expandTrigger: 'hover',
|
||||
});
|
||||
// 省市区数据（示例）
|
||||
const addressOptions = ref([]);
|
||||
addressOptions.value = areaList.data;
|
||||
|
||||
// 保障服务
|
||||
const isSafeguardSelected = computed({
|
||||
get: () => formInline.safeguard.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.safeguard.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
// 优惠设置
|
||||
const isDiscountSettings = computed({
|
||||
get: () => formInline.discountSettings.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.discountSettings.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
// 优惠折扣
|
||||
const isDiscountRebate = computed({
|
||||
get: () => formInline.discountRebate.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.discountRebate.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
|
||||
// 文件上传前的校验
|
||||
// const beforeUpload = (file) => {
|
||||
// const isImage = ['image/jpeg', 'image/png', 'image/gif'].includes(file.type)
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
// if (!isImage) {
|
||||
// ElMessage.error('只能上传JPG/PNG/GIF格式的图片!')
|
||||
// return false
|
||||
// }
|
||||
// if (!isLt2M) {
|
||||
// ElMessage.error('图片大小不能超过2MB!')
|
||||
// return false
|
||||
// }
|
||||
// return true
|
||||
// }
|
||||
// 文件变化时触发验证
|
||||
// const handleChange = () => {
|
||||
// console.log('文件变化时触发验证')
|
||||
// nextTick(() => {
|
||||
// console.log(formInline.images)
|
||||
// formRef.value.validateField('images')
|
||||
// })
|
||||
// }
|
||||
// 移除文件时触发验证
|
||||
// const handleRemove = (file) => {
|
||||
// console.log('移除文件时触发验证')
|
||||
// console.log(file)
|
||||
// console.log(formInline.images)
|
||||
// formInline.images = formInline.images.filter(item => item.uid !== file.uid)
|
||||
// formRef.value.validateField('images')
|
||||
// }
|
||||
// 超出限制提示
|
||||
// const handleExceed = () => {
|
||||
// ElMessage.warning('最多只能上传5张图片!')
|
||||
// }
|
||||
|
||||
const categoryList1 = ref([]);
|
||||
const categoryList2 = ref([]);
|
||||
const categoryList3 = ref([]);
|
||||
|
||||
const getGoodTypeList = async () => {
|
||||
try {
|
||||
let response = await getGoodType();
|
||||
console.log(response);
|
||||
if (response.code == 200) {
|
||||
categoryList1.value = response.data;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
const changeCategory1 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId1 = id;
|
||||
formInline.categoryId2 = "";
|
||||
categoryList2.value = categoryList1.value.filter((item) => item.id == id)[0].children;
|
||||
formInline.categoryId3 = "";
|
||||
formInline.categoryId = "";
|
||||
categoryList3.value = [];
|
||||
if (id == 70) {
|
||||
// 选择产出品
|
||||
formInline.goodCategorySelectType = 1;
|
||||
} else {
|
||||
// 选择投入品
|
||||
formInline.goodCategorySelectType = 2;
|
||||
}
|
||||
};
|
||||
const changeCategory2 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId2 = id;
|
||||
categoryList3.value = categoryList2.value.filter((item) => item.id == id)[0].children;
|
||||
formInline.categoryId3 = "";
|
||||
formInline.categoryId = "";
|
||||
};
|
||||
const changeCategory3 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId3 = id;
|
||||
formInline.categoryId = id;
|
||||
};
|
||||
|
||||
const onSubmit = async () => {
|
||||
console.log(formInline);
|
||||
try {
|
||||
await formRef.value.validate()
|
||||
console.log('验证通过!', formRef.value)
|
||||
// 整理提交的参数
|
||||
let params = { ...formInline };
|
||||
if (formInline.specStyle == '1') {
|
||||
params.netWeight = [
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodPrice: formInline.salePrice,
|
||||
goodStock: formInline.stock,
|
||||
netContent: formInline.netContent,
|
||||
unit: formInline.unit
|
||||
}
|
||||
];
|
||||
} else {
|
||||
params.netWeight = formInline.netWeight
|
||||
}
|
||||
params.areaAddress = params.selectedAddress.join(',');
|
||||
|
||||
params.safeguardSelected = formInline.safeguard.isSelected; //保障服务
|
||||
params.discountSettingsSelected = formInline.discountSettings.isSelected; //优惠设置
|
||||
params.discountRebateSelected = formInline.discountRebate.isSelected; //优惠折扣
|
||||
|
||||
// 调用接口提交
|
||||
onGoodSave(params)
|
||||
} catch (error) {
|
||||
console.log('验证失败', error)
|
||||
}
|
||||
};
|
||||
|
||||
const onGoodSave = async (params) => {
|
||||
let response = await goodAdd(params);
|
||||
if (response.code === 200) {
|
||||
ElMessage.success("新增成功！");
|
||||
formRef.value.resetFields();
|
||||
} else {
|
||||
ElMessage.error(response.message);
|
||||
}
|
||||
}
|
||||
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
console.log(res);
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data.list;
|
||||
} else {
|
||||
ElMessage.error(res.message);
|
||||
}
|
||||
};
|
||||
const activeInfoList = ref([]);
|
||||
// 获取商品优惠信息配置项
|
||||
const getActiveInfo = async () => {
|
||||
const res = await getActiveInfos();
|
||||
console.log(res);
|
||||
if (res.code === 200) {
|
||||
activeInfoList.value = res.data;
|
||||
formInline.safeguard.options = [...activeInfoList.value.safeguard.options];
|
||||
formInline.discountSettings.options = [...activeInfoList.value.discountSettings.options];
|
||||
formInline.discountRebate.options = [...activeInfoList.value.discountRebate.options];
|
||||
} else {
|
||||
ElMessage.error(res.message);
|
||||
}
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
getActiveInfo();
|
||||
getGoodTypeList();
|
||||
getArea();
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
792
src/views/goods/goodsReview/areaList.js
Normal file
792
src/views/goods/goodsReview/areaList.js
Normal file
@ -0,0 +1,792 @@
|
||||
export default {
|
||||
"code": 200,
|
||||
"msg": null,
|
||||
"data": [
|
||||
{
|
||||
"id": "3",
|
||||
"areaName": "耿马傣族佤族自治县",
|
||||
"parentId": "530900",
|
||||
"areaCode": "530926",
|
||||
"level": 2,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "4",
|
||||
"areaName": "耿马镇",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926100",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "16",
|
||||
"areaName": "甘东社区",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261001",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "17",
|
||||
"areaName": "白马社区",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261002",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "18",
|
||||
"areaName": "白塔社区",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261003",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "19",
|
||||
"areaName": "团结村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261004",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "20",
|
||||
"areaName": "新城村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261005",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "21",
|
||||
"areaName": "芒蚌村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261006",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "22",
|
||||
"areaName": "芒国村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261007",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "23",
|
||||
"areaName": "复兴村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261008",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "24",
|
||||
"areaName": "允楞村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "5309261009",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "25",
|
||||
"areaName": "石灰窑村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "53092610010",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "26",
|
||||
"areaName": "南木弄村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "53092610011",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "27",
|
||||
"areaName": "允捧村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "53092610012",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "28",
|
||||
"areaName": "菜籽地村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "53092610013",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "29",
|
||||
"areaName": "弄巴村",
|
||||
"parentId": "530926100",
|
||||
"areaCode": "53092610014",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "5",
|
||||
"areaName": "勐永镇",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926101",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "30",
|
||||
"areaName": "勐永村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261011",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "31",
|
||||
"areaName": "新和村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261012",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "32",
|
||||
"areaName": "芒来村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261013",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "33",
|
||||
"areaName": "芒佑村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261014",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "34",
|
||||
"areaName": "芒糯村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261015",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "35",
|
||||
"areaName": "帮令村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261016",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "36",
|
||||
"areaName": "香竹林村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261017",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "37",
|
||||
"areaName": "光木林村",
|
||||
"parentId": "530926101",
|
||||
"areaCode": "5309261018",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "6",
|
||||
"areaName": "勐撒镇",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926102",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "38",
|
||||
"areaName": "丙令村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261021",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "39",
|
||||
"areaName": "芒茂村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261022",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "40",
|
||||
"areaName": "城子村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261023",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "41",
|
||||
"areaName": "芒枕村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261024",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "42",
|
||||
"areaName": "箐门口村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261025",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "43",
|
||||
"areaName": "班必村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261026",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "44",
|
||||
"areaName": "翁达村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261027",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "45",
|
||||
"areaName": "琅琊村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261028",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "46",
|
||||
"areaName": "户肯村",
|
||||
"parentId": "530926102",
|
||||
"areaCode": "5309261029",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "7",
|
||||
"areaName": "孟定镇",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926103",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "47",
|
||||
"areaName": "城关村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261031",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "48",
|
||||
"areaName": "下城村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261032",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "49",
|
||||
"areaName": "罕宏村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261033",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "50",
|
||||
"areaName": "贺海村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261034",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "51",
|
||||
"areaName": "遮哈村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261035",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "52",
|
||||
"areaName": "下坝村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261036",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "53",
|
||||
"areaName": "河西村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261037",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "54",
|
||||
"areaName": "新寨村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261038",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "55",
|
||||
"areaName": "景信村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261039",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "56",
|
||||
"areaName": "糯峨村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261040",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "57",
|
||||
"areaName": "芒美村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261041",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "58",
|
||||
"areaName": "邱山村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261042",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "59",
|
||||
"areaName": "德龙村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261043",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "60",
|
||||
"areaName": "芒撒村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261044",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "61",
|
||||
"areaName": "崇岗村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261045",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "62",
|
||||
"areaName": "芒艾村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261046",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "63",
|
||||
"areaName": "色树坝村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261047",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "64",
|
||||
"areaName": "尖坪村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261048",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "65",
|
||||
"areaName": "山头寨村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261049",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "66",
|
||||
"areaName": "班幸村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261050",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "67",
|
||||
"areaName": "清水河村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261051",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "68",
|
||||
"areaName": "尖山村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261052",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "69",
|
||||
"areaName": "大水井村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261053",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "70",
|
||||
"areaName": "和顺新村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261054",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "71",
|
||||
"areaName": "沙源新村",
|
||||
"parentId": "530926103",
|
||||
"areaCode": "5309261055",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "8",
|
||||
"areaName": "大兴乡",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926200",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "72",
|
||||
"areaName": "大兴村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262001",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "73",
|
||||
"areaName": "岩榴村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262002",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "74",
|
||||
"areaName": "永胜村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262003",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "75",
|
||||
"areaName": "户肯村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262004",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "76",
|
||||
"areaName": "龚家寨村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262005",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "77",
|
||||
"areaName": "班坝村",
|
||||
"parentId": "530926200",
|
||||
"areaCode": "5309262006",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "9",
|
||||
"areaName": "芒洪拉祜族布朗族乡",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926201",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "78",
|
||||
"areaName": "芒洪村",
|
||||
"parentId": "530926201",
|
||||
"areaCode": "5309262011",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "79",
|
||||
"areaName": "科且村",
|
||||
"parentId": "530926201",
|
||||
"areaCode": "5309262012",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "80",
|
||||
"areaName": "安雅村",
|
||||
"parentId": "530926201",
|
||||
"areaCode": "5309262013",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "81",
|
||||
"areaName": "新联村",
|
||||
"parentId": "530926201",
|
||||
"areaCode": "5309262014",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "82",
|
||||
"areaName": "马厂村",
|
||||
"parentId": "530926201",
|
||||
"areaCode": "5309262015",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "10",
|
||||
"areaName": "四排山乡",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926202",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "83",
|
||||
"areaName": "老寨村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262021",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "84",
|
||||
"areaName": "关弄村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262022",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "85",
|
||||
"areaName": "芒关村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262023",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "86",
|
||||
"areaName": "芒翁村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262024",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "87",
|
||||
"areaName": "梁子寨村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262025",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "88",
|
||||
"areaName": "石佛洞村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262026",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "89",
|
||||
"areaName": "东坡村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262027",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "90",
|
||||
"areaName": "班康村",
|
||||
"parentId": "530926202",
|
||||
"areaCode": "5309262028",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "11",
|
||||
"areaName": "贺派乡",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926203",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "91",
|
||||
"areaName": "贺派村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262031",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "92",
|
||||
"areaName": "芒抗村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262032",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "93",
|
||||
"areaName": "水平村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262033",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "94",
|
||||
"areaName": "落阳村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262034",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "95",
|
||||
"areaName": "崩弄村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262035",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "96",
|
||||
"areaName": "芒底村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262036",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "97",
|
||||
"areaName": "帮卖村",
|
||||
"parentId": "530926203",
|
||||
"areaCode": "5309262037",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "12",
|
||||
"areaName": "勐简乡",
|
||||
"parentId": "530926",
|
||||
"areaCode": "530926204",
|
||||
"level": 3,
|
||||
"areaChildVOS": [
|
||||
{
|
||||
"id": "98",
|
||||
"areaName": "勐简村",
|
||||
"parentId": "530926204",
|
||||
"areaCode": "5309262041",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "99",
|
||||
"areaName": "班望村",
|
||||
"parentId": "530926204",
|
||||
"areaCode": "5309262042",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "100",
|
||||
"areaName": "迎们寨村",
|
||||
"parentId": "530926204",
|
||||
"areaCode": "5309262043",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "101",
|
||||
"areaName": "大寨村",
|
||||
"parentId": "530926204",
|
||||
"areaCode": "5309262044",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
},
|
||||
{
|
||||
"id": "102",
|
||||
"areaName": "老厂村",
|
||||
"parentId": "530926204",
|
||||
"areaCode": "5309262045",
|
||||
"level": 4,
|
||||
"areaChildVOS": []
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
660
src/views/goods/goodsReview/auditGoods.vue
Normal file
660
src/views/goods/goodsReview/auditGoods.vue
Normal file
@ -0,0 +1,660 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="customer-box">
|
||||
<el-form ref="formRef" :disabled="true" :model="formInline" :rules="rules" class="demo-form-inline" :label-width="'auto'">
|
||||
<!-- 商品名称 -->
|
||||
<el-form-item label="商品名称" prop="goodName">
|
||||
<el-input v-model="formInline.goodName" clearable show-word-limit maxlength="30" placeholder="请输入商品名称"
|
||||
style="width: 800px" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 商品分类 -->
|
||||
<el-form-item label="商品分类" required>
|
||||
<div style="display: flex; gap: 16px;">
|
||||
<el-form-item prop="categoryId1">
|
||||
<el-select v-model="formInline.categoryId1" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory1($event)">
|
||||
<el-option v-for="item in categoryList1" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="categoryId2">
|
||||
<el-select v-model="formInline.categoryId2" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory2($event)">
|
||||
<el-option v-for="item in categoryList2" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item prop="categoryId3">
|
||||
<el-select v-model="formInline.categoryId3" placeholder="请选择" class="my-el-select"
|
||||
@change="changeCategory3($event)">
|
||||
<el-option v-for="item in categoryList3" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 公共品牌 -->
|
||||
<el-form-item label="公共品牌" prop="brandId" v-show="formInline.goodCategorySelectType == 1">
|
||||
<el-input v-model="formInline.brandId" clearable placeholder="请输入公共品牌" style="width: 800px" />
|
||||
</el-form-item>
|
||||
<!-- 溯源编码 -->
|
||||
<el-form-item label="溯源编码" prop="traceCode" v-show="formInline.goodCategorySelectType == 1">
|
||||
<el-input v-model="formInline.traceCode" clearable placeholder="请输入溯源编码" style="width: 800px" />
|
||||
</el-form-item>
|
||||
<!-- 商品图片 -->
|
||||
<el-form-item label="商品图片" prop="goodUrl" required>
|
||||
<div>
|
||||
<!-- <myUploadImage v-model="formInline.goodUrl"></myUploadImage> -->
|
||||
<img style="width: 200px;" :src="formInline.goodUrl" alt="">
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 规格样式 -->
|
||||
<el-form-item label="规格样式" prop="specStyle" required>
|
||||
<el-radio-group v-model="formInline.specStyle" style="margin-top: -3px;">
|
||||
<el-radio value="1" size="large">单规格</el-radio>
|
||||
<el-radio value="2" size="large">多规格</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div v-if="formInline.specStyle == 1">
|
||||
<!-- 销售价格 -->
|
||||
<el-form-item label="销售价格" prop="salePrice" required>
|
||||
<el-input-number v-model="formInline.salePrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
<span style="padding: 0 10px;">元</span>
|
||||
</el-form-item>
|
||||
|
||||
<!-- 库存数量 -->
|
||||
<el-form-item label="库存数量" prop="stock" required>
|
||||
<el-input-number v-model="formInline.stock" :min="1" :controls="false" />
|
||||
</el-form-item>
|
||||
|
||||
<!-- 净含量 -->
|
||||
<el-form-item label="净含量" prop="netContent" required>
|
||||
<el-input-number v-model="formInline.netContent" :min="1" :controls="false" />
|
||||
<el-select v-model="formInline.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="ml" value="ml" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<!-- 多规格 -->
|
||||
<div v-else>
|
||||
<el-form-item label="商品规格" prop="netWeight" required>
|
||||
<div v-for="(item, index) in formInline.netWeight" :key="index" class="attr-item">
|
||||
<el-input v-model="item.goodSpecs" :value="item.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
<el-icon size="20px" v-if="index !== 0" @click="deleteSpecs(index)" style="cursor: pointer;">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加属性</el-button>
|
||||
</el-form-item>
|
||||
<!-- 价格库存 -->
|
||||
<el-form-item label="价格库存" prop="netWeight" required>
|
||||
<div class="attr-box">
|
||||
<div class="attr-row">
|
||||
<div class="attr-clomn color-gray">商品规格</div>
|
||||
<div class="attr-clomn200 color-gray">销售价格</div>
|
||||
<div class="attr-clomn color-gray">库存数量</div>
|
||||
<div class="attr-clomn220 color-gray">净含量</div>
|
||||
</div>
|
||||
<div v-for="(item, index) in formInline.netWeight" :key="index" class="attr-row">
|
||||
<div class="attr-clomn">{{ item.goodSpecs }}</div>
|
||||
<div class="attr-clomn200 flex-left-top">
|
||||
<el-input-number v-model="item.goodPrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
<span style="padding: 0 10px;">元</span>
|
||||
</div>
|
||||
<div class="attr-clomn">
|
||||
<el-input-number v-model="item.goodStock" :min="1" :controls="false" />
|
||||
</div>
|
||||
<div class="attr-clomn220 flex-left-top">
|
||||
<el-input-number v-model="item.netContent" :min="1" :controls="false" />
|
||||
<el-select v-model="item.unit" style="width: 80px; margin-left: 10px">
|
||||
<el-option label="kg" value="kg" />
|
||||
<el-option label="g" value="g" />
|
||||
<el-option label="ml" value="ml" />
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 商品属性 -->
|
||||
<el-form-item label="商品属性" prop="attribute" required>
|
||||
<div v-for="(item, index) in formInline.attribute" :key="index" class="attr-item">
|
||||
<el-input v-model="item.name" :value="item.name" class="attr-input" placeholder="请输入属性名称" />
|
||||
<el-icon size="20px" v-if="index !== 0" @click="deleteAttr(index)" style="cursor: pointer;">
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加属性</el-button>
|
||||
</el-form-item>
|
||||
<!-- 属性内容 -->
|
||||
<el-form-item label="属性内容" prop="attribute" required>
|
||||
<div class="attr-box">
|
||||
<div class="attr-row">
|
||||
<div class="attr-input color-gray">属性名称</div>
|
||||
<div class="attr-input color-gray">属性内容</div>
|
||||
</div>
|
||||
<div v-for="(item, index) in formInline.attribute" :key="index" class="attr-row">
|
||||
<div class="attr-input">{{ item.name }}</div>
|
||||
<el-input v-model="item.value" class="attr-input" />
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 发货地址 -->
|
||||
<el-form-item label="发货地址" required>
|
||||
<div style="display: flex; gap: 16px;">
|
||||
<el-form-item prop="selectedAddress">
|
||||
<!-- 省市区级联选择器 -->
|
||||
<el-cascader v-model="formInline.selectedAddress" :options="addressOptions" :props="cascaderProps"
|
||||
placeholder="请选择省市区" clearable style="width: 300px;" />
|
||||
</el-form-item>
|
||||
<el-form-item prop="detailAddress">
|
||||
<!-- 详细地址输入框 -->
|
||||
<el-input v-model="formInline.detailAddress" placeholder="详细地址（如街道、门牌号等）" style="width: 220px;" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 保障服务 -->
|
||||
<el-form-item label="保障服务" prop="safeguard" required style="margin-bottom: 10px;">
|
||||
<el-checkbox v-model="isSafeguardSelected" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item, index) in formInline.safeguard.options" :key="index">服务承诺：{{
|
||||
item.text }}
|
||||
</div>
|
||||
</el-checkbox>
|
||||
</el-form-item>
|
||||
<!-- 优惠折扣 -->
|
||||
<el-form-item label="优惠折扣" style="margin-bottom: 10px;">
|
||||
<div style="width: 100%;">
|
||||
<el-checkbox v-model="isDiscountSettings" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item, index) in formInline.discountSettings.options" :key="index">
|
||||
优惠设置：{{
|
||||
item.text }}</div>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
<div style="width: 100%;">
|
||||
<el-checkbox v-model="isDiscountRebate" size="large" style="margin-top: -3px;">
|
||||
<div style="color: #333;" v-for="(item, index) in formInline.discountSettings.options" :key="index">
|
||||
折扣设置：{{
|
||||
item.text }}</div>
|
||||
</el-checkbox>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 商品详情 -->
|
||||
<el-form-item label="商品详情" prop="detailUrl">
|
||||
<div style="display:inherit">
|
||||
<!-- <myUploadImage v-model="formInline.detailUrl" :isShowSubscript="false"></myUploadImage> -->
|
||||
<img v-for="(item, index) in formInline.detailUrl.split(',')" :key="index" style="width: 100px;margin-right: 5px;" :src="item" alt="">
|
||||
</div>
|
||||
</el-form-item>
|
||||
<!-- 商品视频 -->
|
||||
<el-form-item label="商品视频" prop="videoUrl" v-if="formInline.videoUrl">
|
||||
<div>
|
||||
<!-- <myUploadVideo v-model="formInline.videoUrl"></myUploadVideo> -->
|
||||
<video :src="formInline.videoUrl" controls style="width: 300px;"></video>
|
||||
</div>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
<el-button type="primary" @click="approved(1)" style="margin: 10px 0 0 80px;width: 150px;">审核通过</el-button>
|
||||
<el-button type="danger" @click="approved(2)" style="margin: 10px 0 0 20px;width: 150px;">驳回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup name="editGoods">
|
||||
import { ca } from "element-plus/es/locales.mjs";
|
||||
import { ref, reactive, nextTick, onMounted, watch } from "vue";
|
||||
import myUploadImage from "@/components/myUploadImage.vue";
|
||||
import myUploadVideo from "@/components/myUploadVideo.vue";
|
||||
import { getGoodType, goodEdit, getGoodInfo, getActiveInfos,goodaudit } from "@/api/goods/info";
|
||||
import { getRegion } from "@/api/common";
|
||||
import { ElMessage } from "element-plus";
|
||||
import areaList from "./areaList";
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const formRef = ref(null)
|
||||
const formData = ref({});
|
||||
const formInline = reactive({
|
||||
goodName: "",
|
||||
categoryId: "", //给后端的最后一级,
|
||||
categoryId1: "", //一级,
|
||||
categoryId2: "", //二级
|
||||
categoryId3: "", //三级
|
||||
goodUrl: "", //逗号分割的多个图片地址字符串
|
||||
goodCategorySelectType: 2, // 商品分类一级选项
|
||||
brandId: "", //品牌
|
||||
traceCode: "", //溯源码
|
||||
|
||||
specStyle: "1",//规格样式 1单规格 2多规格
|
||||
salePrice: 1,//销售价格-单规格
|
||||
stock: 1,//库存数量-单规格
|
||||
netContent: 1,//净含量-单规格
|
||||
unit: "kg",//净含量单位-单规格
|
||||
netWeight: [ //多规格集合
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodPrice: 1,
|
||||
goodStock: 1,
|
||||
netContent: 1,
|
||||
unit: "kg"
|
||||
}
|
||||
], //规格
|
||||
attribute: [
|
||||
{
|
||||
name: '', //属性
|
||||
value: '', //内容
|
||||
},
|
||||
],
|
||||
selectedAddress: [], //选中的省市区编码数组
|
||||
areaAddress: '', //区域地址
|
||||
detailAddress: "", //详细地址
|
||||
sendAddress: "",
|
||||
safeguard: {
|
||||
isSelected: 1, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 10, text: '该商品，支持【七天无理由退货】服务' },
|
||||
]
|
||||
}, //保障服务
|
||||
discountSettings: {
|
||||
isSelected: 0, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 11, text: '支持【满100减10元】优惠活动' },
|
||||
// { id: 13, text: '支持【满200减20元】优惠活动' },
|
||||
]
|
||||
}, //优惠设置
|
||||
discountRebate: {
|
||||
isSelected: 0, //0未选中 1选中
|
||||
options: [
|
||||
// { id: 12, text: '支持【满两件-打8折】优惠活动' },
|
||||
// { id: 14, text: '支持【单件-打905折】优惠活动' },
|
||||
]
|
||||
}, //优惠折扣
|
||||
detailUrl: "",
|
||||
brandId: "",
|
||||
traceCode: "",
|
||||
videoUrl: "",
|
||||
});
|
||||
const rules = reactive({
|
||||
goodName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入商品名称',
|
||||
trigger: 'blur'
|
||||
},
|
||||
],
|
||||
categoryId1: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
categoryId2: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
categoryId3: [
|
||||
{
|
||||
required: true,
|
||||
message: '请选择',
|
||||
trigger: 'change',
|
||||
},
|
||||
],
|
||||
goodUrl: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (value === "" || value.trim() === "") {
|
||||
callback(new Error('请至少上传一张商品图片'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'change'
|
||||
}
|
||||
],
|
||||
specStyle: [
|
||||
{ required: true, message: '请选择规格样式', trigger: 'change' }
|
||||
],
|
||||
salePrice: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入销售价格'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
stock: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入库存数量'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
netContent: formInline.specStyle === '1' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || Number(value) <= 0) {
|
||||
callback(new Error('请输入净含量'))
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: ['blur', 'change']
|
||||
},
|
||||
] : [],
|
||||
netWeight: formInline.specStyle === '2' ? [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 检查是否至少有一个属性
|
||||
if (!value || value.length === 0) {
|
||||
return callback(new Error('至少需要添加一个属性'))
|
||||
}
|
||||
|
||||
// 检查每个属性名称是否已填写
|
||||
const emptyNames = value.filter(item => !item.goodSpecs?.trim())
|
||||
if (emptyNames.length > 0) {
|
||||
return callback(new Error('请填写所有商品规格'))
|
||||
}
|
||||
|
||||
callback()
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
] : [],
|
||||
attribute: [
|
||||
{
|
||||
validator: (rule, value, callback) => {
|
||||
// 检查是否至少有一个属性
|
||||
if (!value || value.length === 0) {
|
||||
return callback(new Error('至少需要添加一个属性'))
|
||||
}
|
||||
|
||||
// 检查每个属性名称是否已填写
|
||||
const emptyNames = value.filter(item => !item.name?.trim())
|
||||
if (emptyNames.length > 0) {
|
||||
return callback(new Error('请填写所有属性名称和内容'))
|
||||
}
|
||||
|
||||
callback()
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
selectedAddress: [
|
||||
{
|
||||
required: true,
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || value.length !== 3) {
|
||||
callback(new Error('请选择完整的省市区'));
|
||||
} else {
|
||||
callback();
|
||||
}
|
||||
},
|
||||
trigger: 'blur'
|
||||
}
|
||||
],
|
||||
detailAddress: [
|
||||
{ required: true, message: '请输入详细地址', trigger: 'blur' }
|
||||
],
|
||||
})
|
||||
const addSpecs = () => {
|
||||
formInline.netWeight.push({
|
||||
goodSpecs: "",
|
||||
goodPrice: 1.00,
|
||||
goodStock: 1,
|
||||
netContent: 1,
|
||||
unit: "kg"
|
||||
})
|
||||
}
|
||||
const deleteSpecs = (index) => {
|
||||
formInline.netWeight.splice(index, 1)
|
||||
}
|
||||
|
||||
const addAttr = () => {
|
||||
formInline.attribute.push({
|
||||
name: '',
|
||||
value: '',
|
||||
})
|
||||
}
|
||||
const deleteAttr = (index) => {
|
||||
formInline.attribute.splice(index, 1)
|
||||
}
|
||||
|
||||
// 选中的省市区编码数组（如：['云南省', '昆明市', '呈贡区']）
|
||||
const selectedAddress = ref([]);
|
||||
const detailAddress = ref('');
|
||||
// 级联选择器配置
|
||||
const cascaderProps = ref({
|
||||
label: 'areaName', // 选项标签字段名
|
||||
value: 'areaCode', // 选项值字段名
|
||||
children: 'areaChildVOS', // 子选项字段名
|
||||
emitPath: true,
|
||||
expandTrigger: 'hover',
|
||||
});
|
||||
// 省市区数据（示例）
|
||||
const addressOptions = ref([]);
|
||||
addressOptions.value = areaList.data;
|
||||
|
||||
// 保障服务
|
||||
const isSafeguardSelected = computed({
|
||||
get: () => formInline.safeguard.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.safeguard.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
// 优惠设置
|
||||
const isDiscountSettings = computed({
|
||||
get: () => formInline.discountSettings.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.discountSettings.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
// 优惠折扣
|
||||
const isDiscountRebate = computed({
|
||||
get: () => formInline.discountRebate.isSelected === 1,
|
||||
set: (val) => {
|
||||
formInline.discountRebate.isSelected = val ? 1 : 0
|
||||
}
|
||||
})
|
||||
|
||||
// 文件上传前的校验
|
||||
// const beforeUpload = (file) => {
|
||||
// const isImage = ['image/jpeg', 'image/png', 'image/gif'].includes(file.type)
|
||||
// const isLt2M = file.size / 1024 / 1024 < 2
|
||||
|
||||
// if (!isImage) {
|
||||
// ElMessage.error('只能上传JPG/PNG/GIF格式的图片!')
|
||||
// return false
|
||||
// }
|
||||
// if (!isLt2M) {
|
||||
// ElMessage.error('图片大小不能超过2MB!')
|
||||
// return false
|
||||
// }
|
||||
// return true
|
||||
// }
|
||||
// 文件变化时触发验证
|
||||
// const handleChange = () => {
|
||||
// console.log('文件变化时触发验证')
|
||||
// nextTick(() => {
|
||||
// console.log(formInline.images)
|
||||
// formRef.value.validateField('images')
|
||||
// })
|
||||
// }
|
||||
// 移除文件时触发验证
|
||||
// const handleRemove = (file) => {
|
||||
// console.log('移除文件时触发验证')
|
||||
// console.log(file)
|
||||
// console.log(formInline.images)
|
||||
// formInline.images = formInline.images.filter(item => item.uid !== file.uid)
|
||||
// formRef.value.validateField('images')
|
||||
// }
|
||||
// 超出限制提示
|
||||
// const handleExceed = () => {
|
||||
// ElMessage.warning('最多只能上传5张图片!')
|
||||
// }
|
||||
|
||||
const categoryList1 = ref([]);
|
||||
const categoryList2 = ref([]);
|
||||
const categoryList3 = ref([]);
|
||||
|
||||
const getGoodTypeList = async () => {
|
||||
try {
|
||||
let response = await getGoodType();
|
||||
console.log(response);
|
||||
if (response.code == 200) {
|
||||
categoryList1.value = response.data;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
const changeCategory1 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId1 = id;
|
||||
formInline.categoryId2 = "";
|
||||
categoryList2.value = categoryList1.value.filter((item) => item.id == id)[0].children;
|
||||
formInline.categoryId3 = "";
|
||||
formInline.categoryId = "";
|
||||
categoryList3.value = [];
|
||||
if (id == 70) {
|
||||
// 选择产出品70
|
||||
formInline.goodCategorySelectType = 1;
|
||||
} else {
|
||||
// 选择投入品88
|
||||
formInline.goodCategorySelectType = 2;
|
||||
}
|
||||
};
|
||||
const changeCategory2 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId2 = id;
|
||||
categoryList3.value = categoryList2.value.filter((item) => item.id == id)[0].children;
|
||||
formInline.categoryId3 = "";
|
||||
formInline.categoryId = "";
|
||||
};
|
||||
const changeCategory3 = (id) => {
|
||||
console.log(id);
|
||||
formInline.categoryId3 = id;
|
||||
formInline.categoryId = id;
|
||||
};
|
||||
|
||||
//审核/驳回
|
||||
const approved = async (index) => {
|
||||
console.log('formInline',formInline);
|
||||
let res = await goodaudit({ id: formInline.id, examineStatus: index });
|
||||
let text = index == 1 ? "已审核" : "已驳回";
|
||||
if (res.code == 200) {
|
||||
ElMessage.success(`${text}`);
|
||||
//返回上一个页面
|
||||
router.go(-1);
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
}
|
||||
};
|
||||
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data.list;
|
||||
}
|
||||
};
|
||||
const activeInfoList = ref([]);
|
||||
// 获取商品优惠信息配置项
|
||||
const getActiveInfo = async () => {
|
||||
const res = await getActiveInfos();
|
||||
if (res.code === 200) {
|
||||
activeInfoList.value = res.data;
|
||||
} else {
|
||||
ElMessage.error(res.message);
|
||||
}
|
||||
};
|
||||
const getGoodsInfo = async (goodId) => {
|
||||
const res = await getGoodInfo(goodId);
|
||||
if (res.code == 200) {
|
||||
Object.assign(formData.value, res.data);
|
||||
Object.assign(formInline, res.data);
|
||||
|
||||
|
||||
if (res.data.netWeight.length > 1) {
|
||||
formInline.specStyle = '2';
|
||||
} else {
|
||||
formInline.specStyle = '1';
|
||||
console.log(res.data.netWeight[0]);
|
||||
formInline.salePrice = formData.value.netWeight[0]?.goodPrice ?? 1;
|
||||
formInline.stock = formData.value.netWeight[0]?.goodStock ?? 1;
|
||||
formInline.netContent = formData.value.netWeight[0]?.netContent ?? 1;
|
||||
formInline.unit = formData.value.netWeight[0]?.unit ?? "kg";
|
||||
}
|
||||
|
||||
formInline.categoryId1 = formData.value?.categoryId1 ?? "88"
|
||||
formInline.categoryId2 = formData.value?.categoryId2 ?? "";
|
||||
formInline.categoryId3 = formData.value?.categoryId3 ?? "";
|
||||
|
||||
formInline.netWeight = formData.value?.netWeight ?? [
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodPrice: 1,
|
||||
goodStock: 1,
|
||||
netContent: 1,
|
||||
unit: "kg"
|
||||
}
|
||||
];
|
||||
formInline.attribute = formData.value?.attribute ?? [{
|
||||
name: '', //属性
|
||||
value: '', //内容
|
||||
}];
|
||||
|
||||
formInline.selectedAddress = formData.value?.areaAddress?.split(",") ?? [];
|
||||
|
||||
formInline.goodUrl = formData.value?.goodUrl?.split(",").slice(0, 5).join(',') ?? "";
|
||||
formInline.detailUrl = formData.value?.detailUrl?.split(",").slice(0, 5).join(',') ?? "";
|
||||
formInline.videoUrl = formData.value?.videoUrl?.split(",").slice(0, 1).join(',') ?? "";
|
||||
|
||||
formInline.safeguard = { isSelected: formData.value?.safeguard?.isSelected ?? 1, options:[...activeInfoList.value.safeguard.options] }
|
||||
formInline.discountSettings = { isSelected: formData.value?.discountSettings?.isSelected ?? 0, options:[...activeInfoList.value.discountSettings.options] }
|
||||
formInline.discountRebate = { isSelected: formData.value?.discountRebate?.isSelected ?? 0, options:[...activeInfoList.value.discountRebate.options] }
|
||||
if (formInline.categoryId1) {
|
||||
categoryList2.value = categoryList1.value.filter((item) => item.id == formInline.categoryId1)[0].children;
|
||||
if (formInline.categoryId2) {
|
||||
let item = categoryList2.value.filter(item => item.id === formInline.categoryId2);
|
||||
categoryList3.value = item[0].children;
|
||||
}
|
||||
}
|
||||
|
||||
// console.log(formInline);
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
}
|
||||
};
|
||||
|
||||
watch(() => route.query, (newVal) => {
|
||||
console.log("watch商品id:", newVal.goodId);
|
||||
if (newVal.goodId) {
|
||||
getGoodsInfo(newVal.goodId);
|
||||
}
|
||||
})
|
||||
onMounted(async () => {
|
||||
const { edit, goodId } = route.query;
|
||||
console.log("onMounted商品id:", goodId);
|
||||
getActiveInfo();
|
||||
await getGoodTypeList();
|
||||
getArea();
|
||||
if (goodId) {
|
||||
getGoodsInfo(goodId);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
478
src/views/goods/goodsReview/index.vue
Normal file
478
src/views/goods/goodsReview/index.vue
Normal file
@ -0,0 +1,478 @@
|
||||
<template>
|
||||
<div class="app-container customer-control">
|
||||
<div class="container-custom">
|
||||
<!-- 搜索栏 -->
|
||||
<div ref="searchBarRef" class="search-box">
|
||||
<div class="search-bar">
|
||||
<div class="search-bar-left">
|
||||
<!-- <div class="order-tab" style="margin-top: -10px">
|
||||
<el-tabs v-model="activeCurrent" @tab-click="tabChange">
|
||||
<el-tab-pane
|
||||
v-for="t in bottomList"
|
||||
:key="t.id"
|
||||
:label="t.title + t.value"
|
||||
:name="t.id"
|
||||
>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div> -->
|
||||
<el-form
|
||||
ref="searchForm"
|
||||
:inline="true"
|
||||
:model="formInline"
|
||||
class="demo-form-inline"
|
||||
:label-width="'auto'"
|
||||
>
|
||||
<el-form-item label="商品名称" prop="goodName">
|
||||
<el-input
|
||||
v-model="formInline.goodName"
|
||||
placeholder="请输入商品名称"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="商品分类"
|
||||
prop="goodCategoryId"
|
||||
class="custom-form-inline"
|
||||
>
|
||||
<!-- <el-select v-model="formInline.goodCategoryId" placeholder="请选择" clearable>
|
||||
<el-option v-for="item in goodsCategoryList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select> -->
|
||||
<el-cascader
|
||||
v-model="formInline.goodCategoryId"
|
||||
:options="goodsOptions"
|
||||
:props="cascaderProps"
|
||||
placeholder="请选择省市区"
|
||||
clearable
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="商品品牌" prop="storeId">
|
||||
<el-select v-model="formInline.storeId" placeholder="请选择" clearable>
|
||||
<el-option v-for="item in goodsBrandList" :key="item.id" :value="item.id" :label="item.name" />
|
||||
</el-select>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button type="primary" class="el-button-gry" icon="Search" @click="onSubmit"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="Refresh"
|
||||
style="margin: 16px 0 0 0"
|
||||
@click="resetForm"
|
||||
>重置</el-button
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 表格 -->
|
||||
<div class="table-cont" :style="{ height: tableViewportHeight + 'px' }">
|
||||
<!-- <div class="table-toolbar">
|
||||
<el-button
|
||||
icon="delete"
|
||||
@click="batchDelete"
|
||||
:disabled="btnStatus"
|
||||
style="margin-right: 10px"
|
||||
>批量删除</el-button
|
||||
>
|
||||
<router-link to="/goods/goodsManage/addGoods">
|
||||
<el-button type="primary" class="el-button-gry" icon="plus" @click="onSubmit"
|
||||
>新增商品</el-button
|
||||
>
|
||||
</router-link>
|
||||
</div> -->
|
||||
<tableComponent
|
||||
:table-data="tableData"
|
||||
:columns="columns"
|
||||
:show-border="false"
|
||||
:show-selection="true"
|
||||
:header-cell-class-name="getHeaderClass"
|
||||
@page-change="handlePaginationChange"
|
||||
:loading="tableLoading"
|
||||
@selection-change="handleSelectionChange"
|
||||
:total="tableTotal"
|
||||
:current-page="formInline.current"
|
||||
:page-size="formInline.size"
|
||||
:showSort="true"
|
||||
:rowkey="'goodId'"
|
||||
>
|
||||
<!-- 自定义-图片 -->
|
||||
<template #goodUrl="slotProps">
|
||||
<div class="table-cell-img-box">
|
||||
<img :src="slotProps.row.goodUrl" class="table-cell-img" alt="" />
|
||||
</div>
|
||||
</template>
|
||||
<!-- 自定义 - 序号 -->
|
||||
<template #sort="slotProps">
|
||||
<span v-if="slotProps.row.goodPrice"
|
||||
>￥{{ slotProps.row.goodPrice }}</span
|
||||
>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-状态 -->
|
||||
<template #examineStatus="slotProps">
|
||||
<span v-if="slotProps.row.examineStatus == 0" class="color-red"
|
||||
>待审核</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.examineStatus == 1" class="color-green"
|
||||
>审核成功</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.examineStatus == 2" class="color-orange"
|
||||
>驳回</span
|
||||
>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button
|
||||
v-if="slotProps.row.examineStatus != 1"
|
||||
text
|
||||
class="el-button-custom"
|
||||
@click="handleAudit(slotProps.row)"
|
||||
>审核</el-button
|
||||
>
|
||||
<el-button
|
||||
text
|
||||
class="el-button-delete"
|
||||
@click="handleDelete(slotProps.row)"
|
||||
>删除</el-button
|
||||
>
|
||||
</template>
|
||||
</tableComponent>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import {
|
||||
getGoodManageInfo,
|
||||
getGoodType,
|
||||
goodDelete,
|
||||
getGoodManageCount,
|
||||
goodUpAndDown,
|
||||
} from "@/api/goods/info";
|
||||
import { id } from "element-plus/es/locales.mjs";
|
||||
import { ElMessage } from "element-plus";
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance();
|
||||
|
||||
const formInline = reactive({
|
||||
goodName: "",
|
||||
goodCategoryId: [],
|
||||
storeId: "",
|
||||
// type: "1",
|
||||
current: 1,
|
||||
size: 10,
|
||||
});
|
||||
const goodsCategoryList = ref([
|
||||
{ name: "蔬菜", id: 1 },
|
||||
{ name: "肥料", id: 2 },
|
||||
{ name: "农药", id: 3 },
|
||||
]);
|
||||
const goodsBrandList = ref([
|
||||
{ name: "品牌1", id: 1 },
|
||||
{ name: "品牌2", id: 2 },
|
||||
{ name: "品牌3", id: 3 },
|
||||
]);
|
||||
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
console.log("submit!");
|
||||
formInline.current = 1;
|
||||
console.log(formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
searchForm.value.resetFields();
|
||||
loadData();
|
||||
};
|
||||
|
||||
let activeCurrent = ref("1");
|
||||
let bottomList = reactive([
|
||||
{ title: "全部", id: "1", value: "" },
|
||||
{ title: "已上架", id: "2", value: "" },
|
||||
{ title: "已下架", id: "3", value: "" },
|
||||
]);
|
||||
const tabChange = (Event) => {
|
||||
console.log(Event.index);
|
||||
if (Event.index == "0") {
|
||||
// 请求全部
|
||||
formInline.type = "1";
|
||||
} else if (Event.index == "1") {
|
||||
// 请求已上架
|
||||
formInline.type = "2";
|
||||
} else if (Event.index == "2") {
|
||||
// 请求已下架
|
||||
formInline.type = "3";
|
||||
}
|
||||
loadData();
|
||||
};
|
||||
|
||||
// 表格数据
|
||||
const tableData = ref([]);
|
||||
const selectedIds = ref([]);
|
||||
const btnStatus = computed(() => {
|
||||
return selectedIds.value.length <= 0;
|
||||
});
|
||||
const tableLoading = ref(false);
|
||||
const tableTotal = ref(0);
|
||||
let nowClickRow = ref({});
|
||||
// 列配置
|
||||
const columns = ref([]);
|
||||
const columns1 = ref([
|
||||
{ prop: "goodId", label: "ID", width: "150" },
|
||||
{ prop: "goodUrl", label: "商品图片", slotName: "goodUrl" },
|
||||
{ prop: "goodName", label: "商品名称", width: "120" },
|
||||
{ prop: "categoryName", label: "分类名称" },
|
||||
{ prop: "goodPrice", label: "商品售价" },
|
||||
{ prop: "salesVolume", label: "销量" },
|
||||
{ prop: "pageView", label: "浏览量" },
|
||||
{ prop: "stock", label: "库存" },
|
||||
{ prop: "examineStatus", label: "状态", slotName: "examineStatus" },
|
||||
{
|
||||
prop: "action",
|
||||
label: "操作",
|
||||
slotName: "action",
|
||||
fixed: "right",
|
||||
width: "150",
|
||||
},
|
||||
]);
|
||||
|
||||
// 生成食物主题昵称
|
||||
const generateFoodNickname = () => {
|
||||
// 食物名词（仅限食物）
|
||||
const foods = [
|
||||
"辣椒",
|
||||
"西瓜",
|
||||
"土豆",
|
||||
"番茄",
|
||||
"黄瓜",
|
||||
"苹果",
|
||||
"蛋糕",
|
||||
"面包",
|
||||
"披萨",
|
||||
"冰淇淋",
|
||||
"奶茶",
|
||||
"咖啡",
|
||||
"啤酒",
|
||||
"炸鸡",
|
||||
];
|
||||
|
||||
// 随机组合：形容词 + 食物
|
||||
return Mock.mock(`@pick(${foods})`);
|
||||
};
|
||||
// 生成模拟数据
|
||||
const generateMockData = () => {
|
||||
return Mock.mock({
|
||||
"list|10": [
|
||||
{
|
||||
"id|+1": 10000,
|
||||
"goodId|+1": 10000,
|
||||
"sort|+1": 1,
|
||||
goodUrl: " @image", //商品图片
|
||||
goodName: () => generateFoodNickname(), //商品名称
|
||||
categoryName: '@pick(["蔬菜", "肥料", "农药"])', //分类名称
|
||||
goodPrice: "@float(10, 200, 2, 2)", //商品售价
|
||||
salesVolume: "@integer(1000, 20000)", //销量
|
||||
pageView: Mock.mock("@id").toString().slice(0, 6), //浏览量
|
||||
stock: "@integer(5000, 90000)", //库存
|
||||
examineStatus: "@pick([0, 1, 2, 3, 4])", //状态
|
||||
ordersNums: "@integer(10, 200)",
|
||||
},
|
||||
],
|
||||
}).list;
|
||||
};
|
||||
// 加载数据
|
||||
const loadData = async () => {
|
||||
tableLoading.value = true;
|
||||
// 测试
|
||||
// tableData.value = generateMockData();
|
||||
// tableTotal.value = tableData.value.length;
|
||||
// console.log(tableData.value);
|
||||
|
||||
let prams = { ...formInline };
|
||||
prams.goodCategoryId =
|
||||
formInline.goodCategoryId[prams.goodCategoryId.length - 1];
|
||||
|
||||
try {
|
||||
let response = await getGoodManageInfo(prams);
|
||||
console.log(response);
|
||||
if (response.code == 200) {
|
||||
tableData.value = response.data.records;
|
||||
tableTotal.value = response.data.total;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
tableLoading.value = false;
|
||||
};
|
||||
|
||||
// 自定义表头类名,也可以在columns指定列中添加headerClassName: 'custom-header'
|
||||
const getHeaderClass = ({ column }) => {
|
||||
return "custom-header";
|
||||
};
|
||||
// 分页变化
|
||||
const handlePaginationChange = ({ page, pageSize }) => {
|
||||
console.log("分页变化:", page, pageSize);
|
||||
formInline.current = page;
|
||||
formInline.size = pageSize;
|
||||
// 这里可以调用API获取新数据
|
||||
loadData();
|
||||
};
|
||||
// 多选框变化
|
||||
const handleSelectionChange = (selection, ids) => {
|
||||
console.log("选中项:", selection, ids);
|
||||
selectedIds.value = ids;
|
||||
};
|
||||
|
||||
// 查看详情
|
||||
const seeDetails = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要查看详情的行:", row);
|
||||
};
|
||||
const toUpload = async (row) => {
|
||||
console.log("上架:", row);
|
||||
goodsUpAndDown(row.goodId, 2);
|
||||
};
|
||||
const toDownload = (row) => {
|
||||
console.log("下架:", row);
|
||||
goodsUpAndDown(row.goodId, 3);
|
||||
};
|
||||
const goodsUpAndDown = async (id, examineStatus) => {
|
||||
// 2->上架，3->下架
|
||||
let res = await goodUpAndDown({ id: id, examineStatus: examineStatus });
|
||||
let text = examineStatus == 2 ? "上架" : "下架";
|
||||
if (res.code == 200) {
|
||||
ElMessage.success(`${text}成功`);
|
||||
loadData();
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
}
|
||||
};
|
||||
// 编辑操作
|
||||
const handleAudit = (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要编辑的行:", row);
|
||||
// 跳转路由并携带参数，行数据，和query的值edit
|
||||
router.push({
|
||||
path: "/goods/goodsReview/auditGoods",
|
||||
query: { goodId: row.goodId },
|
||||
});
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = async (row) => {
|
||||
deleteGoods(row.goodId)
|
||||
};
|
||||
// 批量删除
|
||||
const batchDelete = async () => {
|
||||
console.log("要删除的行:", selectedIds.value);
|
||||
deleteGoods(selectedIds.value.join(","))
|
||||
};
|
||||
const deleteGoods = async (param) => {
|
||||
try {
|
||||
tableLoading.value = true;
|
||||
let res = await goodDelete(param);
|
||||
tableLoading.value = false;
|
||||
if (res.code == 200) {
|
||||
ElMessage.success("删除成功");
|
||||
loadData();
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
}
|
||||
} catch (error) {
|
||||
tableLoading.value = false;
|
||||
}
|
||||
};
|
||||
|
||||
// 级联选择器配置
|
||||
const cascaderProps = ref({
|
||||
label: "name", // 选项标签字段名
|
||||
value: "id", // 选项值字段名
|
||||
children: "children", // 子选项字段名
|
||||
emitPath: true,
|
||||
expandTrigger: "hover",
|
||||
});
|
||||
const goodsOptions = ref([]);
|
||||
const getGoodTypeList = async () => {
|
||||
try {
|
||||
let response = await getGoodType();
|
||||
console.log(response);
|
||||
if (response.code == 200) {
|
||||
goodsOptions.value = response.data;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
const getGoodsManageCount = async () => {
|
||||
try {
|
||||
let response = await getGoodManageCount();
|
||||
if (response.code == 200) {
|
||||
bottomList[0].value = `(${response.data?.allGoodCount ?? ""})`;
|
||||
bottomList[1].value = `(${response.data?.alreadyListedCount ?? ""})`;
|
||||
bottomList[2].value = `(${response.data?.removedCount ?? ""})`;
|
||||
}
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
};
|
||||
|
||||
const titleRef = ref(null);
|
||||
const searchBarRef = ref(null);
|
||||
const tableViewportHeight = ref(0);
|
||||
// 精确计算可用高度
|
||||
const calculateTableHeight = () => {
|
||||
// 获取窗口总高度
|
||||
const windowHeight = window.innerHeight;
|
||||
|
||||
// 获取各组件高度
|
||||
const headerHeight = titleRef.value?.$el?.offsetHeight || 0;
|
||||
const searchBarHeight = searchBarRef.value?.offsetHeight || 0;
|
||||
|
||||
// 计算容器内边距补偿（根据实际样式调整）
|
||||
const paddingCompensation = 130;
|
||||
|
||||
// 最终计算
|
||||
tableViewportHeight.value =
|
||||
windowHeight - headerHeight - searchBarHeight - paddingCompensation;
|
||||
// console.log(tableViewportHeight.value);
|
||||
};
|
||||
// 组件挂载时加载数据
|
||||
onMounted(() => {
|
||||
columns.value = columns1.value;
|
||||
loadData();
|
||||
getGoodTypeList();
|
||||
// getGoodsManageCount();
|
||||
|
||||
calculateTableHeight();
|
||||
|
||||
// 添加响应式监听
|
||||
window.addEventListener("resize", calculateTableHeight);
|
||||
|
||||
// 监听DOM变化（适用于动态变化的header/searchbar）
|
||||
const observer = new ResizeObserver(calculateTableHeight);
|
||||
if (titleRef.value?.$el) observer.observe(titleRef.value.$el);
|
||||
if (searchBarRef.value) observer.observe(searchBarRef.value);
|
||||
});
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener("resize", calculateTableHeight);
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.table-toolbar {
|
||||
width: 300px;
|
||||
height: 50px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
padding: 14px 16px 0 0;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user