fe / yoho-limited-sell-miniapp · Commits

Go to a project

Authored by htoooth
Commit 597e7356e0a1f78582fc807b2315cbb86a006445 1 parent 8eaa6bd0

fix

Inline Side-by-side
Showing 4 changed files with 1 additions and 394 deletions
function init(ctx) {
let data = {};
let view = ctx.data.pickerData.view;
data.sourceType = ctx.data.pickerData.sourceType;
data.view = view;
ctx.setData({
pickerData: data
});
}
function pickerShow(ctx) {
let data = ctx.data.pickerData;
data.view.isShow = !data.view.isShow;
ctx.setData({
pickerData: data
});
}
function pickerHide(ctx) {
let data = ctx.data.pickerData;
data.view.isShow = false;
ctx.setData({
pickerData: data
});
}
module.exports = {
init: init,
pickerShow: pickerShow,
pickerHide: pickerHide
};
<template name="Picker">
<view class="picker-bg" id="picker-bg" catchtap="hidePicker" disable-scroll='true' catchtouchmove="catchtouchmove"
style="display:{{pickerData.view.isShow ? 'block':'none'}}">
<view class="picker-view">
<view class="pickerGoodsInfo">
<image class="img" src="{{pickerData.view.image}}">
</image>
<image class="placeholder"></image>
<view class="goodPrice">
<text class="realPrice">
{{pickerData.view.goodPrice==='0'?pickerData.view.price:pickerData.view.goodPrice}}
</text>
<text class="price" style="display:{{pickerData.view.goodPrice==='0'?'none':''}}">
{{pickerData.view.price}}
</text>
</view>
</view>
<view class="seperatorLine"></view>
<scroll-view scroll-y="true" style="height: 450rpx;">
<view class="goodsColor">
<text class="title">颜色</text>
<view class="list">
<block wx:for="{{pickerData.view.goodsList}}" wx:key="unique">
<view id="{{index}}" class="{{item.selected?'selectedItem':'normalItem'}}"
bindtap="chooseColor"
data-key="{{item}}">{{item.factory_goods_name}}
</view>
</block>
</view>
</view>
<view class="seperatorLine"></view>
<view class="goodsSize">
<text class="title">尺码</text>
<view class="list">
<block wx:for="{{pickerData.view.sizeList}}" wx:key="unique">
<view id="{{index}}"
class="{{ item.enable?(item.selected?'selectedItem':'normalItem'):'disableItem'}}"
bindtap="chooseSize" data-key="{{item}}">{{item.size_name}}
</view>
</block>
</view>
</view>
<view class="seperatorLine"></view>
<view wx:if='{{!pickerData.view.should_hidden_number_view}}' class="goodsCount">
<text class="title">数量</text>
<view class="stepper">
<view bindtap="bindMinus" class='reduceNumberBtn'>
<image class='reduceImage'
src='{{pickerData.view.minusButtonEnable ? "../../../static/images/jian_h@2x.png" : "../../../static/images/jian_disable@2x.png"}}'></image>
</view>
<view class='buyNumberText'>
{{pickerData.view.buyNumber}}
</view>
<view bindtap="bindPlus" class='addNumberBtn'>
<image class='addImage'
src='{{pickerData.view.plusButtonEnable ? "../../../static/images/and_normal@2x.png" : "../../../static/images/and_h@2x.png"}}'></image>
</view>
</view>
<view wx:if="{{pickerData.view.isSoldOutSoon}}" class='soldSoonOut'>
即将售罄
</view>
<view wx:if="{{pickerData.view.buy_limit_number}}" class='soldSoonOut'>
限购{{pickerData.view.buy_limit_number}}件
</view>
<view wx:if="{{pickerData.view.bundle_count}}" class='soldSoonOut'>
{{pickerData.view.bundle_count}}件起售
</view>
</view>
</scroll-view>
<view wx:if="{{pickerData.sourceType == 'goodsDetail' && pickerData.view.buyButtonEnable}}"
class="{{pickerData.view.buyButtonEnable?'buyButton':'buyButtonDisable'}}" bindtap="goPayment"
data-type='{{pickerData}}'>
<text class="title">确定</text>
</view>
<view wx:if="{{pickerData.sourceType == 'goodsDetail' && !pickerData.view.buyButtonEnable}}"
class="{{pickerData.view.buyButtonEnable?'buyButton':'buyButtonDisable'}}" data-type='{{pickerData}}'>
<text class="title">已售罄</text>
</view>
</view>
</view>
</template>
.picker-bg{
position: fixed;
z-index: 999;
left: 0;
bottom: 0;
width: 100%;
height: 100%;
margin: 0;
border-top: 1px #eee solid;
background-color: rgba(0, 0, 0, 0.2);
}
.picker-bg .picker-view{
position: fixed;
z-index: 9999;
width:100%;
height: 800rpx;
left:0;
bottom: 0;
background-color: white;
}
.picker-view .pickerGoodsInfo{
display: flex;
margin-bottom: 50rpx;
}
.picker-view .pickerGoodsInfo .img{
position: absolute;
top: -30rpx;
margin-left: 30rpx;
width: 164rpx;
height: 228rpx;
border:1rpx solid #e0e0e0;
border-radius: 5rpx;
/*background-color: red;*/
}
.picker-view .pickerGoodsInfo .placeholder{
margin-left: 30rpx;
width: 164rpx;
height: 180rpx;
}
.picker-view .pickerGoodsInfo .goodPrice{
display: flex;
width: 500 rpx;
margin-left: 20rpx;
margin-top: 20rpx;
height: 70rpx;
}
.picker-view .pickerGoodsInfo .goodPrice .realPrice{
padding-left: 25rpx;
color: #d0021b;
line-height: 70rpx;
font-size: 28rpx;
}
.picker-view .pickerGoodsInfo .goodPrice .price{
padding-left: 15rpx;
color: #b0b0b0;
text-decoration: line-through;
line-height: 70rpx;
font-size: 28rpx;
}
.picker-view .goodsColor{
margin:30rpx;
display: flex;
flex-direction: row;
}
.picker-view .goodsColor .title{
font-size: 28rpx;
color: #444444;
text-align: left;
padding: 20rpx 0;
width: 60rpx;
font-weight: bold;
white-space: nowrap;
}
.picker-view .goodsColor .list{
display: flex;
flex-direction: row;
flex-wrap: wrap;
padding-left: 10rpx;
}
.normalItem{
font-size: 28rpx;
text-align: center;
border: 1px solid #444;
margin: 5px;
padding: 5px;
border-radius: 3px;
min-width: 40rpx;
}
.disableItem{
font-size: 28rpx;
text-align: center;
border: 1px solid #e0e0e0;
margin: 5px;
padding: 5px;
border-radius: 3px;
color: #e0e0e0;
min-width: 40rpx;
}
.selectedItem{
font-size: 28rpx;
text-align: center;
border: 1px solid #d0021b;
margin: 5px;
padding: 5px;
border-radius: 3px;
color: white;
background-color: #d0021b;
min-width: 40rpx;
}
.picker-view .goodsSize{
margin: 30rpx;
display: flex;
flex-direction: row;
}
.picker-view .goodsSize .title{
font-size: 28rpx;
color: #444444;
text-align: left;
width: 60rpx;
padding: 20rpx 0;
font-weight: bold;
white-space: nowrap;
}
.picker-view .goodsSize .list{
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-left: 10rpx;
flex: 90%;
}
.picker-view .goodsSize .list .item{
font-size: 28rpx;
text-align: center;
border: 1px solid #444;
margin: 5px;
padding: 5px;
border-radius: 3px;
}
.picker-view .goodsCount{
display: flex;
margin: 30rpx;
flex-direction: row;
flex-wrap: wrap;
float: left;
align-items: center;
}
.picker-view .goodsCount .title{
font-size: 28rpx;
color: #444444;
text-align: left;
padding: 20rpx 0;
font-weight: bold;
width: 60rpx;
}
.stepper {
border: 2rpx solid #e0e0e0;
border-radius: 6rpx;
width: 240rpx;
height: 60rpx;
margin-left: 20rpx;
justify-content: space-between;
display: flex;
align-items: center;
flex-direction: row;
}
.buyButton{
position: absolute;
width: 100%;
height: 100rpx;
bottom: 0;
background: #d0021b;
justify-content: space-around;
}
.buyButton .title{
position: absolute;
color: white;
font-size: 34rpx;
line-height: 50rpx;
width: 100%;
text-align: center;
height: 70rpx;
bottom: 0;
}
.buyButtonDisable{
position: absolute;
width: 100%;
height: 100rpx;
bottom: 0;
background: #b0b0b0;
justify-content: space-around;
}
.buyButtonDisable .title{
position: absolute;
color: white;
font-size: 34rpx;
line-height: 50rpx;
width: 100%;
text-align: center;
height: 70rpx;
bottom: 0;
}
.seperatorLine {
/*position: absolute;*/
display: flex;
width:100%;
/*margin: 30rpx;*/
height:1rpx;
background:#e0e0e0;
}
.reduceNumberBtn {
width: 70rpx;
height: 60rpx;
display: flex;
align-items: center;
justify-content: center;
border-right: solid 2rpx #e0e0e0;
}
.addNumberBtn {
width: 70rpx;
height: 60rpx;
display: flex;
align-items: center;
justify-content: center;
border-left: solid 2rpx #e0e0e0;
}
.buyNumberText{
font-family: PingFang-SC;
font-size: 28rpx;
text-align: center;
color: #444444;
width: 94rpx;
}
.reduceImage {
width: 24rpx;
height: 4rpx;
}
.addImage {
width: 24rpx;
height: 24rpx;
}
.soldSoonOut {
font-size: 28rpx;
color: #d0021b;
margin-left: 20rpx;
}
... ... @@ -33,7 +33,7 @@
"list": []
},
"miniprogram": {
"current": 4,
"current": 0,
"list": [
{
"id": 0,
... ...