<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')" v-if="userInfo.authorities !== 'tourist'">
                <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')" v-if="userInfo.authorities !== 'tourist'">
                <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')" v-if="userInfo.authorities !== 'tourist'">
                <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')" v-if="userInfo.authorities !== 'tourist'">
                <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' || userInfo.authorities == 'operation_manager'"
            >
                <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('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({
                // onlyFromCamera: false,
                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>
