<template>
	<view :loading="loading">
		<view class="mine">
			<view class="mine-header" @click="jump('basic')">
				<image mode="aspectFill" class="mine-header-head" :src="userInfo.avatar" v-if="userInfo.avatar" />
				<image mode="aspectFill" class="mine-header-head" src="/static/head.png" v-else />
				<view class="mine-header-name hide-txt">
					<view>{{ userInfo.nickname }}</view>
					<view></view>
					<view class="tag">{{ roleName }}</view>
				</view>
				<image
					src="/static/erweima.png"
					style="height: 50rpx; width: 50rpx; border-radius: 12rpx"
					mode="scaleToFill"
				/>
				<uni-icons type="forward" color="#aaa" size="16"></uni-icons>
			</view>
			<view class="mine-nav" v-if="userInfo.authorities === 'tourist'" @click="jump('upgrade')">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
				<view class="mine-nav-label">角色升级</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<!-- <view class="mine-nav" @click="jump('audit')" v-if="userInfo.authorities === 'app_vip_user'">
                <image mode="aspectFill" class="mine-nav-icon" src="/static/server.png" />
                <view class="mine-nav-label">角色审核</view>
                <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
            </view> -->

			<!-- <view class="mine-nav" @click="jump('user')" v-if="userInfo.authorities === 'app_vip_user'">
                <image mode="aspectFill" class="mine-nav-icon" src="/static/subordinate.png" />
                <view class="mine-nav-label">分享用户列表</view>
                <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
            </view> -->
			<view
				class="mine-nav"
				@click="jump('scan')"
				v-if="userInfo.authorities === 'app_vip_user' || userInfo.authorities === 'engineering_user'"
			>
				<image mode="aspectFill" class="mine-nav-icon" src="/static/scan.png" />
				<view class="mine-nav-label">扫一扫</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<view class="mine-nav" @click="jump('engineering')">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/gongcheng.png" />
				<view class="mine-nav-label">工程管理</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>

			<view class="mine-nav" @click="jump('project')">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/project.png" />
				<view class="mine-nav-label">项目管理</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<view class="mine-nav" @click="jump('feedback')">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/feedback.png" />
				<view class="mine-nav-label">反馈列表</view>
				<uni-badge :text="messageCount.feedBackCount"></uni-badge>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<!-- <view
                class="mine-nav"
                @click="jump('gateway')"
                style="border-bottom: none; box-shadow: 0 4rpx 8rpx #e7e7e74c"
            >
                <image mode="aspectFill" class="mine-nav-icon" src="/static/gateway.png" />
                <view class="mine-nav-label">网关列表</view>
                <uni-icons type="forward" color="#aaa" size="20"></uni-icons>
            </view> -->
			<view class="mine-nav" @click="jump('setupMessage')">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/message4.png" />
				<view class="mine-nav-label">推送通知设置</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<view
				class="mine-nav"
				@click="jump('engineering/setting')"
				v-if="userInfo.authorities === 'engineering_user'"
			>
				<image mode="aspectFill" class="mine-nav-icon" src="/static/like.png" />
				<view class="mine-nav-label">关注工程配置</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<view class="mine-nav" @click="jump('serverSetting')" v-if="userInfo.authorities === 'engineering_user'">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/server2.png" />
				<view class="mine-nav-label">调试内容配置</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<view class="mine-nav" @click="jump('setup')" style="border-bottom: none">
				<image mode="aspectFill" class="mine-nav-icon" src="/static/setup.png" />
				<view class="mine-nav-label">设置</view>
				<uni-icons type="forward" color="#aaa" size="20"></uni-icons>
			</view>
			<uni-popup ref="inputDialog" type="dialog">
				<uni-popup-dialog
					ref="inputClose"
					mode="input"
					title="角色升级"
					placeholder="请输入六位邀请码"
					@confirm="upgrade"
				></uni-popup-dialog>
			</uni-popup>
		</view>
		
		<uni-popup ref="alertDialog" type="dialog">
			<uni-popup-dialog
				style="width: 90%; margin: 5%"
				type="info"
				cancelText="禁止"
				confirmText="允许"
				title="权限说明"
				content='是否允许"灿能物联"使用相机?'
				@confirm="handleScon('camera')"
				@close="dialogClose"
			></uni-popup-dialog>
		</uni-popup>
		<uni-popup ref="message" type="message">
			<uni-popup-message type="info" :duration="0" style="width: 90%; margin: 5%">
				<view style="color: #909399; font-style: 16px">相机权限使用说明:</view>
				<view style="color: #6c6c6c; margin-top: 3rpx; ">　用于相机扫描二维码!</view>
			</uni-popup-message>
		</uni-popup>
		<yk-authpup ref="authpup" type="top" @changeAuth="changeAuth" permissionID="CAMERA"></yk-authpup>

	</view>
</template>

