订单列表详情支付,头像修改,订单数据统计

common/api/order.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-29 17:38:17
  * @LastEditors: ch
- * @LastEditTime: 2022-04-19 11:10:55
+ * @LastEditTime: 2022-04-19 15:00:05
  * @Description: file content
  */
 import {ToAsyncAwait, MsbRequestTk} from '@/common/utils';
@@ -76,7 +76,16 @@ export const ApiPutCancelOrder = (data) =>
 export const ApiPostWxPay = (data) => 
 	// ToAsyncAwait(MsbRequestTk.post(`${BASE_URL}/pay/wxPay/app`, data));
 	ToAsyncAwait(MsbRequestTk.get(`${BASE_URL}/pay/payTest`, data));
-	
+
+/**
+ * 获取订单统计数据
+ */
+export const ApiGetOrderStatistics = () => 
+	ToAsyncAwait(MsbRequestTk.get(`${BASE_URL}/app/tradeOrder/statistics`))
+
+
+
+
 
 
 

common/utils/requset.js

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-17 17:42:32
  * @LastEditors: ch
- * @LastEditTime: 2022-04-19 11:23:58
+ * @LastEditTime: 2022-04-19 11:33:34
  * @Description: 项目接口请求统一处理器，返回一个需要token和不需要token的请求封装方法
  */
 
@@ -11,8 +11,8 @@ import $store from '@/common/store';
 
 const ENV = 'test';
 const BASE_URL = {
-	'test' : 'http://k8s-horse-gateway.mashibing.cn',
-	// 'test' : '',
+	// 'test' : 'http://k8s-horse-gateway.mashibing.cn',
+	'test' : '',
 	'release' : '',
 	'prod' : ''
 };

components/BsPay.vue

@@ -0,0 +1,60 @@
+<!--
+ * @Author: ch
+ * @Date: 2022-04-19 11:37:50
+ * @LastEditors: ch
+ * @LastEditTime: 2022-04-19 14:42:49
+ * @Description: file content
+-->
+<template>
+	<UiRadioPicker title="请选择支付方式" :show="show" :options="options" 
+		@close="close"	@confirm="confirm" />
+</template>
+<script>
+import UiRadioPicker from './UiRadioPicker.vue'
+import { ApiPostWxPay } from '@/common/api/order';
+export default {
+	components: { UiRadioPicker },
+	props : {
+		show : {
+			type : Boolean,
+			default : false
+		},
+		order:{
+			type : Object,
+			default : () => ({})
+		}
+	},
+	data(){
+		return {
+			options : [
+				{
+					label : '微信支付',
+					value : 'wxpay'
+				},
+				{
+					label : '支付宝支付',
+					value : 'alipay'
+				}
+			]
+		}
+	},
+	methods:{
+		async confirm(val){
+			const orderId = this.order.orderId;
+			const {error, result} = await ApiPostWxPay({orderId,payTypeEnum:'WXPAY'});
+			if(error){
+				this.$Router.replace(`/payFail?ordId=${orderId}`)
+			}else{
+				this.$Router.replace(`/paySuccess?ordId=${orderId}`)
+			}
+		},
+		close(){
+			this.$emit('update:show',false);
+		}
+	}
+	
+}
+</script>
+<style lang="scss" scoped>
+
+</style>

components/UiButton.vue

@@ -2,11 +2,11 @@
  * @Author: ch
  * @Date: 2022-03-26 10:06:38
  * @LastEditors: ch
- * @LastEditTime: 2022-04-15 15:43:12
+ * @LastEditTime: 2022-04-19 14:38:07
  * @Description: file content
 -->
 <template>
