From 2b70ff5a09dcefc959bfe85ec6c7bebe37c43a5b Mon Sep 17 00:00:00 2001
From: aBin <binbin0314@126.com>
Date: Tue, 12 Oct 2021 17:25:11 +0800
Subject: [PATCH] =?UTF-8?q?perf:=20=E8=A7=92=E8=89=B2=E6=A0=8F=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=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/Experience/Experience.vue |  3 +-
 src/components/Globals/Globals.vue       |  2 +-
 src/components/Roles/Roles.vue           | 93 +++++++++++++++++++-----
 src/pages/project/project.vue            |  4 +-
 5 files changed, 82 insertions(+), 21 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 276380f..cbdbe1b 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -136,6 +136,7 @@
  - | 平车演示临时去掉项目快捷方式的toast提示 | [e0b2c23](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/e0b2c23)
  - | 切换到默认项目角色没有激活状态的bug | [438d448](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/438d448)
  - | 切换日历时查询小红点 | [7091789](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/7091789)
+ - | 请求到任务时,自动滚动功能修改 | [a1e0742](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/a1e0742)
  - | 全局任务点击时保存角色id到本地 | [e1a17c5](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/e1a17c5)
  - | 任务开始时间延迟插件 | [992a313](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/992a313)
  - | 日常任务插件遍历时的key值修改 | [cd26285](https://dd.tall.wiki/gitea/wally/tall-mui-3-project/commits/cd26285)
diff --git a/src/components/Experience/Experience.vue b/src/components/Experience/Experience.vue
index b2ed4be..fb66b30 100644
--- a/src/components/Experience/Experience.vue
+++ b/src/components/Experience/Experience.vue
@@ -28,7 +28,8 @@ export default {
   watch: {
     visibleRoles(val) {
       if (val && val.length) {
-        this.roles = [...this.visibleRoles, ...this.invisibleRoles];
+        this.roles = [...this.visibleRoles];
+        // this.roles = [...this.visibleRoles, ...this.invisibleRoles];
       }
     },
   },
diff --git a/src/components/Globals/Globals.vue b/src/components/Globals/Globals.vue
index 68b5acf..630a634 100644
--- a/src/components/Globals/Globals.vue
+++ b/src/components/Globals/Globals.vue
@@ -64,7 +64,7 @@ export default {
     ...mapGetters('task', ['globals']),
 
     globalsHeight: function () {
-      let h = ((this.sysHeight - 44 - 30 - 10) / 5) * 3;
+      let h = ((this.sysHeight - 44 - 30 - 10) / 3) * 3;
       return h;
     },
   },
diff --git a/src/components/Roles/Roles.vue b/src/components/Roles/Roles.vue
index 8731662..4700e54 100644
--- a/src/components/Roles/Roles.vue
+++ b/src/components/Roles/Roles.vue
@@ -8,26 +8,50 @@
             default-tab-item 是 我的角色 && 当前不展示
             tab-choice 不是我的 && 当前展示
           -->
-          <template v-for="(item, index) in roles">
-            <view
-              :class="{
-                'default-tab-choice': item.mine == 1 && roleId === item.id,
-                'default-tab-item': item.mine == 1 && roleId !== item.id,
-                'tab-choice': item.mine == 0 && roleId === item.id,
-              }"
-              :key="index"
-              @click="changeRole(item.id, index)"
-              class="tab-item"
-              v-if="item.id === roleId"
-            >
-              <view class="tab-children u-skeleton-fillet u-font-14">
-                {{ item.name }}
+          <div class="flex flex-1">
+            <template v-for="(item, index) in roles">
+              <view
+                :class="{
+                  'default-tab-choice': item.mine == 1 && roleId === item.id,
+                  'default-tab-item': item.mine == 1 && roleId !== item.id,
+                  'tab-choice': item.mine == 0 && roleId === item.id,
+                }"
+                :key="index"
+                @click="changeRole(item.id, index)"
+                class="tab-item"
+              >
+                <view class="tab-children u-skeleton-fillet u-font-14">
+                  {{ item.name }}
+                </view>
               </view>
