guoshilong
2023-10-27 fbdc9fd53ce80d89b70184db67258f7b3b3a2ebb
登录、切换角色
8 files modified
2 files added
2 files deleted
1656 ■■■■■ changed files
common/setting.js 2 ●●● patch | view | raw | blame | history
components/tabBar/tabBar.vue 43 ●●●● patch | view | raw | blame | history
http/api.js 36 ●●●● patch | view | raw | blame | history
mixin/loginMixin.js 43 ●●●●● patch | view | raw | blame | history
pages.json 14 ●●●●● patch | view | raw | blame | history
pages/home/index.vue 50 ●●●● patch | view | raw | blame | history
pages/home/patrolIndex.vue 768 ●●●●● patch | view | raw | blame | history
pages/login/login-account.vue 353 ●●●●● patch | view | raw | blame | history
pages/user/center.vue 58 ●●●●● patch | view | raw | blame | history
subPackage/user/components/roleList.vue 40 ●●●● patch | view | raw | blame | history
subPackage/user/role/index.vue 109 ●●●●● patch | view | raw | blame | history
subPackage/user/views/roleSelect.vue 140 ●●●●● patch | view | raw | blame | history
common/setting.js
@@ -10,7 +10,7 @@
    version: '2.0.0',
    // 开发环境接口Url
    // devUrl: 'https://sk.hubeishuiyi.cn',
    devUrl: 'http://172.16.13.129:9528',
    devUrl: 'http://192.168.1.133:9528',
    // 数据中台接口url
    // dataCenterUrl: 'http://10.10.2.192/services',
    dataCenterUrl: 'https://sk.hubeishuiyi.cn/services',
components/tabBar/tabBar.vue
@@ -2,10 +2,7 @@
    <view>
        <u-tabbar class="custom-tabbar" zIndex="100" :value="currentTab" :fixed="true" :active-color="activeColor"
            :inactive-color="inactiveColor" @change='change'>
            <u-tabbar-item v-for="(item,index) in curTabList" :key="index" :text="item.name"
                :badge="item.badge>0?item.badge:0">
                <image class="u-page_item_slot_icon" slot="active-icon" :src="item.iconPathSelected" />
                <image class="u-page_item_slot_icon" slot="inactive-icon" :src="item.iconPath" />
            <u-tabbar-item v-for="(item,index) in curTabList" :icon="item.icon" :key="index" :text="item.name">
            </u-tabbar-item>
        </u-tabbar>
    </view>
