From a587937ce53f79b4680e930b5d5f7fee33de5311 Mon Sep 17 00:00:00 2001
From: xuxueyang <xuxy@fengyuntec.com>
Date: 星期三, 14 八月 2024 14:50:40 +0800
Subject: [PATCH] 标签
---
sub_pages/customer/shopping/confirm.vue | 614 +++++++++++++++++++++++++++++++++++++++++++++++--------
1 files changed, 522 insertions(+), 92 deletions(-)
diff --git a/sub_pages/customer/shopping/confirm.vue b/sub_pages/customer/shopping/confirm.vue
index 3f9eb68..bfd1426 100644
--- a/sub_pages/customer/shopping/confirm.vue
+++ b/sub_pages/customer/shopping/confirm.vue
@@ -1,103 +1,533 @@
<script>
-import {
- mapState
-} from 'vuex'
+ import {
+ mapState
+ } from 'vuex'
-export default {
- name: "订单详情",
- computed: {
- ...mapState({
- address: state => {
- return state.defaultaddress || {}
- },
- }),
- },
- 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));
- this.dto = {
- ...this.dto,
- ...item
- }
- //先获取直接的全部地址
- // @ApiModelProperty(value = "订单商品")
- // private List<FlowerCartListDTO> flowers;
- // @ApiModelProperty(value = "打包费")
- // private BigDecimal packing;
- //todo 显示打包费等，然后再确认
- // https://lanhuapp.com/web/#/item/project/detailDetach?pid=05830e81-7c59-4655-8253-4deb7c913b51&project_id=05830e81-7c59-4655-8253-4deb7c913b51&image_id=f7cc3e57-5367-4b99-a84e-99c38249aa66&fromEditor=true
+ export default {
+ name: "订单详情",
+ computed: {
+ ...mapState({
+ address: state => {
+ return state.defaultaddress || {}
+ },
+ }),
- },
- data() {
- return {
- dto: {},
- cacheAddressId: '',
- transportList: [],
- // private Long id;
- // @ApiModelProperty(value = "名称")
- // private String name;
- // @ApiModelProperty(value = "英文名")
- // private String enName;
- // @ApiModelProperty(value = "运费")
- // private BigDecimal fee;
- }
- }
-}
+ },
+ async onShow() {
+
+ },
+ onLoad(options) {
+ // 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
+ }
+ this.$http.request('get', '/api/code/value', {
+ params: {
+ type: 'SPEC_REQ'
+ }
+ }).then(res => {
+ var data = res.data
+ this.need_columns = [data || []]
+ this.need_columns[0].unshift({
+ label: '暂无',
+ value: ''
+ })
+ })
+ if (this.address.id) {
+ this.loadTransportList()
+ this.cacheAddressId = this.address.id
+ }
+ //
+ //先获取直接的全部地址
+ // @ApiModelProperty(value = "订单商品")
+ // private List<FlowerCartListDTO> flowers;
+ // @ApiModelProperty(value = "打包费")
+ // private BigDecimal packing;
+
+ // 两种情况,我合伙人是A,我进入页面前改成了B,我进去后还是获取了A——可以通过
+
+ if (this.currentInfo.customerDTO && this.currentInfo.customerDTO.partnerId) {
+ // 考虑一下，由后台实时获取，如果获取的合伙人id不一样，那么就刷新当前用户信息。
+
+ this.$http.request('get', '/api/current/customer/partner', {
+ params: {
+ // id: this.currentInfo.customerDTO.partnerId
+ }
+ }).then(async res => {
+ if (res.code == 0) {
+ this.partnerInfo = res.data || {}
+ if (this.partnerInfo.id !== this.currentInfo.customerDTO.partnerId) {
+ //刷新用户信息
+ await dispatch('getCurrentInfo')
+ }
+ }
+ })
+
+
+ }
+
+ },
+ data() {
+ return {
+ dto: {
+ remarks: '',
+ specialNeeds: '',
+ specialNeedsStr: '',
+ transportId: '',
+ addressId: '',
+ flowers: [],
+ },
+ current_transport: {},
+ cacheAddressId: '',
+ transportList: [],
+ show_select_need: false,
+ need_columns: [
+ []
+ ],
+ partnerInfo: {},
+
+ }
+ },
+ watch: {
+ address(nv, ov) {
+ if (nv && nv.id !== this.cacheAddressId) {
+ this.loadTransportList()
+ this.cacheAddressId = nv.id
+
+ } else if (!nv.id) {
+ //说明id清空了
+ if (!this.cacheAddressId) {
+ transportList = []
+ this.cacheAddressId = ''
+ }
+ }
+ }
+ },
+ methods: {
+ select_need(e) {
+ this.show_select_need = false
+ this.dto.specialNeedsStr = e.value[0].label
+ this.dto.specialNeeds = e.value[0].value
+ },
+ async loadTransportList() {
+ if (this.currentInfo.customerDTO && this.currentInfo.customerDTO.partnerId) {
+ return
+ }
+ 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.currentInfo.customerDTO && this.currentInfo.customerDTO.partnerId) {
+
+ } else {
+ if (!this.dto.transportId) {
+ this.$message.showToast('请选择配送方式')
+ return
+ }
+ }
+
+ if (!this.address.id) {
+ this.$message.showToast('请选择收货地址', {
+ duration: 2000
+ })
+ 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()
+ },
+ async fail(err) {
+ console.error('pay fail', err)
+ tmp.$message.showToast('支付失败')
+ await tmp.$store.dispatch('sign_add', 'shopping')
+ uni.navigateBack()
+ }
+ })
+
+ }
+ }
+
+ } else {
+ tmp.$message.showToast('获取微信信息失败');
+ }
+ },
+ error: res => {
+ tmp.$message.showToast('获取微信信息失败:' + res);
+ }
+ });
+
+
+ }
+ }
+ }
</script>
<template>
- <view class="page-confirm">
- <view>
- <common-address-select ref="addressselect"></common-address-select>
- </view>
- <view>
-<!-- todo 查看商品列表，和选择运费 -->
- </view>
- <view class="bottom-price flex">
- <view>
- 合计:￥ {{ dto.totalAmount||0 }} 元
- </view>
- <view class="button-green-1">
- 提交订单
- </view>
- </view>
- </view>
+ <view class="page-confirm">
+ <view class="p10 bg-white br-4">
+ <common-address-select ref="addressselect"></common-address-select>
+ </view>
+ <view>
+ <view class="flower-container m-t-12 br-4 p10">
+ <view class="shopping-item " v-for="(item,index) of dto.flowers" :key="index">
+ <!-- <view class="line-gray" v-if></view> -->
+ <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 m-t-12 flex">
+ <image class="img img100 m-r-6" :src="item.url||item.cover"></image>
+ <view>
+ <view class="title"><span class="m-r-5"
+ style="display: inline-block;">{{item.categoryStr||''}}</span><span
+ v-if="item.levelStr" class="m-r-5"
+ style="display: inline-block;">{{ item.levelStr || '' }}</span>{{ item.name || '-' }}
+ </view>
+ <view class="price">
+ {{ item.price || 0 }}*{{ item.num }}扎
+ </view>
+ <view class="desc m-t-12">
+ <view class="m-r-15">每扎重量:{{ item.weight || 0 }}</view>
+ </view>
+ </view>
+ </view>
+ </view>
+ <view class="price">
+ <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="p10 bg-white m-t-20 br-4" v-if="partnerInfo&&partnerInfo.id">
+ <view class="form-item flex ">
+ <view class="label">仓位名称</view>
+ <view class="m-l-a m-r-0 flex desc-gray">
+ <view>{{partnerInfo.cityWarehouse|| '-'}}</view>
+ </view>
+ </view>
+ <view class="form-item flex ">
+ <view class="label">合伙人名称</view>
+ <view class="m-l-a m-r-0 flex desc-gray">
+ <view>{{partnerInfo.name|| '-'}}</view>
+ </view>
+ </view>
+ <view class="form-item flex ">
+ <view class="label">联系方式</view>
+ <view class="m-l-a m-r-0 flex desc-gray">
+ <view>{{partnerInfo.contactTel|| '-'}}</view>
+ </view>
+ </view>
+ <view class="form-item flex ">
+ <view class="label">提货地址</view>
+ <view class="m-l-a m-r-0 flex desc-gray">
+ {{ partnerInfo['province'] || '' }}{{ partnerInfo['city'] && ('/' + partnerInfo['city']) || '' }}{{
+ partnerInfo['region'] && ('/' + partnerInfo['region']) || ''
+ }}{{partnerInfo.address|| '-'}}
+ </view>
+ </view>
+ </view>
+
+ <!-- 查看商品列表，和选择运费 -->
+ <view class="br-4 transform-container m-t-12 p10"
+ v-if="!currentInfo.customerDTO||!currentInfo.customerDTO.partnerId">
+ <view class="title">
+ <view>运输方式：</view>
+ <view class="flex transform-list flex-wrap-normal">
+ <view v-for="(transform,index) of transportList"
+ :class="[transform.id===dto.transportId?'cur':'']" :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="true">
+ <view class="desc-red">
+ 10kg以下的零买订单将收取打包费，花店建议购满20kg， 可选冷链物流
+ </view>
+ <view class="desc">
+ <!-- 预计装1Mini件，运费约18.00元(5公斤内18元，不满5公斤按5公斤计费，每件货不能超过5公斤)， -->
+ 第一次下单预计次日凌晨发货，备货高峰期除外，冷链汽车运输，发货后72小时左右到货，三线城市会推迟6-12小时送货到店。
+ <!-- 优势:价格便宜，顺丰配送 -->
+ <!-- 弊端:订单必须是5kg以内 -->
+ </view>
+ </view>
+ </view>
+
+ <view class="p10 bg-white m-t-20 br-4">
+ <view class="form-item flex ">
+ <view class="label">特殊需求</view>
+
+ <view class="m-l-a m-r-0 flex " :class="[!dto.specialNeeds?'desc-gray':'']" @click="()=>{
+ show_select_need=true
+ }">
+ <view>{{dto.specialNeedsStr||dto.specialNeeds || '请选择'}}</view>
+ <u-icon class="m-l-a" name="arrow-right"></u-icon>
+ </view>
+ </view>
+ <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" clearable placeholder="填写内容需与卖家协商并确认">
+
+ </u-textarea>
+ </view>
+ </view>
+ </view>
+ </view>
+
+ </view>
+ <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) || 0 }}
+ </view>
+ </view>
+ <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) + (dto.packing || 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>
+
+ <u-picker :show="show_select_need" @confirm="select_need" keyName="label" :columns="need_columns"
+ @cancel="show_select_need=false"></u-picker>
+ </view>
</template>
<style scoped lang="scss">
-.page-confirm{
+ .page-confirm {
+ padding: 20rpx 30rpx;
- .bottom-price {
- position: fixed;
- left: 0rpx;
- padding: 20rpx;
- right: 0rpx;
- bottom: 160rpx;
- }
-}
+ .bottom-price {
+ position: fixed;
+ background-color: #ffffff;
+ left: 0rpx;
+ padding: 20rpx;
+ z-index: 99;
+ z-index: 11;
+ right: 0rpx;
+ bottom: 0rpx;
+ }
+
+ .flower-container {
+ background-color: #ffffff;
+
+ .shopping-item {
+ padding: 10rpx 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: 20rpx;
+
+ .img {
+ width: 124rpx;
+ height: 124rpx;
+ }
+
+ .title {
+ font-weight: 600;
+ font-size: 28rpx;
+
+ color: #000000;
+ line-height: 40rpx;
+
+ .level {
+ color: #20613D;
+ }
+ }
+
+ .price {
+ font-weight: 400;
+ font-size: 28rpx;
+ color: #CF0000;
+ line-height: 40rpx;
+ }
+
+ .desc {
+ font-weight: 400;
+ 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 {
+ overflow-x: scroll;
+
+ .transform-item {
+ background: rgba(225, 240, 231, 0.38);
+ border-radius: 8rpx;
+ //min-height: 112rpx;
+ border: 2rpx solid rgba(225, 240, 231, 0.38);
+ padding: 10rpx;
+ text-align: center;
+ //margin: 0 auto;
+ margin-left: 10rpx;
+ margin-top: 10rpx;
+ margin-right: auto;
+ max-width: 32%;
+ width: 130rpx;
+ min-width: 130rpx;
+
+ .title {
+ font-weight: 400;
+ font-size: 24rpx;
+ color: #000000;
+ line-height: 40rpx;
+ word-break: break-word;
+ min-height: 90rpx
+ }
+
+ .price {
+ font-weight: 600;
+ font-size: 30rpx;
+ color: #20613D;
+ //line-height: 44rpx;
+ }
+ }
+
+ .transform-item.cur {
+ background: #E1F0E7;
+ border-radius: 8rpx;
+ border: 2rpx solid #20613D;
+ }
+ }
+
+ .transform-list:nth-child(3n+0) {
+ margin-left: 0
+ }
+
+ .transform-list:nth-child(3n+2) {
+ margin-right: 0;
+ }
+
+ .desc-red {}
+
+ .desc {}
+ }
+
+ }
</style>
\ No newline at end of file
--
Gitblit v1.9.3