zhdt-miniapp/pages/my/index.vue

<template>
    <view>
        <cu-custom class="home-custom" bgColor=".bg-sancolor"
                   bgImage="https://ahwgh.oss-cn-hangzhou.aliyuncs.com/enterprise/64bdccea7bd72.png">
            <block slot="content">个人中心</block>
        </cu-custom>

        <scroll-view scroll-y class="scrollPage">
            <view class="userInfo">
                <view class="userPhoto">
                    <view class="cu-avatar round lg"
                          style="background-image:url('https://ahwgh.oss-cn-hangzhou.aliyuncs.com/enterprise/64bdccd118a88.jpg');">
                        <view class="cu-tag badge bg-orange" v-if="userInfo.person_group != null">
                            <block>{{ userInfo.person_group }}</block>
                        </view>
                    </view>
                </view>
                <view class="content">
                    <view class="text-white">{{ userInfo.name }}</view>
                    <view class="subText padding-top-sm">{{ userInfo.unitId }}</view>
                </view>
            </view>
        </scroll-view>
        <view class="cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius text-xxl">
            <view class="cu-item arrow">
                <navigator class="content" url="/pages/my/modifyUserInfo" hover-class="none">
                    <text class="cuIcon-myfill text-green text-xl"></text>
                    <text class="text-grey">个人信息</text>
                </navigator>
            </view>
            <view class="cu-item arrow">
                <navigator class="content" url="/pages/my/modifyPassword" hover-class="none">
                    <text class="cuIcon-commandfill text-red text-xl"></text>
                    <text class="text-grey">密码修改</text>
                </navigator>
            </view>
            <!-- <view class="cu-item arrow">
                <view class="content" @tap="bendWechat">
                    <text class="cuIcon-weixin text-cyan text-xl"></text>
                    <text class="text-grey">微信绑定</text>
                    <text class="text-grey" style="float: right" v-if="!userInfo.openid">未绑定</text>
                    <text class="text-grey" style="float: right" v-if="!!userInfo.openid">已绑定</text>
                </view>
            </view> -->
        </view>
        <view class="cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg radius text-xxl">
            <view class="cu-item">
                <button class="cu-btn content" @tap="outLogin">
                    <text class="cuIcon-exit text-cyan text-xl"></text>
                    <text class="text-grey">退出登录</text>
                </button>
            </view>
        </view>
    </view>
</template>

<script>
    import {_my} from "./my-model";
    export default {
        data() {
            return {
                userInfo:{}
            };
        },
        created() {
            // this.getRoleName();
            const userInfo = uni.getStorageSync('userInfo');
            if (userInfo) {
                console.log(userInfo);
                this.userInfo = userInfo
            }
        },
        methods: {//微信号绑定
            getRoleName() {
                let role = uni.getStorageSync("role");
                if (role == "") {
                    console.log("未登录");
                } else {
                    console.log("已经登录");
                }
            },

            bendWechat() {
                let _this = this;
                uni.showModal({
                    title: "微信绑定",
                    content: "确定要绑定当前微信么？",
                    cancelText: "取消",
                    confirmText: "确认",
                    success: res => {
                        if (res.confirm) {
                            uni.login({
                                success:res=> {
                                    _my.bandWxOpenid(res.code, res => {
                                        console.log(res);
                                        if (res.code === 200) {
                                            uni.showToast({
                                                icon: "none",
                                                title: "绑定成功",
                                                duration: 1000
                                            });
                                        } else {
                                            this.$msg("绑定失败");
                                        }
                                    });
                                }
                            });
                        }
                    }
                });

            },
            outLogin() {
                uni.showModal({
                    title: "退出登录",
                    content: "确定要退出当前账号么？",
                    cancelText: "取消",
                    confirmText: "退出",
                    success: res => {
						if(res.confirm){
							//uni.clearStorageSync();
							uni.navigateTo({
							    url: "/pages/login/index"
							});
							console.log("全局变量："+wx.getStorageSync('username'));
						}else if(res.cancel){
							console.log("取消退出");
						}
                        
                    }
                });
            }
        }
    };
</script>

<style>
    .iconfont {
        margin-right: 10upx;
        width: 1.6em;
        text-align: center;
    }

    .userInfo {
        background: rgb(73, 182, 75);
        /*border-radius:0,0,100upx,0;*/
        border-bottom-right-radius: 140upx 40upx;
        padding: 40upx;
        display: flex;
    }

    .userPhoto {
        width: 150upx;
        height: 150upx;
        background-color: rgba(255, 255, 255, 0.3);
        border-radius: 50%;
    }

    .cu-avatar.lg {
        margin: 10upx;
        width: 130upx;
        height: 130upx;
    }

    .userInfo .content {
        padding-left: 50upx;
        font-size: 36upx;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    .subText {
        font-size: 30upx;
        color: #d5d5d5;
    }
</style>