[水感应客户端最新]

This commit is contained in:
2023-06-21 17:14:39 +08:00
commit b3b4d4dae7
187 changed files with 12997 additions and 0 deletions

View File

@@ -0,0 +1,220 @@
/*
* 手太欠
* 愿这世界都如故事里一样 美好而动人~
*/
Page({
data: {
goods_id : '', // 店铺id
goods_sku : '', // 产品id
goods_qty : '', // 产品数量
address : '', // 地址
addressId : '', // 地址id
goodskData : '', // 数据
amount : '', // 总金额
freight : '', // 运费
weight : '', // 重量
disabled : true,//按钮
paySuccess : false, // 兑换成功显示
maxcoupon : '', //拥有兑换券数量
coupon_qty : 1, //兑换券数量
checked : false//兑换券
},
onLoad(options) {
this.setData({
goods_id : options.goodsid,
goods_sku : options.skuid,
goods_qty : options.qty
})
},
onShow() {
// 获取下单信息
this.confirmInfo()
},
/**
* 产品下单信息
*/
confirmInfo (){
wx.$api.mall.mallPlace({
goods_sku_id: this.data.goods_sku,
address_id: this.data.addressId,
qty: this.data.goods_qty
}).then(res => {
this.setData({
address : res.data.address,
addressId : res.data.address.address_id,
goodskData: res.data.detail,
amount : res.data.amount,
freight : res.data.freight,
weight : res.data.weight,
maxcoupon : res.data.couponCount
})
// 计算总价格
this.totalPrice()
}).catch(err => { })
},
/**
* 产品数量加减
*/
goodsNumber(e){
let num = this.data.goods_qty,
val = e.currentTarget.dataset.type
if (val == 'plus'){
num ++;
}else{
if (num > 1){
num --;
if(num < this.data.coupon_qty) {
this.setData({
coupon_qty: num
})
}
}else{
wx.showToast({
title : '商品数量不能小于1',
icon : 'none'
})
}
this.setData({
goods_qty: num
})
}
this.setData({
goods_qty: num
})
// 计算总价格
this.totalPrice()
},
/**
* 是否使用兑换券
*/
checkedTap() {
this.setData({
checked: !this.data.checked
})
// 计算总价格
this.totalPrice()
},
/**
* 兑换券数量加减
*/
couponNumber(e){
let minVal = Math.min(this.data.goods_qty, this.data.maxcoupon)
let num = this.data.coupon_qty,
val = e.currentTarget.dataset.type
if (val == 'plus'){
if(num >= minVal){
this.setData({
coupon_qty: minVal
})
wx.showToast({
title: '兑换券数量超出产品数量或兑换券不足',
icon : 'none'
})
return
}
num ++;
}else{
if (num > 1){
num --;
}else{
wx.showToast({
title : '兑换券数量不能小于1',
icon : 'none'
})
}
this.setData({
coupon_qty: num
})
}
this.setData({
coupon_qty: num
})
// 计算总价格
this.totalPrice()
},
/**
* 计算总价格
*/
totalPrice() {
let couponQty = this.data.coupon_qty
let goodNum = this.data.goods_qty
let goodPrice = this.data.goodskData[0].items[0].price
let freight = this.data.freight
let totalPrice = 0
totalPrice = this.data.checked ?
(goodNum - couponQty) * goodPrice :
goodNum * goodPrice
if(freight > 0) totalPrice += freight
this.setData({
amount: totalPrice
})
},
/**
* 产品确认购买
*/
buyTap() {
wx.showLoading({
title: '加载中...',
})
let that = this
let data = {
goods_sku_id: this.data.goods_sku,
qty : this.data.goods_qty,
address_id : this.data.addressId,
use_coupon : this.data.checked,
coupon_qty : this.data.coupon_qty
}
wx.$api.mall.mallAffirm(data).then(res => {
this.setData({
disabled: false
})
wx.hideLoading()
if(res.data.can_pay) {
wx.redirectTo({
url: '/pages/pay/index?order_no=' + res.data.order_no + '&total=' + res.data.total
})
return
}
wx.showToast({
title: '支付成功',
icon: 'none',
duration: 2000,
//显示透明蒙层,防止触摸穿透
mask:true,
success: function () {
that.setData({
paySuccess: true
})
setTimeout(()=>{
wx.redirectTo({
url: '/pages/order/index?state=paid'
})
},3000)
}
})
}).catch(err => {
this.setData({
disabled: true
})
})
}
})

View File

@@ -0,0 +1,4 @@
{
"usingComponents": {},
"navigationBarTitleText": "订单确认"
}

