813 行
27 KiB
HTML
可执行文件
813 行
27 KiB
HTML
可执行文件
<!--[1.8.50]-->
|
||
<style>
|
||
[v-cloak] {
|
||
display: none;
|
||
}
|
||
|
||
.layui-table-body .layui-table-cell {
|
||
height: 120px !important;
|
||
}
|
||
|
||
.layui-table img {
|
||
max-width: 200px;
|
||
margin: auto;
|
||
display: block;
|
||
}
|
||
|
||
.container {
|
||
color: #333;
|
||
position: relative;
|
||
height: 100%;
|
||
padding: 0 20px!important;
|
||
}
|
||
|
||
.attr-title {
|
||
font-size: 14px;
|
||
padding: 10px;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
background-color: #f5f5f5;
|
||
position: relative;
|
||
}
|
||
|
||
.iconfont {
|
||
color: #232b42;
|
||
font-size: 22px;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.attr-detail {
|
||
transition: 0.3s;
|
||
overflow: hidden;
|
||
padding: 20px;
|
||
font-size: 12px;
|
||
}
|
||
|
||
.content {
|
||
width: 100%;
|
||
height: 100%;
|
||
box-sizing: border-box;
|
||
position: relative;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
.content-list {
|
||
display: flex;
|
||
align-items: center;
|
||
flex-wrap: wrap;
|
||
}
|
||
|
||
.content-list-name {
|
||
width: 140px;
|
||
}
|
||
|
||
.content-notes {
|
||
color: #999;
|
||
padding-left: 10px;
|
||
}
|
||
|
||
.attr-box {
|
||
margin: 20px 0;
|
||
border: 1px solid #eee;
|
||
transition: 0.3s;
|
||
}
|
||
|
||
.list-detail {
|
||
height: 24px;
|
||
border: 1px solid #e1e1e1;
|
||
border-radius: 12px;
|
||
padding: 0 0 0 15px;
|
||
line-height: 24px;
|
||
margin: 0 10px 10px 0;
|
||
display: flex;
|
||
}
|
||
|
||
.list-detail-focus {
|
||
border-color: #4da2ff;
|
||
}
|
||
|
||
.list-right-btn {
|
||
position: relative;
|
||
height: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
border-top-right-radius: 10px;
|
||
border-bottom-right-radius: 10px;
|
||
overflow: hidden;
|
||
}
|
||
|
||
.list-detail-save {
|
||
width: 30px;
|
||
text-align: center;
|
||
background-color: #4da2ff;
|
||
color: white;
|
||
cursor: pointer;
|
||
position: relative;
|
||
}
|
||
|
||
.list-detail-save:hover {
|
||
opacity: 0.9;
|
||
}
|
||
|
||
.list-detail-save::selection {
|
||
background-color: transparent;
|
||
}
|
||
|
||
.list-detail-save:active {
|
||
transform: scale(0.9);
|
||
opacity: 0.8;
|
||
}
|
||
|
||
.list-detail > input {
|
||
height: 100%;
|
||
border: none;
|
||
outline: none;
|
||
text-align: center;
|
||
border-right: 1px solid #eee;
|
||
color: #333;
|
||
}
|
||
|
||
.list-detail-del-box {
|
||
position: relative;
|
||
width: 30px;
|
||
height: 100%;
|
||
border-top-right-radius: 12px;
|
||
border-bottom-right-radius: 12px;
|
||
}
|
||
|
||
.list-detail-del-box:hover {
|
||
background-color: #f8f8f8;
|
||
color: white;
|
||
}
|
||
|
||
.list-detail-del-box:hover > .list-detail-del {
|
||
color: #bbb;
|
||
}
|
||
|
||
.list-detail-del {
|
||
position: absolute;
|
||
right: 6px;
|
||
top: 2px;
|
||
font-size: 18px;
|
||
font-weight: 300;
|
||
display: block;
|
||
width: 20px;
|
||
height: 20px;
|
||
text-align: center;
|
||
line-height: 20px;
|
||
border-radius: 50%;
|
||
transform: rotateZ(45deg);
|
||
color: #999;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.list-right-btn:hover > .list-detail-del {
|
||
color: white;
|
||
}
|
||
|
||
.list-detail-del::selection {
|
||
background-color: transparent;
|
||
}
|
||
|
||
.tips-box {
|
||
position: fixed;
|
||
width: 100%;
|
||
height: 100%;
|
||
top: 0;
|
||
left: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background-color: rgba(0, 0, 0, 0.3);
|
||
}
|
||
|
||
.tips-center {
|
||
background-color: white;
|
||
border-radius: 2px;
|
||
padding: 25px;
|
||
min-width: 280px;
|
||
min-height: 150px;
|
||
position: relative;
|
||
}
|
||
|
||
.tips-title {
|
||
height: 30px;
|
||
line-height: 16px;
|
||
font-size: 15px;
|
||
color: #333;
|
||
font-weight: bold;
|
||
}
|
||
|
||
.tips-content {
|
||
font-size: 13px;
|
||
line-height: 18px;
|
||
}
|
||
|
||
.tips-btn-box {
|
||
position: absolute;
|
||
bottom: 25px;
|
||
left: 0;
|
||
width: 100%;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: flex-end;
|
||
padding-right: 25px;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.tips-btn {
|
||
margin-left: 10px;
|
||
border: 1px solid #e1e1e1;
|
||
font-size: 12px;
|
||
line-height: 12px;
|
||
padding: 8px 18px;
|
||
color: #999;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.tips-btn-sure {
|
||
border-color: #4da2ff;
|
||
background-color: #4da2ff;
|
||
color: white;
|
||
border-radius: 2px;
|
||
}
|
||
|
||
.tips-close {
|
||
width: 18px;
|
||
height: 18px;
|
||
display: flex;
|
||
justify-content: center;
|
||
align-items: center;
|
||
position: absolute;
|
||
top: 18px;
|
||
right: 18px;
|
||
font-size: 36px;
|
||
line-height: 36px;
|
||
font-weight: 200;
|
||
transform: rotateZ(45deg);
|
||
color: #bbb;
|
||
cursor: pointer;
|
||
font-family: initial;
|
||
}
|
||
|
||
.tips-close::selection {
|
||
background-color: transparent;
|
||
}
|
||
|
||
.tips-close:active {
|
||
transform: scale(0.9) rotateZ(45deg);
|
||
}
|
||
|
||
::placeholder {
|
||
color: #aaa;
|
||
}
|
||
|
||
.attr-box-checked {
|
||
border-color: rgba(77, 162, 255, 0.8);
|
||
}
|
||
|
||
.attr-box-checked .attr-title {
|
||
background-color: rgba(77, 162, 255, 0.8);
|
||
color: white;
|
||
}
|
||
|
||
.attr-box-checked .attr-title i {
|
||
color: white;
|
||
}
|
||
|
||
.attr-name {
|
||
height: 30px;
|
||
box-sizing: border-box;
|
||
padding-left: 10px;
|
||
font-weight: bold;
|
||
width: 150px;
|
||
border: 1px solid #f5f5f5;
|
||
background-color: transparent;
|
||
border-radius: 2px;
|
||
color: #333;
|
||
}
|
||
|
||
.attr-box-checked .attr-name {
|
||
border-color: transparent;
|
||
color: white;
|
||
}
|
||
|
||
.attr-box-checked .attr-name::placeholder {
|
||
color: white;
|
||
}
|
||
|
||
.attr-name:focus {
|
||
background-color: white;
|
||
color: #333;
|
||
}
|
||
|
||
.flex {
|
||
display: flex;
|
||
align-items: center;
|
||
padding: 20px 0;
|
||
width: 100%;
|
||
background: white;
|
||
z-index: 1;
|
||
border-bottom: 1px solid #eee;
|
||
}
|
||
|
||
.search-input {
|
||
width: 200px;
|
||
height: 30px;
|
||
border: 1px solid #ccc;
|
||
border-radius: 2px;
|
||
box-sizing: border-box;
|
||
padding: 0 10px;
|
||
}
|
||
|
||
.search-input:focus {
|
||
border-color: #4da2ff;
|
||
}
|
||
|
||
.search-btn {
|
||
height: 30px;
|
||
width: 60px;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 2px;
|
||
margin-left: 20px;
|
||
cursor: pointer;
|
||
position: relative;
|
||
color: #999;
|
||
border: 1px solid #ccc;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.canClick {
|
||
color: white;
|
||
background-color: #4da2ff;
|
||
border-color: #4da2ff;
|
||
}
|
||
|
||
.search-btn::selection {
|
||
background-color: transparent;
|
||
}
|
||
|
||
.canClick:active {
|
||
opacity: 0.9;
|
||
transform: scale(0.95);
|
||
}
|
||
|
||
.attr-name-box {
|
||
width: 150px;
|
||
position: relative;
|
||
}
|
||
|
||
.attr-name-save {
|
||
position: absolute;
|
||
left: 151px;
|
||
top: 0;
|
||
height: 100%;
|
||
font-size: 12px;
|
||
width: 40px;
|
||
background: white;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
border-radius: 2px;
|
||
color: #666;
|
||
cursor: pointer;
|
||
}
|
||
|
||
.delAttr {
|
||
width: 24px;
|
||
height: 24px;
|
||
border-radius: 50%;
|
||
font-size: 24px;
|
||
line-height: 24px;
|
||
color: white;
|
||
background-color: rgba(0, 0, 0, 0.1);
|
||
position: absolute;
|
||
transform: rotateZ(45deg);
|
||
top: 12px;
|
||
right: 50px;
|
||
text-align: center;
|
||
cursor: pointer;
|
||
display: none;
|
||
}
|
||
|
||
.attr-title:hover .delAttr {
|
||
display: block;
|
||
}
|
||
|
||
.delAttr:hover {
|
||
background-color: rgba(0, 0, 0, 0.3);
|
||
}
|
||
|
||
.delAttr::selection {
|
||
background-color: transparent;
|
||
}
|
||
|
||
.delAttr:active {
|
||
transform: rotateZ(45deg) scale(0.9);
|
||
}
|
||
|
||
input:disabled {
|
||
background-color: transparent;
|
||
}
|
||
|
||
#scrollBox {
|
||
width: 100%;
|
||
overflow-y: auto;
|
||
flex: 1;
|
||
}
|
||
</style>
|
||
<div class="container" id="app" v-cloak>
|
||
<div class="content">
|
||
<div class="flex">
|
||
<input class="search-input" type="text" placeholder="搜索规格" v-model="searText"
|
||
@input="inputSearchText" @keydown.enter.exact="searchSku">
|
||
<div class="search-btn" :class="searText.length>0?'canClick':''" @click="searchSku">搜索</div>
|
||
</div>
|
||
<div id="scrollBox">
|
||
<template v-for="(item,index) in skuList">
|
||
<div class="attr-box"
|
||
:class="focusAttrIndex==index?'attr-box-checked':''" @click="setFocus(index)">
|
||
<if condition="$authArr['newSaveAttr'] eq true">
|
||
<div class="attr-title" v-if="item.id==0">
|
||
<div class="attr-name-box">
|
||
<input class="attr-name" type="text" v-model="item.name"
|
||
@input="inputAttr(item.name,index)"
|
||
@keydown.enter.exact="saveAttr(index)"
|
||
:placeholder="item.id!=0?item.name:'新增规格'">
|
||
<div class="attr-name-save" v-if="item.name!=item.old_name"
|
||
@click.stop="saveAttr(index)">
|
||
保存
|
||
</div>
|
||
</div>
|
||
<i class="iconfont" :class="item.isShow?'icon-xiangxia':'icon-xiangshang'"
|
||
@click="openContent(index)"></i>
|
||
</div>
|
||
</if>
|
||
<div class="attr-title" v-if="item.id!=0">
|
||
<div class="attr-name-box">
|
||
<input class="attr-name" type="text" v-model="item.name"
|
||
@input="inputAttr(item.name,index)"
|
||
@keydown.enter.exact="saveAttr(index)"
|
||
<if condition="$authArr['newSaveAttr'] neq true">disabled</if>
|
||
:placeholder="item.id!=0?item.name:'新增规格'">
|
||
<div class="attr-name-save" v-if="item.name!=item.old_name" @click.stop="saveAttr(index)">保存
|
||
</div>
|
||
</div>
|
||
<i class="iconfont" :class="item.isShow?'icon-xiangxia':'icon-xiangshang'"
|
||
@click="openContent(index)"></i>
|
||
<if condition="$authArr['newDelSku'] eq true">
|
||
<span v-if="index!=0" class="delAttr" @click.stop="delAttr(index)">+</span>
|
||
</if>
|
||
</div>
|
||
<div class="attr-detail" :style="item.isShow?'height:auto':'height:0;padding:0 12px;'">
|
||
<div class="content-list">
|
||
<template v-for="(list,i) in item.list">
|
||
<if condition="$authArr['newSaveAttr'] eq true">
|
||
<div class="list-detail" v-if="i==0"
|
||
:class="focusListIndex==i&&focusAttrIndex==index?'list-detail-focus':''"
|
||
@click.stop="toFocus(index,i)">
|
||
<input type="text" v-model="list.name" :placeholder="i==0?'新增':''"
|
||
@input="inputList(list.name,index,i)"
|
||
:style="list.name!=list.old_name&&list.id!=0?'width:117px;':''"
|
||
@keydown.enter.exact="saveList(index,i)">
|
||
<div class="list-right-btn"
|
||
:style="list.name!=list.old_name&&list.id!=0?'width:60px;':'width:30px;'">
|
||
<span class="list-detail-save" v-if="list.name!=list.old_name"
|
||
@click="saveList(index,i)">保存</span>
|
||
<div class="list-detail-del-box" v-if="list.id!=0">
|
||
<if condition="$authArr['newDelSku'] eq true">
|
||
<span class="list-detail-del"
|
||
@click.stop="delList(index,i)">+</span>
|
||
</if>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</if>
|
||
<div class="list-detail" v-if="i!=0"
|
||
:class="focusListIndex==i&&focusAttrIndex==index?'list-detail-focus':''"
|
||
@click.stop="toFocus(index,i)">
|
||
<input type="text" v-model="list.name"
|
||
<if condition="$authArr['newSaveAttr'] neq true">disabled</if>
|
||
:placeholder="i!=0?list.old_name:'新增'"
|
||
@input="inputList(list.name,index,i)"
|
||
:style="list.name!=list.old_name&&list.id!=0?'width:117px;':''"
|
||
@keydown.enter.exact="saveList(index,i)">
|
||
<div class="list-right-btn"
|
||
:style="list.name!=list.old_name&&list.id!=0?'width:60px;':'width:30px;'">
|
||
<span class="list-detail-save" v-if="list.name!=list.old_name"
|
||
@click="saveList(index,i)">保存</span>
|
||
<div class="list-detail-del-box" v-if="list.id!=0">
|
||
<if condition="$authArr['newDelSku'] eq true">
|
||
<span class="list-detail-del" @click.stop="delList(index,i)">+</span>
|
||
</if>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
</div>
|
||
</div>
|
||
<div class="tips-box" v-if="showTips">
|
||
<div class="tips-center">
|
||
<div class="tips-title">{{tipsData.title}}</div>
|
||
<div class="tips-content">{{tipsData.content}}</div>
|
||
<div class="tips-btn-box">
|
||
<div class="tips-btn tips-btn-cancel" @click="cancelClick">取消</div>
|
||
<div class="tips-btn tips-btn-sure" @click="sureClick">确认</div>
|
||
</div>
|
||
<span class="tips-close" @click="cancelClick">+</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script type="text/javascript">
|
||
var layer;
|
||
layui.use('layer', function () {
|
||
layer = layui.layer;
|
||
});
|
||
var app = new Vue({
|
||
el: '#app',
|
||
data: function () {
|
||
return {
|
||
contentDetailHeight_1: 'auto',
|
||
skuList: [],
|
||
focusAttrIndex: 0,
|
||
focusListIndex: 0,
|
||
showTips: false,
|
||
tipsData: {
|
||
title: '提示',
|
||
content: ''
|
||
},
|
||
delType: 1,
|
||
delData: {},
|
||
searText: '',
|
||
searchIndex: [],
|
||
oldSearchIndex: [],
|
||
canPost: true
|
||
}
|
||
},
|
||
methods: {
|
||
inputAttr: function (name, index) {
|
||
var skuList = this.skuList;
|
||
skuList[index].name = name;
|
||
this.skuList = [];
|
||
this.skuList = skuList;
|
||
},
|
||
inputList: function (name, index, i) {
|
||
var skuList = this.skuList;
|
||
skuList[index].list[i].name = name;
|
||
this.skuList = [];
|
||
this.skuList = skuList;
|
||
},
|
||
inputSearchText: function () {
|
||
if (this.searchIndex.length > 0) {
|
||
this.searchIndex = [];
|
||
}
|
||
},
|
||
searchSku: function () {
|
||
if (this.searText.length) {
|
||
var skuList = this.skuList;
|
||
var flag = false;
|
||
for (var i = 0; i < skuList.length; i++) {
|
||
if (this.searchIndex.indexOf(i) == -1) {
|
||
if (this.searText == skuList[i].name) {
|
||
if (this.focusAttrIndex != i) {
|
||
this.focusAttrIndex = i;
|
||
this.focusListIndex = -1;
|
||
}
|
||
flag = true;
|
||
skuList[i].isShow = true;
|
||
this.skuList = [];
|
||
this.skuList = skuList;
|
||
this.searchIndex.push(i);
|
||
var elm = $('.attr-box').eq(i);
|
||
$('#scrollBox').animate({scrollTop: elm[0].offsetTop - 100}, 200);
|
||
break;
|
||
} else {
|
||
var _flag = false;
|
||
for (var j = 0; j < skuList[i].list.length; j++) {
|
||
if (this.searText == skuList[i].list[j].name) {
|
||
if (this.focusAttrIndex != i) {
|
||
this.focusAttrIndex = i;
|
||
this.focusListIndex = j;
|
||
} else if (this.focusListIndex != j) {
|
||
this.focusListIndex = j;
|
||
}
|
||
flag = true;
|
||
_flag = true;
|
||
skuList[i].isShow = true;
|
||
this.skuList = [];
|
||
this.skuList = skuList;
|
||
this.searchIndex.push(i);
|
||
var elm = $('.attr-box').eq(i);
|
||
$('#scrollBox').animate({scrollTop: elm[0].offsetTop - 100}, 200);
|
||
break;
|
||
}
|
||
}
|
||
if (_flag) {
|
||
break;
|
||
}
|
||
}
|
||
}
|
||
if (i == skuList.length && !flag) {
|
||
this.searchIndex = [];
|
||
}
|
||
}
|
||
if (!flag && this.searchIndex.length <= 0) {
|
||
this.searchIndex = [];
|
||
this.focusAttrIndex = -1;
|
||
this.focusListIndex = -1;
|
||
layer.msg('未查找到该规格', {time: 1000});
|
||
} else {
|
||
if (JSON.stringify(this.searchIndex) == JSON.stringify(this.oldSearchIndex)) {
|
||
this.searchIndex = [];
|
||
}
|
||
this.oldSearchIndex = JSON.parse(JSON.stringify(this.searchIndex));
|
||
}
|
||
}
|
||
},
|
||
setFocus: function (index) {
|
||
this.focusAttrIndex = index;
|
||
},
|
||
delAttr: function (index) {
|
||
var skuList = this.skuList;
|
||
var name = skuList[index].name;
|
||
this.tipsData = {
|
||
title: '删除提示',
|
||
content: '确认删除规格 （' + name + '） 吗？'
|
||
};
|
||
this.delType = 1;
|
||
this.delData = {
|
||
pIndex: index,
|
||
cIndex: 0,
|
||
id: skuList[index].id
|
||
};
|
||
this.$nextTick(function () {
|
||
this.showTips = true;
|
||
}.bind(this))
|
||
},
|
||
saveAttr: function (index) {
|
||
var skuList = this.skuList;
|
||
var that = this;
|
||
if (this.canPost && skuList[index].name != skuList[index].old_name && skuList[index].name.length) {
|
||
this.canPost = false;
|
||
$.post("{:U('newSaveAttr')}", skuList[index], function (res) {
|
||
if (res.status == 1) {
|
||
if (skuList[index].id == 0) {
|
||
skuList[index] = res.data;
|
||
var obj = {
|
||
id: 0,
|
||
list: [],
|
||
name: '',
|
||
old_name: '',
|
||
isShow: false
|
||
}
|
||
skuList.unshift(obj);
|
||
} else {
|
||
skuList[index].name = res.data.name;
|
||
skuList[index].old_name = res.data.name;
|
||
}
|
||
that.skuList = [];
|
||
that.skuList = skuList;
|
||
that.$nextTick(function () {
|
||
that.canPost = true;
|
||
})
|
||
layer.msg(res.msg, {time: 1000});
|
||
} else {
|
||
that.canPost = true;
|
||
layer.msg(res.msg, {time: 1000});
|
||
}
|
||
})
|
||
}
|
||
},
|
||
saveList: function (index, i) {
|
||
var skuList = this.skuList;
|
||
var that = this;
|
||
if (this.canPost && skuList[index].list[i].name != skuList[index].list[i].old_name && skuList[index].list[i].name.length) {
|
||
this.canPost = false;
|
||
$.post("{:U('newSaveAttrList')}", skuList[index].list[i], function (res) {
|
||
if (res.status == 1) {
|
||
if (skuList[index].list[i].id == 0) {
|
||
var obj = {
|
||
id: 0,
|
||
attr_id: skuList[index].id,
|
||
name: '',
|
||
old_name: ''
|
||
}
|
||
skuList[index].list[i] = res.data;
|
||
skuList[index].list.unshift(obj);
|
||
} else {
|
||
skuList[index].list[i] = res.data;
|
||
}
|
||
that.$nextTick(function () {
|
||
that.skuList = [];
|
||
that.skuList = skuList;
|
||
that.canPost = true;
|
||
})
|
||
layer.msg(res.msg, {time: 1000});
|
||
} else {
|
||
that.canPost = true;
|
||
layer.msg(res.msg, {time: 1000});
|
||
}
|
||
})
|
||
}
|
||
},
|
||
cancelClick: function () {
|
||
this.showTips = false;
|
||
this.delData = {};
|
||
},
|
||
sureClick: function () {
|
||
var delData = this.delData;
|
||
var delType = this.delType;
|
||
var that = this;
|
||
var skuList = that.skuList;
|
||
if (this.canPost && delData.id != 0) {
|
||
this.canPost = false;
|
||
if (delType == 1) {
|
||
$.post("{:U('newDelSku')}", {
|
||
id: delData.id
|
||
}, function (res) {
|
||
if (res.status == 1) {
|
||
layer.msg(res.msg, {time: 1000});
|
||
skuList.splice(delData.pIndex, 1);
|
||
that.skuList = [];
|
||
that.skuList = skuList;
|
||
that.$nextTick(function () {
|
||
that.showTips = false;
|
||
that.canPost = true;
|
||
})
|
||
} else {
|
||
that.canPost = true;
|
||
layer.msg(res.msg, {time: 1000});
|
||
}
|
||
})
|
||
} else {
|
||
$.post("{:U('newDelSkuList')}", {
|
||
id: delData.id
|
||
}, function (res) {
|
||
if (res.status == 1) {
|
||
layer.msg(res.msg, {time: 1000});
|
||
skuList[delData.pIndex].list.splice(delData.cIndex, 1);
|
||
that.skuList = [];
|
||
that.skuList = skuList;
|
||
that.$nextTick(function () {
|
||
that.showTips = false;
|
||
that.canPost = true;
|
||
})
|
||
} else {
|
||
that.canPost = true;
|
||
layer.msg(res.msg, {time: 1000});
|
||
}
|
||
})
|
||
}
|
||
}
|
||
},
|
||
delList: function (index, i) {
|
||
var skuList = this.skuList;
|
||
var name = skuList[index].name + ' / ' + skuList[index].list[i].name;
|
||
this.tipsData = {
|
||
title: '删除提示',
|
||
content: '确认删除规格 （' + name + '） 吗？'
|
||
};
|
||
this.delType = 2;
|
||
this.delData = {
|
||
pIndex: index,
|
||
cIndex: i,
|
||
id: skuList[index].list[i].id
|
||
};
|
||
this.$nextTick(function () {
|
||
this.showTips = true;
|
||
}.bind(this))
|
||
},
|
||
toFocus: function (index, i) {
|
||
this.focusAttrIndex = index;
|
||
this.focusListIndex = i;
|
||
},
|
||
openContent: function (index) {
|
||
var skuList = this.skuList;
|
||
skuList[index].isShow = !skuList[index].isShow;
|
||
this.skuList = [];
|
||
this.skuList = skuList;
|
||
}
|
||
},
|
||
created: function () {
|
||
$.post("{:U('newGetAttr_v1')}", {}, function (res) {
|
||
if (res.data) {
|
||
app.skuList = res.data;
|
||
}
|
||
})
|
||
|
||
},
|
||
mounted: function () {
|
||
|
||
}
|
||
})
|
||
</script>
|