perf: 任务日志刷新

dycp125 · Jan 11, 2022 · a745088 · a745088
1 parent 14be7bd
commit a745088
Show file tree

Hide file tree

Showing 3 changed files with 45 additions and 10 deletions.
diff --git a/resources/assets/js/pages/manage/components/ProjectLog.vue b/resources/assets/js/pages/manage/components/ProjectLog.vue
@@ -70,6 +70,9 @@ export default {
             this.lists = {};
             this.getLists(true);
         },
+        loadIng(num) {
+            this.$emit("on-load-change", num > 0)
+        }
     },
 
     methods: {

diff --git a/resources/assets/js/pages/manage/components/TaskDetail.vue b/resources/assets/js/pages/manage/components/TaskDetail.vue
@@ -329,22 +329,30 @@
                     <div slot="head" class="head">
                         <Icon class="icon" type="ios-chatbubbles-outline" />
                         <div class="nav">
-                            <p :class="{active:navActive=='dialog'}" @click="setNavActive('dialog')">{{$L('聊天')}}</p>
-                            <p :class="{active:navActive=='log'}" @click="setNavActive('log')">{{$L('动态')}}</p>
+                            <p :class="{active:navActive=='dialog'}" @click="navActive='dialog'">{{$L('聊天')}}</p>
+                            <p :class="{active:navActive=='log'}" @click="navActive='log'">{{$L('动态')}}</p>
+                            <div v-if="navActive=='log'" class="refresh">
+                                <Loading v-if="logLoadIng"/>
+                                <Icon v-else type="ios-refresh" @click="getLogLists"></Icon>
+                            </div>
                         </div>
                     </div>
                 </DialogWrapper>
-                <ProjectLog v-if="navActive=='log'" ref="log" :task-id="taskDetail.id"/>
+                <ProjectLog v-if="navActive=='log' && taskId > 0" ref="log" :task-id="taskDetail.id" @on-load-change="logLoadChange"/>
             </template>
             <div v-else>
                 <div class="head">
                     <Icon class="icon" type="ios-chatbubbles-outline" />
                     <div class="nav">
-                        <p :class="{active:navActive=='dialog'}" @click="setNavActive('dialog')">{{$L('聊天')}}</p>
-                        <p :class="{active:navActive=='log'}" @click="setNavActive('log')">{{$L('动态')}}</p>
+                        <p :class="{active:navActive=='dialog'}" @click="navActive='dialog'">{{$L('聊天')}}</p>
+                        <p :class="{active:navActive=='log'}" @click="navActive='log'">{{$L('动态')}}</p>
+                        <div v-if="navActive=='log'" class="refresh">
+                            <Loading v-if="logLoadIng"/>
+                            <Icon v-else type="ios-refresh" @click="getLogLists"></Icon>
+                        </div>
                     </div>
                 </div>
-                <ProjectLog v-if="navActive=='log'" ref="log" :task-id="taskDetail.id"/>
+                <ProjectLog v-if="navActive=='log' && taskId > 0" ref="log" :task-id="taskDetail.id" @on-load-change="logLoadChange"/>
                 <div v-else class="no-dialog">
                     <div class="no-tip">{{$L('暂无消息')}}</div>
                     <div class="no-input">
@@ -431,6 +439,7 @@ export default {
 
             msgText: '',
             navActive: 'dialog',
+            logLoadIng: false,
 
             sendLoad: false,
 
@@ -917,11 +926,15 @@ export default {
             });
         },
 
-        setNavActive(act) {
-            if (act == 'log' && this.navActive == act) {
-                this.$refs.log.getLists(true);
+        getLogLists() {
+            if (this.navActive != 'log') {
+                return;
             }
-            this.navActive = act;
+            this.$refs.log.getLists(true);
+        },
+
+        logLoadChange(load) {
+            this.logLoadIng = load
         },
 
         dropAdd(command) {

diff --git a/resources/assets/sass/pages/components/task-detail.scss b/resources/assets/sass/pages/components/task-detail.scss
@@ -495,6 +495,25 @@
                         cursor: default;
                     }
                 }
+                .refresh {
+                    display: flex;
+                    align-items: center;
+                    margin-left: -18px;
+                    > i {
+                        font-size: 18px;
+                        cursor: pointer;
+                        opacity: 0.8;
+                        transition: opacity 0.2s;
+                        &:hover {
+                            opacity: 1;
+                        }
+                    }
+                    .common-loading {
+                        margin: 3px;
+                        width: 12px;
+                        height: 12px;
+                    }
+                }
             }
         }
         .no-dialog {