View File

@@ -0,0 +1,81 @@
<!-- 地址 -->
<view class="address">
<navigator hover-class="none" url="/pages/site/index?type=goodsAddress" class="address-cont" wx:if="{{address}}">
<view class="address-top">
<view class="address-area">{{address.province.name}}{{address.city.name}}</view>
<view class="address-text">{{address.full_address}}</view>
</view>
<view class="address-name">
{{address.name}}<text>{{address.mobile}}</text>
</view>
<image class="address-arrow" src="/static/icons/orderArrow.png"></image>
</navigator>
<view class="address-add" wx:else>
<navigator hover-class="none" url="/pages/site/index?type=goodsAddress" class="address-go">新增收货地址 +</navigator>
</view>
<image class="address-img" src="/static/imgs/address.png" mode="widthFix"></image>
</view>
<!-- 商品 -->
<view class="list-goods" wx:for="{{goodskData}}" wx:key="stockData">
<block wx:for="{{item.items}}" wx:key="items" wx:for-item="items">
<image class="list-goods-img" mode="aspectFill" src="{{items.cover ? items.cover : '/static/imgs/default.png'}}"></image>
<view class="list-goods-cont">
<view class="nowrap list-goods-name">{{items.title}}</view>
<view class="list-goods-text">
<text>规格 99ml</text>x1
</view>
<view class="list-goods-parice">
产品金额 ¥<text>{{items.price}}</text>
</view>
</view>
</block>
</view>
<!-- 规格 -->
<view class="label">
<view class="label-item">
<view class="label-name">数量</view>
<view class="label-number">
<view class="number-btn" bindtap="goodsNumber" data-type="remove">-</view>
<input bindinput="goodsNumberInput" class="number-input" type="number" value="{{goods_qty}}" disabled />
<view class="number-btn" bindtap="goodsNumber" data-type="plus">+</view>
</view>
</view>
<view class="label-item">
<view class="label-name">快递</view>
<view class="label-text">{{freight == 0 ? '免邮' : freight + '元'}}</view>
</view>
<view class="coupons" wx:if="{{maxcoupon != 0}}">
<view class="coupons-item">
<view class="label-name">兑换券</view>
<view class="label-text">勾选使用<checkbox class="label-text-checkbox" checked="{{checked}}" bindtap="checkedTap" color="#3b7cff" style="transform:scale(.7);" /></view>
</view>
<view class="coupon-checked" wx:if="{{checked}}">
<view class="coupon-checked-name">使用数量</view>
<view class="coupon-checked-number">
<view class="coupon-checked-btn" bindtap="couponNumber" data-type="remove">-</view>
<input class="coupon-checked-input" bindblur="couponNumberInput" type="number" value="{{coupon_qty}}" disabled />
<view class="coupon-checked-btn" bindtap="couponNumber" data-type="plus">+</view>
</view>
</view>
</view>
<view class="label-item">
<view class="label-name">金额</view>
<view class="label-integral">¥{{amount}}</view>
</view>
</view>
<!-- 底部 -->
<view class="footer">
<view class="number"><text>¥</text>
<view class="number-price">{{amount}}</view>
<view class="number-vip">实付金额</view>
</view>
<view class="btn" bindtap="buyTap" wx:if="{{disabled}}">立即支付</view>
<view class="btn active" wx:else>立即支付</view>
</view>
<view class="pack-center pages-hint grey" wx:if="{{paySuccess}}">
<image src="/static/icons/loadingGif.gif"></image>
<view>疯狂加载中...</view>
</view>

View File

