修改用户头像

api/me/me.js

@@ -2,24 +2,33 @@ import request from '@/utils/request'
 
 // 获取当前积分
 export function getScore(userId) {
-  return request({
-    url: '/score/getScore?userId='+userId,
-    method: 'get'
-  })
+	return request({
+		url: '/score/getScore?userId=' + userId,
+		method: 'get'
+	})
 }
 
-export function getUserInfo(userId){
+export function getUserInfo(userId) {
 	return request({
-		url: '/system/user/getWxUserInfo/'+userId,
+		url: '/system/user/getWxUserInfo/' + userId,
 		method: 'get'
 	})
 }
 
 // 获取我的付费知识
 export function myPayKnow(query) {
-  return request({
-    url: '/knowledge/base/knowledgePayList',
-    method: 'get',
-	data:query
-  })
+	return request({
+		url: '/knowledge/base/knowledgePayList',
+		method: 'get',
+		data: query
+	})
 }
+
+//上传头像
+export function uploadHeadImg(data) {
+	return request({
+		url: '/system/user/updateWxUserInfo',
+		method: 'get',
+		data: data
+	})
+}

pages.json

@@ -417,6 +417,15 @@
 				"navigationBarTitleText": "积分流水"
 			}
 		},
+        {
+          "path": "pages/me/myImg/myImg",
+          "style": {
+            "usingComponents": {},
+            "navigationBarBackgroundColor": "#07c160",
+            "navigationBarTextStyle": "white",
+            "navigationBarTitleText": "更换头像"
+          }
+        },
 		{
 			"path": "pages/handleAffairs/gridQuery/gridQuery",
 			"style": {

pages/me/me.vue

@@ -2,121 +2,143 @@
 	<!-- pages/me.wxml -->
 	<view class="uni-container">
 		<view class="uni-header-logo">
-			<img class="uni-header-image" :src="initInfo.headImg == null || initInfo.headImg == '' ? 'http://116.142.80.12:9000/10_03.png' : initInfo.headImg" />
-			<span>{{initInfo.name == null || initInfo.name == '' ? initInfo.wechatName : initInfo.name}}</span>
-			<text>{{initInfo.scoreNum}}</text>
+			<img
+				@headImg="uploadHeadImg"
+				@click="updateImg"
+				class="uni-header-image"
+				:src="initInfo.headImg == null || initInfo.headImg == '' ? initImgPath : loadImgSrc(initInfo.headImg)"
+			/>
+			<span>{{ initInfo.name == null || initInfo.name == '' ? initInfo.wechatName : initInfo.name }}</span>
+			<text>{{ initInfo.scoreNum }}</text>
 		</view>
 		<view class="uni-panel" v-for="(item, index) in list" :key="item.id">
 			<view class="uni-panel-h" :class="item.open ? 'uni-panel-h-on' : ''" @click="goDetailPage(item.id)">
-				<text class="uni-panel-text">{{item.name}}</text>
-				<text class="uni-panel-icon uni-icon" :class="item.open ? 'uni-panel-icon-on' : ''">{{item.pages ? '&#xe581;' : '&#xe470;'}}</text>
+				<text class="uni-panel-text">{{ item.name }}</text>
+				<text class="uni-panel-icon uni-icon" :class="item.open ? 'uni-panel-icon-on' : ''">{{ item.pages ? '&#xe581;' : '&#xe470;' }}</text>
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-import {getScore, getUserInfo} from '@/api/me/me.js'
-// pages/me.js
+import { getScore, getUserInfo, uploadHeadImg } from '@/api/me/me.js';
+import { getToken } from '@/utils/auth';
 export default {
 	data() {
 		return {
-			initInfo:{
-				userId: null,
+			headers: {
+				Authorization: 'Bearer ' + getToken()
+			},
+			initImgPath: 'http://116.142.80.12:9000/10_03.png',
+			initInfo: {
+				id: getApp().globalData.userId,
 				scoreNum: 0,
-				wechatName: "微信用户",
+				wechatName: '微信用户',
 				name: null,
-				headImg: null,
+				headImg: null
 			},
 			list: [
 				{
-					id: 'me/meOperate/meOperate',//id是文件路径
+					id: 'me/meOperate/meOperate', //id是文件路径
 					name: '我的积分流水',
-					open: false,
+					open: false
 				},
 				{
 					id: 'wenba/wenba',
 					name: '我的问答',
-					open: false,
+					open: false
 				},
 				{
 					id: 'me/nameAuthentication/nameAuthentication',
 					name: '实名认证',
-					open: false,
+					open: false
 				},
 				{
 					id: 'me/officialAuthentication/officialAuthentication',
 					name: '官方认证',
-					open: false,
+					open: false
 				},
 				{
 					id: 'matters/matters',
 					name: '我的事项',
-					open: false,
+					open: false
 				},
 				{
 					id: 'me/myPayKnow/myPayKnow',
 					name: '我的付费知识',
-					open: false,
+					open: false
 				}
-			]
+			],
 		};
 	},
 	/**
-	 * 生命周期函数--监听页面加载
-	 */ onLoad(options) {},
-	/**
 	 * 生命周期函数--监听页面初次渲染完成
 	 */
 	onReady() {
-		this.userId = getApp().globalData.userId
-		this.getUserInfoByUserId(this.userId)
-		this.getScoreForMe(this.userId)
+		this.getUserInfoByUserId(this.initInfo.id);
+		this.getScoreForMe(this.initInfo.id);
 	},
-	/**
-	 * 生命周期函数--监听页面显示
-	 */
-	onShow() {},
-	/**
-	 * 生命周期函数--监听页面隐藏
-	 */
-	onHide() {},
-	/**
-	 * 生命周期函数--监听页面卸载
-	 */
-	onUnload() {},
-	/**
-	 * 页面相关事件处理函数--监听用户下拉动作
-	 */
-	onPullDownRefresh() {},
-	/**
-	 * 页面上拉触底事件的处理函数
-	 */
-	onReachBottom() {},
-	/**
-	 * 用户点击右上角分享
-	 */
-	onShareAppMessage() {},
 	methods: {
 		goDetailPage(e) {
-				const url = '/pages/' + e
-				uni.navigateTo({
-					url: url
-				})
+			const url = '/pages/' + e;
+			uni.navigateTo({
+				url: url
+			});
 		},
 		//获取用户信息：用户名称：头像
-		getUserInfoByUserId(userId){
-			getUserInfo(userId).then(res =>{
+		getUserInfoByUserId(userId) {
+			console.log(userId)
+			getUserInfo(userId).then((res) => {
 				this.initInfo.wechatName = res.data.wechatName;
 				this.initInfo.name = res.data.name;
 				this.initInfo.headImg = res.data.headImg;
-			})
+			});
 		},
 		//获取当前积分
-		getScoreForMe(userId){
-			getScore(this.userId).then(res =>{
-				this.initInfo.scoreNum = res.data.scoreNum
-			})
+		getScoreForMe(userId) {
+			console.log(userId)
+			getScore(userId).then((res) => {
+				this.initInfo.scoreNum = res.data.scoreNum;
+			});
+		},
+		updateImg() {
+			let _this = this;
+			uni.chooseImage({
+				success(resp) {
+					uni.uploadFile({
+						url: _this.$HTTP + `/common/upload`,
+						filePath: resp.tempFilePaths[0],
+						name: 'file',
+						formData: {},
+						header: _this.headers,
+						success: (res) => {
+							// 判断是否json字符串，将其转为json格式
+							let data = JSON.parse(res.data);
+							if (![200].includes(data.code)) {
+								_this.$modal.msg(data.msg);
+							} else {
+								_this.initInfo.headImg = data.fileName;
+								_this.uploadImg();
+								_this.$modal.msg('更新成功');
+							}
+						},
+						fail: (e) => {
+							debugger;
+							console.log(e);
+							_this.$modal.msg('上传失败！');
+						}
+					});
+				}
+			});
+		},
+		uploadImg(){
+			//更新数据库
+			uploadHeadImg(this.initInfo).then((res) => {
+				console.log(res);
+				if (res.code === 200) {
+					console.log(this.initInfo)
+				}
+			});
 		}
 	}
 };