DMJS-IT
/
merchant-web
12
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 商品管理bug修改
continuous-integration/drone Build is failing Details

This commit is contained in:
lzhizhao 2025-06-28 00:40:52 +08:00
parent 03bc91f984
commit c50758dcb8
2 changed files with 296 additions and 255 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

288
src/views/modules/operation-management/commodity/index.vue
View File

@ -158,45 +158,45 @@
</template> </template>
<script> <script>
import { mapState } from 'vuex' import { mapState } from "vuex";
import AddDiscount from './popup/add-discount.vue' import AddDiscount from "./popup/add-discount.vue";
import AddPrice from './popup/add-price.vue' import AddPrice from "./popup/add-price.vue";
import AddOrUpdate from './popup/add-or-update.vue' import AddOrUpdate from "./popup/add-or-update.vue";
import addStock from './popup/add-stock.vue' import addStock from "./popup/add-stock.vue";
export default { export default {
components: { AddOrUpdate, AddPrice, addStock, AddDiscount }, components: { AddOrUpdate, AddPrice, addStock, AddDiscount },
data() { data() {
return { return {
activeName: '在售', activeName: "在售",
dataList: [], dataList: [],
formInline: { formInline: {
name: '', name: "",
marketId: '', marketId: "",
shopId: '', shopId: "",
isAdvanceSell: 0 isAdvanceSell: 0
}, },
tableProp: { tableProp: {
'auto-resize': true, "auto-resize": true,
border: true, border: true,
height: 'auto', height: "auto",
'row-id': 'id', "row-id": "id",
'show-overflow': false "show-overflow": false
}, },
productFilterType: 'SALE', productFilterType: "SALE",
selectList: [], selectList: [],
overview: {} overview: {}
} };
}, },
created() { created() {
this.formInline = { this.formInline = {
name: '', name: "",
marketId: this.marketId, marketId: this.marketId,
shopId: this.shopId, shopId: this.shopId,
isAdvanceSell: 0 isAdvanceSell: 0
} };
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.oTable.reload() this.$refs.oTable.reload();
}) });
}, },
methods: { methods: {
//如果有多个菜市场调用 //如果有多个菜市场调用
@ -211,33 +211,33 @@ export default {
// }); // });
}, },
addProduct() { addProduct() {
this.$refs.addOrUpdate.toggle().add(this.formInline.shopId) this.$refs.addOrUpdate.toggle().add(this.formInline.shopId);
}, },
deleteProduct() { deleteProduct() {
console.log(this.selectList) console.log(this.selectList);
let integers = this.selectList.map(item => { let integers = this.selectList.map(item => {
return item.id return item.id;
}) });
this.$confirm('此操作将删除该商品, 是否继续?', '提示', { this.$confirm("此操作将删除该商品, 是否继续?", "提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning' type: "warning"
}) })
.then(() => { .then(() => {
console.log('111') console.log("111");
this.$api.mer_admin.BatchDeleteProducts(integers).then(res => { this.$api.mer_admin.BatchDeleteProducts(integers).then(res => {
this.$refs.oTable.reload() this.$refs.oTable.reload();
}) });
}) })
.catch(() => { .catch(() => {
this.$message({ this.$message({
type: 'info', type: "info",
message: '已取消删除' message: "已取消删除"
}) });
}) });
}, },
queryList(pageNo, pageSize) { queryList(pageNo, pageSize) {
console.log(this.formInline) console.log(this.formInline);
this.$api.mer_admin this.$api.mer_admin
.getProductPage({ .getProductPage({
p: { p: {
@ -246,160 +246,160 @@ export default {
}, },
...this.formInline, ...this.formInline,
productFilterType: this.productFilterType, productFilterType: this.productFilterType,
merchantId: JSON.parse(sessionStorage.getItem('userInfo')).merchantId, merchantId: JSON.parse(sessionStorage.getItem("userInfo")).merchantId,
productQuerySortParam: [] productQuerySortParam: []
}) })
.then(res => { .then(res => {
console.log(res) console.log(res);
this.$refs.oTable.complete( this.$refs.oTable.complete(
res.data.data.data, res.data.data.data,
Number(res.data.data.total) Number(res.data.data.total)
) );
}) })
.catch(err => { .catch(err => {
this.$refs.oTable.complete(false) this.$refs.oTable.complete(false);
}) });
this.$api.mer_admin.getProductOverview(this.formInline).then(res => { this.$api.mer_admin.getProductOverview(this.formInline).then(res => {
console.log(res, '概况') console.log(res, "概况");
this.overview = res.data.data this.overview = res.data.data;
}) });
}, },
Reset() { Reset() {
this.formInline = { this.formInline = {
name: '', name: "",
marketId: this.marketId, marketId: this.marketId,
shopId: this.shopId, shopId: this.shopId,
isAdvanceSell: 0 isAdvanceSell: 0
} };
this.$refs.oTable.reload() this.$refs.oTable.reload();
}, },
handleClick() { handleClick() {
switch (this.activeName) { switch (this.activeName) {
case '在售': case "在售":
this.productFilterType = 'SALE' this.productFilterType = "SALE";
break break;
case '仓库中': case "仓库中":
this.productFilterType = 'WAREHOUSE' this.productFilterType = "WAREHOUSE";
break break;
case '折扣': case "折扣":
this.productFilterType = 'DISCOUNT' this.productFilterType = "DISCOUNT";
break break;
} }
this.$refs.oTable.reload() this.$refs.oTable.reload();
} }
}, },
computed: { computed: {
tableCols() { tableCols() {
return [ return [
{ type: 'checkbox', width: '60px', fixed: 'left' }, { type: "checkbox", width: "60px", fixed: "left" },
// { type: "seq", width: "60px", align: "center", title: "序号" }, // { type: "seq", width: "60px", align: "center", title: "序号" },
{ {
title: '商品图', title: "商品图",
field: 'productPhotoList', field: "productPhotoList",
align: 'center', align: "center",
width: '80px', width: "80px",
type: 'jsx', type: "jsx",
render: ({ row }) => { render: ({ row }) => {
if (row.productPhotoList.length > 0) { if (row.productPhotoList.length > 0) {
return ( return (
<el-image <el-image
preview-src-list={row.productPhotoList.map(item => { preview-src-list={row.productPhotoList.map(item => {
return item.url return item.url;
})} })}
src={row.productPhotoList[0].url} src={row.productPhotoList[0].url}
></el-image> ></el-image>
) );
} else { } else {
return <span>暂无商品图</span> return <span>暂无商品图</span>;
} }
} }
}, },
{ {
title: '商品名称', title: "商品名称",
align: 'center', align: "center",
field: 'name' field: "name"
}, },
{ {
title: '商品售价', title: "商品售价",
align: 'center', align: "center",
field: 'minSalePrice', field: "minSalePrice",
type: 'jsx', type: "jsx",
render: ({ row }) => { render: ({ row }) => {
if (row.minSalePrice == row.maxSalePrice) { if (row.minSalePrice == row.maxSalePrice) {
return <span>￥{row.minSalePrice}</span> return <span>￥{row.minSalePrice}</span>;
} else { } else {
return ( return (
<span> <span>
￥{row.minSalePrice}~￥{row.maxSalePrice} ￥{row.minSalePrice}~￥{row.maxSalePrice}
</span> </span>
) );
} }
} }
}, },
{ {
title: '折扣', title: "折扣",
align: 'center', align: "center",
field: 'discountActivity', field: "discountActivity",
type: 'jsx', type: "jsx",
render: ({ row }) => { render: ({ row }) => {
if (row.discountActivity) { if (row.discountActivity) {
return <span>{row.discountActivity.ruleObject.discount}折</span> return <span>{row.discountActivity.ruleObject.discount}折</span>;
} }
} }
}, },
{ {
title: '销量', title: "销量",
align: 'center', align: "center",
field: 'saleNum' field: "saleNum"
}, },
{ {
title: '库存', title: "库存",
align: 'center', align: "center",
field: 'stockNum' field: "stockNum"
}, },
{ {
title: '是否为预售商品', title: "是否为预售商品",
align: 'center', align: "center",
field: 'isAdvanceSell', field: "isAdvanceSell",
type: 'jsx', type: "jsx",
render: ({ row }) => { render: ({ row }) => {
return <span>{row.isAdvanceSell == 1 ? '是' : '否'}</span> return <span>{row.isAdvanceSell == 1 ? "是" : "否"}</span>;
} }
}, },
{ {
title: '状态', title: "状态",
// fixed: "right", // fixed: "right",
type: 'jsx', type: "jsx",
align: 'center', align: "center",
'title-suffix': { "title-suffix": {
message: '点击上架/下架切换责任书状态', message: "点击上架/下架切换责任书状态",
icon: 'vxe-icon-question-circle-fill' icon: "vxe-icon-question-circle-fill"
}, },
render: ({ row }) => { render: ({ row }) => {
let Enable = () => { let Enable = () => {
let data = { let data = {
ids: [row.id], ids: [row.id],
status: 'UP' status: "UP"
} };
if (row.status == 'UP') { if (row.status == "UP") {
data.status = 'DOWN' data.status = "DOWN";
} else { } else {
data.status = 'UP' data.status = "UP";
} }
this.$api.mer_admin.putOnShelvesProducts(data).then(res => { this.$api.mer_admin.putOnShelvesProducts(data).then(res => {
console.log(res) console.log(res);
this.$refs.oTable.reload() this.$refs.oTable.reload();
}) });
} };
return ( return (
<el-popconfirm <el-popconfirm
title={ title={
row.status == 'DOWN' row.status == "DOWN"
? '当前为下架状态，是否更改为上架状态？' ? "当前为下架状态，是否更改为上架状态？"
: '当前为上架状态，是否更改为下架状态？' : "当前为上架状态，是否更改为下架状态？"
} }
confirmButtonText={ confirmButtonText={
row.status == 'DOWN' ? '确认上架' : '确认下架' row.status == "DOWN" ? "确认上架" : "确认下架"
} }
onConfirm={Enable} onConfirm={Enable}
> >
@ -407,39 +407,39 @@ export default {
slot="reference" slot="reference"
size="mini" size="mini"
plain plain
type={row.status == 'DOWN' ? 'info' : 'success'} type={row.status == "DOWN" ? "info" : "success"}
> >
{row.status == 'DOWN' ? '已下架' : '上架中'} {row.status == "DOWN" ? "已下架" : "上架中"}
</el-button> </el-button>
</el-popconfirm> </el-popconfirm>
) );
} }
}, },
{ {
title: '操作 (提示：下架后可进行操作)', title: "操作 (提示：下架后可进行操作)",
fixed: 'right', fixed: "right",
type: 'jsx', type: "jsx",
align: 'center', align: "center",
width: '340px', width: "340px",
render: ({ row }) => { render: ({ row }) => {
let edit = () => { let edit = () => {
this.$refs.addOrUpdate.toggle(row).update() this.$refs.addOrUpdate.toggle(row).update();
} };
let priceAdjustment = () => { let priceAdjustment = () => {
console.log(row) console.log(row);
this.$refs.AddPrice.toggle(row).update() this.$refs.AddPrice.toggle(row).update();
} };
let changeInventory = () => { let changeInventory = () => {
this.$refs.addStock.toggle(row).update() this.$refs.addStock.toggle(row).update();
} };
let setDiscounts = () => { let setDiscounts = () => {
this.$refs.AddDiscount.toggle(row).update() this.$refs.AddDiscount.toggle(row).update();
} };
return ( return (
<div> <div>
<el-button <el-button
size="mini" size="mini"
disabled={row.status != 'DOWN'} disabled={row.status != "DOWN"}
type="primary" type="primary"
onClick={edit} onClick={edit}
> >
@ -447,7 +447,7 @@ export default {
</el-button> </el-button>
<el-button <el-button
size="mini" size="mini"
disabled={row.status != 'DOWN'} disabled={row.status != "DOWN"}
type="primary" type="primary"
onClick={priceAdjustment} onClick={priceAdjustment}
> >
@ -455,7 +455,7 @@ export default {
</el-button> </el-button>
<el-button <el-button
size="mini" size="mini"
disabled={row.status != 'DOWN'} disabled={row.status != "DOWN"}
type="primary" type="primary"
onClick={changeInventory} onClick={changeInventory}
> >
@ -463,37 +463,37 @@ export default {
</el-button> </el-button>
<el-button <el-button
size="mini" size="mini"
disabled={row.status != 'DOWN'} disabled={row.status != "DOWN"}
type="primary" type="primary"
onClick={setDiscounts} onClick={setDiscounts}
> >
设置折扣 设置折扣
</el-button> </el-button>
</div> </div>
) );
} }
} }
] ];
}, },
tableEvent() { tableEvent() {
return { return {
'checkbox-all': ({ records, reserves }) => { "checkbox-all": ({ records, reserves }) => {
this.selectList = [...records, ...reserves] this.selectList = [...records, ...reserves];
}, },
'checkbox-change': ({ records, reserves }) => { "checkbox-change": ({ records, reserves }) => {
this.selectList = [...records, ...reserves] this.selectList = [...records, ...reserves];
}
} }
};
}, },
...mapState('userData', [ ...mapState("userData", [
'isMerchant', "isMerchant",
'marketList', "marketList",
'storeList', "storeList",
'marketId', "marketId",
'shopId' "shopId"
]) ])
} }
} };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

261
src/views/modules/operation-management/commodity/popup/add-or-update.vue
View File

@ -137,13 +137,13 @@ export default {
// "_id": "重量2斤", // "_id": "重量2斤",
// "value": "售价￥17.5 成本￥15 库存100" // "value": "售价￥17.5 成本￥15 库存100"
// } // }
], ]
}, },
modalConfig: { modalConfig: {
title: "编辑商品", title: "编辑商品",
show: false, show: false,
width: "1300px", width: "1300px",
fullscreen: true, fullscreen: true
}, },
fileList: [], //回显图片 fileList: [], //回显图片
fileListOne: [], //介绍图 fileListOne: [], //介绍图
@ -152,7 +152,7 @@ export default {
passCheck: [], //通行证 passCheck: [], //通行证
shopId: "", shopId: "",
getProductCategory: [], getProductCategory: [],
getSaleUnit: [], getSaleUnit: []
}; };
}, },
mounted() {}, mounted() {},
@ -163,7 +163,7 @@ export default {
this.fileList = []; this.fileList = [];
(this.fileListOne = []), (this.fileListTwo = []); (this.fileListOne = []), (this.fileListTwo = []);
} }
}, }
}, },
methods: { methods: {
toggle(e) { toggle(e) {
@ -177,7 +177,7 @@ export default {
this.init(cloneDeep(e)); this.init(cloneDeep(e));
} }
return { return {
add: (shopId) => { add: shopId => {
this.shopId = shopId; this.shopId = shopId;
this.getData(); this.getData();
console.log(this.shopId); console.log(this.shopId);
@ -202,7 +202,7 @@ export default {
specType: 0, specType: 0,
minCostPrice: "", minCostPrice: "",
status: "UP", status: "UP",
isAdvanceSell: '0', isAdvanceSell: "0"
}; };
this.modalData.merchantId = JSON.parse( this.modalData.merchantId = JSON.parse(
sessionStorage.getItem("userInfo") sessionStorage.getItem("userInfo")
@ -218,26 +218,26 @@ export default {
update: () => { update: () => {
this.modalConfig.title = "编辑商品"; this.modalConfig.title = "编辑商品";
this.isAdd = false; this.isAdd = false;
}, }
}; };
}, },
init(row) { init(row) {
console.log(row); console.log(row);
this.shopId = row.shopId; this.shopId = row.shopId;
this.getData(); this.getData();
this.fileList = row.productPhotoList.map((item) => { this.fileList = row.productPhotoList.map(item => {
return { return {
name: "", name: "",
url: item.url, url: item.url
}; };
}); });
if (row.productIntroducePhoto) { if (row.productIntroducePhoto) {
this.fileListOne = [ // 处理多张介绍图(逗号分隔的URL)
{ const urls = row.productIntroducePhoto.split(",");
this.fileListOne = urls.map(url => ({
name: "", name: "",
url: row.productIntroducePhoto, url: url.trim()
}, }));
];
} else { } else {
this.fileListOne = []; this.fileListOne = [];
} }
@ -245,8 +245,8 @@ export default {
this.fileListTwo = [ this.fileListTwo = [
{ {
name: "", name: "",
url: row.productVideo, url: row.productVideo
}, }
]; ];
} else { } else {
this.fileListTwo = []; this.fileListTwo = [];
@ -307,10 +307,10 @@ export default {
getSpecs(tableData, AttributeData) { getSpecs(tableData, AttributeData) {
console.log(tableData); console.log(tableData);
this.modalData.specType = 1; this.modalData.specType = 1;
let AttributeList = AttributeData.map((item) => { let AttributeList = AttributeData.map(item => {
return { return {
attributeName: item.attributeName, attributeName: item.attributeName,
attributeValue: item.attributeValue.join(","), attributeValue: item.attributeValue.join(",")
}; };
}); });
this.$set(this.modalData, "productSpecificationList", tableData); this.$set(this.modalData, "productSpecificationList", tableData);
@ -328,8 +328,8 @@ export default {
this.modalData.otherAttribute = [ this.modalData.otherAttribute = [
{ {
name: data.name, name: data.name,
value: data.value.join(","), value: data.value.join(",")
}, }
]; ];
console.log(this.modalData); console.log(this.modalData);
}, },
@ -338,7 +338,7 @@ export default {
return true; return true;
} }
let state = ""; let state = "";
this.$refs.modal.validate((valid) => { this.$refs.modal.validate(valid => {
if (valid) { if (valid) {
if (!this.passCheck.includes(oldActiveName)) { if (!this.passCheck.includes(oldActiveName)) {
this.passCheck.push(oldActiveName); this.passCheck.push(oldActiveName);
@ -351,15 +351,15 @@ export default {
getData() { getData() {
this.$api.mer_admin this.$api.mer_admin
.getProductCategory({ shopId: this.shopId }) .getProductCategory({ shopId: this.shopId })
.then((res) => { .then(res => {
this.getProductCategory = res.data.data; this.getProductCategory = res.data.data;
console.log(res); console.log(res);
}); });
this.$api.mer_admin.getSaleUnit({ shopId: this.shopId }).then((res) => { this.$api.mer_admin.getSaleUnit({ shopId: this.shopId }).then(res => {
this.getSaleUnit = res.data.data; this.getSaleUnit = res.data.data;
console.log(res); console.log(res);
}); });
}, }
}, },
computed: { computed: {
modalCols() { modalCols() {
@ -373,7 +373,7 @@ export default {
rules: { rules: {
required: true, required: true,
message: "请上传商品图片", message: "请上传商品图片",
trigger: "blur", trigger: "blur"
}, },
type: "jsx", type: "jsx",
render: () => { render: () => {
@ -387,20 +387,21 @@ export default {
if (index == 0) { if (index == 0) {
return { return {
isMain: 1, isMain: 1,
url: item.response ? item.response.data : item.url, url: item.response ? item.response.data : item.url
}; };
} else { } else {
return { return {
url: item.response ? item.response.data : item.url, isMain: 0,
url: item.response ? item.response.data : item.url
}; };
} }
} }
); );
console.log(this.modalData.productPhotoList); console.log(this.modalData.productPhotoList);
this.fileList = fileList.map((item) => { this.fileList = fileList.map(item => {
return { return {
name: item.name, name: item.name,
url: item.response ? item.response.data : item.url, url: item.response ? item.response.data : item.url
}; };
}); });
}; };
@ -411,20 +412,21 @@ export default {
if (index == 0) { if (index == 0) {
return { return {
isMain: 1, isMain: 1,
url: item.url, url: item.url
}; };
} else { } else {
return { return {
url: item.url, isMain: 0,
url: item.url
}; };
} }
} }
); );
console.log(this.modalData.productPhotoList); console.log(this.modalData.productPhotoList);
this.fileList = fileList.map((item) => { this.fileList = fileList.map(item => {
return { return {
name: item.name, name: item.name,
url: item.url, url: item.url
}; };
}); });
}; };
@ -437,11 +439,11 @@ export default {
props: { props: {
"on-change": handleChange, "on-change": handleChange,
"on-success": handleAvatarSuccess, "on-success": handleAvatarSuccess,
"on-remove": handleRemove, "on-remove": handleRemove
}, }
}} }}
headers={{ headers={{
token: "Bearer " + this.$cookie.get("token"), token: "Bearer " + this.$cookie.get("token")
}} }}
multiple={true} multiple={true}
file-list={this.fileList} file-list={this.fileList}
@ -456,7 +458,7 @@ export default {
</div> </div>
</el-upload> </el-upload>
); );
}, }
}, },
{ {
label: "商品类目", label: "商品类目",
@ -466,7 +468,7 @@ export default {
rules: { rules: {
required: true, required: true,
message: "请选择商品类目", message: "请选择商品类目",
trigger: "blur", trigger: "blur"
}, },
render: () => { render: () => {
return ( return (
@ -474,7 +476,7 @@ export default {
placeholder="请选择商品类目" placeholder="请选择商品类目"
v-model={this.modalData.productCategoryId} v-model={this.modalData.productCategoryId}
> >
{this.getProductCategory.map((item) => { {this.getProductCategory.map(item => {
return ( return (
<el-option <el-option
label={item.name} label={item.name}
@ -484,7 +486,7 @@ export default {
})} })}
</el-select> </el-select>
); );
}, }
}, },
{ {
label: "商品名称", label: "商品名称",
@ -495,9 +497,9 @@ export default {
rules: { rules: {
required: true, required: true,
message: "请输入商品名称", message: "请输入商品名称",
trigger: "blur", trigger: "blur"
}, },
placeholder: "请输入商品名称", placeholder: "请输入商品名称"
}, },
{ {
label: "商品描述", label: "商品描述",
@ -506,7 +508,7 @@ export default {
rules: { rules: {
required: true, required: true,
message: "请填写商品描述", message: "请填写商品描述",
trigger: "blur", trigger: "blur"
}, },
type: "jsx", type: "jsx",
render: () => { render: () => {
@ -518,8 +520,8 @@ export default {
placeholder="请简单描述，如别称、口感、用途等" placeholder="请简单描述，如别称、口感、用途等"
/> />
); );
}, }
}, }
// { // {
// label: "是否为预售产品", // label: "是否为预售产品",
// prop: "isAdvanceSell", // prop: "isAdvanceSell",
@ -562,7 +564,7 @@ export default {
rules: { rules: {
required: true, required: true,
message: "请选择销售单位", message: "请选择销售单位",
trigger: "blur", trigger: "blur"
}, },
type: "jsx", type: "jsx",
render: () => { render: () => {
@ -571,7 +573,7 @@ export default {
v-model={this.modalData.productUnit} v-model={this.modalData.productUnit}
placeholder="请选择销售单位" placeholder="请选择销售单位"
> >
{this.getSaleUnit.map((item) => { {this.getSaleUnit.map(item => {
return ( return (
<el-option <el-option
label={item.name} label={item.name}
@ -581,7 +583,7 @@ export default {
})} })}
</el-select> </el-select>
); );
}, }
}, },
{ {
label: "规格", label: "规格",
@ -593,12 +595,18 @@ export default {
若有多规格请在此配置 若有多规格请在此配置
</el-button> </el-button>
); );
}, }
}, },
{ {
label: "成本", label: "成本",
prop: "costPrice", prop: "costPrice",
type: "jsx", type: "jsx",
required: true,
rules: {
required: true,
message: "请输入成本价格",
trigger: "blur"
},
render: () => { render: () => {
return ( return (
<el-input <el-input
@ -609,12 +617,18 @@ export default {
<template slot="append">单位（元）</template> <template slot="append">单位（元）</template>
</el-input> </el-input>
); );
}, }
}, },
{ {
label: "市场价", label: "市场价",
prop: "marketPrice", prop: "marketPrice",
type: "jsx", type: "jsx",
required: true,
rules: {
required: true,
message: "请输入市场价",
trigger: "blur"
},
render: () => { render: () => {
return ( return (
<el-input <el-input
@ -625,12 +639,18 @@ export default {
<template slot="append">单位（元）</template> <template slot="append">单位（元）</template>
</el-input> </el-input>
); );
}, }
}, },
{ {
label: "库存", label: "库存",
prop: "stockNum", prop: "stockNum",
type: "jsx", type: "jsx",
required: true,
rules: {
required: true,
message: "请输入库存",
trigger: "blur"
},
render: () => { render: () => {
return ( return (
<el-input <el-input
@ -639,35 +659,51 @@ export default {
v-model={this.modalData.stockNum} v-model={this.modalData.stockNum}
></el-input> ></el-input>
); );
}, }
}, },
{ {
label: "重量", label: "重量",
prop: "weight", prop: "weight",
type: "jsx", type: "jsx",
required: true,
rules: {
required: true,
message: "请输入重量",
trigger: "blur"
},
render: () => { render: () => {
return ( return (
<el-input <el-input
readonly={this.modalData.specType != 0} readonly={this.modalData.specType != 0}
placeholder="请输入库存" placeholder="请输入重量"
v-model={this.modalData.weight} v-model={this.modalData.weight}
></el-input> >
<template slot="append">KG</template>
</el-input>
); );
}, }
}, },
{ {
label: "体积", label: "体积",
prop: "volume", prop: "volume",
type: "jsx", type: "jsx",
required: true,
rules: {
required: true,
message: "请输入体积",
trigger: "blur"
},
render: () => { render: () => {
return ( return (
<el-input <el-input
readonly={this.modalData.specType != 0} readonly={this.modalData.specType != 0}
placeholder="请输入库存" placeholder="请输入体积"
v-model={this.modalData.volume} v-model={this.modalData.volume}
></el-input> >
<template slot="append">立方米</template>
</el-input>
); );
}, }
}, },
{ {
label: "其他属性", label: "其他属性",
@ -679,8 +715,8 @@ export default {
添加其他属性 添加其他属性
</el-button> </el-button>
); );
}, }
}, }
]; ];
break; break;
case "其他信息": case "其他信息":
@ -688,11 +724,9 @@ export default {
{ {
label: "产地", label: "产地",
prop: "productPlace", prop: "productPlace",
required: true,
rules: { required: true, message: "请选择产地", trigger: "blur" },
type: "jsx", type: "jsx",
render: () => { render: () => {
const change = (e) => { const change = e => {
console.log(e); console.log(e);
this.modalData.productPlace = e.join("-"); this.modalData.productPlace = e.join("-");
}; };
@ -704,24 +738,18 @@ export default {
props={{ props={{
props: { props: {
label: "name", label: "name",
value: "name", value: "name"
}, }
}} }}
clearable clearable
></el-cascader> ></el-cascader>
); );
}, }
}, },
{ {
label: "保质期", label: "保质期",
prop: "shelfLife", prop: "shelfLife",
type: "jsx", type: "jsx",
// required: true,
rules: {
required: true,
message: "请填写保质期",
trigger: "blur",
},
render: () => { render: () => {
return ( return (
<el-input <el-input
@ -732,7 +760,7 @@ export default {
<div slot="suffix">天</div> <div slot="suffix">天</div>
</el-input> </el-input>
); );
}, }
}, },
{ {
label: "商品介绍图", label: "商品介绍图",
@ -746,12 +774,24 @@ export default {
const handleChange = (file, fileList) => { const handleChange = (file, fileList) => {
// console.log(fileList); // console.log(fileList);
}; };
const handleAvatarSuccess = (res) => { const handleAvatarSuccess = (res, file, fileList) => {
this.modalData.productIntroducePhoto = res.data; // 拼接所有已上传图片URL，使用逗号分隔
const urls = fileList
.map(item => {
return item.response ? item.response.data : item.url;
})
.filter(Boolean);
this.modalData.productIntroducePhoto = urls.join(",");
console.log(this.modalData.productIntroducePhoto); console.log(this.modalData.productIntroducePhoto);
}; };
const handleRemove = () => { const handleRemove = (file, fileList) => {
this.modalData.productIntroducePhoto = ""; // 从已上传列表中移除一张图片后，重新拼接剩余的图片URL
const urls = fileList
.map(item => {
return item.response ? item.response.data : item.url;
})
.filter(Boolean);
this.modalData.productIntroducePhoto = urls.join(",");
console.log(this.modalData.productIntroducePhoto); console.log(this.modalData.productIntroducePhoto);
}; };
return ( return (
@ -759,18 +799,17 @@ export default {
class="upload-demo" class="upload-demo"
drag drag
action={this.$api.mer_admin.uploadFile()} action={this.$api.mer_admin.uploadFile()}
limit={1}
file-list={this.fileListOne} file-list={this.fileListOne}
list-type="picture" list-type="picture"
{...{ {...{
props: { props: {
"on-change": handleChange, "on-change": handleChange,
"on-success": handleAvatarSuccess, "on-success": handleAvatarSuccess,
"on-remove": handleRemove, "on-remove": handleRemove
}, }
}} }}
headers={{ headers={{
token: "Bearer " + this.$cookie.get("token"), token: "Bearer " + this.$cookie.get("token")
}} }}
multiple multiple
> >
@ -783,7 +822,7 @@ export default {
</div> </div>
</el-upload> </el-upload>
); );
}, }
}, },
{ {
label: "商品视频", label: "商品视频",
@ -799,7 +838,7 @@ export default {
const handleChange = (file, fileList) => { const handleChange = (file, fileList) => {
console.log(fileList); console.log(fileList);
}; };
const handleAvatarSuccess = (res) => { const handleAvatarSuccess = res => {
this.modalData.productVideo = res.data; this.modalData.productVideo = res.data;
}; };
const handleRemove = () => { const handleRemove = () => {
@ -812,30 +851,29 @@ export default {
action={this.$api.mer_admin.uploadFile()} action={this.$api.mer_admin.uploadFile()}
limit={1} limit={1}
file-list={this.fileListTwo} file-list={this.fileListTwo}
list-type="picture" accept=".mp4,.avi,.mov,.wmv,.flv"
{...{ {...{
props: { props: {
"on-change": handleChange, "on-change": handleChange,
"on-success": handleAvatarSuccess, "on-success": handleAvatarSuccess,
"on-remove": handleRemove, "on-remove": handleRemove
}, }
}} }}
headers={{ headers={{
token: "Bearer " + this.$cookie.get("token"), token: "Bearer " + this.$cookie.get("token")
}} }}
multiple
> >
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text"> <div class="el-upload__text">
将文件拖到此处，或<em>点击上传</em> 将视频文件拖到此处，或<em>点击上传</em>
</div> </div>
<div class="el-upload__tip" slot="tip"> <div class="el-upload__tip" slot="tip">
只能上传jpg/png文件，且不超过500kb 支持mp4、avi、mov等视频格式，建议不超过50MB
</div> </div>
</el-upload> </el-upload>
); );
}, }
}, }
]; ];
break; break;
@ -846,7 +884,7 @@ export default {
modalHandles() { modalHandles() {
return [ return [
{ {
label: this.currentPanel === "其他信息" ? "立即上架" : "下一步", label: this.currentPanel === "其他信息" ? "保存并上架" : "下一步",
type: "primary", type: "primary",
loading: this.isLoading, loading: this.isLoading,
submit: true, submit: true,
@ -862,8 +900,8 @@ export default {
{ {
id: "1821213026050191360", id: "1821213026050191360",
attributeName: "重量", attributeName: "重量",
attributeValue: "1斤", attributeValue: "1斤"
}, }
]; ];
this.modalData.productSpecificationList = [ this.modalData.productSpecificationList = [
{ {
@ -872,22 +910,24 @@ export default {
marketPrice: this.modalData.marketPrice, marketPrice: this.modalData.marketPrice,
stockNum: this.modalData.stockNum, stockNum: this.modalData.stockNum,
weight: this.modalData.weight, weight: this.modalData.weight,
volume: this.modalData.volume, volume: this.modalData.volume
}, }
]; ];
} }
this.$api.mer_admin.saveProduct(this.modalData).then((res) => { // 明确设置状态为上架
this.modalData.status = "UP";
this.$api.mer_admin.saveProduct(this.modalData).then(res => {
console.log(res); console.log(res);
this.$emit("queryList"); this.$emit("queryList");
this.toggle(); this.toggle();
}); });
} }
}, 300), }, 300)
}, },
{ {
disabled: () => this.currentPanel != "其他信息", disabled: () => this.currentPanel != "其他信息",
label: "放入仓库", label: "保存并放入仓库",
type: "primary", type: "info",
loading: this.isLoading, loading: this.isLoading,
submit: true, submit: true,
handle: debounce(() => { handle: debounce(() => {
@ -896,8 +936,8 @@ export default {
{ {
id: "1821213026050191360", id: "1821213026050191360",
attributeName: "重量", attributeName: "重量",
attributeValue: "1斤", attributeValue: "1斤"
}, }
]; ];
this.modalData.productSpecificationList = [ this.modalData.productSpecificationList = [
{ {
@ -906,20 +946,21 @@ export default {
marketPrice: this.modalData.marketPrice, marketPrice: this.modalData.marketPrice,
stockNum: this.modalData.stockNum, stockNum: this.modalData.stockNum,
weight: this.modalData.weight, weight: this.modalData.weight,
volume: this.modalData.volume, volume: this.modalData.volume
}, }
]; ];
} }
// 明确设置状态为下架/放入仓库
this.modalData.status = "DOWN"; this.modalData.status = "DOWN";
this.$api.mer_admin.saveProduct(this.modalData).then((res) => { this.$api.mer_admin.saveProduct(this.modalData).then(res => {
console.log(res); console.log(res);
this.$emit("queryList"); this.$emit("queryList");
this.toggle(); this.toggle();
}); });
}, 300), }, 300)
}, }
]; ];
}, }
}, },
asyncComputed: { asyncComputed: {
// async getProductCategory() { // async getProductCategory() {
@ -933,7 +974,7 @@ export default {
// console.log(res); // console.log(res);
// return res.data.data; // return res.data.data;
// }, // },
}, }
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>