|
|
|
@ -44,10 +44,11 @@ |
|
|
|
|
</view> |
|
|
|
|
<view class="choose-select"> |
|
|
|
|
<view v-for="(item,index) in specificationList" :key="index" :data-index="index" :class="'choose-item padleft10 mart10 '+ (chooseIndex == index ? 'choose-active':'')" @click="select(index)"> |
|
|
|
|
<image v-if="item.showImg" :src="imageUrl+item.showImg" @click="perImage(0,[imageUrl+item.showImg])" class="img "></image> |
|
|
|
|
<image v-if="item.showImg" :src="imageUrl+item.showImg" @click.stop="perImage(0,[imageUrl+item.showImg])" class="img "></image> |
|
|
|
|
<view class="padleft15 paddtright15 font13"> {{item.name}}</view> |
|
|
|
|
<view class="padleft15 paddtright5 fontwig6 font13 fcor999">¥{{item.price}}</view> |
|
|
|
|
<view class="padleft15 paddtright5 font13 ">库存{{item.stock}}</view> |
|
|
|
|
<view v-if="item.stock==0" class="qh failureColor" style="">缺货</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
@ -61,8 +62,14 @@ |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<view class="choose-cart"> |
|
|
|
|
<view class="choose-cart" v-if="specificationList[chooseIndex].stock==0"> |
|
|
|
|
<view class="choose-way" > |
|
|
|
|
<view class="fcorfff way1 bgcolor-qh" @click="noStock"> |
|
|
|
|
暂无库存 |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
<view class="choose-cart" v-else> |
|
|
|
|
|
|
|
|
|
<view class="choose-way" v-if="status == 1"> |
|
|
|
|
<view class="fcorfff way bgcolor-left" @click="toCart"> |
|
|
|
@ -84,13 +91,13 @@ |
|
|
|
|
</view> |
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</view> |
|
|
|
|
|
|
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
<script> |
|
|
|
|
import uniNumberBox from '@/uni_modules/uni-number-box/components/uni-number-box/uni-number-box.vue' |
|
|
|
|
// let listData=require("./data.json") |
|
|
|
|
import {insertShoppingCart,getShoppingCartList} from '@/Utils/physicalObject.js' |
|
|
|
|
const app = getApp(); |
|
|
|
|
export default { |
|
|
|
@ -123,8 +130,22 @@ |
|
|
|
|
specificationList:{ |
|
|
|
|
handler(n,o){ |
|
|
|
|
this.chooseNumber = 1; |
|
|
|
|
|
|
|
|
|
this.isAllFailure = false; |
|
|
|
|
this.chooseIndex = 0; |
|
|
|
|
for(let i=0;i<n.length;i++){ |
|
|
|
|
if(n[i].stock>0){ |
|
|
|
|
this.chooseIndex = i; |
|
|
|
|
return |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// if(i == n.length-1){ |
|
|
|
|
// this.isAllFailure = true; |
|
|
|
|
// this.chooseIndex = 0 |
|
|
|
|
// } |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
deep:true |
|
|
|
|
deep:true, |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
components:{ |
|
|
|
@ -156,7 +177,13 @@ |
|
|
|
|
urls: imgList //预览图片的地址,必须要数组形式,如果不是数组形式就转换成数组形式就可以 |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
/* 暂无库存 */ |
|
|
|
|
noStock(){ |
|
|
|
|
uni.showToast({ |
|
|
|
|
title:'暂无库存哟,看看别的吧!', |
|
|
|
|
icon: 'none' |
|
|
|
|
}) |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
changeNumValue(v){ |
|
|
|
|
this.chooseNumber = v; |
|
|
|
@ -164,7 +191,7 @@ |
|
|
|
|
noMoreLess(){ |
|
|
|
|
uni.showToast({ |
|
|
|
|
icon: 'none', |
|
|
|
|
title: "低于最少够买件数", |
|
|
|
|
title: "低于最少购买件数", |
|
|
|
|
duration: 1000 |
|
|
|
|
}); |
|
|
|
|
}, |
|
|
|
@ -228,6 +255,9 @@ |
|
|
|
|
// |
|
|
|
|
select(index){ |
|
|
|
|
this.chooseIndex = index; |
|
|
|
|
if(this.chooseNumber>this.specificationList[this.chooseIndex].stock){ |
|
|
|
|
this.chooseNumber = this.specificationList[this.chooseIndex].stock |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
// 去地址页 |
|
|
|
@ -245,6 +275,24 @@ |
|
|
|
|
|
|
|
|
|
<style lang="scss" scoped> |
|
|
|
|
|
|
|
|
|
// 失效 |
|
|
|
|
.failureColor{ |
|
|
|
|
color: #c5c5c5; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
/* 缺货 */ |
|
|
|
|
.qh{ |
|
|
|
|
position: absolute; |
|
|
|
|
top: -15rpx; |
|
|
|
|
right: -30rpx; |
|
|
|
|
background-color: #ffffff; |
|
|
|
|
border-radius: 10rpx; |
|
|
|
|
width: 60rpx; |
|
|
|
|
height:30rpx; |
|
|
|
|
line-height:30rpx ; |
|
|
|
|
font-size: 20rpx; |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
// //地址 |
|
|
|
|
.select-address{ |
|
|
|
|
display: flex; |
|
|
|
@ -308,17 +356,19 @@ |
|
|
|
|
} |
|
|
|
|
.choose-select { |
|
|
|
|
.choose-item{ |
|
|
|
|
position: relative; |
|
|
|
|
display: flex; |
|
|
|
|
align-items: center; |
|
|
|
|
height: 60rpx; |
|
|
|
|
border-radius: 20rpx; |
|
|
|
|
overflow: hidden; |
|
|
|
|
// overflow: hidden; |
|
|
|
|
background-color:#F6F6F6; |
|
|
|
|
border:1px solid transparent; |
|
|
|
|
width: fit-content; |
|
|
|
|
.img{ |
|
|
|
|
width: 60rpx; |
|
|
|
|
height: 60rpx; |
|
|
|
|
border-radius: 20rpx; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.choose-active{ |
|
|
|
@ -393,6 +443,9 @@ |
|
|
|
|
.bgcolor-left{ |
|
|
|
|
background-color: #FF8E01; |
|
|
|
|
} |
|
|
|
|
.bgcolor-qh{ |
|
|
|
|
background-color: #c5c5c5; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|