|
@@ -14,11 +14,11 @@
|
|
|
<span class="tip-label">提示:</span>
|
|
|
<div class="tip-content">
|
|
|
在输入框中输入不存在的规格或规格值后回车,即可添加自定义规格或规格值
|
|
|
- <br/>
|
|
|
+ <br />
|
|
|
只有第一个规格可以添加规格值图片
|
|
|
</div>
|
|
|
</div>
|
|
|
- <template v-for="(sp, sp_index) in skuForm.selectedSpecs" >
|
|
|
+ <template v-for="(sp, sp_index) in skuForm.selectedSpecs">
|
|
|
<el-form-item label="规格名:" class="spec-name">
|
|
|
<el-select
|
|
|
v-model="sp.spec_id"
|
|
@@ -33,26 +33,51 @@
|
|
|
:disabled="computedDisabledSpec(option.spec_id)"
|
|
|
/>
|
|
|
</el-select>
|
|
|
- <el-button icon="el-icon-delete" class="del-btn" @click="handleDeleteSpec(sp_index)"/>
|
|
|
- <el-checkbox v-if="sp_index === 0" label="规格图片" v-model="sp.has_spec_image"/>
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-delete"
|
|
|
+ class="del-btn"
|
|
|
+ @click="handleDeleteSpec(sp_index)"
|
|
|
+ />
|
|
|
+ <el-checkbox
|
|
|
+ v-if="sp_index === 0"
|
|
|
+ label="规格图片"
|
|
|
+ v-model="sp.has_spec_image"
|
|
|
+ />
|
|
|
</el-form-item>
|
|
|
- <el-form-item label="规格值:" class="spec-values" :class="{'no-spec-val': sp.spec_value_list.length === 0}">
|
|
|
- <div v-for="(sv, sv_index) in sp.spec_value_list" :key="sv_index" class="spec-value-item">
|
|
|
+ <el-form-item
|
|
|
+ label="规格值:"
|
|
|
+ class="spec-values"
|
|
|
+ :class="{ 'no-spec-val': sp.spec_value_list.length === 0 }"
|
|
|
+ >
|
|
|
+ <div
|
|
|
+ v-for="(sv, sv_index) in sp.spec_value_list"
|
|
|
+ :key="sv_index"
|
|
|
+ class="spec-value-item"
|
|
|
+ >
|
|
|
<div class="spec-value-select">
|
|
|
<el-select
|
|
|
v-model="sv.spec_value_id"
|
|
|
default-first-option
|
|
|
- @change="spec_val_id => handleSpecValChange(sp.spec_id, spec_val_id)"
|
|
|
+ @change="
|
|
|
+ (spec_val_id) =>
|
|
|
+ handleSpecValChange(sp.spec_id, spec_val_id)
|
|
|
+ "
|
|
|
>
|
|
|
<el-option
|
|
|
v-for="option in getSpecValueList(sp.spec_id)"
|
|
|
:key="option.spec_value_id"
|
|
|
:label="option.spec_value"
|
|
|
:value="option.spec_value_id"
|
|
|
- :disabled="computedDisabledSpecVal(sp.spec_id, option.spec_value_id)"
|
|
|
+ :disabled="
|
|
|
+ computedDisabledSpecVal(sp.spec_id, option.spec_value_id)
|
|
|
+ "
|
|
|
/>
|
|
|
</el-select>
|
|
|
- <el-button icon="el-icon-delete" class="del-btn" @click="handleDeleteSpecVal(sp_index, sv_index)"/>
|
|
|
+ <el-button
|
|
|
+ icon="el-icon-delete"
|
|
|
+ class="del-btn"
|
|
|
+ @click="handleDeleteSpecVal(sp_index, sv_index)"
|
|
|
+ />
|
|
|
</div>
|
|
|
<el-form-item
|
|
|
label=""
|
|
@@ -64,8 +89,13 @@
|
|
|
accept="image/*"
|
|
|
list-type="picture-card"
|
|
|
:action="MixinUploadApi"
|
|
|
- :file-list="sv.spec_image ? [{ url: sv.spec_image }] : undefined"
|
|
|
- :on-success="file => handleSpecValImgUploadSuccess(sp_index, sv_index, file)"
|
|
|
+ :file-list="
|
|
|
+ sv.spec_image ? [{ url: sv.spec_image }] : undefined
|
|
|
+ "
|
|
|
+ :on-success="
|
|
|
+ (file) =>
|
|
|
+ handleSpecValImgUploadSuccess(sp_index, sv_index, file)
|
|
|
+ "
|
|
|
:on-remove="() => handleSpecValImgRemove(sp_index, sv_index)"
|
|
|
:limit="1"
|
|
|
class="spec-value-upload"
|
|
@@ -74,9 +104,19 @@
|
|
|
</el-upload>
|
|
|
</el-form-item>
|
|
|
</div>
|
|
|
- <div class="spec-value-item" :class="{'has-img': sp.has_spec_image}">
|
|
|
- <el-button v-if="sp.spec_id" type="text" @click="handleAddSpecVal(sp_index)">添加规格值</el-button>
|
|
|
- <span v-else style="color: #999; font-size: 12px">请选择规格</span>
|
|
|
+ <div
|
|
|
+ class="spec-value-item"
|
|
|
+ :class="{ 'has-img': sp.has_spec_image }"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ v-if="sp.spec_id"
|
|
|
+ type="text"
|
|
|
+ @click="handleAddSpecVal(sp_index)"
|
|
|
+ >添加规格值</el-button
|
|
|
+ >
|
|
|
+ <span v-else style="color: #999; font-size: 12px"
|
|
|
+ >请选择规格</span
|
|
|
+ >
|
|
|
</div>
|
|
|
</el-form-item>
|
|
|
</template>
|
|
@@ -93,22 +133,32 @@
|
|
|
<span>{{ formatterSpecText(row) }}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
+ <!-- -->
|
|
|
<el-table-column label="序列号" align="center" v-if="haveSn">
|
|
|
<template v-slot="{ row }">
|
|
|
- <el-input
|
|
|
+ <el-input
|
|
|
onKeyUp="value=value.replace(/[\W]/g,'')"
|
|
|
v-model="row.sn_code"
|
|
|
:controls="false"
|
|
|
:max="99999999"
|
|
|
style="width: 95%"
|
|
|
- />
|
|
|
+ />
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column v-for="item in tableColumns" :key="item.key" align="center">
|
|
|
+ <el-table-column
|
|
|
+ v-for="item in tableColumns"
|
|
|
+ :key="item.key"
|
|
|
+ align="center"
|
|
|
+ >
|
|
|
<template v-slot:header="{ row }">
|
|
|
<div>
|
|
|
<span>{{ item.name }}</span>
|
|
|
- <el-tooltip v-if="!!item.tip" effect="dark" :content="item.tip" placement="top">
|
|
|
+ <el-tooltip
|
|
|
+ v-if="!!item.tip"
|
|
|
+ effect="dark"
|
|
|
+ :content="item.tip"
|
|
|
+ placement="top"
|
|
|
+ >
|
|
|
<i class="el-icon-warning" style="cursor: help"></i>
|
|
|
</el-tooltip>
|
|
|
<el-popover
|
|
@@ -123,11 +173,14 @@
|
|
|
label-position="right"
|
|
|
@submit.native.prevent
|
|
|
>
|
|
|
- <el-form-item v-if="item.batchForm.prefix !== false" label="前缀字符">
|
|
|
+ <el-form-item
|
|
|
+ v-if="item.batchForm.prefix !== false"
|
|
|
+ label="前缀字符"
|
|
|
+ >
|
|
|
<el-input
|
|
|
v-model="item.batchForm.prefix"
|
|
|
:maxlength="20"
|
|
|
- style="width: 100px;"
|
|
|
+ style="width: 100px"
|
|
|
placeholder="选填"
|
|
|
/>
|
|
|
</el-form-item>
|
|
@@ -148,7 +201,10 @@
|
|
|
style="width: 100px"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item v-if="item.batchForm.step !== false" label="递增步长">
|
|
|
+ <el-form-item
|
|
|
+ v-if="item.batchForm.step !== false"
|
|
|
+ label="递增步长"
|
|
|
+ >
|
|
|
<el-input-number
|
|
|
v-model="item.batchForm.step"
|
|
|
:controls="false"
|
|
@@ -157,7 +213,10 @@
|
|
|
placeholder="选填"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
- <el-form-item v-if="item.batchForm.pad_zero !== false" label="补零位数">
|
|
|
+ <el-form-item
|
|
|
+ v-if="item.batchForm.pad_zero !== false"
|
|
|
+ label="补零位数"
|
|
|
+ >
|
|
|
<el-input-number
|
|
|
v-model="item.batchForm.pad_zero"
|
|
|
:controls="false"
|
|
@@ -168,20 +227,29 @@
|
|
|
</el-form-item>
|
|
|
</el-form>
|
|
|
<div style="text-align: right; margin: 0">
|
|
|
- <el-button size="mini" type="text" @click="item.show_batch = false">取消</el-button>
|
|
|
- <el-button type="primary" size="mini" @click="handleBatchSetSkuParams(item)">确定</el-button>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ @click="item.show_batch = false"
|
|
|
+ >取消</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ size="mini"
|
|
|
+ @click="handleBatchSetSkuParams(item)"
|
|
|
+ >确定</el-button
|
|
|
+ >
|
|
|
</div>
|
|
|
<i slot="reference" class="el-icon-brush batch-btn"></i>
|
|
|
</el-popover>
|
|
|
-
|
|
|
</div>
|
|
|
</template>
|
|
|
<template v-slot="{ row, $index }">
|
|
|
- <span v-if="item.readonly">{{ row[item.key] || '-' }}</span>
|
|
|
+ <span v-if="item.readonly">{{ row[item.key] || "-" }}</span>
|
|
|
<el-form-item
|
|
|
v-else
|
|
|
:prop="`skuList.${$index}.${item.key}`"
|
|
|
- :class="{'hide-message': !showFormMessage}"
|
|
|
+ :class="{ 'hide-message': !showFormMessage }"
|
|
|
>
|
|
|
<el-input-number
|
|
|
v-if="item.type === 'Number'"
|
|
@@ -207,55 +275,59 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import * as Helper from './helper'
|
|
|
+import * as Helper from "./helper";
|
|
|
|
|
|
export default {
|
|
|
- name: 'SkuEditor',
|
|
|
+ name: "SkuEditor",
|
|
|
props: {
|
|
|
// 扩展参数
|
|
|
extendedParams: {
|
|
|
type: Array,
|
|
|
required: false,
|
|
|
- default: () => ([])
|
|
|
+ default: () => [],
|
|
|
},
|
|
|
// 显示表单错误信息
|
|
|
showFormMessage: {
|
|
|
type: Boolean,
|
|
|
required: false,
|
|
|
- default: false
|
|
|
+ default: false,
|
|
|
},
|
|
|
// 是否显示Label
|
|
|
showLabel: {
|
|
|
type: Boolean,
|
|
|
required: false,
|
|
|
- default: true
|
|
|
+ default: true,
|
|
|
},
|
|
|
// 是否显示规格
|
|
|
showSpecs: {
|
|
|
type: Boolean,
|
|
|
required: false,
|
|
|
- default: true
|
|
|
+ default: true,
|
|
|
},
|
|
|
categoryId: {
|
|
|
type: String,
|
|
|
- default: ''
|
|
|
+ default: "",
|
|
|
},
|
|
|
goodsInfo: {
|
|
|
type: Object,
|
|
|
- default: {}
|
|
|
+ default: {},
|
|
|
},
|
|
|
haveSpec: {
|
|
|
type: Boolean,
|
|
|
- default: false
|
|
|
+ default: false,
|
|
|
},
|
|
|
haveSn: {
|
|
|
type: Boolean,
|
|
|
- default: false
|
|
|
+ default: false,
|
|
|
+ },
|
|
|
+ hireOrSail: {
|
|
|
+ type: String,
|
|
|
+ default: "",
|
|
|
+ },
|
|
|
+ sku_sn: {
|
|
|
+ type: String,
|
|
|
+ default: "",
|
|
|
},
|
|
|
- hireOrSail:{
|
|
|
- type:String,
|
|
|
- default: ""
|
|
|
- }
|
|
|
},
|
|
|
data() {
|
|
|
return {
|
|
@@ -263,169 +335,208 @@ export default {
|
|
|
// goodsInfo: '',
|
|
|
skuForm: {
|
|
|
selectedSpecs: [],
|
|
|
- skuList: []
|
|
|
+ skuList: [],
|
|
|
},
|
|
|
specList: [],
|
|
|
tableColumns: [],
|
|
|
- rawSkuList: []
|
|
|
- }
|
|
|
+ rawSkuList: [],
|
|
|
+ };
|
|
|
},
|
|
|
computed: {
|
|
|
params() {
|
|
|
- return Helper.mergeParams(this.extendedParams, this.haveSpec)
|
|
|
+ return Helper.mergeParams(this.extendedParams, this.haveSpec);
|
|
|
},
|
|
|
skuRules() {
|
|
|
- return Helper.computedSkuRules(this.skuForm, this.params)
|
|
|
- }
|
|
|
+ return Helper.computedSkuRules(this.skuForm, this.params);
|
|
|
+ },
|
|
|
},
|
|
|
mounted() {
|
|
|
- this.init()
|
|
|
+ this.init();
|
|
|
},
|
|
|
watch: {
|
|
|
// 监听已选规格,自动生成表单
|
|
|
- 'skuForm.selectedSpecs': {
|
|
|
+ "skuForm.selectedSpecs": {
|
|
|
deep: true,
|
|
|
- handler: 'makeTableForm'
|
|
|
+ handler: "makeTableForm",
|
|
|
},
|
|
|
haveSpec: {
|
|
|
handler(val) {
|
|
|
- this.skuForm.selectedSpecs = []
|
|
|
- this.skuForm.skuList = []
|
|
|
- }
|
|
|
+ if(val){
|
|
|
+ //this.skuForm.skuList = [{}]
|
|
|
+ }else{
|
|
|
+ //this.skuForm.skuList = [{sku:sessionStorage.getItem('sn')+'0000'}];
|
|
|
+ }
|
|
|
+ this.skuForm.selectedSpecs = [];
|
|
|
+ this.skuForm.skuList = [];
|
|
|
+ },
|
|
|
},
|
|
|
categoryId: {
|
|
|
handler(val) {
|
|
|
if (val) {
|
|
|
- this.getSpecList()
|
|
|
+ this.getSpecList();
|
|
|
}
|
|
|
},
|
|
|
- immediate: true
|
|
|
+ immediate: true,
|
|
|
},
|
|
|
goodsInfo: {
|
|
|
handler(val) {
|
|
|
if (val.product_list) {
|
|
|
- this.init()
|
|
|
+ this.init();
|
|
|
}
|
|
|
},
|
|
|
- immediate: true
|
|
|
+ immediate: true,
|
|
|
+ },
|
|
|
+ sku_sn:{
|
|
|
+ handler(val) {
|
|
|
+ //this.skuForm.skuList = [{sku:sessionStorage.getItem('sn')+'0000'}];
|
|
|
+ },
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
// 初始化数据
|
|
|
async init() {
|
|
|
try {
|
|
|
- this.loading = true
|
|
|
- const goodsInfo = this.goodsInfo
|
|
|
+ this.loading = true;
|
|
|
+ const goodsInfo = this.goodsInfo;
|
|
|
+ console.log('goodsInfo',this.goodsInfo);
|
|
|
if (goodsInfo.product_list) {
|
|
|
// 获取规格列表
|
|
|
- this.getSpecList()
|
|
|
- this.skuForm.skuList = Helper.cloneJson(goodsInfo.product_list)
|
|
|
- this.rawSkuList = Helper.cloneJson(goodsInfo.product_list)
|
|
|
+ this.getSpecList();
|
|
|
+ this.skuForm.skuList = Helper.cloneJson(goodsInfo.product_list);
|
|
|
+ this.rawSkuList = Helper.cloneJson(goodsInfo.product_list);
|
|
|
// 初始化商品SKU中已选择的规格信息
|
|
|
- this.skuForm.selectedSpecs = Helper.initSelectedSpecs(this.skuForm.skuList)
|
|
|
+ this.skuForm.selectedSpecs = Helper.initSelectedSpecs(this.skuForm.skuList);
|
|
|
}
|
|
|
if (!this.haveSpec) {
|
|
|
- this.makeTableForm()
|
|
|
+ this.makeTableForm();
|
|
|
}
|
|
|
} finally {
|
|
|
- this.loading = false
|
|
|
+ this.loading = false;
|
|
|
}
|
|
|
},
|
|
|
// 获取规格列表
|
|
|
async getSpecList() {
|
|
|
- const category_id = this.goodsInfo.category_id || this.categoryId
|
|
|
- await Helper.getSpecsByCategoryId(category_id).then(res => {
|
|
|
- this.specList = res
|
|
|
- this.makeTableForm()
|
|
|
- })
|
|
|
+ const category_id = this.goodsInfo.category_id || this.categoryId;
|
|
|
+ await Helper.getSpecsByCategoryId(category_id).then((res) => {
|
|
|
+ this.specList = res;
|
|
|
+ this.makeTableForm();
|
|
|
+ });
|
|
|
},
|
|
|
// 获取商品sku信息
|
|
|
async getSkuList() {
|
|
|
- // const skuList = await Helper.getGoodsSkus(this.goodsId)
|
|
|
- this.skuForm.skuList = Helper.cloneJson(skuList)
|
|
|
- this.rawSkuList = Helper.cloneJson(skuList)
|
|
|
+ const skuList = await Helper.getGoodsSkus(this.goodsId)
|
|
|
+ this.skuForm.skuList = Helper.cloneJson(skuList);
|
|
|
+ this.rawSkuList = Helper.cloneJson(skuList);
|
|
|
},
|
|
|
// 生成表格表单
|
|
|
makeTableForm() {
|
|
|
- const specs = Helper.getSelectedSpecsFormSpecList(this.skuForm.selectedSpecs, this.specList)
|
|
|
- const table = Helper.makeTableForm(specs, this.params, this.skuForm.skuList, this.haveSpec,this.hireOrSail)
|
|
|
- if(this.hireOrSail=='sail'){
|
|
|
- this.tableColumns = table.columns.filter(el=>{
|
|
|
- return this.hireOrSail=='sail'&&el.name!=='日租金'
|
|
|
- })
|
|
|
- }else{
|
|
|
- this.tableColumns = table.columns
|
|
|
+ const specs = Helper.getSelectedSpecsFormSpecList(
|
|
|
+ this.skuForm.selectedSpecs,
|
|
|
+ this.specList
|
|
|
+ );
|
|
|
+ const table = Helper.makeTableForm(
|
|
|
+ specs,
|
|
|
+ this.params,
|
|
|
+ this.skuForm.skuList,
|
|
|
+ this.haveSpec,
|
|
|
+ this.hireOrSail
|
|
|
+ );
|
|
|
+ /**/ if (this.hireOrSail == "sail") {
|
|
|
+ this.tableColumns = table.columns.filter((el) => {
|
|
|
+ return this.hireOrSail == "sail" && el.name !== "日租金";
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.tableColumns = table.columns;
|
|
|
+
|
|
|
}
|
|
|
- console.log(this.tableColumns);
|
|
|
- this.skuForm.skuList = table.data
|
|
|
+ this.skuForm.skuList = table.data;
|
|
|
//如果是单规格,不用选择规格,默认给一个sku
|
|
|
- if(!this.haveSpec) {
|
|
|
- this.skuForm.skuList = [{}]
|
|
|
- }
|
|
|
+ /* if (!this.haveSpec) {
|
|
|
+ this.skuForm.skuList = [{}];
|
|
|
+ } */
|
|
|
},
|
|
|
// 获取规格下的规格值列表
|
|
|
getSpecValueList(spec_id) {
|
|
|
- const specVal = this.specList.find(item => item.spec_id === spec_id)
|
|
|
- return specVal ? specVal.value_list : []
|
|
|
+ const specVal = this.specList.find((item) => item.spec_id === spec_id);
|
|
|
+ return specVal ? specVal.value_list : [];
|
|
|
},
|
|
|
// 计算要禁用的规格
|
|
|
computedDisabledSpec(spec_id) {
|
|
|
- return this.skuForm.selectedSpecs.map(item => item.spec_id).includes(spec_id)
|
|
|
+ return this.skuForm.selectedSpecs
|
|
|
+ .map((item) => item.spec_id)
|
|
|
+ .includes(spec_id);
|
|
|
},
|
|
|
// 计算要禁用的规格值
|
|
|
computedDisabledSpecVal(spec_id, spec_value_id) {
|
|
|
- return this.skuForm
|
|
|
- .selectedSpecs.find(item => item.spec_id === spec_id)
|
|
|
- .spec_value_list.map(item => item.spec_value_id)
|
|
|
- .includes(spec_value_id)
|
|
|
+ return this.skuForm.selectedSpecs
|
|
|
+ .find((item) => item.spec_id === spec_id)
|
|
|
+ .spec_value_list.map((item) => item.spec_value_id)
|
|
|
+ .includes(spec_value_id);
|
|
|
},
|
|
|
// 添加规格
|
|
|
handleAddSpec() {
|
|
|
if (!this.goodsInfo.category_id && !this.categoryId) {
|
|
|
- this.$message.error('请先选择商品类别!')
|
|
|
- return
|
|
|
+ this.$message.error("请先选择商品类别!");
|
|
|
+ return;
|
|
|
}
|
|
|
- this.skuForm.selectedSpecs.push({ spec_id: '', has_spec_image: false, spec_value_list: [] })
|
|
|
+ this.skuForm.selectedSpecs.push({
|
|
|
+ spec_id: "",
|
|
|
+ has_spec_image: false,
|
|
|
+ spec_value_list: [],
|
|
|
+ });
|
|
|
},
|
|
|
// 添加规格值
|
|
|
handleAddSpecVal(index) {
|
|
|
- this.skuForm.selectedSpecs[index].spec_value_list.push({ spec_value_id: '' })
|
|
|
+ this.skuForm.selectedSpecs[index].spec_value_list.push({
|
|
|
+ spec_value_id: "",
|
|
|
+ spec_name:""
|
|
|
+ });
|
|
|
},
|
|
|
// 规格发生改变
|
|
|
async handleSpecChange(spec_id) {
|
|
|
- let spec = this.specList.find(sp => sp.spec_id === spec_id)
|
|
|
- const selectedSpec = this.skuForm.selectedSpecs.find(sp => sp.spec_id === spec_id)
|
|
|
- selectedSpec.spec_id = spec.spec_id
|
|
|
- selectedSpec.spec_value_list = []
|
|
|
+ let spec = this.specList.find((sp) => sp.spec_id === spec_id);
|
|
|
+ const selectedSpec = this.skuForm.selectedSpecs.find(
|
|
|
+ (sp) => sp.spec_id === spec_id
|
|
|
+ );
|
|
|
+ selectedSpec.spec_id = spec.spec_id;
|
|
|
+ selectedSpec.spec_value_list = [];
|
|
|
},
|
|
|
// 规格值发生改变
|
|
|
async handleSpecValChange(spec_id, spec_val_id) {
|
|
|
- let specVal = ''
|
|
|
- const specValueList = this.specList.find(sp => sp.spec_id === spec_id).value_list
|
|
|
+ let specVal = "";
|
|
|
+ const specValueList = this.specList.find(
|
|
|
+ (sp) => sp.spec_id === spec_id
|
|
|
+ ).value_list;
|
|
|
if (Array.isArray(specValueList)) {
|
|
|
- specVal = specValueList.find(sv => sv.spec_value_id === spec_val_id)
|
|
|
+ specVal = specValueList.find((sv) => sv.spec_value_id === spec_val_id);
|
|
|
}
|
|
|
- if (specVal) return
|
|
|
+ if (specVal) return;
|
|
|
},
|
|
|
// 格式化规格文字信息
|
|
|
formatterSpecText(row) {
|
|
|
- if (!Array.isArray(row.spec_list)) return '/'
|
|
|
- return row.spec_list.map(sv => sv.spec_value).join('/')
|
|
|
+ if (!Array.isArray(row.spec_list)) return "/";
|
|
|
+ return row.spec_list.map((sv) => sv.spec_value).join("/");
|
|
|
},
|
|
|
// 移除规格
|
|
|
async handleDeleteSpec(sp_index) {
|
|
|
try {
|
|
|
- const spec = this.skuForm.selectedSpecs[sp_index]
|
|
|
+ const spec = this.skuForm.selectedSpecs[sp_index];
|
|
|
if (spec.spec_id) {
|
|
|
- let msg = '确定要移除这个规格吗?'
|
|
|
- let has_spec = false
|
|
|
+ let msg = "确定要移除这个规格吗?";
|
|
|
+ let has_spec = false;
|
|
|
if (Array.isArray(spec.spec_value_list)) {
|
|
|
- has_spec = spec.spec_value_list.filter(sv => sv.spec_value_id).length !== 0
|
|
|
+ has_spec =
|
|
|
+ spec.spec_value_list.filter((sv) => sv.spec_value_id).length !==
|
|
|
+ 0;
|
|
|
}
|
|
|
- if (has_spec) msg = '移除后规格维度将发生改变,会导致已有规格数据丢失!确定要移除吗?'
|
|
|
- await this.$confirm(msg, '提示', { type: has_spec ? 'error' : 'warning' })
|
|
|
+ if (has_spec)
|
|
|
+ msg =
|
|
|
+ "移除后规格维度将发生改变,会导致已有规格数据丢失!确定要移除吗?";
|
|
|
+ await this.$confirm(msg, "提示", {
|
|
|
+ type: has_spec ? "error" : "warning",
|
|
|
+ });
|
|
|
}
|
|
|
- this.skuForm.selectedSpecs.splice(sp_index, 1)
|
|
|
+ this.skuForm.selectedSpecs.splice(sp_index, 1);
|
|
|
} catch (e) {
|
|
|
//
|
|
|
}
|
|
@@ -433,46 +544,65 @@ export default {
|
|
|
// 移除规格值
|
|
|
async handleDeleteSpecVal(sp_index, sv_index) {
|
|
|
try {
|
|
|
- const spec_value_list = this.skuForm.selectedSpecs[sp_index].spec_value_list
|
|
|
+ const spec_value_list =
|
|
|
+ this.skuForm.selectedSpecs[sp_index].spec_value_list;
|
|
|
if (spec_value_list[sv_index].spec_value_id) {
|
|
|
- let msg = '确定要移除这个规格值吗?'
|
|
|
- let last_spc_val = false
|
|
|
+ let msg = "确定要移除这个规格值吗?";
|
|
|
+ let last_spc_val = false;
|
|
|
if (spec_value_list.length === 1) {
|
|
|
- last_spc_val = true
|
|
|
- msg = '最后一个规格值移除后规格维度将发生改变,会导致已有规格数据丢失!确定要移除吗?'
|
|
|
+ last_spc_val = true;
|
|
|
+ msg =
|
|
|
+ "最后一个规格值移除后规格维度将发生改变,会导致已有规格数据丢失!确定要移除吗?";
|
|
|
}
|
|
|
- await this.$confirm(msg, '提示', { type: last_spc_val ? 'error' : 'warning' })
|
|
|
+ await this.$confirm(msg, "提示", {
|
|
|
+ type: last_spc_val ? "error" : "warning",
|
|
|
+ });
|
|
|
}
|
|
|
- this.skuForm.selectedSpecs[sp_index].spec_value_list.splice(sv_index, 1)
|
|
|
+ this.skuForm.selectedSpecs[sp_index].spec_value_list.splice(
|
|
|
+ sv_index,
|
|
|
+ 1
|
|
|
+ );
|
|
|
} catch (e) {
|
|
|
//
|
|
|
}
|
|
|
},
|
|
|
// 规格值图片上传成功
|
|
|
handleSpecValImgUploadSuccess(sp_index, sv_index, file) {
|
|
|
- this.$set(this.skuForm.selectedSpecs[sp_index].spec_value_list[sv_index], 'spec_image', file.url)
|
|
|
- this.$refs.skuForm.validateField([`selectedSpecs.${sp_index}.spec_value_list.${sv_index}.spec_image`])
|
|
|
+ this.$set(
|
|
|
+ this.skuForm.selectedSpecs[sp_index].spec_value_list[sv_index],
|
|
|
+ "spec_image",
|
|
|
+ file.url
|
|
|
+ );
|
|
|
+ this.$refs.skuForm.validateField([
|
|
|
+ `selectedSpecs.${sp_index}.spec_value_list.${sv_index}.spec_image`,
|
|
|
+ ]);
|
|
|
},
|
|
|
// 移除规格值图片
|
|
|
handleSpecValImgRemove(sp_index, sv_index) {
|
|
|
- this.skuForm.selectedSpecs[sp_index].spec_value_list[sv_index].spec_image = ''
|
|
|
+ this.skuForm.selectedSpecs[sp_index].spec_value_list[
|
|
|
+ sv_index
|
|
|
+ ].spec_image = "";
|
|
|
},
|
|
|
// 批量设置SKU参数
|
|
|
async handleBatchSetSkuParams(param) {
|
|
|
try {
|
|
|
- await this.$confirm('当前操作会覆盖已有值,确定吗?', '提示', { type: 'warning' })
|
|
|
- let { prefix, step, initial_value, pad_zero } = Helper.cloneJson(param.batchForm)
|
|
|
- this.skuForm.skuList.forEach(sku => {
|
|
|
- let val = ''
|
|
|
- if (prefix !== false && prefix) val += prefix
|
|
|
- if (step !== false && step) initial_value += step
|
|
|
+ await this.$confirm("当前操作会覆盖已有值,确定吗?", "提示", {
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ let { prefix, step, initial_value, pad_zero } = Helper.cloneJson(
|
|
|
+ param.batchForm
|
|
|
+ );
|
|
|
+ this.skuForm.skuList.forEach((sku) => {
|
|
|
+ let val = "";
|
|
|
+ if (prefix !== false && prefix) val += prefix;
|
|
|
+ if (step !== false && step) initial_value += step;
|
|
|
if (pad_zero !== false && pad_zero > 1) {
|
|
|
- val += String(initial_value).padStart(pad_zero, '0')
|
|
|
+ val += String(initial_value).padStart(pad_zero, "0");
|
|
|
} else {
|
|
|
- val += initial_value
|
|
|
+ val += initial_value;
|
|
|
}
|
|
|
- this.$set(sku, param.key, val || '')
|
|
|
- })
|
|
|
+ this.$set(sku, param.key, val || "");
|
|
|
+ });
|
|
|
} catch (e) {
|
|
|
// console.log('e: ', e)
|
|
|
}
|
|
@@ -481,28 +611,28 @@ export default {
|
|
|
submit() {
|
|
|
return new Promise((resolve, reject) => {
|
|
|
if (this.skuForm.skuList.length === 0) {
|
|
|
- reject()
|
|
|
- return
|
|
|
+ reject();
|
|
|
+ return;
|
|
|
}
|
|
|
- this.$refs.skuForm.validate(async valid => {
|
|
|
+ this.$refs.skuForm.validate(async (valid) => {
|
|
|
if (!valid) {
|
|
|
- // this.$message.error('表单填写有误,请核对带有红色边框的表单项!')
|
|
|
- reject()
|
|
|
- return
|
|
|
+ //this.$message.error('表单填写有误,请核对带有红色边框的表单项!')
|
|
|
+ reject();
|
|
|
+ return;
|
|
|
}
|
|
|
- const skus = Helper.cloneJson(this.skuForm.skuList)
|
|
|
- resolve(skus)
|
|
|
+ const skus = Helper.cloneJson(this.skuForm.skuList);
|
|
|
+ resolve(skus);
|
|
|
// try {
|
|
|
// await Helper.saveGoodsSkus(this.goodsId, skus)
|
|
|
// resolve()
|
|
|
// } catch (e) {
|
|
|
// //
|
|
|
// }
|
|
|
- })
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
@import "./styles";
|