-	<button :class="`ui-btn ui-btn__${type} ui-btn__${size}${(disabed ? ' ui-btn__disabed' : '')}`" @click="click"><slot></slot></button>
+	<button :class="`ui-btn ui-btn__${type} ui-btn__${size} ${disable ? ' x ui-btn__disabed' : ' xx'}`" @click="click"><slot></slot></button>
 </template>
 <script>
 export default {
@@ -19,7 +19,7 @@ export default {
 			type : String,
 			default : 'normal' //normal 60 max 80 min 50
 		},
-		disabed:{
+		disable:{
 			type : Boolean,
 			default : false
 		}
@@ -71,7 +71,7 @@ export default {
 		border: 1px solid $color-yellow3;
 	}
 	&__disabed{
-		opacity: .8;
+		opacity: .5;
 	}
 }
 </style>

components/UiRadioPicker.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-04-12 10:37:24
  * @LastEditors: ch
- * @LastEditTime: 2022-04-12 13:37:57
+ * @LastEditTime: 2022-04-19 14:38:12
  * @Description: file content
 -->
 <template>
@@ -15,9 +15,8 @@
 			</UiCell>
 		</radio-group>
 		<view class="ui-select--footer">
-			<UiButton type="gradual" size="max" @click="confirm">确认</UiButton>
+			<UiButton type="gradual" size="max" :disable="!selected.value" @click="confirm">确认</UiButton>
 		</view>
-		
 	</u-popup>
 </template>
 <script>
@@ -57,10 +56,15 @@ export default {
 			this.selected = this.options.find(item => val.detail.value === item.value);
 		},
 		confirm(){
-			this.close();
+			if(!this.selected.value){
+				return false;
+			}
 			this.$emit('input', this.selected);
+			this.$emit('confirm', this.selected);
+			this.close();
 		},
 		close(){
+			this.$emit('close');
 			this.$emit('update:show', false);
 		}
 	}

components/UiWhiteBox.vue

@@ -2,16 +2,16 @@
  * @Author: ch
  * @Date: 2022-03-31 15:42:55
  * @LastEditors: ch
- * @LastEditTime: 2022-03-31 16:23:32
+ * @LastEditTime: 2022-04-19 13:57:30
  * @Description: file content
 -->
 <template>
-	<view class="uiWhiteBox">
+	<view class="ui-white-box">
 		<slot></slot>
 	</view>
 </template>
 <style lang="scss" scoped>
-.uiWhiteBox{
+.ui-white-box{
 	margin: 20rpx 30rpx;
 	background: $color-grey0;
 	border-radius: 20rpx;

manifest.json

@@ -84,6 +84,9 @@
                 },
                 "/pay/" : {
                     "target" : "http://192.168.10.109:8090/"
+                },
+                "/oss/" : {
+                    "target" : "http://192.168.10.109:8090/"
                 }
             }
         }

pages/account/index.vue

@@ -3,7 +3,7 @@
 	components: { UiCell },: ch
  * @Date: 2019-08-22 19:41:20
  * @LastEditors: ch
- * @LastEditTime: 2022-04-13 16:15:34
+ * @LastEditTime: 2022-04-19 15:39:04
  * @Description: file content
 -->
 <template>
@@ -14,7 +14,8 @@
 		</view>
 		<UiCell class="header--cell" :title="userInfo.nickname" label="第一个青春是上帝给的..."
 			@click="$Router.push('/setUserInfo')">
-			<image slot="icon" class="head-img" src="@/static/account/tx.png" shape="circle" />
+			<!-- <image slot="icon" class="head-img" src="@/static/account/tx.png" shape="circle" /> -->
+			<image slot="icon" class="head-img" :src="userInfo.avatar || require('@/static/account/tx.png')" shape="circle" />
 		</UiCell>
 		<view class="order">
 			<view class="order--title">
@@ -22,18 +23,18 @@
 				<text class="order--title-more" @click="$Router.push('/orderList')">查看更多</text>
 			</view>
 			<view class="order-tabs">
-				<view class="order-tabs--item">
-					<u-badge class="item-badge" max="99" :value="9"></u-badge>
+				<view class="order-tabs--item" @click="$Router.push('/orderList?tab=1')">
+					<u-badge class="item-badge" max="99" :value="statistic.unpaidCount"></u-badge>
 					<image class="item-icon" src="@/static/account/fk.png"/>
 					<view>待付款</view>
 				</view>
-				<view class="order-tabs--item">
-					<u-badge class="item-badge" max="99" :value="9"></u-badge>
+				<view class="order-tabs--item" @click="$Router.push('/orderList?tab=3')">
+					<u-badge class="item-badge" max="99" :value="statistic.waitDeliveryCount"></u-badge>
 					<image class="item-icon" src="@/static/account/fh.png"/>
 					<view>待发货</view>
 				</view>
