sooka_consult_uniapp/pages/me/me.vue

<template>
	<!-- pages/me.wxml -->
	<view class="uni-container">
		<view class="uni-header-logo">
			<img
				@headImg="uploadHeadImg"
				@click="updateImg"
				class="uni-header-image"
				:src="initInfo.headImg == null || initInfo.headImg == '' ? initImgPath : loadImgSrcLocalhost(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>
			</view>
		</view>
	</view>
</template>

<script>
import { getScore, getUserInfo, uploadHeadImg } from '@/api/me/me.js';
import { getToken } from '@/utils/auth';
export default {
	data() {
		return {
			headers: {
				Authorization: 'Bearer ' + getToken()
			},
			initImgPath: 'http://116.142.80.12:9000/10_03.png',
			initInfo: {
				id: getApp().globalData.userId,
				scoreNum: 0,
				wechatName: '微信用户',
				name: null,
				headImg: null
			},
			list: [
				{
					id: 'me/meOperate/meOperate', //id是文件路径
					name: '我的积分流水',
					open: false
				},
				{
					id: 'demo/wenba/wenba',
					name: '我的问答',
					open: false
				},
				{
					id: 'me/nameAuthentication/nameAuthentication',
					name: '实名认证',
					open: false
				},
				{
					id: 'me/officialAuthentication/officialAuthentication',
					name: '官方认证',
					open: false
				},
				{
					id: 'matters/matters',
					name: '我的事项',
					open: false
				},
				{
					id: 'me/myPayKnow/myPayKnow',
					name: '我的付费知识',
					open: false
				}
			],
		};
	},
	/**
	 * 生命周期函数--监听页面初次渲染完成
	 */
	onReady() {
		this.getUserInfoByUserId(this.initInfo.id);
		this.getScoreForMe(this.initInfo.id);
	},
	methods: {
		goDetailPage(e) {
			const url = '/pages/' + e;
			uni.navigateTo({
				url: url
			});
		},
		//获取用户信息：用户名称：头像
		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) {
			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)
				}
			});
		}
	}
};
</script>
<style>
@import './me.css';
</style>