添加商品
This commit is contained in:
余同学
parent
22516acb2b
commit
5305dcafb5
|
|
@ -0,0 +1,202 @@
|
|||
<template>
|
||||
<div>
|
||||
<obj-modal
|
||||
ref="modal"
|
||||
labelWidth="150px"
|
||||
:modalConfig="modalConfig"
|
||||
:modalData="modalData"
|
||||
:modalHandles="modalHandles"
|
||||
>
|
||||
<div slot="dialog__content">
|
||||
<el-alert class="Example" title="需要注意的事项" type="info">
|
||||
<template slot="title">
|
||||
<el-form label-width="80px">
|
||||
<el-form-item label="示例：">
|
||||
<div class="iconSize">属性名称：温度</div>
|
||||
<div class="iconSize">属性内容：常温；冷饮</div>
|
||||
<div class="iconSize">顾客下单时可选择【常温】 或 【冷饮】</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</template>
|
||||
</el-alert>
|
||||
<el-form
|
||||
:model="ruleForm"
|
||||
:rules="rules"
|
||||
ref="ruleForm"
|
||||
label-width="100px"
|
||||
class="demo-ruleForm"
|
||||
>
|
||||
<el-form-item label="属性名称：" prop="name">
|
||||
<el-input
|
||||
style="width: 80%"
|
||||
placeholder="请输入属性名称"
|
||||
v-model="ruleForm.name"
|
||||
clearable
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="属性内容：" prop="value">
|
||||
<el-tag
|
||||
:key="tag"
|
||||
v-for="tag in ruleForm.value"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(tag)"
|
||||
>
|
||||
{{ tag }}
|
||||
</el-tag>
|
||||
<el-input
|
||||
class="input-new-tag"
|
||||
v-if="inputVisible"
|
||||
v-model="inputValue"
|
||||
ref="saveTagInput"
|
||||
size="small"
|
||||
@keyup.enter.native="handleInputConfirm"
|
||||
@blur="handleInputConfirm"
|
||||
>
|
||||
</el-input>
|
||||
<el-button
|
||||
v-else
|
||||
class="button-new-tag"
|
||||
size="small"
|
||||
@click="showInput"
|
||||
>+添加内容</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</obj-modal>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { debounce, cloneDeep } from "lodash";
|
||||
export default {
|
||||
components: {},
|
||||
data() {
|
||||
return {
|
||||
isAdd: true,
|
||||
//表格属性
|
||||
modalConfig: {
|
||||
title: "属性",
|
||||
show: false,
|
||||
width: "80%",
|
||||
},
|
||||
modalData: {},
|
||||
inputValue: "",
|
||||
inputVisible: false,
|
||||
ruleForm: {
|
||||
name: "",
|
||||
value: [],
|
||||
},
|
||||
rules: {
|
||||
name: [{ required: true, message: "请输入属性名称", trigger: "blur" }],
|
||||
value: [
|
||||
{
|
||||
required: true,
|
||||
message: "请输入属性内容",
|
||||
trigger: "blur",
|
||||
},
|
||||
],
|
||||
},
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
queryTableData(pageNo, pageSize) {},
|
||||
toggle(e) {
|
||||
if (this.modalConfig.show == false) {
|
||||
this.modalConfig.show = true;
|
||||
} else {
|
||||
this.modalConfig.show = false;
|
||||
}
|
||||
if (e) {
|
||||
this.init(cloneDeep(e.row));
|
||||
}
|
||||
return {
|
||||
add: () => {
|
||||
this.modalConfig.title = "添加属性";
|
||||
this.$nextTick(() => {
|
||||
this.modalData = {};
|
||||
this.$refs.ruleForm.resetFields();
|
||||
});
|
||||
this.isAdd = true;
|
||||
},
|
||||
update: () => {
|
||||
this.isAdd = false;
|
||||
},
|
||||
};
|
||||
},
|
||||
init(row) {
|
||||
this.modalData = row;
|
||||
},
|
||||
handleClose(tag) {
|
||||
this.ruleForm.value.splice(this.ruleForm.value.indexOf(tag), 1);
|
||||
},
|
||||
//聚焦
|
||||
showInput() {
|
||||
this.inputVisible = true;
|
||||
this.$nextTick((_) => {
|
||||
this.$refs.saveTagInput.$refs.input.focus();
|
||||
});
|
||||
},
|
||||
handleInputConfirm() {
|
||||
let inputValue = this.inputValue;
|
||||
if (inputValue) {
|
||||
this.ruleForm.value.push(inputValue);
|
||||
}
|
||||
this.inputVisible = false;
|
||||
this.inputValue = "";
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
modalHandles() {
|
||||
return [
|
||||
{
|
||||
label: "取消",
|
||||
handle: () => {
|
||||
this.toggle();
|
||||
},
|
||||
},
|
||||
{
|
||||
label: this.isAdd ? "确认添加" : "确认修改",
|
||||
type: "primary",
|
||||
loading: this.isLoading,
|
||||
// submit: true,
|
||||
handle: () => {
|
||||
this.$refs.ruleForm.validate((valid) => {
|
||||
if (valid) {
|
||||
this.$emit("getAttribute", this.ruleForm);
|
||||
this.toggle();
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
];
|
||||
},
|
||||
},
|
||||
asyncComputed: {},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.Example {
|
||||
margin: 0 0 20px 20px;
|
||||
width: 80%;
|
||||
}
|
||||
.iconSize {
|
||||
font-size: 15px;
|
||||
// padding: 3px;
|
||||
}
|
||||
.el-tag + .el-tag {
|
||||
margin-left: 10px;
|
||||
}
|
||||
.button-new-tag {
|
||||
margin-left: 10px;
|
||||
height: 32px;
|
||||
line-height: 30px;
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.input-new-tag {
|
||||
width: 90px;
|
||||
margin-left: 10px;
|
||||
vertical-align: bottom;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -17,14 +17,24 @@
|
|||
</el-tabs>
|
||||
</template>
|
||||
</obj-modal>
|
||||
<addSpecifications ref="addSpecifications"></addSpecifications>
|
||||
<!-- 添加规格 -->
|
||||
<addSpecifications
|
||||
@getSpecs="getSpecs"
|
||||
ref="addSpecifications"
|
||||
></addSpecifications>
|
||||
<!-- 属性 -->
|
||||
<addAttribute
|
||||
@getAttribute="getAttribute"
|
||||
ref="addAttribute"
|
||||
></addAttribute>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import addAttribute from "./add-attribute.vue";
|
||||
import addSpecifications from "./add-specifications.vue";
|
||||
import { debounce, cloneDeep } from "lodash";
|
||||
export default {
|
||||
components: { addSpecifications },
|
||||
components: { addSpecifications, addAttribute },
|
||||
data() {
|
||||
return {
|
||||
currentPanel: "基础信息",
|
||||
|
|
@ -84,7 +94,7 @@ export default {
|
|||
minSalePrice: 10,
|
||||
salePrice: 20,
|
||||
sort: 999,
|
||||
status: "DOWN",
|
||||
status: "DOWN", //up 上架 //DOWN 放入仓库
|
||||
stockNum: 200,
|
||||
specType: 1,
|
||||
productAttributeList: [
|
||||
|
|
@ -136,6 +146,7 @@ export default {
|
|||
fullscreen: true,
|
||||
},
|
||||
fileList: [], //回显图片
|
||||
place: "", //场地
|
||||
};
|
||||
},
|
||||
mounted() {},
|
||||
|
|
@ -153,6 +164,36 @@ export default {
|
|||
return {
|
||||
add: (item) => {
|
||||
console.log(item);
|
||||
this.$nextTick(() => {
|
||||
this.modalData = {
|
||||
description: "",
|
||||
merchantId: "",
|
||||
name: "",
|
||||
otherAttribute: "",
|
||||
productAttributeList: [],
|
||||
productCategoryId: "",
|
||||
productIntroducePhoto: "",
|
||||
productPhotoList: [],
|
||||
productPlace: "",
|
||||
productSpecificationList: [],
|
||||
productUnit: "",
|
||||
productVideo: "",
|
||||
shelfLife: "",
|
||||
shopId: "",
|
||||
singlePrice: "",
|
||||
singleStock: "",
|
||||
specType: "",
|
||||
status: "UP",
|
||||
};
|
||||
this.modalData.merchantId = JSON.parse(
|
||||
sessionStorage.getItem("userInfo")
|
||||
).merchantId;
|
||||
this.modalData.shopId = JSON.parse(
|
||||
sessionStorage.getItem("userInfo")
|
||||
).shopId;
|
||||
});
|
||||
console.log(this.modalData);
|
||||
|
||||
this.isAdd = true;
|
||||
},
|
||||
update: (row) => {
|
||||
|
|
@ -166,6 +207,34 @@ export default {
|
|||
console.log("123");
|
||||
this.$refs.addSpecifications.toggle().add();
|
||||
},
|
||||
//获取属性
|
||||
getSpecs(tableData, AttributeData, salePrice, stockNum) {
|
||||
let AttributeList = AttributeData.map((item) => {
|
||||
return {
|
||||
attributeName: item.attributeName,
|
||||
attributeValue: item.attributeValue.join(","),
|
||||
};
|
||||
});
|
||||
console.log(AttributeList);
|
||||
|
||||
this.$set(this.modalData, "productSpecificationList", tableData);
|
||||
this.$set(this.modalData, "productAttributeList", AttributeList);
|
||||
this.$set(this.modalData, "singlePrice", salePrice);
|
||||
this.$set(this.modalData, "singleStock", stockNum);
|
||||
},
|
||||
addAttribute() {
|
||||
this.$refs.addAttribute.toggle().add();
|
||||
},
|
||||
getAttribute(data) {
|
||||
console.log(data);
|
||||
this.modalData.otherAttribute = [
|
||||
{
|
||||
name: data.name,
|
||||
value: data.value.join(","),
|
||||
},
|
||||
];
|
||||
console.log(this.modalData);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
modalCols() {
|
||||
|
|
@ -184,18 +253,42 @@ export default {
|
|||
type: "jsx",
|
||||
render: () => {
|
||||
const handleChange = (file, fileList) => {
|
||||
// console.log(fileList);
|
||||
// console.log(fileList);
|
||||
};
|
||||
const handleAvatarSuccess = (res, file) => {
|
||||
console.log(res);
|
||||
this.modalData.productPhotoList.push(res);
|
||||
const handleAvatarSuccess = (res, file, fileList) => {
|
||||
console.log(res, fileList);
|
||||
this.modalData.productPhotoList = fileList.map(
|
||||
(item, index) => {
|
||||
if (index == 0) {
|
||||
return {
|
||||
isMain: 1,
|
||||
url: item.response.data,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
url: item.response.data,
|
||||
};
|
||||
}
|
||||
}
|
||||
);
|
||||
console.log(this.modalData.productPhotoList);
|
||||
};
|
||||
const handleRemove = (file, fileList) => {
|
||||
console.log(file, fileList);
|
||||
this.modalData.productPhotoList = fileList.map((item) => {
|
||||
return item.response;
|
||||
});
|
||||
this.modalData.productPhotoList = fileList.map(
|
||||
(item, index) => {
|
||||
if (index == 0) {
|
||||
return {
|
||||
isMain: 1,
|
||||
url: item.response.data,
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
url: item.response.data,
|
||||
};
|
||||
}
|
||||
}
|
||||
);
|
||||
console.log(this.modalData.productPhotoList);
|
||||
};
|
||||
return (
|
||||
|
|
@ -338,6 +431,9 @@ export default {
|
|||
render: () => {
|
||||
return (
|
||||
<el-input
|
||||
readonly={
|
||||
this.modalData.productSpecificationList.length > 0
|
||||
}
|
||||
placeholder="请输入价格"
|
||||
v-model={this.modalData.singlePrice}
|
||||
></el-input>
|
||||
|
|
@ -351,6 +447,9 @@ export default {
|
|||
render: () => {
|
||||
return (
|
||||
<el-input
|
||||
readonly={
|
||||
this.modalData.productSpecificationList.length > 0
|
||||
}
|
||||
placeholder="请输入库存"
|
||||
v-model={this.modalData.singleStock}
|
||||
></el-input>
|
||||
|
|
@ -362,7 +461,11 @@ export default {
|
|||
prop: "productAttributeList",
|
||||
type: "jsx",
|
||||
render: () => {
|
||||
return <el-button>添加其他属性</el-button>;
|
||||
return (
|
||||
<el-button onClick={this.addAttribute}>
|
||||
添加其他属性
|
||||
</el-button>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
|
|
@ -378,10 +481,12 @@ export default {
|
|||
render: () => {
|
||||
const change = (e) => {
|
||||
console.log(e);
|
||||
this.modalData.productPlace = e.join("-");
|
||||
console.log(aa);
|
||||
};
|
||||
return (
|
||||
<el-cascader
|
||||
v-model={this.modalData.productPlace}
|
||||
v-model={this.place}
|
||||
onChange={change}
|
||||
options={this.$api.mer_admin.getCityOptions()}
|
||||
{...{
|
||||
|
|
@ -426,16 +531,27 @@ export default {
|
|||
type: "jsx",
|
||||
render: () => {
|
||||
const handleChange = (file, fileList) => {
|
||||
console.log(fileList);
|
||||
// console.log(fileList);
|
||||
};
|
||||
const handleAvatarSuccess = (res) => {
|
||||
this.modalData.productIntroducePhoto = res.data;
|
||||
console.log(this.modalData.productIntroducePhoto);
|
||||
};
|
||||
const handleRemove = () => {
|
||||
this.modalData.productIntroducePhoto = "";
|
||||
console.log(this.modalData.productIntroducePhoto);
|
||||
};
|
||||
return (
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
drag
|
||||
action={this.$api.mer_admin.uploadFile()}
|
||||
limit={1}
|
||||
{...{
|
||||
props: {
|
||||
"on-change": handleChange,
|
||||
"on-success": handleAvatarSuccess,
|
||||
"on-remove": handleRemove,
|
||||
},
|
||||
}}
|
||||
headers={{
|
||||
|
|
@ -468,14 +584,23 @@ export default {
|
|||
const handleChange = (file, fileList) => {
|
||||
console.log(fileList);
|
||||
};
|
||||
const handleAvatarSuccess = (res) => {
|
||||
this.modalData.productVideo = res.data;
|
||||
};
|
||||
const handleRemove = () => {
|
||||
this.modalData.productVideo = "";
|
||||
};
|
||||
return (
|
||||
<el-upload
|
||||
class="upload-demo"
|
||||
drag
|
||||
action={this.$api.mer_admin.uploadFile()}
|
||||
limit={1}
|
||||
{...{
|
||||
props: {
|
||||
"on-change": handleChange,
|
||||
"on-success": handleAvatarSuccess,
|
||||
"on-remove": handleRemove,
|
||||
},
|
||||
}}
|
||||
headers={{
|
||||
|
|
@ -514,7 +639,10 @@ export default {
|
|||
} else if (this.currentPanel == "销售信息") {
|
||||
this.currentPanel = "其他信息";
|
||||
} else {
|
||||
console.log("请求接口");
|
||||
console.log("请求接口", this.modalData);
|
||||
this.$api.mer_admin.saveProduct(this.modalData).then((res) => {
|
||||
console.log(res);
|
||||
});
|
||||
}
|
||||
}, 300),
|
||||
},
|
||||
|
|
|
|||
|
|
@ -8,50 +8,75 @@
|
|||
:modalHandles="modalHandles"
|
||||
>
|
||||
<div slot="dialog__content">
|
||||
<div>
|
||||
<div v-for="(item, index) in AttributeData" :key="index">
|
||||
<el-row>
|
||||
<el-input
|
||||
style="width: 80%; margin: 0 20px 0 0"
|
||||
placeholder="请输入内容"
|
||||
v-model="input"
|
||||
placeholder="请输入属性"
|
||||
v-model="item.attributeName"
|
||||
clearable
|
||||
>
|
||||
</el-input>
|
||||
<el-button type="danger" icon="el-icon-delete" circle></el-button>
|
||||
<el-button
|
||||
@click="deleteAttribute(index)"
|
||||
type="danger"
|
||||
icon="el-icon-delete"
|
||||
circle
|
||||
></el-button>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-tag
|
||||
:key="tag"
|
||||
v-for="tag in dynamicTags"
|
||||
v-for="tag in item.attributeValue"
|
||||
closable
|
||||
:disable-transitions="false"
|
||||
@close="handleClose(tag)"
|
||||
@close="handleClose(index, tag)"
|
||||
>
|
||||
{{ tag }}
|
||||
</el-tag>
|
||||
<el-input
|
||||
class="input-new-tag"
|
||||
v-if="inputVisible"
|
||||
v-if="item.inputVisible"
|
||||
v-model="inputValue"
|
||||
ref="saveTagInput"
|
||||
:ref="`saveTagInput${index}`"
|
||||
size="small"
|
||||
@keyup.enter.native="handleInputConfirm"
|
||||
@blur="handleInputConfirm"
|
||||
@keyup.enter.native="handleInputConfirm(index)"
|
||||
@blur="handleInputConfirm(index)"
|
||||
>
|
||||
</el-input>
|
||||
<el-button
|
||||
v-else
|
||||
class="button-new-tag"
|
||||
size="small"
|
||||
@click="showInput"
|
||||
@click="showInput(index)"
|
||||
>+新增规格</el-button
|
||||
></el-row
|
||||
>
|
||||
</div>
|
||||
<el-row type="flex" justify="center">
|
||||
<el-button @click="addAttribute" type="text">+添加其他属性</el-button></el-row
|
||||
<el-button @click="addAttribute" type="text"
|
||||
>+添加其他属性</el-button
|
||||
></el-row
|
||||
>
|
||||
<obj-table-plus
|
||||
slot="dialog__after"
|
||||
style="height: 50vh"
|
||||
ref="oTable"
|
||||
@query="queryTableData"
|
||||
v-model="tableData"
|
||||
:tableCols="tableCols"
|
||||
:tableProp="tableProp"
|
||||
:toolbarProp="toolbarProp"
|
||||
:tableEvent="tableEvent"
|
||||
:enableAutoQuery="false"
|
||||
>
|
||||
<!-- <div slot="tableTop" class="mb-2">
|
||||
<el-button type="primary" size="mini" @click="calculation"
|
||||
>计算属性</el-button
|
||||
>
|
||||
</div> -->
|
||||
</obj-table-plus>
|
||||
</div>
|
||||
</obj-modal>
|
||||
</div>
|
||||
|
|
@ -66,20 +91,33 @@ export default {
|
|||
//监控对象数据
|
||||
tableData: [],
|
||||
//表格属性
|
||||
tableProp: {},
|
||||
//表格属性
|
||||
tableProp: {
|
||||
height: "auto",
|
||||
border: true,
|
||||
"auto-resize": false,
|
||||
"print-config": {},
|
||||
"row-config": { isCurrent: true, isHover: true },
|
||||
"highlight-hover-row": true,
|
||||
"highlight-current-row": true,
|
||||
},
|
||||
toolbarProp: {},
|
||||
tableEvent: {},
|
||||
modalConfig: {
|
||||
title: "属性",
|
||||
show: false,
|
||||
width: "80%",
|
||||
},
|
||||
modalData: {},
|
||||
AttributeData:[{
|
||||
attributeName:"",
|
||||
attributeValue:[]
|
||||
}], //
|
||||
AttributeData: [
|
||||
{
|
||||
attributeName: "",
|
||||
attributeValue: [],
|
||||
inputVisible: false,
|
||||
},
|
||||
], //
|
||||
input: "",
|
||||
dynamicTags: [],
|
||||
inputVisible: false,
|
||||
inputValue: "",
|
||||
};
|
||||
},
|
||||
|
|
@ -111,29 +149,164 @@ export default {
|
|||
init(row) {
|
||||
this.modalData = row;
|
||||
},
|
||||
handleClose(tag) {
|
||||
this.dynamicTags.splice(this.dynamicTags.indexOf(tag), 1);
|
||||
handleClose(index, tag) {
|
||||
this.AttributeData[index].attributeValue.splice(
|
||||
this.AttributeData[index].attributeValue.indexOf(tag),
|
||||
1
|
||||
);
|
||||
},
|
||||
showInput() {
|
||||
this.inputVisible = true;
|
||||
this.$nextTick((_) => {
|
||||
this.$refs.saveTagInput.$refs.input.focus();
|
||||
//聚焦
|
||||
showInput(index) {
|
||||
console.log(index);
|
||||
|
||||
this.AttributeData[index].inputVisible = true;
|
||||
this.$nextTick(() => {
|
||||
console.log(this.$refs[`saveTagInput${index}`]);
|
||||
this.$refs[`saveTagInput${index}`][0].focus();
|
||||
});
|
||||
},
|
||||
handleInputConfirm() {
|
||||
handleInputConfirm(index) {
|
||||
let inputValue = this.inputValue;
|
||||
if (inputValue) {
|
||||
this.dynamicTags.push(inputValue);
|
||||
this.AttributeData[index].attributeValue.push(inputValue);
|
||||
}
|
||||
this.inputVisible = false;
|
||||
this.AttributeData[index].inputVisible = false;
|
||||
this.inputValue = "";
|
||||
this.calculation();
|
||||
},
|
||||
//添加属性
|
||||
addAttribute() {
|
||||
console.log("添加属性");
|
||||
this.AttributeData.push({
|
||||
attributeName: "",
|
||||
attributeValue: [],
|
||||
inputVisible: false,
|
||||
});
|
||||
console.log(this.AttributeData);
|
||||
},
|
||||
//删除属性
|
||||
deleteAttribute(index) {
|
||||
this.AttributeData.splice(index, 1);
|
||||
this.calculation();
|
||||
},
|
||||
//计算属性
|
||||
calculation() {
|
||||
let data = [];
|
||||
let list = [];
|
||||
for (let i = 0; i < this.AttributeData.length; i++) {
|
||||
if (i == 0) {
|
||||
data = this.AttributeData[i].attributeValue.map((item) => {
|
||||
return this.AttributeData[i].attributeName + item;
|
||||
});
|
||||
} else {
|
||||
data.forEach((it) => {
|
||||
this.AttributeData[i].attributeValue.forEach((e) => {
|
||||
let name = this.AttributeData[i].attributeName;
|
||||
list.push(it + "/" + name + e);
|
||||
});
|
||||
});
|
||||
data = list;
|
||||
list = [];
|
||||
}
|
||||
}
|
||||
this.tableData = data.map((item) => {
|
||||
return {
|
||||
attributeValue: item,
|
||||
salePrice: "",
|
||||
costPrice: "",
|
||||
stockNum: "",
|
||||
};
|
||||
});
|
||||
console.log(data);
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
tableCols() {
|
||||
return [
|
||||
{ title: "序号", type: "seq", width: "60px", fixed: "left" },
|
||||
{
|
||||
title: "属性",
|
||||
field: "attributeValue",
|
||||
align: "center",
|
||||
"min-width": "160px",
|
||||
},
|
||||
{
|
||||
title: "价格",
|
||||
field: "salePrice",
|
||||
align: "center",
|
||||
"min-width": "160px",
|
||||
type: "jsx",
|
||||
render: ({ row }) => {
|
||||
return (
|
||||
<div>
|
||||
<el-input-number
|
||||
min={0}
|
||||
size="small"
|
||||
v-model={row.salePrice}
|
||||
placeholder="请输入价格"
|
||||
></el-input-number>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "成本",
|
||||
field: "costPrice",
|
||||
align: "center",
|
||||
"min-width": "160px",
|
||||
type: "jsx",
|
||||
render: ({ row }) => {
|
||||
return (
|
||||
<div>
|
||||
<el-input-number
|
||||
min={0}
|
||||
size="small"
|
||||
v-model={row.costPrice}
|
||||
placeholder="请输入成本"
|
||||
></el-input-number>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "库存",
|
||||
field: "stockNum",
|
||||
align: "center",
|
||||
"min-width": "160px",
|
||||
type: "jsx",
|
||||
render: ({ row }) => {
|
||||
return (
|
||||
<div>
|
||||
<el-input-number
|
||||
min={0}
|
||||
size="small"
|
||||
v-model={row.stockNum}
|
||||
placeholder="请输入库存"
|
||||
></el-input-number>
|
||||
</div>
|
||||
);
|
||||
},
|
||||
},
|
||||
{
|
||||
title: "操作",
|
||||
fixed: "right",
|
||||
width: "150px",
|
||||
type: "jsx",
|
||||
align: "center",
|
||||
render: (row) => {
|
||||
let remove = () => {
|
||||
this.tableData.splice(row.$rowIndex, 1);
|
||||
};
|
||||
return (
|
||||
<el-popconfirm onConfirm={remove} title="确认删除？" class="ml-1">
|
||||
<el-button type="danger" size="mini" slot="reference">
|
||||
删除
|
||||
</el-button>
|
||||
</el-popconfirm>
|
||||
);
|
||||
},
|
||||
},
|
||||
];
|
||||
},
|
||||
modalHandles() {
|
||||
return [
|
||||
{
|
||||
|
|
@ -147,7 +320,53 @@ export default {
|
|||
type: "primary",
|
||||
loading: this.isLoading,
|
||||
// submit: true,
|
||||
handle: () => {},
|
||||
handle: () => {
|
||||
let salePrice = ""; //价格范围
|
||||
let stockNum = ""; //库存范围
|
||||
let minSalePrice = Math.min.apply(
|
||||
Math,
|
||||
this.tableData.map((item) => {
|
||||
return item.salePrice;
|
||||
})
|
||||
);
|
||||
let maxSalePrice = Math.max.apply(
|
||||
Math,
|
||||
this.tableData.map((item) => {
|
||||
return item.salePrice;
|
||||
})
|
||||
);
|
||||
let minStockNum = Math.min.apply(
|
||||
Math,
|
||||
this.tableData.map((item) => {
|
||||
return item.stockNum;
|
||||
})
|
||||
);
|
||||
let maxStockNum = Math.max.apply(
|
||||
Math,
|
||||
this.tableData.map((item) => {
|
||||
return item.stockNum;
|
||||
})
|
||||
);
|
||||
if (minSalePrice == maxSalePrice) {
|
||||
salePrice = maxSalePrice;
|
||||
} else {
|
||||
salePrice = minSalePrice + "~" + maxSalePrice;
|
||||
}
|
||||
if (minStockNum == maxStockNum) {
|
||||
stockNum = maxStockNum;
|
||||
} else {
|
||||
stockNum = minStockNum + "~" + maxStockNum;
|
||||
}
|
||||
|
||||
this.$emit(
|
||||
"getSpecs",
|
||||
this.tableData,
|
||||
this.AttributeData,
|
||||
salePrice,
|
||||
stockNum
|
||||
);
|
||||
this.toggle();
|
||||
},
|
||||
},
|
||||
];
|
||||
},
|
||||
|
|
|
|||
Loading…
Reference in New Issue