swdzCamera/pages/my/index.vue

<template>
	<view class="">
		<navBar title="我的" flex="cen" :navImg="navImg" :back="false" color="#333333" background="#FFFFFF" />
		<view class="container">
			<view class="userInfo">
				<u-avatar size='80' mode="aspectFill" :src="userInfo.head"
					@click="previewImg([userInfo.head], 0)"></u-avatar>

				<view class="nickname" v-if="!token" @click="login">
					点击登录
				</view>

				<view class="nickname" v-else>
					<view class="top">
						{{userInfo.nickname?userInfo.nickname:"默认用户"}}
					</view>
					<view class="createAvatar" @click="updateAvatar">
						制作数字分身
					</view>
				</view>
				<view class="" v-if="token" style="margin-left: 50px;" @click="logout">
					<u-icon name="setting-fill" size='30'></u-icon>
				</view>
			</view>
			<u-subsection :list="list" :current="curNow" activeColor="orange" fontSize="16"
				@change="sectionChange"></u-subsection>



			<!-- <swiper :current="curNow" :disable-touch="true" :disable-swipe="true" @change="swiperChange">
				<swiper-item> -->
			<view class="cenList" v-if="picList.length">
				<view class="swiper">
					<view class="xiezhenBox" v-for="(item,index) in picList">
						<view class="label">
							任务{{item.task_id}}
						</view>
						<view class="picList" v-if="item.state">
							<view class="resImg" v-for="(item1,index1) in item.images">
								<image :src="item1" mode="aspectFill" @click="previewImg(item.images, index1)">
								</image>
							</view>
						</view>

						<view class="picList" v-else>
							<view class="wait">
								<image src="/static/images/loading2.gif" mode="aspectFill">
								</image>
								<view class="txt">
									图片生成中(预计20分钟左右生成)...
								</view>
							</view>
						</view>
					</view>
					<u-loadmore :status="status" v-if="picList.length!=0" />
				</view>
			</view>
			<view class="" v-else style="margin-top: 100rpx;">
				<u-empty mode="data" text="暂无数据" icon="../../../../static/empty.png">
				</u-empty>
			</view>
			<!-- 	</swiper-item>
				<swiper-item>

					tab2
				</swiper-item>
			</swiper> -->


			<!-- <u-tabbar activeColor="orange" :value="value" :placeholder="false" @change="" :fixed="false"
				:safeAreaInsetBottom="false">
				<u-tabbar-item @click="toGenPic" text="首页" icon="home"></u-tabbar-item>
				<u-tabbar-item text="我的" icon="account"></u-tabbar-item>
			</u-tabbar> -->
		</view>
	</view>
</template>

<script>
	import {
		wxAuthLoginReq,

		taskList,
		getUserInfo
	} from '@/api/genPic/index.js'
	export default {
		data() {
			return {
				value: 1,
				status: 'nomore',
				// list: ['我的写真', '我的喜欢'],
				list: ['我的写真'],
				curNow: 0,

				userInfo: uni.getStorageSync('userInfo'),

				token: uni.getStorageSync('token'),

				picList: []
			}
		},
		components: {
			// tabCom
		},
		async onShow() {
			this.getTaskList()
			let res = await getUserInfo()

			console.log('用户信息返回值：', res);
			if (res.code == 0) {
				this.userInfo = res.data
				uni.setStorageSync('userInfo', res.data)

			}

		},
		onShareAppMessage(params) {
			if (params.from === 'button' || params.from === 'menu') {
				return {
					title: '思维定制相机-我的',
					imageUrl: '',
					path: '/pages/my/index',
					mpId: this.$appId,
					type: this.$shareType,
				}
			}
		},
		computed: {

		},
		methods: {
			logout() {
				let _this = this
				uni.showModal({
					title: '确定退出登录?',
					showCancel: true,
					cancelColor: '#999',
					confirmColor: '#F7790C',
					success: function(res) {
						if (res.confirm) {
							uni.clearStorageSync()
							_this.$toast('退出登录成功')
							setTimeout(() => {
								uni.reLaunch({
									url: '/pages/my/index'
								})
							}, 1500)
						} else if (res.cancel) {
							console.log('用户点击取消');
						}

					},
					fail: function(res) {

					}
				})
			},

			toSet() {
				uni.navigateTo({
					url: '/pages/set/index'
				})
			},

			//点击预览图片
			previewImg(list, index) {
				uni.previewImage({
					current: index,
					urls: list, //存放图片的数组
					loop: true,
					indicator: 'default'
				})
			},

			updateAvatar() {
				uni.navigateTo({
					url: '/pages/genDigitalFenshen/index'
				})
			},
			async getTaskList() {
				let res = await taskList()
				if (res.code == 0) {
					this.picList = res.data.reverse()
					console.log('任务列表返回值：', res, this.picList);
				} else {
					this.$toast(res.message)
				}
			},
			sectionChange(index) {
				this.curNow = index;
			},

			swiperChange(e) {
				// this.curNow = e.detail.current
			},
			toGenPic() {
				uni.navigateTo({
					url: '/pages/selAndGenPage/index'
				})
			},
			toMyPage() {
				uni.navigateTo({
					url: '/pages/my/index'
				})
			},
			login() {
				let _this = this
				uni.showLoading({
					title: '登录中...'
				})
				uni.login({
					provider: 'weixin',
					success: async (res) => {
						if (res.errMsg == 'login:ok') {
							let parmas = {
								code: res.code,
							}
							console.log('登录所传的parmas参数:', parmas);
							let res1 = await wxAuthLoginReq(parmas)
							if (res1.code == 0) {

								_this.userInfo = res1.data.user_info

								console.log('登录返回的用户信息：', _this.userInfo);
								uni.hideLoading()
								uni.setStorageSync('token', res1.data.token)
								uni.setStorageSync('userInfo', res1.data.user_info)
								_this.$toast('登录成功')

								setTimeout(() => {
									uni.reLaunch({
										url: '/pages/my/index'
									})
								}, 1500)
							} else {
								uni.showToast({
									title: res1.message,
									icon: 'none'
								})
							}
						}
					}
				});
			},

		}
	}
</script>

<style lang="scss" scoped>
	@import "./index.scss";
</style>