-				<view class="order-tabs--item">
-					<u-badge class="item-badge" max="99" :value="9"></u-badge>
+				<view class="order-tabs--item" @click="$Router.push('/orderList?tab=4')">
+					<u-badge class="item-badge" max="99" :value="statistic.deliveredCount"></u-badge>
 					<image class="item-icon" src="@/static/account/sh.png"/>
 					<view>待收货</view>
 				</view>
@@ -59,18 +60,20 @@
 <script>
 import UiCell from '../../components/UiCell.vue';
 import { ApiGetCurrentUser } from '@/common/api/account'
+import { ApiGetOrderStatistics } from '@/common/api/order'
 export default {
 	components : { UiCell },
 	data(){
 		return { 
-			userInfo : {}
+			userInfo : {},
+			statistic : {}
 		}
 	},
 	onLoad(){
-		this.getUserInfo();
 	},
 	onShow(){
-		
+		this.getUserInfo();
+		this.getOrderStatistics();
 	},
 	methods: {
 		async getUserInfo(){
@@ -81,6 +84,14 @@ export default {
 			}
 			this.userInfo = result;
 			this.$store.commit('SET_USER_INFO', result);
+		},
+		async getOrderStatistics(){
+			const {error, result} = await ApiGetOrderStatistics();
+			if(error){
+				uni.$u.toast(error.message);
+				return false;
+			}
+			this.statistic = result;
 		}
 	}
 }

pages/account/setting/index.vue

@@ -2,13 +2,13 @@
  * @Author: ch
  * @Date: 2022-03-22 15:09:06
  * @LastEditors: ch
- * @LastEditTime: 2022-04-18 18:40:02
+ * @LastEditTime: 2022-04-19 15:56:51
  * @Description: file content
 -->
 <template>
 	<view>
 		<UiCell class="userInfo cell" :title="userInfo.nickname" @click="$Router.push('/setUserInfo')">
-			<image slot="icon" class="userInfo--head" src="@/static/account/tx.png" ></image>
+			<image slot="icon" class="userInfo--head"  :src="userInfo.avatar || require('@/static/account/tx.png')" ></image>
 		</UiCell>
 		<UiCell class="cell" title="我的收货地址" @click="$Router.push('/addressList')"></UiCell>
 		<UiCell class="cell" title="关于我们" ></UiCell>

pages/account/setting/setUserInfo.vue

@@ -2,17 +2,16 @@
  * @Author: ch
  * @Date: 2022-03-28 15:38:23
  * @LastEditors: ch
- * @LastEditTime: 2022-04-13 14:45:56
+ * @LastEditTime: 2022-04-19 15:55:24
  * @Description: file content
 -->
 <template>
 	<view>
 		<view class="userInfo">
-			<u-upload  class="userInfo--upload" name="6" :fileList="fileList" @afterRead="headUpload" >
-				<image class="userInfo--head" src="@/static/account/tx.png" ></image>
+			<u-upload  class="userInfo--upload" @afterRead="headUpload" >
+				<image class="userInfo--head" :src="userInfo.avatar || require('@/static/account/tx.png')" ></image>
 			</u-upload>
 			<view>{{userInfo.nickname}}</view>
-			<u-input type="file" value="xxx"/>
 		</view>
 		<UiCell class="cell" title="昵称" :value="userInfo.nickname" @click="$Router.push('/setNickname')"></UiCell>
 		<UiCell class="cell cell--last" title="性别" :value="sexName" @click="sexShow = true"></UiCell>
@@ -25,12 +24,12 @@ import UiButton from '@/components/UiButton.vue'
 import UiCell from '@/components/UiCell.vue';
 import {Request} from '@/common/utils';
 import {ApiPutUser} from '@/common/api/account';
