From fbdc9fd53ce80d89b70184db67258f7b3b3a2ebb Mon Sep 17 00:00:00 2001
From: guoshilong <123456>
Date: Fri, 27 Oct 2023 14:51:58 +0800
Subject: [PATCH] 登录、切换角色
---
subPackage/user/components/roleList.vue | 40 ++++++++++++++++++++++++++++++++--------
1 files changed, 32 insertions(+), 8 deletions(-)
diff --git a/subPackage/user/components/roleList.vue b/subPackage/user/components/roleList.vue
index f484e7f..18d35fa 100644
--- a/subPackage/user/components/roleList.vue
+++ b/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>
\ No newline at end of file
--
Gitblit v1.9.3