zhuce
/
lilishop-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'ma'

master
mabo 2021-06-25 16:24:52 +08:00
parent b3863568d6 830cc3e83c
commit 7112f4cd49
1 changed files with 296 additions and 250 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

546
seller/src/views/goods/goods-seller/goodsOperation.vue
View File

@ -3,21 +3,23 @@
<!-- 选择商品类型 -->
<Modal v-model="selectGoodsType" width="550" :closable="false">
<div class="goods-type-list" v-if="!showGoodsTemplates">
<div class="goods-type-item" :class="{'active-goods-type':item.check}" @click="handleClickGoodsType(item)" v-for="(item,index) in goodsTypeWay" :key="index">
<img :src="item.img" />
<div class="goods-type-item" :class="{'active-goods-type':item.check}" @click="handleClickGoodsType(item)"
v-for="(item,index) in goodsTypeWay" :key="index">
<img :src="item.img"/>
<div>
<h2>{{item.title}}</h2>
<p>{{item.desc}}</p>
<h2>{{ item.title }}</h2>
<p>{{ item.desc }}</p>
</div>
</div>
</div>
<div v-else class="goods-type-list">
<h2 @click="showGoodsTemplates = !showGoodsTemplates">返回</h2>
<div class="goods-type-item template-item" @click="handleClickGoodsTemplate(item)" v-for="(item,index) in goodsTemplates" :key="index">
<img :src="item.thumbnail" />
<div class="goods-type-item template-item" @click="handleClickGoodsTemplate(item)"
v-for="(item,index) in goodsTemplates" :key="index">
<img :src="item.thumbnail"/>
<div>
<h2>{{item.goodsName}}</h2>
<p>{{item.sellingPoint || ''}}</p>
<h2>{{ item.goodsName }}</h2>
<p>{{ item.sellingPoint || '' }}</p>
</div>
</div>
@ -25,37 +27,38 @@
</Modal>
<div class="step-list">
<steps :current="activestep" simple style="height:60px;margin-top: 10px" process-status="process">
<div class="step-view">
<step title="选择商品品类" />
<step title="选择商品品类"/>
</div>
<div class="step-view">
<step title="填写商品详情" />
<step title="填写商品详情"/>
</div>
<div class="step-view">
<step title="商品发布成功" />
<step title="商品发布成功"/>
</div>
</steps>
</div>
<div class="content-goods-publish" v-show="activestep === 0">
<div class="goods-category">
<ul v-if="categoryListLevel1 && categoryListLevel1.length > 0">
<li v-for="(item, index) in categoryListLevel1" :class="{ activeClass: index == activeCategoryIndex1 }" @click="handleSelectCategory(item, index, 1)" :key="index">
<li v-for="(item, index) in categoryListLevel1" :class="{ activeClass: index == activeCategoryIndex1 }"
@click="handleSelectCategory(item, index, 1)" :key="index">
<span>{{ item.name }}</span>
<span>&gt;</span>
</li>
</ul>
<ul v-if="categoryListLevel2 && categoryListLevel2.length > 0">
<li v-for="(item, index) in categoryListLevel2" :class="{ activeClass: index == activeCategoryIndex2 }" @click="handleSelectCategory(item, index, 2)" :key="index">
<li v-for="(item, index) in categoryListLevel2" :class="{ activeClass: index == activeCategoryIndex2 }"
@click="handleSelectCategory(item, index, 2)" :key="index">
<span>{{ item.name }}</span>
<span>&gt;</span>
</li>
</ul>
<ul v-if="categoryListLevel3 && categoryListLevel3.length > 0">
<li v-for="(item, index) in categoryListLevel3" :class="{ activeClass: index == activeCategoryIndex3 }" @click="handleSelectCategory(item, index, 3)" :key="index">
<li v-for="(item, index) in categoryListLevel3" :class="{ activeClass: index == activeCategoryIndex3 }"
@click="handleSelectCategory(item, index, 3)" :key="index">
<span>{{ item.name }}</span>
</li>
</ul>
@ -83,11 +86,11 @@
<span v-if="!activeCategoryName1" v-html="baseInfoForm.category_name"></span>
</FormItem>
<FormItem label="商品名称" prop="goodsName">
<Input type="text" v-model="baseInfoForm.goodsName" placeholder="商品名称" clearable style="width: 260px" />
<Input type="text" v-model="baseInfoForm.goodsName" placeholder="商品名称" clearable style="width: 260px"/>
</FormItem>
<FormItem label="商品卖点" prop="sellingPoint">
<Input v-model="baseInfoForm.sellingPoint" type="textarea" :rows="4" style="width: 260px" />
<Input v-model="baseInfoForm.sellingPoint" type="textarea" :rows="4" style="width: 260px"/>
</FormItem>
<FormItem label="商品品牌" prop="brandId">
<Select v-model="baseInfoForm.brandId" style="width: 200px">
@ -104,7 +107,8 @@
</Select>
</FormItem>
<FormItem class="form-item-view-el" label="销售模式" prop="salesModel">
<RadioGroup type="button" v-if="baseInfoForm.goodsType!='VIRTUAL_GOODS'" button-style="solid" v-model="baseInfoForm.salesModel">
<RadioGroup type="button" v-if="baseInfoForm.goodsType!='VIRTUAL_GOODS'" button-style="solid"
v-model="baseInfoForm.salesModel">
<Radio title="零售型" label="RETAIL">
<span>零售型</span>
</Radio>
@ -124,18 +128,18 @@
<h4>商品规格及图片</h4>
<div class="form-item-view">
<FormItem label="商品编号" prop="sn">
<Input type="text" v-model="baseInfoForm.sn" placeholder="商品编号" clearable style="width: 260px" />
<Input type="text" v-model="baseInfoForm.sn" placeholder="商品编号" clearable style="width: 260px"/>
</FormItem>
<FormItem label="商品价格" prop="price">
<Input type="text" v-model="baseInfoForm.price" placeholder="商品价格" clearable style="width: 260px" />
<Input type="text" v-model="baseInfoForm.price" placeholder="商品价格" clearable style="width: 260px"/>
</FormItem>
<FormItem label="市场价格" prop="cost">
<Input type="text" v-model="baseInfoForm.cost" placeholder="市场价格" clearable style="width: 260px" />
<Input type="text" v-model="baseInfoForm.cost" placeholder="市场价格" clearable style="width: 260px"/>
</FormItem>
<FormItem class="form-item-view-el required" label="商品图片" prop="goodsGalleryFiles">
<div class="demo-upload-list" v-for="(item, __index) in baseInfoForm.goodsGalleryFiles" :key="__index">
<template v-if="item.status === 'finished'">
<img :src="item.url" />
<img :src="item.url"/>
<div class="demo-upload-list-cover">
<div>
@ -144,17 +148,9 @@
</div>
<div>
<Icon type="ios-arrow-dropleft" @click.native="
handleGoodsPicRemoteUp(
baseInfoForm.goodsGalleryFiles,
__index
)
" />
handleGoodsPicRemoteUp(baseInfoForm.goodsGalleryFiles,__index)"/>
<Icon type="ios-arrow-dropright" @click.native="
handleGoodsPicRemoteDown(
baseInfoForm.goodsGalleryFiles,
__index
)
" />
handleGoodsPicRemoteDown(baseInfoForm.goodsGalleryFiles,__index)"/>
</div>
</div>
</template>
@ -162,16 +158,18 @@
<Progress v-if="item.showProgress" :percent="item.percentage" hide-info></Progress>
</template>
</div>
<Upload ref="upload" :show-upload-list="false" :default-file-list="baseInfoForm.goodsGalleryFiles" :on-success="handleSuccessGoodsPicture" :format="['jpg', 'jpeg', 'png']"
:on-format-error="handleFormatError" :on-exceeded-size="handleMaxSize" :before-upload="handleBeforeUploadGoodsPicture" multiple type="drag" :action="uploadFileUrl"
:headers="accessToken" style="display: inline-block;margin-left:10px;">
<Upload ref="upload" :show-upload-list="false" :default-file-list="baseInfoForm.goodsGalleryFiles"
:on-success="handleSuccessGoodsPicture" :format="['jpg', 'jpeg', 'png']"
:on-format-error="handleFormatError" :on-exceeded-size="handleMaxSize"
:before-upload="handleBeforeUploadGoodsPicture" multiple type="drag" :action="uploadFileUrl"
:headers="accessToken" style="display: inline-block;margin-left:10px;">
<div style="width: 80px; height: 80px; line-height: 80px">
<Icon type="ios-camera" size="20"></Icon>
</div>
</Upload>
<Modal title="View Image" v-model="goodsPictureVisible">
<img :src="previewGoodsPicture" v-if="goodsPictureVisible" style="width: 100%" />
<img :src="previewGoodsPicture" v-if="goodsPictureVisible" style="width: 100%"/>
</Modal>
</FormItem>
@ -184,23 +182,29 @@
<div class="sku-item" v-for="(item, $index) in skuInfo" :key="$index">
<Card :bordered="true">
<FormItem label="规格名：" class="sku-item-content-name">
<AutoComplete style="width: 150px" v-model="item.name" :maxlength="30" placeholder="请输入规格项名称"
:filter-method="filterMethod" :data="skuData"
@on-change="editSkuItem">
</AutoComplete>
<Button type="error" style="margin-left: 10px" @click="handleCloseSkuItem($index)">删除</Button>
<AutoComplete style="width: 150px" v-model="item.name" :maxlength="30"
placeholder="请输入规格项名称"
:filter-method="filterMethod" :data="skuData"
@on-change="editSkuItem">
</AutoComplete>
<Button type="error" style="margin-left: 10px" @click="handleCloseSkuItem($index)">删除
</Button>
</FormItem>
<FormItem label="规格值：" prop="sku">
<!--规格值文本列表-->
<div v-for="(val, index) in item.spec_values" :key="index" style="padding: 0px 20px 10px 0px; float: left">
<div v-for="(val, index) in item.spec_values" :key="index"
style="padding: 0px 20px 10px 0px; float: left">
<div>
<AutoComplete style="width: 150px; float: left" v-if="skuValVisible" v-model="val.value" :maxlength="30" placeholder="请输入规格值名称"
:filter-method="filterMethod" :data="skuVal" @on-focus="changeSkuVals(item.name)"
@on-change="skuValueChange(val.value, $index, item)">
<AutoComplete style="width: 150px; float: left" v-model="val.value"
:maxlength="30" placeholder="请输入规格值名称"
:filter-method="filterMethod" :data="skuVal"
@on-focus="changeSkuVals(item.name)"
@on-change="skuValueChange(val.value, $index, item)">
</AutoComplete>
<Button type="error" style="margin-left: 10px" @click="handleCloseSkuValue(item, index)">删除</Button>
<Button type="error" style="margin-left: 10px" @click="handleCloseSkuValue(item, index)">
删除
</Button>
</div>
</div>
<div style="float: left">
@ -224,34 +228,36 @@
}
" :span-method="handleSpan">
<template slot-scope="{ row }" slot="sn">
<Input v-model="row.sn" placeholder="请输入货号" @on-change="updateSkuTable(row, 'sn')" />
<Input v-model="row.sn" placeholder="请输入货号" @on-change="updateSkuTable(row, 'sn')"/>
</template>
<template slot-scope="{ row }" slot="weight" v-if="baseInfoForm.goodsType!='VIRTUAL_GOODS'">
<Input v-model="row.weight" placeholder="请输入重量" @on-change="updateSkuTable(row, 'weight')" />
<Input v-model="row.weight" placeholder="请输入重量" @on-change="updateSkuTable(row, 'weight')"/>
</template>
<template slot-scope="{ row }" slot="quantity">
<Input v-model="row.quantity" placeholder="请输入库存" @on-change="updateSkuTable(row, 'quantity')" />
<Input v-model="row.quantity" placeholder="请输入库存"
@on-change="updateSkuTable(row, 'quantity')"/>
</template>
<template slot-scope="{ row }" slot="cost">
<Input v-model="row.cost" placeholder="请输入成本价" @on-change="updateSkuTable(row, 'cost')" />
<Input v-model="row.cost" placeholder="请输入成本价" @on-change="updateSkuTable(row, 'cost')"/>
</template>
<template slot-scope="{ row }" slot="price">
<Input v-model="row.price" placeholder="请输入价格" @on-change="updateSkuTable(row, 'price')" />
<Input v-model="row.price" placeholder="请输入价格" @on-change="updateSkuTable(row, 'price')"/>
</template>
<template slot-scope="{ row }" slot="images">
<Button @click="editSkuPicture(row)">编辑图片</Button>
<Modal v-model="showSkuPicture" :styles="{ top: '30px' }" class-name="sku-preview-modal" title="编辑图片" ok-text="结束编辑" @on-ok="updateSkuPicture()" cancel-text="取消">
<Modal v-model="showSkuPicture" :styles="{ top: '30px' }" class-name="sku-preview-modal"
title="编辑图片" ok-text="结束编辑" @on-ok="updateSkuPicture()" cancel-text="取消">
<div class="preview-picture">
<img v-if="previewPicture !== ''" :src="previewPicture" />
<img v-if="previewPicture !== ''" :src="previewPicture"/>
</div>
<Divider />
<Divider/>
<div class="sku-upload-list" v-for="(img, __index) in selectedSku.images" :key="__index">
<template v-if="img.status === 'finished'">
<img :src="img.url" />
<img :src="img.url"/>
<div class="sku-upload-list-cover">
<Icon type="ios-eye-outline" @click="handleView(img.url)"></Icon>
<Icon type="ios-trash-outline" @click="handleRemove(img, __index)"></Icon>
@ -261,9 +267,11 @@
<Progress v-if="img.showProgress" :percent="img.percentage" hide-info></Progress>
</template>
</div>
<Upload ref="uploadSku" :show-upload-list="false" :default-file-list="row.images" :on-success="handleSuccess" :format="['jpg', 'jpeg', 'png']"
:on-format-error="handleFormatError" :on-exceeded-size="handleMaxSize" :before-upload="handleBeforeUpload" multiple type="drag" :action="uploadFileUrl"
:headers="accessToken" style="display: inline-block; width: 58px">
<Upload ref="uploadSku" :show-upload-list="false" :default-file-list="row.images"
:on-success="handleSuccess" :format="['jpg', 'jpeg', 'png']"
:on-format-error="handleFormatError" :on-exceeded-size="handleMaxSize"
:before-upload="handleBeforeUpload" multiple type="drag" :action="uploadFileUrl"
:headers="accessToken" style="display: inline-block; width: 58px">
<div>
<Icon type="ios-camera" size="55"></Icon>
</div>
@ -280,7 +288,7 @@
</div>
<h4>商品详情描述</h4>
<div class="form-item-view">
<div class="tree-bar" >
<div class="tree-bar">
<FormItem
class="form-item-view-el"
label="店内分类"
@ -308,65 +316,69 @@
<div class="form-item-view">
<FormItem class="form-item-view-el" label="商品重量" prop="weight">
<Input v-model="baseInfoForm.weight">
<span slot="append">kg</span>
</Input>
</FormItem>
<FormItem
class="form-item-view-el"
label="物流模板"
prop="templateId"
>
<Select v-model="baseInfoForm.templateId" style="width: 200px">
<Option
v-for="item in logisticsTemplate"
:value="item.id"
:key="item.id"
>{{ item.name }}
</Option>
</Select>
</FormItem>
<span slot="append">kg</span>
</Input>
</FormItem>
<FormItem
class="form-item-view-el"
label="物流模板"
prop="templateId"
>
<Select v-model="baseInfoForm.templateId" style="width: 200px">
<Option
v-for="item in logisticsTemplate"
:value="item.id"
:key="item.id"
>{{ item.name }}
</Option>
</Select>
</FormItem>
</div>
<h4>其他信息</h4>
<div class="form-item-view">
<FormItem class="form-item-view-el" label="商品发布" prop="release">
<RadioGroup type="button" button-style="solid" v-model="baseInfoForm.release">
<Radio title="立即发布" label="true">
<span>立即发布</span>
</Radio>
<Radio title="放入仓库" label="false">
<span>放入仓库</span>
</Radio>
</RadioGroup>
</FormItem>
<FormItem class="form-item-view-el" label="商品推荐" prop="skuList">
<RadioGroup type="button" button-style="solid" v-model="baseInfoForm.recommend">
<Radio title="推荐" label="true">
<span>推荐</span>
</Radio>
<Radio title="不推荐" label="false">
<span>不推荐</span>
</Radio>
</RadioGroup>
</FormItem>
</div>
<div class="form-item-view-bottom">
<Collapse v-model="params_panel" v-for="(paramsGroup,groupIndex) in goodsParams"
:title="paramsGroup.groupName"
style="text-align: left" :key="paramsGroup.groupName">
<Panel :name="paramsGroup.groupName">
{{paramsGroup.groupName}}
<p slot="content">
<FormItem v-for="( params, paramsIndex) in paramsGroup.params" :key="paramsIndex"
:label="`${params.paramName}：`">
<Select v-model="params.paramValue" placeholder="请选择" style="width: 200px" clearable
@on-change="selectParams(paramsGroup,groupIndex,params,paramsIndex,params.paramValue)">
<Option v-for="option in params.options.split(',')" :label="option"
:value="option"></Option>
</Select>
</FormItem>
</p>
</Panel>
</Collapse>
</div>
</div>
<h4>其他信息</h4>
<div class="form-item-view">
<FormItem class="form-item-view-el" label="商品发布" prop="release">
<RadioGroup type="button" button-style="solid" v-model="baseInfoForm.release">
<Radio title="立即发布" label="true">
<span>立即发布</span>
</Radio>
<Radio title="放入仓库" label="false">
<span>放入仓库</span>
</Radio>
</RadioGroup>
</FormItem>
<FormItem class="form-item-view-el" label="商品推荐" prop="skuList">
<RadioGroup type="button" button-style="solid" v-model="baseInfoForm.recommend">
<Radio title="推荐" label="true">
<span>推荐</span>
</Radio>
<Radio title="不推荐" label="false">
<span>不推荐</span>
</Radio>
</RadioGroup>
</FormItem>
</div>
<div class="form-item-view-bottom">
<Collapse v-model="show" v-for="paramsgroup in goodsParams" :title="paramsgroup.groupName" style="text-align: left" :key="paramsgroup.groupName">
<Panel key="1" name="1">
{{ paramsgroup.groupName }}
<p slot="content">
<FormItem v-for="(
goodsParamsList, index
) in baseInfoForm.goodsParamsList" :key="index" :label="`${goodsParamsList.paramName}：`">
<Select v-model="goodsParamsList.paramValue" placeholder="请选择" style="width: 200px" clearable>
<Option v-for="option in goodsParamsList.optionList" :key="option.paramValue" :label="option" :value="option"></Option>
</Select>
</FormItem>
</p>
</Panel>
</Collapse>
</div>
</div>
</div>
</Form>
</div>
@ -414,7 +426,7 @@
</template>
<script>
import { regular } from "@/utils";
import {regular} from "@/utils";
import uploadPicThumb from "@/views/my-components/lili/upload-pic-thumb";
import editor from "@/views/my-components/lili/editor";
import * as API_GOODS from "@/api/goods";
@ -542,7 +554,6 @@ export default {
selectedSku: {},
//选择店铺分类
strict: true,
goodsParamsList: [],
//模版 / 草稿 id
draftId: undefined,
/** 当前激活步骤*/
@ -577,32 +588,12 @@ export default {
categoryListLevel3: [],
/** 请求的商品参数组列表 */
goodsParams: [
{
groupId: "",
groupName: "",
params: [
{
paramId: 0,
paramName: "",
paramType: 1,
paramValue: "",
required: 0,
optionList: [
{ value: 1, label: "" },
{ value: 2, label: "" },
],
},
],
},
],
goodsParams: [],
/** 当前状态/模式 默认发布商品0 编辑商品1 编辑草稿箱商品2 */
currentStatus: 0,
baseInfoForm: {
salesModel: "RETAIL",
/** 商品参数列表 */
goodsParamsList: [],
/** 商品重量 */
weight: "",
/** 商品相册列表 */
@ -630,6 +621,8 @@ export default {
regeneratorSkuFlag: false,
/** 运费模板id **/
templateId: 0,
/** 参数组*/
goodsParamsDTOList: [],
},
/** 表单数据*/
skuForm: {},
@ -640,7 +633,7 @@ export default {
/** 默认的规格参数 */
skuData: [],
/** 默认的规格值 */
skuVals: [],
// 某一规格名下的规格值
@ -658,12 +651,13 @@ export default {
/** 固定列校验提示内容 */
validatatxt: "请输入0~99999999之间的数字值",
//参数panel展示
params_panel: [],
/** 存储未通过校验的单元格位置 */
validateError: [],
baseInfoFormRule: {
goodsName: [
{ required: true, message: "请输入商品名称" },
{required: true, message: "请输入商品名称"},
{
whitespace: true,
message: "商品名称不可为纯空格",
@ -675,23 +669,23 @@ export default {
},
],
sn: [
{ required: true, message: "请输入商品编号" },
{ validator: checkSn },
{required: true, message: "请输入商品编号"},
{validator: checkSn},
],
price: [
{ required: true, message: "请输入商品价格" },
{ validator: checkPrice },
{required: true, message: "请输入商品价格"},
{validator: checkPrice},
],
cost: [
{ required: true, message: "请输入市场价格" },
{ validator: checkPrice },
{required: true, message: "请输入市场价格"},
{validator: checkPrice},
],
weight: [
{ required: true, message: "请输入物流参数" },
{ validator: checkWeight },
{required: true, message: "请输入物流参数"},
{validator: checkWeight},
],
sellingPoint: [{ required: true, message: "请输入商品卖点" }],
goodsUnit: [{ required: true, message: "请选择计量单位" }],
sellingPoint: [{required: true, message: "请输入商品卖点"}],
goodsUnit: [{required: true, message: "请选择计量单位"}],
},
/** 品牌列表 */
brandList: [],
@ -726,14 +720,14 @@ export default {
this.logisticsTemplate = res.result;
}
})
// 编辑商品
if (this.$route.query.id) {
this.activestep = 1;
this.goodsId = this.$route.query.id;
this.GET_GoodData();
this.selectGoodsType = false;
}
// 编辑模板
else if (this.$route.query.draftId) {
@ -754,7 +748,6 @@ export default {
defaultBaseInfo() {
this.baseInfoForm = {
salesModel: "RETAIL",
goodsParamsList: [],
weight: "",
goodsGalleryFiles: [],
release: "true",
@ -770,6 +763,7 @@ export default {
updateSku: true,
regeneratorSkuFlag: false,
templateId: 0,
goodsParamsDTOList: [],
};
this.activestep = 0;
this.isPublish = true;
@ -833,6 +827,43 @@ export default {
}
});
},
/**
* 选择参数
* @paramsGroup 参数分组
* @groupIndex 参数分组下标
* @params 参数选项
* @paramIndex 参数下标值
* @value 参数选项值
*/
selectParams(paramsGroup, groupIndex, params, paramsIndex, value) {
if (!this.baseInfoForm.goodsParamsDTOList[groupIndex]) {
this.baseInfoForm.goodsParamsDTOList[groupIndex] = {
groupId:'',
groupName:'',
goodsParamsItemDTOList:[]
}
}
//赋予分组id
this.baseInfoForm.goodsParamsDTOList[groupIndex].groupId = paramsGroup.groupId
//赋予分组名称
this.baseInfoForm.goodsParamsDTOList[groupIndex].groupName = paramsGroup.groupName
//参数详细为空，则赋予
if (!this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex]) {
this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex]={
paramName:'',
paramValue:'',
isIndex:'',
required:'',
}
}
this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex]={
paramName: params.paramName,
paramValue: value,
isIndex: params.isIndex,
required: params.required,
}
},
// 编辑sku图片
editSkuPicture(row) {
console.log(row);
@ -923,7 +954,7 @@ export default {
},
// 跳转商品列表
gotoGoodsList() {
this.$router.push({ name: "goods" });
this.$router.push({name: "goods"});
},
gotoBack() {
this.$router.go();
@ -936,6 +967,7 @@ export default {
}
);
},
// 获取商品单位
GET_GoodsUnit() {
API_GOODS.getGoodsUnitList().then((res) => {
if (res.success) {
@ -943,6 +975,7 @@ export default {
}
});
},
// 获取当前店铺分类
GET_ShopGoodsLabel() {
API_GOODS.getShopGoodsLabelListSeller().then((res) => {
if (res.success) {
@ -979,7 +1012,7 @@ export default {
...response.result,
};
// console.warn(this.baseInfoForm);
this.baseInfoForm.release = "true";
this.baseInfoForm.recommend = this.baseInfoForm.recommend
? "true"
@ -992,14 +1025,14 @@ export default {
this.baseInfoForm.categoryId = response.result.categoryPath.split(",");
if (
response.result.goodsGalleryList &&
response.result.goodsGalleryList.length > 0
) {
this.baseInfoForm.goodsGalleryFiles =
response.result.goodsGalleryList.map((i) => {
let files = { url: i };
let files = {url: i};
return files;
});
}
@ -1080,47 +1113,46 @@ export default {
this.renderTableData();
this.skuTableData = skus;
},
/** 查询商品参数 */
/** 根据当前分类id查询商品应包含的参数 */
GET_GoodsParams() {
API_GOODS.getCategoryParamsListDataSeller(this.categoryId).then(
(response) => {
this.goodsParams = response;
this.collapseVal = this.goodsParams.map((key) => {
if (key.groupId) {
return key.groupId;
}
});
if (!response || response.length <= 0) {
return;
}
this.goodsParams.forEach((key) => {
if (key && key.params) {
key.params.forEach((elem) => {
if (
!this.baseInfoForm.goodsParamsList.find(
(ij) => ij.paramName === elem.paramName
)
) {
elem.optionList = elem.options.split(",");
this.baseInfoForm.goodsParamsList.push(elem);
}
if (this.$route.query.id || this.draftId) {
this.baseInfoForm.goodsParamsList =
this.baseInfoForm.goodsParamsList.map((i) => {
if (i.paramId === elem.id || i.id === elem.id) {
elem.optionList = elem.options.split(",");
i = {
...i,
...elem,
};
}
return i;
});
return;
}
});
this.goodsParams = response;
//展开选项卡
this.goodsParams.forEach(item => {
this.params_panel.push(item.groupName)
}
});
)
if (this.baseInfoForm.goodsParamsDTOList) {
// 已选值集合
const paramsArr = []
this.baseInfoForm.goodsParamsDTOList.forEach(group =>{
group.goodsParamsItemDTOList.forEach(param => {
param.groupId = group.groupId
paramsArr.push(param)
console.log(param);
})
})
// 循环参数分组
this.goodsParams.forEach((parmsGroup) => {
parmsGroup.params.forEach(param => {
paramsArr.forEach(arr=>{
if(param.paramName == arr.paramName){
param.paramValue = arr.paramValue
}
})
})
});
console.log(this.goodsParams);
} else {
this.baseInfoForm.goodsParamsDTOList = []
}
}
);
},
@ -1141,22 +1173,22 @@ export default {
this.renderTableData();
},
// 编辑规格名
editSkuItem () {
editSkuItem() {
this.renderTableData();
},
// 编辑规格值
async skuValueChange(val, index, item) {
/** 更新skuInfo数据 */
let _arr = cloneObj(item);
this.$set(item, "name", _arr.name);
this.$set(this.skuInfo, index, _arr);
// let _arr = cloneObj(item);
// this.$set(item, "name", _arr.name);
// this.$set(this.skuInfo, index, _arr);
/**
* 渲染规格详细表格
*/
this.renderTableData();
},
// 获取焦点时，取得规格名对应的规格值
changeSkuVals (name) {
changeSkuVals(name) {
if (name) {
this.skuData.forEach((e, index) => {
if (e === name) {
@ -1212,7 +1244,7 @@ export default {
this.renderTableData();
}
},
/** 移除当前规格值 */
handleCloseSkuValue(item, index) {
item.spec_values.splice(index, 1);
@ -1223,30 +1255,29 @@ export default {
*/
this.renderTableData();
},
/**
* 渲染table所需要的column 和 data
*/
renderTableData() {
this.skuTableColumn = [];
this.skuTableData = [];
let pushData = [];
//渲染头部
this.skuInfo.forEach((sku) => {
//列名称
let columnName = sku.name;
this.skuTableColumn.push({
pushData.push({
title: columnName,
key: columnName,
});
});
let pushData = [];
pushData.push(...this.skuTableColumn);
this.baseInfoForm.goodsType != "VIRTUAL_GOODS"
? pushData.push({
title: "重量",
slot: "weight",
})
title: "重量",
slot: "weight",
})
: "";
pushData.push(
{
@ -1272,33 +1303,62 @@ export default {
);
this.skuTableColumn = pushData;
console.log(this.skuTableColumn);
//克隆所有渲染的数据
let cloneTemp = cloneObj(this.skuInfo);
//数据清空一次
this.skuTableData = [];
//判定 是否存在规格分组
if (cloneTemp[0]) {
//存放最终结果
let result = [];
//循环选中的 sku 数据
cloneTemp[0].spec_values.forEach((specItem) => {
result.push({
[specItem.name]: specItem.value,
[cloneTemp[0].name]: specItem.value,
images: this.baseInfoForm.goodsGalleryFiles || [],
});
});
cloneTemp.splice(0, 1);
result = this.specIterator(result, cloneTemp);
this.skuTableData = result;
console.log(this.skuTableData);
}
},
/**
* 迭代属性，形成表格
* result 渲染的数据
* array spec数据
*/
specIterator(result, cloneTemp) {
//是否还可以循环
if (cloneTemp.length > 0) {
let table = [];
result.forEach((resItem) => {
cloneTemp[0].spec_values.forEach((valItem) => {
let obj = cloneObj(resItem);
obj[cloneTemp[0].name] = valItem.value;
table.push(obj);
});
});
result = [];
table.forEach((t) => {
result.push(t);
});
//清除当前循环的分组
cloneTemp.splice(0, 1);
} else {
return result;
}
return this.specIterator(result, cloneTemp);
},
/** 根据分类id获取系统设置规格信息*/
Get_SkuInfoByCategory(categoryId) {
if (categoryId) {
API_GOODS.getGoodsSpecInfoSeller(categoryId).then(res => {
if(res.length) {
if (res.length) {
res.forEach(e => {
this.skuData.push(e.specName)
const vals = e.specValue ? e.specValue.split(',') : []
@ -1313,36 +1373,21 @@ export default {
filterMethod(value, option) {
return option.toUpperCase().indexOf(value.toUpperCase()) !== -1;
},
/**
* 迭代属性，形成表格
* result 渲染的数据
* array spec数据
*/
specIterator(result, cloneTemp) {
//是否还可以循环
if (cloneTemp.length > 0) {
let table = [];
result.forEach((resItem) => {
cloneTemp[0].spec_values.forEach((valItem) => {
let obj = cloneObj(resItem);
obj[valItem.name] = valItem.value;
table.push(obj);
});
});
result = [];
table.forEach((t) => {
result.push(t);
});
//清除当前循环的分组
cloneTemp.splice(0, 1);
} else {
return result;
// 节流函数
throttle (fn,time) {
let startTime = new Date();//初始时间
return function(){
let time_ = (new Date() - startTime) >= time;//判断时间间隔是否大于传入的time值，返回布尔值
if(time_){
fn.apply(this);
startTime = new Date();//函数执行完后更新初始时间的值
}
}
return this.specIterator(result, cloneTemp);
},
// 规格表格操作
handleSpan({ row, column, rowIndex, columnIndex }) {},
handleSpan({row, column, rowIndex, columnIndex}) {
},
/** 数据改变之后 抛出数据 */
updateSkuTable(row, item) {
let index = row._index;
@ -1500,15 +1545,16 @@ export default {
}
let flag = false;
let paramValue = "";
this.baseInfoForm.goodsParamsList.forEach((e) => {
if (
(e.required === 1 && e.paramValue === null) ||
e.paramValue === undefined
) {
flag = true;
paramValue = e.paramName;
}
});
// //参数校验
// this.baseInfoForm.goodsParamsList.forEach((e) => {
// if (
// (e.required === 1 && e.paramValue === null) ||
// e.paramValue === undefined
// ) {
// flag = true;
// paramValue = e.paramName;
// }
// });
if (flag) {
this.$Message.error(paramValue + " 参数值不能为空");
this.submitLoading = false;