商品中心功能模块开发及对接后台,客户管理添加日期查询条件
This commit is contained in:
parent
c7ecaa82fc
commit
cb230172da
@ -5,5 +5,5 @@ VITE_APP_TITLE = 运营云后台管理系统
|
||||
VITE_APP_ENV = 'development'
|
||||
|
||||
# 开发环境
|
||||
VITE_APP_BASE_API = 'http://192.168.18.99:8080/'
|
||||
VITE_APP_BASE_API = 'http://192.168.18.99:8080'
|
||||
VITE_APP_PLATFORM = 'http://localhost:9000/platform'
|
@ -3,7 +3,7 @@ import request from '@/utils/request'
|
||||
//云南省所有区域信息
|
||||
export function getRegion(code) {
|
||||
let codeVal = code ? code : '530000';
|
||||
return request('/apis/system/area/region?areaCode=' + codeVal, {
|
||||
return request('/goods/goodInfoManage/goodArea?areaCode=' + codeVal, {
|
||||
method: 'GET',
|
||||
});
|
||||
}
|
||||
|
@ -118,8 +118,8 @@ export function categoryRemove(data) {
|
||||
// 启用或禁用商品分类
|
||||
export function enableAndDisableCategory(data) {
|
||||
return request({
|
||||
url: "/goods/business/category/add",
|
||||
method: "post",
|
||||
url: "/goods/business/category/enable",
|
||||
method: "put",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
|
@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div class="component-upload-image">
|
||||
<div class="upload-tip">图片比例1:1,建议尺寸为800 * 800px,支持png、jpg、gif等格式,大小2MB以内</div>
|
||||
<div class="upload-tip">图片比例1:1,建议尺寸为800 * 800px,支持png、jpg、gif等格式,大小 {{ fileSize }} MB以内</div>
|
||||
<el-upload multiple :disabled="disabled" :action="uploadImgUrl" list-type="picture-card"
|
||||
:on-success="handleUploadSuccess" :before-upload="handleBeforeUpload" :data="data" :limit="limit"
|
||||
:on-error="handleUploadError" :on-exceed="handleExceed" ref="imageUpload" :before-remove="handleDelete"
|
||||
@ -80,7 +80,7 @@ const props = defineProps({
|
||||
// 大小限制(MB)
|
||||
fileSize: {
|
||||
type: Number,
|
||||
default: 5
|
||||
default: 2
|
||||
},
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: {
|
||||
|
@ -93,6 +93,12 @@ export const constantRoutes = [
|
||||
name: 'editGoods',
|
||||
meta: { title: '编辑商品', icon: '' }
|
||||
},
|
||||
{
|
||||
path: 'goodsManage/seeDetails/:activeTab?',
|
||||
component: () => import('@/views/goods/goodsManage/seeDetails'),
|
||||
name: 'seeDetails',
|
||||
meta: { title: '商品详情', icon: '' }
|
||||
},
|
||||
{
|
||||
path: '/goods/goodsReview/auditGoods/:activeTab?',
|
||||
component: () => import('@/views/goods/goodsReview/auditGoods'),
|
||||
|
32
src/store/modules/operate.js
Normal file
32
src/store/modules/operate.js
Normal file
@ -0,0 +1,32 @@
|
||||
const useOperateStore = defineStore("operate", {
|
||||
state: () => ({
|
||||
goodId: sessionStorage.getItem('operate_goodId') || "",
|
||||
status: Number(sessionStorage.getItem('operate_status')) || 1, // 1编辑商品 2查看商品
|
||||
}),
|
||||
actions: {
|
||||
// 获取商品信息
|
||||
getGoodSInfo() {
|
||||
return {
|
||||
goodId: this.goodId,
|
||||
status: this.status,
|
||||
};
|
||||
},
|
||||
// 设置商品信息
|
||||
setGoodInfo(info) {
|
||||
this.goodId = info?.goodId ? info?.goodId : "";
|
||||
this.status = info?.status ? info?.status : 1;
|
||||
// 手动保存到sessionStorage
|
||||
sessionStorage.setItem('operate_goodId', this.goodId);
|
||||
sessionStorage.setItem('operate_status', String(this.status));
|
||||
},
|
||||
// 初始化商品信息
|
||||
initGoodInfo() {
|
||||
this.goodId = "";
|
||||
this.status = 1;
|
||||
sessionStorage.removeItem('operate_goodId');
|
||||
sessionStorage.removeItem('operate_status');
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export default useOperateStore;
|
@ -114,6 +114,7 @@ import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import { id } from "element-plus/es/locales.mjs";
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const formInline = reactive({
|
||||
id: "",
|
||||
@ -150,7 +151,15 @@ const disableEndDate = (time) => {
|
||||
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
console.log("submit!");
|
||||
formInline.current = 1;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期!");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
loadData();
|
||||
};
|
||||
|
@ -98,6 +98,7 @@
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const iconSize = "16px";
|
||||
|
||||
@ -135,7 +136,15 @@ const disableEndDate = (time) => {
|
||||
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
console.log("submit!");
|
||||
formInline.current = 1;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期!");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
loadData();
|
||||
};
|
||||
|
@ -82,6 +82,7 @@ import Mock from "mockjs";
|
||||
import { getViolateGoodPage, violateGoodSave, violateGoodEdit, deleteContraband } from "@/api/goods/info";
|
||||
import { ca } from "element-plus/es/locales.mjs";
|
||||
const { proxy } = getCurrentInstance()
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const formInline = reactive({
|
||||
violateGoodName: "",
|
||||
@ -108,6 +109,14 @@ const disableEndDate = (time) => {
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期!");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
return;
|
||||
}
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
@ -184,28 +193,25 @@ const handleEdit = (row) => {
|
||||
nowClickRow.value = row;
|
||||
dialogTitle.value = "编辑违禁物品";
|
||||
dialogFormVisible.value = true;
|
||||
console.log("要编辑的行:", row);
|
||||
dialogForm.id = row.id;
|
||||
dialogForm.violateGoodName = row.violateGoodName;
|
||||
dialogForm.goodParameter = row.goodParameter;
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = (row) => {
|
||||
console.log("要删除的行:", row);
|
||||
onDelete(row.id)
|
||||
};
|
||||
// 批量删除
|
||||
const batchDelete = () => {
|
||||
console.log("要删除的行:", selectedIds.value);
|
||||
onDelete(selectedIds.value.join(","))
|
||||
};
|
||||
const onDelete = async (param) => {
|
||||
const onDelete = async (ids) => {
|
||||
try {
|
||||
tableLoading.value = true;
|
||||
let res = await deleteContraband(param);
|
||||
let res = await deleteContraband( ids );
|
||||
tableLoading.value = false;
|
||||
if (res.code == 200) {
|
||||
onsubmit();
|
||||
onSubmit();
|
||||
ElMessage.success("删除成功");
|
||||
} else {
|
||||
ElMessage.error(res.msg);
|
||||
@ -242,7 +248,6 @@ const cascaderProps = ref({
|
||||
expandTrigger: "hover",
|
||||
});
|
||||
const onSaveCategory = () => {
|
||||
console.log(dialogForm);
|
||||
dialogRef.value.validate(async (valid, fields) => {
|
||||
if (valid) {
|
||||
try {
|
||||
|
@ -106,6 +106,7 @@ import {
|
||||
} from "@/api/goods/info";
|
||||
import { ca } from "element-plus/es/locales.mjs";
|
||||
const { proxy } = getCurrentInstance();
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
const formInline = reactive({
|
||||
name: "",
|
||||
@ -138,6 +139,15 @@ const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
formInline.status = formInline.status == undefined ? "" : formInline.status;
|
||||
if (formInline.startDate && !formInline.endDate) {
|
||||
ElMessage.warning("请选择结束日期!");
|
||||
return;
|
||||
}
|
||||
if (formInline.endDate && !formInline.startDate) {
|
||||
ElMessage.warning("请选择开始日期!");
|
||||
return;
|
||||
}
|
||||
console.log( formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
@ -246,7 +256,11 @@ const enableAndDisable = async (row, num) => {
|
||||
tableLoading.value = false;
|
||||
if (res.code == 200) {
|
||||
onSubmit();
|
||||
ElMessage.success(res.message);
|
||||
if (num == 1) {
|
||||
ElMessage.success("启用成功!");
|
||||
} else {
|
||||
ElMessage.success("禁用成功!");
|
||||
}
|
||||
} else {
|
||||
ElMessage.error(res.message);
|
||||
}
|
||||
|
@ -53,6 +53,9 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div v-if="formInline.specStyle == '1'">
|
||||
<el-form-item label="规格名称" prop="goodSpecs" required>
|
||||
<el-input v-model="formInline.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
</el-form-item>
|
||||
<!-- 销售价格 -->
|
||||
<el-form-item label="销售价格" prop="salePrice" required>
|
||||
<el-input-number v-model="formInline.salePrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
@ -70,7 +73,12 @@
|
||||
<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="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@ -108,8 +116,12 @@
|
||||
<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="L" />
|
||||
<el-option label="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</el-select>
|
||||
</div>
|
||||
</div>
|
||||
@ -126,7 +138,7 @@
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加属性</el-button>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addAttr">添加规格</el-button>
|
||||
</el-form-item>
|
||||
<!-- 属性内容 -->
|
||||
<el-form-item label="属性内容" prop="attribute" required>
|
||||
@ -147,7 +159,7 @@
|
||||
<el-form-item prop="selectedAddress">
|
||||
<!-- 区域级联选择器 -->
|
||||
<el-cascader v-model="formInline.selectedAddress" :options="addressOptions" :props="cascaderProps"
|
||||
placeholder="请选择区域" clearable style="width: 300px;"/>
|
||||
placeholder="请选择区域" clearable style="width: 400px;" />
|
||||
</el-form-item>
|
||||
<el-form-item prop="detailAddress">
|
||||
<!-- 详细地址输入框 -->
|
||||
@ -390,7 +402,7 @@ const rules = reactive({
|
||||
{
|
||||
required: true,
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || value.length !== 3) {
|
||||
if (!value || value.length < 3) {
|
||||
callback(new Error('请选择完整的区域'));
|
||||
} else {
|
||||
callback();
|
||||
@ -524,7 +536,7 @@ const onSubmit = async () => {
|
||||
if (formInline.specStyle == '1') {
|
||||
params.netWeight = [
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodSpecs: formInline.goodSpecs,
|
||||
goodPrice: formInline.salePrice,
|
||||
goodStock: formInline.stock,
|
||||
netContent: formInline.netContent,
|
||||
@ -560,7 +572,7 @@ const onGoodSave = async (params) => {
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data.list;
|
||||
addressOptions.value = res.data;
|
||||
} else {
|
||||
ElMessage.error(res.message);
|
||||
}
|
||||
|
@ -53,6 +53,9 @@
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<div v-if="formInline.specStyle == '1'">
|
||||
<el-form-item label="规格名称" prop="goodSpecs" required>
|
||||
<el-input v-model="formInline.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
</el-form-item>
|
||||
<!-- 销售价格 -->
|
||||
<el-form-item label="销售价格" prop="salePrice" required>
|
||||
<el-input-number v-model="formInline.salePrice" :min="1" :precision="2" :controls="false"></el-input-number>
|
||||
@ -70,7 +73,12 @@
|
||||
<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="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
@ -83,7 +91,7 @@
|
||||
<Delete />
|
||||
</el-icon>
|
||||
</div>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加属性</el-button>
|
||||
<el-button icon="plus" type="primary" plain style="margin: 0" @click="addSpecs">添加规格</el-button>
|
||||
</el-form-item>
|
||||
<!-- 价格库存 -->
|
||||
<el-form-item label="价格库存" prop="netWeight" required>
|
||||
@ -147,7 +155,7 @@
|
||||
<el-form-item prop="selectedAddress">
|
||||
<!-- 区域级联选择器 -->
|
||||
<el-cascader v-model="formInline.selectedAddress" :options="addressOptions" :props="cascaderProps"
|
||||
placeholder="请选择区域" clearable style="width: 300px;"/>
|
||||
placeholder="请选择区域" clearable style="width: 400px;"/>
|
||||
</el-form-item>
|
||||
<el-form-item prop="detailAddress">
|
||||
<!-- 详细地址输入框 -->
|
||||
@ -207,6 +215,8 @@ import { getGoodType, goodEdit, getGoodInfo, getActiveInfos } from "@/api/goods/
|
||||
import { getRegion } from "@/api/common";
|
||||
import { ElMessage } from "element-plus";
|
||||
import areaList from "./areaList";
|
||||
import useOperateStore from "@/store/modules/operate";
|
||||
const operateStore = useOperateStore();
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
@ -395,7 +405,7 @@ const rules = reactive({
|
||||
{
|
||||
required: true,
|
||||
validator: (rule, value, callback) => {
|
||||
if (!value || value.length !== 3) {
|
||||
if (!value || value.length < 3) {
|
||||
callback(new Error('请选择完整的区域'));
|
||||
} else {
|
||||
callback();
|
||||
@ -516,7 +526,7 @@ const onSubmit = async () => {
|
||||
if (formInline.specStyle == '1') {
|
||||
params.netWeight = [
|
||||
{
|
||||
goodSpecs: "",
|
||||
goodSpecs: formInline.goodSpecs,
|
||||
goodPrice: formInline.salePrice,
|
||||
goodStock: formInline.stock,
|
||||
netContent: formInline.netContent,
|
||||
@ -551,7 +561,7 @@ const onGoodSave = async (params) => {
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data.list;
|
||||
addressOptions.value = res.data;
|
||||
}
|
||||
};
|
||||
const activeInfoList = ref([]);
|
||||
@ -565,7 +575,10 @@ const getActiveInfo = async () => {
|
||||
}
|
||||
};
|
||||
const getGoodsInfo = async (goodId) => {
|
||||
const res = await getGoodInfo(goodId);
|
||||
// console.log(operateStore.goodId);
|
||||
// console.log(operateStore.status);
|
||||
let id = operateStore.goodId || goodId; //防止手动修改url中的goodId导致获取不到数据
|
||||
const res = await getGoodInfo(id);
|
||||
if (res.code == 200) {
|
||||
Object.assign(formData.value, res.data);
|
||||
Object.assign(formInline, res.data);
|
||||
@ -575,6 +588,7 @@ const getGoodsInfo = async (goodId) => {
|
||||
formInline.specStyle = '2';
|
||||
} else {
|
||||
formInline.specStyle = '1';
|
||||
formInline.goodSpecs = formData.value.netWeight[0]?.goodSpecs ?? "";
|
||||
formInline.salePrice = formData.value.netWeight[0]?.goodPrice ?? 1;
|
||||
formInline.stock = formData.value.netWeight[0]?.goodStock ?? 1;
|
||||
formInline.netContent = formData.value.netWeight[0]?.netContent ?? 1;
|
||||
@ -626,7 +640,7 @@ watch(() => route.query, (newVal) => {
|
||||
}
|
||||
})
|
||||
onMounted(async () => {
|
||||
const { edit, goodId } = route.query;
|
||||
const { goodId } = route.query;
|
||||
getActiveInfo();
|
||||
await getGoodTypeList();
|
||||
getArea();
|
||||
@ -634,5 +648,8 @@ onMounted(async () => {
|
||||
getGoodsInfo(goodId);
|
||||
}
|
||||
});
|
||||
onBeforeUnmount( ()=>{
|
||||
operateStore.initGoodInfo()
|
||||
})
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
|
@ -7,44 +7,20 @@
|
||||
<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 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 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-input v-model="formInline.goodName" placeholder="请输入商品名称" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="商品分类"
|
||||
prop="goodCategoryId"
|
||||
class="custom-form-inline"
|
||||
>
|
||||
<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-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>
|
||||
@ -54,49 +30,24 @@
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="search-bar-right">
|
||||
<el-button type="primary" icon="Search" @click="onSubmit"
|
||||
>查询</el-button
|
||||
>
|
||||
<el-button
|
||||
icon="Refresh"
|
||||
style="margin: 16px 0 0 0"
|
||||
@click="resetForm"
|
||||
>重置</el-button
|
||||
>
|
||||
<el-button type="primary" 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
|
||||
>
|
||||
<el-button icon="delete" @click="batchDelete" :disabled="btnStatus"
|
||||
style="margin-right: 10px">批量删除</el-button>
|
||||
<router-link to="/goods/goodsManage/addGoods">
|
||||
<el-button type="primary" icon="plus" @click="onSubmit"
|
||||
>新增商品</el-button
|
||||
>
|
||||
<el-button type="primary" 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'"
|
||||
>
|
||||
<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">
|
||||
@ -105,64 +56,28 @@
|
||||
</template>
|
||||
<!-- 自定义 - 序号 -->
|
||||
<template #sort="slotProps">
|
||||
<span v-if="slotProps.row.goodPrice"
|
||||
>¥{{ slotProps.row.goodPrice }}</span
|
||||
>
|
||||
<span v-if="slotProps.row.goodPrice">¥{{ slotProps.row.goodPrice }}</span>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-状态 -->
|
||||
<template #isListed="slotProps">
|
||||
<span v-if="slotProps.row.isListed == 0" class="color-blue"
|
||||
>待上架</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.isListed == 1" class="color-black"
|
||||
>已上架</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.isListed == 2" class="color-green"
|
||||
>上架</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.isListed == 3" class="color-red"
|
||||
>下架</span
|
||||
>
|
||||
<span v-else-if="slotProps.row.isListed == 4" class="color-orange"
|
||||
>审核中</span
|
||||
>
|
||||
<span v-if="slotProps.row.isListed == 0" class="color-blue">待上架</span>
|
||||
<span v-else-if="slotProps.row.isListed == 1" class="color-black">已上架</span>
|
||||
<span v-else-if="slotProps.row.isListed == 2" class="color-green">上架</span>
|
||||
<span v-else-if="slotProps.row.isListed == 3" class="color-red">下架</span>
|
||||
<span v-else-if="slotProps.row.isListed == 4" class="color-orange">审核中</span>
|
||||
<span v-else-if="slotProps.row.isListed == 5" class="color-orange">未通过</span>
|
||||
</template>
|
||||
|
||||
<!-- 自定义-操作 -->
|
||||
<template #action="slotProps">
|
||||
<el-button
|
||||
text
|
||||
class="el-button-custom"
|
||||
@click="seeDetails(slotProps.row)"
|
||||
>详情</el-button
|
||||
>
|
||||
<el-button
|
||||
text
|
||||
v-if="slotProps.row.isListed == 0"
|
||||
class="el-button-custom"
|
||||
@click="toUpload(slotProps.row)"
|
||||
>上架</el-button
|
||||
>
|
||||
<el-button
|
||||
text
|
||||
v-if="slotProps.row.isListed == 1"
|
||||
class="el-button-custom"
|
||||
@click="toDownload(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
|
||||
>
|
||||
<el-button text class="el-button-custom" @click="seeDetails(slotProps.row)">详情</el-button>
|
||||
<el-button text v-if="slotProps.row.isListed == 0 || slotProps.row.isListed == 3" class="el-button-custom"
|
||||
@click="toUpload(slotProps.row)">上架</el-button>
|
||||
<el-button text v-if="slotProps.row.isListed == 1 || slotProps.row.isListed == 2" class="el-button-custom"
|
||||
@click="toDownload(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>
|
||||
@ -170,7 +85,7 @@
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount } from "vue";
|
||||
import { ref, reactive, computed, onMounted, onBeforeUnmount, nextTick } from "vue";
|
||||
import tableComponent from "@/components/tableComponent.vue";
|
||||
import Mock from "mockjs";
|
||||
import {
|
||||
@ -185,6 +100,8 @@ import { ElMessage } from "element-plus";
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance();
|
||||
import useOperateStore from "@/store/modules/operate";
|
||||
const operateStore = useOperateStore();
|
||||
|
||||
const formInline = reactive({
|
||||
goodName: "",
|
||||
@ -208,6 +125,7 @@ const goodsBrandList = ref([
|
||||
const searchForm = ref(null);
|
||||
const onSubmit = () => {
|
||||
formInline.current = 1;
|
||||
console.log(formInline);
|
||||
loadData();
|
||||
};
|
||||
const resetForm = () => {
|
||||
@ -325,9 +243,7 @@ const loadData = async () => {
|
||||
tableData.value = response.data.records;
|
||||
tableTotal.value = response.data.total;
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
} catch (error) { }
|
||||
tableLoading.value = false;
|
||||
};
|
||||
|
||||
@ -349,14 +265,21 @@ const handleSelectionChange = (selection, ids) => {
|
||||
};
|
||||
|
||||
// 查看详情
|
||||
const seeDetails = (row) => {
|
||||
const seeDetails = async (row) => {
|
||||
nowClickRow.value = row;
|
||||
console.log("要查看详情的行:", row);
|
||||
// router.push({
|
||||
// path: "/goods/goodsManage/editGoods",
|
||||
// query: { goodId: row.goodId },
|
||||
// meta: { title: '商品详情'}
|
||||
// });
|
||||
operateStore.setGoodInfo(
|
||||
{
|
||||
goodId: row.goodId,
|
||||
status: 2, //未使用
|
||||
}
|
||||
);
|
||||
await nextTick();
|
||||
// 跳转路由并携带参数,行数据,和query的值edit
|
||||
router.push({
|
||||
path: "/goods/goodsManage/seeDetails",
|
||||
query: { goodId: row.goodId },
|
||||
});
|
||||
};
|
||||
const toUpload = async (row) => {
|
||||
goodsUpAndDown(row.goodId, 2);
|
||||
@ -369,6 +292,7 @@ const goodsUpAndDown = async (id, isListed) => {
|
||||
let res = await goodUpAndDown({ id: id, isListed: isListed });
|
||||
let text = isListed == 2 ? "上架" : "下架";
|
||||
if (res.code == 200) {
|
||||
getGoodsManageCount();
|
||||
ElMessage.success(`${text}成功`);
|
||||
loadData();
|
||||
} else {
|
||||
@ -376,21 +300,28 @@ const goodsUpAndDown = async (id, isListed) => {
|
||||
}
|
||||
};
|
||||
// 编辑操作
|
||||
const handleEdit = (row) => {
|
||||
const handleEdit = async (row) => {
|
||||
nowClickRow.value = row;
|
||||
operateStore.setGoodInfo(
|
||||
{
|
||||
goodId: row.goodId,
|
||||
status: 1, //未使用
|
||||
}
|
||||
);
|
||||
await nextTick();
|
||||
// 跳转路由并携带参数,行数据,和query的值edit
|
||||
router.push({
|
||||
path: "/goods/goodsManage/editGoods",
|
||||
query: { goodId: row.goodId, edit: true },
|
||||
query: { goodId: row.goodId },
|
||||
});
|
||||
};
|
||||
// 删除操作
|
||||
const handleDelete = async (row) => {
|
||||
deleteGoods(row.goodId)
|
||||
deleteGoods(row.goodId);
|
||||
};
|
||||
// 批量删除
|
||||
const batchDelete = async () => {
|
||||
deleteGoods(selectedIds.value.join(","))
|
||||
deleteGoods(selectedIds.value.join(","));
|
||||
};
|
||||
const deleteGoods = async (param) => {
|
||||
try {
|
||||
@ -413,8 +344,10 @@ const cascaderProps = ref({
|
||||
label: "name", // 选项标签字段名
|
||||
value: "id", // 选项值字段名
|
||||
children: "children", // 子选项字段名
|
||||
emitPath: true,
|
||||
expandTrigger: "hover",
|
||||
emitPath: true, // 只返回当前节点值,不返回路径
|
||||
expandTrigger: "hover", // 展开触发方式,默认为点击,可选值为 hover
|
||||
// checkStrictly: true, //可以点击任意层级节点直接选中(不再需要展开到最后一级)
|
||||
// selectedNode: {},
|
||||
});
|
||||
const goodsOptions = ref([]);
|
||||
const getGoodTypeList = async () => {
|
||||
@ -423,9 +356,7 @@ const getGoodTypeList = async () => {
|
||||
if (response.code == 200) {
|
||||
goodsOptions.value = response.data;
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
} catch (error) { }
|
||||
};
|
||||
|
||||
const getGoodsManageCount = async () => {
|
||||
@ -436,9 +367,7 @@ const getGoodsManageCount = async () => {
|
||||
bottomList[1].value = `(${response.data?.alreadyListedCount ?? ""})`;
|
||||
bottomList[2].value = `(${response.data?.removedCount ?? ""})`;
|
||||
}
|
||||
} catch (error) {
|
||||
|
||||
}
|
||||
} catch (error) { }
|
||||
};
|
||||
|
||||
const titleRef = ref(null);
|
||||
|
634
src/views/goods/goodsManage/seeDetails.vue
Normal file
634
src/views/goods/goodsManage/seeDetails.vue
Normal file
@ -0,0 +1,634 @@
|
||||
<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: 120px;" :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="goodSpecs" required>
|
||||
<el-input v-model="formInline.goodSpecs" class="attr-clomn" placeholder="请输入规格名称" />
|
||||
</el-form-item>
|
||||
<!-- 销售价格 -->
|
||||
<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="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</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="L" value="L" />
|
||||
<el-option label="ml" value="ml" />
|
||||
<el-option label="棵" value="棵" />
|
||||
<el-option label="袋" value="袋" />
|
||||
<el-option label="瓶" value="瓶" />
|
||||
<el-option label="件" value="件" />
|
||||
</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: 400px;" />
|
||||
</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" style="margin: 10px 0 0 80px;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";
|
||||
import useOperateStore from "@/store/modules/operate";
|
||||
const operateStore = useOperateStore();
|
||||
|
||||
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多规格
|
||||
goodSpecs: "",
|
||||
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: [
|
||||
{
|
||||
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 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 () => {
|
||||
router.go(-1);
|
||||
};
|
||||
|
||||
const getArea = async () => {
|
||||
const res = await getRegion();
|
||||
if (res.code === 200) {
|
||||
addressOptions.value = res.data;
|
||||
}
|
||||
};
|
||||
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) => {
|
||||
// console.log(operateStore.goodId);
|
||||
// console.log(operateStore.status);
|
||||
let id = operateStore.goodId || goodId; //防止手动修改url中的goodId导致获取不到数据
|
||||
const res = await getGoodInfo(id);
|
||||
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.goodSpecs = formData.value.netWeight[0]?.goodSpecs ?? "";
|
||||
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>
|
@ -100,7 +100,7 @@ const userStore = useUserStore();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
const { proxy } = getCurrentInstance();
|
||||
const showType = ref(2);
|
||||
const showType = ref(1);
|
||||
|
||||
const loginForm = ref({
|
||||
username: "admin",
|
||||
|
Loading…
x
Reference in New Issue
Block a user