<script>
import { roleUpdate, autoLogin } from '@/common/api/user'
import { transferDevice, shareDevice } from '@/common/api/device'
import ykAuthpup from "@/components/yk-authpup/yk-authpup";
export default {
	    components: {
	        ykAuthpup
	    },
	data() {
		return {
			loading: true,
			userInfo: {},
			messageCount: {},
			timer: null,
		}
	},
	computed: {
		roleName() {
			let roleName = ''
			switch (this.userInfo.authorities) {
				case 'tourist':
					roleName = '游客'
					break
				case 'engineering_user':
					roleName = '工程用户'
					break
				case 'app_vip_user':
					roleName = '正式用户'
					break
				case 'market_user':
					roleName = '营销用户'
					break
				case 'operation_manager':
					roleName = '运维管理员'
					break
			}
			return roleName
		},
	},
	onLoad(options) {
		this.init()
	},
	methods: {
		init() {},
		upgrade(code) {
			console.log(code)
			roleUpdate({
				referralCode: code,
				userId: this.userInfo.userIndex,
			}).then((res) => {
				uni.showToast({
					title: '升级成功',
					icon: 'none',
				})
				uni.removeStorageSync('access_token')
				// 直接登录
				autoLogin(this.userInfo.user_name).then((res) => {
					this.$util.loginSuccess(res.data).then((userInfo) => {
						this.userInfo = userInfo
					})
				})
			})
		},
		  changeAuth(){
		            //这里是权限通过后执行自己的代码逻辑
		            console.log('权限已授权，可执行自己的代码逻辑了');
						// this.handleScon()
						this.handleScon()
		        },
		jump(type) {
			switch (type) {
				case 'scan':
					if (
						plus.os.name == 'Android' 
						// &&					plus.navigator.checkPermission('android.permission.CAMERA') === 'undetermined'
					) {
						//未授权
						// this.$refs.alertDialog.open('bottom')
					 this.$refs['authpup'].open()
					// this.$refs.message.open()
					
					} else {
						console.log(2)
						this.handleScon()
					}

					
					break
				case 'login':
					uni.navigateTo({
						url: `/pages/user/login`,
					})
					break
				case 'gateway':
					uni.navigateTo({
						url: `/pages/gateway/list`,
					})
					break
				case 'upgrade':
					this.$refs.inputDialog.open()
					break
				case 'basic':
					uni.navigateTo({
						url: `/pages/user/basic`,
					})
					break
				case 'project':
					uni.navigateTo({
						url: `/pages/project/list`,
					})
					break
				case 'engineering':
					uni.navigateTo({
						url: `/pages/engineering/list`,
					})
					break
				case 'engineering/setting':
					uni.navigateTo({
						url: `/pages/engineering/setting`,
					})
					break
				case 'feedback':
					uni.navigateTo({
						url: `/pages/message/feedback`,
					})
					break
				default:
					uni.navigateTo({ 
						url: `/pages/mine/${type}`,
					})
					break
			}
		},
		handleScon(){
			this.$refs.message.close()
			uni.scanCode({
			    success: (res) => {
			        console.log('条码类型：' + res.scanType)
			        console.log('条码内容：' + res.result)
			        let content = JSON.parse(res.result)
			        switch (content.type) {
			            case 'transferDevice':
			                this.transferDevice(content.id.split(','))
			                break
			            case 'shareDevice':
			                this.shareDevice(content.id.split(','))
			                break
			            default:
			                this.$util.toast('无效二维码')
			                break
			        }
			    },
			})
		},
		dialogClose(){this.$refs.message.close()},
		transferDevice(id) {
			transferDevice(id).then((res) => {
				uni.navigateTo({ url: '/pages/mine/result?type=transferDevice&id=' + id })
			})
		},
		shareDevice(id) {
			shareDevice(id).then((res) => {
				uni.navigateTo({ url: '/pages/mine/result?type=shareDevice&id=' + id })
			})
		},
	},
	onShow() {
		this.userInfo = uni.getStorageSync(this.$cacheKey.userInfo)
		this.loading = false
		this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
		this.timer = setInterval(() => {
			this.messageCount = uni.getStorageSync(this.$cacheKey.messageCount) || {}
		}, 1000) // 定时请求
	},
	onHide() {
		clearInterval(this.timer)
	},
}
</script>

<style lang="scss">
.mine {
	.mine-header {
		padding: 200rpx 34rpx 34rpx;
		display: flex;
		align-items: center;
		background: $uni-theme-white;
		margin-bottom: 20rpx;
		box-shadow: 0 4rpx 8rpx #e7e7e74c;

		.mine-header-head {
			margin-right: 30rpx;
			height: 128rpx;
			width: 128rpx;
			border-radius: $uni-theme-radius;
			overflow: hidden;
		}

		.mine-header-name {
			margin-right: 30rpx;
			flex: 1;
			font-size: 36rpx;
			color: #111;
			font-weight: 700;

			.tag {
				display: flex;
				align-items: center;
				margin-top: 10rpx;
				font-size: 24rpx;
				color: #aaa;

				.engineering-button {
					margin-left: 10rpx;
					font-size: 24rpx;
					padding: 5rpx 12rpx;
					color: #fff;
					font-weight: 400;
					border-radius: 16rpx;
					background: $uni-theme-color;
				}
			}
		}
	}

	.mine-nav {
		padding: 34rpx;
		display: flex;
		align-items: center;
		background: $uni-theme-white;
		border-bottom: 1rpx solid #e8e8e8;

		&-icon {
			margin-right: 30rpx;
			height: 44rpx;
			width: 44rpx;
			border-radius: $uni-theme-radius;
			overflow: hidden;
		}

		&-label {
			margin-right: 30rpx;
			flex: 1;
			font-size: 28rpx;
			color: #111;
		}
	}
}
/deep/ .uni-popup-message__box {
	border-radius: 10rpx !important;
	background-color: #fff;
}
</style>
</style>
