From 215c6b3fa61602b4d3256d83063ba5069f9ab480 Mon Sep 17 00:00:00 2001
From: aBin <binbin0314@126.com>
Date: Mon, 19 Jul 2021 18:48:52 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E8=A7=92=E8=89=B2=E6=A0=8F=E6=96=87?=
 =?UTF-8?q?=E5=AD=97=E9=A2=9C=E8=89=B2=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 CHANGELOG.md                   |  1 +
 src/components/Roles/Roles.vue | 31 ++++++++++++++++++++++---------
 2 files changed, 23 insertions(+), 9 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 602cee3..9d99f59 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@
 ### 🎨 代码样式
 范围|描述|commitId
 --|--|--
+ - | 无基本变化 | [21ac4bb](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/21ac4bb)
  - | 组件新建 | [89c0035](https://dd.tall.wiki/gitea/wally/TALL-MUI-3/commits/89c0035)
 
 
diff --git a/src/components/Roles/Roles.vue b/src/components/Roles/Roles.vue
index 42b5e99..87375ba 100644
--- a/src/components/Roles/Roles.vue
+++ b/src/components/Roles/Roles.vue
@@ -3,7 +3,7 @@
  * @email: binbin0314@126.com
  * @Date: 2021-07-19 10:52:05
  * @LastEditors: aBin
- * @LastEditTime: 2021-07-19 18:02:10
+ * @LastEditTime: 2021-07-19 18:42:51
 -->
 <template>
   <view class="wrap">
@@ -26,11 +26,9 @@
             :list="roles"
             @change="handleClickRole"
             class="u-skeleton-rect"
-            :class="'isMine' ? '#f00' : ''"
             name="value"
             ref="tabs"
           >
-            <template slot="name">+++</template>
           </u-tabs>
         </view>
         <u-skeleton :animation="true" :loading="loading" bgcolor="#fff" v-else></u-skeleton>
@@ -45,23 +43,38 @@ export default {
   data() {
     return {
       roles: [
-        { id: 1, value: '项目经理', isMine: 0 },
-        { id: 2, value: '运维', isMine: 0 },
-        { id: 3, value: '导师一', isMine: 1 },
-        { id: 4, value: '导师二', isMine: 1 },
-        { id: 5, value: '导师三', isMine: 1 },
+        { id: 1, value: '项目经理', isMine: false },
+        { id: 2, value: '运维', isMine: true },
+        { id: 3, value: '导师一', isMine: false },
+        { id: 4, value: '导师二', isMine: true },
+        { id: 5, value: '导师三', isMine: true },
       ],
       currentRoleIndex: 0,
       barWidth: 80,
-
       loading: false, // 是否显示骨架屏组件
     };
   },
+  mounted() {
+    this.getItem();
+  },
   methods: {
     handleClickRole(index) {
+      this.getItem();
       console.log('index: ', index);
       this.currentRoleIndex = index;
     },
+    getItem() {
+      var dom = document.getElementsByClassName('u-tab-item');
+      for (let i = 0; i < dom.length; i++) {
+        let id = dom[i].id;
+        for (let k = 0; k < this.roles.length; k++) {
+          let item = this.roles[k];
+          if (dom[i].textContent === item.value && item.isMine) {
+            document.getElementById(`${id}`).style.color = 'red';
+          }
+        }
+      }
+    },
   },
 };
 </script>