@@ -0,0 +1,315 @@
page {
background-color: #f5f6f8;
padding: 30rpx;
box-sizing: border-box;
}
/* 地址 */
.address {
background-color: #FFFFFF;
border-radius: 15rpx;
overflow: hidden;
position: relative;
}
.address-arrow {
position: absolute;
right: 15rpx;
top: 78rpx;
width: 50rpx;
height: 50rpx;
}
.address-cont {
padding: 30rpx;
box-sizing: border-box;
}
.address-top {
width: calc(100% - 80rpx);
}
.address-area {
color: #585866;
font-size: 28rpx;
}
.address-text {
font-weight: 600;
padding: 10px 0;
}
.address-name text {
color: #585866;
padding-left: 30rpx;
}
.address-img {
width: 100%;
display: block;
}
.address-add {
width: 100%;
text-align: center;
padding: 30rpx 30rpx 0;
box-sizing: border-box;
}
.address-go {
display: inline-block;
font-size: 28rpx;
line-height: 68rpx;
border-radius: 10rpx;
color: #df723a;
padding-bottom: 20rpx;
}
/* 商品 */
.list-goods {
background-color: #FFFFFF;
margin: 30rpx 0;
display: flex;
padding: 30rpx;
border-radius: 15rpx;
box-sizing: border-box;
}
.list-goods-img {
width: 184rpx;
height: 184rpx;
margin-right: 30rpx;
border-radius: 10rpx;
}
.list-goods-cont {
width: calc(100% - 214rpx);
}
.list-goods-name {
font-size: 32rpx;
}
.list-goods-text {
line-height: 90rpx;
display: flex;
font-size: 28rpx;
color: #999999;
}
.list-goods-text text {
flex: 1;
}
.list-goods-parice {
text-align: right;
font-size: 26rpx;
}
.list-goods-parice text {
font-size: 34rpx;
}
/* 规格 */
.label {
background-color: #FFFFFF;
border-radius: 15rpx;
overflow: hidden;
box-sizing: border-box;
}
.label-item {
display: flex;
line-height: 100rpx;
color: #585866;
font-size: 30rpx;
padding: 0 30rpx;
box-sizing: border-box;
border-bottom: 2rpx solid rgb(243, 243, 243);
}
.label-item:last-child {
border: none;
}
.label-integral {
color: #3b7cff;
font-weight: 600;
}
.label-name {
flex: 1;
}
.coupons {
border-bottom: 2rpx solid rgb(243, 243, 243);
padding: 0 30rpx 30rpx;
box-sizing: border-box;
}
.coupons-item {
display: flex;
line-height: 100rpx;
color: #585866;
font-size: 30rpx;
}
.coupon-checked {
background-color: #fff3ea;
padding: 20rpx 30rpx;
box-sizing: border-box;
border-radius: 10rpx;
position: relative;
}
.coupon-checked-name {
color: #ff9951;
font-size: 28rpx;
line-height: 42rpx;
}
.coupon-checked-number {
position: absolute;
right: 0rpx;
top: 0rpx;
display: flex;
background-color:transparent;
}
.coupon-checked-btn {
color: #db6815;
width: 80rpx;
text-align: center;
font-weight: 600;
font-size: 38rpx;
line-height: 78rpx;
}
.coupon-checked-input {
width: 60rpx;
border: 2rpx solid #bd5e1b;
border-radius: 4rpx;
text-align: center;
color: #dd620a;
height: 36rpx;
min-height: 36rpx;
display: inline-block;
margin-top: 20rpx;
font-size: 26rpx;
}
/*checkbox选中后样式 */
.label-text-checkbox {
margin-right: -14rpx;
margin-left: 10rpx;
}
.label-text-checkbox .wx-checkbox-input.wx-checkbox-input-checked {
background: #ff9951;
border-color: #ff9951;
}
.label-text-checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
width: 30rpx;
height: 30rpx;
line-height: 28rpx;
text-align: center;
font-size: 30rpx;
color: #fff;
background: transparent;
transform: translate(-50%, -50%) scale(1);
-webkit-transform: translate(-50%, -50%) scale(1);
}
.label-price {
text-align: right;
line-height: 90rpx;
font-size: 30rpx;
font-weight: 600;
padding: 0 30rpx 5rpx;
box-sizing: border-box;
}
.label-price text {
font-size: 34rpx;
padding: 0 10rpx;
}
.label-number {
display: flex;
margin-top: 25rpx;
}
.number-btn {
background-color: #f1f1f1;
width: 48rpx;
height: 48rpx;
line-height: 46rpx;
text-align: center;
}
.number-input {
width: 80rpx;
text-align: center;
}
/* 底部 */
.footer {
width: 100%;
height: 60px;
background-color: #272e4f;
position: fixed;
left: 0;
bottom: 0;
z-index: 9;
box-sizing: border-box;
display: flex;
}
.number {
flex: 1;
line-height: 60px;
color: #ffffff;
display: flex;
padding: 0 30rpx;
box-sizing: border-box;
}
.number text {
font-size: 28rpx;
padding-top: 5rpx;
}
.number-price {
padding: 0 5rpx;
font-size: 40rpx;
}
.number-vip {
margin-left: 20rpx;
color: #8d97a1;
font-size: 28rpx;
}
.btn {
height: 100%;
background-color: #ff9951;
text-align: center;
color: #FFFFFF;
padding: 0 70rpx;
line-height: 60px;
}
.btn.active {
background-color: #cacaca;
}
.detailsBrief-back{
width: 100%;
}
.grey {
background-color: #f9f9f9;
z-index: 99999;
}