Merge branch 'master' of https://gitee.com/objstudio/merchant-backend
This commit is contained in:
KangKang0928
commit
2184af66c9
|
|
@ -1,109 +1,124 @@
|
||||||
<template>
|
<template>
|
||||||
<div>
|
<div>
|
||||||
<obj-table-plus ref="oTable" :tableCols="tableCols" @query="queryList" v-model="dataList">
|
<obj-table-plus
|
||||||
<template slot="tableTop">
|
ref="oTable"
|
||||||
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
:tableCols="tableCols"
|
||||||
<el-form-item label="平台分类">
|
@query="queryList"
|
||||||
<el-select v-model="formInline.region" placeholder="活动区域">
|
v-model="dataList"
|
||||||
<el-option label="区域一" value="shanghai"></el-option>
|
>
|
||||||
<el-option label="区域二" value="beijing"></el-option>
|
<template slot="tableTop">
|
||||||
</el-select>
|
<el-form :inline="true" :model="formInline" class="demo-form-inline">
|
||||||
</el-form-item>
|
<el-form-item label="平台分类">
|
||||||
<el-form-item label="商户分类">
|
<el-select v-model="formInline.region" placeholder="活动区域">
|
||||||
<el-select v-model="formInline.region" placeholder="活动区域">
|
<el-option label="区域一" value="shanghai"></el-option>
|
||||||
<el-option label="区域一" value="shanghai"></el-option>
|
<el-option label="区域二" value="beijing"></el-option>
|
||||||
<el-option label="区域二" value="beijing"></el-option>
|
</el-select>
|
||||||
</el-select>
|
</el-form-item>
|
||||||
</el-form-item>
|
<el-form-item label="商户分类">
|
||||||
<el-form-item label="商品搜索">
|
<el-select v-model="formInline.region" placeholder="活动区域">
|
||||||
<el-input v-model="formInline.user" placeholder="商品搜索"></el-input>
|
<el-option label="区域一" value="shanghai"></el-option>
|
||||||
</el-form-item>
|
<el-option label="区域二" value="beijing"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="商品搜索">
|
||||||
|
<el-input
|
||||||
|
v-model="formInline.user"
|
||||||
|
placeholder="商品搜索"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
|
||||||
<el-form-item>
|
<el-form-item>
|
||||||
<el-button type="primary" @click="$refs.oTable.reload()">查询</el-button>
|
<el-button type="primary" @click="$refs.oTable.reload()"
|
||||||
</el-form-item>
|
>查询</el-button
|
||||||
</el-form>
|
>
|
||||||
<el-tabs v-model="activeName" @tab-click="$refs.oTable.reload()">
|
</el-form-item>
|
||||||
<el-tab-pane label="出售中" name="出售中"></el-tab-pane>
|
</el-form>
|
||||||
<el-tab-pane label="仓库中" name="仓库中"></el-tab-pane>
|
<el-tabs v-model="activeName" @tab-click="$refs.oTable.reload()">
|
||||||
<el-tab-pane label="已售罄" name="已售罄"></el-tab-pane>
|
<el-tab-pane label="出售中" name="出售中"></el-tab-pane>
|
||||||
<el-tab-pane label="警戒库存" name="警戒库存"></el-tab-pane>
|
<el-tab-pane label="仓库中" name="仓库中"></el-tab-pane>
|
||||||
</el-tabs>
|
<el-tab-pane label="已售罄" name="已售罄"></el-tab-pane>
|
||||||
<div class="mb-2">
|
<el-tab-pane label="警戒库存" name="警戒库存"></el-tab-pane>
|
||||||
<el-button type="primary" size="small" @click="addProduct">添加商品</el-button>
|
</el-tabs>
|
||||||
</div>
|
<div class="mb-2">
|
||||||
</template>
|
<el-button type="primary" size="small" @click="addProduct"
|
||||||
</obj-table-plus>
|
>添加商品</el-button
|
||||||
<add-or-update ref="addOrUpdate"></add-or-update>
|
>
|
||||||
</div>
|
</div>
|
||||||
|
</template>
|
||||||
|
</obj-table-plus>
|
||||||
|
<add-or-update ref="addOrUpdate"></add-or-update>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import AddOrUpdate from "./popup/add-or-update.vue"
|
import AddOrUpdate from "./popup/add-or-update.vue";
|
||||||
export default {
|
export default {
|
||||||
components:{AddOrUpdate},
|
components: { AddOrUpdate },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
activeName: "出售中",
|
activeName: "出售中",
|
||||||
dataList: [],
|
dataList: [],
|
||||||
formInline: {
|
formInline: {
|
||||||
user: '',
|
user: "",
|
||||||
region: ''
|
region: "",
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addProduct() {
|
||||||
|
this.$refs.addOrUpdate.toggle().add();
|
||||||
},
|
},
|
||||||
methods: {
|
queryList(pageNo, pageSize) {
|
||||||
addProduct(){
|
this.$api.mer_admin
|
||||||
this.$refs.addOrUpdate.toggle().add()
|
.getProductPage({
|
||||||
|
p: {
|
||||||
|
pageNumber: pageNo,
|
||||||
|
pageSize: pageSize,
|
||||||
|
},
|
||||||
|
})
|
||||||
|
.then((res) => {
|
||||||
|
console.log(res);
|
||||||
|
this.$refs.oTable.complete(
|
||||||
|
res.data.data.data,
|
||||||
|
Number(res.data.data.total)
|
||||||
|
);
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
this.$refs.oTable.complete(false);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
tableCols() {
|
||||||
|
return [
|
||||||
|
{
|
||||||
|
title: "ID",
|
||||||
},
|
},
|
||||||
queryList(pageNo, pageSize) {
|
{
|
||||||
this.$api.mer_admin.getProductPage({
|
title: "商品图",
|
||||||
p: {
|
},
|
||||||
pageNumber: pageNo,
|
{
|
||||||
pageSize: pageSize
|
title: "商品名称",
|
||||||
}
|
},
|
||||||
})
|
{
|
||||||
.then(res => {
|
title: "商品售价",
|
||||||
console.log(res);
|
},
|
||||||
this.$refs.oTable.complete(res.data.data.data, Number(res.data.data.total));
|
{
|
||||||
|
title: "销量",
|
||||||
})
|
},
|
||||||
.catch(err => {
|
{
|
||||||
this.$refs.oTable.complete(false);
|
title: "库存",
|
||||||
})
|
},
|
||||||
}
|
{
|
||||||
|
title: "状态",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "操作",
|
||||||
|
},
|
||||||
|
];
|
||||||
},
|
},
|
||||||
computed: {
|
},
|
||||||
tableCols() {
|
};
|
||||||
return [
|
|
||||||
{
|
|
||||||
title: "ID"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "商品图",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "商品名称"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "商品售价"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "销量"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "库存"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "状态"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: "操作"
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
},
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped></style>
|
||||||
|
|
@ -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>
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -0,0 +1,396 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<obj-modal
|
||||||
|
ref="modal"
|
||||||
|
labelWidth="150px"
|
||||||
|
:modalConfig="modalConfig"
|
||||||
|
:modalData="modalData"
|
||||||
|
:modalHandles="modalHandles"
|
||||||
|
>
|
||||||
|
<div slot="dialog__content">
|
||||||
|
<div v-for="(item, index) in AttributeData" :key="index">
|
||||||
|
<el-row>
|
||||||
|
<el-input
|
||||||
|
style="width: 80%; margin: 0 20px 0 0"
|
||||||
|
placeholder="请输入属性"
|
||||||
|
v-model="item.attributeName"
|
||||||
|
clearable
|
||||||
|
>
|
||||||
|
</el-input>
|
||||||
|
<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 item.attributeValue"
|
||||||
|
closable
|
||||||
|
:disable-transitions="false"
|
||||||
|
@close="handleClose(index, tag)"
|
||||||
|
>
|
||||||
|
{{ tag }}
|
||||||
|
</el-tag>
|
||||||
|
<el-input
|
||||||
|
class="input-new-tag"
|
||||||
|
v-if="item.inputVisible"
|
||||||
|
v-model="inputValue"
|
||||||
|
:ref="`saveTagInput${index}`"
|
||||||
|
size="small"
|
||||||
|
@keyup.enter.native="handleInputConfirm(index)"
|
||||||
|
@blur="handleInputConfirm(index)"
|
||||||
|
>
|
||||||
|
</el-input>
|
||||||
|
<el-button
|
||||||
|
v-else
|
||||||
|
class="button-new-tag"
|
||||||
|
size="small"
|
||||||
|
@click="showInput(index)"
|
||||||
|
>+新增规格</el-button
|
||||||
|
></el-row
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<el-row type="flex" justify="center">
|
||||||
|
<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>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { debounce, cloneDeep } from "lodash";
|
||||||
|
export default {
|
||||||
|
components: {},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isAdd: true,
|
||||||
|
//监控对象数据
|
||||||
|
tableData: [],
|
||||||
|
//表格属性
|
||||||
|
//表格属性
|
||||||
|
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: [],
|
||||||
|
inputVisible: false,
|
||||||
|
},
|
||||||
|
], //
|
||||||
|
input: "",
|
||||||
|
dynamicTags: [],
|
||||||
|
inputValue: "",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
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.modal.resetFields();
|
||||||
|
});
|
||||||
|
this.isAdd = true;
|
||||||
|
},
|
||||||
|
update: () => {
|
||||||
|
this.isAdd = false;
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
init(row) {
|
||||||
|
this.modalData = row;
|
||||||
|
},
|
||||||
|
handleClose(index, tag) {
|
||||||
|
this.AttributeData[index].attributeValue.splice(
|
||||||
|
this.AttributeData[index].attributeValue.indexOf(tag),
|
||||||
|
1
|
||||||
|
);
|
||||||
|
},
|
||||||
|
//聚焦
|
||||||
|
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(index) {
|
||||||
|
let inputValue = this.inputValue;
|
||||||
|
if (inputValue) {
|
||||||
|
this.AttributeData[index].attributeValue.push(inputValue);
|
||||||
|
}
|
||||||
|
this.AttributeData[index].inputVisible = false;
|
||||||
|
this.inputValue = "";
|
||||||
|
this.calculation();
|
||||||
|
},
|
||||||
|
//添加属性
|
||||||
|
addAttribute() {
|
||||||
|
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 [
|
||||||
|
{
|
||||||
|
label: "取消",
|
||||||
|
handle: () => {
|
||||||
|
this.toggle();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
label: this.isAdd ? "确认添加" : "确认修改",
|
||||||
|
type: "primary",
|
||||||
|
loading: this.isLoading,
|
||||||
|
// submit: true,
|
||||||
|
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();
|
||||||
|
},
|
||||||
|
},
|
||||||
|
];
|
||||||
|
},
|
||||||
|
},
|
||||||
|
asyncComputed: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.el-row {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.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>
|
||||||
Loading…
Reference in New Issue