From f8e8ad7f92b351154ebfbda6380a3254ac76a3ae Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期五, 26 七月 2024 17:04:09 +0800
Subject: [PATCH] update
---
sub_pages/customer/shopping/confirm.vue | 316 +++++++++++++++++++++++++++++++++-------------------
1 files changed, 202 insertions(+), 114 deletions(-)
diff --git a/sub_pages/customer/shopping/confirm.vue b/sub_pages/customer/shopping/confirm.vue
index aee9080..3d7bfed 100644
--- a/sub_pages/customer/shopping/confirm.vue
+++ b/sub_pages/customer/shopping/confirm.vue
@@ -13,34 +13,14 @@
}),
},
- watch: {
- // address(nv, ov) {
- // if (nv && nv.id) {
- // //尝试更新一下
- //
- // }
- // }
- },
async onShow() {
- setTimeout(async () => {
- if (this.address && this.address.id && this.cacheAddressId !== this.address.id) {
- this.$message.showLoading()
- const {code, data} = await this.$http.request('get', '/api/flower/customer/order/confirm/transports', {
- data: {
- addressId: this.address.id,
- weight: this.dto.totalWeight || 0
- }
- })
- this.$message.hideLoading()
- this.transportList = []
- if (code === 0) {
- this.transportList = data || []
- }
- }
- }, 200)
+
},
onLoad(options) {
- let item = JSON.parse(decodeURIComponent(options.query.dto));
+ // console.log('dto',options)
+
+ // let item = JSON.parse(decodeURIComponent(options.query.dto));
+ let item = JSON.parse(this.$storage.getItem('_cache_shopping_dto') || '{}') || {}
this.dto = {
...this.dto,
...item
@@ -61,64 +41,108 @@
addressId: '',
flowers: [],
},
+ current_transport: {},
cacheAddressId: '',
transportList: [],
}
},
- methods: {
- async submitOrder() {
- if (!this.dto.transportId) {
- this.$message.toast('请选择配送方式')
- return
- }
- if (!this.dto.addressId) {
- this.$message.toast('请选择收货地址')
- return
- }
- this.$message.showLoading()
- const {code, data} = await this.$http.request('post', '/api/customer/flower/order/confirm', {
- data: {
- ...this.dto
- }
- })
- this.$message.hideLoading()
- if (code === 0) {
- //提交信息
- console.log('pay,', data)
- if (data && data['_testOrderId']) {
- //回调
- this.$message.showLoading()
- const {code, data} = await this.$http.request('get', '/api/customer/flower/order/callback/tmp', {
- params: {
- id: data['_testOrderId']
- }
- })
- this.$message.hideLoading()
- } else if (data) {
- //微信接口
- let that = this
- wx.requestPayment({
- ...data,
- async success(res) {
- console.log('pay success', res)
- this.$message.showToast('支付成功')
- //返回上一页
- await this.$store.dispatch('sign_add', 'shopping')
- uni.navigateBack()
- // uni.navigateTo({
- // url: '/pages/canteen/canteen-success/canteen-success'
- // })
- },
- fail(err) {
- console.error('pay fail', err)
- that.$message.showToast('支付失败')
- }
- })
+ watch: {
+ address(nv, ov) {
+ if (nv && nv.id !== this.cacheAddressId) {
+ this.loadTransportList()
+ this.cacheAddressId = nv.id
+ }
+ }
+ },
+ methods: {
+ async loadTransportList() {
+ let that = this
+ {
+ console.log('address', that.address, that.cacheAddressId)
+ if (that.address && that.address.id && that.cacheAddressId !== that.address.id) {
+ that.$message.showLoading()
+ const {code, data} = await that.$http.request('post', '/api/customer/flower/order/confirm/transports', {
+ data: {
+ addressId: that.address.id,
+ weight: that.dto.totalWeight || 0
+ }
+ })
+ that.$message.hideLoading()
+ that.transportList = []
+ if (code === 0) {
+ that.transportList = data || []
+ }
}
}
+ },
+ async submitOrder() {
+ console.log('submitOrder', this.dto)
+ if (!this.dto.transportId) {
+ this.$message.showToast('请选择配送方式')
+ return
+ }
+ if (!this.address.id) {
+ this.$message.showToast('请选择收货地址')
+ return
+ }
+ this.dto.addressId = this.address.id
+
+ let tmp = this
+ wx.login({
+ success: async res => {
+ console.log(res)
+ if (res.code) {
+ tmp.$message.showLoading()
+ const {code, data} = await tmp.$http.request('post', '/api/customer/flower/order/commit', {
+ data: {
+ ...tmp.dto,
+ wxcode: res.code
+ }
+ })
+ tmp.$message.hideLoading()
+ if (code === 0) {
+ //提交信息
+ console.log('pay,', data)
+ if (data && data['_testOrderId']) {
+ //回调
+ tmp.$message.showLoading()
+ const res2 = await tmp.$http.request('get', '/api/customer/flower/order/callback/tmp', {
+ params: {
+ id: res2.data['_testOrderId']
+ }
+ })
+ tmp.$message.hideLoading()
+ } else if (data) {
+ wx.requestPayment({
+ ...data,
+ async success(res) {
+ console.log('pay success', res)
+ tmp.$message.showToast('支付成功')
+ //返回上一页
+ await tmp.$store.dispatch('sign_add', 'shopping')
+ uni.navigateBack()
+ },
+ fail(err) {
+ console.error('pay fail', err)
+ tmp.$message.showToast('支付失败')
+ }
+ })
+
+ }
+ }
+
+ } else {
+ tmp.$message.showToast('获取微信信息失败');
+ }
+ },
+ error: res => {
+ tmp.$message.showToast('获取微信信息失败:' + res);
+ }
+ });
+
}
}
@@ -127,18 +151,18 @@
<template>
<view class="page-confirm">
- <view class="p10">
+ <view class="p10 bg-white br-4">
<common-address-select ref="addressselect"></common-address-select>
</view>
<view>
- <view class="flower-container">
- <view class="shopping-item m-t-20" v-for="(item,index) of dto.flowers" :key="index">
+ <view class="flower-container m-t-12 br-4 p10">
+ <view class="shopping-item m-b-20" v-for="(item,index) of dto.flowers" :key="index">
<u-divider v-if="index>0"></u-divider>
- <view class="sup-title">
- <image class="icon-dp" src="/static/common/icon-dp.png"></image>
- {{ item.supplierName || '-' }}
+ <view class="sup-title flex">
+ <image class="icon-dp img100 m-r-10" src="/static/common/icon-dp.png"></image>
+ <view>{{ item.supplierName || '-' }}</view>
</view>
- <view class="item-each flex">
+ <view class="item-each m-t-12 flex">
<image class="img img100 m-r-6" :src="item.url||item.cover"></image>
<view>
<view class="title"><span>{{ item.levelStr || '-' }}</span> {{ item.name || '-' }}</view>
@@ -152,25 +176,25 @@
</view>
</view>
<view class="price">
- <view class="desc">打包费用:{{ dto.packing || 0 }}}</view>
- <view class="m-l-a m-r-0">
+ <view class="m-l-a m-r-0 text-right">
共{{ dto.flowers.length }}件,小计<span class="t-red">¥{{ dto.totalAmount || 0 }}</span>
</view>
</view>
</view>
<!-- 查看商品列表,和选择运费 -->
- <view class="transform-container p10">
- <view class="title flex">
+ <view class="br-4 transform-container m-t-12 p10">
+ <view class="title">
<view>运输方式:</view>
- <!-- <view>约</view>-->
<view class="flex transform-list">
<view v-for="(transform,index) of transportList" :class="[transform.id===dto.transportId?'cur':'']"
- :key="index" class="transform-item" @click="dto.transportId = transform.id">
+ :key="index" class="transform-item" @click="()=>{
+ dto.transportId = transform.id;
+ current_transport = transform
+ }">
<view class="title">{{ transform.name }}</view>
<view class="price">¥{{ transform.fee }}</view>
</view>
</view>
-
</view>
<view class="m-t-20" v-if="false">
<view class="desc-red">
@@ -184,29 +208,58 @@
</view>
</view>
- <view class="form-item p10">
- <view class="label">特殊需求</view>
- <view class="m-l-a m-r-0 flex text-right">
- <u-textarea v-model="dto.remarks" placeholder="请输入特殊需求">
+ <view class="p10 bg-white m-t-20 br-4">
+ <view class="form-item ">
+ <view class="label">特殊需求</view>
+ <view class="m-l-a m-r-0 flex1">
+ <view class="m-t-12 m-b-12">
+ <u-textarea v-model="dto.specialNeeds" placeholder="请输入特殊需求">
- </u-textarea>
+ </u-textarea>
+ </view>
+ </view>
</view>
- </view>
- <view class="form-item p10">
- <view class="label">留言</view>
- <view class="m-l-a m-r-0 flex text-right">
- <u-textarea v-model="dto.remarks" placeholder="填写内容需与卖家协商并确认">
+ <view class="form-item m-t-12 ">
+ <view class="label">留言</view>
+ <view class="m-l-a m-r-0 flex1">
+ <view class="m-t-12 m-b-12">
+ <u-textarea v-model="dto.remarks" placeholder="填写内容需与卖家协商并确认">
- </u-textarea>
+ </u-textarea>
+ </view>
+ </view>
</view>
</view>
</view>
- <view class="bottom-price flex">
- <view>
- 合计:¥ {{ dto.totalAmount || 0 }} 元
+ <view class="m-t-20 br-4 info-container p10 bg-white">
+ <view class="desc flex">
+ <view>商品金额:</view>
+ <view class="m-l-a m-r-0 text-right">
+ {{ (dto.totalAmount || 0) - (dto.packing) || 0 }}
+ </view>
</view>
- <view class="button-green-1" @click="submitOrder">
+ <view class="desc flex">
+ <view>打包费:</view>
+ <view class="m-l-a m-r-0 text-right">
+ {{ (dto.packing || 0) }}
+ </view>
+ </view>
+ <view class="desc flex">
+ <view>运费:</view>
+ <view class="m-l-a m-r-0 text-right">
+ {{ (current_transport.fee || 0) }}
+ </view>
+ </view>
+ </view>
+
+ <view style="min-height:200rpx">
+ </view>
+ <view class="bottom-price flex">
+ <view class="m-t-12 m-l-0 m-r-a">
+ 合计:<span class="t-red">¥ {{ (dto.totalAmount || 0) + (current_transport.fee || 0) || 0 }} </span>元
+ </view>
+ <view class="button-green-1 m-l-a m-r-0" style="min-width: 240rpx" @click="submitOrder">
提交订单
</view>
</view>
@@ -215,17 +268,37 @@
<style scoped lang="scss">
.page-confirm {
+ padding: 20rpx 30rpx;
+
+ .bottom-price {
+ position: fixed;
+ background-color: #ffffff;
+ left: 0rpx;
+ padding: 20rpx;
+ right: 0rpx;
+ bottom: 0rpx;
+ }
+
.flower-container {
+ background-color: #ffffff;
+
.shopping-item {
padding: 28rpx 22rpx;
position: relative;
.sup-title {
border-bottom: 2rpx solid #EEEEEE;
+ line-height: 50rpx;
+
+ .icon-dp {
+ width: 36rpx;
+ height: 36rpx;
+ margin-top: 7rpx;
+ }
}
.item-each {
- padding-left: 88rpx;
+ padding-left: 20rpx;
.img {
width: 124rpx;
@@ -256,27 +329,49 @@
font-size: 24rpx;
color: #666666;
line-height: 34rpx;
+
}
}
.button-icons {
position: absolute;
+ line-height: 40rpx;
+
}
}
}
+ .info-container {
+ .desc {
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #666666;
+ line-height: 40rpx;
+
+ .value {
+ text-align: right;
+ }
+ }
+ }
+
.transform-container {
+ background-color: #ffffff;
+
.transform-list {
.transform-item {
background: rgba(225, 240, 231, 0.38);
border-radius: 8rpx;
- min-height: 112rpx;
+ //min-height: 112rpx;
border: 2rpx solid rgba(225, 240, 231, 0.38);
padding: 14rpx;
text-align: center;
- margin: 0 auto;
+ //margin: 0 auto;
+ margin-left: 20rpx;
+ margin-top: 10rpx;
+ margin-right: auto;
max-width: 32%;
+ min-width: 120rpx;
.title {
font-weight: 400;
@@ -289,7 +384,7 @@
font-weight: 600;
font-size: 32rpx;
color: #20613D;
- line-height: 44rpx;
+ //line-height: 44rpx;
}
}
@@ -310,12 +405,5 @@
}
- .bottom-price {
- position: fixed;
- left: 0rpx;
- padding: 20rpx;
- right: 0rpx;
- bottom: 160rpx;
- }
}
</style>
\ No newline at end of file
--
Gitblit v1.9.3