个人中心修改，切换角色页面修改

Lou

2023-11-03 27305a2f07a7dbbec173908e4a16c543b56281c9

个人中心修改，切换角色页面修改

 pages/home/index.vue

@@ -7,7 +7,7 @@
                <view class="top-text f-30 fw">{{curSelectSite.name?curSelectSite.name:'暂无绑定' +roleTypeName+'信息'}}

                </view>

                <u-icon name="/static/icon/change-icon.png"></u-icon>

                </view>

            </view>

        </u-navbar>

        <view class="content">

            <view class="swiper">

@@ -576,6 +576,7 @@
<style lang="scss" scoped>

    .top {

        width: 530rpx;



        .top-text {

            max-width: 85%;

            margin-right: 20rpx;


 pages/user/center.vue

@@ -1,10 +1,15 @@
<template>
    <view class="">
        <view class="header flex a-i-c">
            <u-avatar  size="80"></u-avatar>
            <view class="flex f-d-c ml-20">
                <text class="f-36 mb-20 fw">张三</text>
                <text class="f-28 c-99">您好业主，欢迎回家</text>
            <u-avatar :src="userInfo.avatar"  size="80"></u-avatar>
            <view class="flex f-d-c ml-20"  v-if="isLogin">
                <text class="f-36 mb-20 fw"  v-if="userInfo.nick_name">{{userInfo.nick_name}}</text>
                <text class="f-36 mb-20 fw"  v-else>{{userInfo.user_name}}</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
            </view>
            <view class="flex f-d-c ml-20"  v-if="!isLogin">
                <text class="f-36 mb-20 fw">未登录</text>
                <!-- <text class="f-28 c-99">您好业主，欢迎回家</text> -->
            </view>
        </view>
        
@@ -47,10 +52,17 @@
                        title:"退出登录",
                        url:""
                    },
					
                ]
                ],
                // userInfo:{}
            }
        },
		
        onShow() {
			
			
        },
		
		
        methods:{
            change(index) {
                let url = index

 static/icon/user-01.png

 static/icon/user-02.png

 static/icon/user-03.png

 static/img/login-bg.png

 subPackage/user/components/roleList.vue

@@ -2,13 +2,16 @@
    <view class="role-container">
        <view @click="enableRole(item)" v-for="(item, index) in roleData" :key="index" :class="item.active?'active':''">
            <view class="l">
                <u-icon :name="item.iconName"></u-icon>
                <u-icon :name="item.icon"   width="80rpx"  height="80rpx"></u-icon>
                <view class="role-name">
                    {{item.roleName}}
                </view>
            </view>

            <view v-if="item.active" class="r">
            <!-- <view v-if="item.active" class="r">
                <u-icon name="checkmark" color="#2979ff"></u-icon>
            </view> -->
            <view v-if="item.id == currentId" class="r">
                <u-icon name="checkmark" color="#2979ff"></u-icon>
            </view>
        </view>
@@ -21,8 +24,12 @@
            roleData: {
                type: Array,
                default: () => []
            },
            currentId:{
                type:[Number,String]
            }
        },
		
        data() {
            return {}
        },
@@ -52,11 +59,9 @@
            display: flex;
            justify-content: flex-start;
            align-items: center;
            margin-top: 16rpx;
            padding: 0 16rpx;
            background: #fff;
            height: 80rpx;

            margin:0 30rpx;
            padding:30rpx 0;
            border-bottom:1px solid #F5F5F5;
            .l {
                flex: 1;
                display: flex;

 subPackage/user/role/index.vue

@@ -1,10 +1,10 @@
<template>
    <view class="container">
        <view>
            <role-list :roleData="roleData" @select="select"></role-list>
            <role-list :roleData="roleData"  :current-id="selectRole.id"  @select="select"></role-list>
        </view>

        <view class="cur-btn">
        <view class="cur-btn"  v-if="roleData.length">
            <u-button @click="submit" type="primary" text="确定"></u-button>
        </view>

@@ -45,18 +45,27 @@
                const res = await getRoleListByIds({
                    roleIds: this.userInfo.role_id
                })
                this.roleData = []
                let data = res.data
                console.log(data)
                data.forEach(e => {
                    this.roleData.push({
                        id: e.id,
                        iconName: 'account-fill',
                        roleName: e.roleName,
                        active: e.id == this.selectRole.id ? true : false
                    })
                data.forEach(item => {
                    if(item.roleName == "居民"){
                        item.icon = "/static/icon/user-01.png"
                    }else if (item.roleName == "场所负责人"){
                        item.icon = "/static/icon/user-02.png"
                    }else {
                        item.icon = "/static/icon/user-03.png"
                    } 
					
					
                    // this.roleData.push({
                    //     id: e.id,
                    //     iconName: 'account-fill',
                    //     roleName: e.roleName,
                    //     active: e.id == this.selectRole.id ? true : false
                    // })
                })

				
                this.roleData = data;
                this.loading = !this.loading

            },
@@ -107,7 +116,7 @@
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #F9F9FA;
        // background: #F9F9FA;

        
    }