参数相关问题处理
parent
7b2054206a
commit
3cb1edee83
|
@ -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>
|
||||
|
||||
|
@ -26,36 +28,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>></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>></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>
|
||||
|
@ -67,7 +71,12 @@
|
|||
<span v-show="activeCategoryName3">> {{ activeCategoryName3 }}</span>
|
||||
</p>
|
||||
<template v-if="!$route.query.id && draftId">
|
||||
<Divider>已选商品模版:{{goodsTemplates.find(item=>{return item.id == draftId}).goodsName}}</Divider>
|
||||
<Divider>已选商品模版:{{
|
||||
goodsTemplates.find(item => {
|
||||
return item.id == draftId
|
||||
}).goodsName
|
||||
}}
|
||||
</Divider>
|
||||
|
||||
</template>
|
||||
</div>
|
||||
|
@ -84,11 +93,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">
|
||||
|
@ -105,7 +114,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>
|
||||
|
@ -125,18 +135,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>
|
||||
|
@ -149,13 +159,13 @@
|
|||
baseInfoForm.goodsGalleryFiles,
|
||||
__index
|
||||
)
|
||||
" />
|
||||
"/>
|
||||
<Icon type="ios-arrow-dropright" @click.native="
|
||||
handleGoodsPicRemoteDown(
|
||||
baseInfoForm.goodsGalleryFiles,
|
||||
__index
|
||||
)
|
||||
" />
|
||||
"/>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
@ -163,16 +173,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>
|
||||
|
||||
|
@ -185,23 +197,30 @@
|
|||
<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-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>
|
||||
<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">
|
||||
|
@ -225,34 +244,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>
|
||||
|
@ -262,9 +283,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>
|
||||
|
@ -281,7 +304,7 @@
|
|||
</div>
|
||||
<h4>商品详情描述</h4>
|
||||
<div class="form-item-view">
|
||||
<div class="tree-bar" >
|
||||
<div class="tree-bar">
|
||||
<FormItem
|
||||
class="form-item-view-el"
|
||||
label="店内分类"
|
||||
|
@ -309,65 +332,68 @@
|
|||
<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">
|
||||
<p slot="content">
|
||||
<FormItem v-for="( params, paramsIndex) in paramsGroup.params" :key="paramsIndex"
|
||||
:label="`${params.paramName}:`">
|
||||
<Select v-model="params.paramName" placeholder="请选择" style="width: 200px" clearable
|
||||
@on-change="selectParams(paramsGroup,groupIndex,params,paramsIndex,params.val)">
|
||||
<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>
|
||||
|
@ -417,7 +443,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";
|
||||
|
@ -545,7 +571,6 @@ export default {
|
|||
selectedSku: {},
|
||||
//选择店铺分类
|
||||
strict: true,
|
||||
goodsParamsList: [],
|
||||
//模版 / 草稿 id
|
||||
draftId: undefined,
|
||||
/** 当前激活步骤*/
|
||||
|
@ -580,32 +605,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: "",
|
||||
/** 商品相册列表 */
|
||||
|
@ -633,6 +638,8 @@ export default {
|
|||
regeneratorSkuFlag: false,
|
||||
/** 运费模板id **/
|
||||
templateId: 0,
|
||||
/** 参数组*/
|
||||
goodsParamsDTOList: [],
|
||||
},
|
||||
/** 表单数据*/
|
||||
skuForm: {},
|
||||
|
@ -643,7 +650,7 @@ export default {
|
|||
|
||||
/** 默认的规格参数 */
|
||||
skuData: [],
|
||||
|
||||
|
||||
/** 默认的规格值 */
|
||||
skuVals: [],
|
||||
// 某一规格名下的规格值
|
||||
|
@ -661,12 +668,13 @@ export default {
|
|||
|
||||
/** 固定列校验提示内容 */
|
||||
validatatxt: "请输入0~99999999之间的数字值",
|
||||
|
||||
//参数panel展示
|
||||
params_panel: [],
|
||||
/** 存储未通过校验的单元格位置 */
|
||||
validateError: [],
|
||||
baseInfoFormRule: {
|
||||
goodsName: [
|
||||
{ required: true, message: "请输入商品名称" },
|
||||
{required: true, message: "请输入商品名称"},
|
||||
{
|
||||
whitespace: true,
|
||||
message: "商品名称不可为纯空格",
|
||||
|
@ -678,23 +686,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: [],
|
||||
|
@ -735,7 +743,7 @@ export default {
|
|||
this.goodsId = this.$route.query.id;
|
||||
this.GET_GoodData();
|
||||
this.selectGoodsType = false;
|
||||
|
||||
|
||||
}
|
||||
//编辑模版
|
||||
else if (this.$route.query.draftId) {
|
||||
|
@ -756,7 +764,6 @@ export default {
|
|||
defaultBaseInfo() {
|
||||
this.baseInfoForm = {
|
||||
salesModel: "RETAIL",
|
||||
goodsParamsList: [],
|
||||
weight: "",
|
||||
goodsGalleryFiles: [],
|
||||
release: "true",
|
||||
|
@ -772,6 +779,7 @@ export default {
|
|||
updateSku: true,
|
||||
regeneratorSkuFlag: false,
|
||||
templateId: 0,
|
||||
goodsParamsDTOList: [],
|
||||
};
|
||||
this.activestep = 0;
|
||||
this.isPublish = true;
|
||||
|
@ -828,6 +836,44 @@ export default {
|
|||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 选择参数
|
||||
* @paramsGroup 参数分组
|
||||
* @groupIndex 参数分组下标
|
||||
* @params 参数选项
|
||||
* @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
|
||||
//赋予参数值
|
||||
this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex].paramValue = value
|
||||
//参数是否索引
|
||||
this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex].isIndex = params.isIndex
|
||||
//参数是否必填
|
||||
this.baseInfoForm.goodsParamsDTOList[groupIndex].goodsParamsItemDTOList[paramsIndex].required = params.required
|
||||
},
|
||||
|
||||
// 编辑sku图片
|
||||
editSkuPicture(row) {
|
||||
console.log(row);
|
||||
|
@ -918,7 +964,7 @@ export default {
|
|||
},
|
||||
// 跳转商品列表
|
||||
gotoGoodsList() {
|
||||
this.$router.push({ name: "goods" });
|
||||
this.$router.push({name: "goods"});
|
||||
},
|
||||
gotoBack() {
|
||||
this.$router.go();
|
||||
|
@ -974,7 +1020,7 @@ export default {
|
|||
...response.result,
|
||||
};
|
||||
// console.warn(this.baseInfoForm);
|
||||
|
||||
|
||||
this.baseInfoForm.release = "true";
|
||||
this.baseInfoForm.recommend = this.baseInfoForm.recommend
|
||||
? "true"
|
||||
|
@ -987,14 +1033,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;
|
||||
});
|
||||
}
|
||||
|
@ -1075,51 +1121,35 @@ 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)
|
||||
}
|
||||
)
|
||||
// 循环参数分组
|
||||
this.goodsParams.forEach((parmsGroup) => {
|
||||
this.baseInfoForm.goodsParamsDTOList.forEach(paramsGroup=>{
|
||||
paramsGroup.goodsParamsItemDTOList.forEach(params=>{
|
||||
params.paramName=params.paramValue
|
||||
})
|
||||
})
|
||||
});
|
||||
}
|
||||
);
|
||||
},
|
||||
|
||||
|
||||
/** 添加规格项 */
|
||||
addSkuItem() {
|
||||
if (this.skuInfo.length >= 5) {
|
||||
|
@ -1136,7 +1166,7 @@ export default {
|
|||
this.renderTableData();
|
||||
},
|
||||
// 编辑规格名
|
||||
editSkuItem () {
|
||||
editSkuItem() {
|
||||
this.renderTableData();
|
||||
},
|
||||
// 编辑规格值
|
||||
|
@ -1151,7 +1181,7 @@ export default {
|
|||
this.renderTableData();
|
||||
},
|
||||
// 获取焦点时,取得规格名对应的规格值
|
||||
changeSkuVals (name) {
|
||||
changeSkuVals(name) {
|
||||
if (name) {
|
||||
this.skuData.forEach((e, index) => {
|
||||
if (e === name) {
|
||||
|
@ -1207,7 +1237,7 @@ export default {
|
|||
this.renderTableData();
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
/** 移除当前规格值 */
|
||||
handleCloseSkuValue(item, index) {
|
||||
item.spec_values.splice(index, 1);
|
||||
|
@ -1218,7 +1248,7 @@ export default {
|
|||
*/
|
||||
this.renderTableData();
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 渲染table所需要的column 和 data
|
||||
*/
|
||||
|
@ -1239,9 +1269,9 @@ export default {
|
|||
pushData.push(...this.skuTableColumn);
|
||||
this.baseInfoForm.goodsType != "VIRTUAL_GOODS"
|
||||
? pushData.push({
|
||||
title: "重量",
|
||||
slot: "weight",
|
||||
})
|
||||
title: "重量",
|
||||
slot: "weight",
|
||||
})
|
||||
: "";
|
||||
pushData.push(
|
||||
{
|
||||
|
@ -1294,10 +1324,10 @@ export default {
|
|||
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)
|
||||
this.skuVals.push(e.specValue ? e.specValue.split(',') : [])
|
||||
this.skuVals.push(e.specValue ? e.specValue.split(',') : [])
|
||||
})
|
||||
}
|
||||
}
|
||||
|
@ -1306,7 +1336,7 @@ export default {
|
|||
},
|
||||
/** 自动完成表单所需方法*/
|
||||
filterMethod(value, option) {
|
||||
return option.toUpperCase().indexOf(value.toUpperCase()) !== -1;
|
||||
return option.toUpperCase().indexOf(value.toUpperCase()) !== -1;
|
||||
},
|
||||
/**
|
||||
* 添加固有属性
|
||||
|
@ -1343,7 +1373,8 @@ export default {
|
|||
return this.specIterator(result, cloneTemp);
|
||||
},
|
||||
// 规格表格操作
|
||||
handleSpan({ row, column, rowIndex, columnIndex }) {},
|
||||
handleSpan({row, column, rowIndex, columnIndex}) {
|
||||
},
|
||||
/** 数据改变之后 抛出数据 */
|
||||
updateSkuTable(row, item) {
|
||||
let index = row._index;
|
||||
|
@ -1501,15 +1532,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;
|
||||
|
|
Loading…
Reference in New Issue