From f8867b8df117d1ac0f1311970994e15059c3da03 Mon Sep 17 00:00:00 2001 From: xuxueyang <xuxy@fengyuntec.com> Date: 星期四, 05 九月 2024 15:57:36 +0800 Subject: [PATCH] add 兼容扫码问题 --- pages/order/order.vue | 894 ++++++++++++++++++++++++++++++++++++++++++----------------- 1 files changed, 630 insertions(+), 264 deletions(-) diff --git a/pages/order/order.vue b/pages/order/order.vue index 0097fe7..0859686 100644 --- a/pages/order/order.vue +++ b/pages/order/order.vue @@ -1,315 +1,681 @@ -<template> - <view> - <!-- 团购、粗去玩、深夜食堂、挖宝商品 --> - <view style="position: fixed;left: 0;right: 0;top: 0;background-color: #fff;height: 84rpx;z-index: 999;"> - <top-tabs :tabs="tabs" :flg.sync="tabIndex" @change="changeTab"></top-tabs> - - </view> - <view style="height: 100rpx;"></view> - <!-- 根据tab不同显示不同信息 --> - - <!-- 根据不同加载不同的继续的底部 --> - <view style="min-height: calc(100vh - 200rpx);"> - <no-data v-if="!list||list.length==0" style="width: 100%;"></no-data> - <view v-if="type=='shop'" class="order-container"> - <card-list-item source="order" :type="type" :dto="item" v-for="(item,index) in list" @refresh="refresh" - :key="index"></card-list-item> - </view> - <view v-if="type=='travel'" class="order-container"> - <card-list-item source="order" :type="type" :dto="item" v-for="(item,index) in list" @refresh="refresh" - :key="index"></card-list-item> - </view> - <view v-if="type=='canteen'" class="order-container"> - <!-- 时间,状态 --> - <view class="order-item good-item" v-for="(item,index) in list" :key="index"> - <view class="flex "> - <view class="time">下单: {{item.createdDate}}</view> - <view class="status">{{item.statusStr}}</view> - </view> - - <view class="flex"> - <!-- overfi --> - <scroll-view class="flex scroll-view" :scroll-x="true" style="max-width: 500rpx;" - v-if="item.items"> - <view v-for="each of item.items" class="item-each"> - <image :src="each.cover" class="cover"></image> - <!-- 文字缩写 --> - <view class="cover-name word-e">{{each.name}}</view> - </view> - </scroll-view> - <view style="min-width: 100rpx;margin-left: auto;"> - <view class="price"><span class="dot">¥</span>{{item.totalAmount||'0.0'}}</view> - <view class="num-tip">共{{getItemsNum(item.items)||0}}件</view> - </view> - </view> - <!-- <view class="address"> - {{item.customerAddress}} - </view> --> - <view class="infos"> - <view class="flex"> - <view class="info-user-name flex flex1"> - <uni-icons type="person-filled" class="icon"></uni-icons> - {{item.customer}} - </view> - <view class="info-user-tel flex flex1"> - <uni-icons type="phone-filled" class="icon"></uni-icons> - {{item.customerTel}} - </view> - </view> - <view class="info-user-address flex"> - <uni-icons type="location-filled" class="icon"></uni-icons> - {{item.customerAddress}} - </view> - - </view> - <view class="buttons"> - <view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'" - @click.stop="toPay(item)">支付订单</view> - <view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'" - @click.stop="cancelPay(item)">取消订单</view> - - <view class="button-shouhuo button" @click.stop="toOrderDetail(item)">订单详情</view> - </view> - </view> - <!-- 货物单 --> - <!-- 地址 --> - </view> - <view v-if="type=='good'" class="order-container"> - <view class="order-item good-item" v-for="(item,index) in list" :key="index"> - <view class="flex "> - <view class="time">下单: {{item.createdDate}}</view> - <view class="status">{{item.statusStr}}</view> - </view> - <view class="flex"> - <image class="cover" :src="item.items[0].cover"></image> - <view> - <view class="name">{{item.items[0].name}}</view> - <!-- <view>介绍尺码</view> --> - <view class="price"><span class="dot">¥</span>{{item.totalAmount||'0.0'}}</view> - </view> - </view> - <view class="infos"> - <view class="info-user-name flex"> - <uni-icons type="person-filled" class="icon"></uni-icons> - {{item.customer}} - </view> - <view class="info-user-tel flex"> - <uni-icons type="phone-filled" class="icon"></uni-icons> - {{item.customerTel}} - </view> - <view class="info-user-address flex"> - <uni-icons type="location-filled" class="icon"></uni-icons> - {{item.customerAddress}} - </view> - - </view> - <view class="buttons"> - <view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'" - @click.stop="toPay(item)">支付订单</view> - <view class="button-wuliu button" v-if="item.status=='PENDING'||item.status==='PREPAYMENT'" - @click.stop="cancelPay(item)">取消订单</view> - - <!-- <view class="button-shouhuo button" v-if="item.status!=='PENDING'&&item.status!=='PREPAYMENT'||true">查看物流</view> --> - <view class="button-shouhuo button" @click.stop="toOrderDetail(item)">订单详情</view> - - <!-- <view class="button-shouhuo button" v-if="item.status!=='PENDING'&&item.status!=='PREPAYMENT'">确认收货</view> --> - </view> - - </view> - </view> - </view> - - <footer-msg :more="page.total>0&&page.total>page.current*page.size"></footer-msg> - - </view> -</template> - <script> export default { + data() { return { - type: '', - tabIndex: 1, + type: 'customer', query: { - + status: '', }, - tabs: [{ - name: '团购', - id: 'shop', - api: '/api/buy/customer/group/list/mine' + timer: undefined, + status: [{ + name: '全部', + value: '' }, { - name: '粗去玩', - id: 'travel', - api: '/api/trip/customer/list/mine' + name: '待付款', + value: 'PENDING' }, { - name: '每日维C', - id: 'canteen', - api: '/api/canteen/customer/order/list' - + name: '待发货', + value: 'SEND' }, { - name: '挖宝商品', - id: 'good', - api: '/api/wabao/customer/order/list' - + name: '待收货', + value: 'RECEIVE' }, - ], - } + { + name: '待评价', + value: 'EVALUATE' + }, + { + name: '已完成', + value: 'COMPLETED' + }, + { + name: '已退款', + value: 'REFUND' + }, + ] + }; }, - onLoad(options) { - this.type = options.type || '' - var index = -1 - for (var item of this.tabs) { - index++ - if (item.id == this.type) { - this.tabIndex = index - this.listApi = item.api - break + onUnload() { + this.timer && clearTimeout(this.timer) + }, + async onLoad(options) { + this.query.status = options.status || '' + this.listApi = `/api/customer/order/list` + await this.getList() + this.timer = setInterval(() => { + //倒计时 + var nowdate = new Date().getTime() - 1000 * 60 * 5 + var change = false + for (var item of this.list) { + if (item.statusBackend === 'PENDING') { + //计算倒计时 + var diff = new Date(item.createTime).getTime() - nowdate + // console.log('diff', diff, item) + if (diff <= 2000 && true) { + //超过了5分钟 + item.statusBackend = 'CANCEL' + item.statusBackend = '已取消' + item.status = 'CANCEL' + item.statusStr = '已取消' + + item.bctime = '' + change = true + + } else { + //相差 + var alltime = parseInt(diff / 1000) + var tt = 0 + if (alltime > 60) { + tt = alltime - parseInt(alltime / 60) * 60 + } else { + tt = alltime + } + item.bctime = `0${parseInt(alltime / 60)}:${tt<10?'0':''}${tt}` + change = true + + } + } } - } - this.refresh() - - + if (change) + this.$forceUpdate() + }, 1000) }, onReachBottom() { - this.page.current += 1 this.getMore() }, + async onPullDownRefresh() { + this.page.current = 1 + await this.getList() + uni.stopPullDownRefresh() + }, methods: { - toOrderDetail(row) { - var url = `/pages/order/bussiness-order/bussincess-order-detail?source=user&type=${this.type}` - if (this.type == 'travel') { - url += `&id=${row.id}&userId=${this.currentInfo.id}` - } else { - url += `&id=${row.id}` - } + toDetail(item) { + // 订单详情页面 + // console.log(' toDetail item', item) uni.navigateTo({ - url: url + url: '/pages/order/order-detail?id=' + item.id }) }, - async cancelPay(item) { - if (!this.currentInfo.id) { - await this.$message.confirm('未登录,前往登录?') - uni.navigateTo({ - url: '/pages/user/user' - }) - return - } - await this.$message.confirm('是否确认取消支付?') - this.$message.showLoading() - const orderInfo = await this.$http.request('post', '/api/order/cancel/' + (item.orderId || - item.id || ''), { - + toDetailSaleInfo(dto, flower) { + console.log('flower', dto, flower) + uni.navigateTo({ + url: '/pages/order/order-detail?showsales=1&id=' + dto.id + '&flowerId=' + flower.id }) - this.$message.hideLoading() - if (code == 0) { - this.$message.showToast('取消成功') - this.dto.status = 'COMPLETED' - this.dto.statusStr = '已取消' - setTimeout(() => { - that.refresh() - }, 500) - } - }, - async toPay(item) { - if (!this.currentInfo.id) { - this.$message.showToast('请先登陆') - return - } - if (item.status === 'PENDING' || item.status === 'PREPAYMENT') { - if (this.type == 'canteen') { - const orderInfo = await this.$http.request('get', '/api/canteen/customer/payment/' + item - .id, {}) - //支付准备 - var info = orderInfo.data - let that = this - wx.requestPayment({ - ...info, - success(res) { - console.log('pay success', res) - that.$message.showToast('支付成功') - setTimeout(() => { - that.refresh() - }, 500) - }, - fail(err) { - console.error('pay fail', err) - that.$message.showToast('支付失败') + async buttonClick(item, buttontype) { + switch (buttontype) { + case 'refund': { + await this.$message.confirm('是否确定申请退款') + // 发送请求 + this.$message.showLoading() + const { + code + } = await this.$http.request('get', '/api/customer/order/refund', { + params: { + id: item.id, } }) - - } else { - // this.$message.showToast('等待接口,请联系开发者') - // return - this.$message.showLoading() - const orderInfo = await this.$http.request('post', '/api/order/pay/again/' + (item.orderId || - item.id || ''), { - - }) - var info = orderInfo.data || {} this.$message.hideLoading() - if (code == 0) { + if (code === 0) { + this.$store.dispatch('sign_add', 'order') + this.refreshList() + } + } + break + case 'confirm': { + await this.$message.confirm('是否确定收货') + var tryCallWx = false + // #ifdef MP + let tmp = this + if (wx.openBusinessView && item.paymentTrId) { + tryCallWx = true + wx.openBusinessView({ + businessType: 'weappOrderConfirm', + extraData: { + // merchant_id: '1230000109', + // merchant_trade_no: '1234323JKHDFE1243252', + transaction_id: item.paymentTrId + }, + async success() { + //dosomething + // 发送请求 + tmp.$message.showLoading() + const { + code + } = await tmp.$http.request('get', + '/api/customer/order/receive/confirm', { + params: { + id: item.id, + } + }) + tmp.$message.hideLoading() + if (code === 0) { + tmp.refreshList() + } + }, + fail(e) { + //dosomething + console.log('error fail', e) + tmp.$message.showToast('收货失败') + }, + complete() { + //dosomething + } + }); + } + + // #endif + + if (!tryCallWx) { + // 发送请求 + this.$message.showLoading() + const { + code + } = await this.$http.request('get', '/api/customer/order/receive/confirm', { + params: { + id: item.id, + } + }) + this.$message.hideLoading() + if (code === 0) { + this.refreshList() + } + } + + } + break + case 'payAgain': { + await this.$message.confirm('是否确定重新支付') + // 发送请求 + this.$message.showLoading() + const { + code, + data + } = await this.$http.request('get', '/api/customer/order/payAgain', { + params: { + id: item.id, + } + }) + this.$message.hideLoading() + if (code === 0) { + //微信接口 let that = this wx.requestPayment({ - ...info, - success(res) { + ...data, + async success(res) { console.log('pay success', res) that.$message.showToast('支付成功') - item.status = 'PAYMENT' - item.statusStr = '已支付' setTimeout(() => { - that.refresh() - }, 500) + that.$store.dispatch('sign_add', 'order') + that.refreshList() + }, 200) }, fail(err) { console.error('pay fail', err) that.$message.showToast('支付失败') } }) + + } + + } + break + case 'evaluate': { + const res = await this.$message.confirm('', { + editable: true, + title: '请输入评价信息' + }) + if (res.content && res.confirm) { + // 发送请求 + this.$message.showLoading() + const { + code + } = await this.$http.request('post', '/api/customer/order/evaluate', { + data: { + id: item.id, + evaluate: res.content + } + }) + this.$message.hideLoading() + if (code === 0) { + this.refreshList() + } } } + break + // case 'sales': { - } else { - this.$message.showToast('请不要重复支付') - return - } - }, - getItemsNum(arr) { - var a = 0 - if (arr) { - for (var item of arr) { - a += item.num || 0 + + // }, + case 'cancelOrder': { + await this.$message.confirm('是否取消订单') + // 发送请求 + this.$message.showLoading() + const { + code + } = await this.$http.request('get', '/api/customer/order/cancel', { + params: { + id: item.id, + } + }) + this.$message.hideLoading() + if (code === 0) { + this.$store.dispatch('sign_add', 'order') + this.refreshList() + } } - } - - return a - }, - refresh() { - //获取 - console.log('refresh') - this.page.current = 1 - this.getList() - }, - changeTab(e) { - this.type = this.tabs[e].id - console.log('this.type', this.type, this.tabs, e) - - this.list = [] - for (var item of this.tabs) { - if (item.id == this.type) { - this.listApi = item.api + break + case 'delOrder': { + await this.$message.confirm('是否删除此订单') + // 发送请求 + this.$message.showLoading() + const { + code + } = await this.$http.request('get', '/api/customer/order/delete', { + params: { + id: item.id, + } + }) + this.$message.hideLoading() + if (code === 0) { + // this.$store.dispatch('sign_add', 'order') + this.refreshList() + } + } + break + default: break - } } - this.refresh() }, - } + + }, } </script> +<template> + <view class="order-container"> + <view class="order-top" v-if="false"> + <view class="title">订单信息</view> + <view class="flex"> + <image class="image img100" + src="https://hmy-flower.oss-cn-shanghai.aliyuncs.com/67/67acf980f310460a97d305c6ffc7e811位图@2x (1).png"> + </image> + <view>消费订单:¥<span class="m-r-10">{{ '0' }}</span> 总消费:¥<span>{{ '0' }}</span></view> + </view> + </view> + <view class="status-list m-t-12 flex flex-wrap-normal"> + <view v-for="each of status" :key="each.value" @click.stop="(e)=>{ + query.status = each.value || ''; + refreshList(); + }" class="status-each" :class="[query.status===each.value?'cur':'']"> + {{ each.name }} + </view> + </view> + <no-data v-if="!list||list.length===0" style="width: 100%;" class="m-t-12"></no-data> + <view v-for="(dto,index) in list" :key="index" class="m-t-12"> + <view class="order-item list-item"> + <view class="title flex"> + <view> + 订单:{{ dto.orderNo }} + </view> + <view class="status t-red m-l-a m-r-0">¥{{ dto.paymentAmount || dto.totalAmount || '0'}}</view> + </view> + <view class=" desc flex" v-if="!query.status"> + <view class="label"> + 订单状态: + </view> + <view class="value" style="color: #000">{{ dto.statusBackendStr || '-' }}</view> + </view> + <view class="desc flex" v-if="dto.deliveryNo" @click="copyTxt(dto.deliveryNo)"> + <view class="label"> + 快递单号: + </view> + <view class="value">{{ dto.deliveryNo }}</view> + </view> + + <view class="flex"> + <view class="desc flex flex1"> + <view class="label"> + 收货人: + </view> + <view class="value">{{ dto.customer || '-' }}</view> + </view> + <view class="desc flex flex1"> + <view class="label"> + 收货人手机号码: + </view> + <view class="value">{{ dto.customerTel || '-' }}</view> + </view> + </view> + <view class="flex"> + <view class="desc flex flex1"> + <view class="label"> + 收货地址: + </view> + <view class="value">{{ dto.customerAddress }}</view> + </view> + <view class="desc flex flex1" v-if="dto.deliveryName"> + <view class="label"> + 快递名称: + </view> + <view class="value">{{ dto.deliveryName }}</view> + </view> + </view> + + <view class="desc flex" v-if="dto.statusBackend!=='PENDING'&&dto.statusBackend!=='CANCEL'"> + <view class="label"> + 支付时间: + </view> + <view class="value">{{ dto.paymentTime || '-' }}</view> + </view> + <view class="flower-info m-b-5 m-t-8 br-4" v-for="(item,j) of dto.items" :key="j"> + <!-- <view class="line-gray"></view> --> + + <view class="supplier-name "> + <image class="icon-dp br-4" src="/static/common/icon-dp.png"></image> + {{ item.supplierName }} + </view> + <view class="flex m-t-12 flex-wrap-normal"> + <image class="flower-img img100 m-r-6" :src="item.flowerCover" + @click="previewImg(item.flowerCover)"> + </image> + <view class="flex1"> + <view class=" flex"> + <view class="title"><span class="level">{{ item.flowerCategory }}</span><span + class="level">{{ item.flowerLevelStr }}</span>{{ item.flowerName }} + </view> + </view> + <view class="each-list"> + <view class="each-item"> + <view class="label">颜色</view> + <view class="value">{{ item.flowerColor || '-' }}</view> + + </view> + <view class="each-item"> + <view class="label">规格</view> + <view class="value">{{ item.flowerUnit || '-' }}</view> + </view> + + <view class="each-item"> + <view class="label">数量</view> + <view class="value">{{ item.num || 0 }}</view> + + </view> + <view class="each-item"> + <view class="label">售价</view> + <view class="value">¥{{ item.price || 0 }}</view> + + </view> + <view class="each-item"> + <view class="label">商品总金额</view> + <view class="value">¥{{ item.total || 0 }}</view> + + </view> + </view> + </view> + </view> + <view class="line-gray" v-if="dto.statusBackend!=='COMPLETED'&&dto.statusBackend!=='SEND'&&dto.statusBackend=='RECEIVE'"></view> + <!-- dtoId:{{dto.id}} --> + <!-- flowerId:{{item.id}} --> + <view class="flex buttons" v-if="dto.statusBackend!=='COMPLETED'&&dto.statusBackend!=='SEND'&&dto.statusBackend=='RECEIVE'"> + <view class="button button-1 m-l-a m-r-0" @click="toDetailSaleInfo(dto,item)" + v-if="dto.statusBackend === 'RECEIVE'"> 申请售后 + </view> + </view> + + + </view> + <view class="line-gray"></view> + + <view class="flex buttons"> + <view class="button button-0 m-l-a m-r-15" v-if="dto.statusBackend==='CANCEL'" + @click="buttonClick(dto,'delOrder')">删除订单</view> + <view class="button button-0 m-l-a m-r-15" v-if="dto.statusBackend==='PENDING'" + @click="buttonClick(dto,'cancelOrder')">取消订单</view> + <view class="button button-1 m-l-15 m-r-15" v-if="dto.statusBackend==='PENDING'" + @click="buttonClick(dto,'payAgain')">重新支付<span v-if="dto.bctime">({{dto.bctime}})</span></view> + + <view class="button button-0 m-l-a m-r-15" @click="buttonClick(dto,'refund')" + v-if="dto.couldRefund"> + 申请退款 + </view> + <view class="button button-0 m-l-a m-r-15" @click="buttonClick(dto,'confirm')" + v-if="dto.statusBackend ==='RECEIVE'"> 确认收货 + </view> + <!-- ||item.statusBackend=='COMPLETED' --> + <!-- <view class="button button-1 m-l-a m-r-15" @click="toDetailSale(dto)" + v-if="dto.statusBackend === 'RECEIVE'"> 申请售后 + </view> --> + <view class="button button-0 m-l-a m-r-15" @click="buttonClick(dto,'evaluate')" + v-if="dto.statusBackend === 'EVALUATE'"> 评价 + </view> + + + + <view class="button button-1 m-l-a m-r-0" @click="toDetail(dto)">查看详情</view> + </view> + </view> + + </view> + + </view> +</template> <style lang="scss" scoped> - @import './order.scss' + .order-container { + padding: 24rpx 30rpx; + + .order-item { + margin-bottom: 20rpx; + padding: 28rpx; + background-color: #fff; + border-radius: 8rpx; + + .title { + font-weight: 600; + font-size: 28rpx; + color: #000000; + line-height: 40rpx; + + .status { + font-weight: 400; + font-size: 28rpx; + color: #20613D; + line-height: 40rpx; + } + } + + .desc { + font-weight: 400; + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + } + + + .line { + height: 2rpx solid #EEEEEE; + margin-top: 16rpx; + margin-bottom: 16rpx; + } + + .buttons { + display: flex; + margin-left: auto; + width: fit-content; + + .button { + // width: 216rpx; + padding: 10rpx 20rpx; + line-height: 34rpx; + font-size: 24rpx; + height: 34rpx; + background: #20613D; + text-align: center; + border-radius: 30rpx; + min-width: 80rpx; + + } + + .button-1 { + background: #fff; + color: #333; + border: 2rpx solid #333; + + } + + .button-0 { + color: #fff; + border: 2rpx solid #20613D; + } + } + + .flower-info { + padding: 0rpx; + + background: #FFFFFF; + border-radius: 8rpx; + + .supplier-name { + border-bottom: 2rpx solid #EEEEEE; + font-weight: 600; + font-size: 28rpx; + color: #000000; + padding-bottom: 10rpx; + line-height: 40rpx; + + .icon-dp { + width: 27rpx; + height: 27rpx; + display: inline-block; + vertical-align: middle; + } + } + + .title { + font-weight: 600; + font-size: 28rpx; + color: #000000; + line-height: 40rpx; + + .level { + font-weight: 400; + font-size: 28rpx; + color: #20613D; + line-height: 40rpx; + margin-right: 20rpx; + } + } + + .flower-img { + width: 128rpx; + height: 118rpx; + min-width: 128rpx; + min-height: 118rpx; + } + + .each-list { + display: flex; + flex-wrap: wrap; + margin-top: 6rpx; + + .each-item { + min-width: 40%; + max-width: 50%; + text-align: center; + margin-left: 0rpx; + margin-right: auto; + display: flex; + + .label { + font-weight: 400; + font-size: 24rpx; + color: #666666; + text-align: left; + padding-right: 10rpx; + } + + .label::after { + content: ": " + } + + .value { + font-weight: 400; + font-size: 24rpx; + color: #666666; + } + } + } + + } + + + } + + .status-list { + overflow-x: scroll; + + .status-each { + font-weight: 400; + font-size: 28rpx; + color: #666666; + line-height: 40rpx; + margin: 0 auto; + //min-width: ; + // padding-left: 10rpx; + // padding-right: 10rpx; + width: fit-content; + min-width: 120rpx; + text-align: center; + } + + .status-each.cur { + font-weight: 600; + font-size: 32rpx; + color: #20613D; + // line-height: 44rpx; + } + + .status-each:first-child { + margin-left: 0 + } + + .status-each:last-child { + margin-right: 0; + } + } + + .order-top { + position: relative; + min-height: 182rpx; + background: #E1F0E7; + border-radius: 8rpx; + padding: 45rpx 35rpx; + + .title { + font-weight: 600; + font-size: 30rpx; + color: #000000; + line-height: 42rpx; + } + + .desc { + font-weight: 400; + font-size: 24rpx; + color: #666666; + line-height: 34rpx; + } + + .image { + position: absolute; + right: 0rpx; + width: 288rpx; + height: 148rpx; + bottom: 0rpx; + } + } + } </style> \ No newline at end of file -- Gitblit v1.9.3