-const OSS = {"accessId":"LTAI4GHRNb5Xn2w5NeHVbR4c","policy":"eyJleHBpcmF0aW9uIjoiMjAyMi0wNC0xM1QwOTozMDoxNC45MjNaIiwiY29uZGl0aW9ucyI6W1siY29udGVudC1sZW5ndGgtcmFuZ2UiLDAsMTA0ODU3NjAwMF0sWyJzdGFydHMtd2l0aCIsIiRrZXkiLCJyZWZ1bmQtZXZpZGVuY2UiXV19","signature":"RDaMnKgLslcO8NX+WIwiJ5khYNc=","dir":"refund-evidence","host":"https://msb-edu-dev.oss-cn-beijing.aliyuncs.com","expire":1649842214,"callback":"eyJjYWxsYmFja0JvZHlUeXBlIjoiYXBwbGljYXRpb24veC13d3ctZm9ybS11cmxlbmNvZGVkIiwiY2FsbGJhY2tCb2R5IjoiZmlsZW5hbWU9JHtvYmplY3R9JnNpemU9JHtzaXplfSZtaW1lVHlwZT0ke21pbWVUeXBlfSZoZWlnaHQ9JHtpbWFnZUluZm8uaGVpZ2h0fSZ3aWR0aD0ke2ltYWdlSW5mby53aWR0aH0mc2VydmljZU5hbWU9bWFsbC10cmFkZSJ9","md5":null}
+import {ApiPostGetOssConfig} from '@/common/api/oss';
+
 export default {
 	components: { UiCell, UiButton },
 	data(){
 		return {
-			fileList: [],
 			sexShow : false,
 			sexData : [[{label:'女',val:2},{label:'男',val:1}]]
 		}
@@ -61,25 +60,41 @@ export default {
 			this.$store.commit('SET_USER_INFO', {...this.userInfo, gender:value});
 			this.sexShow = false;
 		},
-		headUpload(val){
+		async getOssCon(){
+			const {error, result} = await ApiPostGetOssConfig({
+				configId : 'account-avatar/',
+				serviceName : 'uc'
+			});
+			if(error){
+				uni.$u.toast(error.message);
+				return false
+			}
+			return result;
+		},
+		async headUpload(val){
+
 			const file = val.file;
-			// uni.getFileInfo({filePath:file.url,success(res){
-			// 	console.log(res,'====');
-			// }})
+			const oss = await this.getOssCon();
 			uni.uploadFile({
 				name : 'file',
 				filePath : file.url,
-				url : OSS.host,
+				url : oss.host,
 				formData : {
 					name : file.name,
-					key : `${OSS.dir}${'${filename}'}`,
-					policy : OSS.policy,
-					OSSAccessKeyId : OSS.accessid,
+					key : `${oss.dir}${'${filename}'}`,
+					policy : oss.policy,
+					OSSAccessKeyId : oss.accessId,
 					success_action_status : 200,
-					signature : OSS.signature
+					signature : oss.signature
 				},
-				success(res){
-					// console.log(res,'-----');
+				 success : async (res)=>{
+					const avatar = `${oss.host}/${oss.dir}${file.name}`;
+					const {error, result} = await ApiPutUser({avatar});
+					if(error){
+						ui.$u.totas(error.message);
+						return false
+					}
+					this.$store.commit('SET_USER_INFO', {...this.userInfo, avatar});
 				}
 			})
 

pages/order/detail/components/Operation.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-04-15 17:46:10
  * @LastEditors: ch
- * @LastEditTime: 2022-04-18 17:41:55
+ * @LastEditTime: 2022-04-19 14:45:22
  * @Description: file content
 -->
 <template>
@@ -16,7 +16,7 @@
 			<!-- 待支付可以取消，支付订单 -->
 			<template v-if="orderInfo.orderStatus === 1">
 				<UiButton class="footer--btn" @click="cancelShow = true">取消订单</UiButton>
-				<UiButton class="footer--btn" type="gradual">去支付</UiButton>
+				<UiButton class="footer--btn" type="gradual" @click="payShow = true">去支付</UiButton>
 			</template>
 			<u-popup class="cancel" :show="cancelShow" @close="closeCancel" round="16rpx" closeable>
 				<view class="cancel--title">取消订单原因</view>
@@ -42,15 +42,16 @@
 					<UiButton type="gradual" :disabed="cancelValue == 0">确认取消</UiButton>
 				</view>
 			</u-popup>
-
+			<BsPay class="modal" :show.sync="payShow" :order="orderInfo"></BsPay>
 		</view>
 </template>
 <script>
 import UiButton from '@/components/UiButton.vue'
 import UiCell from '@/components/UiCell.vue'
 import {ApiPutCancelOrder,ApiPutOrderReceive} from '@/common/api/order'
+import BsPay from '../../../../components/BsPay.vue'
 export default {
-	components: { UiButton, UiCell },
+	components: { UiButton, UiCell, BsPay },
 	props : {
 		orderInfo : {
 			type : Object,
@@ -61,7 +62,9 @@ export default {
 		return {
 			// 取消订单弹窗
 			cancelShow : false,
-			cancelValue : 0
+			cancelValue : 0,
+			// 支付
+			payShow : false
 		}
 	},
 	methods : {

pages/order/list.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-22 10:58:24
  * @LastEditors: ch
- * @LastEditTime: 2022-04-18 16:33:42
+ * @LastEditTime: 2022-04-19 15:06:56
  * @Description: file content
 -->
 <template>
@@ -41,7 +41,8 @@
 				<text class="orders--total__amount orders--total__pay">￥{{item.payAmount}}</text>
 			</view>
 			<view class="orders--footer">
-				<button class="orders--footer-btn orders--footer-btn__red" v-if="item.orderStatus === 1">去支付</button>
+				<button class="orders--footer-btn orders--footer-btn__red" 
+					v-if="item.orderStatus === 1" @click="pay(item)">去支付</button>
 				<button class="orders--footer-btn" v-if="item.orderStatus === 2" 
 					@click="$Router.push(`/orderDetail?id=${item.orderId}`)">查看详情</button>
 				<button class="orders--footer-btn" v-if="item.orderStatus >= 4" 
@@ -50,6 +51,8 @@
 			</view>
 		</view>
 		<u-loadmore :status="loadingStatus" v-if="orderListData.length" />
+
+		<BsPay :show.sync="payShow" :order="payOrder"></BsPay>
 	</view>
 </template>
 <script>
@@ -57,9 +60,10 @@ import BsEmpty from '@/components/BsEmpty.vue';
 import UiButton from '@/components/UiButton.vue';
 import { DictOrderStatus } from '@/common/dicts/order';
 import { ApiGetOrderList } from '@/common/api/order';
+import BsPay from '../../components/BsPay.vue';
 
 export default {
-	components: { BsEmpty, UiButton },
+	components: { BsEmpty, UiButton, BsPay },
 	data () {
 		return {
 			tabListData : [
@@ -69,11 +73,14 @@ export default {
 				{key : '4', name : '待收货'},
 				{key : '6', name : '待评价'}
 			],
-			currentTabKey : '-1',
+			currentTabKey : this.$Route.query.tab || '-1',
 			orderListData : [],
 			loadingStatus : 'loading',
 			pageIndex : 1,
-			pageSize : 10
+			pageSize : 10,
+
+			payShow : false,
+			payOrder : null
 		}
 	},
 	onLoad(){
@@ -118,6 +125,13 @@ export default {
 			}
 			this.pageIndex++;
 			this.getOrderList();
+		},
+		/**
+		 * 立即支付
+		 */
+		pay(item){
+			this.payShow = true;
+			this.payOrder = item;
 		}
 	}
 	

pages/order/submit.vue

@@ -2,7 +2,7 @@
  * @Author: ch
  * @Date: 2022-03-20 14:14:53
  * @LastEditors: ch
- * @LastEditTime: 2022-04-19 10:58:00
+ * @LastEditTime: 2022-04-19 14:10:26
  * @Description: file content
 -->
 <template>
@@ -141,7 +141,7 @@ export default {
 				uni.$u.totas(error.message);
 				return false;
 			}
-			this.wxpay(result.orderId);
+			// this.wxpay(result.orderId);
 		},
 		async wxpay(orderId){
 			const {error, result} = await ApiPostWxPay({orderId,payTypeEnum:'WXPAY'});