web-base-h5/pages/pickupArea/pickupArea.vue

234 lines
4.9 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view>
<u-popup
:show="addShow"
closeable
:round="10"
mode="center"
@close="closeTap"
>
<view class="height-auto">
<view style="padding: 0 40rpx">
<view>{{ '购买数量' }}</view>
<view class="sum-view">
<input class="inputs" v-model="form.carryNum" placeholder="" />
</view>
</view>
<view class="buttons">
<view class="btn" @click="closeTap">{{ '取消' }}</view>
<view
class="btn"
style="border-right: none; color: #005bac"
@click="pickSubmit"
>{{ '确定' }}</view
>
</view>
</view>
</u-popup>
<view class="goods">
<view class="pick-up" v-for="item in dataList">
<view class="banner">
<image :src="item.pickCover"> </image>
<view class="sum"> {{ '数量' }}:{{ item.usableQuantity }} </view>
</view>
<view class="time" v-if="item.receiveTime"
>{{ '截止时间' }}{{ item.receiveTime }}</view
>
<view
class="button"
v-if="item.pickFlag == 0"
@click="pickSubmitShow(item)"
>
{{ '申请提货' }}
</view>
</view>
</view>
</view>
</template>
<script>
import * as apis from '@/config/index.js'
export default {
data() {
return {
addShow: false,
form: { carryNum: '' },
query: {
pageNum: 1,
pageSize: 50,
},
rules: {
carryNum: [{ required: true, message: '请输入', trigger: 'blur' }],
},
dataList: [],
}
},
mounted() {
this.getUserPickUpList()
},
onNavigationBarButtonTap(e) {
uni.navigateTo({
url: '/pages/pickupList/index',
})
},
methods: {
closeTap() {
this.addShow = false
},
pickSubmit() {
if (this.form.carryNum < 1) {
uni.showToast({
title: '提货数量不能小于1',
icon: 'none',
})
return
}
if (this.carryGoodsItem.baseQuantity > 1) {
if (this.form.carryNum < this.carryGoodsItem.baseQuantity) {
uni.showToast({
title: '提货数量必须大于等于' + this.carryGoodsItem.baseQuantity,
icon: 'none',
})
return
}
}
if (this.form.carryNum > this.carryGoodsItem.usableQuantity) {
uni.showToast({
title: '提货数量大于可提数量',
icon: 'none',
})
return
}
this.addShow = false
uni.navigateTo({
url:
'/pages/thOrder/index?pkId=' +
this.carryGoodsItem.pkId +
'&num=' +
this.form.carryNum,
})
},
pickSubmitShow(item) {
if (item.pickFlag == 1) {
// 跳转到支付
uni.navigateTo({
url:
'/pages/thOrder/index?pkId=' +
item.pkId +
'&num=' +
this.form.carryNum,
})
return
}
this.form.carryNum = item.baseQuantity
this.form.carryNum1 = item.baseQuantity
this.form.usableQuantity = item.usableQuantity
this.addShow = true
this.carryGoodsItem = item
// this.$refs['form'].validate(valid => {
// if (!valid) {
// return false
// }else{
// console.error("11")
// }
// })
},
getUserPickUpList() {
apis.pickList(this.query).then(res => {
this.dataList = res.data
})
},
},
}
</script>
<style lang="scss">
.inputs {
padding-left: 30rpx;
padding-top: 8rpx;
text-align: center;
width: 360rpx;
}
.buttons {
display: flex;
justify-content: space-between;
border-top: 1rpx solid #ddd;
}
.btn {
width: 330rpx;
height: 88rpx;
// background: #DDDDDD;
line-height: 88rpx;
border-right: 1px solid #ddd;
text-align: center;
}
.sum-view {
width: 440rpx;
height: 64rpx;
background: #ffffff;
border: 1rpx solid #dddddd;
border-radius: 32rpx;
line-height: 64rpx;
margin: 30rpx auto;
}
.height-auto {
padding: 40rpx 0;
width: 525rpx;
height: 220rpx;
background: #ffffff;
border-radius: 25rpx;
}
.button {
width: 182rpx;
height: 52rpx;
background: #005bac;
border-radius: 26rpx;
text-align: center;
line-height: 52rpx;
color: #fff;
font-size: 24rpx;
margin: 30rpx auto auto auto;
}
.time {
color: #999;
font-size: 24rpx;
margin-top: 20rpx;
}
.banner {
position: relative;
image {
width: 295rpx;
height: 180rpx;
position: relative;
}
}
.sum {
position: absolute;
right: 15rpx;
z-index: 1;
bottom: 20rpx;
color: #fff;
font-size: 20rpx;
}
page {
background-color: #f2f2f2;
}
.goods {
display: flex;
flex-wrap: wrap;
padding: 30rpx 0;
}
.pick-up {
// width: 330rpx;
// height: 413rpx;
background: #ffffff;
box-shadow: 0px 5rpx 5rpx 0px rgba(0, 0, 0, 0.05);
border-radius: 15rpx;
margin-left: 30rpx;
padding: 20rpx;
margin-bottom: 30rpx;
}
</style>