/** * 我的 */ <template> <view class="mine"> <TabBar></TabBar> <view class="image-area"> <u-avatar :src="img" size='80'></u-avatar> </view> <view class="title">我的账号</view> <view class="content" v-for="item in list" :key="item.id"> <text class="title">{{item.name}}</text> <text class="value">{{item.value}}</text> </view> <view class="title">账号设置</view> <button class="changeImg" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">修改图片</button> </view> </template> <script> import TabBar from '@/components/tabBar/tabBar.vue'; import { updateImg } from '@/api/mine.js'; export default { components: { TabBar, }, data() { return { img: '', //头像 list: [ { id: 'number', name: '员工号', value: '111' }, { id: 'name', name: '员工姓名', value: '张三' }, { id: 'type', name: '员工类型', value: '111' }, { id: 'phone', name: '手机号', value: '111' }, ] } }, onLoad() { // this.img = 'wxfile://tmp_ef02bac4f6814fd602e24627ad9face0.jpg'; // console.log(this.img); }, onShow() { let pages = getCurrentPages() const curPage = pages[pages.length - 1] this.currentPagePath = curPage.route uni.setStorageSync('currentPagePath', this.currentPagePath) }, methods: { onChooseAvatar(e) { this.img = e.detail.avatarUrl; //此处应该得到uid // updateImg(this.img, uid); //在此,调一个接口把头像信息存上 } }, } </script> <style scoped lang="scss"> .mine { padding: 52rpx; .image-area { display: flex; justify-content: center; align-items: center; margin-bottom: 100rpx; } .title { font-size: 38rpx; font-weight: 600; margin: 30rpx 0; } .changeImg { background-color: #fff; border-color: #fff; color: #c5000a; // margin-top: 120rpx; font-size: 32rpx; font-weight: 600; } .content { display: flex; flex-direction: row; justify-content: space-between; align-items: center; font-size: 34rpx; font-weight: 400; .title { font-size: 34rpx; font-weight: 400; } } } </style> <style lang="scss"> .mine { .button { justify-content: center !important; background-color: #fff !important; border-color: #fff !important; color: #c5000a !important; // margin-top: 120rpx; font-weight: 600; } } </style>