提交 e27a56a5 authored 作者: 吴德鹏's avatar 吴德鹏

修改bug

上级 c0ae378f
......@@ -54,8 +54,9 @@
i.item_descrition_id,
i.item_top,
i.sort,
i.supplier
from tb_cf_station_item i
i.supplier,
item_desc itemDesc
from tb_cf_station_item i left join tb_cf_item_desc d on i.item_id=d.item_id
where i.item_id = #{id}
</select>
<select id="queryByItems" resultType="com.platform.entity.TbCfStationItemEntityExtends">
......
<!DOCTYPE html>
<html xmlns:v-bind="http://www.w3.org/1999/xhtml">
<head>
<title>站点商品</title>
#parse("sys/header.html")
<style>
ul > li {
list-style: none;
}
.container {
width: 800px;
color: #515a6e;
margin-left: 0;
}
.container p {
/*line-height: auto;*/
padding-bottom: 10px;
}
/* .container .title{border-bottom: 1px solid #f3f3f3;} */
.container .title > span:first-child {
padding-right: 80px;
}
/* 表单内容 */
.container .form-wrapper {
width: 100%;
border: 1px solid #eee;
padding: 5px;
}
.container .form-wrapper > h4 {
border-bottom: 1px solid #eee;
padding: 6px;
}
.container .form-wrapper > ul {
list-style: none;
}
.container .form-wrapper > ul > li {
padding: 10px;
}
.container .form-wrapper .f-select {
width: 80px;
border-radius: 2px;
outline: none;
margin-right: 50px;
}
.container option {
background: white;
border: white;
}
.container textarea {
vertical-align: top;
margin-right: 20px;
}
.slide-enter-active, .slide-leave-active {
transition: all 0.6s ease;
}
.slide-enter, .slide-leave-active {
transform: translate3d(50px, 0, 0);
opacity: 0;
}
/* 预览 */
.container .form-prev {
padding: 5px;
}
.container .form-prev > h4 {
border-top: 1px solid #eee;
padding: 6px;
}
.container .prev-li {
display: flex;
justify-content: start;
margin-bottom: 10px;
}
.container .prev-li img {
cursor: pointer;
object-fit: cover;
border-radius: 4px;
}
.ivu-tag {
padding: 2px 8px;
}
.container .prev-li > div {
margin-left: 5px;
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: center;
margin-right: 30px;
/* width:100px; */
}
.container .prev-del {
height: 25px;
transform: translateY(20px);
line-height: 50%;
}
.container .paramster-del {
transform: translateY(0px);
}
.ui-jqgrid .ui-jqgrid-bdiv {
height: auto !important;
}
.ivu-row {
margin: 5px;
position: relative;
margin-left: 15px;
margin-right: 0;
height: auto;
zoom: 1;
display: block;
padding: 15px 0;
}
.second {
margin-top: 15px;
margin-left: 15px;
}
.querydatas {
margin-top: 15px;
margin-left: 15px;
}
.query {
float: right;
margin-right: 260px;
}
.default-price {
margin-top: 10px;
margin-left: 10px;
}
.default-price > .default-price-in > div {
display: inline-block;
}
.default-price > h4 {
margin-bottom: 5px;
}
/* commnstyle */
.pp-text-center {
text-align: center;
margin: 10px;
}
.text-center {
text-align: center;
}
.pp-flex-sb {
display: flex;
justify-content: space-between;
align-items: center;
}
.pp-flex-center {
display: flex;
justify-content: center;
align-items: center;
}
.pp-flex-start {
display: flex;
justify-content: start;
align-items: center;
flex-wrap: wrap;
}
/* 标签弹窗*/
.pp-popup-wrapper {
width: 100vw;
height: 100vh;
position: fixed;
top: 0;
left: 0;
z-index: 100;
}
.pp-popup-mask {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
z-index: -1;
background: #000;
opacity: 0.5;
}
.pp-popup-container {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
height: 400px;
min-width: 600px;
background: #fff;
border-radius: 6px;
overflow-y: scroll;
padding: 10px;
}
.pp-tags-section {
margin-bottom: 22px;
}
.pp-popup-close {
position: absolute;
bottom: 10px;
left: 50%;
transform: translateY(-50%);
}
.pp-tags-subtag {
margin-left: 10px;
margin-top: 10px;
}
/*标签展示*/
.item-tag-container {
margin-bottom: 24px;
}
.item-tag-container > span {
width: 80px;
text-align: right;
vertical-align: middle;
float: left;
font-size: 12px;
color: #495060;
line-height: 1;
padding: 10px 12px 10px 0;
box-sizing: border-box;
font-weight: bold;
font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.item-tag-container > div {
width: 720px;
min-height: 32px;
background: white;
border-radius: 2px;
border: 1px solid #dddee1;
}
.tag-preview {
position: relative;
}
.add-tag-btn {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
.pp-tag {
margin: 5px;
display: inline-block;
min-width: 50px;
height: 30px;
background: #f9f9f9;
border-radius: 4px;
border: 1px solid #eee;
line-height: 30px;
text-align: center;
justify-content: space-between;
padding: 0 4px;
}
.pp-tag > i {
padding: 0 12px;
cursor: pointer;
color: black;
}
.attribute-img-container {
position: fixed;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 1000;
cursor: unset;
}
.attribute-img-container > .attribute-img-mask {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
}
.attribute-img-wrapper {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 1000px;
height: 700px;
background: white;
border-radius: 4px;
padding: 20px;
overflow: auto;
}
.attribute-img-wrapper-close {
position: absolute;
right: 20px;
top: 10px;
line-height: 22px;
color: black;
font-size: 22px;
cursor: pointer;
}
.attribute-img-upload {
position: absolute;
bottom: 0px;
left: 0px;
width: 100%;
height: 80px;
}
.attribute-img-lists {
padding: 10px;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
}
.attribute-img {
width: 150px;
height: 150px;
position: relative;
display: flex;
justify-content: center;
align-items: center;
cursor: pointer;
}
.attribute-img > .attribute-img-remove-icon {
width: 40px;
height: 20px;
position: absolute;
right: 20px;
top: 0;
cursor: pointer;
display: flex;
justify-content: space-between;
z-index: 10;
}
.attribute-img > img {
z-index: 9;
width: 80%;
height: 80%;
object-fit: cover;
}
.default-img {
width: 42px;
height: 42px;
background: url('http://ku.90sjimg.com/element_origin_min_pic/01/47/26/835743e2ba5da85.jpg') no-repeat;
background-size: 100% 100%;
cursor: pointer;
}
.attribute-sku-tag {
padding: 4px 8px;
border-radius: 4px;
border: 1px solid #eee;
display: inline-block;
margin: 5px;
cursor: pointer;
box-shadow: 2px 2px 2px #eee;
}
.attribute-sku-tag-active {
box-shadow: 2px 2px 2px #1ab394;
border-color: #1ab394;
}
.attr-img {
width: 58px;
height: 58px;
margin-right: 10px;
object-fit: cover;
}
.confirm-btn {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
}
.confirm-btn-price {
padding: 20px;
}
.confirm-btn-price > :first-child {
margin-right: 10px;
}
.flot-button {
top: 30px;
position: fixed;
float: right;
right: 30px;
z-index: 100;
}
</style>
</head>
<body>
<div id="rrapp" v-cloak>
<div v-show="showList">
<Row :gutter="16">
<div class="first">
<div class="querydatas">
<div class="search-group-up" style="margin-left: 30px">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span>
product number:
<i-input v-model="q.code" @on-enter="query" placeholder="product number" style="width:160px">
</i-input>
</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span style="margin-left: 50px">
product name:
<i-input v-model="q.name" @on-enter="query" placeholder="product name" style="width:160px">
</i-input>
</span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<!-- <span>-->
<!-- 供应商:-->
<!-- <i-input v-model="q.supplier" @on-enter="query" placeholder="供应商" style="width:160px">-->
<!-- </i-input>-->
<!-- </span> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;-->
<!-- <span>
creator:
<i-select v-model="q.creator" @on-enter="query"
placeholder="creator" style="width:160px">
<i-option v-for="(el,i) in creatorList" :key='i'
:value="el.userId">{{el.userName}}
</i-option>
</i-select>
</span>-->
&nbsp;&nbsp;&nbsp; <span style="margin-left: 115px">
product status:
<i-select v-model="q.status" @on-enter="query" placeholder="product status" style="width:160px">
<i-option value="1">online sale</i-option>
<i-option value="2">has been removed</i-option>
</i-select>
</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;<br/>
&nbsp;<br/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<div class="search-group-down" style="margin-left: 30px">
<span>
commodity classification:
<i-select v-model="q.itemCategory" @on-enter="query"
placeholder="commodity classification" style="width:160px" @on-change="changeGoodstype">
<i-option v-for="(el,i) in Goodstype" :key='i'
:value="el.goodstypeId">{{el.goodstypeTitle}}
</i-option>
</i-select>
</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span>
commodity secondary classification:
<i-select placeholder="commodity secondary classification" style="width:160px"
v-model="q.itemCategorytwo"
@on-enter="query"
@on-change="changeGoodstype2">
<i-option v-for="(el,i) in Goodstype2" :key='i'
:value="el.goodstwotypeId">{{el.goodstwotypeTitle}}
</i-option>
</i-select>
</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<span>
commodity three-level classification:
<i-select placeholder="please choose" @on-enter="query" v-model="q.itemDescritionId"
style="width:160px">
<i-option v-for="(el,i) in Goodstype3" :key='i'
:value="el.descripitionId">{{el.descripitionName}}
</i-option>
</i-select>
</span>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<div class="query">
<i-button @click="query" type="primary"><i class="fa fa-search"></i>query</i-button>
&nbsp;&nbsp;&nbsp;&nbsp;
<i-button @click="reloadSearch" type="primary"><i class="fa fa-refresh"></i>reset</i-button>
</div>
</div>
</div>
</div>
</div>
<br/>
<hr/>
<div class="second">
<div class="buttons-group">
#if($shiro.hasPermission("tbcfstationitem:save"))
<i-button type="info" @click="add"><i class="fa fa-plus"></i>&nbsp;add</i-button>
#end
#if($shiro.hasPermission("tbcfstationitem:update"))
<i-button type="warning" @click="update"><i class="fa fa-pencil-square-o"></i>&nbsp;update</i-button>
#end
#if($shiro.hasPermission("tbcfstationitem:changeItemStatus"))
<i-button type="success" @click="changeItemStatus(1)"><i class="fa fa-arrow-up"></i>&nbsp;on shelf
</i-button>
#end
#if($shiro.hasPermission("tbcfstationitem:changeItemStatus"))
<i-button type="warning" @click="changeItemStatus(2)"><i class="fa fa-arrow-down"></i>&nbsp;off shelf
</i-button>
<!-- #end-->
<!-- #if($shiro.hasPermission("tbcfstationitem:import"))-->
<!-- <i-button type="primary" @click="modal = true"><i class="fa fa-chevron-up"></i>导入-->
<!-- <Modal-->
<!-- v-model="modal"-->
<!-- title="商品导入"-->
<!-- @on-ok="ok"-->
<!-- @on-cancel="cancel">-->
<!-- <template>-->
<!-- <Upload action="../tbcfstationitem/importExcel/">-->
<!-- <i-Button icon="ios-cloud-upload-outline">请选择</i-Button>-->
<!-- </Upload>-->
<!-- </template>-->
<!-- </Modal>-->
<!-- </i-button>-->
<!-- #end-->
<!-- #if($shiro.hasPermission("tbcfstationitem:export"))-->
<!-- <i-button type="info" @click="exportExcel"><i class="fa fa-chevron-down"></i>&nbsp;导出-->
<!-- </i-button>-->
<!-- #end-->
#if($shiro.hasPermission("tbcfstationitem:delete"))
<i-button type="error" @click="changeItemStatus(0)"><i class="fa fa-trash-o"></i>&nbsp;delete</i-button>
#end
</div>
</div>
</Row>
<table id="jqGrid"></table>
</div>
<Card v-show="!showList">
<div class="flot-button">
<i-button class="fixed-submit preview"
@click="copy()" type="success">copy
</i-button>
<i-button class="fixed-submit preview"
v-show="show_paste_btn"
@click="paste()"
>paste
</i-button>
<i-button class="fixed-submit preview" v-show="tbCfStationItem.itemId"
@click="preview(tbCfStationItem.itemId,'pc')" type="primary">preview
</i-button>
<i-button class="fixed-submit" type="primary" @click="handleSubmit('formValidate')">commit</i-button>
<i-button class="fixed-back" type="warning" @click="back()"/>
back</i-button>
</div>
<p slot="title">{{title}}</p>
<i-form ref="formValidate" :model="tbCfStationItem" :rules="ruleValidate" :label-width="80">
<Form-item label="product number" prop="itemCode" style="width: 800px">
<i-input v-model="tbCfStationItem.itemCode" placeholder="product number"/>
</Form-item>
<Form-item label="product name" prop="itemName" style="width: 800px">
<i-input v-model="tbCfStationItem.itemName" placeholder="product name"/>
</Form-item>
<Form-item label="product title" prop="itemBrief" style="width: 800px">
<i-input v-model="tbCfStationItem.itemBrief" placeholder="product title"/>
</Form-item>
<!-- <Form-item label="商品链接" prop="itemUrl">
<i-input v-model="tbCfStationItem.itemUrl" placeholder="商品链接"/>
</Form-item>-->
<Form-item label="search for the keyword" prop="itemTags" style="width: 800px">
<i-input v-model="tbCfStationItem.itemTags" placeholder="search for the keyword"/>
</Form-item>
<div class="item-tag-container pp-flex-start">
<span>tag</span>
<div class="tag-preview">
<transition-group tag="div" name="slide">
<div class="pp-tag" v-for="(element,index) in isSelectedArr" :key="index">
<span>{{element.labelName}}</span>
<i @click="deleteTag(element,index)">x</i>
</div>
</transition-group>
<div class="add-tag-btn" @click="showTagPopup()">
<i-button type="success" shape="circle" size="small">add tag</i-button>
</div>
</div>
</div>
<div class="pp-popup-wrapper" v-if="tagshow">
<div class="pp-popup-mask"></div>
<div class="pp-popup-container">
<h3 class="pp-text-center">data selection</h3>
<div class="pp-tags-section" v-for="(element,index) in tagLists" :key="index">
<i-button
size="large"
:type="element.isSelected?'success':'info'"
@click="selectTag(element,index)"
>{{element.labelName}}
</i-button>
<transition-group tag="div" name="slide">
<i-button
class="pp-tags-subtag"
v-for="(subElement,subIndex) in subtaglist[index]" :key="subIndex"
size="small"
:type="subElement.isSelected?'success':''"
@click="selectSubTag(subElement,subIndex,index)"
>{{subElement.labelName}}
</i-button>
</transition-group>
</div>
<div class="pp-popup-close" @click="hideTagPopup">
<i-button type="ghost">close</i-button>
</div>
</div>
</div>
<!-- <Form-item label="商品标签" prop="itemLabel" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.itemLabel" placeholder="商品标签"/>-->
<!-- <div>123</div>-->
<!-- </Form-item>-->
<!-- <Form-item label="原价" prop="itemPrice" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.itemPrice" placeholder="原价(可不填)"/>-->
<!-- </Form-item>-->
<!-- <Form-item label="现价" prop="discountPrice" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.discountPrice" placeholder="现价"/>-->
<!-- </Form-item>-->
<!-- &lt;!&ndash; <Form-item label="商品库存" prop="item_count" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.itemCount" placeholder="商品库存"/>-->
<!-- </Form-item>&ndash;&gt;-->
<!-- <Form-item label="成本价" prop="costPrice" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.costPrice" placeholder="成本价"/>-->
<!-- </Form-item>-->
<Form-item label="product picture" prop="itemImg">
<!-- <i-input v-model="xPicture.pictureUrl" placeholder="图片地址"/> -->
<upload
multiple
action="../api/osstest/uploadtest"
:before-upload="handleBeforeUpload"
:on-success="vhandleSuccess" :show-upload-list="false" accept="image/jpeg, image/png">
<i-button icon="ios-cloud-upload-outline">please select a picture</i-button>
</upload>
<div id="imgWrapper" style="display: flex;position: relative;">
<div v-for="item in uploadList" style="margin-left: 5px;" :data-img-path="item">
<img :src="item" width="100" height="100" id="itemImg">
<i class="ivu-icon ivu-icon-ios-trash-outline"
style="cursor:pointer;display: flex;font-size: 24px;position: relative;left:11px"
@click="delImg1(item)"></i>
</div>
</div>
</Form-item>
<Form-item label="commodity link" prop="itemUrl" style="width: 800px">
<i-input v-model="tbCfStationItem.itemUrl" placeholder="commodity link"/>
</Form-item>
<!-- <Form-item label="供应商" prop="supplier" style="width: 800px">-->
<!-- <i-input v-model="tbCfStationItem.supplier" placeholder="供应商"/>-->
<!-- </Form-item>-->
<!-- <Form-item label="freight template" prop="country" style="width: 800px">-->
<!-- <i-select label="please choose" v-model="tbCfStationItem.template">-->
<!-- <i-option v-for="c in templateList" :key='c.templateId'-->
<!-- :value="c.templateId">{{c.templateTitle}}-->
<!-- </i-option>-->
<!-- </i-select>-->
<!-- </Form-item>-->
<Form-item label="commodity classification" prop="itemCategory" style="width: 800px">
<i-select placeholder="please choose" v-model="tbCfStationItem.itemCategory" @on-change="changeGoodstype">
<i-option v-for="(el,i) in Goodstype" :key='i'
:value="el.goodstypeId">{{el.goodstypeTitle}}
</i-option>
</i-select>
</Form-item>
<Form-item label="commodity secondary classification" prop="itemCategorytwo" style="width: 800px">
<i-select placeholder="please choose" v-model="tbCfStationItem.itemCategorytwo"
@on-change="changeGoodstype2">
<i-option v-for="(el,i) in Goodstype2" :key='i'
:value="el.goodstwotypeId">{{el.goodstwotypeTitle}}
</i-option>
</i-select>
</Form-item>
<Form-item label="commodity three-level classification" prop="itemDescritionId" style="width: 800px">
<i-select placeholder="please choose" v-model="tbCfStationItem.itemDescritionId">
<i-option v-for="(el,i) in Goodstype3" :key='i'
:value="el.descripitionId">{{el.descripitionName}}
</i-option>
</i-select>
</Form-item>
<!-- <Card class="container">-->
<!-- &lt;!&ndash; 标头 &ndash;&gt;-->
<!-- <p class="title">-->
<!-- <span><i style="color: red;">*</i>multiple attributes</span>-->
<!-- <i-switch size="large" v-model="putaway">-->
<!-- <Icon type="md-checkmark"></Icon>-->
<!-- <Icon type="md-close"></Icon>-->
<!-- </i-switch>-->
<!-- <span>available now</span>-->
<!-- </p>-->
<!-- &lt;!&ndash; 选项 &ndash;&gt;-->
<!-- <section class="form-wrapper">-->
<!-- <h4>options</h4>-->
<!-- <section class="default-price" v-show="!disabledChangeAttribute">-->
<!-- <h4>set default price and inventory-->
<!-- <i-switch v-model="setDefaultValue" :disabled="disabled">-->
<!-- <Icon type="md-checkmark"></Icon>-->
<!-- <Icon type="md-close"></Icon>-->
<!-- </i-switch>-->
<!-- </h4>-->
<!-- <div v-show="setDefaultValue" class="default-price-in">-->
<!-- <div>-->
<!-- <i-Input v-model="default_price" style="width:160px;margin-top:5px;" size="small"-->
<!-- placeholder="默认价格"/>-->
<!-- </div>-->
<!-- <div>-->
<!-- <i-Input v-model="default_count" style="width:160px;margin-top:5px;" size="small"-->
<!-- placeholder="默认数量"/>-->
<!-- </div>-->
<!-- </div>-->
<!-- </section>-->
<!-- <transition-group tag="ul" name="slide">-->
<!-- <li v-for="(el,i) in attrItem" :key="i">-->
<!-- <h6>选项{{i+1}}</h6>-->
<!-- <label>属性</label>-->
<!-- <i-Select-->
<!-- filterable-->
<!-- v-model="el.categoryName"-->
<!-- style="width:100px;margin:0 25px;"-->
<!-- allow-create-->
<!-- @on-create="handleCreateSelect"-->
<!-- :disabled='disabledChangeAttribute'-->
<!-- >-->
<!-- <i-Option v-for="(option,index) in el.option" :value="option" :key="index">{{option}}-->
<!-- </i-Option>-->
<!-- </i-Select>-->
<!-- &lt;!&ndash; <select class="f-select" v-model="el.selected">-->
<!-- <option v-for="(option,index) in el.option">{{option}}</option>-->
<!-- </select>&ndash;&gt;-->
<!-- <textarea-->
<!-- :disabled='disabledChangeAttribute'-->
<!-- @input="handleChangeContent" v-model="el.categoryDesc" cols="48" rows="2"-->
<!-- placeholder="请用逗号隔开各个选项"-->
<!-- ></textarea>-->
<!-- &lt;!&ndash; <i-button type="error" @click="delAttr(i)">删除</i-button> &ndash;&gt;-->
<!-- <i-button :disabled="disabledChangeAttribute" type="error" @click="confirmDel(i)">删除-->
<!-- </i-button>-->
<!-- </li>-->
<!-- </transition-group>-->
<!-- <i-button-->
<!-- v-show="!disabledChangeAttribute"-->
<!-- :disabled="disabledChangeAttribute"-->
<!-- style="margin-left:10px;margin-bottom:10px;margin-top:10px;"-->
<!-- type="success"-->
<!-- @click="addAttr"-->
<!-- >新增属性-->
<!-- </i-button>-->
<!-- <i-button-->
<!-- v-show="disabledChangeAttribute"-->
<!-- style="margin-left:10px;margin-bottom:10px;margin-top:10px;"-->
<!-- @click.stop="isShowAttributeContainer(true)"-->
<!-- >属性图片-->
<!-- </i-button>-->
<!-- <i-button-->
<!-- type="primary"-->
<!-- v-show="disabledChangeAttribute"-->
<!-- style="margin-left:10px;margin-bottom:10px;margin-top:10px;"-->
<!-- @click.stop="showBatchModel"-->
<!-- >批量操作-->
<!-- </i-button>-->
<!-- &lt;!&ndash; 上传图片&ndash;&gt;-->
<!-- <div class="attribute-img-container" v-show="showAttributeImg">-->
<!-- <div class="attribute-img-mask"></div>-->
<!-- <div class="attribute-img-wrapper">-->
<!-- <i class="attribute-img-wrapper-close" @click.stop="isShowAttributeContainer(false)">x</i>-->
<!-- <div class="attribute-img-lists">-->
<!-- <div class="attribute-img" v-for="(element,index) in AttributeImgArr">-->
<!-- <div class="attribute-img-remove-icon">-->
<!-- &lt;!&ndash; <Icon size="20" type="ios-eye-outline" ></Icon>&ndash;&gt;-->
<!-- <i></i>-->
<!-- <Icon size="20" type="ios-trash-outline"-->
<!-- @click="removeAttributeImg(element.img_path,index)"></Icon>-->
<!-- </div>-->
<!-- <img :src="element.img_path" @click="selectImg(element.img_path)">-->
<!-- </div>-->
<!-- <div class="attribute-img" @click="cancelSelectImg">-->
<!-- <img title="取消选择"-->
<!-- src="http://ku.90sjimg.com/element_origin_min_pic/01/47/26/835743e2ba5da85.jpg"-->
<!-- width="100%" height="100%"/>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div class="attribute-img-upload">-->
<!-- <Upload-->
<!-- multiple-->
<!-- type="drag"-->
<!-- :before-upload="handleBeforeUpload"-->
<!-- accept="image/jpeg, image/png"-->
<!-- action="../api/osstest/uploadtest"-->
<!-- :on-success="handleAttributeImgSuccess"-->
<!-- >-->
<!-- <div style="padding: 20px 0">-->
<!-- <Icon type="ios-cloud-upload" size="52" style="color: #3399ff"></Icon>-->
<!-- <p>点击或将文件拖拽到这里上传</p>-->
<!-- </div>-->
<!-- </Upload>-->
<!-- </div>-->
<!-- </div>-->
<!-- </div>-->
<!-- &lt;!&ndash; 批量操作&ndash;&gt;-->
<!-- <div class="attribute-img-container" v-show="showBatch">-->
<!-- <div class="attribute-img-mask"></div>-->
<!-- <div class="attribute-img-wrapper">-->
<!-- <h2 class="text-center">批量操作</h2>-->
<!-- <i class="attribute-img-wrapper-close" @click.stop="showBatch=false">x</i>-->
<!-- <Tabs active-key="key1">-->
<!-- <Tab-pane label="图片操作" key="key1">-->
<!-- <div>-->
<!-- <i-button-->
<!-- shape="circle"-->
<!-- v-for="(item,index) in selectBtnArr"-->
<!-- :type="item.isSelected?'primary':null"-->
<!-- @click="changeSelectBtnArr(item,index)"-->
<!-- style="margin-right:10px;"-->
<!-- >{{item.title}}-->
<!-- </i-button>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性规格</h3>-->
<!-- <div-->
<!-- class="attribute-sku-tag"-->
<!-- v-for="(item,index) in allAttributes"-->
<!-- @click="selectAttr(item,index)"-->
<!-- :class="item.isSelected?'attribute-sku-tag-active':null"-->
<!-- >{{item.text}}-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性图片</h3>-->
<!-- <div class="pp-flex-start">-->
<!-- <img-->
<!-- class="attr-img"-->
<!-- v-for="(item,index) in AttributeImgArr"-->
<!-- :src="item.img_path"-->
<!-- :style="item.isSelected?'border:2px solid #1ab394;border-radius:4px;':null"-->
<!-- @click="BatchSelectImg(item,index)"-->
<!-- />-->
<!-- <Upload-->
<!-- multiple-->
<!-- type="drag"-->
<!-- :before-upload="handleBeforeUpload"-->
<!-- accept="image/jpeg, image/png"-->
<!-- action="../api/osstest/uploadtest"-->
<!-- :on-success="handleAttributeImgSuccess"-->
<!-- :show-upload-list="false"-->
<!-- :format="['jpg','jpeg','png']"-->
<!-- :max-size="2048"-->
<!-- style="display: inline-block;width:58px;">-->
<!-- <div style="width: 58px;height:58px;line-height: 58px;">-->
<!-- <Icon type="camera" size="20"></Icon>-->
<!-- </div>-->
<!-- </Upload>-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性价格</h3>-->
<!-- <i-input type="number" ref="amount" @on-change="changeBatch($event,'amount')"-->
<!-- placeholder="属性价格"/>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性库存</h3>-->
<!-- <i-input type="number" ref="count" @on-change="changeBatch($event,'count')"-->
<!-- placeholder="属性库存"/>-->
<!-- </div>-->
<!-- <div style="height: 140px"></div>-->
<!-- <div class="confirm-btn">-->
<!-- <i-button type="primary" @click="saveBatchData()">保存</i-button>-->
<!-- </div>-->
<!-- </Tab-pane>-->
<!-- <Tab-pane label="价格操作" key="key2">-->
<!-- <div>-->
<!-- <div v-for="(el,i) in handleProductAttr_Batch" :key="i">-->
<!-- <h3 style="margin:20px 0;">{{el.categoryName}}</h3>-->
<!-- <div-->
<!-- class="attribute-sku-tag"-->
<!-- v-for="(option,index) in el.categoryDescArr" :key="index"-->
<!-- @click="handleClickProductAttr_Batch(option,index,i)"-->
<!-- :class="option.isSelected?'attribute-sku-tag-active':null"-->
<!-- >{{option.name}}-->
<!-- </div>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性价格</h3>-->
<!-- <i-input ref="amount" type="number"-->
<!-- @on-change="changeBatch($event,'amount')"-->
<!-- placeholder="属性价格"/>-->
<!-- </div>-->
<!-- <div>-->
<!-- <h3 style="margin:20px 0;">属性库存</h3>-->
<!-- <i-input ref="count" type="number" @on-change="changeBatch($event,'count')"-->
<!-- placeholder="属性库存"/>-->
<!-- </div>-->
<!-- <div class="pp-flex-center confirm-btn-price">-->
<!-- <i-button type="primary" @click="saveBatchDataPrice('use')">应用</i-button>-->
<!-- <i-button type="primary" @click="saveBatchDataPrice('save')">保存</i-button>-->
<!-- </div>-->
<!-- </div>-->
<!-- </Tab-pane>-->
<!-- </Tabs>-->
<!-- </div>-->
<!-- </div>-->
<!-- <br/>-->
<!-- <i-button style="margin-left:10px;margin-bottom:10px;margin-top:10px;"-->
<!-- @click="disabledChangeAttribute=true" v-show="!disabledChangeAttribute">-->
<!-- 确定商品规格-->
<!-- </i-button>-->
<!-- &lt;!&ndash; 预览 &ndash;&gt;-->
<!-- <section class="form-prev">-->
<!-- <h4>预览</h4>-->
<!-- <transition-group tag="ul" name="slide">-->
<!-- <li class="prev-li" v-for="(el,i) in prevItem" :key="i">-->
<!-- <div class="prev-attr">-->
<!-- <img @click="HandleSelectAttributeImg(el,i)" width="42" height="42" :src="el.skuImg"-->
<!-- v-if="el.skuImg"/>-->
<!-- <div @click="HandleSelectAttributeImg(el,i)" class="default-img" v-else></div>-->
<!-- </div>-->
<!-- <div class="prev-attr">-->
<!-- <span>{{el.skuName}}</span>-->
<!-- &lt;!&ndash; <div class="attribute-sku-tag" style="height:24px;width:auto;white-space:nowrap; box-shadow: none">{{el.skuDesc}}</div>&ndash;&gt;-->
<!-- <Tag color="geekblue" style="white-space:nowrap;">{{el.skuDesc}}</Tag>-->
<!-- </div>-->
<!-- <div class="prev-price">-->
<!-- <span>价格</span>-->
<!-- <i-input :disabled="!disabledChangeAttribute" v-model='el.skuPrice' size="small"-->
<!-- placeholder="USD"/>-->
<!-- </div>-->
<!-- <div class="prev-count">-->
<!-- <span>数量</span>-->
<!-- <i-input :disabled="!disabledChangeAttribute" v-model='el.skuCount' size="small"-->
<!-- type="number" placeholder="0"/>-->
<!-- </div>-->
<!-- <div class="prev-code">-->
<!-- <span>商品编码</span>-->
<!-- <i-input :disabled="!disabledChangeAttribute" v-model='el.skuCode' size="small"-->
<!-- placeholder="0"/>-->
<!-- </div>-->
<!-- <i-button :disabled="!disabledChangeAttribute" class="prev-del" type="warning"-->
<!-- @click="del(i)">删除-->
<!-- </i-button>-->
<!-- </li>-->
<!-- </transition-group>-->
<!-- </section>-->
<!-- &lt;!&ndash; <i-button style="margin-left:10px;" type="primary" @click='save'>保存</i-button>&ndash;&gt;-->
<!-- </section>-->
<!-- </Card>-->
<Card class="container" style="margin-top:20px;">
<section class="form-wrapper">
<h4>商品参数</h4>
<transition-group tag="ul" name="slide">
<li class="prev-li" v-for="(item,index) in paramster" :key="index" style="margin-bottom: 0;">
<div>
<i-input v-model="item.paramName" size="small" type="text" placeholder="参数名称"/>
</div>
<div>
<i-input v-model="item.paramValue" size="small" type="text" placeholder="参数值"/>
</div>
<i-button class="prev-del paramster-del" type="warning" @click="delParamster(index)">删除
</i-button>
</li>
</transition-group>
<i-button
size="small"
style="margin-left:15px;margin-bottom:10px;margin-top:10px;"
type="success"
@click="addProductParams()"
>新增参数
</i-button>
</section>
</Card>
<!-- 删除警告 -->
<Modal
v-model="alertShow"
@on-ok="delAttr">
<p>确认删除此属性</p>
</Modal>
<!-- 粘贴提示-->
<Modal
v-model="paste_modal"
title="确认粘贴?"
@on-ok="comfirmPaste()"
>
<h4>粘贴内容如下:</h4>
<br/>
<p>1.搜索关键词。</p>
<p>2.标签。</p>
<p>3.供应商。</p>
<p>4.商品分类。</p>
<p>5.商品参数。</p>
<i>PS:如需增加可粘贴内容请与开发团队联系。</i>
</Modal>
<br/>
<br/>
<Form-item label="product description" prop="itemDesc">
<!-- <script id="Detail" name="tbCfVersion.versionDetail"type="text/plain">${pd.COLLSORT_DETAILS}</script>-->
<textarea id="itemDesc" style="width: 800px;height: 600px;"></textarea>
</Form-item>
<Form-item>
<i-button type="primary" @click="handleSubmit('formValidate')">commit</i-button>
<i-button type="warning" @click="back()" style="margin-left: 8px"/>
back</i-button>
<i-button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">reset</i-button>
</Form-item>
</i-form>
<!-- 退出警告 -->
<Modal
v-model="showQuitHint"
@on-ok="quit">
<p>not saved yet, do you want to exit?</p>
</Modal>
</Card>
<script src="${rc.contextPath}/js/plugins/Sortable.min.js"></script>
<script src="${rc.contextPath}/statics/libs/iview.js"></script>
<script src="${rc.contextPath}/js/sys/tbcfstationitemEn.js?_${date.systemTime}"></script>
<script type="text/javascript">
var content = UE.getEditor('itemDesc');
UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
UE.Editor.prototype.getActionUrl = function (action) {
if (action == 'uploadimage' || action == 'uploadscrawl' || action == 'uploadimage') {
return '${rc.contextPath}/api/osstest/uploaditemimage';
} else {
return this._bkGetActionUrl.call(this, action);
}
};
</script>
</body>
</html>
......@@ -812,6 +812,18 @@ itemStatusFormat = function (cellvalue) {
}
return returnStr;
}
itemStatusFormatEn = function (cellvalue) {
var returnStr;
if (cellvalue == '1') {
returnStr = "<i-button class=\"ivu-btn ivu-btn-info\" style='border-radius:25px;' type=\"info\">online sale</i-button>";
} else if (cellvalue == '2') {
returnStr = "<i-button class=\"ivu-btn ivu-btn-warning\" style='border-radius:25px;' type=\"warning\">has been removed</i-button>";
} else if (cellvalue == '0') {
returnStr = "<i-button class=\"ivu-btn ivu-btn-error\" style='border-radius:25px;' type=\"error\">deleted</i-button>";
}
return returnStr;
}
shows = function (cellvalue, options, rowObject) {
let returnStr;
returnStr = "<i-button class=\"ivu-btn ivu-btn-info\" onclick=showWord('" + rowObject.id + "') type=\"info\">查看</i-button>";
......
$(function () {
$("#jqGrid").Grid({
url: '../tbcfstationitem/list',
colModel: [
{label: 'itemId', name: 'itemId', index: 'item_id', key: true, hidden: true},
{label: 'product picture', name: 'itemImg', index: 'item_img', width: 80, formatter: imageFormat},
{label: 'product number', name: 'itemCode', index: 'item_code', width: 80},
{label: 'product name', name: 'itemName', index: 'item_name', width: 120},
/* {label: '商品标题', name: 'itemBrief', index: 'item_brief', width: 120},*/
/*{label: '商品链接', name: 'itemUrl', index: 'item_url', width: 80,formatter:linkFormat},*/
// {label: '商品原价', name: 'itemPrice', index: 'item_price', width: 45},
// {label: '商品现价', name: 'discountPrice', index: 'discount_price', width: 45},
{label: 'stock', name: 'itemCount', index: 'item_count', width: 45},
// {label: '点击量', name: 'itemNum', index: 'item_num', width: 45},
/*{label: '所属平台', name: 'platformCode', index: 'platform_code', width: 80},
{label: '平台名', name: 'platformName', index: 'platform_name', width: 80},*/
// {label: '供应商', name: 'supplier', index: 'supplier', width: 80},
{label: '置顶', name: 'itemTop', index: 'item_top', width: 80, hidden: true},
{label: 'commodity classification', name: 'goodtype', index: 'goodtype', width: 110},
{label: 'commodity secondary classification', name: 'title', index: 'title', width: 155},
{label: 'commodity three-level classification', name: 'dname', index: 'itemDescritionId', width: 155},
{label: 'status', name: 'enableFlag', index: 'enable_flag', width: 70, formatter: itemStatusFormatEn},
{label: 'creation date', name: 'createTime', index: 'create_time', width: 80},
// {label: 'creator', name: 'uname', index: 'uname', width: 80},
{
label: 'operate', index: 'operate', width: 120, formatter: function (value, grid, rows) {
if (rows.itemTop === 1) {
return '<span class="label label-primary pointer" onclick="vm.itemUpward(\'' + rows.itemId + '\')" ">up</span>&nbsp;&nbsp;' +
'<span class="label label-success pointer" onclick="vm.itemDownward(\'' + rows.itemId + '\')" ">down</span>&nbsp;&nbsp' +
'<span class="label label-danger pointer" onclick="vm.cancelTop(\'' + rows.itemId + '\')" ">unpink</span>&nbsp;&nbsp;';
}
return '<span class="label label-info pointer" onclick="vm.itemTop(\'' + rows.itemId + '\')">top</span>&nbsp;&nbsp;'
}
}
]
});
});
let vm = new Vue({
el: '#rrapp',
data: {
templateList: [],
modal: false,
showList: true,
title: null,
tbCfStationItem: {},
Goodstype: null,
Goodstype2: null,
uploadList: [],
uploadList1: [],
creatorList: [],
Goodstype3: null,
handleCreateSelect: null,
ruleValidate: {
name: [
{required: true, message: 'Name is required', trigger: 'blur'}
]
},
q: {
name: '',
code: '',
status: '',
supplier: '',
itemCategory: '',
creator: ''
},
alertShow: false,//警告弹窗
serverSkuAttr: [],
attrItem: [{
categoryName: 'Size',
option: [],
categoryDesc: ''
}],//属性设置
prevItem: [],//组合数组
delIndex: null,
putaway: false,//是否立即上架
default_price: '',
default_count: '',
setDefaultValue: false,
tmdSkudata: null,
isDisabled: false,
disabled: false,
itemLabel: null,
itemImg: null,
tagLists: [],//标签列表
subtaglist: [],//子便签
tagshow: false,
isSelectedArr: [], //选中标签的数组
//2020年4月9日
showAttributeImg: false, //显示属性图片模态框
AttributeImgArr: [],
skuListsIndex: null,//sku选中索引
disabledChangeAttribute: false,//禁止改变商品属性
showBatch: false,//显示批量操作模态框
selectBtnArr: [
{isSelected: false, title: '全选'},
{isSelected: false, title: '反选'},
{isSelected: false, title: '取消选择'}
],
allAttributes: [],//所有具体属性
batchAmount: 0,
batchCount: 0,
//2020年5月20日 商品参数
paramster: [],
show_paste_btn: false,// 粘贴按钮
paste_modal: false,
showQuitHint: false,
// 细粒度价格控制,
handleProductAttr_Batch: [],
},
methods: {
//商品置顶
itemTop(id) {
Ajax.request({
url: "../tbcfstationitem/itemTop?itemId=" + id,
type: "GET",
contentType: "application/json",
successCallback: function (resultData) {
vm.reload();
// console.log(resultData);
!notShowMessage ? iview.Message.success(resultData.success) : null;
}
});
},
//商品取消置顶
cancelTop(id) {
Ajax.request({
url: "../tbcfstationitem/cancelTop?itemId=" + id,
type: "GET",
contentType: "application/json",
successCallback: function (resultData) {
vm.reload();
// console.log(resultData);
!notShowMessage ? iview.Message.success(resultData.success) : null;
}
});
},
//商品向上
itemUpward(id) {
Ajax.request({
url: "../tbcfstationitem/itemUpward?itemId=" + id,
type: "GET",
contentType: "application/json",
successCallback: function (resultData) {
vm.reload();
// console.log(resultData);
!notShowMessage ? iview.Message.success(resultData.success) : null;
}
});
},
//商品向下
itemDownward(id) {
Ajax.request({
url: "../tbcfstationitem/itemDownward?itemId=" + id,
type: "GET",
contentType: "application/json",
successCallback: function (resultData) {
vm.reload();
// console.log(resultData);
!notShowMessage ? iview.Message.success(resultData.success) : null;
}
});
},
//保存批量操作价格的数据
saveBatchDataPrice(e) {
if (this.batchAmount && this.batchCount) {
let _this = this;
function handlePrice() {
let arr = [], combinationArr = [], attr_first = '';
_this.handleProductAttr_Batch.map(item => {
item.categoryDescArr.map(_item => {
_item.isSelected ? arr.push(_item.name) : void (0);
})
})
if (_this.handleProductAttr_Batch.length === 2) {
attr_first = arr.shift();
}
arr.forEach(item => {
if (_this.handleProductAttr_Batch.length === 2) {
combinationArr.push(attr_first + '/' + item);
} else {
combinationArr.push(item);
}
});
let str = combinationArr.join('/');
if (_this.handleProductAttr_Batch.length === 3) {
combinationArr = [];
combinationArr.push(str);
}
_this.prevItem.map(item => {
combinationArr.map(_item => {
if (item.skuDesc === _item) {
item.skuCount = _this.batchCount;
item.skuPrice = _this.batchAmount;
_this.$forceUpdate();
}
})
})
_this.$Message.info('应用成功');
}
if (e === 'use') {
handlePrice();
} else {
handlePrice();
this.showBatch = false;
}
} else {
alert('请先设置价格和库存');
}
},
handleClickProductAttr_Batch(e, index, parent_index) {
if (this.handleProductAttr_Batch.length === 2) {
if (parent_index === 0) {
this.handleProductAttr_Batch[parent_index].categoryDescArr.map(item => item.isSelected = false)
this.handleProductAttr_Batch[parent_index].categoryDescArr[index].isSelected = true;
this.$forceUpdate();
} else {
this.handleProductAttr_Batch[parent_index].categoryDescArr[index].isSelected = !this.handleProductAttr_Batch[parent_index].categoryDescArr[index].isSelected;
this.$forceUpdate();
}
} else {
this.handleProductAttr_Batch[parent_index].categoryDescArr.map(item => item.isSelected = false)
this.handleProductAttr_Batch[parent_index].categoryDescArr[index].isSelected = true;
this.$forceUpdate();
}
},
//预览
preview(e, to) {
if (to === 'pc') {
window.open(`https://www.afrieshop.com/product_detail?pid=${e}&from=backstage management system&from_fullPath=${window.location.herf}`, '_blank');
} else {
window.open(`https://m.afrieshop.com/#/home/product?id=${e}`, '_blank');
}
},
cancelSelectImg() {
this.prevItem[this.skuListsIndex].skuImg = null;
this.showAttributeImg = false;
},
changeBatch(e, flag) {
if (flag === 'amount') {
this.batchAmount = e.target.value;
} else {
this.batchCount = e.target.value;
}
},
//批量操作
saveBatchData() {
let activeImgPath = '';
this.AttributeImgArr.map(item => {
item.isSelected ? activeImgPath = item.img_path : null;
});
this.allAttributes.forEach(item => {
console.log('456789', item.isSelected)
console.log('amount', this.batchAmount)
console.log('count', this.batchCount)
if (item.isSelected) {
item.amount = this.batchAmount;
item.count = this.batchCount;
item.skuImg = activeImgPath;
return false;
}
})
this.prevItem.map(item => item.isSelected = false);
this.prevItem.map(item => {
this.allAttributes.map(_item => {
if (_item.isSelected && item.skuDesc.includes(_item.text)) {
item.isSelected = true;
}
})
})
this.prevItem.map((item, index) => {
if (item.isSelected) {
item.skuImg = activeImgPath;
item.skuPrice = this.batchAmount;
item.skuCount = this.batchCount;
}
})
this.prevItem.map(item => delete item.isSelected);
this.showBatch = false;
},
//批处理图片选择
BatchSelectImg(item, index) {
this.AttributeImgArr.map((_item, _index) => index !== _index ? _item.isSelected = false : null);
this.AttributeImgArr[index].isSelected = !this.AttributeImgArr[index].isSelected;
},
//批量处理单选属性
selectAttr(e, index) {
this.allAttributes[index].isSelected = !this.allAttributes[index].isSelected;
},
//显示批量处理模态框
showBatchModel() {
// this.$refs.amount.$el.children[1].value = this.batchAmount = null;
// this.$refs.count.$el.children[1].value = this.batchCount = null;
this.showBatch = true;
//获取所有具体属性
this.allAttributes = [];
this.attrItem[0].categoryDesc.split(',').map(_item => this.allAttributes.push({
text: _item,
isSelected: false,
amount: null,
count: null,
skuImg: null
}));
this.handleProductAttr_Batch = [];
this.attrItem.forEach(item => {
this.handleProductAttr_Batch.push({
categoryDesc: item.categoryDesc,
categoryName: item.categoryName
});
})
this.handleProductAttr_Batch.forEach(item => {
item.categoryDesc = item.categoryDesc.split(',');
item.categoryDescArr = [];
item.categoryDesc.forEach(_item => {
item.categoryDescArr.push({
name: _item,
isSelected: false
})
})
})
},
//切换批量选择按钮
changeSelectBtnArr(item, index) {
this.selectBtnArr.map((_item, _index) => _index !== index ? _item.isSelected = false : null);
this.selectBtnArr[index].isSelected = !this.selectBtnArr[index].isSelected;
if (index === 0) {
this.allAttributes.map(item => item.isSelected = true);
} else if (index === 1) {
this.allAttributes.map(item => item.isSelected = !item.isSelected);
} else {
this.allAttributes.map(item => item.isSelected = false);
}
},
selectImg(url) {
// console.log(this.prevItem[this.skuListsIndex]);
this.prevItem[this.skuListsIndex].skuImg = url;
this.$forceUpdate();
this.showAttributeImg = false;
},
//单条sku选择图片
HandleSelectAttributeImg(e, i) {
if (!this.disabledChangeAttribute) {
window.alert('请先确认商品规格后再操作。(确认商品规格后将不可再次编辑规格数据)');
} else {
this.showAttributeImg = true;
this.skuListsIndex = i;
}
},
//删除属性图片
removeAttributeImg(e, i, notShowMessage) {
this.$delete(this.AttributeImgArr, i);
this.delAttributeImg(e, notShowMessage);
},
//删除图片
delAttributeImg(url, notShowMessage) {
Ajax.request({
url: "../api/upload/delFile?url=" + url,
async: false,
type: "POST",
contentType: "application/json",
successCallback: function (resultData) {
// console.log(resultData);
!notShowMessage ? iview.Message.success(resultData.success) : null;
}
});
},
//处理属性图片上传成功回调
handleAttributeImgSuccess(e) {
this.AttributeImgArr.push({
img_path: e,
isSelected: false
});
console.log(e);
// this.delAttributeImg(e);
},
//控制属性图片模块框
isShowAttributeContainer(Bool) {
this.showAttributeImg = Bool;
},
//获取二级分类
changeGoodstype(e) {
let url;
if (e != null) {
url = "../tbcfstationitem/queryByItemType?typeId=" + e;
} else {
url = "../tbcfstationitem/queryByItemType?typeId=" + this.tbCfStationItem.itemCategory;
}
// console.log('url',url)
let that = this;
Ajax.request({
url: url,
type: "get",
contentType: "application/json",
successCallback: function (r) {
if (r.code === 0) {
that.Goodstype2 = r.list
e ? setTimeout(() => {
that.changeGoodstype2()
}, 0) : void (0);
if (r.list.length === 0) {
that.tbCfStationItem.itemCategorytwo = null
that.q.itemCategorytwo = null
}
}
}
});
},
changeGoodstype2(e) {
let url;
if (e != null) {
url = "../tbcfstationitem/queryByItemTypeTwo?typeTwoId=" + e;
} else {
url = "../tbcfstationitem/queryByItemTypeTwo?typeTwoId=" + this.tbCfStationItem.itemCategorytwo;
}
let that = this;
Ajax.request({
url: url,
type: "get",
contentType: "application/json",
successCallback: function (r) {
if (r.code === 0) {
that.Goodstype3 = r.descripiton
if (r.descripiton.length === 0) {
that.tbCfStationItem.itemDescritionId = null
that.q.itemDescritionId = null
}
}
}
});
},
query: function () {
vm.reload();
},
add: function () {
window.sessionStorage.getItem('_copy_product_info') ? this.show_paste_btn = true : void (0);
this.AttributeImgArr.length = 0;
this.paramster.length = 0;
this.paramster.push(
{
paramName: 'Style',
paramValue: ''
},
{
paramName: 'Material',
paramValue: ''
},
{
paramName: 'Fit Type',
paramValue: ''
}
);
vm.showList = false;
vm.title = "新增";
vm.tbCfStationItem = {};
this.uploadList.length = 0;
this.uploadList1.length = 0;
this.disabledChangeAttribute = false;
// vm.tbCfStationItem.itemImg = "";
UE.getEditor('itemDesc').setContent("");
},
update: function (event) {
window.sessionStorage.getItem('_copy_product_info') ? this.show_paste_btn = true : void (0);
this.disabledChangeAttribute = true;
this.prevItem = [];
let itemId = getSelectedRow("#jqGrid");
if (itemId == null) {
return;
}
vm.showList = false;
vm.title = "修改";
vm.getInfo(itemId);
},
saveOrUpdate: function (event) {
let flag = true
this.paramster.forEach(item => {
if (item.paramValue == '' || item.paramValue == null) {
flag = false
}
})
if (vm.prevItem.length === 0 || !flag) {
console.log(123);
alert('请编辑完属性或参数后再保存');
} else {
let resArr = [];
this.prevItem.forEach(item => {
resArr.push(item)
})
let paramArr = [];
this.paramster.forEach(item => {
paramArr.push(item)
})
vm.tbCfStationItem.paramster = this.paramster;
let label = null;
vm.tbCfStationItem.itemLabel = this.isSelectedArr.map(item => item.id).join(',');
vm.tbCfStationItem.prevItem = resArr
vm.tbCfStationItem.putaway = this.putaway
this.$set(vm.tbCfStationItem, 'tree', this.attrItem)
let _this = this;
let _temArr = [];
$('#imgWrapper').children().each((item, element) => {
_temArr.push($(element).attr('data-img-path'))
})
vm.uploadList = _temArr;
vm.tbCfStationItem.itemImg = vm.uploadList.map(res => res).join(';');
vm.tbCfStationItem.itemDesc = encodeURI(UE.getEditor('itemDesc').getContent()); // 富文本取值
vm.tbCfStationItem.itemDesc = vm.tbCfStationItem.itemDesc.replace(/&nbsp;/g, " ");
vm.tbCfStationItem.skuImgs = vm.AttributeImgArr.map(item => item.img_path).join(';');
let url = vm.tbCfStationItem.itemId == null ? "../tbcfstationitem/save" : "../tbcfstationitem/update";
Ajax.request({
url: url,
params: JSON.stringify(vm.tbCfStationItem),
type: "POST",
data: {
putaway: _this.putaway,
prevItem: vm.prevItem,
itemDesc: itemDesc,
},
contentType: "application/json",
successCallback: function (r) {
alert('操作成功', function (index) {
vm.reload();
});
}
});
}
},
del: function (event) {
let itemIds = getSelectedRows("#jqGrid");
if (itemIds == null) {
return;
}
confirm('确定要删除选中的记录?', function () {
Ajax.request({
url: "../tbcfstationitem/delete",
params: JSON.stringify(itemIds),
type: "POST",
contentType: "application/json",
successCallback: function () {
alert('操作成功', function (index) {
vm.reload();
});
}
});
});
},
changeItemStatus: function (status) {
let itemIds = getSelectedRows("#jqGrid");
if (itemIds == null) {
return;
}
Ajax.request({
url: "../tbcfstationitem/changeItemStatus?status=" + status,
params: JSON.stringify(itemIds),
type: "POST",
contentType: "application/json",
successCallback: function () {
alert('操作成功', function (index) {
vm.reload();
});
}
});
},
getInfo: function (itemId) {
this.AttributeImgArr = [];
// this.isDisabled = true
let _this = this
Ajax.request({
url: "../tbcfstationitem/info/" + itemId,
async: true,
successCallback: function (r) {
r.code === 0 && (() => {
_this.paramster = []
//回显参数
r.tbCfStationItem.paramList.map(item => {
_this.paramster.push({
paramName: item.paramName,
paramValue: item.paramValue
})
})
_this.attrItem = []
// let _option = JSON.parse(localStorage.getItem('option'))
//回显属性
r.tbCfStationItem.categoryList.map(item => {
_this.attrItem.push({
categoryName: item.categoryName,
option: _this.serverSkuAttr,
categoryDesc: item.categoryDesc
})
})
//回显sku组合
_this.tmdSkudata = r.tbCfStationItem.itemSkusList
r.tbCfStationItem.itemSkusList.map(item => {
_this.prevItem.push({
skuImg: null,
skuName: item.skuName,
skuDesc: item.skuDesc,
skuPrice: item.skuPrice,
skuCount: item.skuCount,
skuImg: item.skuImg,
skuCode: item.skuCode
})
})
if (r.tbCfStationItem.item.skuImgs) {
r.tbCfStationItem.item.skuImgs.split(';').map(item => {
vm.AttributeImgArr.push({
img_path: item,
isSelected: false
})
})
}
console.log(r)
})()
vm.tbCfStationItem = r.tbCfStationItem.item;
let img = vm.tbCfStationItem.itemImg;
vm.uploadList = img.split(';');
let itemDesc = vm.tbCfStationItem.itemDesc;
_this.changeGoodstype()
_this.changeGoodstype2()
vm.tbCfStationItem.enableFlag === 1 && (() => {
_this.putaway = true;
})()
try {
UE.getEditor('itemDesc').setContent(itemDesc);
} catch (e) {
}
setTimeout(() => {
UE.getEditor('itemDesc').setContent(itemDesc);
}, 500)
if (itemDesc == null || itemDesc == '') {
UE.getEditor('itemDesc').setContent("");
}
}
});
},
importExcel: function () {
this.modal = ''
},
exportExcel: function () {
Ajax.request({
url: "../tbcfstationitem/exportExcel/",
async: false,
type: "POST",
contentType: "application/json",
successCallback: function (resultData) {
alert('操作成功!导出位置:D:\\Afrishop', function (index) {
vm.reload();
});
}
});
},
back() {
this.showQuitHint = true;
},
reload: function (event) {
this.prevItem = []
this.attrItem = []
// this.isDisabled = false
this.disabledChangeAttribute = false
vm.showList = true;
let page = $("#jqGrid").jqGrid('getGridParam', 'page');
$("#jqGrid").jqGrid('setGridParam', {
postData: {
'name': vm.q.name.trim(),
'code': vm.q.code.trim(),
'status': vm.q.status.trim(),
'supplier': vm.q.supplier.trim(),
'itemCategory': vm.q.itemCategory,
'typeTwo': vm.q.itemCategorytwo,
'typeThree': vm.q.itemDescritionId,
'creator': vm.q.creator.trim(),
},
page: page
}).trigger("reloadGrid");
vm.handleReset('formValidate');
},
reloadSearch: function () {
vm.q = {
name: '',
code: '',
status: '',
supplier: '',
itemCategory: '',
creator: ''
};
vm.reload();
},
handleSubmit: function (name) {
handleSubmitValidate(this, name, function () {
vm.saveOrUpdate()
});
},
handleReset: function (name) {
handleResetForm(this, name);
},
// tirggerFile : function (event) {
// var file = event.target.files[0]; // (利用console.log输出看file文件对象)
// var formData = new FormData();
// formData.append("file", file);
// $.ajax({
// url: "../tbcfstationitem/image/",
// type: "POST",
// data: formData,
// cache: false, //不设置缓存
// processData: false, // 不处理数据
// contentType: false,// 不设置内容类型
// success: function (result) {
// result = JSON.parse(result);
// console.log(result)
// if (result.errno == 0) {//成功
// console.log(123,result)
// vm.tbCfStationItem.item.skuImg = result.data;
// console.log(vm.tbCfStationItem.item.skuImg)
// vm.$forceUpdate();
// } else {
// iview.Message.error(result.errmsg);
// }
// }
// });
// },
/** ******************************************************************************************** */
vhandleSuccess(response, file, fileList) {
// "http://diaosaas-prod.oss-cn-shenzhen.aliyuncs.com/education/155728894307110106.jpg"
console.log('shangchuan', response)
vm.uploadList.push(response);
$("#itemImg").show();
},
handleSuccess(response, file, fileList) {
// "http://diaosaas-prod.oss-cn-shenzhen.aliyuncs.com/education/155728894307110106.jpg"
vm.uploadList1.push(response);
$("#skuImg").show();
},
handleBeforeUpload(file) {
// 上传图片大小不超过5M
if (file.size > 5 * 1024 * 1024) {
alert('请上传不超过5M的图片');
return false;
}
// const check = this.uploadList.length < 1;
// if (!check) {
// this.$Notice.warning({
// title: '最多只能上传一张图片'
// });
// return false;
// }
// 限制上传文件的宽高
// return this.checkImageWH(file,750,320);
},
// 限制上传图片的宽高
checkImageWH: function (file, width, height) {
let self = this;
return new Promise(function (resolve, reject) {
let filereader = new FileReader();
filereader.onload = e => {
let src = e.target.result;
const image = new Image();
image.onload = function () {
if (width && image.width != width) {
self.$Notice.error({
title: '请上传宽为' + width + "的图片",
});
reject();
} else if (height && image.height != height) {
self.$Notice.error({
title: '请上传高为' + height + "的图片",
});
reject();
} else {
resolve();
}
};
image.onerror = reject;
image.src = src;
};
filereader.readAsDataURL(file);
});
},
// 删除上传图片
delImg1: function (url) {
if (vm.title != "详情") {
vm.uploadList.remove(url);
console.log(url);
Ajax.request({
url: "../api/upload/delFile?url=" + url,
async: false,
type: "POST",
contentType: "application/json",
successCallback: function (resultData) {
// console.log(resultData);
iview.Message.success(resultData.success);
}
});
}
},
/* 添加属性 */
addAttr() {
if (this.attrItem.length > 2) {
this.$Message.info('最多添加三种属性');
} else {
this.attrItem.push({
categoryName: 'Color',
// option: JSON.parse(localStorage.getItem('option')),
option: this.serverSkuAttr,
categoryDesc: ''
})
}
},
/* 删除属性 */
delAttr() {
let arr = new Array();
this.attrItem.map((item, index) => {
if (this.delIndex !== index) {
arr.push(item)
}
})
this.delIndex = null
this.attrItem = arr
this.handleChangeContent()
},
/* 删除单条组合 */
del(i) {
let arr = new Array();
this.prevItem.map((item, index) => {
if (i !== index) {
arr.push(item)
}
})
this.prevItem = arr
},
/* 确定删除 */
confirmDel(i) {
this.delIndex = i
this.alertShow = true
},
/* 计算所有规格的组合 */
handleChangeContent() {
/* 笛卡尔乘积 */
function product(arr) {
const result = arr.reduce((accArr, currentArr) => {
let result = []
currentArr.forEach(c => {
if (accArr.length) {
accArr.forEach(a => {
result.push(a.concat(c))
})
} else {
result.push([c])
}
})
return result
}, [])
return result.map(arr => arr.join('/'))
}
this.prevItem = [];
let contentArr = [] // 属性通过','分割后的数组
this.attrItem.map(item => {
let formatter = []
item.categoryDesc.split(',').map(item_c => {
if (item_c === '') return
formatter.push(item_c)
})
contentArr.push({size: formatter, name: item.categoryName})
})
let skuName = '' //sku组合名
let skuArr = []
contentArr.forEach((item_a, index_a) => {
skuName += item_a.name + '/';
skuArr.push(item_a.size);
})
skuName = skuName.slice(0, skuName.length - 1);
product(skuArr).forEach((item, index) => {
this.prevItem.push({
skuImg: null,
skuName: skuName,
skuDesc: item,
skuPrice: this.default_price,
skuCount: this.default_count
})
})
//显示回显数据
if (this.tmdSkudata) {
this.prevItem.map(item => {
this.tmdSkudata.map(_item => {
if (_item.skuDesc === item.skuDesc) {
item.skuPrice = _item.skuPrice
item.skuCount = _item.skuCount
}
})
})
}
},
ok() {
vm.reload();
},
cancel() {
},
handleCreateSelect(val) {
let option = JSON.parse(localStorage.getItem('option'))
option.push(val)
this.attrItem.map(item => {
item.option.push(val)
})
option = Array.from(new Set(option))
localStorage.setItem('option', JSON.stringify(option))
},
/* 保存 */
save() {
console.log(this.attrItem);
console.log(this.prevItem) //sku组合数组
},
/* 获取标签数据*/
getTagsData() {
//一级
$.get('../tbcflabel/queryParentLabels', res => {
this.tagLists = JSON.parse(res).list;
this.tagLists.forEach((item, index) => {
this.$set(this.tagLists[index], 'isSelected', false)
this.subtaglist.push([])
})
})
},
/*子标签*/
async getSubTagsData(id) {
let result = null;
await $.get('../tbcflabel/queryParentLabels?parentId=' + id, res => {
result = res;
})
return result
},
async selectTag(e, i) {
this.tagLists[i].isSelected = !this.tagLists[i].isSelected;
if (this.subtaglist[i].length === 0) {
let subtagData = await this.getSubTagsData(e.id);
this.subtaglist[i] = JSON.parse(subtagData).list;
this.subtaglist[i].forEach((item, index) => {
this.$set(this.subtaglist[i][index], 'isSelected', true);
})
this.$forceUpdate();
} else {
//单纯选中
if (this.tagLists[i].isSelected) {
this.subtaglist[i].forEach((item, index) => {
item.isSelected = true;
})
}
}
},
// 选中子标签
selectSubTag(element, index, parentIndex) {
this.tagLists[parentIndex].selectSubTag = false;
this.subtaglist[parentIndex][index].isSelected = !this.subtaglist[parentIndex][index].isSelected;
let allSelected = this.subtaglist[parentIndex].every(item => item.isSelected === true);
allSelected ? this.tagLists[parentIndex].isSelected = true : null;
this.$forceUpdate();
},
showTagPopup() {
this.tagshow = true;
},
hideTagPopup() {
this.tagshow = false;
this.isSelectedArr = [];
this.subtaglist.forEach(item => {
item.forEach(_item => {
_item.isSelected ? this.isSelectedArr.push(_item) : null;
})
})
console.log(this.isSelectedArr)
},
deleteTag(e, i) {
this.$delete(this.isSelectedArr, i)
},
/*
* 2020年5月20日
* 新增产品参数
*/
addProductParams() {
this.paramster.push({
paramName: null,
paramValue: null
})
},
delParamster(i) {
let arr = new Array();
this.paramster.map((item, index) => {
if (i !== index) {
arr.push(item)
}
})
this.paramster = arr;
},
//复制
copy() {
window.sessionStorage.setItem('_copy_product_info',
JSON.stringify({
search_keyword: this.tbCfStationItem.itemTags,
tags: this.isSelectedArr,
spe: this.tbCfStationItem.supplier,
catagory: {
level_one: this.tbCfStationItem.itemCategory,
level_two: this.tbCfStationItem.itemCategorytwo,
level_three: this.tbCfStationItem.itemDescritionId,
},
product_paramster: this.paramster
})
)
this.$Message.success('复制成功 0.0');
},
paste() {
this.paste_modal = true;
},
comfirmPaste() {
this.paste_modal = false;
this.$Message.success('粘贴成功 0.0');
let _paste_data = null;
_paste_data = JSON.parse(window.sessionStorage.getItem('_copy_product_info'));
this.tbCfStationItem.itemTags = _paste_data.search_keyword;
this.isSelectedAr = _paste_data.tags;
this.tbCfStationItem.supplier = _paste_data.spe;
this.tbCfStationItem.itemCategory = _paste_data.catagory.level_one || null;
this.changeGoodstype(true);
this.tbCfStationItem.itemCategorytwo = _paste_data.catagory.level_two || null;
this.tbCfStationItem.itemDescritionId = _paste_data.catagory.level_three || null;
this.paramster = _paste_data.product_paramster;
},
quit() {
//清除未保存商品的图片
if (!vm.tbCfStationItem.itemId) {
this.AttributeImgArr.map((item, index) => {
this.delAttributeImg(item.img_path, true);
})
setTimeout(() => {
this.AttributeImgArr = [];
}, 0)
}
this.reload();
}
},
created() {
this.getTagsData();
//数据初始化
if (!localStorage.getItem('option')) {
localStorage.setItem('option', JSON.stringify(this.attrItem[0].option))
} else {
this.attrItem[0].option = JSON.parse(localStorage.getItem('option'))
}
$.get('../tbcfgoodstype/queryAll', res => {
this.Goodstype = res.list;
})
$.get('../tbcfexpresstemplate/queryAll', res => {
console.log('国家', JSON.parse(res))
vm.templateList = JSON.parse(res).list;
})
$.get('../tbcfstationitem/queryCreator', res => {
let parse = JSON.parse(res);
this.creatorList = parse.list;
console.log('用户', this.creatorList)
})
//获取默认规格
$.get('../tbcategorytemplate/queryAll', res => {
let _res = JSON.parse(res)
_res.list.forEach(item => {
this.attrItem[0].option.push(item.categoryDesc)
this.serverSkuAttr.push(item.categoryDesc)
})
})
},
mounted() {
this.$nextTick(() => {
new Sortable(imgWrapper, {
swapThreshold: 1,
animation: 150,
});
})
}
});
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论