-            </view>
-          </template>
+            </template>
+          </div>
+          <u-icon
+            name="arrow-down"
+            color="#2979ff"
+            size="28"
+            type="down"
+            v-if="invisibleRoles.length"
+            :style="{ transform: `rotate(${isActive ? 0 : 180}deg)` }"
+            @click="isActive = !isActive"
+            style="transition: transform 0.24s; margin-right: 0px"
+          />
         </view>
       </scroll-view>
     </view>
+    <view :style="{ height: isActive ? '100px' : 0 }" style="transition: all 0.24s" class="role-more-box">
+      <template v-for="(roleItem, roleIndex) in allRoles">
+        <u-tag
+          :type="roleId === roleItem.id ? 'primary' : 'info'"
+          v-if="roleItem.name !== '平车'"
+          class="m-3"
+          :key="roleItem.id"
+          :text="roleItem.name"
+          mode="light"
+          @click="changeRole(roleItem.id, roleIndex)"
+        />
+      </template>
+    </view>
     <!-- 骨架屏 -->
     <u-skeleton :animation="true" :loading="loading" bg-color="#fff"></u-skeleton>
   </view>
@@ -48,7 +72,9 @@ export default {
         { id: 1, name: '项目经理', mine: 0, pm: 1, sequence: 1 },
         { id: 2, name: '运维', mine: 0, pm: 0, sequence: 2 },
       ],
+      allRoles: [],
       roleLeft: 0,
+      isActive: false,
     };
   },
 
@@ -60,10 +86,30 @@ export default {
   watch: {
     visibleRoles(val) {
       if (val && val.length) {
-        this.roles = [...this.visibleRoles, ...this.invisibleRoles];
+        // this.roles = [...this.visibleRoles, ...this.invisibleRoles];
+        this.roles = [...this.visibleRoles];
+        this.allRoles = [...this.visibleRoles, ...this.invisibleRoles];
         this.loading = false;
       }
     },
+    roleId(val) {
+      let list = [...this.allRoles];
+      let newRoleList = [...this.roles];
+      let newList = [];
+      for (var i = 0; i < list.length; i++) {
+        if (val === list[i].id && list[i].name !== '平车') {
+          newList.push(list[i]);
+          newRoleList[0] = list[i];
+          list.splice(i, 1);
+          break;
+        }
+      }
+      for (var j = 0; j < list.length; j++) {
+        newList.push(list[j]);
+      }
+      this.roles = [...newRoleList];
+      this.allRoles = [...newList];
+    },
   },
 
   mounted() {
@@ -71,6 +117,7 @@ export default {
       this.loading = true;
     } else {
       this.roles = [...this.visibleRoles];
+      this.allRoles = [...this.visibleRoles, ...this.invisibleRoles];
     }
 
     this.$nextTick(() => {
@@ -158,6 +205,18 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.role-more-box {
+  box-shadow: 0 6px 6px rgba(0, 0, 0, 0.15);
+  border-top: 1px solid rgba(0, 0, 0, 0.15);
+  overflow: hidden;
+  width: 100%;
+  background: #fff;
+  z-index: 10;
+  left: 0;
+  // top: 0;
+  position: fixed;
+  border-radius: 0 0 6px 6px;
+}
 .home-box {
   // 对此盒子进行 sticky 粘性定位
   position: sticky;
diff --git a/src/pages/project/project.vue b/src/pages/project/project.vue
index cb58789..1f0d758 100644
--- a/src/pages/project/project.vue
+++ b/src/pages/project/project.vue
@@ -9,7 +9,7 @@
       <!-- 角色栏 -->
       <Roles />
       <!-- 体验项目切换角色 -->
-      <Experience v-if="showEXP" />
+      <!-- <Experience v-if="showEXP" /> -->
       <!-- 日常任务面板 -->
       <Globals />
 
@@ -17,7 +17,7 @@
       <TimeLine @getTasks="getTasks" class="flex-1 overflow-hidden" ref="timeLine" />
 
       <!-- 医院项目的问卷悬浮按钮 -->
-      <view class="absolute bottom-10 right-5" v-if="showQuestion">
+      <view style="z-index: 99" class="absolute bottom-10 right-5" v-if="showQuestion">
         <view
           @click="openQuestionnaire(true)"
           class="relative text-white bg-blue-400 flex justify-center items-center w-12 h-12 rounded-full shadow-2xl"