@@ -18,29 +15,25 @@
    export default {
        props: {
            currentTab: {},
            tabList: {
                type: Array,
                default: () => []
            }
        },
        data() {
            return {
                inactiveColor: '#909399',
                activeColor: '#328CFA',
                //10分钟
                getMessageTime: 1000 * 60 * 10,
                curTabList: [
                    {
                curTabList: [{
                        name: '首页',
                        iconPathSelected: '',
                        iconPath: '',
                        icon: "home",
                        url: '/pages/home/index'
                    },
                    {
                        name: '个人中心',
                        iconPathSelected: '',
                        iconPath: '',
                        icon: "account-fill",
                        url: '/pages/user/center'
                    }
                ]
@@ -68,8 +61,7 @@
            // this.getMessage()
        },
        destroyed() {
            this.$intv && clearInterval(this.$intv)
            this.$intv = null
        },
        methods: {
            change(e) {
@@ -83,27 +75,6 @@
                    this.$u.func.updateTabbar(res.data)
                })
            },
            getMessage() {
                let params = {
                    recipient: this.userInfo.user_id,
                    status: 0
                }
                messageCount(params).then(res => {
                    this.$u.func.updateTabbar(res.data)
                })
                this.$intv = setInterval(() => {
                    let params = {
                        recipient: this.userInfo.user_id,
                        status: 0
                    }
                    messageCount(params).then(res => {
                        this.$u.func.updateTabbar(res.data)
                    })
                }, this.getMessageTime)
            }
        }
    }
http/api.js
@@ -19,8 +19,9 @@
        config.header['Authorization'] = 'Basic ' + Base64.encode(clientId + ':' + clientSecret);
    }
    if (config.custom.Authorization == true) {
        console.log(config.custom,"==========")
        config.header['Authorization']="Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX25hbWUiOiJBRE1JTiIsIlVzZXJJZCI6IjEiLCJzY29wZSI6WyJhbGwiXSwiVXNlclJlYWxOYW1lIjoi6LaF57qn566h55CG5ZGYIiwiVXNlclh6cWhkbSI6IjQyMDUiLCJleHAiOjI1MTk3NzIwMTAsImp0aSI6ImExNTcxYzk1LTBkNjMtNDkyYi1iOWEyLTE2ZTIzNTQ5ZTY1ZiIsImNsaWVudF9pZCI6InVzZXItc2VydmljZSJ9.ebNVZrw9LbhKaj2w6RR8b2wccQiDkhvBeq79SxxCK-yWiOlIFqBkotTN4TNJg8umcpyYvLILwvqXWRJhffEtgi25sX2y6MqLIWM4kMZ9d8ptdnSmTpBPhltSiQOM0KFa1kl5nSDCBwYOLn-pESJglam76cjpgZNoC88x3iNHacdiXDItY0rtY85HrQ26uyJu9UovKtmYmZRHsIbGMpDta5Q1p4vfaCIr-YUayDrCweZJiQDEEcOSpWJ7O7RMk3pRkX_4UmPHFzrOI2lMp1jQIhxnSTE7EVAz_4z8h8r46muSkpF54Ic4XSawHKqdSLHx8T05LB0MpvOzWMPS6c1uHA"
        console.log(config.custom, "==========")
        config.header['Authorization'] =
            "Bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VyX25hbWUiOiJBRE1JTiIsIlVzZXJJZCI6IjEiLCJzY29wZSI6WyJhbGwiXSwiVXNlclJlYWxOYW1lIjoi6LaF57qn566h55CG5ZGYIiwiVXNlclh6cWhkbSI6IjQyMDUiLCJleHAiOjI1MTk3NzIwMTAsImp0aSI6ImExNTcxYzk1LTBkNjMtNDkyYi1iOWEyLTE2ZTIzNTQ5ZTY1ZiIsImNsaWVudF9pZCI6InVzZXItc2VydmljZSJ9.ebNVZrw9LbhKaj2w6RR8b2wccQiDkhvBeq79SxxCK-yWiOlIFqBkotTN4TNJg8umcpyYvLILwvqXWRJhffEtgi25sX2y6MqLIWM4kMZ9d8ptdnSmTpBPhltSiQOM0KFa1kl5nSDCBwYOLn-pESJglam76cjpgZNoC88x3iNHacdiXDItY0rtY85HrQ26uyJu9UovKtmYmZRHsIbGMpDta5Q1p4vfaCIr-YUayDrCweZJiQDEEcOSpWJ7O7RMk3pRkX_4UmPHFzrOI2lMp1jQIhxnSTE7EVAz_4z8h8r46muSkpF54Ic4XSawHKqdSLHx8T05LB0MpvOzWMPS6c1uHA"
        config.header["Content-Type"] = "application/json";
    }
    if (accessToken) {
@@ -72,35 +73,6 @@
        return response.data
    }
    //对该区域做处理
    if (response.data.resultList && response.data.resultList.length > 0) {
        response.data.resultList = response.data.resultList.map(item => {
            if (item.city_nm && item.city_nm == '恩施土家族苗族自治州') {
                item.city_nm = '恩施州'
            }
            if (item.ad_nm && item.ad_nm == '恩施土家族苗族自治州') {
                item.ad_nm = '恩施州'
            }
            if (item.ad_name && item.ad_name == '恩施土家族苗族自治州') {
                item.ad_name = '恩施州'
            }
            return item
        })
    }
    //对该区域做处理
    if (response.data.data && (response.data.data instanceof Array) && response.data.data.length > 0) {
        response.data.data = response.data.data.map(item => {
            if (item.c_name && item.c_name == '恩施土家族苗族自治州') {
                item.c_name = '恩施州'
            }
            return item
        })
    }
    // 服务端返回的状态码不等于200,则reject()
    if (response.data.code) {
        if (response.data.code !== 200) {
@@ -143,7 +115,7 @@
            success: res => {
                if (res.confirm) {
                    uni.redirectTo({
                        url: `/pages/login/index?redirect=/${currentPage.route}`
                        url: `/pages/login/login-account?redirect=/${currentPage.route}`
                    })
                } else if (res.cancel) {
                    console.log('用户点击取消');
mixin/loginMixin.js
New file
@@ -0,0 +1,43 @@
export default {
    data() {
        return {
            radioGroupValue: '', //当前 radioGroup 选中的值
            radioValue: '', // 当前 radio 的值
            num: 0, //用于区分是否是重复选中
        }
    },
    methods: {
        isPrivacyCheck() {
            if (this.radioValue != "check") {
                uni.showToast({
                    title: "请先同意隐私政策",
                    icon: "none",
                    complete: () => {
                        return false
                    }
                })
            } else {
                return true
            }
        },
        groupChange(n) {
            if (n == this.radioValue && this.num == 0) {
                // 第一次相等即执行以下代码
                this.num++
            } else {
                // 第一次后相等即执行以下代码
                // 置空 radioGroupValue 即取消选中的值
                this.radioGroupValue = ''
                this.radioValue = ''
                // 初始化 num
                this.num = 0
            }
        },
        // 当切换其他选项的时候此方法才会执行
        radioChange(n) {
            this.radioValue = n
            // 切换选项后需要初始化 num
            this.num = 0
        },
    }
}
pages.json
@@ -12,15 +12,6 @@
                "navigationStyle": "custom"
            }
        },
        //巡查首页
        {
            "path": "pages/home/patrolIndex",
            "style": {
                "navigationBarTitleText": "首页",
                "enablePullDownRefresh": true,
                "navigationStyle": "custom"
            }
        },
        {
            "path": "pages/user/center",
            "style": {
@@ -30,7 +21,7 @@
            }
        },
        {
            "path": "pages/login/index",
            "path": "pages/login/login-account",
            "style": {
                // "navigationBarTitleText": "",
                "enablePullDownRefresh": false,
@@ -393,9 +384,6 @@
        "backgroundColor": "#ffffff",
        "list": [{
                "pagePath": "pages/home/index"
            },
            {
                "pagePath": "pages/home/patrolIndex"
            },
            {
                "pagePath": "pages/user/center"
pages/home/index.vue
@@ -1,45 +1,45 @@
<template>
    <view class="container">
        <u-navbar  height="48" bgColor="#5887f9" :autoBack="false" safeAreaInsetTop placeholder>
        <u-navbar height="48" bgColor="#5887f9" :autoBack="false" safeAreaInsetTop placeholder>
            <view slot="left">
                <u--text color="#ffffff" text="基层智治" size="18" />
            </view>
        </u-navbar>
        <view class="main">
            <view class="main-bg">
            </view>
            <view class="main-select">
                <u-icon name="map" color="#fff"></u-icon>
                <view>
                    当前场所:暂无绑定场所信息
                </view>
            </view>
            <view class="main-btn">
            </view>
            <view class="main-phone">
                <view></view>
                <view></view>
                <view></view>
            </view>
            <view class="main-bt">
                <view class="main-live">
                </view>
                <view class="main-taska">
                </view>
            </view>
        </view>
        <tabBar @change='change' :currentTab="0-0" :tabList="tabList"></tabBar>
        <tabBar @change='change' :currentTab="0" :tabList="tabList"></tabBar>
    </view>
</template>
@@ -57,6 +57,10 @@
            }
        },
        onShow() {
            uni.hideTabBar()
        },
        methods: {
            change(index) {
                let url = index
@@ -70,23 +74,23 @@
    .container {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #F9F9FA;
        color: #fff;
        .main {
            position: relative;
            height: 0;
            flex: 1;
            overflow-y: auto;
            .main-bg {
                height: 36%;
                background: royalblue;
            }
            .main-select {
                margin: 0 6%;
                position: absolute;
@@ -94,7 +98,7 @@
                display: flex;
                align-items: center;
            }
            .main-btn {
                margin: 0 6%;
                position: absolute;
@@ -104,32 +108,32 @@
                background: #fff;
                border-radius: 10rpx;
            }
            .main-phone {
                display: flex;
                position: absolute;
                top: 52%;
                width: 100%;
                height: 12%;
                view {
                    margin: 0 16rpx;
                    flex: 1;
                    background: linear-gradient( to right, #407BE9, #73A2F9);
                    background: linear-gradient(to right, #407BE9, #73A2F9);
                    border-radius: 10rpx;
                }
            }
            .main-bt {
                position: absolute;
                top: 66%;
                width: 100%;
                .main-live {
                    height: 180rpx;
                    background: #fff;
                }
                .main-taska {
                    margin-top: 16rpx;
                    height: 240rpx;
pages/home/patrolIndex.vue
File was deleted
pages/login/login-account.vue
New file
@@ -0,0 +1,353 @@
<template>
    <view class="container">
        <view class="logo">
            <!--             <image src="https://sk.hubeishuiyi.cn/business/xcxImg/wxlogo.png" lazy-load show-menu-by-longpress
                style="width: 100rpx;height: 100rpx;"></image> -->
            <view class="title">基层智治</view>
        </view>
        <view class="content">
            <view class="top">
                <u--form labelPosition="top" labelWidth="60" :model="form" :rules="rules" ref="form">
                    <view class="cell">
                        <u-form-item label="账号:" borderBottom ref="phone">
                            <u-input v-model="form.phone" border="none" placeholder="请输入登录账号"></u-input>
                        </u-form-item>
                    </view>
                    <view class="cell">
                        <u-form-item label="密码:" prop="password" borderBottom ref="password">
                            <view style="display: flex; width: 100%;">
                                <!-- #ifdef  MP-WEIXIN -->
                                <u-input v-if="passwordProps.passwordType == 'password'" type="password"
                                    v-model="form.password" border="none" placeholder="请输入密码">
                                </u-input>
                                <u-input v-else type="text" v-model="form.password" border="none" placeholder="请输入密码">
                                </u-input>
                                <u-icon @click="showPassword" :name="passwordProps.passwordIcon" color="#000000"
                                    size="25"></u-icon>
                                <!-- #endif -->
                                <!-- #ifdef APP-PLUS-->
                                <u-input :type="passwordProps.passwordType" v-model="form.password" border="none"
                                    placeholder="请输入密码"></u-input>
                                <u-icon @click="showPassword" :name="passwordProps.passwordIcon" color="#000000"
                                    size="25"></u-icon>
                                <!-- #endif -->
                                <!-- #ifdef H5-->
                                <u-input v-if="passwordProps.passwordType == 'password'" type="password"
                                    v-model="form.password" border="none" placeholder="请输入密码">
                                </u-input>
                                <u-input v-else type="text" v-model="form.password" border="none" placeholder="请输入密码">
                                </u-input>
                                <u-icon @click="showPassword" :name="passwordProps.passwordIcon" color="#000000"
                                    size="25"></u-icon>
                                <!-- #endif -->
                            </view>
                        </u-form-item>
                    </view>
                </u--form>
                <button class="submit" @click="submit" :disabled="disabled">登录</button>
                <view class="page-change">
                </view>
            </view>
        </view>
    </view>
</template>
<script>
    import md5 from '@/utils/md5.js'
    import loginMixin from '@/mixin/loginMixin'
    export default {
        onLoad(option) {
            const {
                redirect
            } = option
            if (redirect) this.redirect = redirect
        },
        mixins: [loginMixin],
        data() {
            return {
                tenantId: '000000',
                form: {
                    phone: "",
                    password: ""
                },
                rules: {
                    'phone': [{
                            type: 'string',
                            required: true,
                            message: '请填写手机号',
                            trigger: ['blur', 'change']
                        },
                        {
                            validator: (rule, value, callback) => {
                                return uni.$u.test.mobile(value);
                            },
                            message: '手机号码不正确',
                            trigger: ['change', 'blur'],
                        }
                    ],
                    'password': {
                        type: 'string',
                        required: true,
                        message: '请输入密码',
                        trigger: ['blur', 'change']
                    }
                },
                disabled: false,
                redirect: '',
                passwordProps: {
                    passwordIcon: "eye-off",
                    passwordType: "password"
                }
            }
        },
        methods: {
            submit() {
                const that = this
                this.$refs.form.validate().then(res => {
                    this.$u.api
                        .token(this.tenantId, this.form.phone, md5(this.form.password))
                        .then(data => {
                            this.$u.func.login(data)
                        })
                        .catch(err => {
                            this.$u.func.showToast({
                                title: err.data.error_description
                            })
                        })
                })
            },
            handleInputCheck() {
                this.disabled = false
            },
            showPassword() {
                this.passwordProps.passwordIcon == "eye-off" ? this.$set(this.passwordProps, "passwordIcon", "eye-fill") :
                    this.$set(this.passwordProps, "passwordIcon", "eye-off")
                this.passwordProps.passwordType == "password" ? this.$set(this.passwordProps, "passwordType", "text") :
                    this.$set(this.passwordProps, "passwordType", "password")
            }
        }
    }
</script>
<style lang="scss">
    .privacy-policy {
        width: 100%;
        padding: 40rpx 40rpx 0 80rpx;
        font-size: 28rpx;
    }
    .container {
        min-height: 100vh;
        overflow: hidden;
        // background: url("https://sk.hubeishuiyi.cn/business/xcxImg/reservoirImg/default.jpg") no-repeat;
        background-size: 100% 100%;
        .set-icon {
            vertical-align: middle;
            width: 41rpx;
            height: auto;
            margin-right: 35rpx;
        }
    }
    .logo {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        padding: 200rpx 0;
        image {
            box-shadow: 4rpx 4rpx 20rpx #fafafa;
        }
        .title {
            margin-top: 40rpx;
            font-weight: 700;
            font-size: 32rpx;
        }
    }
    .content {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        align-items: center;
        // height: 90vh;
        width: 100%;
        .top {
            width: 100%;
            width: 100%;
            background: #fff;
            padding: 20px 0;
            position: fixed;
            bottom: 0px;
        }
        .logo {
            display: block;
            width: 281rpx;
            height: auto;
            margin: 0 auto 120rpx;
        }
        .cell {
            width: 100%;
            padding: 0 85rpx;
            box-sizing: border-box;
            margin-top: 36rpx;
            .name {
                font-size: 22rpx;
                font-family: Source Han Sans CN;
                font-weight: 400;
                color: #3e4a59;
                line-height: 30rpx;
                opacity: 0.72;
            }
            .input-box {
                padding: 30rpx 0;
                border-bottom: 2rpx solid #f6f6f6;
                display: flex;
                align-items: center;
                .code {
                    font-size: 22rpx;
                    font-family: Source Han Sans CN;
                    font-weight: 400;
                    color: #0d0d0d;
                    line-height: 30rpx;
                    text {
                        color: #5f88ff;
                    }
                }
                .ipt {
                    flex: 1;
                    font-size: 24rpx;
                }
                .hold {
                    font-size: 26rpx;
                    font-family: Source Han Sans CN;
                    font-weight: 400;
                    color: #3e4a59;
                    line-height: 30px;
                    opacity: 0.45;
                }
            }
        }
        .agree {
            margin: 27rpx 95rpx 0;
            font-size: 22rpx;
            font-family: Adobe Heiti Std;
            font-weight: normal;
            color: #cacaca;
            line-height: 34rpx;
            .a {
                color: #000000;
            }
        }
        .submit {
            margin: 60rpx 90rpx 0;
            border: none;
            width: 572rpx;
            height: 86rpx;
            line-height: 86rpx;
            box-sizing: border-box;
            border-radius: 15rpx;
            background-color: #5f88ff;
            color: #ffffff;
            &::after {
                content: none;
            }
            &::before {
                content: none;
            }
            &[disabled='true'] {
                background: #e4e4e4;
                font-size: 36rpx;
                font-family: Source Han Sans CN;
                font-weight: 500;
                color: #ffffff;
            }
        }
        .tip {
            margin-top: 30rpx;
            text-align: center;
            font-size: 22rpx;
            font-family: Adobe Heiti Std;
            font-weight: normal;
            color: #cacaca;
            line-height: 34rpx;
        }
        .change {
            margin-top: 20rpx;
            text-align: center;
            font-size: 22rpx;
            font-family: Adobe Heiti Std;
            font-weight: normal;
            color: #5f88ff;
            line-height: 34rpx;
        }
        .tag {
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 22rpx;
            font-family: Adobe Heiti Std;
            font-weight: normal;
            color: #9f9f9f;
            line-height: 34rpx;
            &::before {
                content: '';
                display: block;
                width: 160rpx;
                height: 1px;
                background: #d8d8d8;
                opacity: 0.86;
            }
            &::after {
                content: '';
                display: block;
                width: 160rpx;
                height: 1px;
                background: #d8d8d8;
                opacity: 0.86;
            }
        }
        .chat-arr {
            margin-top: 50rpx;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .icon {
                width: 73rpx;
                height: 73rpx;
            }
        }
        .page-change {
            display: flex;
            justify-content: space-evenly;
        }
    }
</style>
pages/user/center.vue
@@ -1,32 +1,29 @@
<template>
    <view class="container">
        <u-navbar  height="48" bgColor="#5887f9" :autoBack="false" safeAreaInsetTop placeholder>
        <u-navbar height="48" bgColor="#5887f9" :autoBack="false" safeAreaInsetTop placeholder>
            <view slot="left">
                <u--text color="#ffffff" text="基层智治" size="18" />
            </view>
        </u-navbar>
        <view class="main">
            <view class="main-bg">
            </view>
            <view class="main-cell">
                <view class="cell-content">
                    <u-cell-group :border="false">
                        <u-cell :isLink="true"
                        v-for="(item, index) in cellGroupData" :icon="item.icon" :title="item.title"
                        :url="item.url"
                        :key="index"  :border="false"
                        ></u-cell>
                        <u-cell @click="navigator(item)" v-for="(item, index) in cellGroupData" :icon="item.icon"
                            :title="item.title" :key="index" :border="false"></u-cell>
                    </u-cell-group>
                </view>
            </view>
        </view>
        <tabBar @change='change' :currentTab="0-0" :tabList="tabList"></tabBar>
        <tabBar @change='change' :currentTab="1"></tabBar>
    </view>
</template>
@@ -40,9 +37,7 @@
        data() {
            return {
                tabList: uni.getStorageSync("tabBarList") || [],
                cellGroupData: [
                    {
                cellGroupData: [{
                        title: '我的家人',
                        icon: 'account-fill',
                        url: ''
@@ -65,11 +60,32 @@
                ]
            }
        },
        onShow() {
            uni.hideTabBar()
        },
        methods: {
            change(index) {
                let url = index
                this.$u.func.globalNavigator(url, "switchTab")
            },
            navigator(item) {
                if (item.title == '退出登录') {
                    this.logOut()
                } else {
                    this.$u.func.globalNavigator(item.url)
                }
            },
            logOut() {
                uni.setStorageSync("responIndex", 0)
                uni.clearStorageSync()
                uni.reLaunch({
                    url: "/pages/login/login-account"
                })
            },
        }
    }
@@ -79,31 +95,31 @@
    .container {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        background: #F9F9FA;
        .main {
            position: relative;
            height: 0;
            flex: 1;
            overflow-y: auto;
            .main-bg {
                height: 36%;
                background: royalblue;
            }
            .main-cell {
                position: absolute;
                top: 34%;
                width: 100%;
                height: 66%;
                border-radius: 10rpx 10rpx 0 0 ;
                border-radius: 10rpx 10rpx 0 0;
                z-index: 11;
                background: #fff;
                .cell-content {
                    margin-top: 240rpx;
                }
subPackage/user/components/roleList.vue
@@ -1,15 +1,15 @@
<template>
    <view class="role-container">
        <view v-for="(item, index) in roleData">
        <view @click="activeRole(item)" v-for="(item, index) in roleData" :key="index" :class="item.active?'active':''">
            <view class="l">
                <u-icon :name="item.iconName"></u-icon>
                <view class="role-name">
                    {{item.roleName}}
                </view>
            </view>
            <view class="r">
                <u-icon name="checkmark"></u-icon>
            <view v-if="item.active" class="r">
                <u-icon name="checkmark" color="#2979ff"></u-icon>
            </view>
        </view>
    </view>
@@ -22,13 +22,33 @@
                type: Array,
                default: () => []
            }
        }
        },
        data() {
            return {}
        },
        methods: {
            //启用角色
            activeRole(item) {
                this.roleData.forEach(role => {
                    if (role.id == item.id) {
                        role.active = true
                    } else {
                        role.active = false
                    }
                })
                this.$emit("select", item)
            },
        },
    }
</script>
<style lang="scss" scoped>
    .role-container {
        & > view {
        &>view {
            display: flex;
            justify-content: flex-start;
            align-items: center;
@@ -36,16 +56,20 @@
            padding: 0 16rpx;
            background: #fff;
            height: 80rpx;
            .l {
                flex: 1;
                display: flex;
                align-items: center;
                .role-name {
                    margin-left: 16rpx;
                }
            }
        }
    }
    .active {
        background-color: #e8effb !important;
    }
</style>
subPackage/user/role/index.vue
@@ -1,70 +1,85 @@
<template>
    <view class="container">
        <view>
            <role-list :roleData="roleData"></role-list>
            <role-list :roleData="roleData" @select="select"></role-list>
        </view>
        <view class="cur-btn">
            <u-button type="primary" text="确定"></u-button>
            <u-button @click="submit" type="primary" text="确定"></u-button>
        </view>
        <u-loading-page :loading="loading"></u-loading-page>
    </view>
</template>
<script>
    import store from "@/store/index.js"
    import roleList from "@/subPackage/user/components/roleList.vue"
    import {
        dynamicMenu,
        getRoleListByIds,
    } from "@/api/system/role.js"
    export default {
        components: {
            roleList
        },
        data() {
            return {
                cellGroupData: [
                    {
                        title: '我的家人',
                        icon: 'account-fill',
                        url: ''
                    },
                    {
                        title: '切换角色',
                        icon: 'account-fill',
                        url: ''
                    },
                    {
                        title: '修改密码',
                        icon: 'account-fill',
                        url: ''
                    },
                    {
                        title: '退出登录',
                        icon: 'account-fill',
                        url: ''
                    }
                ],
                roleData: [
                    {
                        roleName: '居民',
                        iconName: 'account-fill'
                    },
                    {
                        roleName: '场所负责人',
                        iconName: 'account-fill'
                    },
                    {
                        roleName: '网格员',
                        iconName: 'account-fill'
                    },
                    {
                        roleName: '系统管理员',
                        iconName: 'account-fill'
                    },
                ]
                roleData: [],
                selectRole: {},
                loading: false,
            }
        },
        created() {
            this.getUserRole()
        },
        methods: {
            //获取当前角色的所有权限列表
            async getUserRole() {
                this.loading = !this.loading
                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.activeRoleId ? true : false
                    })
                })
                this.loading = !this.loading
            },
            select(item) {
                this.selectRole = item
            },
            async submit() {
                //保存当前激活的角色
                store.commit("setActiveRoleId", this.selectRole.id)
                //获取角色菜单
                const res = await dynamicMenu(this.selectRole.id)
                //把菜单存入store中
                let data = res.data
                const appMenu = data.filter(e => e.name == 'app')[0]
                console.log("菜单:", appMenu)
                this.$u.func.showToast("切换角色成功")
            }
        }
    }
</script>
@@ -77,7 +92,7 @@
        display: flex;
        flex-direction: column;
        background: #F9F9FA;
        .cur-btn {
            margin: 0 20rpx;
            position: absolute;
subPackage/user/views/roleSelect.vue
File was deleted