144 行
5.5 KiB
HTML
144 行
5.5 KiB
HTML
<style>
|
|
.skuChildrenBox {
|
|
display: flex;
|
|
padding: 0 15px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.skuChildren {
|
|
margin-right: 10px;
|
|
margin-top: 10px;
|
|
width: 50px;
|
|
height: 24px;
|
|
line-height: 24px;
|
|
color: rgba(80, 80, 80, 1);
|
|
border-radius: 2px;
|
|
font-size: 12px;
|
|
text-align: center;
|
|
border: 1px solid rgba(231, 231, 231, 1);
|
|
position: relative;
|
|
}
|
|
|
|
.skuChildrenSelect {
|
|
border: 1px solid rgba(212, 48, 48, 1)
|
|
}
|
|
|
|
.skuChildren-close {
|
|
position: absolute;
|
|
background: rgba(212, 48, 48, 1);
|
|
color: #fff;
|
|
border-radius: 50%;
|
|
width: 12px;
|
|
height: 12px;
|
|
top: -6px;
|
|
right: -6px;
|
|
font-style: 12px;
|
|
-webkit-transform: scale(0.8);
|
|
}
|
|
|
|
.status {
|
|
border: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.sku-img {
|
|
cursor: pointer;
|
|
width: 30px;
|
|
height: 30px;
|
|
|
|
}
|
|
|
|
.legend-tip {
|
|
color: #f00;
|
|
font-size: 14px;
|
|
margin-left: 5px;
|
|
}
|
|
.all-edit-btn{
|
|
width: 120px;
|
|
margin: 20px auto;
|
|
}
|
|
.i-color{
|
|
color: #f00;
|
|
}
|
|
.tooltip-inner{
|
|
background: #fff;
|
|
color: #999;
|
|
border: 1px solid #999;
|
|
box-shadow: 2px 2px 2px 2px #eee;
|
|
}
|
|
.tooltip.bottom .tooltip-arrow{
|
|
border-bottom-color: #fff;
|
|
}
|
|
.tooltip-show{
|
|
color: #000;
|
|
}
|
|
.tooltip-show:hover{
|
|
color: #000;
|
|
}
|
|
</style>
|
|
<div class="tab-pane fade" id="skuPrce">
|
|
<div class="widget-body no-padding">
|
|
<input type="hidden" name="sku[listData]" v-model="skuListData">
|
|
<input type="hidden" name="sku[priceData]" v-model="skuPriceData">
|
|
|
|
<div>
|
|
<div class="row" v-show="skuPrice.length && skuList.length">
|
|
<div class="col-md-12">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th v-for="(item, i) in skuList" :key="i">
|
|
{{item.name}}
|
|
</th>
|
|
<th width="80">
|
|
<span class="tooltip-show" data-toggle="tooltip" data-placement="bottom" title="批量设置">现价<i class="fa fa-indent i-color" @click="allEdit('price')"></i></span>
|
|
</th>
|
|
<th width="80">
|
|
<span class="tooltip-show" data-toggle="tooltip" data-placement="bottom" title="批量设置">库存<i class="fa fa-indent i-color" @click="allEdit('stock')"></i></span>
|
|
|
|
</th>
|
|
<th width="80">
|
|
<span class="tooltip-show" data-toggle="tooltip" data-placement="bottom" title="批量设置">重量<i class="fa fa-indent i-color" @click="allEdit('weight')"></i></span>
|
|
|
|
</th>
|
|
<th width="80">
|
|
<span class="tooltip-show" data-toggle="tooltip" data-placement="bottom" title="批量设置">编码<i class="fa fa-indent i-color" @click="allEdit('sn')"></i></span>
|
|
|
|
</th>
|
|
<th width="80">图片</th>
|
|
<th width="80">当前状态</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<tr v-for="(item, i) in skuPrice" :key="i">
|
|
<td v-for="(v, j) in item.goods_sku_text" :key="j">
|
|
{{v}}
|
|
</td>
|
|
<td width="80">
|
|
<input type="text" class="input-sm form-control" v-model="item.price">
|
|
</td>
|
|
<td width="80"><input type="text" v-model="item.stock" class="input-sm form-control">
|
|
</td>
|
|
<td width="80"><input type="text" v-model="item.weight" class="input-sm form-control">
|
|
</td>
|
|
<td width="80"><input type="text" v-model="item.sn" class="input-sm form-control"></td>
|
|
<td width="80">
|
|
<div style="width: 10px">
|
|
<img v-if="item.image" :src="Fast.api.cdnurl(item.image)" class="choosePicture sku-img"
|
|
:data-index="i">
|
|
<button v-else type="button" class="btn-primary btn choosePicture"
|
|
:data-index="i">
|
|
上传图片
|
|
</button>
|
|
</div>
|
|
</td>
|
|
<td width="80"><span class="input-sm form-control status"
|
|
@click="editStatus(i)">{{item.status=='up'?'上架':'下架'}}</span></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |