1027 lines
28 KiB
Vue
1027 lines
28 KiB
Vue
|
<template>
|
|||
|
|
<div class="components-container main-cont">
|
|||
|
|
<div style="position: relative;">
|
|||
|
|
<div style="display: inline-block;font-size:18px;margin-bottom: 15px;">
|
|||
|
|
<a href="#" @click="prev" style="text-decoration:none;font-size: 14px;">
|
|||
|
|
<icon-svg name="jiantou" style="width: 1.2em;height: 1.2em;position: relative;top: 0.3em;"></icon-svg>
|
|||
|
|
返回
|
|||
|
|
</a>
|
|||
|
|
<span style="display: inline-block;margin: 0 15px;color: #D9D9D9;">|</span>
|
|||
|
|
<span>积分商品添加</span>
|
|||
|
|
</div>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="6" >
|
|||
|
|
<span>商品标题：</span>
|
|||
|
|
<el-input style="width: 200px;" class="margin15" placeholder="请输入商品标题" v-model="title" autosize></el-input>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6" >
|
|||
|
|
<span>商品积分：</span>
|
|||
|
|
<el-input style="width:200px;" @keyup.native="proving" class="margin15" placeholder="请输入商品积分" type="number" :min="1" :controls="false" v-model="price" autosize></el-input>
|
|||
|
|
<p style="color: #F56C6C;font-size: 13px;margin-left:80px;margin-top: 4px;">注:积分等于商品加邮费</p>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6" >
|
|||
|
|
<span>商品销量：</span>
|
|||
|
|
<el-input style="width:200px;" @keyup.native="proving" class="margin15" placeholder="请输入商品销量" type="number" :min="1" :controls="false" v-model="sales" autosize></el-input>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6" >
|
|||
|
|
<span>商品状态：</span>
|
|||
|
|
<el-select v-model="status" class="margin15" placeholder="请选择商品状态" style="width:200px;">
|
|||
|
|
<el-option v-for="(item,index) in statusmain2" :key="item.index" :label="item.label" :value="item.value">
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<span>商品参数：</span>
|
|||
|
|
<el-input style="width:200px;" class="margin15" placeholder="请输入商品参数" v-model="buyReason" autosize></el-input>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<span>是否发货：</span>
|
|||
|
|
<el-select v-model="isExpress" class="margin15" placeholder="请选择商品是否发货" style="width:200px;">
|
|||
|
|
<el-option v-for="(item,index) in isExpressmain" :key="item.index" :label="item.label" :value="item.value">
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<div style="display: flex;align-items: center;margin: 2% 0;">
|
|||
|
|
<span style="display: inline-block;text-align: right;">商品封面图：</span>
|
|||
|
|
<div style=" width:148px;height:148px;background-color: #fbfdff; border: 1px dashed #c0ccda;border-radius: 6px;text-align: center;line-height: 148px;">
|
|||
|
|
<el-upload
|
|||
|
|
class="avatar-uploader"
|
|||
|
|
v-model="coverImg"
|
|||
|
|
:action="uploadUrl"
|
|||
|
|
:show-file-list="false"
|
|||
|
|
:on-success="handleAvatarSuccess1"
|
|||
|
|
>
|
|||
|
|
<img v-if="coverImg" :src="coverImg" class="avatar" style="width: 148px;height: 148px;"/>
|
|||
|
|
<i v-else class="el-icon-plus avatar-uploader-icon" style="font-size: 28px;color: #8c939d"></i>
|
|||
|
|
</el-upload>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: flex;align-items: center;margin: 2% 0;flex-flow: wrap;">
|
|||
|
|
<span style="display: inline-block;text-align: right;">商品轮播图：</span>
|
|||
|
|
<div>
|
|||
|
|
<el-upload
|
|||
|
|
:action="uploadUrl"
|
|||
|
|
list-type="picture-card"
|
|||
|
|
:on-success="handleUploadSuccess"
|
|||
|
|
:on-change="handleChange"
|
|||
|
|
:on-remove="handleRemove">
|
|||
|
|
<i class="el-icon-plus"></i>
|
|||
|
|
</el-upload>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: flex;align-items: center;margin: 2% 0;">
|
|||
|
|
<span style="display: inline-block;text-align: right;">商品规格：</span>
|
|||
|
|
<el-radio-group v-model="guige" @change="guigeChange">
|
|||
|
|
<el-radio :label="0">单规格</el-radio>
|
|||
|
|
<el-radio :label="1">多规格</el-radio>
|
|||
|
|
</el-radio-group>
|
|||
|
|
<div v-if="guigeshow" style="margin-left: 20px;">
|
|||
|
|
<el-select v-model="ruleId" placeholder="请选择商品规格" style="width:200px;" @change="selectTrigger(ruleId)">
|
|||
|
|
<el-option v-for="(item,index) in specifdata" :key="item.index" :label="item.ruleName" :value="item.id">
|
|||
|
|
</el-option>
|
|||
|
|
</el-select>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
</div>
|
|||
|
|
<div v-if="ruleValue" style="margin-left: 70px;">
|
|||
|
|
<div class="ruleitem" v-for="(item,index) in ruleValue" :key="index">
|
|||
|
|
<div>{{item.value}} <span @click="deleterule(index)"><icon-svg name="schu" class="ruleicon"></icon-svg></span></div>
|
|||
|
|
<div>
|
|||
|
|
<el-tag
|
|||
|
|
:key="tag"
|
|||
|
|
v-for="(tag,j) in item.detail.split(',')"
|
|||
|
|
closable
|
|||
|
|
:disable-transitions="false"
|
|||
|
|
@close="handleClose(tag,j,item)">
|
|||
|
|
{{tag}}
|
|||
|
|
</el-tag>
|
|||
|
|
<el-input
|
|||
|
|
class="input-new-tag"
|
|||
|
|
v-model="inputValues[index]"
|
|||
|
|
ref="saveTagInput"
|
|||
|
|
size="small"
|
|||
|
|
style="width:120px;"
|
|||
|
|
placeholder="请输入属性名"
|
|||
|
|
@keyup.enter.native="handleInputConfirm(index,item)"
|
|||
|
|
>
|
|||
|
|
</el-input>
|
|||
|
|
<el-button class="button-new-tag" size="small" @click="handleInputConfirm(index,item)">添加</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="margin-top:20px;" v-if="ruleshow">
|
|||
|
|
<div v-if="isshow" class="btn_specif">
|
|||
|
|
<el-button type="primary" @click="btnToclick()">添加新规格</el-button>
|
|||
|
|
<el-button type="success" @click="create()">立即生成</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="margin-top:10px;">
|
|||
|
|
<div v-if="!isshow" style="margin-top: 20px;">
|
|||
|
|
<div style="display: inline-block;">
|
|||
|
|
<span style="width:80px;display: inline-block;text-align: right;">规格：</span>
|
|||
|
|
<el-input style="width:50%;" v-model="releobject.value" placeholder="例:颜色"></el-input>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: inline-block;">
|
|||
|
|
<span style="width:80px;display: inline-block;text-align: right;">规格值：</span>
|
|||
|
|
<el-input style="width:50%;" v-model="releobject.detail" placeholder="例:黑色"></el-input>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: inline-block;">
|
|||
|
|
<el-button type="primary" @click="speciTo()">确 定</el-button>
|
|||
|
|
<el-button @click="speciTotwo()">取 消</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: flex;margin-top: 20px;" v-if="propshow">
|
|||
|
|
<span>商品属性：</span>
|
|||
|
|
<div class="property_table">
|
|||
|
|
<table style="width: 100%;">
|
|||
|
|
<tr style="display:flex;">
|
|||
|
|
<th style="width:120px;text-align: left;" v-for="item in headerData">{{item}}</th>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
<el-table
|
|||
|
|
:data="valueData">
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 1"
|
|||
|
|
prop="value0"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 2"
|
|||
|
|
prop="value0"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 2"
|
|||
|
|
prop="value1"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 3"
|
|||
|
|
prop="value0"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 3"
|
|||
|
|
prop="value1"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 3"
|
|||
|
|
prop="value2"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 4"
|
|||
|
|
prop="value0"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 4"
|
|||
|
|
prop="value1"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 4"
|
|||
|
|
prop="value2"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 4"
|
|||
|
|
prop="value3"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 5"
|
|||
|
|
prop="value0"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 5"
|
|||
|
|
prop="value1"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 5"
|
|||
|
|
prop="value2"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 5"
|
|||
|
|
prop="value3"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
v-if="detailJson.length == 5"
|
|||
|
|
prop="value4"
|
|||
|
|
width="120">
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="skuImg"
|
|||
|
|
width="100">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div class="imgWrap" style=" width:60px;height:60px;background-color: #fbfdff; border: 1px dashed #c0ccda;border-radius: 6px;text-align: center;line-height: 60px;">
|
|||
|
|
<el-upload
|
|||
|
|
style="width: 60px;height: 60px;"
|
|||
|
|
class="avatar-uploader"
|
|||
|
|
v-model="scope.row.skuImg"
|
|||
|
|
:action="uploadUrl"
|
|||
|
|
:show-file-list="false"
|
|||
|
|
:on-success="handleAvatarSuccess"
|
|||
|
|
>
|
|||
|
|
<img v-if="scope.row.skuImg" :src="scope.row.skuImg" class="avatar" style="border-radius: 6px;width:60px;height: 60px;"/>
|
|||
|
|
<i v-else class="el-icon-plus avatar-uploader-icon" @click="curRowIndex=scope.$index"></i>
|
|||
|
|
</el-upload>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- <el-table-column
|
|||
|
|
prop="skuOriginalPrice"
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.skuOriginalPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column> -->
|
|||
|
|
<el-table-column
|
|||
|
|
prop="skuPrice"
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.skuPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- <el-table-column
|
|||
|
|
prop="memberPrice"
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.memberPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column> -->
|
|||
|
|
<el-table-column
|
|||
|
|
prop="stock"
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.stock" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="sales"
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.sales" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
width="120">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<el-button
|
|||
|
|
:disabled="!isAuth('userList:delete')"
|
|||
|
|
size="mini"
|
|||
|
|
type="danger"
|
|||
|
|
@click="deleter(scope.$index)">删除
|
|||
|
|
</el-button>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="display: flex;margin-top: 20px;" v-if="propshow1">
|
|||
|
|
<span>商品属性：</span>
|
|||
|
|
<div class="property_table">
|
|||
|
|
<table style="width: 100%;">
|
|||
|
|
<tr style="display:flex;">
|
|||
|
|
<th style="width:150px;text-align: left;" v-for="item in headerData2">{{item}}</th>
|
|||
|
|
</tr>
|
|||
|
|
</table>
|
|||
|
|
<el-table
|
|||
|
|
:data="valueData2">
|
|||
|
|
<el-table-column
|
|||
|
|
prop="skuImg"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div class="imgWrap" style=" width:60px;height:60px;background-color: #fbfdff; border: 1px dashed #c0ccda;border-radius: 6px;text-align: center;line-height: 60px;">
|
|||
|
|
<el-upload
|
|||
|
|
style="width: 60px;height: 60px;"
|
|||
|
|
class="avatar-uploader"
|
|||
|
|
v-model="scope.row.skuImg"
|
|||
|
|
:action="uploadUrl"
|
|||
|
|
:show-file-list="false"
|
|||
|
|
:on-success="handleAvatarSuccess3"
|
|||
|
|
>
|
|||
|
|
<img v-if="scope.row.skuImg" :src="scope.row.skuImg" class="avatar" style="border-radius: 6px;width:60px;height: 60px;"/>
|
|||
|
|
<i v-else class="el-icon-plus avatar-uploader-icon" @click="curRowIndex=scope.$index"></i>
|
|||
|
|
</el-upload>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- <el-table-column
|
|||
|
|
prop="skuOriginalPrice"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.skuOriginalPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column> -->
|
|||
|
|
<el-table-column
|
|||
|
|
prop="skuPrice"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.skuPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<!-- <el-table-column
|
|||
|
|
prop="memberPrice"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.memberPrice" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column> -->
|
|||
|
|
<el-table-column
|
|||
|
|
prop="stock"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.stock" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
<el-table-column
|
|||
|
|
prop="sales"
|
|||
|
|
width="150">
|
|||
|
|
<template slot-scope="scope">
|
|||
|
|
<div>
|
|||
|
|
<el-input type="text" v-model="scope.row.sales" style="width:80px;font-size:14px;">
|
|||
|
|
</el-input>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div style="height: 38px;line-height: 38px;margin:20px 0;">
|
|||
|
|
<span>是否包邮：</span>
|
|||
|
|
<el-radio-group v-model="positage" @change="agreeChange">
|
|||
|
|
<el-radio :label="0">是</el-radio>
|
|||
|
|
<!-- <el-radio :label="1">否</el-radio>
|
|||
|
|
<el-input v-if="priceshow" style="width:200px;margin-left: 10px;" placeholder="请输入邮费" type="number" v-model="postagePrice" autosize></el-input> -->
|
|||
|
|
</el-radio-group>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="tinymce-content" style="display: flex;">
|
|||
|
|
<div style="width:90px;">商品详情：</div>
|
|||
|
|
<!-- <textarea id="tinymceId" :value="descrition" class="tinymce-textarea"/> -->
|
|||
|
|
<quill-editor ref="myTextEditor" v-model="descrition" :options="quillOption"
|
|||
|
|
style="padding-bottom: 50px;height: 300px;width: 72%;display: inline-table;margin-bottom: 60px;">
|
|||
|
|
</quill-editor>
|
|||
|
|
</div>
|
|||
|
|
<div style="text-align: center;margin-top:30px;">
|
|||
|
|
<el-button style='margin:0 20px 0 0;' size="mini" type="primary" icon="document" @click="prev">返回上一页
|
|||
|
|
</el-button>
|
|||
|
|
<el-button size="mini" type="primary" icon="document" @click="artiReleass">发布商品
|
|||
|
|
</el-button>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
import { quillEditor }
|
|||
|
|
from 'vue-quill-editor'
|
|||
|
|
import 'quill/dist/quill.core.css'
|
|||
|
|
import 'quill/dist/quill.snow.css'
|
|||
|
|
import 'quill/dist/quill.bubble.css'
|
|||
|
|
import quillConfig from '../mission/quill-config.js'
|
|||
|
|
import { serverPaths } from '@/utils/enumData'
|
|||
|
|
export default {
|
|||
|
|
name: 'news',
|
|||
|
|
components: {
|
|||
|
|
quillEditor
|
|||
|
|
},
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
uploadUrl: serverPaths.uploadUrl,
|
|||
|
|
quillOption: quillConfig,
|
|||
|
|
specif:'',
|
|||
|
|
typeId: '',
|
|||
|
|
title: '',
|
|||
|
|
merchants: '',
|
|||
|
|
originalPrice:'',
|
|||
|
|
price:'',
|
|||
|
|
memberPrice:'',
|
|||
|
|
positage:0,
|
|||
|
|
guige:1,
|
|||
|
|
skuImg:'',
|
|||
|
|
ruleId:'',
|
|||
|
|
postagePrice:0,
|
|||
|
|
priceshow:true,
|
|||
|
|
isshow:true,
|
|||
|
|
commissionPrice:'',
|
|||
|
|
buyReason:'',
|
|||
|
|
ruleshow:false,
|
|||
|
|
propshow:false,
|
|||
|
|
guigeshow:true,
|
|||
|
|
propshow1:false,
|
|||
|
|
ruleValue:[],
|
|||
|
|
attr:[],
|
|||
|
|
attrs:[],
|
|||
|
|
headerData:[],
|
|||
|
|
valueData:[],
|
|||
|
|
detailJson:[],
|
|||
|
|
inputValues:{
|
|||
|
|
inputValue0:'',
|
|||
|
|
inputValue1:'',
|
|||
|
|
inputValue2:'',
|
|||
|
|
inputValue3:'',
|
|||
|
|
inputValue4:'',
|
|||
|
|
inputValue5:''
|
|||
|
|
},
|
|||
|
|
sku:[],
|
|||
|
|
img:'',
|
|||
|
|
sales:'',
|
|||
|
|
status:'',
|
|||
|
|
photos:'',
|
|||
|
|
typeDatas:[],
|
|||
|
|
value:[],
|
|||
|
|
isSelect:'',
|
|||
|
|
homeGoods:'',
|
|||
|
|
isRecommend:'',
|
|||
|
|
isExpress:'',
|
|||
|
|
coverImg:'',
|
|||
|
|
valueData2:[],
|
|||
|
|
headerData2:[],
|
|||
|
|
statusmain2:[
|
|||
|
|
{
|
|||
|
|
value:1,
|
|||
|
|
label:'上架'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value:2,
|
|||
|
|
label:'下架'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
isExpressmain:[
|
|||
|
|
{
|
|||
|
|
value:1,
|
|||
|
|
label:'普通商品需要发货'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value:2,
|
|||
|
|
label:'虚拟商品无需发货'
|
|||
|
|
},
|
|||
|
|
{
|
|||
|
|
value:3,
|
|||
|
|
label:'门店核销无需发货'
|
|||
|
|
}
|
|||
|
|
],
|
|||
|
|
attrName:'',
|
|||
|
|
ruleName:'',
|
|||
|
|
attrValue:[],
|
|||
|
|
releobject:{
|
|||
|
|
value:'',
|
|||
|
|
detail:''
|
|||
|
|
},
|
|||
|
|
brandId:'',
|
|||
|
|
brandIds:[],
|
|||
|
|
isJiFenGoods:1,
|
|||
|
|
specifdata:[],
|
|||
|
|
dialogVisible: false,
|
|||
|
|
isShow: false,
|
|||
|
|
hideUpload: false,
|
|||
|
|
limit:1,
|
|||
|
|
id:'',
|
|||
|
|
hasChange: false,
|
|||
|
|
hasInit: false,
|
|||
|
|
tinymceId: 'tinymceId',
|
|||
|
|
height: 435,
|
|||
|
|
toolbar: [],
|
|||
|
|
menubar: 'file edit insert view format table',
|
|||
|
|
languageTypeList: {
|
|||
|
|
'en': 'en',
|
|||
|
|
'zh': 'zh_CN'
|
|||
|
|
},
|
|||
|
|
artiCletypes: [],
|
|||
|
|
// 富文本内容
|
|||
|
|
descrition: ''
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
// 验证input只能输入正整数
|
|||
|
|
proving() {
|
|||
|
|
this.price = this.price.replace(/[^\.\d]/g,'');
|
|||
|
|
this.price = this.price.replace('.','');
|
|||
|
|
this.sales = this.sales.replace(/[^\.\d]/g,'');
|
|||
|
|
this.sales = this.sales.replace('.','');
|
|||
|
|
},
|
|||
|
|
// 图标上传
|
|||
|
|
handleAvatarSuccess(file) {
|
|||
|
|
if(this.curRowIndex == 0){
|
|||
|
|
this.skuImg = file.data;
|
|||
|
|
this.valueData[0].skuImg = this.skuImg
|
|||
|
|
return
|
|||
|
|
}else{
|
|||
|
|
this.skuImg = file.data;
|
|||
|
|
this.valueData[this.curRowIndex].skuImg = this.skuImg
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 图标上传
|
|||
|
|
handleAvatarSuccess3(file) {
|
|||
|
|
this.skuImg = file.data;
|
|||
|
|
this.valueData2[0].skuImg = this.skuImg
|
|||
|
|
},
|
|||
|
|
// 是否包邮
|
|||
|
|
agreeChange(val){
|
|||
|
|
if(val == 1){
|
|||
|
|
this.priceshow = true
|
|||
|
|
this.postagePrice = ''
|
|||
|
|
}else{
|
|||
|
|
this.priceshow = false
|
|||
|
|
this.postagePrice = 0
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 是否多规格
|
|||
|
|
guigeChange(val){
|
|||
|
|
if(val == 1){
|
|||
|
|
this.ruleId = ''
|
|||
|
|
this.guigeshow = true
|
|||
|
|
this.propshow1 = false
|
|||
|
|
}else{
|
|||
|
|
this.ruleId = 0
|
|||
|
|
this.guigeshow = false
|
|||
|
|
this.propshow1 = true
|
|||
|
|
this.propshow = false
|
|||
|
|
this.ruleshow = false
|
|||
|
|
this.attr = []
|
|||
|
|
this.ruleValue = []
|
|||
|
|
this.guigeclect()
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 单规格
|
|||
|
|
guigeclect(){
|
|||
|
|
if(this.price == ''){
|
|||
|
|
this.price = '0'
|
|||
|
|
}
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('goods/onlyFormatAttr'),
|
|||
|
|
method: 'get',
|
|||
|
|
params: this.$http.adornParams({
|
|||
|
|
'price':this.price,
|
|||
|
|
'coverImg':this.coverImg,
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.headerData2 = returnData.header
|
|||
|
|
this.valueData2 = returnData.value
|
|||
|
|
this.propshow = false
|
|||
|
|
this.propshow1 = true
|
|||
|
|
this.sku = returnData.value
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
handleChange1(value) {
|
|||
|
|
this.value.forEach(element => {
|
|||
|
|
this.typeId = element;
|
|||
|
|
});
|
|||
|
|
},
|
|||
|
|
handleChange(file, fileList){
|
|||
|
|
this.hideUpload = fileList.length >= this.limit;
|
|||
|
|
},
|
|||
|
|
handleRemove(file, fileList) {
|
|||
|
|
this.hideUpload = fileList.length >= this.limit;
|
|||
|
|
},
|
|||
|
|
handleAvatarSuccess1(file,fileList) {
|
|||
|
|
this.coverImg = file.data
|
|||
|
|
},
|
|||
|
|
//上传成功
|
|||
|
|
handleUploadSuccess(file,fileList) {
|
|||
|
|
this.photos+=file.data+','
|
|||
|
|
},
|
|||
|
|
// 返回上一级
|
|||
|
|
prev(){
|
|||
|
|
this.$router.back()
|
|||
|
|
},
|
|||
|
|
// 发布商品
|
|||
|
|
artiReleass(){
|
|||
|
|
let photost=this.photos;
|
|||
|
|
photost = photost.substr(0,photost.length-1)
|
|||
|
|
if (this.title == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入商品标题',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.price == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入商品积分',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.price < 1) {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '商品积分不能小于1',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.status == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请选择商品状态',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.sales == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入商品销量',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.buyReason == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入产品参数',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.isExpress == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请选择商品是否发货',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.coverImg == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请选择商品封面图',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.descrition == '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入商品详情',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.sku.length == 0) {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请选择商品规格',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if (this.postagePrice === '') {
|
|||
|
|
this.$notify({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入邮费',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('goods/save'),
|
|||
|
|
method: 'post',
|
|||
|
|
data: this.$http.adornData({
|
|||
|
|
'img':photost,
|
|||
|
|
'title':this.title,
|
|||
|
|
'merchants':this.merchants,
|
|||
|
|
'originalPrice':this.originalPrice,
|
|||
|
|
'price':this.price,
|
|||
|
|
'memberPrice':this.memberPrice,
|
|||
|
|
'sales':this.sales,
|
|||
|
|
'status':this.status,
|
|||
|
|
'coverImg':this.coverImg,
|
|||
|
|
'descrition':this.descrition,
|
|||
|
|
'commissionPrice':this.commissionPrice,
|
|||
|
|
'isSelect':this.isSelect,
|
|||
|
|
'homeGoods':this.homeGoods,
|
|||
|
|
'buyReason':this.buyReason,
|
|||
|
|
'isRecommend':this.isRecommend,
|
|||
|
|
'isExpress':this.isExpress,
|
|||
|
|
'postagePrice':this.postagePrice,
|
|||
|
|
'sku':this.sku,
|
|||
|
|
'attr':this.attr,
|
|||
|
|
'brandId':this.brandId,
|
|||
|
|
'isJiFenGoods':this.isJiFenGoods
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
this.$message({
|
|||
|
|
message: '操作成功',
|
|||
|
|
type: 'success',
|
|||
|
|
duration: 1500,
|
|||
|
|
onClose: () => {
|
|||
|
|
this.title = ''
|
|||
|
|
this.type = ''
|
|||
|
|
this.merchants = ''
|
|||
|
|
this.price = ''
|
|||
|
|
this.memberPrice = ''
|
|||
|
|
this.originalPrice = ''
|
|||
|
|
this.sales = ''
|
|||
|
|
this.descrition = ''
|
|||
|
|
this.postagePrice = ''
|
|||
|
|
this.status = ''
|
|||
|
|
this.buyReason = ''
|
|||
|
|
this.brandId = ''
|
|||
|
|
this.$router.push({path: '/integralist'})
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
// 商品分类
|
|||
|
|
dataSelect () {
|
|||
|
|
this.tableDataLoading = true
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('goodsType/result'),
|
|||
|
|
method: 'get',
|
|||
|
|
params: this.$http.adornParams({
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
this.tableDataLoading = false
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.typeDatas = returnData
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 商品规格
|
|||
|
|
specifSelect () {
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('goods/info'),
|
|||
|
|
method: 'get',
|
|||
|
|
params: this.$http.adornParams({
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.specifdata = returnData;
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 删除商品属性
|
|||
|
|
deleter(index){
|
|||
|
|
let length = this.sku.length
|
|||
|
|
if(length == 1){
|
|||
|
|
this.$message({
|
|||
|
|
title: '提示',
|
|||
|
|
type: 'error',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '属性至少要有一个',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}else{
|
|||
|
|
this.sku.splice(index, 1);
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
// 查询商品规格
|
|||
|
|
selectTrigger(val){
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('selfGoodsRule/find'),
|
|||
|
|
method: 'get',
|
|||
|
|
params: this.$http.adornParams({
|
|||
|
|
'id':val
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.ruleValue = returnData.ruleValue
|
|||
|
|
this.attrName = returnData.ruleName
|
|||
|
|
this.ruleshow = true
|
|||
|
|
this.ruleId = returnData.id
|
|||
|
|
this.create()
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
deleterule(index){
|
|||
|
|
this.ruleValue.splice(index, 1);
|
|||
|
|
},
|
|||
|
|
btnToclick(){
|
|||
|
|
this.isshow = false
|
|||
|
|
this.releobject.value = ''
|
|||
|
|
this.releobject.detail = ''
|
|||
|
|
},
|
|||
|
|
speciTotwo(){
|
|||
|
|
this.isshow = true
|
|||
|
|
this.releobject.value = ''
|
|||
|
|
this.releobject.detail = ''
|
|||
|
|
},
|
|||
|
|
speciTo(){
|
|||
|
|
if(this.releobject.value == ''){
|
|||
|
|
this.$message({
|
|||
|
|
title: '提示',
|
|||
|
|
type: 'error',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '请输入规格',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
if(this.releobject.detail == ''){
|
|||
|
|
this.$message({
|
|||
|
|
title: '提示',
|
|||
|
|
duration: 1800,
|
|||
|
|
type: 'error',
|
|||
|
|
message: '请输入规格值',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
this.ruleValue.push({
|
|||
|
|
value: this.releobject.value,
|
|||
|
|
detail:this.releobject.detail
|
|||
|
|
});
|
|||
|
|
this.isshow = true
|
|||
|
|
this.releobject.value = ''
|
|||
|
|
this.releobject.detail = ''
|
|||
|
|
},
|
|||
|
|
handleClose(tag,j,item) {
|
|||
|
|
var detailarr = item.detail.split(',')
|
|||
|
|
detailarr.splice(detailarr.indexOf('tag'),1);
|
|||
|
|
if(detailarr.length < 1){
|
|||
|
|
this.$message({
|
|||
|
|
title: '提示',
|
|||
|
|
type: 'error',
|
|||
|
|
duration: 1800,
|
|||
|
|
message: '规格值至少要有一个',
|
|||
|
|
type: 'warning'
|
|||
|
|
});
|
|||
|
|
return
|
|||
|
|
}else{
|
|||
|
|
item.detail = String(detailarr)
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
handleInputConfirm(index,item) {
|
|||
|
|
let inputValue = this.inputValues[index];
|
|||
|
|
if (inputValue) {
|
|||
|
|
var detailarr = item.detail.split(',')
|
|||
|
|
detailarr.push(inputValue)
|
|||
|
|
for(var i=0;i<detailarr.length;i++){
|
|||
|
|
for(var j=0;j<detailarr.length;j++){
|
|||
|
|
if(detailarr[i] == detailarr[j] && i !=j){
|
|||
|
|
detailarr.splice(j,1);
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
item.detail = String(detailarr)
|
|||
|
|
this.inputValues[index] = '';
|
|||
|
|
}
|
|||
|
|
this.inputVisible = false;
|
|||
|
|
},
|
|||
|
|
// 获取品牌
|
|||
|
|
brandSelect () {
|
|||
|
|
let page = this.page-1
|
|||
|
|
this.tableDataLoading = true
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl('selfGoodsBrand/result'),
|
|||
|
|
method: 'get',
|
|||
|
|
params: this.$http.adornParams({
|
|||
|
|
})
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
this.tableDataLoading = false
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.brandIds = returnData
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
// 立即生成
|
|||
|
|
create(){
|
|||
|
|
this.attr = []
|
|||
|
|
this.attr.push({
|
|||
|
|
attrName:this.attrName,
|
|||
|
|
attrValue:this.ruleValue,
|
|||
|
|
ruleId:this.ruleId
|
|||
|
|
})
|
|||
|
|
if(this.price == ''){
|
|||
|
|
this.price = '0'
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
this.$http({
|
|||
|
|
url: this.$http.adornUrl(`goods/isFormatAttr?coverImg=${this.coverImg}&price=${this.price}`),
|
|||
|
|
method: 'post',
|
|||
|
|
data: this.attr[0]
|
|||
|
|
}).then(({data}) => {
|
|||
|
|
let returnData = data.data;
|
|||
|
|
this.headerData = returnData.header
|
|||
|
|
this.valueData = returnData.value
|
|||
|
|
this.propshow = true
|
|||
|
|
this.propshow1 = false
|
|||
|
|
this.sku = returnData.value
|
|||
|
|
this.detailJson = returnData.value[0].detailJson.split(',')
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.specifSelect()
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped="scoped">
|
|||
|
|
.main-cont {
|
|||
|
|
max-width: 100%;
|
|||
|
|
min-width: 80%;
|
|||
|
|
padding-bottom:5%;
|
|||
|
|
background-color: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tinymce-container {
|
|||
|
|
position: relative;
|
|||
|
|
line-height: normal;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tinymce-container >>> .mce-fullscreen {
|
|||
|
|
z-index: 10000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tinymce-textarea {
|
|||
|
|
visibility: hidden;
|
|||
|
|
z-index: -1;
|
|||
|
|
}
|
|||
|
|
.hide .el-upload--picture-card {
|
|||
|
|
display: none;
|
|||
|
|
}
|
|||
|
|
.margin15{margin-right: 15px;margin-top: 10px;}
|
|||
|
|
.ruleitem {padding-left:10px;margin-top: 15px;}
|
|||
|
|
.ruleitem .ruleicon{position: relative;top: 3px; left:2px;width:1.2em;height:1.2em;}
|
|||
|
|
.el-tag + .el-tag {
|
|||
|
|
margin-left: 10px;
|
|||
|
|
}
|
|||
|
|
.button-new-tag{
|
|||
|
|
height: 32px;
|
|||
|
|
line-height: 31px;
|
|||
|
|
padding-top: 0;
|
|||
|
|
padding-bottom: 0;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
border-top-left-radius: 0;
|
|||
|
|
border-bottom-left-radius: 0;
|
|||
|
|
background-color: #f5f7fa;
|
|||
|
|
position: relative;
|
|||
|
|
left: -5px;
|
|||
|
|
border-color: #dcdfe6;
|
|||
|
|
border: 1px solid #dcdfe6;
|
|||
|
|
}
|
|||
|
|
.input-new-tag {
|
|||
|
|
width: 90px;
|
|||
|
|
margin-left: 10px;
|
|||
|
|
vertical-align: bottom;
|
|||
|
|
}
|
|||
|
|
.el-input--small .el-input__inner{
|
|||
|
|
border-top-right-radius: 0;
|
|||
|
|
border-bottom-right-radius: 0;
|
|||
|
|
}
|
|||
|
|
.el-table--enable-row-transition .el-table__body td{
|
|||
|
|
text-align: center;
|
|||
|
|
}
|
|||
|
|
.imgWrap .avatar-uploader .el-upload{
|
|||
|
|
width: 60px;
|
|||
|
|
}
|
|||
|
|
.el-table .cell{
|
|||
|
|
text-align: center!important;
|
|||
|
|
}
|
|||
|
|
.el-tag--medium{margin-right: 10px;}
|
|||
|
|
</style>
|