perf: 优化项目页面聊天窗口

resources/assets/js/pages/manage/components/ProjectDialog.vue

@@ -4,8 +4,10 @@
             <div slot="head">
                 <div class="dialog-user">
                     <div class="member-head">
-                        <div class="member-title">{{$L('项目成员')}}<span>({{projectData.project_user.length}})</span></div>
-                        <div class="member-view-all" @click="memberShowAll=!memberShowAll">{{$L('查看所有')}}</div>
+                        <div class="member-title">{{$L('项目成员')}}<span @click="memberShowAll=!memberShowAll">({{projectData.project_user.length}})</span></div>
+                        <div class="member-close" @click="onClose">
+                            <Icon type="ios-close"/>
+                        </div>
                     </div>
                     <ul :class="['member-list', memberShowAll ? 'member-all' : '']">
                         <li v-for="item in projectData.project_user">
@@ -45,6 +47,9 @@ export default {
     methods: {
         onInputBack() {
             Store.set('onProjectDialogBack', null);
+        },
+        onClose() {
+            this.$store.dispatch('toggleProjectParameter', 'chat');
         }
     }
 }

resources/assets/js/store/actions.js

@@ -2027,6 +2027,9 @@ export default {
      * @param dialog_id
      */
     getDialogMsgs({state, dispatch}, dialog_id) {
+        if (!dialog_id) {
+            return;
+        }
         let dialog = state.cacheDialogs.find(({id}) => id == dialog_id);
         if (!dialog) {
             dialog = {

resources/assets/sass/pages/components/project-dialog.scss

@@ -7,8 +7,8 @@
     position: relative;
     .project-dialog-wrapper {
         .dialog-user {
-            margin-top: 36px;
-            padding: 0 32px;
+            margin-top: 26px;
+            padding: 0 22px;
             .member-head {
                 display: flex;
                 align-items: center;
@@ -21,12 +21,20 @@
                         color: $primary-color;
                     }
                 }
-                .member-view-all {
-                    color: #999;
-                    font-size: 13px;
+                .member-close {
                     cursor: pointer;
+
+                    .ivu-icon-ios-close {
+                        font-size: 38px;
+                        top: 3px;
+                        right: 2px;
+                        transition: all 0.2s;
+                    }
+
                     &:hover {
-                        color: #777;
+                        .ivu-icon-ios-close {
+                            transform: rotate(-90deg);
+                        }
                     }
                 }
             }
@@ -55,6 +63,9 @@
                 }
             }
         }
+        .dialog-title {
+            padding: 0 20px;
+        }
         .dialog-footer {
             .dialog-back {
                 display: none;
@@ -67,11 +78,12 @@
     .project-dialog {
         .project-dialog-wrapper {
             .dialog-user {
-                margin-top: 24px;
-                padding: 0 20px;
+                margin-top: 16px;
+                padding: 0 12px;
             }
             .dialog-title {
-                padding: 0 20px;
+                padding: 0 12px;
+                height: 58px;
             }
             .dialog-scroller {
                 padding: 0 20px;

resources/assets/sass/pages/page-project.scss

@@ -27,7 +27,7 @@
             }
         }
         .project-dialog {
-            position: absolute;
+            position: fixed;
             top: 0;
             left: 0;
             height: 100%;