adultDeviceApp/components/userLogin.vue

<template>
    <view class="wrapper" v-if="isLogin">
        <view class="popup" @click="onTap">
            <view class="block" @click.stop>
                <view class="item" @click="getUserInfo">
                    <image src="../static/2253.png" class="image1"></image>
                    <view class="text">
                        <view><text></text>体重体脂测量与记录</view>
                        <view><text></text>18项身体数据分析、身体评分</view>
                        <view><text></text>满足所有人群检测</view>
                    </view>
                    <view class="pbtn">立即体验</view>
                </view>
                <icon class="t-icon  t-icon-quxiao image2" @click="onTap"></icon>
            </view>
        </view>
    </view>
</template>

<script>
    import {
        mapState
    } from "vuex";
    export default {
        data() {
            return {}
        },
        props: {
            url: {
                type: String,
                default: ''
            }
        },
        mounted() {},
        computed: {
            ...mapState(["user", "isLogin"]),
        },
        methods: {
            onTap() {
                this.$store.commit("changeUserLogin", false);
            },
            getUserInfo() {
                let that = this
                uni.getUserProfile({
                    desc: '登录',
                    success: (infoRes) => {
                        console.log("getUserProfile授权成功", infoRes, uni.getStorageSync('tenantid'));
                        that.$store.dispatch("getConfig", {
                        	tenantId: uni.getStorageSync('tenantid')
                        })
                        uni.redirectTo({
                            url: `/pageTwo/login/login?name=` + infoRes.userInfo.nickName +
                                "&headimg=" + infoRes.userInfo.avatarUrl + "&url=" + that.url
                        })
                        // that.DecodeEncryptedData(infoRes)
                        that.$store.commit("changeUserLogin", false);
                    },
                    fail: (res) => {
                        console.log("授权失败", res)
                    }
                });
            },
            // 解密
            DecodeEncryptedData(data) {
                let that = this
                that.$model.getDecryptdata({
                    encryptedData: data.encryptedData,
                    iv: data.iv,
                    tenantid: uni.getStorageSync('tenantid'),
                    sessionid: uni.getStorageSync('sessionid'),
                }).then(res => {
                    if (res.code != 0) return
                    uni.redirectTo({
                        url: `/pageTwo/login/login`
                    })
                    console.log("解密成功", res)
                }).catch(e => {
                    console.log("解密失败", e)
                })
            },
        }
    }
</script>

<style scoped lang="scss">
    .wrapper {
        width: 100%;
        height: 100%;
    }

    .popup {
        position: fixed;
        top: 0;
        bottom: 0;
        right: 0;
        left: 0;
        z-index: 99;
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: rgba(0, 0, 0, 0.4);
    }

    .item {
        width: 291px;
        height: 324px;
        position: relative;
        left: 0;
        right: 0;
        top: 0;
        margin: auto;
        bottom: 0;
        padding: 0;
        border-radius: 15px;

        text {
            width: 8px;
            height: 8px;
            background: $greencolor;
            display: inline-block;
            border-radius: 50%;
            margin-right: 5px;
        }

        .image1 {
            width: 291px;
            height: 324px;
        }

        .text {
            position: absolute;
            top: 60%;
            font-size: 12px;
            color: #666;
            line-height: 28px;
            right: 10px;
            left: 30px;
            text-align: left;
        }

    }

    .pbtn {
        background: $btncolor;
        text-align: center;
        border-radius: 10px;
        margin: 5px auto;
        width: 50%;
        color: #fff;
        position: absolute;
        bottom: 10px;
        left: 0;
        right: 0;
        margin: auto;
        padding: 5px 0;
    }

    .image2 {
        width: 30px;
        height: 30px;
        font-size: 30px;
        color: #666;
        background-color: #fff;
        border-radius: 50%;
        position: absolute;
        left: 0;
        right: 0;
        margin: 20px auto;
    }
</style>