From 56be4f5f38079913f4a687f27e4feae4194d475a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Thu, 6 Aug 2020 15:05:58 +0800
Subject: [PATCH 1/8] =?UTF-8?q?=20-=20=E4=BC=98=E5=8C=96=E6=89=8B=E6=9C=BA?=
 =?UTF-8?q?=E7=AB=AF=E6=98=BE=E7=A4=BA=20=20-=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E4=B8=80=E4=BA=9B=E7=BB=86=E8=8A=82=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/components/base.less           |   46 +-
 src/assets/css/components/layout.less         |  215 +-
 src/assets/css/components/list.less           |  154 +-
 src/assets/css/components/warpperContent.less |   53 +-
 src/assets/js/http.js                         |    1 +
 src/components/layout/UserLayout.vue          |  279 +--
 src/components/layout/WrapperContent.vue      |  252 ++-
 src/components/layout/header/HeaderAvatar.vue |  224 ++-
 src/components/layout/header/HeaderNotice.vue |  468 ++---
 .../project/inviteProjectMember.vue           |  388 ++--
 src/components/project/projectConfig.vue      | 1792 +++++++++--------
 src/store/state.js                            |    2 +-
 src/views/home/index.vue                      | 1338 ++++++------
 src/views/index.vue                           |  744 +++----
 src/views/member/Register.vue                 |  644 +++---
 src/views/member/login.vue                    |  836 ++++----
 src/views/members/index.vue                   |    1 -
 src/views/organization/index.vue              |  419 ++--
 src/views/project/archive/index.vue           |  318 +--
 src/views/project/list/index.vue              |  829 ++++----
 src/views/project/recycle/index.vue           |    3 +-
 21 files changed, 4822 insertions(+), 4184 deletions(-)

diff --git a/src/assets/css/components/base.less b/src/assets/css/components/base.less
index 08ff6e3..2b76236 100644
--- a/src/assets/css/components/base.less
+++ b/src/assets/css/components/base.less
@@ -1,9 +1,11 @@
 body {
   overflow: hidden;
 }
-.ant-layout{
+
+.ant-layout {
   background: #f5f5f5;
 }
+
 .pull-right {
   float: right;
 }
@@ -96,7 +98,8 @@ body {
   }
 }
 
-.group-btn, .submit-set {
+.group-btn,
+.submit-set {
   .cancel-text {
     margin-right: 12px;
   }
@@ -173,7 +176,9 @@ body {
     }
 
     &.price {
-      .editable-cell-input-wrapper, .editable-cell-text-wrapper {
+
+      .editable-cell-input-wrapper,
+      .editable-cell-text-wrapper {
         padding-left: 15px;
       }
     }
@@ -220,7 +225,13 @@ body {
 }
 
 .wangEditor-txt {
-  h1, h2, h3, h4, h5, h6 {
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
     font-weight: bold;
   }
 }
@@ -319,7 +330,7 @@ body {
   color: #383838;
 }
 
-.project-navigation .ivu-breadcrumb > span:last-child {
+.project-navigation .ivu-breadcrumb>span:last-child {
   font-weight: normal;
 }
 
@@ -361,17 +372,17 @@ body {
   justify-content: center;
 }
 
-.project-navigation .nav-body .nav-wrapper.nav > li {
+.project-navigation .nav-body .nav-wrapper.nav>li {
   z-index: 2;
   padding: 0 20px;
 }
 
-.project-navigation .nav-underscore > li {
+.project-navigation .nav-underscore>li {
   list-style: none;
   float: left;
 }
 
-.project-navigation .nav-underscore > li a {
+.project-navigation .nav-underscore>li a {
   display: inline-block;
   position: relative;
   height: 50px;
@@ -382,7 +393,7 @@ body {
   font-weight: normal;
 }
 
-.project-navigation .nav-body .nav-wrapper.nav > li .app[data-app=tasks] {
+.project-navigation .nav-body .nav-wrapper.nav>li .app[data-app=tasks] {
   position: relative;
   float: left;
   max-width: 200px;
@@ -391,11 +402,11 @@ body {
   white-space: nowrap;
 }
 
-.project-navigation .nav-underscore > li > a:hover {
+.project-navigation .nav-underscore>li>a:hover {
   background-color: inherit;
 }
 
-.project-navigation .nav-underscore > li > a:after {
+.project-navigation .nav-underscore>li>a:after {
   position: absolute;
   left: 0;
   bottom: 0;
@@ -406,7 +417,8 @@ body {
   opacity: 0;
 }
 
-.project-navigation .nav-underscore > li > a:hover:after, .project-navigation .nav-underscore > .actives > a:after {
+.project-navigation .nav-underscore>li>a:hover:after,
+.project-navigation .nav-underscore>.actives>a:after {
   border-width: 3px;
   opacity: 1;
 }
@@ -416,3 +428,13 @@ body {
     background: hsla(0, 0%, 100%, .95);
   }
 }
+
+
+.ant-tabs-bar {
+  margin: 1rem 1rem 0.5rem;
+}
+
+.ant-table-thead{
+  white-space: nowrap;
+  word-break: keep-all;
+}
\ No newline at end of file
diff --git a/src/assets/css/components/layout.less b/src/assets/css/components/layout.less
index c61be7f..69cce27 100644
--- a/src/assets/css/components/layout.less
+++ b/src/assets/css/components/layout.less
@@ -1,38 +1,74 @@
+.ant-layout-content {
+  overflow: auto;
+}
+
 #layout {
   height: 100vh;
 
   .ant-layout-header {
+    user-select: none;
     background: #fff;
     padding: 0;
-    line-height: 85px;
+    line-height: 4rem;
     position: fixed;
     width: 100%;
     top: 0;
     z-index: 5;
     //box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
-    box-shadow: 0 0 8px 0 rgba(0,0,0,.1);
+    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
+    display: flex;
+    justify-content: space-between;
+    align-items: stretch;
+
     ul {
       border-bottom: none;
+      flex: 1 0;
+      background: unset;
+      max-width: 50%;
+
+      li {
+        display: inline-block;
+        vertical-align: middle;
+        margin-top: 0px;
+        top: 0;
+        height: 100%;
+        line-height: 4rem;
+      }
+    }
+
+    .left-menudrawer {
+      color: #fff;
+
+      :hover {
+        color: darken(#fff, 6%);
+      }
+    }
+
+    .wap-menu {
+      display: none;
+      visibility: hidden;
+
+      .action-more {
+        width: 3rem;
+        text-align: center;
+        height: 100%;
+        padding: 0;
+      }
     }
   }
 
   .logo {
-    height: 32px;
     padding: 16px;
     text-align: center;
     box-sizing: content-box;
     transition: all .2s;
-    width: 224px;
-    float: left;
     line-height: 1.4;
     background: initial;
     color: #FFF;
     cursor: pointer;
+
     .logo-img {
       width: 30px;
-      position: absolute;
-      left: 35px;
-      top: 15px;
       transition: all .2s;
     }
 
@@ -40,36 +76,28 @@
       color: inherit;
       font-size: 20px;
       position: relative;
+
       .version {
         color: inherit;
-        position: absolute;
-        right: -25px;
         font-size: 14px;
       }
     }
   }
 
   .right-menu {
-    position: absolute;
-    right: 12px;
-    top: 0;
-    height: 100%;
-    line-height: 66px;
     color: #FFF;
     display: flex;
+    flex: 1 0;
+    justify-content: flex-end;
 
     .action {
       cursor: pointer;
-      //display: inline-block;
       transition: all .2s;
       padding: 0 6px;
-      height: 65px;
 
       .anticon {
         font-size: 16px;
-        //vertical-align: middle;
         color: #FFF;
-        //color: rgba(0, 0, 0, .65);
       }
 
       .action-item {
@@ -78,12 +106,8 @@
         position: relative;
 
         &.user-info {
-          padding-left: 52px;
-
           .ant-avatar {
-            position: absolute;
-            left: 12px;
-            top: 18px;
+            margin-right: 0.5rem;
           }
         }
       }
@@ -105,23 +129,16 @@
   }
 
   .ant-layout-sider {
-    z-index: 2;
-    overflow: auto;
-    width: 256px !important;
-    max-width: 256px !important;
+    user-select: none;
+    z-index: 3;
+    width: 256px;
+    max-width: 256px;
     height: 100vh;
     position: fixed;
     left: 0;
     box-shadow: 2px 0 8px 0 rgba(29, 35, 41, .05);
 
     &.ant-layout-sider-collapsed {
-      width: 80px !important;
-      max-width: 80px !important;
-
-      .ant-layout-sider-trigger {
-        width: 80px !important;
-      }
-
       .logo {
         .title {
           display: none;
@@ -129,30 +146,39 @@
       }
     }
 
-    .ant-layout-sider-trigger {
-      width: 256px !important;
+    .ant-layout-sider-zero-width-trigger {
+      bottom: 8rem;
+      top: auto;
+      right: -42px;
+      width: 42px;
+      color: initial;
+      box-shadow: #eaeaea 2px 1px 2px 1px;
+      background: #ffffff;
+      border-radius: 0 0.8rem 0.8rem 0;
     }
-
   }
 
-  .maint-content{
-    .ant-layout-content{
+  .maint-content {
+    .ant-layout-content {
       border-top: 1px solid #e8e8e8;
     }
   }
 
+  .main-content {
+    &.toleft {
+      padding-left: 200px;
+    }
+  }
+
   .ant-layout-footer {
     margin: 0 6px;
     padding: 0 50px 12px 50px;
   }
 
-  .ant-layout-header.collapsed{
-    .logo{
-      width: 48px;
-      .logo-img{
-        left: 27px;
-      }
-      .title{
+  .ant-layout-header.collapsed {
+    .logo {
+
+      .title {
         display: none;
       }
     }
@@ -160,28 +186,33 @@
 
   &.layout-light {
     .ant-layout-header {
+      //background-color: #2b83f9;
+      //background-image: linear-gradient(143deg,#2945cb 20%,#2b83f9 81%,#3a9dff);
+      //background-image: linear-gradient(143deg, #2945cb 20%, #1890ff 81%, #3a9dff);
+      background-image: linear-gradient(143deg, #e12f3f 20%, #f79275 81%, #FFC107);
+      border-bottom: none;
+
       ul {
-        //background-color: #2b83f9;
-        //background-image: linear-gradient(143deg,#2945cb 20%,#2b83f9 81%,#3a9dff);
-        //background-image: linear-gradient(143deg, #2945cb 20%, #1890ff 81%, #3a9dff);
-        background-image: linear-gradient(143deg, #e12f3f 20%, #f79275 81%, #FFC107);
-        border-bottom: none;
 
         li {
           border-bottom: none;
 
-          span, i {
+          span,
+          i {
             color: #FFF;
             //opacity: .69;
           }
 
           &:hover {
-            span, i {
+
+            span,
+            i {
               opacity: 1;
             }
           }
 
-          &.ant-menu-item-selected, &.ant-menu-item-active {
+          &.ant-menu-item-selected,
+          &.ant-menu-item-active {
             color: #1890ff;
             background: rgba(0, 0, 0, 0.08);
           }
@@ -191,8 +222,12 @@
 
     .ant-layout-sider {
       background: #FFF;
-      .ant-layout-sider-children{
-        .ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
+
+      .ant-layout-sider-children {
+
+        .ant-menu-inline,
+        .ant-menu-vertical,
+        .ant-menu-vertical-left {
           border-right: none;
         }
       }
@@ -216,10 +251,10 @@
 
   &.layout-dark {
     .ant-layout-header {
-      ul {
-        background-color: #fff;
-        background-image: none;
-      }
+      background-color: #fff;
+      background-image: none;
+
+      ul {}
     }
 
     .logo {
@@ -228,7 +263,11 @@
       box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
     }
 
-    .ant-layout-sider{
+    .left-menudrawer {
+      color: initial;
+    }
+
+    .ant-layout-sider {
       box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
     }
 
@@ -242,21 +281,18 @@
 
         .action-item {
           &.user-info {
-            .ant-avatar {
-            }
+            .ant-avatar {}
           }
         }
 
         &:hover {
-          background: rgba(0,0,0,.025);
+          background: rgba(0, 0, 0, .025);
           //background: #e6f7ff;
         }
 
-        &.action-avatar {
-        }
+        &.action-avatar {}
 
-        &.action-organization {
-        }
+        &.action-organization {}
       }
     }
 
@@ -280,6 +316,7 @@
   }
 
   .trigger {
+    user-select: none;
     font-size: 18px;
     line-height: 64px;
     padding: 0 24px;
@@ -294,9 +331,11 @@
 }
 
 .middle-menu {
+  user-select: none;
   padding: 4px 0;
 
-  .ant-dropdown-menu-item-divider, .ant-dropdown-menu-submenu-title-divider {
+  .ant-dropdown-menu-item-divider,
+  .ant-dropdown-menu-submenu-title-divider {
     margin: 4px 0;
   }
 
@@ -314,3 +353,39 @@
 .__vuescroll .__rail-is-vertical {
   z-index: 3;
 }
+
+@media (max-width:768px) {
+  #layout {
+    .main-content.toleft {
+      padding-left: 0px;
+    }
+
+
+    .ant-layout-sider-zero-width-trigger {
+      visibility: hidden;
+    }
+
+    .ant-layout-header {
+      .logo {
+        .title {
+          display: none;
+        }
+      }
+
+      .pc-view {
+        white-space: nowrap;
+        display: none;
+
+        .action-notice {
+          display: none;
+        }
+      }
+
+      .wap-menu {
+        display: block;
+        visibility: visible;
+        flex: 0;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/list.less b/src/assets/css/components/list.less
index 51511bd..bf25d48 100644
--- a/src/assets/css/components/list.less
+++ b/src/assets/css/components/list.less
@@ -8,18 +8,20 @@
   }
 
   .ant-list-item-content {
-    .other-info {
+    &.other-info {
       display: flex;
 
       .info-item {
         display: flex;
         flex-direction: column;
-        padding-left: 48px;
+        padding-left: 1.5rem;
       }
     }
   }
 
   .ant-list-item-action {
+    margin-left: 1.5rem;
+
     .anticon:hover {
       svg {
         color: @primary-color;
@@ -27,3 +29,151 @@
     }
   }
 }
+
+.project-list {
+  .ant-list-item {
+    padding: 1rem 0 1rem;
+    background: #fff;
+  }
+
+  .ant-list-item-meta {
+    margin-left: 1rem;
+    margin-right: 1rem;
+
+    .ant-list-item-meta-description {
+      font-size: 0.8rem;
+      line-height: 1.75;
+    }
+  }
+
+  .ant-list-item-meta-avatar {
+    .ant-avatar {
+      width: 50px;
+      height: 50px;
+      border-radius: 3px;
+    }
+  }
+
+  .ant-list-item-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    -webkit-box-pack: end;
+    -ms-flex-pack: end;
+    justify-content: flex-end;
+
+    &.schedule {
+      margin-left: 1rem;
+      margin-right: 1rem;
+
+      .info-item {
+        flex: 1;
+        padding: 0 1rem;
+      }
+    }
+
+    &.other-info {
+      display: flex;
+      font-size: 0.8rem;
+      flex: 0;
+
+      margin-left: 1rem;
+      margin-right: 1rem;
+
+      .info-item {
+        display: flex;
+        flex-direction: column;
+        word-break: keep-all;
+
+        &:nth-child(n+2) {
+          padding-left: 1.5rem;
+        }
+      }
+    }
+  }
+
+  .ant-list-item-action {
+    margin-left: 1rem;
+    margin-right: 1rem;
+
+    >*:hover {
+      svg {
+        color: @primary-color;
+      }
+    }
+  }
+}
+
+@media (max-width: 930px) {
+  .project-list {
+    .ant-list-item {
+      padding: 1rem 0 0;
+      flex-direction: column;
+      align-items: stretch;
+
+      >*:nth-child(n+2) {
+        margin-top: 0.2rem;
+      }
+
+      .ant-list-item-meta {
+        margin-bottom: 0.8rem;
+      }
+
+      .ant-list-item-content {
+
+        &.schedule {
+
+          .info-item {}
+        }
+
+        &.other-info {
+          justify-content: space-around;
+
+          .info-item {}
+        }
+      }
+
+      .ant-list-item-action {
+        display: flex;
+        justify-content: space-around;
+        margin-left: 0;
+        margin-right: 0;
+        align-items: stretch;
+        margin-top: 0.5rem;
+
+        >li {
+          flex: 1;
+          padding: 0.5rem;
+
+          &:active {
+            background: linear-gradient(0deg, lighten(#000, 96%), transparent);
+          }
+        }
+
+      }
+    }
+  }
+}
+
+@media(max-width: 430px) {
+  .project-list {
+    .ant-list-item {
+      .ant-list-item-meta {
+        flex-direction: column;
+        align-items: stretch;
+
+        .ant-list-item-meta-avatar {
+          margin: 0 0 0.5rem;
+
+          .ant-avatar {
+            width: 100%;
+            height: 100px;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/warpperContent.less b/src/assets/css/components/warpperContent.less
index f15cf5e..821f75f 100644
--- a/src/assets/css/components/warpperContent.less
+++ b/src/assets/css/components/warpperContent.less
@@ -6,6 +6,7 @@
   font-weight: 400;
   //border-bottom: 1px solid #e5e5e5;
 }
+
 .content-title {
   font-size: 18px;
   color: #464c5b;
@@ -21,81 +22,88 @@
   float: right;
 }
 
-.content-action + .page-title {
+.content-action+.page-title {
   //padding-top: 55px;
 }
-.page-header{
+
+.page-header {
   //margin-top: 65px;
   background: #fff;
   padding: 16px 32px 0;
   border-bottom: 1px solid #e8e8e8;
-  .breadcrumb{
+
+  .breadcrumb {
     margin-bottom: 16px;
   }
-  .detail{
+
+  .detail {
     display: flex;
+
     .row {
       display: flex;
       width: 100%;
     }
-    .main{
+
+    .main {
       width: 100%;
       flex: 0 1 auto;
-      .title{
+
+      .title {
         flex: auto;
         font-size: 20px;
         font-weight: 500;
-        color: rgba(0,0,0,.85);
+        color: rgba(0, 0, 0, .85);
         margin-bottom: 16px;
       }
-      .logo{
+
+      .logo {
         width: 28px;
         height: 28px;
         border-radius: 4px;
         margin-right: 16px;
       }
-      .content{
+
+      .content {
         margin-bottom: 16px;
         flex: auto;
       }
-      .extra{
+
+      .extra {
         flex: 0 1 auto;
         margin-left: 88px;
         min-width: 242px;
         text-align: right;
       }
-      .action{
-        margin-left: 56px;
-        min-width: 266px;
+
+      .action {
         flex: 0 1 auto;
         text-align: right;
       }
     }
   }
 }
-.page-header-none{
+
+.page-header-none {
   padding: 0;
   border-bottom: none;
 }
 
 .wrapper-main {
-  margin: 24px;
-  padding: 24px 0 12px 24px;
+  margin: 2rem;
+  padding: 1rem;
   background: rgb(255, 255, 255);
 }
 
 .wrapper-content {
-  width: 100%;
-  padding-right: 24px;
   transition: all 368ms;
-  .action{
+
+  .action {
     padding-bottom: 12px;
     line-height: 3;
   }
 }
 
-.layout-content {
-}
+.layout-content {}
 
 .page-search {
   margin-bottom: 16px;
@@ -142,5 +150,4 @@
   text-align: center;
   padding: 10px 0 20px;
   color: #9ea7b4;
-}
-
+}
\ No newline at end of file
diff --git a/src/assets/js/http.js b/src/assets/js/http.js
index 5e58b88..3327f62 100644
--- a/src/assets/js/http.js
+++ b/src/assets/js/http.js
@@ -14,6 +14,7 @@ if (currentOrganization) {
 }
 const crossDomain = config.crossDomain;
 let axiosConfig = {};
+axiosConfig.baseURL = '/api'// process.env.VUE_APP_API_URL;
 if (crossDomain) {
     axiosConfig.withCredentials = true;
     axiosConfig.crossDomain = true;
diff --git a/src/components/layout/UserLayout.vue b/src/components/layout/UserLayout.vue
index 0f5ba9a..6f044b3 100644
--- a/src/components/layout/UserLayout.vue
+++ b/src/components/layout/UserLayout.vue
@@ -1,151 +1,156 @@
 <template>
-    <div class="userLayout">
-        <div class="container">
-            <div class="top">
-                <div class="header">
-                    <a-badge>
-                        <a href="/">
-                            <img src="../../assets/image/common/logo.png" class="logo" alt="logo">
-                            <span class="title">Pear Project</span>
-                        </a>
-                    </a-badge>
-                </div>
-                <div class="desc">{{desc}}</div>
-            </div>
-
-            <router-view/>
-            <slot></slot>
-
-            <div class="footer">
-                <div class="copyright">
-                    Copyright &copy; 2019 Pear Project
-                </div>
-            </div>
+  <div class="userLayout">
+    <div class="container">
+      <div class="top">
+        <div class="header">
+          <a-badge>
+            <a href="/">
+              <img src="../../assets/image/common/logo.png" class="logo" alt="logo" />
+              <span class="title">项目管理系统</span>
+            </a>
+          </a-badge>
         </div>
+        <div class="desc" v-if="desc">{{desc}}</div>
+      </div>
+
+      <router-view />
+      <slot></slot>
+
+      <!-- <div class="footer">
+        <div class="copyright">Copyright &copy; 2019 Pear Project</div>
+      </div>-->
     </div>
+  </div>
 </template>
 
 <script>
-
-    export default {
-        name: 'UserLayout',
-        props: {
-            desc: {
-                type: [String],
-                default() {
-                    return '欢迎使用Pear Project项目管理系统';
-                }
-            }
-        }
-    }
+export default {
+  name: "UserLayout",
+  props: {
+    desc: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .userLayout {
-        height: 100%;
-        overflow: auto;
-
-        &.mobile {
-            .container {
-                .main {
-                    max-width: 368px;
-                    width: 98%;
-                }
-            }
+.userLayout {
+  height: 100%;
+  overflow: auto;
+  user-select: none;
+
+  &.mobile {
+    .container {
+      .main {
+        max-width: 368px;
+        width: 98%;
+      }
+    }
+  }
+
+  .container {
+    width: 100%;
+    min-height: 100%;
+    background: #f5f5f5 url(~@/assets/image/common/background.svg) no-repeat 50%;
+    background-size: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+
+    a {
+      text-decoration: none;
+    }
+
+    .top {
+      text-align: center;
+      margin: 1rem auto;
+
+      .header {
+        line-height: 44px;
+        margin: 1rem auto;
+
+        .badge {
+          position: absolute;
+          display: inline-block;
+          line-height: 1;
+          vertical-align: middle;
+          margin-left: -12px;
+          margin-top: -10px;
+          opacity: 0.8;
         }
 
-        .container {
-            width: 100%;
-            min-height: 100%;
-            background: #f5f5f5 url(~@/assets/image/common/background.svg) no-repeat 50%;
-            background-size: 100%;
-            padding: 110px 0 144px;
-            position: relative;
-
-            a {
-                text-decoration: none;
-            }
-
-            .top {
-                text-align: center;
-
-                .header {
-                    height: 44px;
-                    line-height: 44px;
-
-                    .badge {
-                        position: absolute;
-                        display: inline-block;
-                        line-height: 1;
-                        vertical-align: middle;
-                        margin-left: -12px;
-                        margin-top: -10px;
-                        opacity: 0.8;
-                    }
-
-                    .logo {
-                        height: 44px;
-                        vertical-align: top;
-                        margin-right: 12px;
-                        border-style: none;
-                        /*transform: rotate(-25deg);*/
-                        /*-ms-transform: rotate(-25deg); !* IE 9 *!*/
-                        /*-moz-transform: rotate(-25deg); !* Firefox *!*/
-                        /*-webkit-transform: rotate(-25deg); !* Safari 和 Chrome *!*/
-                        /*-o-transform: rotate(-25deg);*/
-                    }
-
-                    .title {
-                        font-size: 33px;
-                        color: rgba(0, 0, 0, .85);
-                        font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-                        font-weight: 600;
-                        position: relative;
-                        top: 2px;
-                    }
-                }
-
-                .desc {
-                    font-size: 14px;
-                    color: rgba(0, 0, 0, 0.45);
-                    margin-top: 12px;
-                    margin-bottom: 40px;
-                }
-            }
-
-            .main {
-                min-width: 260px;
-                width: 368px;
-                margin: 0 auto;
-            }
-
-            .footer {
-                position: absolute;
-                width: 100%;
-                bottom: 0;
-                padding: 0 16px;
-                margin: 48px 0 24px;
-                text-align: center;
-
-                .links {
-                    margin-bottom: 8px;
-                    font-size: 14px;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.45);
-                        transition: all 0.3s;
-
-                        &:not(:last-child) {
-                            margin-right: 40px;
-                        }
-                    }
-                }
-
-                .copyright {
-                    color: rgba(0, 0, 0, 0.45);
-                    font-size: 14px;
-                }
-            }
+        .logo {
+          height: 44px;
+          vertical-align: top;
+          margin-right: 12px;
+          border-style: none;
+          /*transform: rotate(-25deg);*/
+          /*-ms-transform: rotate(-25deg); !* IE 9 *!*/
+          /*-moz-transform: rotate(-25deg); !* Firefox *!*/
+          /*-webkit-transform: rotate(-25deg); !* Safari 和 Chrome *!*/
+          /*-o-transform: rotate(-25deg);*/
         }
+
+        .title {
+          font-size: 33px;
+          color: rgba(0, 0, 0, 0.85);
+          font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont,
+            "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
+            "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji",
+            "Segoe UI Emoji", "Segoe UI Symbol";
+          font-weight: 600;
+          position: relative;
+          top: 2px;
+        }
+      }
+
+      .desc {
+        font-size: 14px;
+        color: rgba(0, 0, 0, 0.45);
+        margin-top: 0.2rem;
+        margin-bottom: 0.8rem;
+      }
+    }
+
+    .main {
+      min-width: 260px;
+      max-width: 260px;
+      margin: 0 auto;
+    }
+
+    .footer {
+      position: absolute;
+      width: 100%;
+      bottom: 0;
+      padding: 0 16px;
+      margin: 48px 0 24px;
+      text-align: center;
+
+      .links {
+        margin-bottom: 8px;
+        font-size: 14px;
+
+        a {
+          color: rgba(0, 0, 0, 0.45);
+          transition: all 0.3s;
+
+          &:not(:last-child) {
+            margin-right: 40px;
+          }
+        }
+      }
+
+      .copyright {
+        color: rgba(0, 0, 0, 0.45);
+        font-size: 14px;
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/layout/WrapperContent.vue b/src/components/layout/WrapperContent.vue
index ec9c375..45b0cfb 100644
--- a/src/components/layout/WrapperContent.vue
+++ b/src/components/layout/WrapperContent.vue
@@ -1,144 +1,138 @@
 <template>
-    <div>
-        <div class="page-header" v-if="showHeader">
-            <div class="breadcrumb" v-if="breadCrumbInfo.length > 0 && breadCrumb">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <router-link to="/home">首页</router-link>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[2].title}}</a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[1].title}}</a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[0].title}}</a-breadcrumb-item>
-                    <!--<router-link :to="breadCrumbInfo[0].path">{{breadCrumbInfo[0].title}}</router-link>-->
-                </a-breadcrumb>
+  <div>
+    <div class="page-header" v-if="showHeader">
+      <div class="breadcrumb" v-if="breadCrumbInfo.length > 0 && breadCrumb">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <router-link to="/home">首页</router-link>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[2].title}}</a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[1].title}}</a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[0].title}}</a-breadcrumb-item>
+          <!--<router-link :to="breadCrumbInfo[0].path">{{breadCrumbInfo[0].title}}</router-link>-->
+        </a-breadcrumb>
+      </div>
+      <div class="detail">
+        <div class="main">
+          <div class="row">
+            <h1 v-if="pageTitle.trim() != '' && showTitle" class="title">{{ pageTitle }}</h1>
+            <h1 v-else-if="showTitle" class="title">{{ defaultPageTitle }}</h1>
+            <div class="action">
+              <slot name="action"></slot>
             </div>
-            <div class="detail">
-                <div class="main">
-                    <div class="row">
-                        <h1 v-if="pageTitle.trim() != '' && showTitle" class="title">{{ pageTitle }}</h1>
-                        <h1 v-else-if="showTitle" class="title">{{ defaultPageTitle }}</h1>
-                        <div class="action">
-                            <slot name="action"></slot>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div v-if="this.$slots.content" class="content">
-                            <slot name="content"></slot>
-                        </div>
-                        <div v-if="this.$slots.extra" class="extra">
-                            <slot name="extra"></slot>
-                        </div>
-                    </div>
-                </div>
-
+          </div>
+          <div class="row">
+            <div v-if="this.$slots.content" class="content">
+              <slot name="content"></slot>
+            </div>
+            <div v-if="this.$slots.extra" class="extra">
+              <slot name="extra"></slot>
             </div>
+          </div>
         </div>
-        <div class="page-header page-header-none" v-else></div>
-        <div class="page-header page-header-none"></div>
+      </div>
+    </div>
+    <div class="page-header page-header-none" v-else></div>
+    <div class="page-header page-header-none"></div>
 
-        <div class="wrapper-main">
-            <div class="wrapper-content"
-                 :class="{ 'hidden':pageLoading}">
-                <div class="layout-content">
-                    <div class="content-title" v-if="this.$slots.contentTitle || this.$slots.contentAction">
-                        <slot name="contentTitle"></slot>
-                        <div class="content-action">
-                            <slot name="contentAction"></slot>
-                        </div>
-                    </div>
-                    <slot></slot>
-                </div>
+    <div class="wrapper-main">
+      <div class="wrapper-content" :class="{ 'hidden':pageLoading}">
+        <div class="layout-content">
+          <div class="content-title" v-if="this.$slots.contentTitle || this.$slots.contentAction">
+            <slot name="contentTitle"></slot>
+            <div class="content-action">
+              <slot name="contentAction"></slot>
             </div>
+          </div>
+          <slot></slot>
         </div>
+      </div>
     </div>
-
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {getStore} from '@/assets/js/storage'
-    import {getClassObj} from '@/assets/js/utils'
-    import $ from 'jquery'
-    import ABreadcrumb from 'ant-design-vue/es/breadcrumb'
-
-    const ABreadcrumbItem = ABreadcrumb.Item;
+import { mapState } from "vuex";
+import { getStore } from "@/assets/js/storage";
+import { getClassObj } from "@/assets/js/utils";
+import $ from "jquery";
+import ABreadcrumb from "ant-design-vue/es/breadcrumb";
 
+const ABreadcrumbItem = ABreadcrumb.Item;
 
-    export default {
-        components: {
-            ABreadcrumb,
-            ABreadcrumbItem,
-        },
-        props: {
-            pageTitle: {
-                default: ''
-            },
-            showTitle: {
-                default: true
-            },
-            showHeader: {
-                default: true
-            },
-            breadCrumb: {
-                default: true
-            },
-        },
-        mounted() {
-            //用户权限资源检测
-            function TraversalObject(obj, value) {
-                for (let a in obj) {
-                    if (typeof (obj[a]) === "object") {
-                        TraversalObject(obj[a], value); //递归遍历
-                    }
-                    else {
-                        if (a === 'name' && obj[a] === value) {
-                            window.permission = true;
-                        }
-                    }
-                }
-            }
+export default {
+  components: {
+    ABreadcrumb,
+    ABreadcrumbItem,
+  },
+  props: {
+    pageTitle: {
+      default: "",
+    },
+    showTitle: {
+      default: true,
+    },
+    showHeader: {
+      default: true,
+    },
+    breadCrumb: {
+      default: true,
+    },
+  },
+  mounted() {
+    //用户权限资源检测
+    function TraversalObject(obj, value) {
+      for (let a in obj) {
+        if (typeof obj[a] === "object") {
+          TraversalObject(obj[a], value); //递归遍历
+        } else {
+          if (a === "name" && obj[a] === value) {
+            window.permission = true;
+          }
+        }
+      }
+    }
 
-            const auth_list = getStore('auth_list', true);
-            const permissions = $("a[permission]");
-            if (permissions) {
-                $.each(permissions, function (k, v) {
-                    let permission = $(v).attr('permission');
-                    window.permission = false;
-                    TraversalObject(auth_list, permission);
-                    if (!window.permission) {
-                        $(v).remove()
-                    }
-                });
-            }
-            this.$nextTick(function () {
-                // 挂载时隐藏所有父级页面的内容区
-                const ClassElements = getClassObj('wrapper-main');
-                if (ClassElements.length > 1) {
-                    for (let i = 0; i < ClassElements.length - 1; i++) {
-                        ClassElements[i].style.display = "none"
-                    }
-                }
-            })
-        },
-        computed: {
-            ...mapState({
-                pageLoading: state => state.pageLoading,
-                breadCrumbInfo: state => state.menu.breadCrumbInfo,
-            }),
-            defaultPageTitle: {
-                get() {
-                    return this.$route.meta.info.title
-                }
-            },
-            wrapper_content_class: function () {
-            }
-        },
-        destroyed: function () {
-            this.$nextTick(function () {
-                const ClassElements = getClassObj('wrapper-main');
-                for (let i = 0; i < ClassElements.length; i++) {
-                    ClassElements[i].removeAttribute("style");
-                }
-            })
-        },
+    const auth_list = getStore("auth_list", true);
+    const permissions = $("a[permission]");
+    if (permissions) {
+      $.each(permissions, function (k, v) {
+        let permission = $(v).attr("permission");
+        window.permission = false;
+        TraversalObject(auth_list, permission);
+        if (!window.permission) {
+          $(v).remove();
+        }
+      });
     }
+    this.$nextTick(function () {
+      // 挂载时隐藏所有父级页面的内容区
+      const ClassElements = getClassObj("wrapper-main");
+      if (ClassElements.length > 1) {
+        for (let i = 0; i < ClassElements.length - 1; i++) {
+          ClassElements[i].style.display = "none";
+        }
+      }
+    });
+  },
+  computed: {
+    ...mapState({
+      pageLoading: (state) => state.pageLoading,
+      breadCrumbInfo: (state) => state.menu.breadCrumbInfo,
+    }),
+    defaultPageTitle: {
+      get() {
+        return this.$route.meta.info.title;
+      },
+    },
+    wrapper_content_class: function () {},
+  },
+  destroyed: function () {
+    this.$nextTick(function () {
+      const ClassElements = getClassObj("wrapper-main");
+      for (let i = 0; i < ClassElements.length; i++) {
+        ClassElements[i].removeAttribute("style");
+      }
+    });
+  },
+};
 </script>
diff --git a/src/components/layout/header/HeaderAvatar.vue b/src/components/layout/header/HeaderAvatar.vue
index dfd7a5d..4b3f102 100644
--- a/src/components/layout/header/HeaderAvatar.vue
+++ b/src/components/layout/header/HeaderAvatar.vue
@@ -1,86 +1,166 @@
 <template>
-    <div v-if="userInfo">
-        <a-dropdown class="action-item" placement="bottomRight">
-            <div class="user-info">
-                <a-avatar :src="userInfo.avatar" alt="">{{userInfo.name}}</a-avatar>
-                <span>{{userInfo.name}}</span>
-            </div>
-            <a-menu slot="overlay" class="middle-menu" :selectable="false" @click="userAction">
-                <a-menu-item key="setting">
-                    <a href="javascript:;">
-                        <a-icon type="user"></a-icon>
-                        个人设置</a>
-                </a-menu-item>
-                <a-menu-item key="theme">
-                    <a href="javascript:;">
-                        <a-icon type="swap"/>
-                        切换主题</a>
-                </a-menu-item>
-                <a-menu-divider></a-menu-divider>
-                <a-menu-item key="logout">
-                    <a href="javascript:;">
-                        <a-icon type="logout"></a-icon>
-                        退出登录</a>
-                </a-menu-item>
-            </a-menu>
-        </a-dropdown>
-    </div>
-
+  <div v-if="userInfo">
+    <template v-if="type==1">
+      <a-dropdown class="action-item" placement="bottomRight">
+        <div class="user-info">
+          <a-avatar :src="userInfo.avatar" alt>{{userInfo.name}}</a-avatar>
+          <span>{{userInfo.name}}</span>
+        </div>
+        <a-menu slot="overlay" class="middle-menu" :selectable="false" @click="userAction">
+          <a-menu-item key="setting">
+            <a href="javascript:;">
+              <a-icon type="user"></a-icon>个人设置
+            </a>
+          </a-menu-item>
+          <a-menu-item key="theme">
+            <a href="javascript:;">
+              <a-icon type="swap" />切换主题
+            </a>
+          </a-menu-item>
+          <a-menu-divider></a-menu-divider>
+          <a-menu-item key="logout">
+            <a href="javascript:;">
+              <a-icon type="logout"></a-icon>退出登录
+            </a>
+          </a-menu-item>
+        </a-menu>
+      </a-dropdown>
+    </template>
+    <template v-else>
+      <div class="drawer-setting">
+        <div class="user-info">
+          <a-avatar :src="userInfo.avatar" alt>{{userInfo.name}}</a-avatar>
+          <span>{{userInfo.name}}</span>
+        </div>
+        <div @click="userAction({key:'setting'})" key="setting">
+          <a-icon type="user"></a-icon>个人设置
+        </div>
+        <div @click="userAction({key:'theme'})" key="theme">
+          <a-icon type="swap" />
+          {{theme=='dark'?'炫彩':'暗黑'}}模式
+        </div>
+        <div class="group"></div>
+        <div @click="userAction({key:'logout'})" class="logout">
+          <a-icon type="logout"></a-icon>退出登录
+        </div>
+      </div>
+    </template>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import {_out} from "../../../api/user";
+import { mapState } from "vuex";
+import { _out } from "../../../api/user";
 
-    export default {
-        name: 'HeaderAvatar',
-        data() {
-            return {}
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                theme: state => state.theme,
-            })
-        },
-        methods: {
-            userAction(action) {
-                let app = this;
-                if (action.key == 'logout') {
-                    _out();
-                    app.$store.dispatch('SET_LOGOUT');
-                } else if (action.key == 'setting') {
-                    app.$router.push('/account/setting/base');
-                } else if (action.key == 'theme') {
-                    let theme = 'dark';
-                    if (this.theme == theme) {
-                        theme = 'light';
-                    }
-                    this.$store.dispatch('setTheme', theme);
-                } else {
-                }
-            },
+export default {
+  name: "HeaderAvatar",
+  props: {
+    type: {
+      type: [String, Number],
+      default: function () {
+        return 1;
+      },
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      theme: (state) => state.theme,
+    }),
+  },
+  methods: {
+    userAction(action) {
+      console.log(action.key);
+      let app = this;
+      if (action.key == "logout") {
+        _out();
+        app.$store.dispatch("SET_LOGOUT");
+      } else if (action.key == "setting") {
+        app.$router.push("/account/setting/base");
+      } else if (action.key == "theme") {
+        let theme = "light";
+        if (this.theme == theme) {
+          theme = "dark";
         }
-    }
+        this.$store.dispatch("setTheme", theme);
+      } else {
+      }
+      this.$emit("finish");
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .avatar-uploader > .ant-upload {
-        width: 128px;
-        height: 128px;
-    }
+.avatar-uploader > .ant-upload {
+  width: 128px;
+  height: 128px;
+}
 
-    .avatar-uploader img {
-        width: 100%;
-    }
+.avatar-uploader img {
+  width: 100%;
+}
 
-    .ant-upload-select-picture-card i {
-        font-size: 32px;
-        color: #999;
-    }
+.ant-upload-select-picture-card i {
+  font-size: 32px;
+  color: #999;
+}
 
-    .ant-upload-select-picture-card .ant-upload-text {
-        margin-top: 8px;
-        color: #666;
+.ant-upload-select-picture-card .ant-upload-text {
+  margin-top: 8px;
+  color: #666;
+}
+
+.drawer-setting {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  user-select: none;
+  color: #878787;
+  > * {
+    padding: 0.5rem;
+    line-height: 2;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    word-break: keep-all;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    .anticon {
+      margin-right: 0.2rem;
+    }
+    &:active {
+      background: darken(#fff, 6%);
+      transition: all 0.2s ease;
+    }
+    &.user-info {
+      padding: 1rem 0.5rem;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+      .ant-avatar {
+        margin-right: 0.5rem;
+      }
+      &:active {
+        background: unset;
+      }
+    }
+    &.logout {
+      background: #f14242;
+      color: #fff;
+      border-radius: 2rem;
+      text-align: center;
+      word-spacing: 6px;
+      letter-spacing: 0.3rem;
+      &:active {
+        background: darken(#f14242, 12%);
+      }
+    }
+    &:nth-child(n + 2):not(.group) {
+      border-top: solid 1px #efefef;
     }
+  }
+}
 </style>
diff --git a/src/components/layout/header/HeaderNotice.vue b/src/components/layout/header/HeaderNotice.vue
index b4676ba..6c91f54 100644
--- a/src/components/layout/header/HeaderNotice.vue
+++ b/src/components/layout/header/HeaderNotice.vue
@@ -1,70 +1,80 @@
 <template>
-    <a-popover v-model="showNotice" overlayClassName="header-notice" trigger="click" placement="bottomRight">
-        <template slot="content">
-            <a-spin :spinning="loading">
-                <a-tabs class="header-notice-content" :tabBarGutter="25">
-                    <a-tab-pane key="1">
-                        <span slot="tab">消息<span
-                                v-if="total && totalSum['message']">({{totalSum['message']}})</span></span>
-                        <template v-if="total && totalSum['message']">
-                            <a-list>
-                                <template v-for="item in list['message']">
-                                    <a-list-item :key="item.id">
-                                        <a-list-item-meta :description="item.create_time">
-                                             <span slot="title">
-                                                    <p>{{item.title}}</p>
-                                                    <p class="ant-list-item-meta-description" v-html="item.content"></p>
-                                             </span>
-                                            <a-avatar slot="avatar"
-                                                      :src="item.avatar"/>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </template>
-                            </a-list>
-                            <div class="footer-action">
-                                <a class="item muted" @click="setRead('message')">清空消息</a>
-                                <a class="item muted" @click="showMore('1')">查看更多</a>
-                            </div>
-                        </template>
-                        <template v-else>
-                            <div class="notFound">
-                                <img src="../../../assets/image/notify/laba.svg" alt="not found">
-                                <div>你已读完所有消息</div>
-                            </div>
-                        </template>
-                    </a-tab-pane>
-                    <a-tab-pane key="2">
-                        <span slot="tab">通知<span
-                                v-if="total && totalSum['notice']">({{totalSum['notice']}})</span></span>
-                        <template v-if="total && totalSum['notice']">
-                            <a-list>
-                                <template v-for="item in list['notice']">
-                                    <a-list-item :key="item.id">
-                                        <a-list-item-meta :description="item.create_time">
-                                             <span slot="title">
-                                                 <p v-html="item.title"></p>
-                                                 <p class="ant-list-item-meta-description" v-html="item.content"></p>
-
-                                             </span>
-                                            <a-avatar style="background-color: white" slot="avatar"
-                                                      src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"/>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </template>
-                            </a-list>
-                            <div class="footer-action">
-                                <a class="item muted" @click="setRead('notice')">清空通知</a>
-                                <a class="item muted" @click="()=>{$router.push('/notify/notice')}">查看更多</a>
-                            </div>
-                        </template>
-                        <template v-else>
-                            <div class="notFound">
-                                <img src="../../../assets/image/notify/bell.svg" alt="not found">
-                                <div>你已查看所有通知</div>
-                            </div>
-                        </template>
-                    </a-tab-pane>
-                 <!--   <a-tab-pane key="3">
+  <a-popover
+    v-model="showNotice"
+    overlayClassName="header-notice"
+    trigger="click"
+    placement="bottomRight"
+  >
+    <template slot="content">
+      <a-spin :spinning="loading">
+        <a-tabs class="header-notice-content" :tabBarGutter="25">
+          <a-tab-pane key="1">
+            <span slot="tab">
+              消息
+              <span v-if="total && totalSum['message']">({{totalSum['message']}})</span>
+            </span>
+            <template v-if="total && totalSum['message']">
+              <a-list>
+                <template v-for="item in list['message']">
+                  <a-list-item :key="item.id">
+                    <a-list-item-meta :description="item.create_time">
+                      <span slot="title">
+                        <p>{{item.title}}</p>
+                        <p class="ant-list-item-meta-description" v-html="item.content"></p>
+                      </span>
+                      <a-avatar slot="avatar" :src="item.avatar" />
+                    </a-list-item-meta>
+                  </a-list-item>
+                </template>
+              </a-list>
+              <div class="footer-action">
+                <a class="item muted" @click="setRead('message')">清空消息</a>
+                <a class="item muted" @click="showMore('1')">查看更多</a>
+              </div>
+            </template>
+            <template v-else>
+              <div class="notFound">
+                <img src="../../../assets/image/notify/laba.svg" alt="not found" />
+                <div>你已读完所有消息</div>
+              </div>
+            </template>
+          </a-tab-pane>
+          <a-tab-pane key="2">
+            <span slot="tab">
+              通知
+              <span v-if="total && totalSum['notice']">({{totalSum['notice']}})</span>
+            </span>
+            <template v-if="total && totalSum['notice']">
+              <a-list>
+                <template v-for="item in list['notice']">
+                  <a-list-item :key="item.id">
+                    <a-list-item-meta :description="item.create_time">
+                      <span slot="title">
+                        <p v-html="item.title"></p>
+                        <p class="ant-list-item-meta-description" v-html="item.content"></p>
+                      </span>
+                      <a-avatar
+                        style="background-color: white"
+                        slot="avatar"
+                        src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"
+                      />
+                    </a-list-item-meta>
+                  </a-list-item>
+                </template>
+              </a-list>
+              <div class="footer-action">
+                <a class="item muted" @click="setRead('notice')">清空通知</a>
+                <a class="item muted" @click="()=>{$router.push('/notify/notice')}">查看更多</a>
+              </div>
+            </template>
+            <template v-else>
+              <div class="notFound">
+                <img src="../../../assets/image/notify/bell.svg" alt="not found" />
+                <div>你已查看所有通知</div>
+              </div>
+            </template>
+          </a-tab-pane>
+          <!--   <a-tab-pane key="3">
                         <span slot="tab">待办<span
                                 v-if="task.total && task.total">({{task.total}})</span></span>
                         <template v-if="task.total && task.total">
@@ -101,187 +111,191 @@
                                 <div>你已完成所有待办</div>
                             </div>
                         </template>
-                    </a-tab-pane>-->
-                </a-tabs>
-            </a-spin>
-        </template>
-        <span>
-          <a-badge :count="total">
-            <a-icon class="action-item" type="bell"/>
-          </a-badge>
-        </span>
-    </a-popover>
+          </a-tab-pane>-->
+        </a-tabs>
+      </a-spin>
+    </template>
+    <span>
+      <a-badge :count="total">
+        <a-icon class="action-item" type="bell" />
+      </a-badge>
+    </span>
+  </a-popover>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import moment from 'moment';
-    import {_clearAll, noReads} from "../../../api/notify";
-    import {notice} from "../../../assets/js/notice";
-    import {showMsgNotification} from "../../../assets/js/notify";
-    import {selfList} from "../../../api/task";
-    import {relativelyTime} from "../../../assets/js/dateTime";
+import { mapState } from "vuex";
+import moment from "moment";
+import { _clearAll, noReads } from "../../../api/notify";
+import { notice } from "../../../assets/js/notice";
+import { showMsgNotification } from "../../../assets/js/notify";
+import { selfList } from "../../../api/task";
+import { relativelyTime } from "../../../assets/js/dateTime";
 
-    export default {
-        name: 'HeaderNotice',
-        data() {
-            return {
-                showNotice: false,
-                loading: false,
-                total: 0,
-                messageTotal: 0,
-                totalSum: 0,
-                list: [],
-                task: {
-                    page: 1,
-                    pageSize: 5,
-                    total: 0,
-                    list: [],
-                }
-            }
-        },
-        computed: {
-            ...mapState({
-                socketAction: state => state.socketAction,
-                currentOrganization: state => state.currentOrganization,
-            })
-        },
-        watch: {
-            socketAction(val) {
-                if (val.action === 'notice') {
-                    this.init();
-                } else if (val.action === 'task') {
-                    this.init();
-                    const permission = showMsgNotification(val.title, val.msg, {icon: val.data.notify.avatar});
-                    if (permission === false) {
-                        notice(val, 'notice', 'info', 10);
-                    }
-                }
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                this.fetchNotice();
-                // this.getTasks();
-            },
-            fetchNotice() {
-                let app = this;
-                noReads().then(res => {
-                    app.list = res.data.list;
-                    app.messageTotal = res.data.total;
-                    app.total = app.messageTotal + app.task.total;
-                    app.totalSum = res.data.totalSum;
-                });
-            },
-            setRead(type) {
-                this.total -= this.list[type].length;
-                this.list[type] = [];
-                switch (type) {
-                    case 'message':
-                        this.totalSum.message = 0;
-                        _clearAll();
-                }
-            },
-            showMore(key) {
-                switch (key) {
-                    default:
-                        this.showNotice = false;
-                        this.$router.push('/notify/notice');
-                }
-            },
-            getTasks() {
-                selfList({page: this.task.page, pageSize: this.task.pageSize}).then(res => {
-                    this.task.list = res.data.list;
-                    this.task.total = res.data.total;
-                    this.total = this.messageTotal + this.task.total;
-                })
-            },
-            formatTime(time) {
-                return moment(time).format('YY年MM月DD日 HH:mm');
-            },
-            showDiff(time, time2) {
-                let diff = moment(time).diff(moment(time2), 'days');
-                if (diff <= 0) {
-                    diff = moment(time).diff(moment(time2), 'hours');
-                    diff += '小时'
-                } else {
-                    diff += '天'
-                }
-                return diff;
-            },
+export default {
+  name: "HeaderNotice",
+  data() {
+    return {
+      showNotice: false,
+      loading: false,
+      total: 0,
+      messageTotal: 0,
+      totalSum: 0,
+      list: [],
+      task: {
+        page: 1,
+        pageSize: 5,
+        total: 0,
+        list: [],
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      socketAction: (state) => state.socketAction,
+      currentOrganization: (state) => state.currentOrganization,
+    }),
+  },
+  watch: {
+    socketAction(val) {
+      if (val.action === "notice") {
+        this.init();
+      } else if (val.action === "task") {
+        this.init();
+        const permission = showMsgNotification(val.title, val.msg, {
+          icon: val.data.notify.avatar,
+        });
+        if (permission === false) {
+          notice(val, "notice", "info", 10);
         }
-    }
+      }
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.fetchNotice();
+      // this.getTasks();
+    },
+    fetchNotice() {
+      let app = this;
+      noReads().then((res) => {
+        app.list = res.data.list;
+        app.messageTotal = res.data.total;
+        app.total = app.messageTotal + app.task.total;
+        app.totalSum = res.data.totalSum;
+      });
+    },
+    setRead(type) {
+      this.total -= this.list[type].length;
+      this.list[type] = [];
+      switch (type) {
+        case "message":
+          this.totalSum.message = 0;
+          _clearAll();
+      }
+    },
+    showMore(key) {
+      switch (key) {
+        default:
+          this.showNotice = false;
+          this.$router.push("/notify/notice");
+      }
+    },
+    getTasks() {
+      selfList({ page: this.task.page, pageSize: this.task.pageSize }).then(
+        (res) => {
+          this.task.list = res.data.list;
+          this.task.total = res.data.total;
+          this.total = this.messageTotal + this.task.total;
+        }
+      );
+    },
+    formatTime(time) {
+      return moment(time).format("YY年MM月DD日 HH:mm");
+    },
+    showDiff(time, time2) {
+      let diff = moment(time).diff(moment(time2), "days");
+      if (diff <= 0) {
+        diff = moment(time).diff(moment(time2), "hours");
+        diff += "小时";
+      } else {
+        diff += "天";
+      }
+      return diff;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .header-notice {
-        .ant-popover-inner-content {
-            padding: 0;
+.header-notice {
+  .ant-popover-inner-content {
+    padding: 0;
 
-            .ant-tabs-bar {
-                margin-bottom: 0 !important;
-            }
+    .ant-tabs-bar {
+      margin-bottom: 0 !important;
+    }
 
-            .ant-list {
-                .ant-list-item {
-                    padding: 12px 24px;
-                    transition: all .3s;
+    .ant-list {
+      .ant-list-item {
+        padding: 12px 24px;
+        transition: all 0.3s;
 
-                    &:hover {
-                        background: #e6f7ff;
-                    }
-                }
-            }
+        &:hover {
+          background: #e6f7ff;
         }
+      }
+    }
+  }
 
-        .header-notice-content {
-            width: 340px;
+  .header-notice-content {
+    width: 340px;
 
-            .ant-tabs-bar {
-                text-align: center;
-                margin-bottom: 5px;
-            }
+    .ant-tabs-bar {
+      text-align: center;
+      margin-bottom: 5px;
+    }
 
-            .ant-list-item-meta-title {
-                p {
-                    margin-bottom: 0;
-                    position: relative;
-                }
-            }
+    .ant-list-item-meta-title {
+      p {
+        margin-bottom: 0;
+        position: relative;
+      }
+    }
 
-            .ant-list-item-meta-description {
-                font-size: 12px;
-            }
+    .ant-list-item-meta-description {
+      font-size: 12px;
+    }
 
-            .ant-list-item:hover {
-                /*background: #e6f7ff;*/
-                cursor: pointer;
-            }
+    .ant-list-item:hover {
+      /*background: #e6f7ff;*/
+      cursor: pointer;
+    }
 
-            .notFound {
-                text-align: center;
-                padding: 73px 0 88px 0;
-                color: rgba(0, 0, 0, 0.45);
-                height: 275px;
+    .notFound {
+      text-align: center;
+      padding: 73px 0 88px 0;
+      color: rgba(0, 0, 0, 0.45);
+      height: 275px;
 
-                img {
-                    margin-bottom: 16px;
-                }
-            }
+      img {
+        margin-bottom: 16px;
+      }
+    }
 
-            .footer-action {
-                border-top: 1px solid #e8e8e8;
-                padding: 12px 0;
+    .footer-action {
+      border-top: 1px solid #e8e8e8;
+      padding: 12px 0;
 
-                .item {
-                    width: 49%;
-                    display: inline-block;
-                    text-align: center;
-                }
-            }
-        }
+      .item {
+        width: 49%;
+        display: inline-block;
+        text-align: center;
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/project/inviteProjectMember.vue b/src/components/project/inviteProjectMember.vue
index e6c7097..612edd3 100644
--- a/src/components/project/inviteProjectMember.vue
+++ b/src/components/project/inviteProjectMember.vue
@@ -1,202 +1,210 @@
 <template>
-    <div>
-        <a-modal
-                class="invite-project-member"
-                :width="500"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :footer="null"
-                @cancel="cancel"
-        >
-            <div class="header">
-                <span>账号邀请</span>
-                <a @click="createInviteLink">通过链接邀请</a>
-            </div>
-            <div class="search-content m-b">
-                <a-input v-model="keyword" placeholder="输入昵称或邮箱查找">
-                    <a-icon slot="prefix" type="search"/>
-                </a-input>
-            </div>
-            <vue-scroll>
-                <div class="member-list">
-                    <a-list
-                            class="project-list"
-                            itemLayout="horizontal"
-                            :loading="searching"
-                            :dataSource="list"
-                            :locale="{emptyText: (keyword && keyword.length > 1) ? '没有搜索到相关成员' : ''}"
-                    >
-                        <a-list-item slot="renderItem" slot-scope="item">
-                    <span slot="actions">
-                        <a-button size="small" type="dashed" icon="user-add"
-                                  v-if="!item.joined"
-                                  @click="invite(item)"
-                        >邀请</a-button>
-                        <template v-else>
-                             <a-icon type="user"></a-icon>
-                            <span> 已加入</span>
-                        </template>
-                     </span>
-                            <a-list-item-meta
-                                    :description="item.email"
-                            >
-                                <span slot="title">{{item.name}}</span>
-                                <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                            </a-list-item-meta>
-                        </a-list-item>
-                    </a-list>
-                </div>
-            </vue-scroll>
-        </a-modal>
-        <a-modal
-                class="invite-link"
-                :width="600"
-                v-model="linkInfo.modalStatus"
-                :title="linkInfo.modalTitle"
-                :footer="null"
-        >
-            <div class="header">
-                <p>链接有效日期：{{linkInfo.overTime}}</p>
-                <a-input-search
-                        size="large"
-                        v-model="linkInfo.link"
-                        v-clipboard:copy="linkInfo.link"
-                        enterButton="复制链接"
-                />
-            </div>
-        </a-modal>
-    </div>
-
+  <div>
+    <a-modal
+      class="invite-project-member"
+      :width="500"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :footer="null"
+      @cancel="cancel"
+    >
+      <div class="header">
+        <span>账号邀请</span>
+        <a @click="createInviteLink">通过链接邀请</a>
+      </div>
+      <div class="search-content m-b">
+        <a-input v-model="keyword" placeholder="输入昵称或邮箱查找">
+          <a-icon slot="prefix" type="search" />
+        </a-input>
+      </div>
+      <vue-scroll>
+        <div class="member-list">
+          <a-list
+            itemLayout="horizontal"
+            :loading="searching"
+            :dataSource="list"
+            :locale="{emptyText: (keyword && keyword.length > 1) ? '没有搜索到相关成员' : ''}"
+          >
+            <a-list-item slot="renderItem" slot-scope="item">
+              <span slot="actions">
+                <a-button
+                  size="small"
+                  type="dashed"
+                  icon="user-add"
+                  v-if="!item.joined"
+                  @click="invite(item)"
+                >邀请</a-button>
+                <template v-else>
+                  <a-icon type="user"></a-icon>
+                  <span>已加入</span>
+                </template>
+              </span>
+              <a-list-item-meta :description="item.email">
+                <span slot="title">{{item.name}}</span>
+                <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+              </a-list-item-meta>
+            </a-list-item>
+          </a-list>
+        </div>
+      </vue-scroll>
+    </a-modal>
+    <a-modal
+      class="invite-link"
+      :width="600"
+      v-model="linkInfo.modalStatus"
+      :title="linkInfo.modalTitle"
+      :footer="null"
+    >
+      <div class="header">
+        <p>链接有效日期：{{linkInfo.overTime}}</p>
+        <a-input-search
+          size="large"
+          v-model="linkInfo.link"
+          v-clipboard:copy="linkInfo.link"
+          enterButton="复制链接"
+        />
+      </div>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import moment from 'moment';
-    import {inviteMember, searchInviteMember, _listForInvite} from "../../api/projectMember";
-    import {checkResponse} from "../../assets/js/utils";
-    import {createInviteLink} from "../../api/common/common";
+import _ from "lodash";
+import moment from "moment";
+import {
+  inviteMember,
+  searchInviteMember,
+  _listForInvite,
+} from "../../api/projectMember";
+import { checkResponse } from "../../assets/js/utils";
+import { createInviteLink } from "../../api/common/common";
 
-    export default {
-        name: "inviteProjectMember",
-        props: {
-            value: {
-                type: Boolean,
-                default() {
-                    return false
-                }
-            },
-            projectCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            }
-        },
-        data() {
-            return {
-                form: this.$form.createForm(this),
-                actionInfo: {
-                    modalStatus: this.value,
-                    confirmLoading: false,
-                    modalTitle: '邀请新成员',
-                },
-                linkInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '邀请成员',
-                    link: '',
-                    overTime: '',
-                },
-                keyword: '',
-                searching: false,
-                list: [],
-                // emptyText: keyword ? '没有搜索结果' : ''
-            };
-        },
-        watch: {
-            value(value) {
-                this.actionInfo.modalStatus = value;
-            },
-            keyword() {
-                this.search();
-            }
-        },
-        created() {
-            this.getMembers();
-        },
-        methods: {
-            getMembers() {
-                let app = this;
-                _listForInvite({projectCode: app.projectCode}).then(res=>{
-                    app.list = res.data;
-                });
-            },
-            invite(item) {
-                inviteMember(item.memberCode, this.projectCode).then((res) => {
-                    const success = checkResponse(res);
-                    if (success) {
-                        item.joined = true;
-                    }
-                })
-            },
-            createInviteLink() {
-                if (!this.linkInfo.link) {
-                    createInviteLink({inviteType: 'project', sourceCode: this.projectCode}).then(res => {
-                        const success = checkResponse(res);
-                        if (success) {
-                            this.linkInfo.modalStatus = true;
-                            this.linkInfo.link = window.location.href.split('#')[0] + '#/invite_from_link/' + res.data.code;
-                            this.linkInfo.overTime = moment(res.data.code.over_time).format('YYYY年M月D日 HH:mm');
-                        }
-                    });
-                }else{
-                    this.linkInfo.modalStatus = true;
-                }
-            },
-            search: _.debounce(
-                function () {
-                    if (!this.keyword) {
-                        this.list = [];
-                    }
-                    if (this.keyword.length <= 1) {
-                        this.getMembers();
-                        return false;
-                    }
-                    this.searching = true;
-                    searchInviteMember(this.keyword, this.projectCode).then(res => {
-                        this.searching = false;
-                        this.list = res.data;
-                    });
-                }, 500
-            ),
-            cancel() {
-                this.actionInfo.modalStatus = false;
-                this.$emit('input', this.actionInfo.modalStatus);
-            }
+export default {
+  name: "inviteProjectMember",
+  props: {
+    value: {
+      type: Boolean,
+      default() {
+        return false;
+      },
+    },
+    projectCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      actionInfo: {
+        modalStatus: this.value,
+        confirmLoading: false,
+        modalTitle: "邀请新成员",
+      },
+      linkInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "邀请成员",
+        link: "",
+        overTime: "",
+      },
+      keyword: "",
+      searching: false,
+      list: [],
+      // emptyText: keyword ? '没有搜索结果' : ''
+    };
+  },
+  watch: {
+    value(value) {
+      this.actionInfo.modalStatus = value;
+    },
+    keyword() {
+      this.search();
+    },
+  },
+  created() {
+    this.getMembers();
+  },
+  methods: {
+    getMembers() {
+      let app = this;
+      _listForInvite({ projectCode: app.projectCode }).then((res) => {
+        app.list = res.data;
+      });
+    },
+    invite(item) {
+      inviteMember(item.memberCode, this.projectCode).then((res) => {
+        const success = checkResponse(res);
+        if (success) {
+          item.joined = true;
         }
-    }
+      });
+    },
+    createInviteLink() {
+      if (!this.linkInfo.link) {
+        createInviteLink({
+          inviteType: "project",
+          sourceCode: this.projectCode,
+        }).then((res) => {
+          const success = checkResponse(res);
+          if (success) {
+            this.linkInfo.modalStatus = true;
+            this.linkInfo.link =
+              window.location.href.split("#")[0] +
+              "#/invite_from_link/" +
+              res.data.code;
+            this.linkInfo.overTime = moment(res.data.code.over_time).format(
+              "YYYY年M月D日 HH:mm"
+            );
+          }
+        });
+      } else {
+        this.linkInfo.modalStatus = true;
+      }
+    },
+    search: _.debounce(function () {
+      if (!this.keyword) {
+        this.list = [];
+      }
+      if (this.keyword.length <= 1) {
+        this.getMembers();
+        return false;
+      }
+      this.searching = true;
+      searchInviteMember(this.keyword, this.projectCode).then((res) => {
+        this.searching = false;
+        this.list = res.data;
+      });
+    }, 500),
+    cancel() {
+      this.actionInfo.modalStatus = false;
+      this.$emit("input", this.actionInfo.modalStatus);
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .invite-project-member {
-        .ant-modal-body {
-            padding-top: 0;
-            padding-right: 12px;
-            padding-bottom: 24px;
-            min-height: 40vh;
-        }
+.invite-project-member {
+  .ant-modal-body {
+    padding-top: 0;
+    padding-right: 12px;
+    padding-bottom: 24px;
+    min-height: 40vh;
+  }
 
-        .header {
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between;
-            padding: 12px 0;
-        }
-
-        .member-list {
-            padding-right: 12px;
-            max-height: 400px;
-        }
+  .header {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 12px 0;
+  }
 
-    }
+  .member-list {
+    padding-right: 12px;
+    max-height: 400px;
+  }
+}
 </style>
diff --git a/src/components/project/projectConfig.vue b/src/components/project/projectConfig.vue
index 3418d0f..26d140c 100644
--- a/src/components/project/projectConfig.vue
+++ b/src/components/project/projectConfig.vue
@@ -1,897 +1,987 @@
 <template>
-    <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
-        <a-tab-pane key="1">
-                    <span slot="tab">
-                        <a-icon type="heat-map"/>
-                        概览
-                    </span>
-            <div class="config-content">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目封面</p>
-                        <div class="cover-item">
-                            <template v-if="project.cover">
-                                <img class="avatar" :src="project.cover"/>
-                            </template>
-                            <span class="no-avatar" v-show="!project.cover"></span>
-                            <a-upload
-                                    name="cover"
-                                    class="cover-uploader"
-                                    :showUploadList="false"
-                                    :headers="headers"
-                                    :action="uploadAction"
-                                    :beforeUpload="beforeUpload"
-                                    @change="handleChange"
-                            >
-                                <a-button size="large" class="upload">上传新封面</a-button>
-                                <p class="upload-tips muted">最佳图片比例为300*150</p>
-                            </a-upload>
-                        </div>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目名称</p>
-                        <a-input size="large" v-model="project.name"></a-input>
-                    </div>
-                    <div class="infos">
-                        <p class="item-title">项目进度 (%)</p>
-                        <a-input-number
-                                size="large"
-                                :min="0"
-                                :max="100"
-                                v-model="project.schedule"></a-input-number>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目简介</p>
-                        <a-input type="textarea" :rows="3" size="large" placeholder="介绍一下这个项目"
-                                 v-model="project.description"></a-input>
+  <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
+    <a-tab-pane key="1">
+      <span slot="tab">
+        <a-icon type="heat-map" />概览
+      </span>
+      <div class="config-content">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目封面</p>
+            <div class="cover-item">
+              <template v-if="project.cover">
+                <img class="avatar" :src="project.cover" />
+              </template>
+              <span class="no-avatar" v-show="!project.cover"></span>
+              <a-upload
+                name="cover"
+                class="cover-uploader"
+                :showUploadList="false"
+                :headers="headers"
+                :action="uploadAction"
+                :beforeUpload="beforeUpload"
+                @change="handleChange"
+              >
+                <a-button size="large" class="upload">上传新封面</a-button>
+                <p class="upload-tips muted">最佳图片比例为300*150</p>
+              </a-upload>
+            </div>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目名称</p>
+            <a-input size="large" v-model="project.name"></a-input>
+          </div>
+          <div class="infos">
+            <p class="item-title">项目进度 (%)</p>
+            <a-input-number size="large" :min="0" :max="100" v-model="project.schedule"></a-input-number>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目简介</p>
+            <a-input
+              type="textarea"
+              :rows="3"
+              size="large"
+              placeholder="介绍一下这个项目"
+              v-model="project.description"
+            ></a-input>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目公开性</p>
+            <a-select size="large" v-model="project.private">
+              <a-select-option :key="0">公开项目（所有人都可通过链接访问，仅项目成员可编辑）</a-select-option>
+              <a-select-option :key="1">私有项目（仅项目成员可查看和编辑）</a-select-option>
+            </a-select>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目拥有者</p>
+            <div class="m-t">
+              <a-avatar :src="project.owner_avatar"></a-avatar>
+              <span class="m-l">{{project.owner_name}}</span>
+              <!--<a-button class="middle-btn pull-right" size="large">
+                                移交
+              </a-button>-->
+            </div>
+          </div>
+        </div>
+        <a-divider />
+        <div class="content-item">
+          <div class="infos">
+            <a-button
+              type="primary"
+              class="middle-btn pull-right"
+              size="large"
+              @click="saveProject"
+            >保存</a-button>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="2" forceRender>
+      <span slot="tab">
+        <a-icon type="eye" />项目偏好
+      </span>
+      <div class="config-content task-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">看板风格</p>
+            <div class="item-tips muted">切换任务看板的主题风格，内置两种风格。</div>
+            <a-radio-group @change="saveProject" v-model="project.task_board_theme">
+              <a-radio style="display: block;height: 30px;line-height: 30px" value="default">默认</a-radio>
+              <a-radio style="display: block;height: 30px;line-height: 30px" value="simple">简约</a-radio>
+            </a-radio-group>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">自动更新项目进度</p>
+            <div class="item-tips muted">根据当前任务的完成情况自动计算项目进度。</div>
+          </div>
+          <a-switch v-model="project.auto_update_schedule" @change="saveProject" />
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="3">
+      <span slot="tab">
+        <a-icon type="check-square" />任务设置
+      </span>
+      <div class="config-content task-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目ID</p>
+            <div class="item-tips muted">设置项目编号，编号将作为 ID 前缀，用以区别项目。支持 2-6 位字母。</div>
+            <a-input
+              class="prefix-input"
+              size="large"
+              placeholder="如 Pear Project 可以设置为 EP"
+              v-model="project.prefix"
+              :disabled="!project.open_prefix"
+            ></a-input>
+            <a-button
+              size="large"
+              class="middle-btn"
+              type="primary"
+              :disabled="!project.open_prefix"
+              @click="saveProject"
+            >保存</a-button>
+          </div>
+          <a-switch v-model="project.open_prefix" @change="saveProject" />
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">任务开始时间</p>
+            <div class="item-tips muted">为任务设置开始时间，更科学地规划工作。</div>
+          </div>
+          <a-switch v-model="project.open_begin_time" @change="saveProject" />
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">新任务默认开启隐私模式</p>
+            <div class="item-tips muted">对本项目内的新任务默认开启隐私模式，创建成功后仅参与者可见</div>
+          </div>
+          <a-switch v-model="project.open_task_private" @change="saveProject" />
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="4" forceRender>
+      <span slot="tab">
+        <a-icon type="deployment-unit" />任务流转
+      </span>
+      <div class="config-content">
+        <div class="content-item task-workflow">
+          <div class="infos" style="padding-right: 0">
+            <div v-show="!doTaskWorkflowView">
+              <p>
+                <a-button type="primary" icon="plus" @click="doTaskWorkflow(null)">创建规则</a-button>
+              </p>
+              <a-list
+                class="task-workflow-list"
+                itemLayout="horizontal"
+                :dataSource="taskWorkflowList"
+              >
+                <a-list-item slot="renderItem" slot-scope="item">
+                  <span slot="actions">
+                    <a-tooltip placement="top" title="编辑">
+                      <a class="muted m-r-sm" @click="doTaskWorkflow(item)">
+                        <a-icon type="edit"></a-icon>
+                      </a>
+                    </a-tooltip>
+                    <a-tooltip placement="top" title="删除">
+                      <a class="muted" @click="delTaskWorkflow(item.code)">
+                        <a-icon type="delete"></a-icon>
+                      </a>
+                    </a-tooltip>
+                  </span>
+                  <a-list-item-meta>
+                    <span slot="title">{{item.name}}</span>
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
+            </div>
+            <div v-show="doTaskWorkflowView">
+              <div class="header">
+                <p>
+                  <a-button
+                    size="large"
+                    class="middle-btn m-r-sm"
+                    @click="saveTaskWorkflow(false)"
+                  >取消</a-button>
+                  <a-button
+                    size="large"
+                    class="middle-btn"
+                    type="primary"
+                    @click="saveTaskWorkflow(true)"
+                    :disabled="!canSaveTaskWorkflow"
+                  >保存</a-button>
+                </p>
+              </div>
+              <div class="workflow-content">
+                <template v-if="!loadingWorkflowRule">
+                  <div class="workflow-rule-item">
+                    <p>规则名称</p>
+                    <a-input size="large" v-model="currentTaskWorkflowRule.taskWorkflowName"></a-input>
+                  </div>
+                  <div class="workflow-rule-item">
+                    <p>选择任务列表</p>
+                    <a-select
+                      size="large"
+                      v-model="currentTaskWorkflowRule.firstObj"
+                      @change="(value)=>workflowRuleChange(value,'firstObj')"
+                    >
+                      <a-select-option
+                        v-for="(taskStage, index) in taskStages"
+                        :value="taskStage.code"
+                        :key="taskStage.code"
+                      >{{taskStage.name}}</a-select-option>
+                    </a-select>
+                  </div>
+
+                  <template v-if="currentTaskWorkflowRule.firstObj">
+                    <div class="workflow-rule-item">
+                      <p>选择条件</p>
+                      <a-select
+                        size="large"
+                        v-model="currentTaskWorkflowRule.firstAction.action"
+                        @change="(value)=>workflowRuleChange(value,'firstAction.action')"
+                      >
+                        <a-select-option
+                          v-for="(rule, index) in taskWorkflowRuleActions"
+                          :value="rule.id"
+                          :key="rule.id"
+                        >{{rule.name}}</a-select-option>
+                      </a-select>
                     </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目公开性</p>
+
+                    <template v-if="currentTaskWorkflowRule.firstAction.action != -1">
+                      <template v-if="currentTaskWorkflowRule.firstAction.action == 3">
+                        <div class="workflow-rule-item">
+                          <p>选择执行者</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstAction.value"
+                            @change="(value)=>workflowRuleChange(value,'firstAction.value')"
+                          >
+                            <a-select-option
+                              v-for="(member, index) in projectMembers"
+                              :value="member.code"
+                              :key="member.code"
+                            >{{member.name}}</a-select-option>
+                          </a-select>
+                        </div>
+                      </template>
+
+                      <div class="workflow-rule-item">
+                        <p>选择结果</p>
                         <a-select
-                                size="large"
-                                v-model="project.private"
+                          size="large"
+                          v-model="currentTaskWorkflowRule.firstResult.action"
+                          @change="(value)=>workflowRuleChange(value,'firstResult.action')"
                         >
-                            <a-select-option :key="0">
-                                公开项目（所有人都可通过链接访问，仅项目成员可编辑）
-                            </a-select-option>
-                            <a-select-option :key="1">
-                                私有项目（仅项目成员可查看和编辑）
-                            </a-select-option>
+                          <a-select-option
+                            v-for="(type, index) in taskWorkflowRuleTypes"
+                            :value="type.id"
+                            :key="type.id"
+                          >{{type.name}}</a-select-option>
                         </a-select>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目拥有者</p>
-                        <div class="m-t">
-                            <a-avatar :src="project.owner_avatar"></a-avatar>
-                            <span class="m-l">{{project.owner_name}}</span>
-                            <!--<a-button class="middle-btn pull-right" size="large">
-                                移交
-                            </a-button>-->
+                      </div>
+
+                      <template v-if="currentTaskWorkflowRule.firstResult.action === 0">
+                        <div class="workflow-rule-item">
+                          <p>流转任务列表</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstResult.value"
+                            @change="(value)=>workflowRuleChange(value,'firstResult.value')"
+                          >
+                            <a-select-option
+                              v-for="(taskStage, index) in taskStages"
+                              :value="taskStage.code"
+                              :key="taskStage.code"
+                            >{{taskStage.name}}</a-select-option>
+                          </a-select>
                         </div>
-                    </div>
-                </div>
-                <a-divider/>
-                <div class="content-item">
-                    <div class="infos">
-                        <a-button type="primary" class="middle-btn pull-right" size="large"
-                                  @click="saveProject">
-                            保存
-                        </a-button>
-                    </div>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="2" forceRender>
-             <span slot="tab">
-                 <a-icon type="eye"/>
-                 项目偏好
-             </span>
-            <div class="config-content task-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">看板风格</p>
-                        <div class="item-tips muted">切换任务看板的主题风格，内置两种风格。</div>
-                        <a-radio-group @change="saveProject" v-model="project.task_board_theme">
-                            <a-radio style="display: block;height: 30px;line-height: 30px" value="default">默认</a-radio>
-                            <a-radio style="display: block;height: 30px;line-height: 30px" value="simple">简约</a-radio>
-                        </a-radio-group>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">自动更新项目进度</p>
-                        <div class="item-tips muted">根据当前任务的完成情况自动计算项目进度。</div>
-                    </div>
-                    <a-switch v-model="project.auto_update_schedule" @change="saveProject"/>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="3">
-                    <span slot="tab">
-                        <a-icon type="check-square"/>
-                        任务设置
-                    </span>
-            <div class="config-content task-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目ID</p>
-                        <div class="item-tips muted">设置项目编号，编号将作为 ID 前缀，用以区别项目。支持 2-6 位字母。</div>
-                        <a-input class="prefix-input" size="large" placeholder="如 Pear Project 可以设置为 EP"
-                                 v-model="project.prefix"
-                                 :disabled="!project.open_prefix"></a-input>
-                        <a-button size="large" class="middle-btn" type="primary"
-                                  :disabled="!project.open_prefix" @click="saveProject">保存
-                        </a-button>
-                    </div>
-                    <a-switch v-model="project.open_prefix" @change="saveProject"/>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">任务开始时间</p>
-                        <div class="item-tips muted">为任务设置开始时间，更科学地规划工作。</div>
-                    </div>
-                    <a-switch v-model="project.open_begin_time" @change="saveProject"/>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">新任务默认开启隐私模式</p>
-                        <div class="item-tips muted">对本项目内的新任务默认开启隐私模式，创建成功后仅参与者可见</div>
-                    </div>
-                    <a-switch v-model="project.open_task_private" @change="saveProject"/>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="4" forceRender>
-             <span slot="tab">
-                <a-icon type="deployment-unit"/>
-                 任务流转
-             </span>
-            <div class="config-content">
-                <div class="content-item task-workflow">
-                    <div class="infos" style="padding-right: 0">
-                        <div v-show="!doTaskWorkflowView">
-                            <p>
-                                <a-button type="primary" icon="plus" @click="doTaskWorkflow(null)">创建规则</a-button>
-                            </p>
-                            <a-list
-                                    class="task-workflow-list"
-                                    itemLayout="horizontal"
-                                    :dataSource="taskWorkflowList"
+                        <template v-if="currentTaskWorkflowRule.firstResult.value">
+                          <div class="workflow-rule-item">
+                            <p>选择执行者</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.lastResult.value"
+                              @change="(value)=>workflowRuleChange(value,'lastResult.value')"
                             >
-                                <a-list-item slot="renderItem" slot-scope="item">
-                                <span slot="actions">
-                                     <a-tooltip placement="top"
-                                                title="编辑">
-                                        <a class="muted m-r-sm" @click="doTaskWorkflow(item)"><a-icon
-                                                                                               type="edit"></a-icon></a>
-                                    </a-tooltip>
-                                     <a-tooltip placement="top"
-                                                title="删除">
-                                         <a class="muted" @click="delTaskWorkflow(item.code)">
-                                             <a-icon type="delete"></a-icon>
-                                         </a>
-                                    </a-tooltip>
-                                </span>
-                                    <a-list-item-meta
-                                    >
-                                        <span slot="title">{{item.name}}</span>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                        <div v-show="doTaskWorkflowView">
-                            <div class="header">
-                                <p>
-                                    <a-button size="large" class="middle-btn m-r-sm" @click="saveTaskWorkflow(false)">
-                                        取消
-                                    </a-button>
-                                    <a-button size="large" class="middle-btn" type="primary"
-                                              @click="saveTaskWorkflow(true)" :disabled="!canSaveTaskWorkflow">保存
-                                    </a-button>
-                                </p>
-                            </div>
-                            <div class="workflow-content">
-                                <template v-if="!loadingWorkflowRule">
-                                    <div class="workflow-rule-item">
-                                        <p>
-                                            规则名称
-                                        </p>
-                                        <a-input size="large" v-model="currentTaskWorkflowRule.taskWorkflowName"></a-input>
-                                    </div>
-                                    <div class="workflow-rule-item">
-                                        <p>选择任务列表</p>
-                                        <a-select size="large" v-model="currentTaskWorkflowRule.firstObj"
-                                                  @change="(value)=>workflowRuleChange(value,'firstObj')">
-                                            <a-select-option v-for="(taskStage, index) in taskStages"
-                                                             :value="taskStage.code" :key="taskStage.code">
-                                                {{taskStage.name}}
-                                            </a-select-option>
-                                        </a-select>
-                                    </div>
-
-                                    <template v-if="currentTaskWorkflowRule.firstObj">
-                                        <div class="workflow-rule-item">
-                                            <p>选择条件</p>
-                                            <a-select size="large" v-model="currentTaskWorkflowRule.firstAction.action"
-                                                      @change="(value)=>workflowRuleChange(value,'firstAction.action')">
-                                                <a-select-option v-for="(rule, index) in taskWorkflowRuleActions"
-                                                                 :value="rule.id" :key="rule.id">{{rule.name}}
-                                                </a-select-option>
-                                            </a-select>
-                                        </div>
-
-                                        <template v-if="currentTaskWorkflowRule.firstAction.action != -1">
-                                            <template v-if="currentTaskWorkflowRule.firstAction.action == 3">
-                                                <div class="workflow-rule-item">
-                                                    <p>选择执行者</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstAction.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstAction.value')">
-                                                        <a-select-option v-for="(member, index) in projectMembers"
-                                                                         :value="member.code" :key="member.code">
-                                                            {{member.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-                                            </template>
-
-                                            <div class="workflow-rule-item">
-                                                <p>选择结果</p>
-                                                <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.action"
-                                                          @change="(value)=>workflowRuleChange(value,'firstResult.action')">
-                                                    <a-select-option v-for="(type, index) in taskWorkflowRuleTypes"
-                                                                     :value="type.id" :key="type.id">{{type.name}}
-                                                    </a-select-option>
-                                                </a-select>
-                                            </div>
-
-                                            <template v-if="currentTaskWorkflowRule.firstResult.action === 0">
-                                                <div class="workflow-rule-item">
-                                                    <p>流转任务列表</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstResult.value')">
-                                                        <a-select-option v-for="(taskStage, index) in taskStages"
-                                                                         :value="taskStage.code" :key="taskStage.code">
-                                                            {{taskStage.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-                                                <template v-if="currentTaskWorkflowRule.firstResult.value">
-                                                    <div class="workflow-rule-item">
-                                                        <p>选择执行者</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.lastResult.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'lastResult.value')">
-                                                            <a-select-option v-for="(member, index) in projectMembers"
-                                                                             :value="member.code" :key="member.code">
-                                                                {{member.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                                <template>
-                                                    <div class="workflow-rule-item">
-                                                        <p>修改任务状态</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.state.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'state.value')">
-                                                            <a-select-option v-for="(state, index) in taskStates"
-                                                                             :value="state.id" :key="state.id">
-                                                                {{state.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                            </template>
-                                            <template v-if="currentTaskWorkflowRule.firstResult.action === 3">
-                                                <div class="workflow-rule-item">
-                                                    <p>选择执行者</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstAction.action')">
-                                                        <a-select-option v-for="(member, index) in projectMembers"
-                                                                         :value="member.code" :key="member.code">
-                                                            {{member.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-
-                                                <template v-if="currentTaskWorkflowRule.firstResult.value">
-                                                    <div class="workflow-rule-item">
-                                                        <p>流转任务列表</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.lastResult.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'lastResult.value')">
-                                                            <a-select-option v-for="(taskStage, index) in taskStages"
-                                                                             :value="taskStage.code" :key="taskStage.code">
-                                                                {{taskStage.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                                <template>
-                                                    <div class="workflow-rule-item">
-                                                        <p>修改任务状态</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.state.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'state.value')">
-                                                            <a-select-option v-for="(state, index) in taskStates"
-                                                                             :value="state.id" :key="state.id">
-                                                                {{state.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                            </template>
-                                        </template>
-
-                                    </template>
-                                </template>
-                                <div class="text-center">
-                                    <a-spin :spinning="loadingWorkflowRule"></a-spin>
-                                </div>
-                            </div>
+                              <a-select-option
+                                v-for="(member, index) in projectMembers"
+                                :value="member.code"
+                                :key="member.code"
+                              >{{member.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                        <template>
+                          <div class="workflow-rule-item">
+                            <p>修改任务状态</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.state.value"
+                              @change="(value)=>workflowRuleChange(value,'state.value')"
+                            >
+                              <a-select-option
+                                v-for="(state, index) in taskStates"
+                                :value="state.id"
+                                :key="state.id"
+                              >{{state.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                      </template>
+                      <template v-if="currentTaskWorkflowRule.firstResult.action === 3">
+                        <div class="workflow-rule-item">
+                          <p>选择执行者</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstResult.value"
+                            @change="(value)=>workflowRuleChange(value,'firstAction.action')"
+                          >
+                            <a-select-option
+                              v-for="(member, index) in projectMembers"
+                              :value="member.code"
+                              :key="member.code"
+                            >{{member.name}}</a-select-option>
+                          </a-select>
                         </div>
-                    </div>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="5">
-                    <span slot="tab">
-                        <a-icon type="ellipsis"/>
-                        更多
-                    </span>
-            <div class="config-content more-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目操作</p>
-                        <div class="item-tips muted">您可以执行以下操作</div>
-                        <a-button size="large" class="middle-btn" @click="archiveProject">
-                            <span v-if="project.archive">取消归档</span>
-                            <span v-if="!project.archive">归档项目</span>
-                        </a-button>
-                        <a-button size="large" class="middle-btn" @click="quitProject">退出</a-button>
-                        <a-button size="large" class="middle-btn" type="danger" @click="delProject">
-                            <span v-if="project.deleted">恢复项目</span>
-                            <span v-if="!project.deleted">移至回收站</span>
-                        </a-button>
-                    </div>
+
+                        <template v-if="currentTaskWorkflowRule.firstResult.value">
+                          <div class="workflow-rule-item">
+                            <p>流转任务列表</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.lastResult.value"
+                              @change="(value)=>workflowRuleChange(value,'lastResult.value')"
+                            >
+                              <a-select-option
+                                v-for="(taskStage, index) in taskStages"
+                                :value="taskStage.code"
+                                :key="taskStage.code"
+                              >{{taskStage.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                        <template>
+                          <div class="workflow-rule-item">
+                            <p>修改任务状态</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.state.value"
+                              @change="(value)=>workflowRuleChange(value,'state.value')"
+                            >
+                              <a-select-option
+                                v-for="(state, index) in taskStates"
+                                :value="state.id"
+                                :key="state.id"
+                              >{{state.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                      </template>
+                    </template>
+                  </template>
+                </template>
+                <div class="text-center">
+                  <a-spin :spinning="loadingWorkflowRule"></a-spin>
                 </div>
+              </div>
             </div>
-        </a-tab-pane>
-    </a-tabs>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="5">
+      <span slot="tab">
+        <a-icon type="ellipsis" />更多
+      </span>
+      <div class="config-content more-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目操作</p>
+            <div class="item-tips muted">您可以执行以下操作</div>
+            <a-button size="large" class="middle-btn" @click="archiveProject">
+              <span v-if="project.archive">取消归档</span>
+              <span v-if="!project.archive">归档项目</span>
+            </a-button>
+            <a-button size="large" class="middle-btn" @click="quitProject">退出</a-button>
+            <a-button size="large" class="middle-btn" type="danger" @click="delProject">
+              <span v-if="project.deleted">恢复项目</span>
+              <span v-if="!project.deleted">移至回收站</span>
+            </a-button>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+  </a-tabs>
 </template>
 
 <script>
-    import {read as getProject, doData, archive, recycle, recoveryArchive, recovery, quit} from "../../api/project";
-    import {
-        _getTaskWorkflowRules,
-        list as getTaskWorkflowList,
-        save as saveTaskWorkflow,
-        edit as EditTaskWorkflow,
-        del as delTaskWorkflow
-    } from "../../api/taskWorkflow";
-    import {_getAll as getTaskStages} from "../../api/taskStages";
-    import {list as getProjectMembers} from "../../api/projectMember";
-
-    import {notice} from "../../assets/js/notice";
-    import {checkResponse, getApiUrl, getAuthorization, getBase64} from "../../assets/js/utils";
-
-    export default {
-        name: "projectConfig",
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
+import {
+  read as getProject,
+  doData,
+  archive,
+  recycle,
+  recoveryArchive,
+  recovery,
+  quit,
+} from "../../api/project";
+import {
+  _getTaskWorkflowRules,
+  list as getTaskWorkflowList,
+  save as saveTaskWorkflow,
+  edit as EditTaskWorkflow,
+  del as delTaskWorkflow,
+} from "../../api/taskWorkflow";
+import { _getAll as getTaskStages } from "../../api/taskStages";
+import { list as getProjectMembers } from "../../api/projectMember";
+
+import { notice } from "../../assets/js/notice";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+  getBase64,
+} from "../../assets/js/utils";
+
+export default {
+  name: "projectConfig",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      /*项目设置*/
+      loading: false,
+      tabKey: "1",
+      project: {},
+      taskWorkflowList: [],
+      doTaskWorkflowView: false,
+      loadingWorkflowRule: false,
+      taskWorkflow: null,
+      taskWorkflowRuleList: [],
+      currentTaskWorkflowRule: {
+        taskWorkflowName: "",
+        firstObj: "", //哪个列表任务
+        firstAction: {
+          //做什么
+          action: -1,
+          value: "",
         },
-        data() {
-            return {
-                /*项目设置*/
-                loading: false,
-                tabKey: '1',
-                project: {},
-                taskWorkflowList: [],
-                doTaskWorkflowView: false,
-                loadingWorkflowRule: false,
-                taskWorkflow: null,
-                taskWorkflowRuleList: [],
-                currentTaskWorkflowRule: {
-                    taskWorkflowName: '',
-                    firstObj: '',//哪个列表任务
-                    firstAction: {//做什么
-                        action: -1,
-                        value: ''
-                    },
-                    firstResult: {//就
-                        action: -1,
-                        value: ''
-                    },
-                    lastResult: {//最后
-                        action: -1,
-                        value: ''
-                    },
-                    state: {//任务状态
-                        action: -1,
-                        value: -1
-                    },
-                },
-                taskWorkflowRuleActions: [
-                    {id: -1, name: "请选择"},
-                    {id: 0, name: "增加任务、被移动"},
-                    {id: 1, name: "被完成"},
-                    {id: 2, name: "被重做"},
-                    {id: 3, name: "设置执行人"},
-                    // {id: 4, name: "截止时间"},
-                    // {id: 5, name: "优先级"},
-                ],
-                taskWorkflowRuleTypes: [
-                    {id: -1, name: "请选择"},
-                    {id: 0, name: "自动流转到"},
-                    {id: 3, name: "默认指派给"},
-                ],
-                taskStates: [
-                    {id: -1, name: "不做修改"},
-                    {id: 1, name: "已完成"},
-                    {id: 2, name: "未完成"},
-                ],
-                projectMembers: [],
-                taskStages: [],
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/project/uploadCover'),
-            }
+        firstResult: {
+          //就
+          action: -1,
+          value: "",
         },
-        computed: {
-            headers() {
-                return getAuthorization();
-            },
-            canSaveTaskWorkflow() {
-                return this.currentTaskWorkflowRule.taskWorkflowName.trim() && this.currentTaskWorkflowRule.firstObj && this.currentTaskWorkflowRule.firstAction.action != -1 && this.currentTaskWorkflowRule.firstResult.action != -1 && this.currentTaskWorkflowRule.firstResult.value;
-            }
+        lastResult: {
+          //最后
+          action: -1,
+          value: "",
         },
-        watch: {
-            code() {
-                this.getProject();
+        state: {
+          //任务状态
+          action: -1,
+          value: -1,
+        },
+      },
+      taskWorkflowRuleActions: [
+        { id: -1, name: "请选择" },
+        { id: 0, name: "增加任务、被移动" },
+        { id: 1, name: "被完成" },
+        { id: 2, name: "被重做" },
+        { id: 3, name: "设置执行人" },
+        // {id: 4, name: "截止时间"},
+        // {id: 5, name: "优先级"},
+      ],
+      taskWorkflowRuleTypes: [
+        { id: -1, name: "请选择" },
+        { id: 0, name: "自动流转到" },
+        { id: 3, name: "默认指派给" },
+      ],
+      taskStates: [
+        { id: -1, name: "不做修改" },
+        { id: 1, name: "已完成" },
+        { id: 2, name: "未完成" },
+      ],
+      projectMembers: [],
+      taskStages: [],
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/project/uploadCover"),
+    };
+  },
+  computed: {
+    headers() {
+      return getAuthorization();
+    },
+    canSaveTaskWorkflow() {
+      return (
+        this.currentTaskWorkflowRule.taskWorkflowName.trim() &&
+        this.currentTaskWorkflowRule.firstObj &&
+        this.currentTaskWorkflowRule.firstAction.action != -1 &&
+        this.currentTaskWorkflowRule.firstResult.action != -1 &&
+        this.currentTaskWorkflowRule.firstResult.value
+      );
+    },
+  },
+  watch: {
+    code() {
+      this.getProject();
+    },
+  },
+  created() {
+    this.getProject();
+    this.getTaskWorkflowList();
+  },
+  methods: {
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+        this.project.open_prefix = !!res.data.open_prefix;
+        this.project.open_begin_time = !!res.data.open_begin_time;
+        this.project.open_task_private = !!res.data.open_task_private;
+        this.project.auto_update_schedule = !!res.data.auto_update_schedule;
+      });
+    },
+    getTaskWorkflowList() {
+      getTaskWorkflowList({ projectCode: this.code }).then((res) => {
+        this.taskWorkflowList = res.data;
+      });
+    },
+    saveProject() {
+      const project = this.project;
+      doData({
+        projectCode: project.code,
+        name: project.name,
+        description: project.description,
+        cover: project.cover,
+        private: project.private,
+        prefix: project.prefix,
+        task_board_theme: project.task_board_theme,
+        open_prefix: Number(project.open_prefix),
+        open_begin_time: Number(project.open_begin_time),
+        open_task_private: Number(project.open_task_private),
+        schedule: Number(project.schedule),
+        auto_update_schedule: Number(project.auto_update_schedule),
+      }).then((res) => {
+        if (!checkResponse(res)) {
+          return;
+        }
+        this.$emit("update", this.project);
+        notice(
+          {
+            title: "保存成功",
+          },
+          "notice",
+          "success"
+        );
+      });
+    },
+    archiveProject() {
+      let app = this;
+      if (!app.project.archive) {
+        this.$confirm({
+          title: "归档项目",
+          content: `一旦将项目「${this.project.name}」归档，本项目和所含信息将会被移到「归档项目」内，其中的内容依然会被统计和搜索收录，归档项目可以随时恢复并继续使用。`,
+          okText: "归档",
+          okType: "danger",
+          cancelText: `再想想`,
+          onOk() {
+            archive(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/archive");
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.project.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/list/my");
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    delProject() {
+      let app = this;
+      if (!app.project.deleted) {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.project.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/recycle");
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        this.$confirm({
+          title: "确定恢复项目？",
+          content: `恢复「${this.project.name}」后就可以正常使用了`,
+          okText: "恢复项目",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recovery(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/list/my");
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    quitProject() {
+      let app = this;
+      this.$confirm({
+        title: "退出项目",
+        content: `一旦你退出了该项目，你将不能查看任何关于该项目的信息。退出项目后，如果想重新加入，请联系项目管理员。`,
+        okText: "确定退出",
+        okType: "primary",
+        cancelText: "再想想",
+        onOk() {
+          quit(app.code).then((res) => {
+            if (!checkResponse(res)) {
+              return;
             }
+            app.$router.replace("/project/list/my");
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.getProject();
+      });
+    },
+    doTaskWorkflow(taskWorkflow = null) {
+      this.getTaskStages();
+      this.getProjectMembers();
+      this.taskWorkflow = taskWorkflow;
+      if (taskWorkflow) {
+        this.loadingWorkflowRule = true;
+        this.currentTaskWorkflowRule.taskWorkflowName = taskWorkflow.name;
+        this.getTaskWorkflowRules(taskWorkflow.code);
+      } else {
+        this.currentTaskWorkflowRule = {
+          taskWorkflowName: "",
+          firstObj: "", //哪个列表任务
+          firstAction: {
+            //做什么
+            action: -1,
+            value: "",
+          },
+          firstResult: {
+            //就
+            action: -1,
+            value: "",
+          },
+          lastResult: {
+            //最后
+            action: -1,
+            value: "",
+          },
+          state: {
+            //任务状态
+            action: -1,
+            value: -1,
+          },
+          taskStates: [
+            { id: -1, name: "不做修改" },
+            { id: 1, name: "已完成" },
+            { id: 2, name: "未完成" },
+          ],
+        };
+      }
+      this.doTaskWorkflowView = true;
+    },
+    saveTaskWorkflow(save = false) {
+      if (this.currentTaskWorkflowRule.firstResult.action) {
+        this.currentTaskWorkflowRule.lastResult.action = 0;
+      } else {
+        this.currentTaskWorkflowRule.lastResult.action = 3;
+      }
+      let submitData = {
+        taskWorkflowName: this.currentTaskWorkflowRule.taskWorkflowName,
+        taskWorkflowRules: JSON.stringify(this.currentTaskWorkflowRule),
+      };
+      if (save) {
+        // save
+        if (this.taskWorkflow) {
+          submitData.taskWorkflowCode = this.taskWorkflow.code;
+          EditTaskWorkflow(submitData).then((res) => {
             this.getTaskWorkflowList();
-        },
-        methods: {
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                    this.project.open_prefix = !!res.data.open_prefix;
-                    this.project.open_begin_time = !!res.data.open_begin_time;
-                    this.project.open_task_private = !!res.data.open_task_private;
-                    this.project.auto_update_schedule = !!res.data.auto_update_schedule;
-                });
-            },
-            getTaskWorkflowList() {
-                getTaskWorkflowList({projectCode: this.code}).then(res => {
-                    this.taskWorkflowList = res.data;
-                });
-            },
-            saveProject() {
-                const project = this.project;
-                doData({
-                    projectCode: project.code,
-                    name: project.name,
-                    description: project.description,
-                    cover: project.cover,
-                    private: project.private,
-                    prefix: project.prefix,
-                    task_board_theme: project.task_board_theme,
-                    open_prefix: Number(project.open_prefix),
-                    open_begin_time: Number(project.open_begin_time),
-                    open_task_private: Number(project.open_task_private),
-                    schedule: Number(project.schedule),
-                    auto_update_schedule: Number(project.auto_update_schedule),
-                }).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.$emit('update', this.project);
-                    notice({
-                        title: '保存成功',
-                    }, 'notice', 'success');
-                })
-            },
-            archiveProject() {
-                let app = this;
-                if (!app.project.archive) {
-                    this.$confirm({
-                        title: '归档项目',
-                        content: `一旦将项目「${this.project.name}」归档，本项目和所含信息将会被移到「归档项目」内，其中的内容依然会被统计和搜索收录，归档项目可以随时恢复并继续使用。`,
-                        okText: '归档',
-                        okType: 'danger',
-                        cancelText: `再想想`,
-                        onOk() {
-                            archive(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/archive');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                        content: `取消归档「${this.project.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/list/my');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            delProject() {
-                let app = this;
-                if (!app.project.deleted) {
-                    this.$confirm({
-                        title: '确定放入回收站？',
-                        content: `一旦将项目「${this.project.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                        okText: '放入回收站',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            recycle(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/recycle');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else {
-                    this.$confirm({
-                        title: '确定恢复项目？',
-                        content: `恢复「${this.project.name}」后就可以正常使用了`,
-                        okText: '恢复项目',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recovery(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/list/my');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            quitProject() {
-                let app = this;
-                this.$confirm({
-                    title: '退出项目',
-                    content: `一旦你退出了该项目，你将不能查看任何关于该项目的信息。退出项目后，如果想重新加入，请联系项目管理员。`,
-                    okText: '确定退出',
-                    okType: 'primary',
-                    cancelText: '再想想',
-                    onOk() {
-                        quit(app.code).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            app.$router.replace('/project/list/my');
-
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            doTaskWorkflow(taskWorkflow = null) {
-                this.getTaskStages();
-                this.getProjectMembers();
-                this.taskWorkflow = taskWorkflow;
-                if (taskWorkflow) {
-                    this.loadingWorkflowRule = true;
-                    this.currentTaskWorkflowRule.taskWorkflowName = taskWorkflow.name;
-                    this.getTaskWorkflowRules(taskWorkflow.code);
-                }else{
-                    this.currentTaskWorkflowRule = {
-                        taskWorkflowName: '',
-                        firstObj: '',//哪个列表任务
-                        firstAction: {//做什么
-                            action: -1,
-                            value: ''
-                        },
-                        firstResult: {//就
-                            action: -1,
-                            value: ''
-                        },
-                        lastResult: {//最后
-                            action: -1,
-                            value: ''
-                        },
-                        state: {//任务状态
-                            action: -1,
-                            value: -1
-                        },
-                        taskStates: [
-                            {id: -1, name: "不做修改"},
-                            {id: 1, name: "已完成"},
-                            {id: 2, name: "未完成"},
-                        ],
-                    };
-                }
-                this.doTaskWorkflowView = true;
-            },
-            saveTaskWorkflow(save = false) {
-                if (this.currentTaskWorkflowRule.firstResult.action) {
-                    this.currentTaskWorkflowRule.lastResult.action = 0;
+          });
+        } else {
+          submitData.projectCode = this.code;
+          saveTaskWorkflow(submitData).then((res) => {
+            this.getTaskWorkflowList();
+          });
+        }
+      }
+      this.doTaskWorkflowView = false;
+    },
+    getTaskStages() {
+      getTaskStages({ projectCode: this.code }).then((res) => {
+        let list = [
+          {
+            code: "",
+            name: "不选择",
+          },
+        ];
+        res.data.forEach((v) => {
+          list.push(v);
+        });
+        this.taskStages = list;
+      });
+    },
+    getTaskWorkflowRules(taskWorkflowCode) {
+      _getTaskWorkflowRules({ taskWorkflowCode: taskWorkflowCode }).then(
+        (res) => {
+          this.loadingWorkflowRule = false;
+          const rules = res.data;
+          this.taskWorkflowRuleList = rules;
+          if (rules) {
+            this.currentTaskWorkflowRule.firstObj = rules[0].object_code;
+            this.currentTaskWorkflowRule.firstAction.action = rules[1].action;
+            this.currentTaskWorkflowRule.firstAction.value =
+              rules[1].object_code;
+
+            this.currentTaskWorkflowRule.firstResult.action = rules[2].action;
+            this.currentTaskWorkflowRule.firstResult.value =
+              rules[2].object_code;
+
+            if (rules.length >= 4) {
+              if (!rules[3].object_code) {
+                this.currentTaskWorkflowRule.state.action = rules[3].action;
+                this.currentTaskWorkflowRule.state.value = rules[3].action;
+              } else {
+                this.currentTaskWorkflowRule.lastResult.action =
+                  rules[3].action;
+                this.currentTaskWorkflowRule.lastResult.value =
+                  rules[3].object_code;
+              }
+              if (rules.length >= 5) {
+                if (!rules[4].object_code) {
+                  this.currentTaskWorkflowRule.state.action = rules[4].action;
+                  this.currentTaskWorkflowRule.state.value = rules[4].action;
                 } else {
-                    this.currentTaskWorkflowRule.lastResult.action = 3;
-                }
-                let submitData = {
-                    taskWorkflowName: this.currentTaskWorkflowRule.taskWorkflowName,
-                    taskWorkflowRules: JSON.stringify(this.currentTaskWorkflowRule)
-                };
-                if (save) {
-                    // save
-                    if (this.taskWorkflow) {
-                        submitData.taskWorkflowCode = this.taskWorkflow.code;
-                        EditTaskWorkflow(submitData).then(res => {
-                            this.getTaskWorkflowList();
-
-                        });
-                    } else {
-                        submitData.projectCode = this.code;
-                        saveTaskWorkflow(submitData).then(res => {
-                            this.getTaskWorkflowList();
-                        });
-                    }
-
-                }
-                this.doTaskWorkflowView = false;
-            },
-            getTaskStages() {
-                getTaskStages({projectCode: this.code}).then(res => {
-                    let list = [{
-                        code: '',
-                        name: '不选择'
-                    }];
-                    res.data.forEach(v => {
-                        list.push(v);
-                    });
-                    this.taskStages = list;
-                })
-            },
-            getTaskWorkflowRules(taskWorkflowCode) {
-                _getTaskWorkflowRules({taskWorkflowCode: taskWorkflowCode}).then(res => {
-                    this.loadingWorkflowRule = false;
-                    const rules = res.data;
-                    this.taskWorkflowRuleList = rules;
-                    if (rules) {
-                        this.currentTaskWorkflowRule.firstObj = rules[0].object_code;
-                        this.currentTaskWorkflowRule.firstAction.action = rules[1].action;
-                        this.currentTaskWorkflowRule.firstAction.value = rules[1].object_code;
-
-                        this.currentTaskWorkflowRule.firstResult.action = rules[2].action;
-                        this.currentTaskWorkflowRule.firstResult.value = rules[2].object_code;
-
-                        if (rules.length >= 4) {
-                            if (!rules[3].object_code) {
-                                this.currentTaskWorkflowRule.state.action = rules[3].action;
-                                this.currentTaskWorkflowRule.state.value = rules[3].action;
-                            }else{
-                                this.currentTaskWorkflowRule.lastResult.action = rules[3].action;
-                                this.currentTaskWorkflowRule.lastResult.value = rules[3].object_code;
-                            }
-                            if (rules.length >= 5) {
-                                if (!rules[4].object_code) {
-                                    this.currentTaskWorkflowRule.state.action = rules[4].action;
-                                    this.currentTaskWorkflowRule.state.value = rules[4].action;
-                                }else{
-                                    this.currentTaskWorkflowRule.lastResult.action = rules[4].action;
-                                    this.currentTaskWorkflowRule.lastResult.value = rules[4].object_code;
-                                }
-                            }
-                        }
-                    }
-                })
-            },
-            delTaskWorkflow(code) {
-                let app = this;
-                this.$confirm({
-                    title: '删除规则?',
-                    content: '您确定要删除该规则吗？',
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        delTaskWorkflow({taskWorkflowCode: code}).then(res => {
-                            if (checkResponse(res)) {
-                                app.getTaskWorkflowList();
-                            }
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            getProjectMembers() {
-                getProjectMembers({projectCode: this.code, pageSize: 100}).then((res) => {
-                    let list = [{
-                        code: '',
-                        name: '不选择'
-                    }];
-                    res.data.list.forEach(v => {
-                        list.push(v);
-                    });
-                    this.projectMembers = list;
-                });
-            },
-            workflowRuleChange(value, name) {
-                console.log(value);
-                console.log(name);
-                if (name == 'firstAction.action') {
-                    this.currentTaskWorkflowRule.firstAction.value = '';
-                }
-                if (name == 'firstResult.value') {
-                    this.currentTaskWorkflowRule.lastResult.value = '';
-                }
-                if (name == 'firstResult.action') {
-                    this.currentTaskWorkflowRule.firstResult.value = '';
-                    this.currentTaskWorkflowRule.lastResult.value = '';
-                }
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    this.uploadLoading = true;
-                    return
+                  this.currentTaskWorkflowRule.lastResult.action =
+                    rules[4].action;
+                  this.currentTaskWorkflowRule.lastResult.value =
+                    rules[4].object_code;
                 }
-                if (info.file.status === 'done') {
-                    getBase64(info.file.originFileObj, () => {
-                        this.project.cover = info.file.response.data.url;
-                        this.uploadLoading = false;
-                        notice({
-                            title: '封面上传成功',
-                        }, 'notice', 'success');
-                    })
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('图片不能超过2MB!')
-                }
-                return isLt2M
+              }
+            }
+          }
+        }
+      );
+    },
+    delTaskWorkflow(code) {
+      let app = this;
+      this.$confirm({
+        title: "删除规则?",
+        content: "您确定要删除该规则吗？",
+        okText: "删除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          delTaskWorkflow({ taskWorkflowCode: code }).then((res) => {
+            if (checkResponse(res)) {
+              app.getTaskWorkflowList();
+            }
+          });
+          return Promise.resolve();
+        },
+      });
+    },
+    getProjectMembers() {
+      getProjectMembers({ projectCode: this.code, pageSize: 100 }).then(
+        (res) => {
+          let list = [
+            {
+              code: "",
+              name: "不选择",
             },
+          ];
+          res.data.list.forEach((v) => {
+            list.push(v);
+          });
+          this.projectMembers = list;
         }
-    }
+      );
+    },
+    workflowRuleChange(value, name) {
+      console.log(value);
+      console.log(name);
+      if (name == "firstAction.action") {
+        this.currentTaskWorkflowRule.firstAction.value = "";
+      }
+      if (name == "firstResult.value") {
+        this.currentTaskWorkflowRule.lastResult.value = "";
+      }
+      if (name == "firstResult.action") {
+        this.currentTaskWorkflowRule.firstResult.value = "";
+        this.currentTaskWorkflowRule.lastResult.value = "";
+      }
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        getBase64(info.file.originFileObj, () => {
+          this.project.cover = info.file.response.data.url;
+          this.uploadLoading = false;
+          notice(
+            {
+              title: "封面上传成功",
+            },
+            "notice",
+            "success"
+          );
+        });
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("图片不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .project-config-modal {
-        .ant-modal-body {
-            padding: 0;
+.project-config-modal {
+  .ant-modal-body {
+    padding: 0;
+  }
+
+  .ant-modal-body,
+  .ant-tabs,
+  .ant-tabs-bar {
+    min-height: 730px;
+    min-width: 180px;
+
+    .ant-tabs-tab {
+      padding: 12px 24px;
+    }
+  }
+
+  .ant-tabs-nav-wrap {
+    padding-top: 10px;
+  }
+
+  .ant-tabs-left-content {
+    padding-top: 18px;
+    padding-right: 24px;
+  }
+
+  .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
+    text-align: left;
+  }
+
+  .config-content {
+    .content-item {
+      display: flex;
+      justify-content: space-between;
+      flex: 1 1;
+      margin-bottom: 24px;
+
+      .infos {
+        width: 100%;
+        padding-right: 12px;
+
+        p {
+          margin-bottom: 6px;
         }
 
-        .ant-modal-body, .ant-tabs, .ant-tabs-bar {
-            min-height: 730px;
-            min-width: 180px;
-
-            .ant-tabs-tab {
-                padding: 12px 24px;
-            }
+        .item-title {
+          font-size: 16px;
         }
 
-        .ant-tabs-nav-wrap {
-            padding-top: 10px;
+        .item-tips {
+          margin-bottom: 12px;
         }
 
-        .ant-tabs-left-content {
-            padding-top: 18px;
-            padding-right: 24px;
+        .ant-select {
+          width: 100%;
         }
 
-        .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
-            text-align: left;
+        .ant-input-number-lg {
+          width: 100%;
         }
 
-        .config-content {
-            .content-item {
-                display: flex;
-                justify-content: space-between;
-                flex: 1 1;
-                margin-bottom: 24px;
-
-                .infos {
-                    width: 100%;
-                    padding-right: 12px;
-
-                    p {
-                        margin-bottom: 6px;
-                    }
-
-                    .item-title {
-                        font-size: 16px;
-                    }
-
-                    .item-tips {
-                        margin-bottom: 12px;
-                    }
-
-                    .ant-select {
-                        width: 100%;
-                    }
-
-                    .ant-input-number-lg {
-                        width: 100%;
-                    }
-
-                    .cover-item {
-                        display: flex;
-
-                        img {
-                            width: 300px;
-                            height: 150px;
-                        }
-
-                        .cover-uploader {
-                            display: block;
-                            margin-left: 24px;
-
-                            .upload-tips {
-                                margin-top: 12px;
-                            }
-                        }
-                    }
-                }
-            }
+        .cover-item {
+          display: flex;
 
-            &.task-config {
-                .content-item {
-                    padding-bottom: 24px;
-                    padding-right: 16px;
-                    border-bottom: 1px solid #e5e5e5;
-                }
+          img {
+            width: 300px;
+            height: 150px;
+          }
 
-                .prefix-input {
-                    width: 50%;
-                    margin-right: 24px;
-                }
+          .cover-uploader {
+            display: block;
+            margin-left: 24px;
+
+            .upload-tips {
+              margin-top: 12px;
             }
+          }
+        }
+      }
+    }
 
-            .task-workflow {
-                .workflow-content {
-                    margin-top: 12px;
+    &.task-config {
+      .content-item {
+        padding-bottom: 24px;
+        padding-right: 16px;
+        border-bottom: 1px solid #e5e5e5;
+      }
+
+      .prefix-input {
+        width: 50%;
+        margin-right: 24px;
+      }
+    }
 
-                    .workflow-rule-item {
-                        margin-bottom: 16px;
+    .task-workflow {
+      .workflow-content {
+        margin-top: 12px;
 
-                        p {
-                            color: rgba(0, 0, 0, 0.45);
-                        }
-                    }
-                }
-            }
+        .workflow-rule-item {
+          margin-bottom: 16px;
 
-            &.more-config {
-                .ant-btn {
-                    margin-right: 12px;
-                }
-            }
+          p {
+            color: rgba(0, 0, 0, 0.45);
+          }
         }
+      }
+    }
+
+    &.more-config {
+      .ant-btn {
+        margin-right: 12px;
+      }
     }
+  }
+}
 </style>
diff --git a/src/store/state.js b/src/store/state.js
index dcaa98d..c7bfbad 100644
--- a/src/store/state.js
+++ b/src/store/state.js
@@ -3,7 +3,7 @@ import {getStore} from "../assets/js/storage";
 const userInfo = getStore('userInfo', true);
 const theme = getStore('theme');
 export default {
-    theme: theme ? theme : 'dark',
+    theme: theme ? theme : 'light',
     logged: !!userInfo,//登录状态
     userInfo: userInfo,//用户信息
     organizationList: getStore('organizationList', true),//能查看的组织列表
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 05c4cc0..b97b0f1 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,610 +1,772 @@
 <template>
-    <div class="home-index">
-        <div class="page-header">
-            <p class="day-text muted">『 {{ yiyan.hitokoto }}』 —— 《{{ yiyan.from }}》 <a class="muted" @click="getYiYan">
-                <a-icon type="reload"/>
-            </a>
-            </p>
-            <div class="header-content" v-if="userInfo">
-                <div class="left-content">
-                    <div class="avatar">
-                        <a-avatar :size="64" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
-                    </div>
-                    <div class="user-info">
-                        <div class="title">{{helloTime}}{{ userInfo.name }}，祝你开心每一天！</div>
-                        <div class="team muted" v-if="userInfo.position">{{userInfo.position}}
-                            <template v-if="userInfo.department"> | {{ userInfo.department }}</template>
-                        </div>
+  <div class="home-index">
+    <div class="page-header">
+      <p
+        class="day-text muted"
+        v-if="yiyan"
+        :data-type="yiyan_cate[yiyan_cate_c].title"
+        :data-uuid="yiyan.uuid"
+        :href="'https://hitokoto.cn?uuid='+yiyan.uuid"
+      >
+        {{ yiyan.hitokoto }} —— {{yiyan.from_who}}《{{ yiyan.from }}》{{yiyan_cate[yiyan_cate_c].name?'['+yiyan_cate[yiyan_cate_c].name+']':''}}
+        <a
+          class="muted"
+          @click="getYiYan"
+        >
+          <a-icon type="reload" />
+        </a>
+      </p>
+      <a-row class="header-content" type="flex" justify="space-between" v-if="userInfo">
+        <a-col
+          class="left-content"
+          :span="12"
+          :xs="24"
+          :sm="8"
+          :md="12"
+          :lg="12"
+          :xl="16"
+          :xxl="18"
+        >
+          <div class="avatar">
+            <a-avatar :size="64" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
+          </div>
+          <div class="user-info">
+            <div class="title">{{helloTime}}{{ userInfo.name }}，祝你开心每一天！</div>
+            <div class="team muted" v-if="userInfo.position">
+              {{userInfo.position}}
+              <template v-if="userInfo.department">| {{ userInfo.department }}</template>
+            </div>
+          </div>
+        </a-col>
+        <a-col
+          class="right-content"
+          :span="12"
+          :xs="24"
+          :sm="16"
+          :md="12"
+          :lg="12"
+          :xl="8"
+          :xxl="6"
+        >
+          <div class="content-item">
+            <div class="item-title muted">团队人数</div>
+            <div class="item-text">
+              <span>{{accounts.total}}</span>
+            </div>
+          </div>
+          <div class="content-item">
+            <div class="item-title muted">项目总数</div>
+            <div class="item-text">
+              <span>{{projectTotal}}</span>
+            </div>
+          </div>
+          <!-- <div class="content-item">
+            <div class="item-title muted">任务数</div>
+            <div class="item-text">
+              <span>{{task.total}}</span>
+            </div>
+          </div>-->
+        </a-col>
+      </a-row>
+    </div>
+    <!--<wrapper-content :showHeader="false">-->
+    <div class="page-wrapper">
+      <a-row :gutter="24">
+        <a-col :span="12" :xs="24" :sm="24" :md="24" :lg="16" :xl="14" :xxl="14">
+          <a-card
+            class="project-list"
+            :loading="loading"
+            style="margin-bottom: 24px;"
+            :bordered="false"
+            title="进行中的项目"
+            :body-style="{ padding: 0 }"
+          >
+            <router-link to="/project/list/my" slot="extra">全部项目</router-link>
+            <a-row :gutter="0">
+              <a-col
+                class="project-card-grid"
+                :key="i"
+                v-for="(item, i) in projectList"
+                :span="8"
+                :xs="24"
+                :sm="12"
+                :md="8"
+                :lg="8"
+                :xl="8"
+                :xxl="8"
+              >
+                <a-card
+                  :bordered="false"
+                  :body-style="{ padding: 0 }"
+                  @click="routerLink('/project/space/task/' + item.code)"
+                >
+                  <a-card-meta>
+                    <div slot="title" class="card-title">
+                      <a-avatar size="small" :src="item.cover" />
+                      <router-link :to="'/project/space/task/' + item.code">
+                        <a-icon
+                          type="star"
+                          theme="filled"
+                          style="color: #ffaf38;margin-right: 6px;"
+                          v-show="item.collected"
+                        />
+                        {{ item.name }}
+                      </router-link>
                     </div>
-                </div>
-                <div class="right-content">
-                    <!--<div class="content-item">
-                        <div class="item-title muted">
-                            任务数
-                        </div>
-                        <div class="item-text">
-                            <span>{{task.total}}</span>
-                        </div>
-                    </div>-->
-                    <div class="content-item">
-                        <div class="item-title muted">
-                            团队人数
-                        </div>
-                        <div class="item-text">
-                            <span>{{accounts.total}}</span>
-                        </div>
+                    <div slot="description" class="card-description">
+                      <a-tooltip :mouseEnterDelay="0.3" :title="item.description">
+                        <span class="description-text">
+                          <span v-if="item.description">{{ item.description }}</span>
+                          <span v-else>暂无介绍</span>
+                        </span>
+                      </a-tooltip>
                     </div>
-                    <div class="content-item">
-                        <div class="item-title muted">
-                            项目总数
-                        </div>
-                        <div class="item-text">
-                            <span>{{projectTotal}}</span>
-                        </div>
+                  </a-card-meta>
+                  <a-tooltip
+                    placement="right"
+                    :mouseEnterDelay="0.3"
+                    :title="`当前进度：${item.schedule}%`"
+                  >
+                    <a-progress :strokeWidth="2" :showInfo="false" :percent="item.schedule" />
+                  </a-tooltip>
+                  <div class="project-item">
+                    <a href="/#/">{{ item.owner_name }}</a>
+                    <span class="datetime">{{ formatTime(item.create_time) }}</span>
+                  </div>
+                </a-card>
+              </a-col>
+              <p class="muted text-center m-t-md m-b-md" v-if="!projectList.length">暂无项目</p>
+            </a-row>
+          </a-card>
+
+          <a-card class="activities-list" :loading="loading" title="动态" :bordered="false">
+            <a-list>
+              <a-list-item :key="index" v-for="(item, index) in activities">
+                <a-list-item-meta>
+                  <a-avatar slot="avatar" :src="item.member_avatar" />
+                  <div slot="title">
+                    <a-row :gutter="0">
+                      <a-col :span="12" :xs="24" :sm="24" :md="11" :lg="12" :xl="12" :xxl="12">
+                        <span>{{ item.member_name }}</span>
+                        <span v-if="item.is_comment == 0">
+                          <span v-html="item.remark"></span>
+                        </span>&nbsp;
+                        <template v-if="item.is_comment == 1">
+                          发表了评论
+                          <p class="comment-text">{{ item.content }}</p>
+                        </template>
+                      </a-col>
+                      <a-col :span="12" :xs="24" :sm="24" :md="13" :lg="12" :xl="12" :xxl="12">
+                        <router-link
+                          target="_blank"
+                          :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
+                        >「 {{ item.task_name }} 」</router-link>
+                      </a-col>
+                    </a-row>
+                  </div>
+                  <div slot="description">
+                    <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
+                    {{ formatTime(item.create_time) }} -
+                    <router-link
+                      target="_blank"
+                      :to="`/project/space/task/${item.project_code}`"
+                      class="muted"
+                    >{{item.project_name}}</router-link>
+                    <!--</a-tooltip>-->
+                  </div>
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+          </a-card>
+        </a-col>
+
+        <a-col style="padding: 0 12px" :xs="24" :sm="24" :md="24" :lg="8" :xl="10" :xxl="10">
+          <a-card class="tasks-list" style="margin-bottom: 24px" :bordered="false">
+            <div slot="title">
+              <div class="flex ant-row-flex-space-between ant-row-flex-middle">
+                <span>我的任务({{task.total}})</span>
+                <a-select
+                  v-model="task.done"
+                  @select="taskSelectChange"
+                  :defaultActiveFirstOption="false"
+                >
+                  <a-select-option :key="0">未完成</a-select-option>
+                  <a-select-option :key="1">已完成</a-select-option>
+                </a-select>
+              </div>
+            </div>
+            <a-tabs
+              defaultActiveKey="1"
+              size="small"
+              :tabBarGutter="0"
+              :animated="false"
+              @change="taskTabChange"
+            >
+              <a-tab-pane key="1">
+                <span slot="tab">
+                  <a-icon type="bars" />我执行的
+                </span>
+              </a-tab-pane>
+              <a-tab-pane key="2">
+                <span slot="tab">
+                  <a-icon type="team" />我参与的
+                </span>
+              </a-tab-pane>
+              <a-tab-pane key="3">
+                <span slot="tab">
+                  <a-icon type="rocket" />我创建的
+                </span>
+              </a-tab-pane>
+            </a-tabs>
+            <a-list :loading="task.loading">
+              <a-list-item :key="index" v-for="(item, index) in task.list">
+                <a-list-item-meta>
+                  <div slot="title">
+                    <div style="display: flex;justify-content: space-between ">
+                      <router-link
+                        target="_blank"
+                        class="task-title-wrap"
+                        :to="`/project/space/task/${item.projectInfo.code}/detail/${item.code}`"
+                      >
+                        <a-tooltip title="优先级">
+                          <a-tag :color="priColor(item.pri)">{{item.priText}}</a-tag>
+                        </a-tooltip>
+                        <a-tooltip :title="item.name">{{ item.name }}</a-tooltip>
+                      </router-link>
+                      <div>
+                        <a-tooltip title="任务开始 - 截止时间" v-if="item.end_time">
+                          <span
+                            class="label m-r-sm"
+                            :class="showTimeLabel(item.end_time)"
+                          >{{showTaskTime(item.begin_time, item.end_time)}}</span>
+                        </a-tooltip>
+                        <a-tooltip title="子任务" v-if="item.pcode">
+                          <a-icon type="cluster" class="m-r-sm muted" />
+                        </a-tooltip>
+                        <router-link
+                          target="_blank"
+                          class="muted hidden-xs"
+                          :to="'/project/space/task/' + item.projectInfo.code"
+                        >
+                          <a-tooltip title="所属项目">{{ item.projectInfo.name }}</a-tooltip>
+                        </router-link>
+                      </div>
                     </div>
-                </div>
+                  </div>
+                  <!-- <div slot="description">
+                  </div>-->
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+            <a-pagination
+              class="pull-right m-b"
+              size="small"
+              :defaultPageSize="task.pageSize"
+              :hideOnSinglePage="true"
+              v-model="task.page"
+              :total="task.total"
+              @change="onLoadMoreTask"
+            />
+          </a-card>
+
+          <!-- <a-card
+            title="快速开始"
+            style="margin-bottom: 24px"
+            :bordered="false"
+            :body-style="{padding: 0}"
+          >
+            <div class="item-group">
+              <a>操作一</a>
+              <a>操作二</a>
+              <a>操作三</a>
+              <a-button size="small" type="primary" ghost icon="plus">添加</a-button>
+            </div>
+          </a-card>
+          <a-card
+            title="XX 指数"
+            style="margin-bottom: 24px"
+            :loading="radarLoading"
+            :bordered="false"
+            :body-style="{ padding: 0 }"
+          >
+            <div style="min-height: 400px;">
+              <dash :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts" />
+              <radar :data="radarData" />
             </div>
-        </div>
-        <!--<wrapper-content :showHeader="false">-->
-        <div class="page-wrapper">
-            <a-row :gutter="24">
-                <a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24">
-                    <a-card
-                            class="project-list"
-                            :loading="loading"
-                            style="margin-bottom: 24px;"
-                            :bordered="false"
-                            title="进行中的项目"
-                            :body-style="{ padding: 0 }">
-                        <router-link to="/project/list/my" slot="extra">全部项目</router-link>
-                        <div>
-                            <a-card-grid class="project-card-grid" :key="i" v-for="(item, i) in projectList">
-                                <a-card :bordered="false" :body-style="{ padding: 0 }" @click="routerLink('/project/space/task/' + item.code)">
-                                    <a-card-meta>
-                                        <div slot="title" class="card-title">
-                                            <a-avatar size="small" :src="item.cover"/>
-                                            <router-link :to="'/project/space/task/' + item.code">
-                                                <a-icon type="star" theme="filled" style="color: #ffaf38;margin-right: 6px;" v-show="item.collected"/>{{ item.name }}
-                                            </router-link>
-                                        </div>
-                                        <div slot="description" class="card-description">
-                                            <a-tooltip :mouseEnterDelay="0.3"
-                                                       :title="item.description">
-                                            <span class="description-text">
-                                                <span v-if="item.description">{{ item.description }}</span>
-                                                <span v-else>暂无介绍</span>
-                                            </span>
-                                            </a-tooltip>
-                                            <a-tooltip placement="right" :mouseEnterDelay="0.3"
-                                                       :title="`当前进度：${item.schedule}%`">
-                                                <a-progress :strokeWidth="2" :showInfo="false"
-                                                            :percent="item.schedule"/>
-                                            </a-tooltip>
-                                        </div>
-                                    </a-card-meta>
-                                    <div class="project-item">
-                                        <a href="/#/">{{ item.owner_name }}</a>
-                                        <span class="datetime">{{ formatTime(item.create_time) }}</span>
-                                    </div>
-                                </a-card>
-                            </a-card-grid>
-                            <p class="muted text-center m-t-md m-b-md" v-if="!projectList.length">暂无项目</p>
-                        </div>
-                    </a-card>
-                    <a-card class="activities-list" :loading="loading" title="动态"  :bordered="false">
-                        <a-list>
-                            <a-list-item :key="index" v-for="(item, index) in activities">
-                                <a-list-item-meta>
-                                    <a-avatar slot="avatar" :src="item.member_avatar"/>
-                                    <div slot="title">
-                                        <span>{{ item.member_name }}</span>
-                                        <span v-if="item.is_comment == 0">  <span v-html="item.remark "></span></span>&nbsp;
-                                        <template v-if="item.is_comment == 1">发表了评论
-                                            <p class="comment-text">{{ item.content }}</p>
-                                        </template>
-                                        <router-link target="_blank"
-                                                :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
-                                                class="right-item">「 {{ item.task_name }} 」
-                                        </router-link>
-                                    </div>
-                                    <div slot="description">
-                                        <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
-                                        {{ formatTime(item.create_time) }} -
-                                        <router-link target="_blank" :to="`/project/space/task/${item.project_code}`" class="muted">
-                                            {{item.project_name}}
-                                        </router-link>
-                                        <!--</a-tooltip>-->
-                                    </div>
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                    </a-card>
-                </a-col>
-                <a-col
-                        style="padding: 0 12px"
-                        :xl="8"
-                        :lg="24"
-                        :md="24"
-                        :sm="24"
-                        :xs="24">
-                    <a-card class="tasks-list" style="margin-bottom: 24px"
-                            :bordered="false">
-                        <div slot="title">
-                            <div class="flex ant-row-flex-space-between ant-row-flex-middle">
-                                <span>我的任务 · {{task.total}}</span>
-                                <a-select v-model="task.done" @select="taskSelectChange" :defaultActiveFirstOption="false">
-                                    <a-select-option :key="0">未完成</a-select-option>
-                                    <a-select-option :key="1">已完成</a-select-option>
-                                </a-select>
-                            </div>
-                        </div>
-                        <a-tabs defaultActiveKey="1" :animated="false" @change="taskTabChange">
-                            <a-tab-pane key="1">
-                                <span slot="tab"><a-icon type="bars" />我执行的</span>
-                            </a-tab-pane>
-                            <a-tab-pane key="2">
-                                <span slot="tab"><a-icon type="team" />我参与的</span>
-                            </a-tab-pane>
-                            <a-tab-pane key="3">
-                                <span slot="tab"><a-icon type="rocket" />我创建的</span>
-                            </a-tab-pane>
-                        </a-tabs>
-                        <a-list :loading="task.loading">
-                            <a-list-item :key="index" v-for="(item, index) in task.list">
-                                <a-list-item-meta>
-                                    <div slot="title">
-                                        <div style="display: flex;justify-content: space-between ">
-                                            <router-link target="_blank"
-                                                         class="task-title-wrap"
-                                                         :to="`/project/space/task/${item.projectInfo.code}/detail/${item.code}`">
-                                                <a-tooltip title="优先级">
-                                                    <a-tag :color="priColor(item.pri)">{{item.priText}}</a-tag>
-                                                </a-tooltip>
-                                                <a-tooltip :title="item.name">
-                                                    {{ item.name }}
-                                                </a-tooltip>
-                                            </router-link>
-                                            <div>
-                                                <a-tooltip title="任务开始 - 截止时间" v-if="item.end_time">
-                                                    <span class="label m-r-sm" :class="showTimeLabel(item.end_time)">{{showTaskTime(item.begin_time, item.end_time)}}</span>
-                                                </a-tooltip>
-                                                <a-tooltip title="子任务" v-if="item.pcode">
-                                                    <a-icon type="cluster" class="m-r-sm muted"/>
-                                                </a-tooltip>
-                                                <router-link target="_blank" class="muted" :to="'/project/space/task/' + item.projectInfo.code">
-                                                    <a-tooltip title="所属项目">{{ item.projectInfo.name }}</a-tooltip>
-                                                </router-link>
-                                            </div>
-                                        </div>
-                                    </div>
-                                   <!-- <div slot="description">
-                                    </div>-->
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                        <a-pagination class="pull-right m-b" size="small" :defaultPageSize="task.pageSize" v-model="task.page" :total="task.total" @change="onLoadMoreTask"/>
-                    </a-card>
-                    <!-- <a-col
-                             style="padding: 0 12px"
-                             :xl="8"
-                             :lg="24"
-                             :md="24"
-                             :sm="24"
-                             :xs="24">
-                         <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false"
-                                 :body-style="{padding: 0}">
-                             <div class="item-group">
-                                 <a>操作一</a>
-                                 <a>操作二</a>
-                                 <a>操作三</a>
-                                 <a>操作四</a>
-                                 <a>操作五</a>
-                                 <a>操作六</a>
-                                 <a-button size="small" type="primary" ghost icon="plus">添加</a-button>
-                             </div>
-                         </a-card>-->
-                    <!--    <a-card title="XX 指数" style="margin-bottom: 24px" :loading="radarLoading" :bordered="false" :body-style="{ padding: 0 }">
-                            <div style="min-height: 400px;">
-                                &lt;!&ndash; :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts"  &ndash;&gt;
-                                <radar :data="radarData" />
-                            </div>
-                        </a-card>-->
-                    <a-card :loading="loading" :title="'团队  · ' + accounts.total" :bordered="false">
-                        <div class="members">
-                            <a-row>
-                                <a-col :span="8" v-for="(item, index) in accounts.list" :key="index">
-                                    <a @click="routerLink('/members/profile/' + item.membar_account_code + '?key=3')" style="display: flex;align-items: center"
-                                    >
-                                        <a-avatar size="small" :src="item.avatar"/>
-                                        <span class="member">{{ item.name }}</span>
-                                    </a>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <a-pagination class="pull-right m-b" :defaultPageSize="accounts.pageSize" size="small" v-show="accounts.total > accounts.pageSize" v-model="accounts.page" :total="accounts.total" @change="onLoadMoreAccounts"/>
-                    </a-card>
-                </a-col>
+          </a-card>-->
+
+          <a-card :loading="loading" :title="'团队(' + accounts.total+')'" :bordered="false">
+            <a-row class="members">
+              <a-col
+                :span="8"
+                :xs="12"
+                :sm="8"
+                :md="8"
+                :lg="8"
+                :xl="8"
+                :xxl="6"
+                v-for="(item, index) in accounts.list"
+                :key="index"
+              >
+                <a
+                  @click="routerLink('/members/profile/' + item.membar_account_code + '?key=3')"
+                  style="display: flex;align-items: center"
+                >
+                  <a-avatar size="small" :src="item.avatar" />
+                  <span class="member">{{ item.name }}</span>
+                </a>
+              </a-col>
             </a-row>
-        </div>
-        <!--</wrapper-content>-->
+            <a-pagination
+              class="pull-right m-b"
+              :defaultPageSize="accounts.pageSize"
+              :hideOnSinglePage="true"
+              size="small"
+              v-model="accounts.page"
+              :total="accounts.total"
+              @change="onLoadMoreAccounts"
+            />
+          </a-card>
+        </a-col>
+      </a-row>
     </div>
+    <!--</wrapper-content>-->
+  </div>
 </template>
+
+
 <script>
-    import {mapState} from 'vuex'
-    import moment from "moment";
-    import {getYiYan} from "../../api/other";
-    import {formatTaskTime, relativelyTime, showHelloTime} from "../../assets/js/dateTime";
-    import {selfList as getProjectList} from "../../api/project";
-    import {list as accountList} from "../../api/user";
-    import pagination from "../../mixins/pagination";
-    import {getLogBySelfProject, selfList} from "../../api/task";
-    import task from "../project/space/task";
-
-    export default {
-        components: {},
-        mixins: [pagination],
-        data() {
-            return {
-                loading: false,
-                yiyan: {},
-                projectList: [],
-                projectTotal: 0,
-                activities: [],
-                tasks: [],
-                tasksTotal: 0,
-                // accounts: [],
-                accounts: {
-                    list: [],
-                    total: 0,
-                    page: 1,
-                    pageSize: 10,
-                    loading: false,
-                },
-                task: {
-                    list: [],
-                    taskType: '1',
-                    done: 0,
-                    total: 0,
-                    page: 1,
-                    pageSize: 10,
-                    loading: false,
-                },
+import { mapState } from "vuex";
+import moment from "moment";
+import { getYiYan } from "../../api/other";
+import {
+  formatTaskTime,
+  relativelyTime,
+  showHelloTime,
+} from "../../assets/js/dateTime";
+import { selfList as getProjectList } from "../../api/project";
+import { list as accountList } from "../../api/user";
+import pagination from "../../mixins/pagination";
+import { getLogBySelfProject, selfList } from "../../api/task";
+import task from "../project/space/task";
+
+export default {
+  components: {},
+  mixins: [pagination],
+  data() {
+    return {
+      loading: false,
+      yiyan: {},
+      yiyan_cate_c: 0,
+      yiyan_cate: [
+        { id: "a", name: "动画", title: "动画" },
+        { id: "b", name: "漫画", title: "漫画" },
+        { id: "c", name: "游戏", title: "游戏" },
+        { id: "d", name: "文学", title: "文学" },
+        { id: "e", name: "", title: "原创" },
+        { id: "f", name: "", title: "网络" },
+        { id: "g", name: "", title: "其他" },
+        { id: "h", name: "影视", title: "影视" },
+        { id: "i", name: "诗词", title: "诗词" },
+        { id: "j", name: "", title: "网易云" },
+        { id: "k", name: "哲学", title: "哲学" },
+        { id: "l", name: "", title: "抖机灵" },
+      ],
+      projectList: [],
+      projectTotal: 0,
+      activities: [],
+      tasks: [],
+      tasksTotal: 0,
+      // accounts: [],
+      accounts: {
+        list: [],
+        total: 0,
+        page: 1,
+        pageSize: 10,
+        loading: false,
+      },
+      task: {
+        list: [],
+        taskType: "1",
+        done: 0,
+        total: 0,
+        page: 1,
+        pageSize: 10,
+        loading: false,
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      socketAction: (state) => state.socketAction,
+    }),
+    helloTime() {
+      return showHelloTime();
+    },
+  },
+  created() {
+    this.getYiYan();
+    this.init();
+  },
+  watch: {
+    $route: function (to, from) {
+      this.init();
+    },
+    socketAction(val) {
+      console.log(val);
+      if (val.action === "organization:task") {
+        this.init(false, false);
+      }
+    },
+  },
+  methods: {
+    init(reset = true, loading = true) {
+      if (reset) {
+        this.projectList = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 9;
+      }
+      this.getProjectList(loading);
+      this.getTasks();
+      this.getTaskLog();
+      this.getAccountList();
+    },
+    getProjectList(loading) {
+      if (loading) {
+        this.loading = true;
+      }
+      getProjectList(this.requestData).then((res) => {
+        this.projectList = res.data.list;
+        this.projectTotal = res.data.total;
+        this.loading = false;
+      });
+    },
+    getTaskLog() {
+      getLogBySelfProject().then((res) => {
+        this.activities = res.data;
+      });
+    },
+    getAccountList() {
+      this.accounts.loading = true;
+      accountList({
+        page: this.accounts.page,
+        pageSize: this.accounts.pageSize,
+      }).then((res) => {
+        this.accounts.loading = false;
+        this.accounts.list = res.data.list;
+        this.accounts.total = res.data.total;
+      });
+    },
+    getYiYan() {
+      let app = this;
+      this.yiyan_cate_c = Math.floor(Math.random() * 12);
+      getYiYan(function (data) {
+        app.yiyan = data;
+      }, this.yiyan_cate[this.yiyan_cate_c].id);
+    },
+    getTasks() {
+      this.task.loading = true;
+      selfList({
+        page: this.task.page,
+        pageSize: this.task.pageSize,
+        taskType: this.task.taskType,
+        type: this.task.done,
+      }).then((res) => {
+        this.task.loading = false;
+        this.task.list = res.data.list;
+        // this.task.list =  this.task.list.concat(res.data.list);
+        this.task.total = res.data.total;
+      });
+    },
+    taskTabChange(key) {
+      console.log(key);
+      this.task.taskType = key;
+      this.task.loadingMore = true;
+      this.task.page = 1;
+      this.getTasks();
+    },
+    taskSelectChange(value) {
+      this.task.done = value;
+      this.task.loadingMore = true;
+      this.task.page = 1;
+      this.getTasks();
+    },
+    onLoadMoreTask(page, PageSize) {
+      this.task.loadingMore = true;
+      this.task.page = page;
+      this.getTasks();
+    },
+    onLoadMoreAccounts(page, PageSize) {
+      this.accounts.loadingMore = true;
+      this.accounts.page = page;
+      this.getAccountList();
+    },
+    priColor(pri) {
+      switch (pri) {
+        case 1:
+          return "#ff9900";
+        case 2:
+          return "#ed3f14";
+        default:
+          return "green";
+      }
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+    showTaskTime(time, timeEnd) {
+      return formatTaskTime(time, timeEnd);
+    },
+    showTimeLabel(time) {
+      let str = "label-primary";
+      if (time == null) {
+        return str;
+      }
+      let cha = moment(moment(time).format("YYYY-MM-DD")).diff(
+        moment().format("YYYY-MM-DD"),
+        "days"
+      );
+      if (cha < 0) {
+        str = "label-danger";
+      } else if (cha == 0) {
+        str = "label-warning";
+      } else if (cha > 7) {
+        str = "label-normal";
+      }
+      return str;
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.home-index {
+  .page-header {
+    padding: 1rem 2rem 0;
+    .header-content {
+      .left-content {
+        display: flex;
+        align-items: center;
+        margin: 1rem 0;
+
+        .user-info {
+          margin-left: 12px;
+          line-height: 1.75;
+
+          .title {
+            font-size: 1rem;
+          }
+
+          .team {
+          }
+        }
+      }
+
+      .right-content {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin: 1rem auto;
+
+        .content-item {
+          padding: 0 20px;
+          position: relative;
+
+          .item-text {
+            font-size: 30px;
+
+            .small {
+              font-size: 20px;
             }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                socketAction: state => state.socketAction,
-            }),
-            helloTime() {
-                return showHelloTime()
+          }
+
+          &:after {
+            background-color: #e8e8e8;
+            position: absolute;
+            top: 8px;
+            right: 0px;
+            width: 1px;
+            /* height: 40px; */
+            margin: auto 0;
+            bottom: 18px;
+            content: "";
+          }
+
+          &:last-child {
+            &:after {
+              width: 0;
             }
-        },
-        created() {
-            this.getYiYan();
-            this.init();
-        },
-        watch:{
-            $route: function (to, from) {
-                this.init();
-            },
-            socketAction(val) {
-                console.log(val);
-                if (val.action === 'organization:task') {
-                    this.init(false, false);
-                }
-            },
-        },
-        methods: {
-            init(reset = true, loading = true) {
-                if (reset) {
-                    this.projectList = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 9;
-                }
-                this.getProjectList(loading);
-                this.getTasks();
-                this.getTaskLog();
-                this.getAccountList();
-
-            },
-            getProjectList(loading) {
-                if (loading) {
-                    this.loading = true;
-                }
-                getProjectList(this.requestData).then(res => {
-                    this.projectList = res.data.list;
-                    this.projectTotal = res.data.total;
-                    this.loading = false;
-                });
-            },
-            getTaskLog() {
-                getLogBySelfProject().then(res => {
-                    this.activities = res.data;
-                })
-            },
-            getAccountList() {
-                this.accounts.loading = true;
-                accountList({page: this.accounts.page, pageSize: this.accounts.pageSize}).then(res => {
-                    this.accounts.loading = false;
-                    this.accounts.list =  res.data.list;
-                    this.accounts.total = res.data.total;
-                })
-            },
-            getYiYan() {
-                let app = this;
-                getYiYan(function (data) {
-                    app.yiyan = data
-                }, 'd')
-            },
-            getTasks() {
-                this.task.loading = true;
-                selfList({page: this.task.page, pageSize: this.task.pageSize, taskType: this.task.taskType, type: this.task.done}).then(res => {
-                    this.task.loading = false;
-                    this.task.list =  res.data.list;
-                    // this.task.list =  this.task.list.concat(res.data.list);;
-                    this.task.total = res.data.total;
-                })
-            },
-            taskTabChange(key) {
-                console.log(key);
-                this.task.taskType = key;
-                this.task.loadingMore = true;
-                this.task.page = 1;
-                this.getTasks();
-            },
-            taskSelectChange(value) {
-                this.task.done = value;
-                this.task.loadingMore = true;
-                this.task.page = 1;
-                this.getTasks();
-            },
-            onLoadMoreTask(page, PageSize) {
-                this.task.loadingMore = true;
-                this.task.page = page;
-                this.getTasks();
-            },
-            onLoadMoreAccounts(page, PageSize) {
-                this.accounts.loadingMore = true;
-                this.accounts.page = page;
-                this.getAccountList();
-            },
-            priColor(pri) {
-                switch (pri) {
-                    case 1:
-                        return '#ff9900';
-                    case 2:
-                        return '#ed3f14';
-                    default:
-                        return 'green';
-
-                }
-            },
-            formatTime(time) {
-                return relativelyTime(time);
-            },
-            showTaskTime(time, timeEnd) {
-                return formatTaskTime(time, timeEnd);
-            },
-            showTimeLabel(time) {
-                let str = 'label-primary';
-                if (time == null) {
-                    return str;
-                }
-                let cha = moment(moment(time).format("YYYY-MM-DD")).diff(moment().format("YYYY-MM-DD"), 'days');
-                if (cha < 0) {
-                    str = 'label-danger';
-                } else if (cha == 0) {
-                    str = 'label-warning';
-                } else if (cha > 7) {
-                    str = 'label-normal'
-                }
-                return str;
-            },
+          }
         }
+      }
     }
-</script>
-<style lang="less">
-    .home-index {
-        .page-header {
-            .header-content {
-                margin-bottom: 16px;
-                display: flex;
-                justify-content: space-between;
-
-                .left-content {
-                    display: flex;
-                    align-items: center;
-
-                    .user-info {
-                        margin-left: 12px;
-                        line-height: 33px;
-
-                        .title {
-                            font-size: 20px;
-                        }
-
-                        .team {
-
-                        }
-                    }
-                }
-
-                .right-content {
-                    display: flex;
-
-                    .content-item {
-                        padding: 0 32px;
-                        position: relative;
-
-                        .item-text {
-                            font-size: 30px;
-
-                            .small {
-                                font-size: 20px;
-                            }
-                        }
-
-                        &:after {
-                            background-color: #e8e8e8;
-                            position: absolute;
-                            top: 8px;
-                            right: 0;
-                            width: 1px;
-                            height: 40px;
-                            content: "";
-                        }
-
-                        &:last-child {
-                            &:after {
-                                width: 0;
-                            }
-                        }
-                    }
-                }
-            }
+  }
+
+  .page-wrapper {
+    margin: 24px;
+    .ant-card-head {
+      user-select: none;
+    }
+    .project-list {
+      .project-card-grid {
+        padding: 24px !important;
+        border: 0;
+        border-radius: 0;
+        box-shadow: 1px 0 0 0 #e8e8e8, 0 1px 0 0 #e8e8e8, 1px 1px 0 0 #e8e8e8,
+          inset 1px 0 0 0 #e8e8e8, inset 0 1px 0 0 #e8e8e8;
+        transition: all 0.3s;
+        position: relative;
+        box-sizing: border-box;
+        &:hover {
+          position: relative;
+          z-index: 1;
+          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+        }
+      }
+      .card-title {
+        font-size: 0;
+
+        a {
+          color: rgba(0, 0, 0, 0.85);
+          margin-left: 12px;
+          line-height: 24px;
+          height: 24px;
+          display: inline-block;
+          vertical-align: top;
+          font-size: 14px;
+
+          &:hover {
+            color: #1890ff;
+          }
+        }
+      }
+
+      .card-description {
+        color: rgba(0, 0, 0, 0.45);
+        height: 44px;
+        line-height: 22px;
+        overflow: hidden;
+        .description-text {
+          height: 22px;
+        }
+      }
+
+      .project-item {
+        display: flex;
+        margin-top: 8px;
+        overflow: hidden;
+        font-size: 12px;
+        height: 20px;
+        line-height: 20px;
+
+        a {
+          color: rgba(0, 0, 0, 0.45);
+          display: inline-block;
+          flex: 1 1 0;
+
+          &:hover {
+            color: #1890ff;
+          }
         }
 
-        .page-wrapper {
-            margin: 24px;
-
-            .project-list {
-
-                .card-title {
-                    font-size: 0;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.85);
-                        margin-left: 12px;
-                        line-height: 24px;
-                        height: 24px;
-                        display: inline-block;
-                        vertical-align: top;
-                        font-size: 14px;
-
-                        &:hover {
-                            color: #1890ff;
-                        }
-                    }
-                }
-
-                .card-description {
-                    color: rgba(0, 0, 0, 0.45);
-                    height: 44px;
-                    line-height: 22px;
-                    overflow: hidden;
-                    .description-text{
-                        height: 22px;
-                    }
-                }
-
-                .project-item {
-                    display: flex;
-                    margin-top: 8px;
-                    overflow: hidden;
-                    font-size: 12px;
-                    height: 20px;
-                    line-height: 20px;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.45);
-                        display: inline-block;
-                        flex: 1 1 0;
-
-                        &:hover {
-                            color: #1890ff;
-                        }
-                    }
-
-                    .datetime {
-                        color: rgba(0, 0, 0, 0.25);
-                        flex: 0 0 auto;
-                        float: right;
-                    }
-                }
-
-                .ant-card-meta-description {
-                    color: rgba(0, 0, 0, 0.45);
-                    height: 44px;
-                    line-height: 22px;
-                    overflow: hidden;
-                }
-            }
+        .datetime {
+          color: rgba(0, 0, 0, 0.25);
+          flex: 0 0 auto;
+          float: right;
+        }
+      }
+
+      .ant-card-meta-description {
+        color: rgba(0, 0, 0, 0.45);
+        height: 44px;
+        line-height: 22px;
+        overflow: hidden;
+      }
+    }
 
-            .activities-list {
-                .ant-list-item-meta-title {
-                    position: relative;
-                }
-
-                .comment-text {
-                    margin-bottom: 0;
-                }
-
-                .right-item {
-                    float: right;
-                    position: absolute;
-                    right: 0;
-                    top: 0;
-                }
-            }
+    .activities-list {
+      margin-bottom: 24px;
+      .ant-card-head {
+        user-select: none;
+      }
+      .ant-card-body {
+        padding: 0 20px;
+      }
+      .ant-list-item-meta-title {
+        position: relative;
+        line-height: 1.5;
+      }
+      .ant-list-item-meta-avatar {
+        margin-top: 5px;
+      }
+      .comment-text {
+        margin-bottom: 0;
+      }
+      .ant-list-item-meta-description {
+        line-height: 1.75;
+        font-size: 0.8rem;
+      }
+    }
 
-            .tasks-list {
-                .ant-card-body {
-                    padding: 6px 24px;
-
-                    .ant-list-item-meta, .ant-list-item-meta-content{
-                        width: 100%;
-                    }
-
-                    .task-title-wrap{
-                        /*max-width: 310px;*/
-                        flex: 1;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-                        padding-right: 10px;
-                    }
-                }
-            }
+    .tasks-list {
+      .ant-card-body {
+        padding: 6px 14px;
 
-            .item-group {
-                padding: 20px 0 8px 24px;
-                font-size: 0;
-
-                a {
-                    color: rgba(0, 0, 0, 0.65);
-                    display: inline-block;
-                    font-size: 14px;
-                    margin-bottom: 13px;
-                    width: 25%;
-                }
-            }
+        .ant-list-item-meta,
+        .ant-list-item-meta-content {
+          width: 100%;
+        }
 
-            .members {
-                a {
-                    display: block;
-                    margin: 12px 0;
-                    line-height: 24px;
-                    height: 24px;
-
-                    .member {
-                        font-size: 14px;
-                        color: rgba(0, 0, 0, .65);
-                        line-height: 24px;
-                        max-width: 100px;
-                        vertical-align: top;
-                        margin-left: 6px;
-                        transition: all 0.3s;
-                        display: inline-block;
-                    }
-
-                    &:hover {
-                        span {
-                            color: #1890ff;
-                        }
-                    }
-                }
-            }
+        .task-title-wrap {
+          /*max-width: 310px;*/
+          flex: 1;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          padding-right: 10px;
+        }
+      }
+    }
+
+    .item-group {
+      padding: 20px 0 8px 24px;
+      font-size: 0;
+
+      a {
+        color: rgba(0, 0, 0, 0.65);
+        display: inline-block;
+        font-size: 14px;
+        margin-bottom: 13px;
+        width: 25%;
+      }
+    }
+
+    .members {
+      a {
+        display: block;
+        margin: 12px 0;
+        line-height: 24px;
+        height: 24px;
+
+        .member {
+          font-size: 14px;
+          color: rgba(0, 0, 0, 0.65);
+          line-height: 24px;
+          max-width: 100px;
+          vertical-align: top;
+          margin-left: 6px;
+          transition: all 0.3s;
+          display: inline-block;
+        }
+
+        &:hover {
+          span {
+            color: #1890ff;
+          }
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/index.vue b/src/views/index.vue
index 34f8b98..ef843a7 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,369 +1,407 @@
 <!--suppress ALL-->
 <template>
-    <div class="index">
-        <a-spin :spinning="windowLoading">
-            <a-layout id="layout" :class="layoutClass">
-                <a-layout-header :class="{'collapsed':collapsed}">
-                    <div class="logo" @click="toHome">
-                        <img class="logo-img" src="../assets/image/common/logo.png" alt="">
-                        <span class="title" v-if="system">
-                            {{system.app_name}}
-                             <span class="version">{{system.app_version}}</span>
-                        </span>
-                    </div>
-                    <a-menu
-                            mode="horizontal"
-                            v-model="selectedModelKeys"
-                            @click="menuModelClick"
-                            @openChange="onModelOpenChange"
-                            :style="{ lineHeight: '63px',paddingLeft:'15px' }"
-                    >
-                        <a-menu-item
-                                v-for="(model,index) in menu"
-                                :key="model.id.toString()"
-                                :disabled="!model.status"
-                        >
-                            <a-icon v-if="model.icon" :type="model.icon"/>
-                            <span>{{model.title}}</span>
-                        </a-menu-item>
-                    </a-menu>
-                    <div class="right-menu">
-                        <div class="m-r-lg" v-if="config.WS_URI">
-                            <a-badge title="当前在线" :count="online" showZero :numberStyle="{backgroundColor: '#52c41a'} "
-                                     :offset="[10,0]">
-                                <a-icon type="team"/>
-                            </a-badge>
-                        </div>
-                        <div class="action action-organization" v-if="organizationList.length > 1">
-                            <header-select></header-select>
-                        </div>
-                        <div class="action">
-                            <header-notice></header-notice>
-                        </div>
-                        <div class="action action-avatar">
-                            <header-avatar></header-avatar>
-                        </div>
-                    </div>
-                </a-layout-header>
-                <a-layout style="padding-top: 65px;">
-                    <a-sider
-                            mode="inline"
-                            breakpoint="md"
-                            collapsible
-                            v-model="collapsed"
-                    >
-                        <!-- <a-icon
-                         class="trigger"
-                         :type="collapsed ? 'menu-unfold' : 'menu-fold'"
-                         @click="()=> collapsed = !collapsed"
-                         />-->
-                        <a-menu :theme="theme"
-                                v-for="menu in menus"
-                                :key="menu.id.toString()"
-                                :openKeys="openKeys"
-                                v-model="selectedKeys"
-                                @click="menuClick($event, menu)"
-                                @openChange="onOpenChange"
-                                mode="inline">
-                            <a-menu-item
-                                    v-if="!menu.children && !menu.is_inner && menu.node != '#'"
-                                    :key="menu.id"
-                                    :disabled="!menu.status"
-                            >
-                                <a-icon :type="menu.icon"/>
-                                <span>{{menu.title}}</span>
-                            </a-menu-item>
-                            <a-sub-menu
-                                    v-if="menu.children && !menu.is_inner"
-                                    :key="menu.id.toString()"
-                            >
-                                <span slot="title">
-                                     <a-icon :type="menu.icon"/>
-                                    <span>{{menu.title}}</span>
-                                </span>
-                                <a-menu-item
-                                        v-for="(secMenu,index) in menu.children"
-                                        v-if="!secMenu.is_inner"
-                                        :key="secMenu.id.toString()"
-                                        :disabled="!secMenu.status"
-                                >
-                                    {{secMenu.title}}
-                                </a-menu-item>
-                            </a-sub-menu>
-                        </a-menu>
-                    </a-sider>
-                    <a-layout
-                            class="main-content"
-                            :style="collapsed ? { paddingLeft: '80px'} : { paddingLeft: '256px'}">
-                        <!--<vue-scroll ref="contentscroll">-->
-                        <a-layout-content>
-                            <transition name="router-fade" mode="out-in">
-                                <a-spin :spinning="pageLoading">
-                                    <router-view></router-view>
-                                </a-spin>
-                            </transition>
-                        </a-layout-content>
-                        <!-- <a-footer style="text-align: center">
+  <div class="index">
+    <a-spin :spinning="windowLoading">
+      <a-layout id="layout" :class="layoutClass">
+        <a-layout-header class="project-nav" :class="{'collapsed':collapsed}">
+          <div class="logo pc-view" :title="system.site_name" @click="toHome">
+            <img class="logo-img" src="../assets/image/common/logo.png" alt />
+            <span class="title" v-if="system">
+              {{system.app_name}}
+              <sup class="version">{{system.app_version}}</sup>
+            </span>
+          </div>
+          <div class="left-menudrawer wap-menu" @click="collapsed = !collapsed">
+            <a-icon class="trigger" :type="collapsed ? 'menu-unfold' : 'menu-fold'" />
+          </div>
+          <a-menu
+            class="project-nav-menus"
+            mode="horizontal"
+            v-model="selectedModelKeys"
+            @click="menuModelClick"
+            @openChange="onModelOpenChange"
+          >
+            <a-menu-item
+              v-for="(model,index) in menu"
+              :key="model.id.toString()"
+              :disabled="!model.status"
+            >
+              <a-icon v-if="model.icon" :type="model.icon" />
+              <span>{{model.title}}</span>
+            </a-menu-item>
+          </a-menu>
+          <div class="right-menu pc-view">
+            <div class="m-r-lg" v-if="config.WS_URI">
+              <a-badge
+                title="当前在线"
+                :count="online"
+                showZero
+                :numberStyle="{backgroundColor: '#52c41a'} "
+                :offset="[10,0]"
+              >
+                <a-icon type="team" />
+              </a-badge>
+            </div>
+            <header-select class="action action-organization" v-if="organizationList.length > 1"></header-select>
+            <header-notice class="action action-notice"></header-notice>
+            <header-avatar class="action action-avatar" :type="1"></header-avatar>
+          </div>
+          <div class="right-menu wap-menu">
+            <div class="action action-more" @click.stop="wap_visible=!wap_visible">
+              <a-avatar :src="$store.state.userInfo.avatar" />
+            </div>
+            <a-drawer
+              class="right-drawer"
+              title
+              placement="right"
+              :closable="false"
+              :visible="wap_visible"
+              @close="wap_visible=false"
+            >
+              <div>
+                <header-select
+                  class="action action-organization"
+                  v-if="organizationList.length > 1"
+                ></header-select>
+                <header-avatar class="action action-avatar" :type="2" @finish="wap_visible=false"></header-avatar>
+              </div>
+              <div class="m-r-lg" :style="{padding: '1rem 0'}" v-if="config.WS_URI">
+                <a-badge
+                  title="当前在线"
+                  :count="online"
+                  showZero
+                  :numberStyle="{backgroundColor: '#52c41a'} "
+                  :offset="[10,0]"
+                >
+                  <a-icon type="team" />
+                </a-badge>
+              </div>
+            </a-drawer>
+          </div>
+        </a-layout-header>
+        <a-layout style="padding-top: 65px;">
+          <a-sider breakpoint="md" collapsedWidth="0" collapsible v-model="collapsed">
+            <a-menu
+              :theme="theme"
+              v-for="menu in menus"
+              :key="menu.id.toString()"
+              :openKeys="openKeys"
+              v-model="selectedKeys"
+              @click="menuClick($event, menu)"
+              @openChange="onOpenChange"
+              mode="inline"
+            >
+              <a-menu-item
+                v-if="!menu.children && !menu.is_inner && menu.node != '#'"
+                :key="menu.id"
+                :disabled="!menu.status"
+              >
+                <a-icon :type="menu.icon" />
+                <span>{{menu.title}}</span>
+              </a-menu-item>
+              <a-sub-menu v-if="menu.children && !menu.is_inner" :key="menu.id.toString()">
+                <span slot="title">
+                  <a-icon :type="menu.icon" />
+                  <span>{{menu.title}}</span>
+                </span>
+                <a-menu-item
+                  v-for="(secMenu,index) in menu.children"
+                  v-if="!secMenu.is_inner"
+                  :key="secMenu.id.toString()"
+                  :disabled="!secMenu.status"
+                >{{secMenu.title}}</a-menu-item>
+              </a-sub-menu>
+            </a-menu>
+            <a-icon :type="collapsed ? 'right' : 'left'" slot="trigger" />
+          </a-sider>
+          <a-layout class="main-content" :class="!collapsed ? 'toleft':''">
+            <!--<vue-scroll ref="contentscroll">-->
+            <a-layout-content>
+              <transition name="router-fade" mode="out-in">
+                <a-spin :spinning="pageLoading">
+                  <router-view></router-view>
+                </a-spin>
+              </transition>
+            </a-layout-content>
+            <!-- <a-footer style="text-align: center">
                              <template v-if="system">
                                  <span @click="footerClick">  Copyright © 2018 Pear Project技术部出品 </span>
                              </template>
-                         </a-footer>-->
-                        <!--</vue-scroll>-->
-                    </a-layout>
-                </a-layout>
-            </a-layout>
-            <Socket ref="socket" v-if="config.WS_URI"></Socket>
-        </a-spin>
-        <v-uploader></v-uploader>
-    </div>
+            </a-footer>-->
+            <!--</vue-scroll>-->
+          </a-layout>
+        </a-layout>
+      </a-layout>
+      <Socket ref="socket" v-if="config.WS_URI"></Socket>
+    </a-spin>
+    <v-uploader></v-uploader>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import ALayout from 'ant-design-vue/es/layout'
-    import HeaderNotice from '../components/layout/header/HeaderNotice';
-    import HeaderAvatar from '../components/layout/header/HeaderAvatar';
-    import HeaderSelect from '../components/layout/header/HeaderSelect';
-    import VUploader from '../components/tools/VUploader';
-    import Socket from '../components/websocket/socket';
-    import config from "../config/config";
-    import {notice} from "../assets/js/notice";
-    import {getStore} from "../assets/js/storage";
-    import {_getOrgList} from "../api/organization";
+import { mapState } from "vuex";
+import ALayout from "ant-design-vue/es/layout";
+import HeaderNotice from "../components/layout/header/HeaderNotice";
+import HeaderAvatar from "../components/layout/header/HeaderAvatar";
+import HeaderSelect from "../components/layout/header/HeaderSelect";
+import VUploader from "../components/tools/VUploader";
+import Socket from "../components/websocket/socket";
+import config from "../config/config";
+import { notice } from "../assets/js/notice";
+import { getStore } from "../assets/js/storage";
+import { _getOrgList } from "../api/organization";
 
-    const ASider = ALayout.Sider;
-    const AFooter = ALayout.Footer;
+const ASider = ALayout.Sider;
+const AFooter = ALayout.Footer;
 
+export default {
+  name: "index",
+  components: {
+    HeaderNotice,
+    HeaderAvatar,
+    HeaderSelect,
+    ALayout,
+    ASider,
+    AFooter,
+    Socket,
+    VUploader,
+  },
+  data() {
+    return {
+      menus: [],
+      collapsed: false,
+      wap_visible: false,
+      inline: 1,
+      openKeys: [],
+      openKeysTemp: [],
+      selectedKeys: [],
+      selectedModelKeys: [],
+      breadCrumbInfo: [],
+      config: config,
+      online: 0,
+    };
+  },
+  computed: {
+    ...mapState({
+      theme: (state) => state.theme,
+      logged: (state) => state.logged,
+      menu: (state) => state.menu.menu,
+      system: (state) => state.system,
+      pageLoading: (state) => state.pageLoading,
+      windowLoading: (state) => state.windowLoading,
+      organizationList: (state) => state.organizationList,
+      socketAction: (state) => state.socketAction,
+    }),
+    layoutClass() {
+      let className = "layout-" + this.theme;
+      if (!this.$route.meta.info.show_slider) {
+        className += " hide";
+      }
+      return className;
+    },
+  },
+  created() {
+    if (this.logged) {
+      this.checkLayout();
+    }
+    if (this.$route.query.logged) {
+      this.$store.dispatch("checkLogin");
+    }
+    if (this.$route.query.message) {
+      notice({ title: this.$route.query.message }, "notice");
+      // notice(this.$route.query.message);
+    }
+    if (this.logged) {
+      _getOrgList();
+    }
+  },
+  watch: {
+    $route: function (to, from) {
+      this.checkLayout();
+    },
+    collapsed(v) {
+      if (v) {
+        this.openKeysTemp = JSON.parse(JSON.stringify(this.openKeys));
+        this.openKeys = [];
+      } else {
+        this.openKeys = JSON.parse(JSON.stringify(this.openKeysTemp));
+      }
+    },
+    logged(val) {
+      if (!val) {
+        this.$router.push({ name: "login" });
+      }
+    },
+    socketAction(val) {
+      if (val.action === "connect" || val.action === "onClose") {
+        this.online = val.data.online;
+      }
+    },
+  },
+  methods: {
+    footerClick() {
+      autoPlay("order");
+      const socket = this.$refs.socket;
+      this.$websocket.send(
+        JSON.stringify({ uid: this.$store.state.userInfo.id })
+      );
+    },
+    checkLayout() {
+      //更新左侧菜单选中状态
+      let that = this;
+      const name = this.$route.name;
+      const path = this.$route.path;
+      const meta = this.$route.meta;
+      const info = this.$route.meta.info;
+      that.breadCrumbInfo = [];
+      that.breadCrumbInfo.push({ title: info.title, path: "/" + info.fullUrl });
+      if (!info.is_inner) {
+        that.openKeys = [];
+        that.selectedKeys = [];
+      }
+      //这里有点问题
+      // if (!that.menus) {
+      //     that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
+      //     return false;
+      // }
+      let openKey = null;
 
-    export default {
-        name: 'index',
-        components: {
-            HeaderNotice,
-            HeaderAvatar,
-            HeaderSelect,
-            ALayout,
-            ASider,
-            AFooter,
-            Socket,
-            VUploader
-        },
-        data() {
-            return {
-                menus: [],
-                collapsed: false,
-                inline: 1,
-                openKeys: [],
-                openKeysTemp: [],
-                selectedKeys: [],
-                selectedModelKeys: [],
-                breadCrumbInfo: [],
-                config: config,
-                online: 0,
-            }
-        },
-        computed: {
-            ...mapState({
-                theme: state => state.theme,
-                logged: state => state.logged,
-                menu: state => state.menu.menu,
-                system: state => state.system,
-                pageLoading: state => state.pageLoading,
-                windowLoading: state => state.windowLoading,
-                organizationList: state => state.organizationList,
-                socketAction: state => state.socketAction,
-            }),
-            layoutClass() {
-                let className = 'layout-' + this.theme;
-                if (!this.$route.meta.info.show_slider) {
-                    className += ' hide';
-                }
-                return className;
-            }
-        },
-        created() {
-            if (this.logged) {
-                this.checkLayout();
-            }
-            if (this.$route.query.logged) {
-                this.$store.dispatch('checkLogin');
-            }
-            if (this.$route.query.message) {
-                notice({title: this.$route.query.message}, 'notice');
-                // notice(this.$route.query.message);
-            }
-            if (this.logged) {
-                _getOrgList();
-            }
-        },
-        watch: {
-            $route: function (to, from) {
-                this.checkLayout();
-            },
-            collapsed(v) {
-                if (v) {
-                    this.openKeysTemp = JSON.parse(JSON.stringify(this.openKeys));
-                    this.openKeys = [];
-                } else {
-                    this.openKeys = JSON.parse(JSON.stringify(this.openKeysTemp));
-                }
-            },
-            logged(val) {
-                if (!val) {
-                    this.$router.push({name: 'login'})
-                }
-            },
-            socketAction(val) {
-                if (val.action === 'connect' || val.action === 'onClose') {
-                    this.online = val.data.online;
-                }
-            }
-        },
-        methods: {
-            footerClick() {
-                autoPlay('order');
-                const socket = this.$refs.socket;
-                this.$websocket.send(JSON.stringify({uid: this.$store.state.userInfo.id}));
-            },
-            checkLayout() {
-                //更新左侧菜单选中状态
-                let that = this;
-                const name = this.$route.name;
-                const path = this.$route.path;
-                const meta = this.$route.meta;
-                const info = this.$route.meta.info;
-                that.breadCrumbInfo = [];
-                that.breadCrumbInfo.push({title: info.title, 'path': '/' + info.fullUrl});
-                if (!info.is_inner) {
-                    that.openKeys = [];
-                    that.selectedKeys = [];
-                }
-                //这里有点问题
-                // if (!that.menus) {
-                //     that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
-                //     return false;
-                // }
-                let openKey = null;
+      function getArray(data, id) {
+        data.forEach(function (v) {
+          if (v.id == id) {
+            openKey = v;
+          }
+          if (v.children) {
+            getArray(v.children, id);
+          }
+        });
+      }
 
-                function getArray(data, id) {
-                    data.forEach(function (v) {
-                        if (v.id == id) {
-                            openKey = v;
-                        }
-                        if (v.children) {
-                            getArray(v.children, id);
-                        }
-                    });
-                }
-
-                //递归找到当前路由的顶部菜单，然后更新左侧菜单
-                if (meta.model) {
-                    getArray(that.menu, meta.model);
-                    if (!openKey) {
-                        return false;
-                    }
-                    that.breadCrumbInfo.push({title: openKey.title, 'path': '/' + openKey.fullUrl});
-                    openKey.pid && getArray(that.menu, openKey.pid);
-                } else {
-                    getArray(that.menu, meta.info.id);
-                }
-                that.breadCrumbInfo.push({title: openKey.title, 'path': '/' + openKey.fullUrl});
-                this.selectedModelKeys = [openKey.id.toString()];
-                if (!openKey.children) {
-                    that.menus = [];
-                    return false;
-                }
-                that.menus = openKey.children;
-                if (info.is_inner) {
-                    return false;
-                }
-                that.menus.forEach(function (v) {
-                    if (v.pid == that.selectedModelKeys) {
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                if ('/' + v2.fullUrl == path) {
-                                    that.selectedKeys.push(v2.id.toString());
-                                    if (!that.collapsed) {
-                                        that.openKeys.push(v2.pid.toString());
-                                    } else {
-                                        that.openKeysTemp = [v2.pid.toString()];
-                                    }
-                                }
-                            })
-                        } else {
-                            that.selectedKeys.push(v.id.toString());
-                        }
-                    }
-                });
-                that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
-            },
-            menuClick(event, menu) {
-                //点击左侧导航跳转页面
-                let that = this;
-                let openKeys = [];
-                if (!this.openKeys.length) {
-                    openKeys = [menu.id.toString()];
+      //递归找到当前路由的顶部菜单，然后更新左侧菜单
+      if (meta.model) {
+        getArray(that.menu, meta.model);
+        if (!openKey) {
+          return false;
+        }
+        that.breadCrumbInfo.push({
+          title: openKey.title,
+          path: "/" + openKey.fullUrl,
+        });
+        openKey.pid && getArray(that.menu, openKey.pid);
+      } else {
+        getArray(that.menu, meta.info.id);
+      }
+      that.breadCrumbInfo.push({
+        title: openKey.title,
+        path: "/" + openKey.fullUrl,
+      });
+      this.selectedModelKeys = [openKey.id.toString()];
+      if (!openKey.children) {
+        that.menus = [];
+        return false;
+      }
+      that.menus = openKey.children;
+      if (info.is_inner) {
+        return false;
+      }
+      that.menus.forEach(function (v) {
+        if (v.pid == that.selectedModelKeys) {
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              if ("/" + v2.fullUrl == path) {
+                that.selectedKeys.push(v2.id.toString());
+                if (!that.collapsed) {
+                  that.openKeys.push(v2.pid.toString());
                 } else {
-                    openKeys = JSON.parse(JSON.stringify(that.openKeys));
+                  that.openKeysTemp = [v2.pid.toString()];
                 }
-                that.menus.forEach(function (v) {
-                    if (v.id == openKeys) {
-                        let turnPath = '/';
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                if (v2.id == event.key) {
-                                    turnPath += v2.fullUrl;
-                                }
-                            })
-                        } else {
-                            turnPath += v.fullUrl;
-                        }
-                        that.$router.push(turnPath);
-                    }
-                });
-            },
-            menuModelClick(event) {
-                //点击顶部导航跳转页面
-                let that = this;
-                that.menu.forEach(function (v, k) {
-                    if (v.id == event.key) {
-                        that.menus = v.children;
-                        let turnPath = '/';
-                        if (!v.children) {
-                            turnPath += v.fullUrl;
-                        } else if (!v.children[0].children) {
-                            turnPath += v.children[0].fullUrl;
-                        } else {
-                            turnPath += v.children[0].children[0].fullUrl;
-                        }
-                        if (turnPath == '/home') {
-                            that.toHome();
-                            return false;
-                        }
-                        if (turnPath != '/#') {
-                            that.$router.push(turnPath);
-                        }
-                    }
-                });
-            },
-            onModelOpenChange(openKeys) {
-            },
-            onOpenChange(openKeys) {
-                let that = this;
-                const latestOpenKey = openKeys.find(key => this.openKeys.indexOf(key) === -1);
-                let hasOpenKey = false;
-                this.menus.forEach(function (v, k) {
-                    if (v.id == latestOpenKey) {
-                        that.openKeys = latestOpenKey ? [latestOpenKey] : [];
-                        hasOpenKey = true;
-
-                    }
-                });
-                if (!hasOpenKey) {
-                    that.openKeys = openKeys
-                }
-            },
-        },
-    }
+              }
+            });
+          } else {
+            that.selectedKeys.push(v.id.toString());
+          }
+        }
+      });
+      that.$store.dispatch("setBreadCrumbInfo", that.breadCrumbInfo);
+    },
+    menuClick(event, menu) {
+      //点击左侧导航跳转页面
+      let that = this;
+      let openKeys = [];
+      if (!this.openKeys.length) {
+        openKeys = [menu.id.toString()];
+      } else {
+        openKeys = JSON.parse(JSON.stringify(that.openKeys));
+      }
+      that.menus.forEach(function (v) {
+        if (v.id == openKeys) {
+          let turnPath = "/";
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              if (v2.id == event.key) {
+                turnPath += v2.fullUrl;
+              }
+            });
+          } else {
+            turnPath += v.fullUrl;
+          }
+          that.$router.push(turnPath);
+        }
+      });
+    },
+    menuModelClick(event) {
+      //点击顶部导航跳转页面
+      let that = this;
+      that.menu.forEach(function (v, k) {
+        if (v.id == event.key) {
+          that.menus = v.children;
+          let turnPath = "/";
+          if (!v.children) {
+            turnPath += v.fullUrl;
+          } else if (!v.children[0].children) {
+            turnPath += v.children[0].fullUrl;
+          } else {
+            turnPath += v.children[0].children[0].fullUrl;
+          }
+          if (turnPath == "/home") {
+            that.toHome();
+            return false;
+          }
+          if (turnPath != "/#") {
+            that.$router.push(turnPath);
+          }
+        }
+      });
+    },
+    onModelOpenChange(openKeys) {},
+    onOpenChange(openKeys) {
+      let that = this;
+      const latestOpenKey = openKeys.find(
+        (key) => this.openKeys.indexOf(key) === -1
+      );
+      let hasOpenKey = false;
+      this.menus.forEach(function (v, k) {
+        if (v.id == latestOpenKey) {
+          that.openKeys = latestOpenKey ? [latestOpenKey] : [];
+          hasOpenKey = true;
+        }
+      });
+      if (!hasOpenKey) {
+        that.openKeys = openKeys;
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-
+.right-drawer {
+  .ant-drawer-body {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    height: 100%;
+    :nth-last-child(n + 2) {
+      flex: 1;
+    }
+  }
+}
 </style>
diff --git a/src/views/member/Register.vue b/src/views/member/Register.vue
index 182ce40..760d671 100644
--- a/src/views/member/Register.vue
+++ b/src/views/member/Register.vue
@@ -1,330 +1,340 @@
 <template>
-    <div class="main user-layout-register">
-        <h3><span>注册</span></h3>
-        <a-form ref="formRegister" :autoFormCreate="(form)=>{this.form = form}" id="formRegister">
-            <a-form-item
-                    fieldDecoratorId="email"
-                    :fieldDecoratorOptions="{rules: [{ required: true, type: 'email', message: '请输入邮箱地址' }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="text" placeholder="邮箱"></a-input>
-            </a-form-item>
-            <a-form-item
-                    fieldDecoratorId="name"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入姓名' }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="text" placeholder="姓名"></a-input>
-            </a-form-item>
-
-            <a-popover placement="rightTop" trigger="click" :visible="state.passwordLevelChecked">
-                <template slot="content">
-                    <div :style="{ width: '240px' }">
-                        <div :class="['user-register', passwordLevelClass]">强度：<span>{{ passwordLevelName }}</span>
-                        </div>
-                        <a-progress :percent="state.percent" :showInfo="false" :strokeColor=" passwordLevelColor "/>
-                        <div style="margin-top: 10px;">
-                            <span>请至少输入 6 个字符。请不要使用容易被猜到的密码。</span>
-                        </div>
-                    </div>
-                </template>
-                <a-form-item
-                        fieldDecoratorId="password"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change', 'blur']}">
-                    <a-input size="large" type="password" @click="handlePasswordInputClick" autocomplete="false"
-                             placeholder="密码须至少6位，且区分大小写"></a-input>
-                </a-form-item>
-            </a-popover>
-
-            <a-form-item
-                    fieldDecoratorId="password2"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="password" autocomplete="false" placeholder="再次确认您的密码"></a-input>
-            </a-form-item>
-
-            <a-form-item
-                    fieldDecoratorId="mobile"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/ }, { validator: this.handlePhoneCheck } ], validateTrigger: ['change', 'blur'] }">
-                <a-input size="large" placeholder="11 位手机号">
-                    <a-select slot="addonBefore" size="large" defaultValue="+86">
-                        <a-select-option value="+86">+86</a-select-option>
-                        <!--<a-select-option value="+87">+87</a-select-option>-->
-                    </a-select>
-                </a-input>
-            </a-form-item>
-            <a-row :gutter="16">
-                <a-col class="gutter-row" :span="16">
-                    <a-form-item
-                            fieldDecoratorId="captcha"
-                            :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}">
-                        <a-input size="large" type="text" placeholder="验证码">
-                            <a-icon slot="prefix" type='safety-certificate' :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
-                </a-col>
-                <a-col class="gutter-row" :span="8">
-                    <a-button
-                            class="getCaptcha"
-                            size="large"
-                            :disabled="state.smsSendBtn"
-                            @click.stop.prevent="getCaptcha"
-                            v-text="!state.smsSendBtn && '获取验证码'||(state.time+' s')"></a-button>
-                </a-col>
-            </a-row>
-
-            <a-form-item>
-                <a-button
-                        size="large"
-                        type="primary"
-                        htmlType="submit"
-                        class="register-button"
-                        :loading="registerBtn"
-                        @click.stop.prevent="handleSubmit"
-                        :disabled="registerBtn">注册
-                </a-button>
-                <router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>
-            </a-form-item>
-
-        </a-form>
-    </div>
+  <div class="main user-layout-register">
+    <h3>
+      <span>注册</span>
+    </h3>
+    <a-form ref="formRegister" :autoFormCreate="(form)=>{this.form = form}" id="formRegister">
+      <a-form-item
+        fieldDecoratorId="email"
+        :fieldDecoratorOptions="{rules: [{ required: true, type: 'email', message: '请输入邮箱地址' }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="text" placeholder="邮箱"></a-input>
+      </a-form-item>
+      <a-form-item
+        fieldDecoratorId="name"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入姓名' }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="text" placeholder="姓名"></a-input>
+      </a-form-item>
+
+      <a-popover placement="bottom" trigger="click">
+        <template slot="content">
+          <div :style="{ width: '240px' }">
+            <div :class="['user-register', passwordLevelClass]">
+              强度：
+              <span>{{ passwordLevelName }}</span>
+            </div>
+            <a-progress
+              :percent="state.percent"
+              :showInfo="false"
+              :strokeColor=" passwordLevelColor "
+            />
+            <div style="margin-top: 10px;">
+              <span>请至少输入 6 个字符。请不要使用容易被猜到的密码。</span>
+            </div>
+          </div>
+        </template>
+        <a-form-item
+          fieldDecoratorId="password"
+          :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change']}"
+        >
+          <a-input size="large" type="password" autocomplete="false" placeholder="密码须至少6位，且区分大小写"></a-input>
+        </a-form-item>
+      </a-popover>
+
+      <a-form-item
+        fieldDecoratorId="password2"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="password" autocomplete="false" placeholder="再次确认您的密码"></a-input>
+      </a-form-item>
+
+      <a-form-item
+        fieldDecoratorId="mobile"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/ }, { validator: this.handlePhoneCheck } ], validateTrigger: ['change'] }"
+      >
+        <a-input size="large" placeholder="11 位手机号">
+          <a-select slot="addonBefore" size="large" defaultValue="+86">
+            <a-select-option value="+86">+86</a-select-option>
+            <!--<a-select-option value="+87">+87</a-select-option>-->
+          </a-select>
+        </a-input>
+      </a-form-item>
+      <a-row :gutter="16">
+        <a-col class="gutter-row" :span="14">
+          <a-form-item
+            fieldDecoratorId="captcha"
+            :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'change'}"
+          >
+            <a-input size="large" type="text" placeholder="验证码">
+              <a-icon
+                slot="prefix"
+                type="safety-certificate"
+                :style="{ color: 'rgba(0,0,0,.25)' }"
+              />
+            </a-input>
+          </a-form-item>
+        </a-col>
+        <a-col class="gutter-row" :span="10">
+          <a-button
+            class="getCaptcha"
+            size="large"
+            :disabled="state.smsSendBtn"
+            @click.stop.prevent="getCaptcha"
+            v-text="!state.smsSendBtn && '获取验证码'||(state.time+' s')"
+          ></a-button>
+        </a-col>
+      </a-row>
+
+      <a-form-item>
+        <a-button
+          size="large"
+          type="primary"
+          htmlType="submit"
+          class="register-button"
+          :loading="registerBtn"
+          @click.stop.prevent="handleSubmit"
+          :disabled="registerBtn"
+        >注册</a-button>
+        <router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>
+      </a-form-item>
+    </a-form>
+  </div>
 </template>
 
 <script>
-    import md5 from 'md5'
-    import {register, getCaptcha} from '@/api/user'
-    import {checkResponse} from "../../assets/js/utils";
-    import {notice} from "../../assets/js/notice";
-
-    const levelNames = {
-        0: '低',
-        1: '低',
-        2: '中',
-        3: '强'
+import md5 from "md5";
+import { register, getCaptcha } from "@/api/user";
+import { checkResponse } from "../../assets/js/utils";
+import { notice } from "../../assets/js/notice";
+
+const levelNames = {
+  0: "低",
+  1: "低",
+  2: "中",
+  3: "强",
+};
+const levelClass = {
+  0: "error",
+  1: "error",
+  2: "warning",
+  3: "success",
+};
+const levelColor = {
+  0: "#ff0000",
+  1: "#ff0000",
+  2: "#ff7e05",
+  3: "#52c41a",
+};
+export default {
+  name: "Register",
+  components: {},
+  data() {
+    return {
+      form: null,
+
+      state: {
+        time: 60,
+        smsSendBtn: false,
+        passwordLevel: 0,
+        passwordLevelChecked: false,
+        percent: 10,
+        progressColor: "#FF0000",
+      },
+      registerBtn: false,
     };
-    const levelClass = {
-        0: 'error',
-        1: 'error',
-        2: 'warning',
-        3: 'success'
-    };
-    const levelColor = {
-        0: '#ff0000',
-        1: '#ff0000',
-        2: '#ff7e05',
-        3: '#52c41a',
-    };
-    export default {
-        name: 'Register',
-        components: {},
-        data() {
-            return {
-                form: null,
-
-                state: {
-                    time: 60,
-                    smsSendBtn: false,
-                    passwordLevel: 0,
-                    passwordLevelChecked: false,
-                    percent: 10,
-                    progressColor: '#FF0000'
-                },
-                registerBtn: false
-            }
-        },
-        computed: {
-            passwordLevelClass() {
-                return levelClass[this.state.passwordLevel]
-            },
-            passwordLevelName() {
-                return levelNames[this.state.passwordLevel]
-            },
-            passwordLevelColor() {
-                return levelColor[this.state.passwordLevel]
+  },
+  computed: {
+    passwordLevelClass() {
+      return levelClass[this.state.passwordLevel];
+    },
+    passwordLevelName() {
+      return levelNames[this.state.passwordLevel];
+    },
+    passwordLevelColor() {
+      return levelColor[this.state.passwordLevel];
+    },
+  },
+  methods: {
+    handlePasswordLevel(rule, value, callback) {
+      let level = 0;
+
+      // 判断这个字符串中有没有数字
+      if (/[0-9]/.test(value)) {
+        level++;
+      }
+      // 判断字符串中有没有字母
+      if (/[a-zA-Z]/.test(value)) {
+        level++;
+      }
+      // 判断字符串中有没有特殊符号
+      if (/[^0-9a-zA-Z_]/.test(value)) {
+        level++;
+      }
+      this.state.passwordLevel = level;
+      this.state.percent = level * 30;
+      if (level >= 2) {
+        if (level >= 3) {
+          this.state.percent = 100;
+        }
+        callback();
+      } else {
+        if (level === 0) {
+          this.state.percent = 10;
+        }
+        callback(new Error("密码强度不够"));
+      }
+    },
+
+    handlePasswordCheck(rule, value, callback) {
+      const password = this.form.getFieldValue("password");
+      if (value === undefined) {
+        callback(new Error("请输入密码"));
+      }
+      if (value && password && value.trim() !== password.trim()) {
+        callback(new Error("两次密码不一致"));
+      }
+      callback();
+    },
+
+    handlePhoneCheck(rule, value, callback) {
+      // console.log('handlePhoneCheck, rule:', rule);
+      // console.log('handlePhoneCheck, value', value);
+      // console.log('handlePhoneCheck, callback', callback);
+
+      callback();
+    },
+
+    handlePasswordInputClick() {
+      this.state.passwordLevelChecked = !this.state.passwordLevelChecked;
+    },
+
+    handleSubmit() {
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.registerBtn = true;
+          let params = this.form.getFieldsValue();
+          params.password = md5(params.password);
+          params.password2 = md5(params.password2);
+          register(params).then((res) => {
+            this.registerBtn = false;
+            if (!checkResponse(res)) {
+              return false;
             }
-        },
-        methods: {
-
-            handlePasswordLevel(rule, value, callback) {
-
-                let level = 0;
-
-                // 判断这个字符串中有没有数字
-                if (/[0-9]/.test(value)) {
-                    level++
-                }
-                // 判断字符串中有没有字母
-                if (/[a-zA-Z]/.test(value)) {
-                    level++
-                }
-                // 判断字符串中有没有特殊符号
-                if (/[^0-9a-zA-Z_]/.test(value)) {
-                    level++
-                }
-                this.state.passwordLevel = level;
-                this.state.percent = level * 30;
-                if (level >= 2) {
-                    if (level >= 3) {
-                        this.state.percent = 100
-                    }
-                    callback()
-                } else {
-                    if (level === 0) {
-                        this.state.percent = 10
-                    }
-                    callback(new Error('密码强度不够'))
-                }
-            },
-
-            handlePasswordCheck(rule, value, callback) {
-                const password = this.form.getFieldValue('password');
-                if (value === undefined) {
-                    callback(new Error('请输入密码'))
-                }
-                if (value && password && value.trim() !== password.trim()) {
-                    callback(new Error('两次密码不一致'))
-                }
-                callback()
-            },
-
-            handlePhoneCheck(rule, value, callback) {
-                // console.log('handlePhoneCheck, rule:', rule);
-                // console.log('handlePhoneCheck, value', value);
-                // console.log('handlePhoneCheck, callback', callback);
-
-                callback()
-            },
-
-            handlePasswordInputClick() {
-                this.state.passwordLevelChecked = true;
-            },
-
-            handleSubmit() {
-                this.form.validateFields((err, values) => {
-                    if (!err) {
-                        this.registerBtn = true;
-                        let params = this.form.getFieldsValue();
-                        params.password = md5(params.password);
-                        params.password2 = md5(params.password2);
-                        register(params).then(res => {
-                            this.registerBtn = false;
-                            if (!checkResponse(res)) {
-                                return false;
-                            }
-                            notice({title: '提示', msg: '注册成功，请登陆'}, 'notification', 'success');
-                            this.$router.push({name: 'login'})
-                        });
-                    }
-                })
-            },
-
-            getCaptcha(e) {
-                e.preventDefault();
-                const that = this;
-
-                this.form.validateFields(['mobile'], {force: true},
-                    (err, values) => {
-                        if (!err) {
-                            this.state.smsSendBtn = true;
-
-                            const interval = window.setInterval(() => {
-                                if (that.state.time-- <= 0) {
-                                    that.state.time = 60;
-                                    that.state.smsSendBtn = false;
-                                    window.clearInterval(interval)
-                                }
-                            }, 1000);
-
-                            const hide = this.$message.loading('验证码发送中..', 0);
-                            getCaptcha(values.mobile)
-                                .then(res => {
-                                    this.$message.destroy();
-                                    if (!checkResponse(res)) {
-                                        return false;
-                                    }
-                                    let tips = '验证码获取成功';
-                                    if (res.data) {
-                                        tips += '，您的验证码为：' + res.data;
-                                    }
-                                    this.$notification['success']({
-                                        message: '提示',
-                                        description: tips,
-                                        duration: 8,
-                                        placement: 'bottomLeft'
-                                    })
-                                })
-                                .catch(err => {
-                                    setTimeout(hide, 1);
-                                    clearInterval(interval);
-                                    this.state.time = 60;
-                                    this.state.smsSendBtn = false;
-                                    this.requestFailed(err)
-                                })
-                        }
-                    }
-                )
-            },
-            requestFailed(err) {
-                this.$notification['error']({
-                    message: '错误',
-                    description: ((err.response || {}).data || {}).message || '请求出现错误，请稍后再试',
-                    duration: 4,
-                });
-                this.registerBtn = false
-            },
-        },
-        watch: {
-            'state.passwordLevel'(val) {
-                // console.log(val)
-
+            notice(
+              { title: "提示", msg: "注册成功，请登陆" },
+              "notification",
+              "success"
+            );
+            this.$router.push({ name: "login" });
+          });
+        }
+      });
+    },
+
+    getCaptcha(e) {
+      e.preventDefault();
+      const that = this;
+
+      this.form.validateFields(["mobile"], { force: true }, (err, values) => {
+        if (!err) {
+          this.state.smsSendBtn = true;
+
+          const interval = window.setInterval(() => {
+            if (that.state.time-- <= 0) {
+              that.state.time = 60;
+              that.state.smsSendBtn = false;
+              window.clearInterval(interval);
             }
+          }, 1000);
+
+          const hide = this.$message.loading("验证码发送中..", 0);
+          getCaptcha(values.mobile)
+            .then((res) => {
+              this.$message.destroy();
+              if (!checkResponse(res)) {
+                return false;
+              }
+              let tips = "验证码获取成功";
+              if (res.data) {
+                tips += "，您的验证码为：" + res.data;
+              }
+              this.$notification["success"]({
+                message: "提示",
+                description: tips,
+                duration: 8,
+                placement: "bottomLeft",
+              });
+            })
+            .catch((err) => {
+              setTimeout(hide, 1);
+              clearInterval(interval);
+              this.state.time = 60;
+              this.state.smsSendBtn = false;
+              this.requestFailed(err);
+            });
         }
-    }
+      });
+    },
+    requestFailed(err) {
+      this.$notification["error"]({
+        message: "错误",
+        description:
+          ((err.response || {}).data || {}).message ||
+          "请求出现错误，请稍后再试",
+        duration: 4,
+      });
+      this.registerBtn = false;
+    },
+  },
+  watch: {
+    "state.passwordLevel"(val) {
+      // console.log(val)
+    },
+  },
+};
 </script>
 <style lang="less">
-    .user-register {
-
-        &.error {
-            color: #ff0000;
-        }
-
-        &.warning {
-            color: #ff7e05;
-        }
-
-        &.success {
-            color: #52c41a;
-        }
-
-
-    }
-
-    .user-layout-register {
-        .ant-input-group-addon:first-child {
-            background-color: #fff;
-        }
-    }
+.user-register {
+  &.error {
+    color: #ff0000;
+  }
+
+  &.warning {
+    color: #ff7e05;
+  }
+
+  &.success {
+    color: #52c41a;
+  }
+}
+
+.user-layout-register {
+  .ant-input-group-addon:first-child {
+    background-color: #fff;
+  }
+}
 </style>
 <style lang="less">
-    .user-layout-register {
-
-        & > h3 {
-            font-size: 16px;
-            margin-bottom: 20px;
-        }
-
-
-        .getCaptcha {
-            display: block;
-            width: 100%;
-            height: 40px;
-        }
-
-        .register-button {
-            width: 50%;
-        }
-
-        .login {
-            float: right;
-            line-height: 40px;
-        }
-    }
+.user-layout-register {
+  & > h3 {
+    font-size: 16px;
+    margin-bottom: 20px;
+  }
+
+  .getCaptcha {
+    display: block;
+    width: 100%;
+    height: 40px;
+  }
+
+  .register-button {
+    width: 50%;
+  }
+
+  .login {
+    float: right;
+    line-height: 40px;
+  }
+}
 </style>
diff --git a/src/views/member/login.vue b/src/views/member/login.vue
index 79087ed..9c21cfe 100644
--- a/src/views/member/login.vue
+++ b/src/views/member/login.vue
@@ -1,112 +1,119 @@
 <template>
-    <div class="main">
-        <a-spin class="text-center" :spinning="oauthLoading">
-            <span v-show="oauthLoading">正在登陆，请稍后...</span>
-        </a-spin>
-        <a-form
-                v-show="!oauthLoading"
-                class="user-layout-login"
-                ref="formLogin"
-                id="formLogin"
-                :form="form"
-        >
-            <a-tabs
-                    :activeKey="customActiveKey"
-                    :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }"
-                    @change="handleTabClick"
-            >
-                <a-tab-pane key="tab1" tab="账号密码登录">
-                    <a-form-item>
-                        <a-input size="large" type="text" placeholder="帐户名或邮箱地址"
-                                 v-decorator="[
+  <div class="main">
+    <a-spin class="text-center" :spinning="oauthLoading">
+      <span v-show="oauthLoading">正在登陆，请稍后...</span>
+    </a-spin>
+    <a-form
+      v-show="!oauthLoading"
+      class="user-layout-login"
+      ref="formLogin"
+      id="formLogin"
+      :form="form"
+    >
+      <a-tabs
+        :activeKey="customActiveKey"
+        :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }"
+        @change="handleTabClick"
+      >
+        <a-tab-pane key="tab1" tab="账号密码登录">
+          <a-form-item>
+            <a-input
+              size="large"
+              type="text"
+              placeholder="帐户名或邮箱地址"
+              v-decorator="[
                                 'account',
-                                {rules: [{ required: true, message: '请输入帐户名或邮箱地址' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'blur'}
-                            ]">
-                            <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
+                                {rules: [{ required: true, message: '请输入帐户名或邮箱地址' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
 
-                    <a-form-item
-                    >
-                        <a-input size="large" type="password" autocomplete="false" placeholder="密码"
-                                 v-decorator="[
+          <a-form-item>
+            <a-input
+              size="large"
+              type="password"
+              autocomplete="false"
+              placeholder="密码"
+              v-decorator="[
                                 'password',
-                                {rules: [{ required: true, message: '请输入密码' }], validateTrigger: 'blur'}
-                            ]">
-                            <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
-                </a-tab-pane>
-                <a-tab-pane key="tab2" tab="手机号登录">
-                    <a-form-item
-                    >
-                        <a-input size="large" type="text" placeholder="手机号"
-                                 v-decorator="[
+                                {rules: [{ required: true, message: '请输入密码' }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
+        </a-tab-pane>
+        <a-tab-pane key="tab2" tab="手机号登录">
+          <a-form-item>
+            <a-input
+              size="large"
+              type="text"
+              placeholder="手机号"
+              v-decorator="[
                                 'mobile',
-                                {rules: [{ required: true, pattern: /^1[34578]\d{9}$/, message: '请输入正确的手机号' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
-                            ]">
-                            <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
+                                {rules: [{ required: true, pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
 
-                    <a-row :gutter="16">
-                        <a-col class="gutter-row" :span="16">
-                            <a-form-item
-                            >
-                                <a-input size="large" type="text" placeholder="验证码"
-                                         v-decorator="[
+          <a-row :gutter="16">
+            <a-col class="gutter-row" :span="14">
+              <a-form-item>
+                <a-input
+                  size="large"
+                  type="text"
+                  placeholder="验证码"
+                  v-decorator="[
                                 'captcha',
-                                {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}
-                            ]">
-                                    <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                                </a-input>
-                            </a-form-item>
-                        </a-col>
-                        <a-col class="gutter-row" :span="8">
-                            <a-button
-                                    class="getCaptcha"
-                                    tabindex="-1"
-                                    :disabled="state.smsSendBtn"
-                                    @click.stop.prevent="getCaptcha"
-                                    v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"
-                            ></a-button>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
+                                {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'change'}
+                            ]"
+                >
+                  <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }" />
+                </a-input>
+              </a-form-item>
+            </a-col>
+            <a-col class="gutter-row" :span="10">
+              <a-button
+                class="getCaptcha"
+                tabindex="-1"
+                :disabled="state.smsSendBtn"
+                @click.stop.prevent="getCaptcha"
+                v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"
+              ></a-button>
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
 
-            <a-form-item>
-                <a-checkbox v-model="formLogin.rememberMe">自动登录</a-checkbox>
-                <a
-                        class="forge-password"
-                        style="float: right;"
-                        @click="routerLink('/member/forgot')"
-                >忘记密码
-                </a>
-            </a-form-item>
+      <a-form-item>
+        <a-checkbox v-model="formLogin.rememberMe">自动登录</a-checkbox>
+        <a class="forge-password" style="float: right;" @click="routerLink('/member/forgot')">忘记密码</a>
+      </a-form-item>
 
-            <a-form-item style="margin-top:24px">
-                <a-button
-                        size="large"
-                        type="primary"
-                        htmlType="submit"
-                        class="login-button"
-                        :loading="loginBtn"
-                        @click.stop.prevent="handleSubmit"
-                        :disabled="loginBtn"
-                >登录
-                </a-button>
-            </a-form-item>
+      <a-form-item style="margin-top:24px">
+        <a-button
+          size="large"
+          type="primary"
+          htmlType="submit"
+          class="login-button"
+          :loading="loginBtn"
+          @click.stop.prevent="handleSubmit"
+          :disabled="loginBtn"
+        >登录</a-button>
+      </a-form-item>
 
-            <div class="user-login-other">
-                <span>其他登录方式</span>
-                <a-tooltip :mouseEnterDelay="0.3"
-                           title="钉钉登录">
-                    <a @click="dingTalkOauth">
-                        <a-icon class="item-icon" type="dingding"/>
-                    </a>
-                </a-tooltip>
-                <!--<a>
+      <div class="user-login-other">
+        <span>其他登录方式</span>
+        <a-tooltip :mouseEnterDelay="0.3" title="钉钉登录">
+          <a @click="dingTalkOauth">
+            <a-icon class="item-icon" type="dingding" />
+          </a>
+        </a-tooltip>
+        <!--<a>
                     <a-icon class="item-icon" type="alipay-circle"></a-icon>
                 </a>
                 <a>
@@ -114,335 +121,354 @@
                 </a>
                 <a>
                     <a-icon class="item-icon" type="weibo-circle"></a-icon>
-                </a>-->
-                <router-link class="register" :to="{ name: 'register' }">注册账户</router-link>
-            </div>
-        </a-form>
-    </div>
+        </a>-->
+        <router-link class="register" :to="{ name: 'register' }">注册账户</router-link>
+      </div>
+    </a-form>
+  </div>
 </template>
 
 <script>
-    import md5 from 'md5'
-    import * as dd from 'dingtalk-jsapi';
-    import {mapActions} from 'vuex'
-    import {mapState} from 'vuex'
-    import {Login, getCaptcha} from '@/api/user'
-    import {info} from '@/api/system';
-    import config from "@/config/config";
-    import {checkResponse, createRoute, timeFix} from '@/assets/js/utils'
-    import {getStore} from '@/assets/js/storage'
-    import {checkInstall} from "../../api/common/common";
-    import {_checkLogin} from "../../api/user";
-    import {dingTalkLoginByCode, dingTalkOauth} from "../../api/oauth";
-    import {notice} from "../../assets/js/notice";
+import md5 from "md5";
+import * as dd from "dingtalk-jsapi";
+import { mapActions } from "vuex";
+import { mapState } from "vuex";
+import { Login, getCaptcha } from "@/api/user";
+import { info } from "@/api/system";
+import config from "@/config/config";
+import { checkResponse, createRoute, timeFix } from "@/assets/js/utils";
+import { getStore } from "@/assets/js/storage";
+import { checkInstall } from "../../api/common/common";
+import { _checkLogin } from "../../api/user";
+import { dingTalkLoginByCode, dingTalkOauth } from "../../api/oauth";
+import { notice } from "../../assets/js/notice";
 
-    export default {
-        components: {},
-        data() {
-            return {
-                customActiveKey: 'tab1',
-                loginBtn: false,
-                oauthLoading: false,
-                // login type: 0 email, 1 account, 2 telephone
-                loginType: 0,
-                requiredTwoStepCaptcha: false,
-                stepCaptchaVisible: false,
-                form: this.$form.createForm(this),
-                state: {
-                    time: 60,
-                    smsSendBtn: false
-                },
-                formLogin: {
-                    account: '',
-                    password: '',
-                    captcha: '',
-                    mobile: '',
-                    rememberMe: true
-                }
-            }
-        },
-        computed: {
-            ...mapState({
-                system: state => state.system,
-            })
-        },
-        mounted() {
-            this.checkInstall();
-            if (this.$route.query.logged) {
-                this.oauthLoading = true;
-                this.checkLogin();
-            }
-            if (this.$route.query.message) {
-                notice({title: this.$route.query.message}, 'notice');
-                // notice(this.$route.query.message);
-            }
-        },
-        methods: {
-            ...mapActions(['Login', 'Logout']),
-            checkInstall() {
-                checkInstall().then(res => {
-                    if (!checkResponse(res)) {
-                        this.$router.push({name: 'install'});
-                        return false;
-                    }
-                    info().then(res => {
-                        if (checkResponse(res)) {
-                            this.$store.dispatch('setSystem', res.data);
-                            this.dingTalkLogin();
-                        }
-                    });
-                });
-            },
-            // handler
-            handleUsernameOrEmail(rule, value, callback) {
-                const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
-                if (regex.test(value)) {
-                    this.loginType = 0
-                } else {
-                    this.loginType = 1
-                }
-                callback()
-            },
-            handleTabClick(key) {
-                this.customActiveKey = key
-                // this.form.resetFields()
-            },
-            handleSubmit() {
-                const app = this;
-                let flag = false;
+export default {
+  components: {},
+  data() {
+    return {
+      customActiveKey: "tab1",
+      loginBtn: false,
+      oauthLoading: false,
+      // login type: 0 email, 1 account, 2 telephone
+      loginType: 0,
+      requiredTwoStepCaptcha: false,
+      stepCaptchaVisible: false,
+      form: this.$form.createForm(this),
+      state: {
+        time: 60,
+        smsSendBtn: false,
+      },
+      formLogin: {
+        account: "",
+        password: "",
+        captcha: "",
+        mobile: "",
+        rememberMe: false,
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      system: (state) => state.system,
+    }),
+  },
+  mounted() {
+    this.checkInstall();
+    if (this.$route.query.logged) {
+      this.oauthLoading = true;
+      this.checkLogin();
+    }
+    if (this.$route.query.message) {
+      notice({ title: this.$route.query.message }, "notice");
+      // notice(this.$route.query.message);
+    }
+  },
+  methods: {
+    ...mapActions(["Login", "Logout"]),
+    checkInstall() {
+      checkInstall().then((res) => {
+        if (!checkResponse(res)) {
+          this.$router.push({ name: "install" });
+          return false;
+        }
+        info().then((res) => {
+          if (checkResponse(res)) {
+            this.$store.dispatch("setSystem", res.data);
+            this.dingTalkLogin();
+          }
+        });
+      });
+    },
+    // handler
+    handleUsernameOrEmail(rule, value, callback) {
+      const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
+      if (regex.test(value)) {
+        this.loginType = 0;
+      } else {
+        this.loginType = 1;
+      }
+      callback();
+    },
+    handleTabClick(key) {
+      this.customActiveKey = key;
+      // this.form.resetFields()
+    },
+    handleSubmit() {
+      const app = this;
+      let flag = false;
 
-                let loginParams = {
-                    remember_me: app.formLogin.rememberMe
-                };
+      let loginParams = {
+        remember_me: app.formLogin.rememberMe,
+      };
 
-                // 使用账户密码登录
-                if (app.customActiveKey === 'tab1') {
-                    app.form.validateFields(['account', 'password'], {force: true}, (err, values) => {
-                        if (!err) {
-                            flag = true;
-                            loginParams[!app.loginType ? 'account' : 'account'] = values.account;
-                            loginParams.password = md5(values.password)
-                        }
-                    })
-                    // 使用手机号登录
-                } else {
-                    app.form.validateFields(['mobile', 'captcha'], {force: true}, (err, values) => {
-                        if (!err) {
-                            flag = true;
-                            loginParams = Object.assign(loginParams, values)
-                        }
-                    })
-                }
+      // 使用账户密码登录
+      if (app.customActiveKey === "tab1") {
+        app.form.validateFields(
+          ["account", "password"],
+          { force: true },
+          (err, values) => {
+            if (!err) {
+              flag = true;
+              loginParams[!app.loginType ? "account" : "account"] =
+                values.account;
+              loginParams.password = md5(values.password);
+            }
+          }
+        );
+        // 使用手机号登录
+      } else {
+        app.form.validateFields(
+          ["mobile", "captcha"],
+          { force: true },
+          (err, values) => {
+            if (!err) {
+              flag = true;
+              loginParams = Object.assign(loginParams, values);
+            }
+          }
+        );
+      }
 
-                if (!flag) return;
+      if (!flag) return;
 
-                app.loginBtn = true;
-                loginParams.clientid = getStore('client_id');
-                Login(loginParams).then(res => {
-                    if (checkResponse(res)) {
-                        loginParams.token = res.token;
-                        this.dealDataBeforeLogin(res);
-                    }
-                    this.loginBtn = false
-                }).catch(() => {
-                    this.loginBtn = false
-                });
-            },
-            getCaptcha(e) {
-                e.preventDefault();
-                const app = this;
+      app.loginBtn = true;
+      loginParams.clientid = getStore("client_id");
+      Login(loginParams)
+        .then((res) => {
+          if (checkResponse(res)) {
+            loginParams.token = res.token;
+            this.dealDataBeforeLogin(res);
+          }
+          this.loginBtn = false;
+        })
+        .catch(() => {
+          this.loginBtn = false;
+        });
+    },
+    getCaptcha(e) {
+      e.preventDefault();
+      const app = this;
 
-                this.form.validateFields(['mobile'], {force: true}, (err, values) => {
-                    if (!err) {
-                        this.state.smsSendBtn = true;
+      this.form.validateFields(["mobile"], { force: true }, (err, values) => {
+        if (!err) {
+          this.state.smsSendBtn = true;
 
-                        const interval = window.setInterval(() => {
-                            if (app.state.time-- <= 0) {
-                                app.state.time = 60;
-                                app.state.smsSendBtn = false;
-                                window.clearInterval(interval)
-                            }
-                        }, 1000);
+          const interval = window.setInterval(() => {
+            if (app.state.time-- <= 0) {
+              app.state.time = 60;
+              app.state.smsSendBtn = false;
+              window.clearInterval(interval);
+            }
+          }, 1000);
 
-                        const hide = this.$message.loading('验证码发送中..', 0);
-                        getCaptcha(values.mobile)
-                            .then(res => {
-                                this.$message.destroy();
+          const hide = this.$message.loading("验证码发送中..", 0);
+          getCaptcha(values.mobile)
+            .then((res) => {
+              this.$message.destroy();
 
-                                if (!checkResponse(res)) {
-                                    return false;
-                                }
-                                let tips = '验证码获取成功';
-                                if (res.data) {
-                                    tips += '，您的验证码为：' + res.data;
-                                }
-                                this.$notification['success']({
-                                    message: '提示',
-                                    description: tips,
-                                    duration: 8,
-                                    placement: 'bottomLeft'
-                                });
-                            })
-                            .catch(err => {
-                                // setTimeout(hide, 1);
-                                clearInterval(interval);
-                                app.state.time = 60;
-                                app.state.smsSendBtn = false;
-                                this.requestFailed(err)
-                            })
-                    }
-                })
-            },
-            loginSuccess(res, org) {
-                const menu = getStore('menu', true);
-                if (menu) {
-                    let routes = this.$router.options.routes;
-                    menu.forEach(function (v) {
-                        routes[0].children.push(createRoute(v));
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                routes[0].children.push(createRoute(v2));
-                                if (v2.children) {
-                                    v2.children.forEach(function (v3) {
-                                        routes[0].children.push(createRoute(v3));
-                                    });
-                                }
-                            });
-                        }
-                    });
-                    this.loginBtn = false;
-                    this.$router.addRoutes(routes);
-                    let redirect = this.$route.query.redirect || config.HOME_PAGE + '/' + org.code;
-                    if (redirect == config.HOME_PAGE) {
-                        redirect = config.HOME_PAGE + '/' + org.code
-                    }
-                    console.log('redirect');
-                    console.log(redirect);
-                    this.$router.push({
-                        path: redirect
-                    });
-                    this.$notification.success({
-                        message: '欢迎',
-                        description: `${res.data.member.name}，${timeFix()}，欢迎回来`,
-                    });
-                    this.oauthLoading = false;
-                }
-            },
-            dingTalkOauth() {
-                let url = dingTalkOauth() + '?redirect=' + this.$route.query.redirect;
-                let redirect = this.$route.query.redirect;
-                if (redirect) {
-                    url += '?redirect=' + redirect;
-                }
-                location.href = url;
-            },
-            dingTalkLogin() {
-                let app = this;
-                dd.ready(function () {
-                    // dd.ready参数为回调函数，在环境准备就绪时触发，jsapi的调用需要保证在该回调函数触发后调用，否则无效。
-                    dd.runtime.permission.requestAuthCode({
-                        corpId: "ding42ccb1a1923b200f35c2f4657eb6378f",
-                        onSuccess: function (result) {
-                            app.oauthLoading = true;
-                            dingTalkLoginByCode({code: result.code}).then(res => {
-                                if (checkResponse(res)) {
-                                    app.dealDataBeforeLogin(res);
-                                }
-                            });
-                        }
-                    });
-                });
-            },
-            checkLogin() {
-                _checkLogin().then(res => {
-                    this.dealDataBeforeLogin(res);
-                });
-            },
-            async dealDataBeforeLogin(res) {
-                let app = this;
-                if (res.data) {
-                    const obj = {
-                        userInfo: res.data.member,
-                        tokenList: res.data.tokenList
-                    };
-                    let currentOrganization = getStore('currentOrganization', true);
-                    const organizationList = res.data.organizationList;
-                    await app.$store.dispatch('SET_LOGGED', obj);
-                    await app.$store.dispatch('setOrganizationList', organizationList);
-                    if (!currentOrganization) {
-                        currentOrganization = organizationList[0];
-                    } else {
-                        const has = organizationList.findIndex(item => item.id == currentOrganization.id);
-                        if (has === -1) {
-                            currentOrganization = organizationList[0];
-                        }
-                    }
-                    await app.$store.dispatch('setCurrentOrganization', currentOrganization);
-                    await app.$store.dispatch('GET_MENU').then(() => {
-                        app.loginSuccess(res, currentOrganization);
-                    });
-                } else {
-                    app.oauthLoading = false;
-                    app.$store.dispatch('SET_LOGOUT');
-                    // app.$router.replace('/login?redirect=' + this.$router.currentRoute.fullPath);
-                }
-            },
-            requestFailed(err) {
-                this.$notification['error']({
-                    message: '错误',
-                    description: ((err.response || {}).data || {}).message || '请求出现错误，请稍后再试',
-                    duration: 4
+              if (!checkResponse(res)) {
+                return false;
+              }
+              let tips = "验证码获取成功";
+              if (res.data) {
+                tips += "，您的验证码为：" + res.data;
+              }
+              this.$notification["success"]({
+                message: "提示",
+                description: tips,
+                duration: 8,
+                placement: "bottomLeft",
+              });
+            })
+            .catch((err) => {
+              // setTimeout(hide, 1);
+              clearInterval(interval);
+              app.state.time = 60;
+              app.state.smsSendBtn = false;
+              this.requestFailed(err);
+            });
+        }
+      });
+    },
+    loginSuccess(res, org) {
+      const menu = getStore("menu", true);
+      if (menu) {
+        let routes = this.$router.options.routes;
+        menu.forEach(function (v) {
+          routes[0].children.push(createRoute(v));
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              routes[0].children.push(createRoute(v2));
+              if (v2.children) {
+                v2.children.forEach(function (v3) {
+                  routes[0].children.push(createRoute(v3));
                 });
-                this.loginBtn = false
-            }
+              }
+            });
+          }
+        });
+        this.loginBtn = false;
+        this.$router.addRoutes(routes);
+        let redirect =
+          this.$route.query.redirect || config.HOME_PAGE + "/" + org.code;
+        if (redirect == config.HOME_PAGE) {
+          redirect = config.HOME_PAGE + "/" + org.code;
         }
-    }
+        console.log("redirect");
+        console.log(redirect);
+        this.$router.push({
+          path: redirect,
+        });
+        this.$notification.success({
+          message: "欢迎",
+          description: `${res.data.member.name}，${timeFix()}，欢迎回来`,
+        });
+        this.oauthLoading = false;
+      }
+    },
+    dingTalkOauth() {
+      let url = dingTalkOauth() + "?redirect=" + this.$route.query.redirect;
+      let redirect = this.$route.query.redirect;
+      if (redirect) {
+        url += "?redirect=" + redirect;
+      }
+      location.href = url;
+    },
+    dingTalkLogin() {
+      let app = this;
+      dd.ready(function () {
+        // dd.ready参数为回调函数，在环境准备就绪时触发，jsapi的调用需要保证在该回调函数触发后调用，否则无效。
+        dd.runtime.permission.requestAuthCode({
+          corpId: "ding42ccb1a1923b200f35c2f4657eb6378f",
+          onSuccess: function (result) {
+            app.oauthLoading = true;
+            dingTalkLoginByCode({ code: result.code }).then((res) => {
+              if (checkResponse(res)) {
+                app.dealDataBeforeLogin(res);
+              }
+            });
+          },
+        });
+      });
+    },
+    checkLogin() {
+      _checkLogin().then((res) => {
+        this.dealDataBeforeLogin(res);
+      });
+    },
+    async dealDataBeforeLogin(res) {
+      let app = this;
+      if (res.data) {
+        const obj = {
+          userInfo: res.data.member,
+          tokenList: res.data.tokenList,
+        };
+        let currentOrganization = getStore("currentOrganization", true);
+        const organizationList = res.data.organizationList;
+        await app.$store.dispatch("SET_LOGGED", obj);
+        await app.$store.dispatch("setOrganizationList", organizationList);
+        if (!currentOrganization) {
+          currentOrganization = organizationList[0];
+        } else {
+          const has = organizationList.findIndex(
+            (item) => item.id == currentOrganization.id
+          );
+          if (has === -1) {
+            currentOrganization = organizationList[0];
+          }
+        }
+        await app.$store.dispatch(
+          "setCurrentOrganization",
+          currentOrganization
+        );
+        await app.$store.dispatch("GET_MENU").then(() => {
+          app.loginSuccess(res, currentOrganization);
+        });
+      } else {
+        app.oauthLoading = false;
+        app.$store.dispatch("SET_LOGOUT");
+        // app.$router.replace('/login?redirect=' + this.$router.currentRoute.fullPath);
+      }
+    },
+    requestFailed(err) {
+      this.$notification["error"]({
+        message: "错误",
+        description:
+          ((err.response || {}).data || {}).message ||
+          "请求出现错误，请稍后再试",
+        duration: 4,
+      });
+      this.loginBtn = false;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .user-layout-login {
-        label {
-            font-size: 14px;
-        }
+.user-layout-login {
+  label {
+    font-size: 14px;
+  }
 
-        .getCaptcha {
-            display: block;
-            width: 100%;
-            height: 40px;
-        }
+  .getCaptcha {
+    display: block;
+    width: 100%;
+    height: 40px;
+  }
 
-        .forge-password {
-            font-size: 14px;
-        }
+  .forge-password {
+    font-size: 14px;
+  }
 
-        button.login-button {
-            padding: 0 15px;
-            font-size: 16px;
-            height: 40px;
-            width: 100%;
-        }
+  button.login-button {
+    padding: 0 15px;
+    font-size: 16px;
+    height: 40px;
+    width: 100%;
+  }
 
-        .user-login-other {
-            text-align: left;
-            margin-top: 24px;
-            line-height: 22px;
+  .user-login-other {
+    text-align: left;
+    margin-top: 24px;
+    line-height: 22px;
 
-            .item-icon {
-                font-size: 24px;
-                color: rgba(0, 0, 0, 0.2);
-                margin-left: 16px;
-                vertical-align: middle;
-                cursor: pointer;
-                transition: color 0.3s;
+    .item-icon {
+      font-size: 24px;
+      color: rgba(0, 0, 0, 0.2);
+      margin-left: 16px;
+      vertical-align: middle;
+      cursor: pointer;
+      transition: color 0.3s;
 
-                &:hover {
-                    color: #1890ff;
-                }
-            }
+      &:hover {
+        color: #1890ff;
+      }
+    }
 
-            .register {
-                float: right;
-            }
-        }
+    .register {
+      float: right;
     }
+  }
+}
 </style>
diff --git a/src/views/members/index.vue b/src/views/members/index.vue
index d41c3fa..11aada0 100644
--- a/src/views/members/index.vue
+++ b/src/views/members/index.vue
@@ -530,7 +530,6 @@
         .left {
             padding: 12px 24px 12px 0;
             width: 280px;
-            height: 85vh;
 
             .left-content {
                 width: 255px;
diff --git a/src/views/organization/index.vue b/src/views/organization/index.vue
index cbdd944..ff87fc7 100644
--- a/src/views/organization/index.vue
+++ b/src/views/organization/index.vue
@@ -1,40 +1,43 @@
 <template>
-    <div class="house-index">
-        <wrapper-content>
-           <!-- <div class="action">
-                <a-button type="primary" icon="plus" @click="rowClick(null,'new')">添加</a-button>
-            </div>-->
-            <a-table :columns="columns" :dataSource="dataSource" :loading="loading" rowKey="id" :pagination="pagination"
-                     @change="pageChange">
-                <template slot="action" slot-scope="text,record,index">
-                    <a @click="rowClick(record,'edit')" v-if="record.owner_code == userInfo.code">编辑</a>
-                    <a @click="rowClick(record,'quit')" v-if="record.owner_code != userInfo.code">退出</a>
-                </template>
-            </a-table>
-        </wrapper-content>
-        <a-modal
-                v-model="actionInfo.modalStatus"
-                :width="800"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="house-index">
+    <wrapper-content>
+      <div class="action">
+        <a-button type="primary" icon="plus" @click="rowClick(null,'new')">添加</a-button>
+      </div>
+      <a-table
+        :columns="columns"
+        :dataSource="dataSource"
+        :loading="loading"
+        rowKey="id"
+        :pagination="pagination"
+        @change="pageChange"
+      >
+        <template slot="action" slot-scope="text,record,index">
+          <a @click="rowClick(record,'edit')" v-if="record.owner_code == userInfo.code">编辑</a>
+          <a @click="rowClick(record,'quit')" v-if="record.owner_code != userInfo.code">退出</a>
+        </template>
+      </a-table>
+    </wrapper-content>
+    <a-modal
+      v-model="actionInfo.modalStatus"
+      :width="800"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form :autoFormCreate="(form)=>{this.form = form}" @submit.prevent="handleSubmit">
+        <a-form-item
+          :form="form"
+          label="组织名称"
+          :labelCol="{ span: 3 }"
+          :wrapperCol="{ span: 21 }"
+          fieldDecoratorId="name"
+          :fieldDecoratorOptions="{rules: [{ required: true, message: '组织名称' }]}"
+          help="必填，请填写组织名称"
         >
-            <a-form
-                    :autoFormCreate="(form)=>{this.form = form}"
-                    @submit.prevent="handleSubmit"
-            >
-                <a-form-item
-                        :form="form"
-                        label='组织名称'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="name"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '组织名称' }]}"
-                        help='必填，请填写组织名称'
-                >
-                    <a-input placeholder='组织名称'/>
-                </a-form-item>
-               <!-- <a-form-item
+          <a-input placeholder="组织名称" />
+        </a-form-item>
+        <!-- <a-form-item
                         label='所在区域'
                         :labelCol="{ span: 3 }"
                         :wrapperCol="{ span: 21 }"
@@ -44,182 +47,186 @@
                 >
                     <a-cascader :fieldNames="{ label: 'Name', value: 'ID', children: 'children' }" :options="options"
                                 placeholder="选择所在省市"/>
-                </a-form-item>-->
+        </a-form-item>-->
 
-                <a-form-item
-                        label='详细地址'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{span: 21 }"
-                        fieldDecoratorId="address"
-                        help="详细地址"
-                >
-                    <a-input/>
-                </a-form-item>
+        <a-form-item
+          label="详细地址"
+          :labelCol="{ span: 3 }"
+          :wrapperCol="{span: 21 }"
+          fieldDecoratorId="address"
+          help="详细地址"
+        >
+          <a-input />
+        </a-form-item>
 
-                <a-form-item
-                        :wrapperCol="{ span: 21, offset: 3 }"
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">保存
-                        </a-button>
-                        <a-button class="middle-btn" @click="actionInfo.modalStatus = false">取消
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+        <a-form-item :wrapperCol="{ span: 21, offset: 3 }">
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >保存</a-button>
+            <a-button class="middle-btn" @click="actionInfo.modalStatus = false">取消</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {list, doData, del} from '@/api/organization';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {_quitOrganization} from "../../api/organization";
+import { mapState } from "vuex";
+import { list, doData, del } from "@/api/organization";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { _quitOrganization } from "../../api/organization";
 
-    const columns = [{
-        title: '组织名称',
-        dataIndex: 'name',
-        width: '30%',
-    }, {
-        title: '操作',
-        scopedSlots: {
-            customRender: 'action'
-        }
-    }];
-
-    export default {
-        mixins: [pagination],
-        data() {
-            return {
-                columns,
-                dataSource: [],
-                loading: true,
-                newData: {
-                    code: 0
-                },
-                form: {},
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑组织',
-                    okText: '保存',
-                    cancelText: '放弃',
-                },
-                showMap: false,
-                options: [],
-            }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            })
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            moment,
-            init(quited) {
-                let app = this;
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = res.data.list;
-                    app.pagination.total = res.data.total;
-                    app.loading = false;
-                    if (quited) {
-                        //退出组织后重新更新当前组织
-                        app.$store.dispatch('setCurrentOrganization',  res.data.list[0]);
-                    }
-                    app.$store.dispatch('setOrganizationList', res.data.list);
-                });
-                // areasData().then(res => {
-                //     app.options = res.data;
-                // });
-            },
-            rowClick(record, action) {
-                let app = this;
-                app.newData = {code: ''};
-                if (action == 'add' || action == 'edit' || action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '添加组织';
-                    if (action == 'edit') {
-                        //modal没显示之前不会实例化modal子元素，延迟处理
-                        setTimeout(function () {
-                            app.actionInfo.modalTitle = '编辑组织';
-                            app.form.setFieldsValue({
-                                name: record.name,
-                                areas: [record.province.toString(), record.city.toString(), record.area.toString()],
-                                address: record.address,
-                            });
-                            app.newData = record;
-                        }, 0);
-                    }
-                }else if (action == 'quit') {
-                    this.$confirm({
-                        title: '确定要退出此组织?',
-                        okText: '退出',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            _quitOrganization({organizationCode: record.code}).then(res=>{
-                                if (checkResponse(res)) {
-                                    app.init(true);
-                                }
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                obj.areas = JSON.stringify(obj.areas);
-                console.log(app.newData);
-                if (app.newData.code) {
-                    app.newData.organizationCode = app.newData.code
-                    //编辑
-                    obj.organizationCode = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    if (app.newData.code) {
-                        app.newData.name = obj.name;
-                        app.newData.address = obj.address;
-                    } else {
-                        app.dataSource.push(res.data);
-                    }
-                    app.form.resetFields();
-                    app.newData = {code: 0};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
+const columns = [
+  {
+    title: "组织名称",
+    dataIndex: "name",
+    width: "30%",
+  },
+  {
+    title: "操作",
+    scopedSlots: {
+      customRender: "action",
+    },
+  },
+];
 
-                });
-            }
+export default {
+  mixins: [pagination],
+  data() {
+    return {
+      columns,
+      dataSource: [],
+      loading: true,
+      newData: {
+        code: 0,
+      },
+      form: {},
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑组织",
+        okText: "保存",
+        cancelText: "放弃",
+      },
+      showMap: false,
+      options: [],
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(quited) {
+      let app = this;
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = res.data.list;
+        app.pagination.total = res.data.total;
+        app.loading = false;
+        if (quited) {
+          //退出组织后重新更新当前组织
+          app.$store.dispatch("setCurrentOrganization", res.data.list[0]);
+        }
+        app.$store.dispatch("setOrganizationList", res.data.list);
+      });
+      // areasData().then(res => {
+      //     app.options = res.data;
+      // });
+    },
+    rowClick(record, action) {
+      let app = this;
+      app.newData = { code: "" };
+      if (action == "add" || action == "edit" || action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "添加组织";
+        if (action == "edit") {
+          //modal没显示之前不会实例化modal子元素，延迟处理
+          setTimeout(function () {
+            app.actionInfo.modalTitle = "编辑组织";
+            app.form.setFieldsValue({
+              name: record.name,
+              areas: [
+                record.province.toString(),
+                record.city.toString(),
+                record.area.toString(),
+              ],
+              address: record.address,
+            });
+            app.newData = record;
+          }, 0);
+        }
+      } else if (action == "quit") {
+        this.$confirm({
+          title: "确定要退出此组织?",
+          okText: "退出",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            _quitOrganization({ organizationCode: record.code }).then((res) => {
+              if (checkResponse(res)) {
+                app.init(true);
+              }
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err, values) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      obj.areas = JSON.stringify(obj.areas);
+      console.log(app.newData);
+      if (app.newData.code) {
+        app.newData.organizationCode = app.newData.code;
+        //编辑
+        obj.organizationCode = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
+        }
+        if (app.newData.code) {
+          app.newData.name = obj.name;
+          app.newData.address = obj.address;
+        } else {
+          app.dataSource.push(res.data);
         }
-    }
+        app.form.resetFields();
+        app.newData = { code: 0 };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+  },
+};
 </script>
diff --git a/src/views/project/archive/index.vue b/src/views/project/archive/index.vue
index b7d670e..1e82e36 100644
--- a/src/views/project/archive/index.vue
+++ b/src/views/project/archive/index.vue
@@ -1,172 +1,172 @@
 <template>
-    <div class="project-archive-index">
-        <wrapper-content :showHeader="false">
-            <a-list
-                    class="project-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-                    :locale="{emptyText:''}"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多项目</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                     <span slot="actions">
-                         <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
-                             <a-icon type="undo"/>
-                         </a-tooltip>
-                    </span>
-                    <span slot="actions" @click="doAction(item,'del',index)">
-                         <a-tooltip title="移至回收站">
-                              <a-icon type="delete"/>
-                         </a-tooltip>
-                    </span>
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <router-link  :to="'/project/space/task/' + item.code" slot="title">{{item.name}}</router-link>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="other-info muted">
-                        <div class="info-item">
-                            <span>移动日期</span>
-                            <span>{{moment(item.archive_time).format('YYYY-MM-DD')}}</span>
-                        </div>
-                    </div>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-    </div>
+  <div class="project-archive-index">
+    <wrapper-content :showHeader="false">
+      <a-list
+        class="project-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+        :locale="{emptyText:''}"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore" />
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <span slot="actions">
+            <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
+              <a-icon type="undo" />
+            </a-tooltip>
+          </span>
+          <span slot="actions" @click="doAction(item,'del',index)">
+            <a-tooltip title="移至回收站">
+              <a-icon type="delete" />
+            </a-tooltip>
+          </span>
+          <a-list-item-meta :description="item.description">
+            <router-link :to="'/project/space/task/' + item.code" slot="title">{{item.name}}</router-link>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="other-info muted">
+            <div class="info-item">
+              <span>移动日期</span>
+              <span>{{moment(item.archive_time).format('YYYY-MM-DD')}}</span>
+            </div>
+          </div>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+  </div>
 </template>
 <script>
-    import {list, doData, del} from '@/api/project';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {recoveryArchive, recycle} from "../../../api/project";
+import { list, doData, del } from "@/api/project";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { recoveryArchive, recycle } from "../../../api/project";
 
-    export default {
-        mixins: [pagination],
-        data() {
-            return {
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                currentProject: {},
-                currentProjectId: 0,
-                newData: {
-                    id: 0
-                },
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            moment,
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 1000;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.archive = 1;
-                this.requestData.type = 'other';
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            inviteProjectMember(item){
-                this.currentProject = item;
-                this.currentProjectId = item.id;
-                this.showInviteMember = true;
-            },
-            doAction(record, action,index) {
-                this.currentProject = record;
-                let app = this;
-                app.newData = {id: 0};
-                 if (action == 'recoveryArchive') {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                                content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }else if (action == 'del') {
-                     this.$confirm({
-                         title: '确定放入回收站？',
-                         content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                         okText: '放入回收站',
-                         okType: 'danger',
-                         cancelText: '再想想',
-                         onOk() {
-                             recycle(record.code).then(()=>{
-                                 app.dataSource.splice(index, 1);
-                             });
-                             return Promise.resolve();
-                         }
-                     });
-                 }
-            },
-        }
-    }
+export default {
+  mixins: [pagination],
+  data() {
+    return {
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      currentProject: {},
+      currentProjectId: 0,
+      newData: {
+        id: 0,
+      },
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 1000;
+        this.showLoadingMore = false;
+      }
+      this.requestData.selectBy = "archive";
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    inviteProjectMember(item) {
+      this.currentProject = item;
+      this.currentProjectId = item.id;
+      this.showInviteMember = true;
+    },
+    doAction(record, action, index) {
+      this.currentProject = record;
+      let app = this;
+      app.newData = { id: 0 };
+      if (action == "recoveryArchive") {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    @import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
+@import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
 
-    .project-archive-index {
-        .project-list {
-            .ant-list-item-meta-avatar {
-                .ant-avatar {
-                    width: 50px;
-                    height: 50px;
-                    border-radius: 3px;
-                }
-            }
+.project-archive-index {
+  .project-list {
+    .ant-list-item-meta-avatar {
+      .ant-avatar {
+        width: 50px;
+        height: 50px;
+        border-radius: 3px;
+      }
+    }
 
-            .ant-list-item-content {
-                .other-info {
-                    display: flex;
+    .ant-list-item-content {
+      .other-info {
+        display: flex;
 
-                    .info-item {
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 48px;
-                    }
-                }
-            }
+        .info-item {
+          display: flex;
+          flex-direction: column;
+          padding-left: 48px;
+        }
+      }
+    }
 
-            .ant-list-item-action {
-                .anticon:hover {
-                    svg {
-                        color: @primary-color;
-                    }
-                }
-            }
+    .ant-list-item-action {
+      .anticon:hover {
+        svg {
+          color: @primary-color;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/project/list/index.vue b/src/views/project/list/index.vue
index a14da16..c0c7d87 100644
--- a/src/views/project/list/index.vue
+++ b/src/views/project/list/index.vue
@@ -1,454 +1,405 @@
 <template>
-    <div class="project-list-index">
-        <wrapper-content :showHeader="false">
-            <!--  <div class="page-search">
-                  <a-form
-                          layout="inline"
-                          :autoFormCreate="(form)=>{this.searchForm = form}"
-                          @submit.prevent="handleSearchSubmit"
-                  >
-                      <a-form-item
-                              label='名称'
-                              fieldDecoratorId="name"
-                      >
-                          <a-input placeholder='请输入'/>
-                      </a-form-item>
-                      <a-form-item
-                              label='创建日期'
-                              fieldDecoratorId="date"
-                      >
-                          <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
-                      </a-form-item>
-                      <a-form-item
-                      >
-                          <a-button icon="search" type="primary" htmlType='submit'
-                                    :loading="actionInfo.confirmLoading"
-                          >搜索
-                          </a-button>
-                      </a-form-item>
-                  </a-form>
-              </div>-->
-          <!--  <div class="action">
-                <a-button type="primary" icon="plus" @click="doAction(null,'new')">创建新项目</a-button>
-            </div>-->
-            <a-tabs v-model="selectBy" @change="selectChange" :animated="false">
-                <a-tab-pane key="my" tab="全部项目"></a-tab-pane>
-                <a-tab-pane key="collect" tab="我的收藏"></a-tab-pane>
-                <a-tab-pane key="archive" tab="已归档"></a-tab-pane>
-                <a-tab-pane key="deleted" tab="回收站"></a-tab-pane>
-                <a-button slot="tabBarExtraContent" type="primary" icon="plus" @click="doAction(null,'new')">创建新项目</a-button>
-            </a-tabs>
-            <a-list
-                    class="project-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多项目</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <div slot="title">
-                            <router-link :to="'/project/space/task/' + item.code">{{item.name}}</router-link>
-                            <a-tag color="green" class="m-l" v-show="!item.private">公开</a-tag>
-                        </div>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="ant-list-item-content">
-                        <div class="other-info muted">
-                            <div class="info-item">
-                                <span>创建日期</span>
-                                <span>{{moment(item.create_time).format('YYYY-MM-DD')}}</span>
-                            </div>
-                            <div class="info-item">
-                                <span>创建人</span>
-                                <span>{{item.owner_name}}</span>
-                            </div>
-                            <div class="info-item schedule">
-                                <span>进度</span>
-                                <a-progress :strokeWidth="5" :percent="item.schedule"/>
-                            </div>
-                        </div>
-                    </div>
-                    <template v-if="selectBy === 'my' || selectBy === 'collect'">
-                        <span slot="actions" @click="inviteProjectMember(item)">
-                             <a-tooltip title="添加成员">
-                                 <a-icon type="user-add"/>
-                             </a-tooltip>
-                        </span>
-                        <span slot="actions" @click="doAction(item,'edit',index)">
-                             <a-tooltip title="项目设置">
-                                  <a-icon type="setting"/>
-                             </a-tooltip>
-                        </span>
-                        <span slot="actions">
-                             <a-tooltip :title="item.collected ? '取消收藏' : '加入收藏'"
-                                        @click="doAction(item,'collect',index)">
-                                 <a-icon type="star" v-show="!item.collected"/>
-                                 <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="item.collected"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                    <template v-if="selectBy === 'archive'">
-                         <span slot="actions">
-                         <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
-                             <a-icon type="undo"/>
-                         </a-tooltip>
-                    </span>
-                    </template>
-                    <template v-if="selectBy === 'archive' || selectBy === 'my' || selectBy === 'collect'">
-                             <span slot="actions" @click="doAction(item,'del',index)">
-                             <a-tooltip title="移至回收站">
-                                  <a-icon type="delete"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                    <template v-if="selectBy === 'deleted'">
-                        <span slot="actions">
-                             <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
-                                 <a-icon type="undo"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-        <a-modal
-                destroyOnClose
-                :width="360"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="project-list-index">
+    <wrapper-content :showHeader="false">
+      <!-- <div class="page-search">
+        <a-form
+          layout="inline"
+          :autoFormCreate="(form)=>{this.searchForm = form}"
+          @submit.prevent="handleSearchSubmit"
         >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="form"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='项目名称（必填）'
-                             v-decorator="[
+          <a-form-item label="名称" fieldDecoratorId="name">
+            <a-input placeholder="请输入" />
+          </a-form-item>
+          <a-form-item label="创建日期" fieldDecoratorId="date">
+            <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
+          </a-form-item>
+          <a-form-item>
+            <a-button
+              icon="search"
+              type="primary"
+              htmlType="submit"
+              :loading="actionInfo.confirmLoading"
+            >搜索</a-button>
+          </a-form-item>
+        </a-form>
+      </div>-->
+      <a-tabs v-model="selectBy" @change="selectChange" :animated="false">
+        <a-tab-pane key="my" tab="全部项目"></a-tab-pane>
+        <a-tab-pane key="collect" tab="我的收藏"></a-tab-pane>
+        <a-tab-pane key="archive" tab="已归档"></a-tab-pane>
+        <a-tab-pane key="deleted" tab="回收站"></a-tab-pane>
+        <a-button
+          slot="tabBarExtraContent"
+          type="primary"
+          icon="plus"
+          @click="doAction(null,'new')"
+        >创建新项目</a-button>
+      </a-tabs>
+      <a-list
+        class="project-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore" />
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <a-list-item-meta :description="item.description">
+            <div slot="title">
+              <router-link :to="'/project/space/task/' + item.code">{{item.name}}</router-link>
+              <a-tag color="green" class="m-l" v-show="!item.private">公开</a-tag>
+            </div>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="ant-list-item-content other-info muted">
+            <div class="info-item">
+              <span>创建日期</span>
+              <span>{{moment(item.create_time).format('YYYY-MM-DD')}}</span>
+            </div>
+            <div class="info-item">
+              <span>创建人</span>
+              <span>{{item.owner_name}}</span>
+            </div>
+          </div>
+          <div class="ant-list-item-content schedule muted">
+            <div class="info-item">
+              <span>进度</span>
+              <a-progress :strokeWidth="5" :percent="item.schedule" />
+            </div>
+          </div>
+          <template v-if="selectBy === 'my' || selectBy === 'collect'">
+            <span slot="actions" @click="inviteProjectMember(item)">
+              <a-tooltip title="添加成员">
+                <a-icon type="user-add" />
+              </a-tooltip>
+            </span>
+            <span slot="actions" @click="doAction(item,'edit',index)">
+              <a-tooltip title="项目设置">
+                <a-icon type="setting" />
+              </a-tooltip>
+            </span>
+            <span slot="actions">
+              <a-tooltip
+                :title="item.collected ? '取消收藏' : '加入收藏'"
+                @click="doAction(item,'collect',index)"
+              >
+                <a-icon type="star" v-show="!item.collected" />
+                <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="item.collected" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'archive'">
+            <span slot="actions">
+              <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
+                <a-icon type="undo" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'archive' || selectBy === 'my' || selectBy === 'collect'">
+            <span slot="actions" @click="doAction(item,'del',index)">
+              <a-tooltip title="移至回收站">
+                <a-icon type="delete" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'deleted'">
+            <span slot="actions">
+              <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
+                <a-icon type="undo" />
+              </a-tooltip>
+            </span>
+          </template>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+    <a-modal
+      destroyOnClose
+      :width="360"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="form">
+        <a-form-item>
+          <a-input
+            placeholder="项目名称（必填）"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入项目名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-select
-                            placeholder='项目模板'
-                            v-decorator="[
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-select
+            placeholder="项目模板"
+            v-decorator="[
                                             'templateCode',
                                             ]"
-                    >
-                        <a-select-option :key="0">
-                            空白项目
-                        </a-select-option>
-                        <a-select-option :key="template.code" v-for="template in templateList">
-                            {{template.name}}
-                        </a-select-option>
-                    </a-select>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='项目简介'
-                                :rows="2"
-                                v-decorator="['description']"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">完成并创建
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                class="project-config-modal"
-                :width="800"
-                v-model="projectModal.modalStatus"
-                :title="projectModal.modalTitle"
-                :footer="null"
-        >
-            <project-config :code="currentProjectCode" @update="updateProject"></project-config>
-        </a-modal>
-        <invite-project-member v-model="showInviteMember" :project-code="currentProjectCode"
-                               v-if="showInviteMember"></invite-project-member>
-    </div>
+          >
+            <a-select-option :key="0">空白项目</a-select-option>
+            <a-select-option :key="template.code" v-for="template in templateList">{{template.name}}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="项目简介" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >完成并创建</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      class="project-config-modal"
+      :width="800"
+      v-model="projectModal.modalStatus"
+      :title="projectModal.modalTitle"
+      :footer="null"
+    >
+      <project-config :code="currentProjectCode" @update="updateProject"></project-config>
+    </a-modal>
+    <invite-project-member
+      v-model="showInviteMember"
+      :project-code="currentProjectCode"
+      v-if="showInviteMember"
+    ></invite-project-member>
+  </div>
 </template>
 <script>
-    import inviteProjectMember from '../../../components/project/inviteProjectMember'
-    import projectConfig from '@/components/project/projectConfig'
-    import {list, doData, recycle} from '@/api/project';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {collect} from "../../../api/projectCollect";
-    import {list as projectTemplates} from "../../../api/projectTemplate";
-    import {recovery, recoveryArchive} from "../../../api/project";
+import inviteProjectMember from "../../../components/project/inviteProjectMember";
+import projectConfig from "@/components/project/projectConfig";
+import { list, doData, recycle } from "@/api/project";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { collect } from "../../../api/projectCollect";
+import { list as projectTemplates } from "../../../api/projectTemplate";
+import { recovery, recoveryArchive } from "../../../api/project";
 
-    export default {
-        components: {
-            inviteProjectMember,
-            projectConfig
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                selectBy: this.$route.params.type || 'my',
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                currentProject: {},
-                currentProjectCode: 0,
-                currentProjectIndex: 0,
-                newData: {
-                    code: ''
-                },
-                form: this.$form.createForm(this),
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑项目',
-                },
-                /*项目设置*/
-                projectModal: {
-                    modalStatus: false,
-                    modalTitle: '项目设置',
-                },
-                templateList: [],
-            }
-        },
-        watch: {
-            $route: function () {
-                this.selectBy =  this.$route.params.type || 'my'
-                this.init();
-            },
-        },
-        created() {
-            this.init();
-            this.projectTemplates();
-        },
-        methods: {
-            moment,
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 100;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.selectBy = this.selectBy;
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            projectTemplates() {
-                projectTemplates({pageSize: 100, viewType: -1}).then(res => {
-                    this.templateList = res.data.list;
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            inviteProjectMember(item) {
-                this.currentProject = item;
-                this.currentProjectCode = item.code;
-                this.showInviteMember = true;
-            },
-            doAction(record, action, index) {
-                this.currentProject = record;
-                this.currentProjectIndex = index;
-                let app = this;
-                app.newData = {id: 0};
-                if (action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '创建项目';
-                } else if (action == 'edit') {
-                    app.currentProjectCode = record.code;
-                    app.projectModal.modalStatus = true;
-                } else if (action == 'del') {
-                    this.$confirm({
-                        title: '确定放入回收站？',
-                        content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                        okText: '放入回收站',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            recycle(record.code).then(() => {
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else if (action == 'collect') {
-                    const type = record.collected ? 'cancel' : 'collect';
-                    collect(record.code, type).then(() => {
-                        app.$set(app.dataSource[index], 'collected', !record.collected);
-                        if (this.requestData.type == 'collect') {
-                            app.dataSource.splice(index, 1);
-                        }
-                    });
-                } else if (action == 'recoveryArchive') {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                        content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else if (action == 'recovery') {
-                    this.$confirm({
-                        title: '确定恢复项目？',
-                        content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '恢复项目',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recovery(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            updateProject(data) {
-                this.dataSource[this.currentProjectIndex] = JSON.parse(JSON.stringify(data));
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                if (app.newData.code) {
-                    //编辑
-                    obj.projectCode = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.form.resetFields();
-                    app.newData = {id: 0};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
+export default {
+  components: {
+    inviteProjectMember,
+    projectConfig,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      selectBy: this.$route.params.type || "my",
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      currentProject: {},
+      currentProjectCode: 0,
+      currentProjectIndex: 0,
+      newData: {
+        code: "",
+      },
+      form: this.$form.createForm(this),
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑项目",
+      },
+      /*项目设置*/
+      projectModal: {
+        modalStatus: false,
+        modalTitle: "项目设置",
+      },
+      templateList: [],
+    };
+  },
+  watch: {
+    $route: function () {
+      this.selectBy = this.$route.params.type || "my";
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+    this.projectTemplates();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 100;
+        this.showLoadingMore = false;
+      }
+      this.requestData.selectBy = this.selectBy;
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    projectTemplates() {
+      projectTemplates({ pageSize: 100, viewType: -1 }).then((res) => {
+        this.templateList = res.data.list;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    inviteProjectMember(item) {
+      this.currentProject = item;
+      this.currentProjectCode = item.code;
+      this.showInviteMember = true;
+    },
+    doAction(record, action, index) {
+      this.currentProject = record;
+      this.currentProjectIndex = index;
+      let app = this;
+      app.newData = { id: 0 };
+      if (action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "创建项目";
+      } else if (action == "edit") {
+        app.currentProjectCode = record.code;
+        app.projectModal.modalStatus = true;
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "collect") {
+        const type = record.collected ? "cancel" : "collect";
+        collect(record.code, type).then(() => {
+          app.$set(app.dataSource[index], "collected", !record.collected);
+          if (this.requestData.type == "collect") {
+            app.dataSource.splice(index, 1);
+          }
+        });
+      } else if (action == "recoveryArchive") {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "recovery") {
+        this.$confirm({
+          title: "确定恢复项目？",
+          content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "恢复项目",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recovery(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    updateProject(data) {
+      this.dataSource[this.currentProjectIndex] = JSON.parse(
+        JSON.stringify(data)
+      );
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      if (app.newData.code) {
+        //编辑
+        obj.projectCode = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
 
-                });
-            },
-            handleSearchSubmit() {
-                let app = this;
-                app.searchForm.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.search();
-                        }
-                    })
-            },
-            search() {
-                let obj = this.searchForm.getFieldsValue();
-                Object.assign(this.requestData, obj);
-                this.init();
-            },
-            selectChange() {
-                this.init();
-            }
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
+        }
+        app.form.resetFields();
+        app.newData = { id: 0 };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+    handleSearchSubmit() {
+      let app = this;
+      app.searchForm.validateFields((err) => {
+        if (!err) {
+          app.search();
         }
-    }
+      });
+    },
+    search() {
+      let obj = this.searchForm.getFieldsValue();
+      Object.assign(this.requestData, obj);
+      this.init();
+    },
+    selectChange() {
+      this.init();
+    },
+  },
+};
 </script>
-<style lang="less">
-    @import "~ant-design-vue/lib/style/themes/default";
 
-    .project-list-index {
-        .project-list {
-            .ant-list-item-meta-avatar {
-                .ant-avatar {
-                    width: 50px;
-                    height: 50px;
-                    border-radius: 3px;
-                }
-            }
+<style lang="less" scoped>
+@import "~ant-design-vue/lib/style/themes/default";
 
-            .ant-list-item-content {
-                display: -webkit-box;
-                display: -ms-flexbox;
-                display: flex;
-                -webkit-box-flex: 1;
-                -ms-flex: 1;
-                flex: 1;
-                -webkit-box-pack: end;
-                -ms-flex-pack: end;
-                justify-content: flex-end;
-
-                .other-info {
-                    display: flex;
-
-                    .info-item {
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 48px;
-                    }
-
-                    .schedule {
-                        width: 250px;
-                    }
-                }
-            }
-
-            .ant-list-item-action {
-                .anticon:hover {
-                    svg {
-                        color: @primary-color;
-                    }
-                }
-            }
-        }
-    }
+.wrapper-main {
+  padding: 0;
+}
 </style>
diff --git a/src/views/project/recycle/index.vue b/src/views/project/recycle/index.vue
index 18a2906..fa65db7 100644
--- a/src/views/project/recycle/index.vue
+++ b/src/views/project/recycle/index.vue
@@ -77,8 +77,7 @@
                     this.pagination.pageSize = 100;
                     this.showLoadingMore = false;
                 }
-                this.requestData.recycle = 1;
-                this.requestData.type = 'other';
+                this.requestData.selectBy = 'deleted';
                 app.loading = true;
                 list(app.requestData).then(res => {
                     app.dataSource = app.dataSource.concat(res.data.list);
-- 
Gitee


From 03cc0216669827d3fb1e3d562b77213bd1b2ca44 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Thu, 6 Aug 2020 15:05:58 +0800
Subject: [PATCH 2/8] =?UTF-8?q?=20-=20=E4=BC=98=E5=8C=96=E6=89=8B=E6=9C=BA?=
 =?UTF-8?q?=E7=AB=AF=E6=98=BE=E7=A4=BA=20=20-=20=E4=BF=AE=E5=A4=8D?=
 =?UTF-8?q?=E4=B8=80=E4=BA=9B=E7=BB=86=E8=8A=82=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 public/index.html                             |    4 +-
 src/assets/css/components/base.less           |   46 +-
 src/assets/css/components/layout.less         |  215 +-
 src/assets/css/components/list.less           |  154 +-
 src/assets/css/components/warpperContent.less |   53 +-
 src/assets/js/http.js                         |    1 +
 src/components/layout/UserLayout.vue          |  279 +--
 src/components/layout/WrapperContent.vue      |  252 ++-
 src/components/layout/header/HeaderAvatar.vue |  224 ++-
 src/components/layout/header/HeaderNotice.vue |  468 ++---
 .../project/inviteProjectMember.vue           |  388 ++--
 src/components/project/projectConfig.vue      | 1792 +++++++++--------
 src/store/state.js                            |    2 +-
 src/views/home/index.vue                      | 1338 ++++++------
 src/views/index.vue                           |  744 +++----
 src/views/member/Register.vue                 |  644 +++---
 src/views/member/login.vue                    |  836 ++++----
 src/views/members/index.vue                   |    1 -
 src/views/organization/index.vue              |  419 ++--
 src/views/project/archive/index.vue           |  318 +--
 src/views/project/list/index.vue              |  829 ++++----
 src/views/project/recycle/index.vue           |    3 +-
 22 files changed, 4824 insertions(+), 4186 deletions(-)

diff --git a/public/index.html b/public/index.html
index 6ea539e..3b76c9b 100644
--- a/public/index.html
+++ b/public/index.html
@@ -2,9 +2,9 @@
 <html>
 <head>
   <meta charset="utf-8">
-  <!--<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">-->
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
   <link id="icon" rel="icon" type="image/x-icon" href="<%= BASE_URL %>favicon.ico">
-  <title>Pear Project</title>
+  <title>项目管理系统</title>
 </head>
 <body>
 <div id="app"></div>
diff --git a/src/assets/css/components/base.less b/src/assets/css/components/base.less
index 08ff6e3..2b76236 100644
--- a/src/assets/css/components/base.less
+++ b/src/assets/css/components/base.less
@@ -1,9 +1,11 @@
 body {
   overflow: hidden;
 }
-.ant-layout{
+
+.ant-layout {
   background: #f5f5f5;
 }
+
 .pull-right {
   float: right;
 }
@@ -96,7 +98,8 @@ body {
   }
 }
 
-.group-btn, .submit-set {
+.group-btn,
+.submit-set {
   .cancel-text {
     margin-right: 12px;
   }
@@ -173,7 +176,9 @@ body {
     }
 
     &.price {
-      .editable-cell-input-wrapper, .editable-cell-text-wrapper {
+
+      .editable-cell-input-wrapper,
+      .editable-cell-text-wrapper {
         padding-left: 15px;
       }
     }
@@ -220,7 +225,13 @@ body {
 }
 
 .wangEditor-txt {
-  h1, h2, h3, h4, h5, h6 {
+
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
     font-weight: bold;
   }
 }
@@ -319,7 +330,7 @@ body {
   color: #383838;
 }
 
-.project-navigation .ivu-breadcrumb > span:last-child {
+.project-navigation .ivu-breadcrumb>span:last-child {
   font-weight: normal;
 }
 
@@ -361,17 +372,17 @@ body {
   justify-content: center;
 }
 
-.project-navigation .nav-body .nav-wrapper.nav > li {
+.project-navigation .nav-body .nav-wrapper.nav>li {
   z-index: 2;
   padding: 0 20px;
 }
 
-.project-navigation .nav-underscore > li {
+.project-navigation .nav-underscore>li {
   list-style: none;
   float: left;
 }
 
-.project-navigation .nav-underscore > li a {
+.project-navigation .nav-underscore>li a {
   display: inline-block;
   position: relative;
   height: 50px;
@@ -382,7 +393,7 @@ body {
   font-weight: normal;
 }
 
-.project-navigation .nav-body .nav-wrapper.nav > li .app[data-app=tasks] {
+.project-navigation .nav-body .nav-wrapper.nav>li .app[data-app=tasks] {
   position: relative;
   float: left;
   max-width: 200px;
@@ -391,11 +402,11 @@ body {
   white-space: nowrap;
 }
 
-.project-navigation .nav-underscore > li > a:hover {
+.project-navigation .nav-underscore>li>a:hover {
   background-color: inherit;
 }
 
-.project-navigation .nav-underscore > li > a:after {
+.project-navigation .nav-underscore>li>a:after {
   position: absolute;
   left: 0;
   bottom: 0;
@@ -406,7 +417,8 @@ body {
   opacity: 0;
 }
 
-.project-navigation .nav-underscore > li > a:hover:after, .project-navigation .nav-underscore > .actives > a:after {
+.project-navigation .nav-underscore>li>a:hover:after,
+.project-navigation .nav-underscore>.actives>a:after {
   border-width: 3px;
   opacity: 1;
 }
@@ -416,3 +428,13 @@ body {
     background: hsla(0, 0%, 100%, .95);
   }
 }
+
+
+.ant-tabs-bar {
+  margin: 1rem 1rem 0.5rem;
+}
+
+.ant-table-thead{
+  white-space: nowrap;
+  word-break: keep-all;
+}
\ No newline at end of file
diff --git a/src/assets/css/components/layout.less b/src/assets/css/components/layout.less
index c61be7f..69cce27 100644
--- a/src/assets/css/components/layout.less
+++ b/src/assets/css/components/layout.less
@@ -1,38 +1,74 @@
+.ant-layout-content {
+  overflow: auto;
+}
+
 #layout {
   height: 100vh;
 
   .ant-layout-header {
+    user-select: none;
     background: #fff;
     padding: 0;
-    line-height: 85px;
+    line-height: 4rem;
     position: fixed;
     width: 100%;
     top: 0;
     z-index: 5;
     //box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
-    box-shadow: 0 0 8px 0 rgba(0,0,0,.1);
+    box-shadow: 0 0 8px 0 rgba(0, 0, 0, .1);
+    display: flex;
+    justify-content: space-between;
+    align-items: stretch;
+
     ul {
       border-bottom: none;
+      flex: 1 0;
+      background: unset;
+      max-width: 50%;
+
+      li {
+        display: inline-block;
+        vertical-align: middle;
+        margin-top: 0px;
+        top: 0;
+        height: 100%;
+        line-height: 4rem;
+      }
+    }
+
+    .left-menudrawer {
+      color: #fff;
+
+      :hover {
+        color: darken(#fff, 6%);
+      }
+    }
+
+    .wap-menu {
+      display: none;
+      visibility: hidden;
+
+      .action-more {
+        width: 3rem;
+        text-align: center;
+        height: 100%;
+        padding: 0;
+      }
     }
   }
 
   .logo {
-    height: 32px;
     padding: 16px;
     text-align: center;
     box-sizing: content-box;
     transition: all .2s;
-    width: 224px;
-    float: left;
     line-height: 1.4;
     background: initial;
     color: #FFF;
     cursor: pointer;
+
     .logo-img {
       width: 30px;
-      position: absolute;
-      left: 35px;
-      top: 15px;
       transition: all .2s;
     }
 
@@ -40,36 +76,28 @@
       color: inherit;
       font-size: 20px;
       position: relative;
+
       .version {
         color: inherit;
-        position: absolute;
-        right: -25px;
         font-size: 14px;
       }
     }
   }
 
   .right-menu {
-    position: absolute;
-    right: 12px;
-    top: 0;
-    height: 100%;
-    line-height: 66px;
     color: #FFF;
     display: flex;
+    flex: 1 0;
+    justify-content: flex-end;
 
     .action {
       cursor: pointer;
-      //display: inline-block;
       transition: all .2s;
       padding: 0 6px;
-      height: 65px;
 
       .anticon {
         font-size: 16px;
-        //vertical-align: middle;
         color: #FFF;
-        //color: rgba(0, 0, 0, .65);
       }
 
       .action-item {
@@ -78,12 +106,8 @@
         position: relative;
 
         &.user-info {
-          padding-left: 52px;
-
           .ant-avatar {
-            position: absolute;
-            left: 12px;
-            top: 18px;
+            margin-right: 0.5rem;
           }
         }
       }
@@ -105,23 +129,16 @@
   }
 
   .ant-layout-sider {
-    z-index: 2;
-    overflow: auto;
-    width: 256px !important;
-    max-width: 256px !important;
+    user-select: none;
+    z-index: 3;
+    width: 256px;
+    max-width: 256px;
     height: 100vh;
     position: fixed;
     left: 0;
     box-shadow: 2px 0 8px 0 rgba(29, 35, 41, .05);
 
     &.ant-layout-sider-collapsed {
-      width: 80px !important;
-      max-width: 80px !important;
-
-      .ant-layout-sider-trigger {
-        width: 80px !important;
-      }
-
       .logo {
         .title {
           display: none;
@@ -129,30 +146,39 @@
       }
     }
 
-    .ant-layout-sider-trigger {
-      width: 256px !important;
+    .ant-layout-sider-zero-width-trigger {
+      bottom: 8rem;
+      top: auto;
+      right: -42px;
+      width: 42px;
+      color: initial;
+      box-shadow: #eaeaea 2px 1px 2px 1px;
+      background: #ffffff;
+      border-radius: 0 0.8rem 0.8rem 0;
     }
-
   }
 
-  .maint-content{
-    .ant-layout-content{
+  .maint-content {
+    .ant-layout-content {
       border-top: 1px solid #e8e8e8;
     }
   }
 
+  .main-content {
+    &.toleft {
+      padding-left: 200px;
+    }
+  }
+
   .ant-layout-footer {
     margin: 0 6px;
     padding: 0 50px 12px 50px;
   }
 
-  .ant-layout-header.collapsed{
-    .logo{
-      width: 48px;
-      .logo-img{
-        left: 27px;
-      }
-      .title{
+  .ant-layout-header.collapsed {
+    .logo {
+
+      .title {
         display: none;
       }
     }
@@ -160,28 +186,33 @@
 
   &.layout-light {
     .ant-layout-header {
+      //background-color: #2b83f9;
+      //background-image: linear-gradient(143deg,#2945cb 20%,#2b83f9 81%,#3a9dff);
+      //background-image: linear-gradient(143deg, #2945cb 20%, #1890ff 81%, #3a9dff);
+      background-image: linear-gradient(143deg, #e12f3f 20%, #f79275 81%, #FFC107);
+      border-bottom: none;
+
       ul {
-        //background-color: #2b83f9;
-        //background-image: linear-gradient(143deg,#2945cb 20%,#2b83f9 81%,#3a9dff);
-        //background-image: linear-gradient(143deg, #2945cb 20%, #1890ff 81%, #3a9dff);
-        background-image: linear-gradient(143deg, #e12f3f 20%, #f79275 81%, #FFC107);
-        border-bottom: none;
 
         li {
           border-bottom: none;
 
-          span, i {
+          span,
+          i {
             color: #FFF;
             //opacity: .69;
           }
 
           &:hover {
-            span, i {
+
+            span,
+            i {
               opacity: 1;
             }
           }
 
-          &.ant-menu-item-selected, &.ant-menu-item-active {
+          &.ant-menu-item-selected,
+          &.ant-menu-item-active {
             color: #1890ff;
             background: rgba(0, 0, 0, 0.08);
           }
@@ -191,8 +222,12 @@
 
     .ant-layout-sider {
       background: #FFF;
-      .ant-layout-sider-children{
-        .ant-menu-inline, .ant-menu-vertical, .ant-menu-vertical-left {
+
+      .ant-layout-sider-children {
+
+        .ant-menu-inline,
+        .ant-menu-vertical,
+        .ant-menu-vertical-left {
           border-right: none;
         }
       }
@@ -216,10 +251,10 @@
 
   &.layout-dark {
     .ant-layout-header {
-      ul {
-        background-color: #fff;
-        background-image: none;
-      }
+      background-color: #fff;
+      background-image: none;
+
+      ul {}
     }
 
     .logo {
@@ -228,7 +263,11 @@
       box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
     }
 
-    .ant-layout-sider{
+    .left-menudrawer {
+      color: initial;
+    }
+
+    .ant-layout-sider {
       box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
     }
 
@@ -242,21 +281,18 @@
 
         .action-item {
           &.user-info {
-            .ant-avatar {
-            }
+            .ant-avatar {}
           }
         }
 
         &:hover {
-          background: rgba(0,0,0,.025);
+          background: rgba(0, 0, 0, .025);
           //background: #e6f7ff;
         }
 
-        &.action-avatar {
-        }
+        &.action-avatar {}
 
-        &.action-organization {
-        }
+        &.action-organization {}
       }
     }
 
@@ -280,6 +316,7 @@
   }
 
   .trigger {
+    user-select: none;
     font-size: 18px;
     line-height: 64px;
     padding: 0 24px;
@@ -294,9 +331,11 @@
 }
 
 .middle-menu {
+  user-select: none;
   padding: 4px 0;
 
-  .ant-dropdown-menu-item-divider, .ant-dropdown-menu-submenu-title-divider {
+  .ant-dropdown-menu-item-divider,
+  .ant-dropdown-menu-submenu-title-divider {
     margin: 4px 0;
   }
 
@@ -314,3 +353,39 @@
 .__vuescroll .__rail-is-vertical {
   z-index: 3;
 }
+
+@media (max-width:768px) {
+  #layout {
+    .main-content.toleft {
+      padding-left: 0px;
+    }
+
+
+    .ant-layout-sider-zero-width-trigger {
+      visibility: hidden;
+    }
+
+    .ant-layout-header {
+      .logo {
+        .title {
+          display: none;
+        }
+      }
+
+      .pc-view {
+        white-space: nowrap;
+        display: none;
+
+        .action-notice {
+          display: none;
+        }
+      }
+
+      .wap-menu {
+        display: block;
+        visibility: visible;
+        flex: 0;
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/list.less b/src/assets/css/components/list.less
index 51511bd..bf25d48 100644
--- a/src/assets/css/components/list.less
+++ b/src/assets/css/components/list.less
@@ -8,18 +8,20 @@
   }
 
   .ant-list-item-content {
-    .other-info {
+    &.other-info {
       display: flex;
 
       .info-item {
         display: flex;
         flex-direction: column;
-        padding-left: 48px;
+        padding-left: 1.5rem;
       }
     }
   }
 
   .ant-list-item-action {
+    margin-left: 1.5rem;
+
     .anticon:hover {
       svg {
         color: @primary-color;
@@ -27,3 +29,151 @@
     }
   }
 }
+
+.project-list {
+  .ant-list-item {
+    padding: 1rem 0 1rem;
+    background: #fff;
+  }
+
+  .ant-list-item-meta {
+    margin-left: 1rem;
+    margin-right: 1rem;
+
+    .ant-list-item-meta-description {
+      font-size: 0.8rem;
+      line-height: 1.75;
+    }
+  }
+
+  .ant-list-item-meta-avatar {
+    .ant-avatar {
+      width: 50px;
+      height: 50px;
+      border-radius: 3px;
+    }
+  }
+
+  .ant-list-item-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -webkit-box-flex: 1;
+    -ms-flex: 1;
+    flex: 1;
+    -webkit-box-pack: end;
+    -ms-flex-pack: end;
+    justify-content: flex-end;
+
+    &.schedule {
+      margin-left: 1rem;
+      margin-right: 1rem;
+
+      .info-item {
+        flex: 1;
+        padding: 0 1rem;
+      }
+    }
+
+    &.other-info {
+      display: flex;
+      font-size: 0.8rem;
+      flex: 0;
+
+      margin-left: 1rem;
+      margin-right: 1rem;
+
+      .info-item {
+        display: flex;
+        flex-direction: column;
+        word-break: keep-all;
+
+        &:nth-child(n+2) {
+          padding-left: 1.5rem;
+        }
+      }
+    }
+  }
+
+  .ant-list-item-action {
+    margin-left: 1rem;
+    margin-right: 1rem;
+
+    >*:hover {
+      svg {
+        color: @primary-color;
+      }
+    }
+  }
+}
+
+@media (max-width: 930px) {
+  .project-list {
+    .ant-list-item {
+      padding: 1rem 0 0;
+      flex-direction: column;
+      align-items: stretch;
+
+      >*:nth-child(n+2) {
+        margin-top: 0.2rem;
+      }
+
+      .ant-list-item-meta {
+        margin-bottom: 0.8rem;
+      }
+
+      .ant-list-item-content {
+
+        &.schedule {
+
+          .info-item {}
+        }
+
+        &.other-info {
+          justify-content: space-around;
+
+          .info-item {}
+        }
+      }
+
+      .ant-list-item-action {
+        display: flex;
+        justify-content: space-around;
+        margin-left: 0;
+        margin-right: 0;
+        align-items: stretch;
+        margin-top: 0.5rem;
+
+        >li {
+          flex: 1;
+          padding: 0.5rem;
+
+          &:active {
+            background: linear-gradient(0deg, lighten(#000, 96%), transparent);
+          }
+        }
+
+      }
+    }
+  }
+}
+
+@media(max-width: 430px) {
+  .project-list {
+    .ant-list-item {
+      .ant-list-item-meta {
+        flex-direction: column;
+        align-items: stretch;
+
+        .ant-list-item-meta-avatar {
+          margin: 0 0 0.5rem;
+
+          .ant-avatar {
+            width: 100%;
+            height: 100px;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/warpperContent.less b/src/assets/css/components/warpperContent.less
index f15cf5e..821f75f 100644
--- a/src/assets/css/components/warpperContent.less
+++ b/src/assets/css/components/warpperContent.less
@@ -6,6 +6,7 @@
   font-weight: 400;
   //border-bottom: 1px solid #e5e5e5;
 }
+
 .content-title {
   font-size: 18px;
   color: #464c5b;
@@ -21,81 +22,88 @@
   float: right;
 }
 
-.content-action + .page-title {
+.content-action+.page-title {
   //padding-top: 55px;
 }
-.page-header{
+
+.page-header {
   //margin-top: 65px;
   background: #fff;
   padding: 16px 32px 0;
   border-bottom: 1px solid #e8e8e8;
-  .breadcrumb{
+
+  .breadcrumb {
     margin-bottom: 16px;
   }
-  .detail{
+
+  .detail {
     display: flex;
+
     .row {
       display: flex;
       width: 100%;
     }
-    .main{
+
+    .main {
       width: 100%;
       flex: 0 1 auto;
-      .title{
+
+      .title {
         flex: auto;
         font-size: 20px;
         font-weight: 500;
-        color: rgba(0,0,0,.85);
+        color: rgba(0, 0, 0, .85);
         margin-bottom: 16px;
       }
-      .logo{
+
+      .logo {
         width: 28px;
         height: 28px;
         border-radius: 4px;
         margin-right: 16px;
       }
-      .content{
+
+      .content {
         margin-bottom: 16px;
         flex: auto;
       }
-      .extra{
+
+      .extra {
         flex: 0 1 auto;
         margin-left: 88px;
         min-width: 242px;
         text-align: right;
       }
-      .action{
-        margin-left: 56px;
-        min-width: 266px;
+
+      .action {
         flex: 0 1 auto;
         text-align: right;
       }
     }
   }
 }
-.page-header-none{
+
+.page-header-none {
   padding: 0;
   border-bottom: none;
 }
 
 .wrapper-main {
-  margin: 24px;
-  padding: 24px 0 12px 24px;
+  margin: 2rem;
+  padding: 1rem;
   background: rgb(255, 255, 255);
 }
 
 .wrapper-content {
-  width: 100%;
-  padding-right: 24px;
   transition: all 368ms;
-  .action{
+
+  .action {
     padding-bottom: 12px;
     line-height: 3;
   }
 }
 
-.layout-content {
-}
+.layout-content {}
 
 .page-search {
   margin-bottom: 16px;
@@ -142,5 +150,4 @@
   text-align: center;
   padding: 10px 0 20px;
   color: #9ea7b4;
-}
-
+}
\ No newline at end of file
diff --git a/src/assets/js/http.js b/src/assets/js/http.js
index 5e58b88..3327f62 100644
--- a/src/assets/js/http.js
+++ b/src/assets/js/http.js
@@ -14,6 +14,7 @@ if (currentOrganization) {
 }
 const crossDomain = config.crossDomain;
 let axiosConfig = {};
+axiosConfig.baseURL = '/api'// process.env.VUE_APP_API_URL;
 if (crossDomain) {
     axiosConfig.withCredentials = true;
     axiosConfig.crossDomain = true;
diff --git a/src/components/layout/UserLayout.vue b/src/components/layout/UserLayout.vue
index 0f5ba9a..6f044b3 100644
--- a/src/components/layout/UserLayout.vue
+++ b/src/components/layout/UserLayout.vue
@@ -1,151 +1,156 @@
 <template>
-    <div class="userLayout">
-        <div class="container">
-            <div class="top">
-                <div class="header">
-                    <a-badge>
-                        <a href="/">
-                            <img src="../../assets/image/common/logo.png" class="logo" alt="logo">
-                            <span class="title">Pear Project</span>
-                        </a>
-                    </a-badge>
-                </div>
-                <div class="desc">{{desc}}</div>
-            </div>
-
-            <router-view/>
-            <slot></slot>
-
-            <div class="footer">
-                <div class="copyright">
-                    Copyright &copy; 2019 Pear Project
-                </div>
-            </div>
+  <div class="userLayout">
+    <div class="container">
+      <div class="top">
+        <div class="header">
+          <a-badge>
+            <a href="/">
+              <img src="../../assets/image/common/logo.png" class="logo" alt="logo" />
+              <span class="title">项目管理系统</span>
+            </a>
+          </a-badge>
         </div>
+        <div class="desc" v-if="desc">{{desc}}</div>
+      </div>
+
+      <router-view />
+      <slot></slot>
+
+      <!-- <div class="footer">
+        <div class="copyright">Copyright &copy; 2019 Pear Project</div>
+      </div>-->
     </div>
+  </div>
 </template>
 
 <script>
-
-    export default {
-        name: 'UserLayout',
-        props: {
-            desc: {
-                type: [String],
-                default() {
-                    return '欢迎使用Pear Project项目管理系统';
-                }
-            }
-        }
-    }
+export default {
+  name: "UserLayout",
+  props: {
+    desc: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .userLayout {
-        height: 100%;
-        overflow: auto;
-
-        &.mobile {
-            .container {
-                .main {
-                    max-width: 368px;
-                    width: 98%;
-                }
-            }
+.userLayout {
+  height: 100%;
+  overflow: auto;
+  user-select: none;
+
+  &.mobile {
+    .container {
+      .main {
+        max-width: 368px;
+        width: 98%;
+      }
+    }
+  }
+
+  .container {
+    width: 100%;
+    min-height: 100%;
+    background: #f5f5f5 url(~@/assets/image/common/background.svg) no-repeat 50%;
+    background-size: 100%;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+
+    a {
+      text-decoration: none;
+    }
+
+    .top {
+      text-align: center;
+      margin: 1rem auto;
+
+      .header {
+        line-height: 44px;
+        margin: 1rem auto;
+
+        .badge {
+          position: absolute;
+          display: inline-block;
+          line-height: 1;
+          vertical-align: middle;
+          margin-left: -12px;
+          margin-top: -10px;
+          opacity: 0.8;
         }
 
-        .container {
-            width: 100%;
-            min-height: 100%;
-            background: #f5f5f5 url(~@/assets/image/common/background.svg) no-repeat 50%;
-            background-size: 100%;
-            padding: 110px 0 144px;
-            position: relative;
-
-            a {
-                text-decoration: none;
-            }
-
-            .top {
-                text-align: center;
-
-                .header {
-                    height: 44px;
-                    line-height: 44px;
-
-                    .badge {
-                        position: absolute;
-                        display: inline-block;
-                        line-height: 1;
-                        vertical-align: middle;
-                        margin-left: -12px;
-                        margin-top: -10px;
-                        opacity: 0.8;
-                    }
-
-                    .logo {
-                        height: 44px;
-                        vertical-align: top;
-                        margin-right: 12px;
-                        border-style: none;
-                        /*transform: rotate(-25deg);*/
-                        /*-ms-transform: rotate(-25deg); !* IE 9 *!*/
-                        /*-moz-transform: rotate(-25deg); !* Firefox *!*/
-                        /*-webkit-transform: rotate(-25deg); !* Safari 和 Chrome *!*/
-                        /*-o-transform: rotate(-25deg);*/
-                    }
-
-                    .title {
-                        font-size: 33px;
-                        color: rgba(0, 0, 0, .85);
-                        font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
-                        font-weight: 600;
-                        position: relative;
-                        top: 2px;
-                    }
-                }
-
-                .desc {
-                    font-size: 14px;
-                    color: rgba(0, 0, 0, 0.45);
-                    margin-top: 12px;
-                    margin-bottom: 40px;
-                }
-            }
-
-            .main {
-                min-width: 260px;
-                width: 368px;
-                margin: 0 auto;
-            }
-
-            .footer {
-                position: absolute;
-                width: 100%;
-                bottom: 0;
-                padding: 0 16px;
-                margin: 48px 0 24px;
-                text-align: center;
-
-                .links {
-                    margin-bottom: 8px;
-                    font-size: 14px;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.45);
-                        transition: all 0.3s;
-
-                        &:not(:last-child) {
-                            margin-right: 40px;
-                        }
-                    }
-                }
-
-                .copyright {
-                    color: rgba(0, 0, 0, 0.45);
-                    font-size: 14px;
-                }
-            }
+        .logo {
+          height: 44px;
+          vertical-align: top;
+          margin-right: 12px;
+          border-style: none;
+          /*transform: rotate(-25deg);*/
+          /*-ms-transform: rotate(-25deg); !* IE 9 *!*/
+          /*-moz-transform: rotate(-25deg); !* Firefox *!*/
+          /*-webkit-transform: rotate(-25deg); !* Safari 和 Chrome *!*/
+          /*-o-transform: rotate(-25deg);*/
         }
+
+        .title {
+          font-size: 33px;
+          color: rgba(0, 0, 0, 0.85);
+          font-family: "Chinese Quote", -apple-system, BlinkMacSystemFont,
+            "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
+            "Helvetica Neue", Helvetica, Arial, sans-serif, "Apple Color Emoji",
+            "Segoe UI Emoji", "Segoe UI Symbol";
+          font-weight: 600;
+          position: relative;
+          top: 2px;
+        }
+      }
+
+      .desc {
+        font-size: 14px;
+        color: rgba(0, 0, 0, 0.45);
+        margin-top: 0.2rem;
+        margin-bottom: 0.8rem;
+      }
+    }
+
+    .main {
+      min-width: 260px;
+      max-width: 260px;
+      margin: 0 auto;
+    }
+
+    .footer {
+      position: absolute;
+      width: 100%;
+      bottom: 0;
+      padding: 0 16px;
+      margin: 48px 0 24px;
+      text-align: center;
+
+      .links {
+        margin-bottom: 8px;
+        font-size: 14px;
+
+        a {
+          color: rgba(0, 0, 0, 0.45);
+          transition: all 0.3s;
+
+          &:not(:last-child) {
+            margin-right: 40px;
+          }
+        }
+      }
+
+      .copyright {
+        color: rgba(0, 0, 0, 0.45);
+        font-size: 14px;
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/layout/WrapperContent.vue b/src/components/layout/WrapperContent.vue
index ec9c375..45b0cfb 100644
--- a/src/components/layout/WrapperContent.vue
+++ b/src/components/layout/WrapperContent.vue
@@ -1,144 +1,138 @@
 <template>
-    <div>
-        <div class="page-header" v-if="showHeader">
-            <div class="breadcrumb" v-if="breadCrumbInfo.length > 0 && breadCrumb">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <router-link to="/home">首页</router-link>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[2].title}}</a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[1].title}}</a-breadcrumb-item>
-                    <a-breadcrumb-item>{{breadCrumbInfo[0].title}}</a-breadcrumb-item>
-                    <!--<router-link :to="breadCrumbInfo[0].path">{{breadCrumbInfo[0].title}}</router-link>-->
-                </a-breadcrumb>
+  <div>
+    <div class="page-header" v-if="showHeader">
+      <div class="breadcrumb" v-if="breadCrumbInfo.length > 0 && breadCrumb">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <router-link to="/home">首页</router-link>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[2].title}}</a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[1].title}}</a-breadcrumb-item>
+          <a-breadcrumb-item>{{breadCrumbInfo[0].title}}</a-breadcrumb-item>
+          <!--<router-link :to="breadCrumbInfo[0].path">{{breadCrumbInfo[0].title}}</router-link>-->
+        </a-breadcrumb>
+      </div>
+      <div class="detail">
+        <div class="main">
+          <div class="row">
+            <h1 v-if="pageTitle.trim() != '' && showTitle" class="title">{{ pageTitle }}</h1>
+            <h1 v-else-if="showTitle" class="title">{{ defaultPageTitle }}</h1>
+            <div class="action">
+              <slot name="action"></slot>
             </div>
-            <div class="detail">
-                <div class="main">
-                    <div class="row">
-                        <h1 v-if="pageTitle.trim() != '' && showTitle" class="title">{{ pageTitle }}</h1>
-                        <h1 v-else-if="showTitle" class="title">{{ defaultPageTitle }}</h1>
-                        <div class="action">
-                            <slot name="action"></slot>
-                        </div>
-                    </div>
-                    <div class="row">
-                        <div v-if="this.$slots.content" class="content">
-                            <slot name="content"></slot>
-                        </div>
-                        <div v-if="this.$slots.extra" class="extra">
-                            <slot name="extra"></slot>
-                        </div>
-                    </div>
-                </div>
-
+          </div>
+          <div class="row">
+            <div v-if="this.$slots.content" class="content">
+              <slot name="content"></slot>
+            </div>
+            <div v-if="this.$slots.extra" class="extra">
+              <slot name="extra"></slot>
             </div>
+          </div>
         </div>
-        <div class="page-header page-header-none" v-else></div>
-        <div class="page-header page-header-none"></div>
+      </div>
+    </div>
+    <div class="page-header page-header-none" v-else></div>
+    <div class="page-header page-header-none"></div>
 
-        <div class="wrapper-main">
-            <div class="wrapper-content"
-                 :class="{ 'hidden':pageLoading}">
-                <div class="layout-content">
-                    <div class="content-title" v-if="this.$slots.contentTitle || this.$slots.contentAction">
-                        <slot name="contentTitle"></slot>
-                        <div class="content-action">
-                            <slot name="contentAction"></slot>
-                        </div>
-                    </div>
-                    <slot></slot>
-                </div>
+    <div class="wrapper-main">
+      <div class="wrapper-content" :class="{ 'hidden':pageLoading}">
+        <div class="layout-content">
+          <div class="content-title" v-if="this.$slots.contentTitle || this.$slots.contentAction">
+            <slot name="contentTitle"></slot>
+            <div class="content-action">
+              <slot name="contentAction"></slot>
             </div>
+          </div>
+          <slot></slot>
         </div>
+      </div>
     </div>
-
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {getStore} from '@/assets/js/storage'
-    import {getClassObj} from '@/assets/js/utils'
-    import $ from 'jquery'
-    import ABreadcrumb from 'ant-design-vue/es/breadcrumb'
-
-    const ABreadcrumbItem = ABreadcrumb.Item;
+import { mapState } from "vuex";
+import { getStore } from "@/assets/js/storage";
+import { getClassObj } from "@/assets/js/utils";
+import $ from "jquery";
+import ABreadcrumb from "ant-design-vue/es/breadcrumb";
 
+const ABreadcrumbItem = ABreadcrumb.Item;
 
-    export default {
-        components: {
-            ABreadcrumb,
-            ABreadcrumbItem,
-        },
-        props: {
-            pageTitle: {
-                default: ''
-            },
-            showTitle: {
-                default: true
-            },
-            showHeader: {
-                default: true
-            },
-            breadCrumb: {
-                default: true
-            },
-        },
-        mounted() {
-            //用户权限资源检测
-            function TraversalObject(obj, value) {
-                for (let a in obj) {
-                    if (typeof (obj[a]) === "object") {
-                        TraversalObject(obj[a], value); //递归遍历
-                    }
-                    else {
-                        if (a === 'name' && obj[a] === value) {
-                            window.permission = true;
-                        }
-                    }
-                }
-            }
+export default {
+  components: {
+    ABreadcrumb,
+    ABreadcrumbItem,
+  },
+  props: {
+    pageTitle: {
+      default: "",
+    },
+    showTitle: {
+      default: true,
+    },
+    showHeader: {
+      default: true,
+    },
+    breadCrumb: {
+      default: true,
+    },
+  },
+  mounted() {
+    //用户权限资源检测
+    function TraversalObject(obj, value) {
+      for (let a in obj) {
+        if (typeof obj[a] === "object") {
+          TraversalObject(obj[a], value); //递归遍历
+        } else {
+          if (a === "name" && obj[a] === value) {
+            window.permission = true;
+          }
+        }
+      }
+    }
 
-            const auth_list = getStore('auth_list', true);
-            const permissions = $("a[permission]");
-            if (permissions) {
-                $.each(permissions, function (k, v) {
-                    let permission = $(v).attr('permission');
-                    window.permission = false;
-                    TraversalObject(auth_list, permission);
-                    if (!window.permission) {
-                        $(v).remove()
-                    }
-                });
-            }
-            this.$nextTick(function () {
-                // 挂载时隐藏所有父级页面的内容区
-                const ClassElements = getClassObj('wrapper-main');
-                if (ClassElements.length > 1) {
-                    for (let i = 0; i < ClassElements.length - 1; i++) {
-                        ClassElements[i].style.display = "none"
-                    }
-                }
-            })
-        },
-        computed: {
-            ...mapState({
-                pageLoading: state => state.pageLoading,
-                breadCrumbInfo: state => state.menu.breadCrumbInfo,
-            }),
-            defaultPageTitle: {
-                get() {
-                    return this.$route.meta.info.title
-                }
-            },
-            wrapper_content_class: function () {
-            }
-        },
-        destroyed: function () {
-            this.$nextTick(function () {
-                const ClassElements = getClassObj('wrapper-main');
-                for (let i = 0; i < ClassElements.length; i++) {
-                    ClassElements[i].removeAttribute("style");
-                }
-            })
-        },
+    const auth_list = getStore("auth_list", true);
+    const permissions = $("a[permission]");
+    if (permissions) {
+      $.each(permissions, function (k, v) {
+        let permission = $(v).attr("permission");
+        window.permission = false;
+        TraversalObject(auth_list, permission);
+        if (!window.permission) {
+          $(v).remove();
+        }
+      });
     }
+    this.$nextTick(function () {
+      // 挂载时隐藏所有父级页面的内容区
+      const ClassElements = getClassObj("wrapper-main");
+      if (ClassElements.length > 1) {
+        for (let i = 0; i < ClassElements.length - 1; i++) {
+          ClassElements[i].style.display = "none";
+        }
+      }
+    });
+  },
+  computed: {
+    ...mapState({
+      pageLoading: (state) => state.pageLoading,
+      breadCrumbInfo: (state) => state.menu.breadCrumbInfo,
+    }),
+    defaultPageTitle: {
+      get() {
+        return this.$route.meta.info.title;
+      },
+    },
+    wrapper_content_class: function () {},
+  },
+  destroyed: function () {
+    this.$nextTick(function () {
+      const ClassElements = getClassObj("wrapper-main");
+      for (let i = 0; i < ClassElements.length; i++) {
+        ClassElements[i].removeAttribute("style");
+      }
+    });
+  },
+};
 </script>
diff --git a/src/components/layout/header/HeaderAvatar.vue b/src/components/layout/header/HeaderAvatar.vue
index dfd7a5d..4b3f102 100644
--- a/src/components/layout/header/HeaderAvatar.vue
+++ b/src/components/layout/header/HeaderAvatar.vue
@@ -1,86 +1,166 @@
 <template>
-    <div v-if="userInfo">
-        <a-dropdown class="action-item" placement="bottomRight">
-            <div class="user-info">
-                <a-avatar :src="userInfo.avatar" alt="">{{userInfo.name}}</a-avatar>
-                <span>{{userInfo.name}}</span>
-            </div>
-            <a-menu slot="overlay" class="middle-menu" :selectable="false" @click="userAction">
-                <a-menu-item key="setting">
-                    <a href="javascript:;">
-                        <a-icon type="user"></a-icon>
-                        个人设置</a>
-                </a-menu-item>
-                <a-menu-item key="theme">
-                    <a href="javascript:;">
-                        <a-icon type="swap"/>
-                        切换主题</a>
-                </a-menu-item>
-                <a-menu-divider></a-menu-divider>
-                <a-menu-item key="logout">
-                    <a href="javascript:;">
-                        <a-icon type="logout"></a-icon>
-                        退出登录</a>
-                </a-menu-item>
-            </a-menu>
-        </a-dropdown>
-    </div>
-
+  <div v-if="userInfo">
+    <template v-if="type==1">
+      <a-dropdown class="action-item" placement="bottomRight">
+        <div class="user-info">
+          <a-avatar :src="userInfo.avatar" alt>{{userInfo.name}}</a-avatar>
+          <span>{{userInfo.name}}</span>
+        </div>
+        <a-menu slot="overlay" class="middle-menu" :selectable="false" @click="userAction">
+          <a-menu-item key="setting">
+            <a href="javascript:;">
+              <a-icon type="user"></a-icon>个人设置
+            </a>
+          </a-menu-item>
+          <a-menu-item key="theme">
+            <a href="javascript:;">
+              <a-icon type="swap" />切换主题
+            </a>
+          </a-menu-item>
+          <a-menu-divider></a-menu-divider>
+          <a-menu-item key="logout">
+            <a href="javascript:;">
+              <a-icon type="logout"></a-icon>退出登录
+            </a>
+          </a-menu-item>
+        </a-menu>
+      </a-dropdown>
+    </template>
+    <template v-else>
+      <div class="drawer-setting">
+        <div class="user-info">
+          <a-avatar :src="userInfo.avatar" alt>{{userInfo.name}}</a-avatar>
+          <span>{{userInfo.name}}</span>
+        </div>
+        <div @click="userAction({key:'setting'})" key="setting">
+          <a-icon type="user"></a-icon>个人设置
+        </div>
+        <div @click="userAction({key:'theme'})" key="theme">
+          <a-icon type="swap" />
+          {{theme=='dark'?'炫彩':'暗黑'}}模式
+        </div>
+        <div class="group"></div>
+        <div @click="userAction({key:'logout'})" class="logout">
+          <a-icon type="logout"></a-icon>退出登录
+        </div>
+      </div>
+    </template>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import {_out} from "../../../api/user";
+import { mapState } from "vuex";
+import { _out } from "../../../api/user";
 
-    export default {
-        name: 'HeaderAvatar',
-        data() {
-            return {}
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                theme: state => state.theme,
-            })
-        },
-        methods: {
-            userAction(action) {
-                let app = this;
-                if (action.key == 'logout') {
-                    _out();
-                    app.$store.dispatch('SET_LOGOUT');
-                } else if (action.key == 'setting') {
-                    app.$router.push('/account/setting/base');
-                } else if (action.key == 'theme') {
-                    let theme = 'dark';
-                    if (this.theme == theme) {
-                        theme = 'light';
-                    }
-                    this.$store.dispatch('setTheme', theme);
-                } else {
-                }
-            },
+export default {
+  name: "HeaderAvatar",
+  props: {
+    type: {
+      type: [String, Number],
+      default: function () {
+        return 1;
+      },
+    },
+  },
+  data() {
+    return {};
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      theme: (state) => state.theme,
+    }),
+  },
+  methods: {
+    userAction(action) {
+      console.log(action.key);
+      let app = this;
+      if (action.key == "logout") {
+        _out();
+        app.$store.dispatch("SET_LOGOUT");
+      } else if (action.key == "setting") {
+        app.$router.push("/account/setting/base");
+      } else if (action.key == "theme") {
+        let theme = "light";
+        if (this.theme == theme) {
+          theme = "dark";
         }
-    }
+        this.$store.dispatch("setTheme", theme);
+      } else {
+      }
+      this.$emit("finish");
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .avatar-uploader > .ant-upload {
-        width: 128px;
-        height: 128px;
-    }
+.avatar-uploader > .ant-upload {
+  width: 128px;
+  height: 128px;
+}
 
-    .avatar-uploader img {
-        width: 100%;
-    }
+.avatar-uploader img {
+  width: 100%;
+}
 
-    .ant-upload-select-picture-card i {
-        font-size: 32px;
-        color: #999;
-    }
+.ant-upload-select-picture-card i {
+  font-size: 32px;
+  color: #999;
+}
 
-    .ant-upload-select-picture-card .ant-upload-text {
-        margin-top: 8px;
-        color: #666;
+.ant-upload-select-picture-card .ant-upload-text {
+  margin-top: 8px;
+  color: #666;
+}
+
+.drawer-setting {
+  display: flex;
+  flex-direction: column;
+  align-items: stretch;
+  user-select: none;
+  color: #878787;
+  > * {
+    padding: 0.5rem;
+    line-height: 2;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    word-break: keep-all;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    .anticon {
+      margin-right: 0.2rem;
+    }
+    &:active {
+      background: darken(#fff, 6%);
+      transition: all 0.2s ease;
+    }
+    &.user-info {
+      padding: 1rem 0.5rem;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      overflow: hidden;
+      .ant-avatar {
+        margin-right: 0.5rem;
+      }
+      &:active {
+        background: unset;
+      }
+    }
+    &.logout {
+      background: #f14242;
+      color: #fff;
+      border-radius: 2rem;
+      text-align: center;
+      word-spacing: 6px;
+      letter-spacing: 0.3rem;
+      &:active {
+        background: darken(#f14242, 12%);
+      }
+    }
+    &:nth-child(n + 2):not(.group) {
+      border-top: solid 1px #efefef;
     }
+  }
+}
 </style>
diff --git a/src/components/layout/header/HeaderNotice.vue b/src/components/layout/header/HeaderNotice.vue
index b4676ba..6c91f54 100644
--- a/src/components/layout/header/HeaderNotice.vue
+++ b/src/components/layout/header/HeaderNotice.vue
@@ -1,70 +1,80 @@
 <template>
-    <a-popover v-model="showNotice" overlayClassName="header-notice" trigger="click" placement="bottomRight">
-        <template slot="content">
-            <a-spin :spinning="loading">
-                <a-tabs class="header-notice-content" :tabBarGutter="25">
-                    <a-tab-pane key="1">
-                        <span slot="tab">消息<span
-                                v-if="total && totalSum['message']">({{totalSum['message']}})</span></span>
-                        <template v-if="total && totalSum['message']">
-                            <a-list>
-                                <template v-for="item in list['message']">
-                                    <a-list-item :key="item.id">
-                                        <a-list-item-meta :description="item.create_time">
-                                             <span slot="title">
-                                                    <p>{{item.title}}</p>
-                                                    <p class="ant-list-item-meta-description" v-html="item.content"></p>
-                                             </span>
-                                            <a-avatar slot="avatar"
-                                                      :src="item.avatar"/>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </template>
-                            </a-list>
-                            <div class="footer-action">
-                                <a class="item muted" @click="setRead('message')">清空消息</a>
-                                <a class="item muted" @click="showMore('1')">查看更多</a>
-                            </div>
-                        </template>
-                        <template v-else>
-                            <div class="notFound">
-                                <img src="../../../assets/image/notify/laba.svg" alt="not found">
-                                <div>你已读完所有消息</div>
-                            </div>
-                        </template>
-                    </a-tab-pane>
-                    <a-tab-pane key="2">
-                        <span slot="tab">通知<span
-                                v-if="total && totalSum['notice']">({{totalSum['notice']}})</span></span>
-                        <template v-if="total && totalSum['notice']">
-                            <a-list>
-                                <template v-for="item in list['notice']">
-                                    <a-list-item :key="item.id">
-                                        <a-list-item-meta :description="item.create_time">
-                                             <span slot="title">
-                                                 <p v-html="item.title"></p>
-                                                 <p class="ant-list-item-meta-description" v-html="item.content"></p>
-
-                                             </span>
-                                            <a-avatar style="background-color: white" slot="avatar"
-                                                      src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"/>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </template>
-                            </a-list>
-                            <div class="footer-action">
-                                <a class="item muted" @click="setRead('notice')">清空通知</a>
-                                <a class="item muted" @click="()=>{$router.push('/notify/notice')}">查看更多</a>
-                            </div>
-                        </template>
-                        <template v-else>
-                            <div class="notFound">
-                                <img src="../../../assets/image/notify/bell.svg" alt="not found">
-                                <div>你已查看所有通知</div>
-                            </div>
-                        </template>
-                    </a-tab-pane>
-                 <!--   <a-tab-pane key="3">
+  <a-popover
+    v-model="showNotice"
+    overlayClassName="header-notice"
+    trigger="click"
+    placement="bottomRight"
+  >
+    <template slot="content">
+      <a-spin :spinning="loading">
+        <a-tabs class="header-notice-content" :tabBarGutter="25">
+          <a-tab-pane key="1">
+            <span slot="tab">
+              消息
+              <span v-if="total && totalSum['message']">({{totalSum['message']}})</span>
+            </span>
+            <template v-if="total && totalSum['message']">
+              <a-list>
+                <template v-for="item in list['message']">
+                  <a-list-item :key="item.id">
+                    <a-list-item-meta :description="item.create_time">
+                      <span slot="title">
+                        <p>{{item.title}}</p>
+                        <p class="ant-list-item-meta-description" v-html="item.content"></p>
+                      </span>
+                      <a-avatar slot="avatar" :src="item.avatar" />
+                    </a-list-item-meta>
+                  </a-list-item>
+                </template>
+              </a-list>
+              <div class="footer-action">
+                <a class="item muted" @click="setRead('message')">清空消息</a>
+                <a class="item muted" @click="showMore('1')">查看更多</a>
+              </div>
+            </template>
+            <template v-else>
+              <div class="notFound">
+                <img src="../../../assets/image/notify/laba.svg" alt="not found" />
+                <div>你已读完所有消息</div>
+              </div>
+            </template>
+          </a-tab-pane>
+          <a-tab-pane key="2">
+            <span slot="tab">
+              通知
+              <span v-if="total && totalSum['notice']">({{totalSum['notice']}})</span>
+            </span>
+            <template v-if="total && totalSum['notice']">
+              <a-list>
+                <template v-for="item in list['notice']">
+                  <a-list-item :key="item.id">
+                    <a-list-item-meta :description="item.create_time">
+                      <span slot="title">
+                        <p v-html="item.title"></p>
+                        <p class="ant-list-item-meta-description" v-html="item.content"></p>
+                      </span>
+                      <a-avatar
+                        style="background-color: white"
+                        slot="avatar"
+                        src="https://gw.alipayobjects.com/zos/rmsportal/ThXAXghbEsBCCSDihZxY.png"
+                      />
+                    </a-list-item-meta>
+                  </a-list-item>
+                </template>
+              </a-list>
+              <div class="footer-action">
+                <a class="item muted" @click="setRead('notice')">清空通知</a>
+                <a class="item muted" @click="()=>{$router.push('/notify/notice')}">查看更多</a>
+              </div>
+            </template>
+            <template v-else>
+              <div class="notFound">
+                <img src="../../../assets/image/notify/bell.svg" alt="not found" />
+                <div>你已查看所有通知</div>
+              </div>
+            </template>
+          </a-tab-pane>
+          <!--   <a-tab-pane key="3">
                         <span slot="tab">待办<span
                                 v-if="task.total && task.total">({{task.total}})</span></span>
                         <template v-if="task.total && task.total">
@@ -101,187 +111,191 @@
                                 <div>你已完成所有待办</div>
                             </div>
                         </template>
-                    </a-tab-pane>-->
-                </a-tabs>
-            </a-spin>
-        </template>
-        <span>
-          <a-badge :count="total">
-            <a-icon class="action-item" type="bell"/>
-          </a-badge>
-        </span>
-    </a-popover>
+          </a-tab-pane>-->
+        </a-tabs>
+      </a-spin>
+    </template>
+    <span>
+      <a-badge :count="total">
+        <a-icon class="action-item" type="bell" />
+      </a-badge>
+    </span>
+  </a-popover>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import moment from 'moment';
-    import {_clearAll, noReads} from "../../../api/notify";
-    import {notice} from "../../../assets/js/notice";
-    import {showMsgNotification} from "../../../assets/js/notify";
-    import {selfList} from "../../../api/task";
-    import {relativelyTime} from "../../../assets/js/dateTime";
+import { mapState } from "vuex";
+import moment from "moment";
+import { _clearAll, noReads } from "../../../api/notify";
+import { notice } from "../../../assets/js/notice";
+import { showMsgNotification } from "../../../assets/js/notify";
+import { selfList } from "../../../api/task";
+import { relativelyTime } from "../../../assets/js/dateTime";
 
-    export default {
-        name: 'HeaderNotice',
-        data() {
-            return {
-                showNotice: false,
-                loading: false,
-                total: 0,
-                messageTotal: 0,
-                totalSum: 0,
-                list: [],
-                task: {
-                    page: 1,
-                    pageSize: 5,
-                    total: 0,
-                    list: [],
-                }
-            }
-        },
-        computed: {
-            ...mapState({
-                socketAction: state => state.socketAction,
-                currentOrganization: state => state.currentOrganization,
-            })
-        },
-        watch: {
-            socketAction(val) {
-                if (val.action === 'notice') {
-                    this.init();
-                } else if (val.action === 'task') {
-                    this.init();
-                    const permission = showMsgNotification(val.title, val.msg, {icon: val.data.notify.avatar});
-                    if (permission === false) {
-                        notice(val, 'notice', 'info', 10);
-                    }
-                }
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                this.fetchNotice();
-                // this.getTasks();
-            },
-            fetchNotice() {
-                let app = this;
-                noReads().then(res => {
-                    app.list = res.data.list;
-                    app.messageTotal = res.data.total;
-                    app.total = app.messageTotal + app.task.total;
-                    app.totalSum = res.data.totalSum;
-                });
-            },
-            setRead(type) {
-                this.total -= this.list[type].length;
-                this.list[type] = [];
-                switch (type) {
-                    case 'message':
-                        this.totalSum.message = 0;
-                        _clearAll();
-                }
-            },
-            showMore(key) {
-                switch (key) {
-                    default:
-                        this.showNotice = false;
-                        this.$router.push('/notify/notice');
-                }
-            },
-            getTasks() {
-                selfList({page: this.task.page, pageSize: this.task.pageSize}).then(res => {
-                    this.task.list = res.data.list;
-                    this.task.total = res.data.total;
-                    this.total = this.messageTotal + this.task.total;
-                })
-            },
-            formatTime(time) {
-                return moment(time).format('YY年MM月DD日 HH:mm');
-            },
-            showDiff(time, time2) {
-                let diff = moment(time).diff(moment(time2), 'days');
-                if (diff <= 0) {
-                    diff = moment(time).diff(moment(time2), 'hours');
-                    diff += '小时'
-                } else {
-                    diff += '天'
-                }
-                return diff;
-            },
+export default {
+  name: "HeaderNotice",
+  data() {
+    return {
+      showNotice: false,
+      loading: false,
+      total: 0,
+      messageTotal: 0,
+      totalSum: 0,
+      list: [],
+      task: {
+        page: 1,
+        pageSize: 5,
+        total: 0,
+        list: [],
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      socketAction: (state) => state.socketAction,
+      currentOrganization: (state) => state.currentOrganization,
+    }),
+  },
+  watch: {
+    socketAction(val) {
+      if (val.action === "notice") {
+        this.init();
+      } else if (val.action === "task") {
+        this.init();
+        const permission = showMsgNotification(val.title, val.msg, {
+          icon: val.data.notify.avatar,
+        });
+        if (permission === false) {
+          notice(val, "notice", "info", 10);
         }
-    }
+      }
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.fetchNotice();
+      // this.getTasks();
+    },
+    fetchNotice() {
+      let app = this;
+      noReads().then((res) => {
+        app.list = res.data.list;
+        app.messageTotal = res.data.total;
+        app.total = app.messageTotal + app.task.total;
+        app.totalSum = res.data.totalSum;
+      });
+    },
+    setRead(type) {
+      this.total -= this.list[type].length;
+      this.list[type] = [];
+      switch (type) {
+        case "message":
+          this.totalSum.message = 0;
+          _clearAll();
+      }
+    },
+    showMore(key) {
+      switch (key) {
+        default:
+          this.showNotice = false;
+          this.$router.push("/notify/notice");
+      }
+    },
+    getTasks() {
+      selfList({ page: this.task.page, pageSize: this.task.pageSize }).then(
+        (res) => {
+          this.task.list = res.data.list;
+          this.task.total = res.data.total;
+          this.total = this.messageTotal + this.task.total;
+        }
+      );
+    },
+    formatTime(time) {
+      return moment(time).format("YY年MM月DD日 HH:mm");
+    },
+    showDiff(time, time2) {
+      let diff = moment(time).diff(moment(time2), "days");
+      if (diff <= 0) {
+        diff = moment(time).diff(moment(time2), "hours");
+        diff += "小时";
+      } else {
+        diff += "天";
+      }
+      return diff;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .header-notice {
-        .ant-popover-inner-content {
-            padding: 0;
+.header-notice {
+  .ant-popover-inner-content {
+    padding: 0;
 
-            .ant-tabs-bar {
-                margin-bottom: 0 !important;
-            }
+    .ant-tabs-bar {
+      margin-bottom: 0 !important;
+    }
 
-            .ant-list {
-                .ant-list-item {
-                    padding: 12px 24px;
-                    transition: all .3s;
+    .ant-list {
+      .ant-list-item {
+        padding: 12px 24px;
+        transition: all 0.3s;
 
-                    &:hover {
-                        background: #e6f7ff;
-                    }
-                }
-            }
+        &:hover {
+          background: #e6f7ff;
         }
+      }
+    }
+  }
 
-        .header-notice-content {
-            width: 340px;
+  .header-notice-content {
+    width: 340px;
 
-            .ant-tabs-bar {
-                text-align: center;
-                margin-bottom: 5px;
-            }
+    .ant-tabs-bar {
+      text-align: center;
+      margin-bottom: 5px;
+    }
 
-            .ant-list-item-meta-title {
-                p {
-                    margin-bottom: 0;
-                    position: relative;
-                }
-            }
+    .ant-list-item-meta-title {
+      p {
+        margin-bottom: 0;
+        position: relative;
+      }
+    }
 
-            .ant-list-item-meta-description {
-                font-size: 12px;
-            }
+    .ant-list-item-meta-description {
+      font-size: 12px;
+    }
 
-            .ant-list-item:hover {
-                /*background: #e6f7ff;*/
-                cursor: pointer;
-            }
+    .ant-list-item:hover {
+      /*background: #e6f7ff;*/
+      cursor: pointer;
+    }
 
-            .notFound {
-                text-align: center;
-                padding: 73px 0 88px 0;
-                color: rgba(0, 0, 0, 0.45);
-                height: 275px;
+    .notFound {
+      text-align: center;
+      padding: 73px 0 88px 0;
+      color: rgba(0, 0, 0, 0.45);
+      height: 275px;
 
-                img {
-                    margin-bottom: 16px;
-                }
-            }
+      img {
+        margin-bottom: 16px;
+      }
+    }
 
-            .footer-action {
-                border-top: 1px solid #e8e8e8;
-                padding: 12px 0;
+    .footer-action {
+      border-top: 1px solid #e8e8e8;
+      padding: 12px 0;
 
-                .item {
-                    width: 49%;
-                    display: inline-block;
-                    text-align: center;
-                }
-            }
-        }
+      .item {
+        width: 49%;
+        display: inline-block;
+        text-align: center;
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/project/inviteProjectMember.vue b/src/components/project/inviteProjectMember.vue
index e6c7097..612edd3 100644
--- a/src/components/project/inviteProjectMember.vue
+++ b/src/components/project/inviteProjectMember.vue
@@ -1,202 +1,210 @@
 <template>
-    <div>
-        <a-modal
-                class="invite-project-member"
-                :width="500"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :footer="null"
-                @cancel="cancel"
-        >
-            <div class="header">
-                <span>账号邀请</span>
-                <a @click="createInviteLink">通过链接邀请</a>
-            </div>
-            <div class="search-content m-b">
-                <a-input v-model="keyword" placeholder="输入昵称或邮箱查找">
-                    <a-icon slot="prefix" type="search"/>
-                </a-input>
-            </div>
-            <vue-scroll>
-                <div class="member-list">
-                    <a-list
-                            class="project-list"
-                            itemLayout="horizontal"
-                            :loading="searching"
-                            :dataSource="list"
-                            :locale="{emptyText: (keyword && keyword.length > 1) ? '没有搜索到相关成员' : ''}"
-                    >
-                        <a-list-item slot="renderItem" slot-scope="item">
-                    <span slot="actions">
-                        <a-button size="small" type="dashed" icon="user-add"
-                                  v-if="!item.joined"
-                                  @click="invite(item)"
-                        >邀请</a-button>
-                        <template v-else>
-                             <a-icon type="user"></a-icon>
-                            <span> 已加入</span>
-                        </template>
-                     </span>
-                            <a-list-item-meta
-                                    :description="item.email"
-                            >
-                                <span slot="title">{{item.name}}</span>
-                                <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                            </a-list-item-meta>
-                        </a-list-item>
-                    </a-list>
-                </div>
-            </vue-scroll>
-        </a-modal>
-        <a-modal
-                class="invite-link"
-                :width="600"
-                v-model="linkInfo.modalStatus"
-                :title="linkInfo.modalTitle"
-                :footer="null"
-        >
-            <div class="header">
-                <p>链接有效日期：{{linkInfo.overTime}}</p>
-                <a-input-search
-                        size="large"
-                        v-model="linkInfo.link"
-                        v-clipboard:copy="linkInfo.link"
-                        enterButton="复制链接"
-                />
-            </div>
-        </a-modal>
-    </div>
-
+  <div>
+    <a-modal
+      class="invite-project-member"
+      :width="500"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :footer="null"
+      @cancel="cancel"
+    >
+      <div class="header">
+        <span>账号邀请</span>
+        <a @click="createInviteLink">通过链接邀请</a>
+      </div>
+      <div class="search-content m-b">
+        <a-input v-model="keyword" placeholder="输入昵称或邮箱查找">
+          <a-icon slot="prefix" type="search" />
+        </a-input>
+      </div>
+      <vue-scroll>
+        <div class="member-list">
+          <a-list
+            itemLayout="horizontal"
+            :loading="searching"
+            :dataSource="list"
+            :locale="{emptyText: (keyword && keyword.length > 1) ? '没有搜索到相关成员' : ''}"
+          >
+            <a-list-item slot="renderItem" slot-scope="item">
+              <span slot="actions">
+                <a-button
+                  size="small"
+                  type="dashed"
+                  icon="user-add"
+                  v-if="!item.joined"
+                  @click="invite(item)"
+                >邀请</a-button>
+                <template v-else>
+                  <a-icon type="user"></a-icon>
+                  <span>已加入</span>
+                </template>
+              </span>
+              <a-list-item-meta :description="item.email">
+                <span slot="title">{{item.name}}</span>
+                <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+              </a-list-item-meta>
+            </a-list-item>
+          </a-list>
+        </div>
+      </vue-scroll>
+    </a-modal>
+    <a-modal
+      class="invite-link"
+      :width="600"
+      v-model="linkInfo.modalStatus"
+      :title="linkInfo.modalTitle"
+      :footer="null"
+    >
+      <div class="header">
+        <p>链接有效日期：{{linkInfo.overTime}}</p>
+        <a-input-search
+          size="large"
+          v-model="linkInfo.link"
+          v-clipboard:copy="linkInfo.link"
+          enterButton="复制链接"
+        />
+      </div>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import moment from 'moment';
-    import {inviteMember, searchInviteMember, _listForInvite} from "../../api/projectMember";
-    import {checkResponse} from "../../assets/js/utils";
-    import {createInviteLink} from "../../api/common/common";
+import _ from "lodash";
+import moment from "moment";
+import {
+  inviteMember,
+  searchInviteMember,
+  _listForInvite,
+} from "../../api/projectMember";
+import { checkResponse } from "../../assets/js/utils";
+import { createInviteLink } from "../../api/common/common";
 
-    export default {
-        name: "inviteProjectMember",
-        props: {
-            value: {
-                type: Boolean,
-                default() {
-                    return false
-                }
-            },
-            projectCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            }
-        },
-        data() {
-            return {
-                form: this.$form.createForm(this),
-                actionInfo: {
-                    modalStatus: this.value,
-                    confirmLoading: false,
-                    modalTitle: '邀请新成员',
-                },
-                linkInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '邀请成员',
-                    link: '',
-                    overTime: '',
-                },
-                keyword: '',
-                searching: false,
-                list: [],
-                // emptyText: keyword ? '没有搜索结果' : ''
-            };
-        },
-        watch: {
-            value(value) {
-                this.actionInfo.modalStatus = value;
-            },
-            keyword() {
-                this.search();
-            }
-        },
-        created() {
-            this.getMembers();
-        },
-        methods: {
-            getMembers() {
-                let app = this;
-                _listForInvite({projectCode: app.projectCode}).then(res=>{
-                    app.list = res.data;
-                });
-            },
-            invite(item) {
-                inviteMember(item.memberCode, this.projectCode).then((res) => {
-                    const success = checkResponse(res);
-                    if (success) {
-                        item.joined = true;
-                    }
-                })
-            },
-            createInviteLink() {
-                if (!this.linkInfo.link) {
-                    createInviteLink({inviteType: 'project', sourceCode: this.projectCode}).then(res => {
-                        const success = checkResponse(res);
-                        if (success) {
-                            this.linkInfo.modalStatus = true;
-                            this.linkInfo.link = window.location.href.split('#')[0] + '#/invite_from_link/' + res.data.code;
-                            this.linkInfo.overTime = moment(res.data.code.over_time).format('YYYY年M月D日 HH:mm');
-                        }
-                    });
-                }else{
-                    this.linkInfo.modalStatus = true;
-                }
-            },
-            search: _.debounce(
-                function () {
-                    if (!this.keyword) {
-                        this.list = [];
-                    }
-                    if (this.keyword.length <= 1) {
-                        this.getMembers();
-                        return false;
-                    }
-                    this.searching = true;
-                    searchInviteMember(this.keyword, this.projectCode).then(res => {
-                        this.searching = false;
-                        this.list = res.data;
-                    });
-                }, 500
-            ),
-            cancel() {
-                this.actionInfo.modalStatus = false;
-                this.$emit('input', this.actionInfo.modalStatus);
-            }
+export default {
+  name: "inviteProjectMember",
+  props: {
+    value: {
+      type: Boolean,
+      default() {
+        return false;
+      },
+    },
+    projectCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      actionInfo: {
+        modalStatus: this.value,
+        confirmLoading: false,
+        modalTitle: "邀请新成员",
+      },
+      linkInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "邀请成员",
+        link: "",
+        overTime: "",
+      },
+      keyword: "",
+      searching: false,
+      list: [],
+      // emptyText: keyword ? '没有搜索结果' : ''
+    };
+  },
+  watch: {
+    value(value) {
+      this.actionInfo.modalStatus = value;
+    },
+    keyword() {
+      this.search();
+    },
+  },
+  created() {
+    this.getMembers();
+  },
+  methods: {
+    getMembers() {
+      let app = this;
+      _listForInvite({ projectCode: app.projectCode }).then((res) => {
+        app.list = res.data;
+      });
+    },
+    invite(item) {
+      inviteMember(item.memberCode, this.projectCode).then((res) => {
+        const success = checkResponse(res);
+        if (success) {
+          item.joined = true;
         }
-    }
+      });
+    },
+    createInviteLink() {
+      if (!this.linkInfo.link) {
+        createInviteLink({
+          inviteType: "project",
+          sourceCode: this.projectCode,
+        }).then((res) => {
+          const success = checkResponse(res);
+          if (success) {
+            this.linkInfo.modalStatus = true;
+            this.linkInfo.link =
+              window.location.href.split("#")[0] +
+              "#/invite_from_link/" +
+              res.data.code;
+            this.linkInfo.overTime = moment(res.data.code.over_time).format(
+              "YYYY年M月D日 HH:mm"
+            );
+          }
+        });
+      } else {
+        this.linkInfo.modalStatus = true;
+      }
+    },
+    search: _.debounce(function () {
+      if (!this.keyword) {
+        this.list = [];
+      }
+      if (this.keyword.length <= 1) {
+        this.getMembers();
+        return false;
+      }
+      this.searching = true;
+      searchInviteMember(this.keyword, this.projectCode).then((res) => {
+        this.searching = false;
+        this.list = res.data;
+      });
+    }, 500),
+    cancel() {
+      this.actionInfo.modalStatus = false;
+      this.$emit("input", this.actionInfo.modalStatus);
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .invite-project-member {
-        .ant-modal-body {
-            padding-top: 0;
-            padding-right: 12px;
-            padding-bottom: 24px;
-            min-height: 40vh;
-        }
+.invite-project-member {
+  .ant-modal-body {
+    padding-top: 0;
+    padding-right: 12px;
+    padding-bottom: 24px;
+    min-height: 40vh;
+  }
 
-        .header {
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between;
-            padding: 12px 0;
-        }
-
-        .member-list {
-            padding-right: 12px;
-            max-height: 400px;
-        }
+  .header {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    padding: 12px 0;
+  }
 
-    }
+  .member-list {
+    padding-right: 12px;
+    max-height: 400px;
+  }
+}
 </style>
diff --git a/src/components/project/projectConfig.vue b/src/components/project/projectConfig.vue
index 3418d0f..26d140c 100644
--- a/src/components/project/projectConfig.vue
+++ b/src/components/project/projectConfig.vue
@@ -1,897 +1,987 @@
 <template>
-    <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
-        <a-tab-pane key="1">
-                    <span slot="tab">
-                        <a-icon type="heat-map"/>
-                        概览
-                    </span>
-            <div class="config-content">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目封面</p>
-                        <div class="cover-item">
-                            <template v-if="project.cover">
-                                <img class="avatar" :src="project.cover"/>
-                            </template>
-                            <span class="no-avatar" v-show="!project.cover"></span>
-                            <a-upload
-                                    name="cover"
-                                    class="cover-uploader"
-                                    :showUploadList="false"
-                                    :headers="headers"
-                                    :action="uploadAction"
-                                    :beforeUpload="beforeUpload"
-                                    @change="handleChange"
-                            >
-                                <a-button size="large" class="upload">上传新封面</a-button>
-                                <p class="upload-tips muted">最佳图片比例为300*150</p>
-                            </a-upload>
-                        </div>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目名称</p>
-                        <a-input size="large" v-model="project.name"></a-input>
-                    </div>
-                    <div class="infos">
-                        <p class="item-title">项目进度 (%)</p>
-                        <a-input-number
-                                size="large"
-                                :min="0"
-                                :max="100"
-                                v-model="project.schedule"></a-input-number>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目简介</p>
-                        <a-input type="textarea" :rows="3" size="large" placeholder="介绍一下这个项目"
-                                 v-model="project.description"></a-input>
+  <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
+    <a-tab-pane key="1">
+      <span slot="tab">
+        <a-icon type="heat-map" />概览
+      </span>
+      <div class="config-content">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目封面</p>
+            <div class="cover-item">
+              <template v-if="project.cover">
+                <img class="avatar" :src="project.cover" />
+              </template>
+              <span class="no-avatar" v-show="!project.cover"></span>
+              <a-upload
+                name="cover"
+                class="cover-uploader"
+                :showUploadList="false"
+                :headers="headers"
+                :action="uploadAction"
+                :beforeUpload="beforeUpload"
+                @change="handleChange"
+              >
+                <a-button size="large" class="upload">上传新封面</a-button>
+                <p class="upload-tips muted">最佳图片比例为300*150</p>
+              </a-upload>
+            </div>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目名称</p>
+            <a-input size="large" v-model="project.name"></a-input>
+          </div>
+          <div class="infos">
+            <p class="item-title">项目进度 (%)</p>
+            <a-input-number size="large" :min="0" :max="100" v-model="project.schedule"></a-input-number>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目简介</p>
+            <a-input
+              type="textarea"
+              :rows="3"
+              size="large"
+              placeholder="介绍一下这个项目"
+              v-model="project.description"
+            ></a-input>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目公开性</p>
+            <a-select size="large" v-model="project.private">
+              <a-select-option :key="0">公开项目（所有人都可通过链接访问，仅项目成员可编辑）</a-select-option>
+              <a-select-option :key="1">私有项目（仅项目成员可查看和编辑）</a-select-option>
+            </a-select>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目拥有者</p>
+            <div class="m-t">
+              <a-avatar :src="project.owner_avatar"></a-avatar>
+              <span class="m-l">{{project.owner_name}}</span>
+              <!--<a-button class="middle-btn pull-right" size="large">
+                                移交
+              </a-button>-->
+            </div>
+          </div>
+        </div>
+        <a-divider />
+        <div class="content-item">
+          <div class="infos">
+            <a-button
+              type="primary"
+              class="middle-btn pull-right"
+              size="large"
+              @click="saveProject"
+            >保存</a-button>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="2" forceRender>
+      <span slot="tab">
+        <a-icon type="eye" />项目偏好
+      </span>
+      <div class="config-content task-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">看板风格</p>
+            <div class="item-tips muted">切换任务看板的主题风格，内置两种风格。</div>
+            <a-radio-group @change="saveProject" v-model="project.task_board_theme">
+              <a-radio style="display: block;height: 30px;line-height: 30px" value="default">默认</a-radio>
+              <a-radio style="display: block;height: 30px;line-height: 30px" value="simple">简约</a-radio>
+            </a-radio-group>
+          </div>
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">自动更新项目进度</p>
+            <div class="item-tips muted">根据当前任务的完成情况自动计算项目进度。</div>
+          </div>
+          <a-switch v-model="project.auto_update_schedule" @change="saveProject" />
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="3">
+      <span slot="tab">
+        <a-icon type="check-square" />任务设置
+      </span>
+      <div class="config-content task-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目ID</p>
+            <div class="item-tips muted">设置项目编号，编号将作为 ID 前缀，用以区别项目。支持 2-6 位字母。</div>
+            <a-input
+              class="prefix-input"
+              size="large"
+              placeholder="如 Pear Project 可以设置为 EP"
+              v-model="project.prefix"
+              :disabled="!project.open_prefix"
+            ></a-input>
+            <a-button
+              size="large"
+              class="middle-btn"
+              type="primary"
+              :disabled="!project.open_prefix"
+              @click="saveProject"
+            >保存</a-button>
+          </div>
+          <a-switch v-model="project.open_prefix" @change="saveProject" />
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">任务开始时间</p>
+            <div class="item-tips muted">为任务设置开始时间，更科学地规划工作。</div>
+          </div>
+          <a-switch v-model="project.open_begin_time" @change="saveProject" />
+        </div>
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">新任务默认开启隐私模式</p>
+            <div class="item-tips muted">对本项目内的新任务默认开启隐私模式，创建成功后仅参与者可见</div>
+          </div>
+          <a-switch v-model="project.open_task_private" @change="saveProject" />
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="4" forceRender>
+      <span slot="tab">
+        <a-icon type="deployment-unit" />任务流转
+      </span>
+      <div class="config-content">
+        <div class="content-item task-workflow">
+          <div class="infos" style="padding-right: 0">
+            <div v-show="!doTaskWorkflowView">
+              <p>
+                <a-button type="primary" icon="plus" @click="doTaskWorkflow(null)">创建规则</a-button>
+              </p>
+              <a-list
+                class="task-workflow-list"
+                itemLayout="horizontal"
+                :dataSource="taskWorkflowList"
+              >
+                <a-list-item slot="renderItem" slot-scope="item">
+                  <span slot="actions">
+                    <a-tooltip placement="top" title="编辑">
+                      <a class="muted m-r-sm" @click="doTaskWorkflow(item)">
+                        <a-icon type="edit"></a-icon>
+                      </a>
+                    </a-tooltip>
+                    <a-tooltip placement="top" title="删除">
+                      <a class="muted" @click="delTaskWorkflow(item.code)">
+                        <a-icon type="delete"></a-icon>
+                      </a>
+                    </a-tooltip>
+                  </span>
+                  <a-list-item-meta>
+                    <span slot="title">{{item.name}}</span>
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
+            </div>
+            <div v-show="doTaskWorkflowView">
+              <div class="header">
+                <p>
+                  <a-button
+                    size="large"
+                    class="middle-btn m-r-sm"
+                    @click="saveTaskWorkflow(false)"
+                  >取消</a-button>
+                  <a-button
+                    size="large"
+                    class="middle-btn"
+                    type="primary"
+                    @click="saveTaskWorkflow(true)"
+                    :disabled="!canSaveTaskWorkflow"
+                  >保存</a-button>
+                </p>
+              </div>
+              <div class="workflow-content">
+                <template v-if="!loadingWorkflowRule">
+                  <div class="workflow-rule-item">
+                    <p>规则名称</p>
+                    <a-input size="large" v-model="currentTaskWorkflowRule.taskWorkflowName"></a-input>
+                  </div>
+                  <div class="workflow-rule-item">
+                    <p>选择任务列表</p>
+                    <a-select
+                      size="large"
+                      v-model="currentTaskWorkflowRule.firstObj"
+                      @change="(value)=>workflowRuleChange(value,'firstObj')"
+                    >
+                      <a-select-option
+                        v-for="(taskStage, index) in taskStages"
+                        :value="taskStage.code"
+                        :key="taskStage.code"
+                      >{{taskStage.name}}</a-select-option>
+                    </a-select>
+                  </div>
+
+                  <template v-if="currentTaskWorkflowRule.firstObj">
+                    <div class="workflow-rule-item">
+                      <p>选择条件</p>
+                      <a-select
+                        size="large"
+                        v-model="currentTaskWorkflowRule.firstAction.action"
+                        @change="(value)=>workflowRuleChange(value,'firstAction.action')"
+                      >
+                        <a-select-option
+                          v-for="(rule, index) in taskWorkflowRuleActions"
+                          :value="rule.id"
+                          :key="rule.id"
+                        >{{rule.name}}</a-select-option>
+                      </a-select>
                     </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目公开性</p>
+
+                    <template v-if="currentTaskWorkflowRule.firstAction.action != -1">
+                      <template v-if="currentTaskWorkflowRule.firstAction.action == 3">
+                        <div class="workflow-rule-item">
+                          <p>选择执行者</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstAction.value"
+                            @change="(value)=>workflowRuleChange(value,'firstAction.value')"
+                          >
+                            <a-select-option
+                              v-for="(member, index) in projectMembers"
+                              :value="member.code"
+                              :key="member.code"
+                            >{{member.name}}</a-select-option>
+                          </a-select>
+                        </div>
+                      </template>
+
+                      <div class="workflow-rule-item">
+                        <p>选择结果</p>
                         <a-select
-                                size="large"
-                                v-model="project.private"
+                          size="large"
+                          v-model="currentTaskWorkflowRule.firstResult.action"
+                          @change="(value)=>workflowRuleChange(value,'firstResult.action')"
                         >
-                            <a-select-option :key="0">
-                                公开项目（所有人都可通过链接访问，仅项目成员可编辑）
-                            </a-select-option>
-                            <a-select-option :key="1">
-                                私有项目（仅项目成员可查看和编辑）
-                            </a-select-option>
+                          <a-select-option
+                            v-for="(type, index) in taskWorkflowRuleTypes"
+                            :value="type.id"
+                            :key="type.id"
+                          >{{type.name}}</a-select-option>
                         </a-select>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目拥有者</p>
-                        <div class="m-t">
-                            <a-avatar :src="project.owner_avatar"></a-avatar>
-                            <span class="m-l">{{project.owner_name}}</span>
-                            <!--<a-button class="middle-btn pull-right" size="large">
-                                移交
-                            </a-button>-->
+                      </div>
+
+                      <template v-if="currentTaskWorkflowRule.firstResult.action === 0">
+                        <div class="workflow-rule-item">
+                          <p>流转任务列表</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstResult.value"
+                            @change="(value)=>workflowRuleChange(value,'firstResult.value')"
+                          >
+                            <a-select-option
+                              v-for="(taskStage, index) in taskStages"
+                              :value="taskStage.code"
+                              :key="taskStage.code"
+                            >{{taskStage.name}}</a-select-option>
+                          </a-select>
                         </div>
-                    </div>
-                </div>
-                <a-divider/>
-                <div class="content-item">
-                    <div class="infos">
-                        <a-button type="primary" class="middle-btn pull-right" size="large"
-                                  @click="saveProject">
-                            保存
-                        </a-button>
-                    </div>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="2" forceRender>
-             <span slot="tab">
-                 <a-icon type="eye"/>
-                 项目偏好
-             </span>
-            <div class="config-content task-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">看板风格</p>
-                        <div class="item-tips muted">切换任务看板的主题风格，内置两种风格。</div>
-                        <a-radio-group @change="saveProject" v-model="project.task_board_theme">
-                            <a-radio style="display: block;height: 30px;line-height: 30px" value="default">默认</a-radio>
-                            <a-radio style="display: block;height: 30px;line-height: 30px" value="simple">简约</a-radio>
-                        </a-radio-group>
-                    </div>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">自动更新项目进度</p>
-                        <div class="item-tips muted">根据当前任务的完成情况自动计算项目进度。</div>
-                    </div>
-                    <a-switch v-model="project.auto_update_schedule" @change="saveProject"/>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="3">
-                    <span slot="tab">
-                        <a-icon type="check-square"/>
-                        任务设置
-                    </span>
-            <div class="config-content task-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目ID</p>
-                        <div class="item-tips muted">设置项目编号，编号将作为 ID 前缀，用以区别项目。支持 2-6 位字母。</div>
-                        <a-input class="prefix-input" size="large" placeholder="如 Pear Project 可以设置为 EP"
-                                 v-model="project.prefix"
-                                 :disabled="!project.open_prefix"></a-input>
-                        <a-button size="large" class="middle-btn" type="primary"
-                                  :disabled="!project.open_prefix" @click="saveProject">保存
-                        </a-button>
-                    </div>
-                    <a-switch v-model="project.open_prefix" @change="saveProject"/>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">任务开始时间</p>
-                        <div class="item-tips muted">为任务设置开始时间，更科学地规划工作。</div>
-                    </div>
-                    <a-switch v-model="project.open_begin_time" @change="saveProject"/>
-                </div>
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">新任务默认开启隐私模式</p>
-                        <div class="item-tips muted">对本项目内的新任务默认开启隐私模式，创建成功后仅参与者可见</div>
-                    </div>
-                    <a-switch v-model="project.open_task_private" @change="saveProject"/>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="4" forceRender>
-             <span slot="tab">
-                <a-icon type="deployment-unit"/>
-                 任务流转
-             </span>
-            <div class="config-content">
-                <div class="content-item task-workflow">
-                    <div class="infos" style="padding-right: 0">
-                        <div v-show="!doTaskWorkflowView">
-                            <p>
-                                <a-button type="primary" icon="plus" @click="doTaskWorkflow(null)">创建规则</a-button>
-                            </p>
-                            <a-list
-                                    class="task-workflow-list"
-                                    itemLayout="horizontal"
-                                    :dataSource="taskWorkflowList"
+                        <template v-if="currentTaskWorkflowRule.firstResult.value">
+                          <div class="workflow-rule-item">
+                            <p>选择执行者</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.lastResult.value"
+                              @change="(value)=>workflowRuleChange(value,'lastResult.value')"
                             >
-                                <a-list-item slot="renderItem" slot-scope="item">
-                                <span slot="actions">
-                                     <a-tooltip placement="top"
-                                                title="编辑">
-                                        <a class="muted m-r-sm" @click="doTaskWorkflow(item)"><a-icon
-                                                                                               type="edit"></a-icon></a>
-                                    </a-tooltip>
-                                     <a-tooltip placement="top"
-                                                title="删除">
-                                         <a class="muted" @click="delTaskWorkflow(item.code)">
-                                             <a-icon type="delete"></a-icon>
-                                         </a>
-                                    </a-tooltip>
-                                </span>
-                                    <a-list-item-meta
-                                    >
-                                        <span slot="title">{{item.name}}</span>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                        <div v-show="doTaskWorkflowView">
-                            <div class="header">
-                                <p>
-                                    <a-button size="large" class="middle-btn m-r-sm" @click="saveTaskWorkflow(false)">
-                                        取消
-                                    </a-button>
-                                    <a-button size="large" class="middle-btn" type="primary"
-                                              @click="saveTaskWorkflow(true)" :disabled="!canSaveTaskWorkflow">保存
-                                    </a-button>
-                                </p>
-                            </div>
-                            <div class="workflow-content">
-                                <template v-if="!loadingWorkflowRule">
-                                    <div class="workflow-rule-item">
-                                        <p>
-                                            规则名称
-                                        </p>
-                                        <a-input size="large" v-model="currentTaskWorkflowRule.taskWorkflowName"></a-input>
-                                    </div>
-                                    <div class="workflow-rule-item">
-                                        <p>选择任务列表</p>
-                                        <a-select size="large" v-model="currentTaskWorkflowRule.firstObj"
-                                                  @change="(value)=>workflowRuleChange(value,'firstObj')">
-                                            <a-select-option v-for="(taskStage, index) in taskStages"
-                                                             :value="taskStage.code" :key="taskStage.code">
-                                                {{taskStage.name}}
-                                            </a-select-option>
-                                        </a-select>
-                                    </div>
-
-                                    <template v-if="currentTaskWorkflowRule.firstObj">
-                                        <div class="workflow-rule-item">
-                                            <p>选择条件</p>
-                                            <a-select size="large" v-model="currentTaskWorkflowRule.firstAction.action"
-                                                      @change="(value)=>workflowRuleChange(value,'firstAction.action')">
-                                                <a-select-option v-for="(rule, index) in taskWorkflowRuleActions"
-                                                                 :value="rule.id" :key="rule.id">{{rule.name}}
-                                                </a-select-option>
-                                            </a-select>
-                                        </div>
-
-                                        <template v-if="currentTaskWorkflowRule.firstAction.action != -1">
-                                            <template v-if="currentTaskWorkflowRule.firstAction.action == 3">
-                                                <div class="workflow-rule-item">
-                                                    <p>选择执行者</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstAction.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstAction.value')">
-                                                        <a-select-option v-for="(member, index) in projectMembers"
-                                                                         :value="member.code" :key="member.code">
-                                                            {{member.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-                                            </template>
-
-                                            <div class="workflow-rule-item">
-                                                <p>选择结果</p>
-                                                <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.action"
-                                                          @change="(value)=>workflowRuleChange(value,'firstResult.action')">
-                                                    <a-select-option v-for="(type, index) in taskWorkflowRuleTypes"
-                                                                     :value="type.id" :key="type.id">{{type.name}}
-                                                    </a-select-option>
-                                                </a-select>
-                                            </div>
-
-                                            <template v-if="currentTaskWorkflowRule.firstResult.action === 0">
-                                                <div class="workflow-rule-item">
-                                                    <p>流转任务列表</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstResult.value')">
-                                                        <a-select-option v-for="(taskStage, index) in taskStages"
-                                                                         :value="taskStage.code" :key="taskStage.code">
-                                                            {{taskStage.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-                                                <template v-if="currentTaskWorkflowRule.firstResult.value">
-                                                    <div class="workflow-rule-item">
-                                                        <p>选择执行者</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.lastResult.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'lastResult.value')">
-                                                            <a-select-option v-for="(member, index) in projectMembers"
-                                                                             :value="member.code" :key="member.code">
-                                                                {{member.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                                <template>
-                                                    <div class="workflow-rule-item">
-                                                        <p>修改任务状态</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.state.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'state.value')">
-                                                            <a-select-option v-for="(state, index) in taskStates"
-                                                                             :value="state.id" :key="state.id">
-                                                                {{state.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                            </template>
-                                            <template v-if="currentTaskWorkflowRule.firstResult.action === 3">
-                                                <div class="workflow-rule-item">
-                                                    <p>选择执行者</p>
-                                                    <a-select size="large" v-model="currentTaskWorkflowRule.firstResult.value"
-                                                              @change="(value)=>workflowRuleChange(value,'firstAction.action')">
-                                                        <a-select-option v-for="(member, index) in projectMembers"
-                                                                         :value="member.code" :key="member.code">
-                                                            {{member.name}}
-                                                        </a-select-option>
-                                                    </a-select>
-                                                </div>
-
-                                                <template v-if="currentTaskWorkflowRule.firstResult.value">
-                                                    <div class="workflow-rule-item">
-                                                        <p>流转任务列表</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.lastResult.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'lastResult.value')">
-                                                            <a-select-option v-for="(taskStage, index) in taskStages"
-                                                                             :value="taskStage.code" :key="taskStage.code">
-                                                                {{taskStage.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                                <template>
-                                                    <div class="workflow-rule-item">
-                                                        <p>修改任务状态</p>
-                                                        <a-select size="large" v-model="currentTaskWorkflowRule.state.value"
-                                                                  @change="(value)=>workflowRuleChange(value,'state.value')">
-                                                            <a-select-option v-for="(state, index) in taskStates"
-                                                                             :value="state.id" :key="state.id">
-                                                                {{state.name}}
-                                                            </a-select-option>
-                                                        </a-select>
-                                                    </div>
-                                                </template>
-                                            </template>
-                                        </template>
-
-                                    </template>
-                                </template>
-                                <div class="text-center">
-                                    <a-spin :spinning="loadingWorkflowRule"></a-spin>
-                                </div>
-                            </div>
+                              <a-select-option
+                                v-for="(member, index) in projectMembers"
+                                :value="member.code"
+                                :key="member.code"
+                              >{{member.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                        <template>
+                          <div class="workflow-rule-item">
+                            <p>修改任务状态</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.state.value"
+                              @change="(value)=>workflowRuleChange(value,'state.value')"
+                            >
+                              <a-select-option
+                                v-for="(state, index) in taskStates"
+                                :value="state.id"
+                                :key="state.id"
+                              >{{state.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                      </template>
+                      <template v-if="currentTaskWorkflowRule.firstResult.action === 3">
+                        <div class="workflow-rule-item">
+                          <p>选择执行者</p>
+                          <a-select
+                            size="large"
+                            v-model="currentTaskWorkflowRule.firstResult.value"
+                            @change="(value)=>workflowRuleChange(value,'firstAction.action')"
+                          >
+                            <a-select-option
+                              v-for="(member, index) in projectMembers"
+                              :value="member.code"
+                              :key="member.code"
+                            >{{member.name}}</a-select-option>
+                          </a-select>
                         </div>
-                    </div>
-                </div>
-            </div>
-        </a-tab-pane>
-        <a-tab-pane key="5">
-                    <span slot="tab">
-                        <a-icon type="ellipsis"/>
-                        更多
-                    </span>
-            <div class="config-content more-config">
-                <div class="content-item">
-                    <div class="infos">
-                        <p class="item-title">项目操作</p>
-                        <div class="item-tips muted">您可以执行以下操作</div>
-                        <a-button size="large" class="middle-btn" @click="archiveProject">
-                            <span v-if="project.archive">取消归档</span>
-                            <span v-if="!project.archive">归档项目</span>
-                        </a-button>
-                        <a-button size="large" class="middle-btn" @click="quitProject">退出</a-button>
-                        <a-button size="large" class="middle-btn" type="danger" @click="delProject">
-                            <span v-if="project.deleted">恢复项目</span>
-                            <span v-if="!project.deleted">移至回收站</span>
-                        </a-button>
-                    </div>
+
+                        <template v-if="currentTaskWorkflowRule.firstResult.value">
+                          <div class="workflow-rule-item">
+                            <p>流转任务列表</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.lastResult.value"
+                              @change="(value)=>workflowRuleChange(value,'lastResult.value')"
+                            >
+                              <a-select-option
+                                v-for="(taskStage, index) in taskStages"
+                                :value="taskStage.code"
+                                :key="taskStage.code"
+                              >{{taskStage.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                        <template>
+                          <div class="workflow-rule-item">
+                            <p>修改任务状态</p>
+                            <a-select
+                              size="large"
+                              v-model="currentTaskWorkflowRule.state.value"
+                              @change="(value)=>workflowRuleChange(value,'state.value')"
+                            >
+                              <a-select-option
+                                v-for="(state, index) in taskStates"
+                                :value="state.id"
+                                :key="state.id"
+                              >{{state.name}}</a-select-option>
+                            </a-select>
+                          </div>
+                        </template>
+                      </template>
+                    </template>
+                  </template>
+                </template>
+                <div class="text-center">
+                  <a-spin :spinning="loadingWorkflowRule"></a-spin>
                 </div>
+              </div>
             </div>
-        </a-tab-pane>
-    </a-tabs>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+    <a-tab-pane key="5">
+      <span slot="tab">
+        <a-icon type="ellipsis" />更多
+      </span>
+      <div class="config-content more-config">
+        <div class="content-item">
+          <div class="infos">
+            <p class="item-title">项目操作</p>
+            <div class="item-tips muted">您可以执行以下操作</div>
+            <a-button size="large" class="middle-btn" @click="archiveProject">
+              <span v-if="project.archive">取消归档</span>
+              <span v-if="!project.archive">归档项目</span>
+            </a-button>
+            <a-button size="large" class="middle-btn" @click="quitProject">退出</a-button>
+            <a-button size="large" class="middle-btn" type="danger" @click="delProject">
+              <span v-if="project.deleted">恢复项目</span>
+              <span v-if="!project.deleted">移至回收站</span>
+            </a-button>
+          </div>
+        </div>
+      </div>
+    </a-tab-pane>
+  </a-tabs>
 </template>
 
 <script>
-    import {read as getProject, doData, archive, recycle, recoveryArchive, recovery, quit} from "../../api/project";
-    import {
-        _getTaskWorkflowRules,
-        list as getTaskWorkflowList,
-        save as saveTaskWorkflow,
-        edit as EditTaskWorkflow,
-        del as delTaskWorkflow
-    } from "../../api/taskWorkflow";
-    import {_getAll as getTaskStages} from "../../api/taskStages";
-    import {list as getProjectMembers} from "../../api/projectMember";
-
-    import {notice} from "../../assets/js/notice";
-    import {checkResponse, getApiUrl, getAuthorization, getBase64} from "../../assets/js/utils";
-
-    export default {
-        name: "projectConfig",
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
+import {
+  read as getProject,
+  doData,
+  archive,
+  recycle,
+  recoveryArchive,
+  recovery,
+  quit,
+} from "../../api/project";
+import {
+  _getTaskWorkflowRules,
+  list as getTaskWorkflowList,
+  save as saveTaskWorkflow,
+  edit as EditTaskWorkflow,
+  del as delTaskWorkflow,
+} from "../../api/taskWorkflow";
+import { _getAll as getTaskStages } from "../../api/taskStages";
+import { list as getProjectMembers } from "../../api/projectMember";
+
+import { notice } from "../../assets/js/notice";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+  getBase64,
+} from "../../assets/js/utils";
+
+export default {
+  name: "projectConfig",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      /*项目设置*/
+      loading: false,
+      tabKey: "1",
+      project: {},
+      taskWorkflowList: [],
+      doTaskWorkflowView: false,
+      loadingWorkflowRule: false,
+      taskWorkflow: null,
+      taskWorkflowRuleList: [],
+      currentTaskWorkflowRule: {
+        taskWorkflowName: "",
+        firstObj: "", //哪个列表任务
+        firstAction: {
+          //做什么
+          action: -1,
+          value: "",
         },
-        data() {
-            return {
-                /*项目设置*/
-                loading: false,
-                tabKey: '1',
-                project: {},
-                taskWorkflowList: [],
-                doTaskWorkflowView: false,
-                loadingWorkflowRule: false,
-                taskWorkflow: null,
-                taskWorkflowRuleList: [],
-                currentTaskWorkflowRule: {
-                    taskWorkflowName: '',
-                    firstObj: '',//哪个列表任务
-                    firstAction: {//做什么
-                        action: -1,
-                        value: ''
-                    },
-                    firstResult: {//就
-                        action: -1,
-                        value: ''
-                    },
-                    lastResult: {//最后
-                        action: -1,
-                        value: ''
-                    },
-                    state: {//任务状态
-                        action: -1,
-                        value: -1
-                    },
-                },
-                taskWorkflowRuleActions: [
-                    {id: -1, name: "请选择"},
-                    {id: 0, name: "增加任务、被移动"},
-                    {id: 1, name: "被完成"},
-                    {id: 2, name: "被重做"},
-                    {id: 3, name: "设置执行人"},
-                    // {id: 4, name: "截止时间"},
-                    // {id: 5, name: "优先级"},
-                ],
-                taskWorkflowRuleTypes: [
-                    {id: -1, name: "请选择"},
-                    {id: 0, name: "自动流转到"},
-                    {id: 3, name: "默认指派给"},
-                ],
-                taskStates: [
-                    {id: -1, name: "不做修改"},
-                    {id: 1, name: "已完成"},
-                    {id: 2, name: "未完成"},
-                ],
-                projectMembers: [],
-                taskStages: [],
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/project/uploadCover'),
-            }
+        firstResult: {
+          //就
+          action: -1,
+          value: "",
         },
-        computed: {
-            headers() {
-                return getAuthorization();
-            },
-            canSaveTaskWorkflow() {
-                return this.currentTaskWorkflowRule.taskWorkflowName.trim() && this.currentTaskWorkflowRule.firstObj && this.currentTaskWorkflowRule.firstAction.action != -1 && this.currentTaskWorkflowRule.firstResult.action != -1 && this.currentTaskWorkflowRule.firstResult.value;
-            }
+        lastResult: {
+          //最后
+          action: -1,
+          value: "",
         },
-        watch: {
-            code() {
-                this.getProject();
+        state: {
+          //任务状态
+          action: -1,
+          value: -1,
+        },
+      },
+      taskWorkflowRuleActions: [
+        { id: -1, name: "请选择" },
+        { id: 0, name: "增加任务、被移动" },
+        { id: 1, name: "被完成" },
+        { id: 2, name: "被重做" },
+        { id: 3, name: "设置执行人" },
+        // {id: 4, name: "截止时间"},
+        // {id: 5, name: "优先级"},
+      ],
+      taskWorkflowRuleTypes: [
+        { id: -1, name: "请选择" },
+        { id: 0, name: "自动流转到" },
+        { id: 3, name: "默认指派给" },
+      ],
+      taskStates: [
+        { id: -1, name: "不做修改" },
+        { id: 1, name: "已完成" },
+        { id: 2, name: "未完成" },
+      ],
+      projectMembers: [],
+      taskStages: [],
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/project/uploadCover"),
+    };
+  },
+  computed: {
+    headers() {
+      return getAuthorization();
+    },
+    canSaveTaskWorkflow() {
+      return (
+        this.currentTaskWorkflowRule.taskWorkflowName.trim() &&
+        this.currentTaskWorkflowRule.firstObj &&
+        this.currentTaskWorkflowRule.firstAction.action != -1 &&
+        this.currentTaskWorkflowRule.firstResult.action != -1 &&
+        this.currentTaskWorkflowRule.firstResult.value
+      );
+    },
+  },
+  watch: {
+    code() {
+      this.getProject();
+    },
+  },
+  created() {
+    this.getProject();
+    this.getTaskWorkflowList();
+  },
+  methods: {
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+        this.project.open_prefix = !!res.data.open_prefix;
+        this.project.open_begin_time = !!res.data.open_begin_time;
+        this.project.open_task_private = !!res.data.open_task_private;
+        this.project.auto_update_schedule = !!res.data.auto_update_schedule;
+      });
+    },
+    getTaskWorkflowList() {
+      getTaskWorkflowList({ projectCode: this.code }).then((res) => {
+        this.taskWorkflowList = res.data;
+      });
+    },
+    saveProject() {
+      const project = this.project;
+      doData({
+        projectCode: project.code,
+        name: project.name,
+        description: project.description,
+        cover: project.cover,
+        private: project.private,
+        prefix: project.prefix,
+        task_board_theme: project.task_board_theme,
+        open_prefix: Number(project.open_prefix),
+        open_begin_time: Number(project.open_begin_time),
+        open_task_private: Number(project.open_task_private),
+        schedule: Number(project.schedule),
+        auto_update_schedule: Number(project.auto_update_schedule),
+      }).then((res) => {
+        if (!checkResponse(res)) {
+          return;
+        }
+        this.$emit("update", this.project);
+        notice(
+          {
+            title: "保存成功",
+          },
+          "notice",
+          "success"
+        );
+      });
+    },
+    archiveProject() {
+      let app = this;
+      if (!app.project.archive) {
+        this.$confirm({
+          title: "归档项目",
+          content: `一旦将项目「${this.project.name}」归档，本项目和所含信息将会被移到「归档项目」内，其中的内容依然会被统计和搜索收录，归档项目可以随时恢复并继续使用。`,
+          okText: "归档",
+          okType: "danger",
+          cancelText: `再想想`,
+          onOk() {
+            archive(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/archive");
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.project.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/list/my");
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    delProject() {
+      let app = this;
+      if (!app.project.deleted) {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.project.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/recycle");
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        this.$confirm({
+          title: "确定恢复项目？",
+          content: `恢复「${this.project.name}」后就可以正常使用了`,
+          okText: "恢复项目",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recovery(app.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.$router.replace("/project/list/my");
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    quitProject() {
+      let app = this;
+      this.$confirm({
+        title: "退出项目",
+        content: `一旦你退出了该项目，你将不能查看任何关于该项目的信息。退出项目后，如果想重新加入，请联系项目管理员。`,
+        okText: "确定退出",
+        okType: "primary",
+        cancelText: "再想想",
+        onOk() {
+          quit(app.code).then((res) => {
+            if (!checkResponse(res)) {
+              return;
             }
+            app.$router.replace("/project/list/my");
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.getProject();
+      });
+    },
+    doTaskWorkflow(taskWorkflow = null) {
+      this.getTaskStages();
+      this.getProjectMembers();
+      this.taskWorkflow = taskWorkflow;
+      if (taskWorkflow) {
+        this.loadingWorkflowRule = true;
+        this.currentTaskWorkflowRule.taskWorkflowName = taskWorkflow.name;
+        this.getTaskWorkflowRules(taskWorkflow.code);
+      } else {
+        this.currentTaskWorkflowRule = {
+          taskWorkflowName: "",
+          firstObj: "", //哪个列表任务
+          firstAction: {
+            //做什么
+            action: -1,
+            value: "",
+          },
+          firstResult: {
+            //就
+            action: -1,
+            value: "",
+          },
+          lastResult: {
+            //最后
+            action: -1,
+            value: "",
+          },
+          state: {
+            //任务状态
+            action: -1,
+            value: -1,
+          },
+          taskStates: [
+            { id: -1, name: "不做修改" },
+            { id: 1, name: "已完成" },
+            { id: 2, name: "未完成" },
+          ],
+        };
+      }
+      this.doTaskWorkflowView = true;
+    },
+    saveTaskWorkflow(save = false) {
+      if (this.currentTaskWorkflowRule.firstResult.action) {
+        this.currentTaskWorkflowRule.lastResult.action = 0;
+      } else {
+        this.currentTaskWorkflowRule.lastResult.action = 3;
+      }
+      let submitData = {
+        taskWorkflowName: this.currentTaskWorkflowRule.taskWorkflowName,
+        taskWorkflowRules: JSON.stringify(this.currentTaskWorkflowRule),
+      };
+      if (save) {
+        // save
+        if (this.taskWorkflow) {
+          submitData.taskWorkflowCode = this.taskWorkflow.code;
+          EditTaskWorkflow(submitData).then((res) => {
             this.getTaskWorkflowList();
-        },
-        methods: {
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                    this.project.open_prefix = !!res.data.open_prefix;
-                    this.project.open_begin_time = !!res.data.open_begin_time;
-                    this.project.open_task_private = !!res.data.open_task_private;
-                    this.project.auto_update_schedule = !!res.data.auto_update_schedule;
-                });
-            },
-            getTaskWorkflowList() {
-                getTaskWorkflowList({projectCode: this.code}).then(res => {
-                    this.taskWorkflowList = res.data;
-                });
-            },
-            saveProject() {
-                const project = this.project;
-                doData({
-                    projectCode: project.code,
-                    name: project.name,
-                    description: project.description,
-                    cover: project.cover,
-                    private: project.private,
-                    prefix: project.prefix,
-                    task_board_theme: project.task_board_theme,
-                    open_prefix: Number(project.open_prefix),
-                    open_begin_time: Number(project.open_begin_time),
-                    open_task_private: Number(project.open_task_private),
-                    schedule: Number(project.schedule),
-                    auto_update_schedule: Number(project.auto_update_schedule),
-                }).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.$emit('update', this.project);
-                    notice({
-                        title: '保存成功',
-                    }, 'notice', 'success');
-                })
-            },
-            archiveProject() {
-                let app = this;
-                if (!app.project.archive) {
-                    this.$confirm({
-                        title: '归档项目',
-                        content: `一旦将项目「${this.project.name}」归档，本项目和所含信息将会被移到「归档项目」内，其中的内容依然会被统计和搜索收录，归档项目可以随时恢复并继续使用。`,
-                        okText: '归档',
-                        okType: 'danger',
-                        cancelText: `再想想`,
-                        onOk() {
-                            archive(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/archive');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                        content: `取消归档「${this.project.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/list/my');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            delProject() {
-                let app = this;
-                if (!app.project.deleted) {
-                    this.$confirm({
-                        title: '确定放入回收站？',
-                        content: `一旦将项目「${this.project.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                        okText: '放入回收站',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            recycle(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/recycle');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else {
-                    this.$confirm({
-                        title: '确定恢复项目？',
-                        content: `恢复「${this.project.name}」后就可以正常使用了`,
-                        okText: '恢复项目',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recovery(app.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.$router.replace('/project/list/my');
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            quitProject() {
-                let app = this;
-                this.$confirm({
-                    title: '退出项目',
-                    content: `一旦你退出了该项目，你将不能查看任何关于该项目的信息。退出项目后，如果想重新加入，请联系项目管理员。`,
-                    okText: '确定退出',
-                    okType: 'primary',
-                    cancelText: '再想想',
-                    onOk() {
-                        quit(app.code).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            app.$router.replace('/project/list/my');
-
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            doTaskWorkflow(taskWorkflow = null) {
-                this.getTaskStages();
-                this.getProjectMembers();
-                this.taskWorkflow = taskWorkflow;
-                if (taskWorkflow) {
-                    this.loadingWorkflowRule = true;
-                    this.currentTaskWorkflowRule.taskWorkflowName = taskWorkflow.name;
-                    this.getTaskWorkflowRules(taskWorkflow.code);
-                }else{
-                    this.currentTaskWorkflowRule = {
-                        taskWorkflowName: '',
-                        firstObj: '',//哪个列表任务
-                        firstAction: {//做什么
-                            action: -1,
-                            value: ''
-                        },
-                        firstResult: {//就
-                            action: -1,
-                            value: ''
-                        },
-                        lastResult: {//最后
-                            action: -1,
-                            value: ''
-                        },
-                        state: {//任务状态
-                            action: -1,
-                            value: -1
-                        },
-                        taskStates: [
-                            {id: -1, name: "不做修改"},
-                            {id: 1, name: "已完成"},
-                            {id: 2, name: "未完成"},
-                        ],
-                    };
-                }
-                this.doTaskWorkflowView = true;
-            },
-            saveTaskWorkflow(save = false) {
-                if (this.currentTaskWorkflowRule.firstResult.action) {
-                    this.currentTaskWorkflowRule.lastResult.action = 0;
+          });
+        } else {
+          submitData.projectCode = this.code;
+          saveTaskWorkflow(submitData).then((res) => {
+            this.getTaskWorkflowList();
+          });
+        }
+      }
+      this.doTaskWorkflowView = false;
+    },
+    getTaskStages() {
+      getTaskStages({ projectCode: this.code }).then((res) => {
+        let list = [
+          {
+            code: "",
+            name: "不选择",
+          },
+        ];
+        res.data.forEach((v) => {
+          list.push(v);
+        });
+        this.taskStages = list;
+      });
+    },
+    getTaskWorkflowRules(taskWorkflowCode) {
+      _getTaskWorkflowRules({ taskWorkflowCode: taskWorkflowCode }).then(
+        (res) => {
+          this.loadingWorkflowRule = false;
+          const rules = res.data;
+          this.taskWorkflowRuleList = rules;
+          if (rules) {
+            this.currentTaskWorkflowRule.firstObj = rules[0].object_code;
+            this.currentTaskWorkflowRule.firstAction.action = rules[1].action;
+            this.currentTaskWorkflowRule.firstAction.value =
+              rules[1].object_code;
+
+            this.currentTaskWorkflowRule.firstResult.action = rules[2].action;
+            this.currentTaskWorkflowRule.firstResult.value =
+              rules[2].object_code;
+
+            if (rules.length >= 4) {
+              if (!rules[3].object_code) {
+                this.currentTaskWorkflowRule.state.action = rules[3].action;
+                this.currentTaskWorkflowRule.state.value = rules[3].action;
+              } else {
+                this.currentTaskWorkflowRule.lastResult.action =
+                  rules[3].action;
+                this.currentTaskWorkflowRule.lastResult.value =
+                  rules[3].object_code;
+              }
+              if (rules.length >= 5) {
+                if (!rules[4].object_code) {
+                  this.currentTaskWorkflowRule.state.action = rules[4].action;
+                  this.currentTaskWorkflowRule.state.value = rules[4].action;
                 } else {
-                    this.currentTaskWorkflowRule.lastResult.action = 3;
-                }
-                let submitData = {
-                    taskWorkflowName: this.currentTaskWorkflowRule.taskWorkflowName,
-                    taskWorkflowRules: JSON.stringify(this.currentTaskWorkflowRule)
-                };
-                if (save) {
-                    // save
-                    if (this.taskWorkflow) {
-                        submitData.taskWorkflowCode = this.taskWorkflow.code;
-                        EditTaskWorkflow(submitData).then(res => {
-                            this.getTaskWorkflowList();
-
-                        });
-                    } else {
-                        submitData.projectCode = this.code;
-                        saveTaskWorkflow(submitData).then(res => {
-                            this.getTaskWorkflowList();
-                        });
-                    }
-
-                }
-                this.doTaskWorkflowView = false;
-            },
-            getTaskStages() {
-                getTaskStages({projectCode: this.code}).then(res => {
-                    let list = [{
-                        code: '',
-                        name: '不选择'
-                    }];
-                    res.data.forEach(v => {
-                        list.push(v);
-                    });
-                    this.taskStages = list;
-                })
-            },
-            getTaskWorkflowRules(taskWorkflowCode) {
-                _getTaskWorkflowRules({taskWorkflowCode: taskWorkflowCode}).then(res => {
-                    this.loadingWorkflowRule = false;
-                    const rules = res.data;
-                    this.taskWorkflowRuleList = rules;
-                    if (rules) {
-                        this.currentTaskWorkflowRule.firstObj = rules[0].object_code;
-                        this.currentTaskWorkflowRule.firstAction.action = rules[1].action;
-                        this.currentTaskWorkflowRule.firstAction.value = rules[1].object_code;
-
-                        this.currentTaskWorkflowRule.firstResult.action = rules[2].action;
-                        this.currentTaskWorkflowRule.firstResult.value = rules[2].object_code;
-
-                        if (rules.length >= 4) {
-                            if (!rules[3].object_code) {
-                                this.currentTaskWorkflowRule.state.action = rules[3].action;
-                                this.currentTaskWorkflowRule.state.value = rules[3].action;
-                            }else{
-                                this.currentTaskWorkflowRule.lastResult.action = rules[3].action;
-                                this.currentTaskWorkflowRule.lastResult.value = rules[3].object_code;
-                            }
-                            if (rules.length >= 5) {
-                                if (!rules[4].object_code) {
-                                    this.currentTaskWorkflowRule.state.action = rules[4].action;
-                                    this.currentTaskWorkflowRule.state.value = rules[4].action;
-                                }else{
-                                    this.currentTaskWorkflowRule.lastResult.action = rules[4].action;
-                                    this.currentTaskWorkflowRule.lastResult.value = rules[4].object_code;
-                                }
-                            }
-                        }
-                    }
-                })
-            },
-            delTaskWorkflow(code) {
-                let app = this;
-                this.$confirm({
-                    title: '删除规则?',
-                    content: '您确定要删除该规则吗？',
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        delTaskWorkflow({taskWorkflowCode: code}).then(res => {
-                            if (checkResponse(res)) {
-                                app.getTaskWorkflowList();
-                            }
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            getProjectMembers() {
-                getProjectMembers({projectCode: this.code, pageSize: 100}).then((res) => {
-                    let list = [{
-                        code: '',
-                        name: '不选择'
-                    }];
-                    res.data.list.forEach(v => {
-                        list.push(v);
-                    });
-                    this.projectMembers = list;
-                });
-            },
-            workflowRuleChange(value, name) {
-                console.log(value);
-                console.log(name);
-                if (name == 'firstAction.action') {
-                    this.currentTaskWorkflowRule.firstAction.value = '';
-                }
-                if (name == 'firstResult.value') {
-                    this.currentTaskWorkflowRule.lastResult.value = '';
-                }
-                if (name == 'firstResult.action') {
-                    this.currentTaskWorkflowRule.firstResult.value = '';
-                    this.currentTaskWorkflowRule.lastResult.value = '';
-                }
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    this.uploadLoading = true;
-                    return
+                  this.currentTaskWorkflowRule.lastResult.action =
+                    rules[4].action;
+                  this.currentTaskWorkflowRule.lastResult.value =
+                    rules[4].object_code;
                 }
-                if (info.file.status === 'done') {
-                    getBase64(info.file.originFileObj, () => {
-                        this.project.cover = info.file.response.data.url;
-                        this.uploadLoading = false;
-                        notice({
-                            title: '封面上传成功',
-                        }, 'notice', 'success');
-                    })
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('图片不能超过2MB!')
-                }
-                return isLt2M
+              }
+            }
+          }
+        }
+      );
+    },
+    delTaskWorkflow(code) {
+      let app = this;
+      this.$confirm({
+        title: "删除规则?",
+        content: "您确定要删除该规则吗？",
+        okText: "删除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          delTaskWorkflow({ taskWorkflowCode: code }).then((res) => {
+            if (checkResponse(res)) {
+              app.getTaskWorkflowList();
+            }
+          });
+          return Promise.resolve();
+        },
+      });
+    },
+    getProjectMembers() {
+      getProjectMembers({ projectCode: this.code, pageSize: 100 }).then(
+        (res) => {
+          let list = [
+            {
+              code: "",
+              name: "不选择",
             },
+          ];
+          res.data.list.forEach((v) => {
+            list.push(v);
+          });
+          this.projectMembers = list;
         }
-    }
+      );
+    },
+    workflowRuleChange(value, name) {
+      console.log(value);
+      console.log(name);
+      if (name == "firstAction.action") {
+        this.currentTaskWorkflowRule.firstAction.value = "";
+      }
+      if (name == "firstResult.value") {
+        this.currentTaskWorkflowRule.lastResult.value = "";
+      }
+      if (name == "firstResult.action") {
+        this.currentTaskWorkflowRule.firstResult.value = "";
+        this.currentTaskWorkflowRule.lastResult.value = "";
+      }
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        getBase64(info.file.originFileObj, () => {
+          this.project.cover = info.file.response.data.url;
+          this.uploadLoading = false;
+          notice(
+            {
+              title: "封面上传成功",
+            },
+            "notice",
+            "success"
+          );
+        });
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("图片不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .project-config-modal {
-        .ant-modal-body {
-            padding: 0;
+.project-config-modal {
+  .ant-modal-body {
+    padding: 0;
+  }
+
+  .ant-modal-body,
+  .ant-tabs,
+  .ant-tabs-bar {
+    min-height: 730px;
+    min-width: 180px;
+
+    .ant-tabs-tab {
+      padding: 12px 24px;
+    }
+  }
+
+  .ant-tabs-nav-wrap {
+    padding-top: 10px;
+  }
+
+  .ant-tabs-left-content {
+    padding-top: 18px;
+    padding-right: 24px;
+  }
+
+  .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
+    text-align: left;
+  }
+
+  .config-content {
+    .content-item {
+      display: flex;
+      justify-content: space-between;
+      flex: 1 1;
+      margin-bottom: 24px;
+
+      .infos {
+        width: 100%;
+        padding-right: 12px;
+
+        p {
+          margin-bottom: 6px;
         }
 
-        .ant-modal-body, .ant-tabs, .ant-tabs-bar {
-            min-height: 730px;
-            min-width: 180px;
-
-            .ant-tabs-tab {
-                padding: 12px 24px;
-            }
+        .item-title {
+          font-size: 16px;
         }
 
-        .ant-tabs-nav-wrap {
-            padding-top: 10px;
+        .item-tips {
+          margin-bottom: 12px;
         }
 
-        .ant-tabs-left-content {
-            padding-top: 18px;
-            padding-right: 24px;
+        .ant-select {
+          width: 100%;
         }
 
-        .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
-            text-align: left;
+        .ant-input-number-lg {
+          width: 100%;
         }
 
-        .config-content {
-            .content-item {
-                display: flex;
-                justify-content: space-between;
-                flex: 1 1;
-                margin-bottom: 24px;
-
-                .infos {
-                    width: 100%;
-                    padding-right: 12px;
-
-                    p {
-                        margin-bottom: 6px;
-                    }
-
-                    .item-title {
-                        font-size: 16px;
-                    }
-
-                    .item-tips {
-                        margin-bottom: 12px;
-                    }
-
-                    .ant-select {
-                        width: 100%;
-                    }
-
-                    .ant-input-number-lg {
-                        width: 100%;
-                    }
-
-                    .cover-item {
-                        display: flex;
-
-                        img {
-                            width: 300px;
-                            height: 150px;
-                        }
-
-                        .cover-uploader {
-                            display: block;
-                            margin-left: 24px;
-
-                            .upload-tips {
-                                margin-top: 12px;
-                            }
-                        }
-                    }
-                }
-            }
+        .cover-item {
+          display: flex;
 
-            &.task-config {
-                .content-item {
-                    padding-bottom: 24px;
-                    padding-right: 16px;
-                    border-bottom: 1px solid #e5e5e5;
-                }
+          img {
+            width: 300px;
+            height: 150px;
+          }
 
-                .prefix-input {
-                    width: 50%;
-                    margin-right: 24px;
-                }
+          .cover-uploader {
+            display: block;
+            margin-left: 24px;
+
+            .upload-tips {
+              margin-top: 12px;
             }
+          }
+        }
+      }
+    }
 
-            .task-workflow {
-                .workflow-content {
-                    margin-top: 12px;
+    &.task-config {
+      .content-item {
+        padding-bottom: 24px;
+        padding-right: 16px;
+        border-bottom: 1px solid #e5e5e5;
+      }
+
+      .prefix-input {
+        width: 50%;
+        margin-right: 24px;
+      }
+    }
 
-                    .workflow-rule-item {
-                        margin-bottom: 16px;
+    .task-workflow {
+      .workflow-content {
+        margin-top: 12px;
 
-                        p {
-                            color: rgba(0, 0, 0, 0.45);
-                        }
-                    }
-                }
-            }
+        .workflow-rule-item {
+          margin-bottom: 16px;
 
-            &.more-config {
-                .ant-btn {
-                    margin-right: 12px;
-                }
-            }
+          p {
+            color: rgba(0, 0, 0, 0.45);
+          }
         }
+      }
+    }
+
+    &.more-config {
+      .ant-btn {
+        margin-right: 12px;
+      }
     }
+  }
+}
 </style>
diff --git a/src/store/state.js b/src/store/state.js
index dcaa98d..c7bfbad 100644
--- a/src/store/state.js
+++ b/src/store/state.js
@@ -3,7 +3,7 @@ import {getStore} from "../assets/js/storage";
 const userInfo = getStore('userInfo', true);
 const theme = getStore('theme');
 export default {
-    theme: theme ? theme : 'dark',
+    theme: theme ? theme : 'light',
     logged: !!userInfo,//登录状态
     userInfo: userInfo,//用户信息
     organizationList: getStore('organizationList', true),//能查看的组织列表
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 05c4cc0..b97b0f1 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,610 +1,772 @@
 <template>
-    <div class="home-index">
-        <div class="page-header">
-            <p class="day-text muted">『 {{ yiyan.hitokoto }}』 —— 《{{ yiyan.from }}》 <a class="muted" @click="getYiYan">
-                <a-icon type="reload"/>
-            </a>
-            </p>
-            <div class="header-content" v-if="userInfo">
-                <div class="left-content">
-                    <div class="avatar">
-                        <a-avatar :size="64" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
-                    </div>
-                    <div class="user-info">
-                        <div class="title">{{helloTime}}{{ userInfo.name }}，祝你开心每一天！</div>
-                        <div class="team muted" v-if="userInfo.position">{{userInfo.position}}
-                            <template v-if="userInfo.department"> | {{ userInfo.department }}</template>
-                        </div>
+  <div class="home-index">
+    <div class="page-header">
+      <p
+        class="day-text muted"
+        v-if="yiyan"
+        :data-type="yiyan_cate[yiyan_cate_c].title"
+        :data-uuid="yiyan.uuid"
+        :href="'https://hitokoto.cn?uuid='+yiyan.uuid"
+      >
+        {{ yiyan.hitokoto }} —— {{yiyan.from_who}}《{{ yiyan.from }}》{{yiyan_cate[yiyan_cate_c].name?'['+yiyan_cate[yiyan_cate_c].name+']':''}}
+        <a
+          class="muted"
+          @click="getYiYan"
+        >
+          <a-icon type="reload" />
+        </a>
+      </p>
+      <a-row class="header-content" type="flex" justify="space-between" v-if="userInfo">
+        <a-col
+          class="left-content"
+          :span="12"
+          :xs="24"
+          :sm="8"
+          :md="12"
+          :lg="12"
+          :xl="16"
+          :xxl="18"
+        >
+          <div class="avatar">
+            <a-avatar :size="64" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
+          </div>
+          <div class="user-info">
+            <div class="title">{{helloTime}}{{ userInfo.name }}，祝你开心每一天！</div>
+            <div class="team muted" v-if="userInfo.position">
+              {{userInfo.position}}
+              <template v-if="userInfo.department">| {{ userInfo.department }}</template>
+            </div>
+          </div>
+        </a-col>
+        <a-col
+          class="right-content"
+          :span="12"
+          :xs="24"
+          :sm="16"
+          :md="12"
+          :lg="12"
+          :xl="8"
+          :xxl="6"
+        >
+          <div class="content-item">
+            <div class="item-title muted">团队人数</div>
+            <div class="item-text">
+              <span>{{accounts.total}}</span>
+            </div>
+          </div>
+          <div class="content-item">
+            <div class="item-title muted">项目总数</div>
+            <div class="item-text">
+              <span>{{projectTotal}}</span>
+            </div>
+          </div>
+          <!-- <div class="content-item">
+            <div class="item-title muted">任务数</div>
+            <div class="item-text">
+              <span>{{task.total}}</span>
+            </div>
+          </div>-->
+        </a-col>
+      </a-row>
+    </div>
+    <!--<wrapper-content :showHeader="false">-->
+    <div class="page-wrapper">
+      <a-row :gutter="24">
+        <a-col :span="12" :xs="24" :sm="24" :md="24" :lg="16" :xl="14" :xxl="14">
+          <a-card
+            class="project-list"
+            :loading="loading"
+            style="margin-bottom: 24px;"
+            :bordered="false"
+            title="进行中的项目"
+            :body-style="{ padding: 0 }"
+          >
+            <router-link to="/project/list/my" slot="extra">全部项目</router-link>
+            <a-row :gutter="0">
+              <a-col
+                class="project-card-grid"
+                :key="i"
+                v-for="(item, i) in projectList"
+                :span="8"
+                :xs="24"
+                :sm="12"
+                :md="8"
+                :lg="8"
+                :xl="8"
+                :xxl="8"
+              >
+                <a-card
+                  :bordered="false"
+                  :body-style="{ padding: 0 }"
+                  @click="routerLink('/project/space/task/' + item.code)"
+                >
+                  <a-card-meta>
+                    <div slot="title" class="card-title">
+                      <a-avatar size="small" :src="item.cover" />
+                      <router-link :to="'/project/space/task/' + item.code">
+                        <a-icon
+                          type="star"
+                          theme="filled"
+                          style="color: #ffaf38;margin-right: 6px;"
+                          v-show="item.collected"
+                        />
+                        {{ item.name }}
+                      </router-link>
                     </div>
-                </div>
-                <div class="right-content">
-                    <!--<div class="content-item">
-                        <div class="item-title muted">
-                            任务数
-                        </div>
-                        <div class="item-text">
-                            <span>{{task.total}}</span>
-                        </div>
-                    </div>-->
-                    <div class="content-item">
-                        <div class="item-title muted">
-                            团队人数
-                        </div>
-                        <div class="item-text">
-                            <span>{{accounts.total}}</span>
-                        </div>
+                    <div slot="description" class="card-description">
+                      <a-tooltip :mouseEnterDelay="0.3" :title="item.description">
+                        <span class="description-text">
+                          <span v-if="item.description">{{ item.description }}</span>
+                          <span v-else>暂无介绍</span>
+                        </span>
+                      </a-tooltip>
                     </div>
-                    <div class="content-item">
-                        <div class="item-title muted">
-                            项目总数
-                        </div>
-                        <div class="item-text">
-                            <span>{{projectTotal}}</span>
-                        </div>
+                  </a-card-meta>
+                  <a-tooltip
+                    placement="right"
+                    :mouseEnterDelay="0.3"
+                    :title="`当前进度：${item.schedule}%`"
+                  >
+                    <a-progress :strokeWidth="2" :showInfo="false" :percent="item.schedule" />
+                  </a-tooltip>
+                  <div class="project-item">
+                    <a href="/#/">{{ item.owner_name }}</a>
+                    <span class="datetime">{{ formatTime(item.create_time) }}</span>
+                  </div>
+                </a-card>
+              </a-col>
+              <p class="muted text-center m-t-md m-b-md" v-if="!projectList.length">暂无项目</p>
+            </a-row>
+          </a-card>
+
+          <a-card class="activities-list" :loading="loading" title="动态" :bordered="false">
+            <a-list>
+              <a-list-item :key="index" v-for="(item, index) in activities">
+                <a-list-item-meta>
+                  <a-avatar slot="avatar" :src="item.member_avatar" />
+                  <div slot="title">
+                    <a-row :gutter="0">
+                      <a-col :span="12" :xs="24" :sm="24" :md="11" :lg="12" :xl="12" :xxl="12">
+                        <span>{{ item.member_name }}</span>
+                        <span v-if="item.is_comment == 0">
+                          <span v-html="item.remark"></span>
+                        </span>&nbsp;
+                        <template v-if="item.is_comment == 1">
+                          发表了评论
+                          <p class="comment-text">{{ item.content }}</p>
+                        </template>
+                      </a-col>
+                      <a-col :span="12" :xs="24" :sm="24" :md="13" :lg="12" :xl="12" :xxl="12">
+                        <router-link
+                          target="_blank"
+                          :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
+                        >「 {{ item.task_name }} 」</router-link>
+                      </a-col>
+                    </a-row>
+                  </div>
+                  <div slot="description">
+                    <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
+                    {{ formatTime(item.create_time) }} -
+                    <router-link
+                      target="_blank"
+                      :to="`/project/space/task/${item.project_code}`"
+                      class="muted"
+                    >{{item.project_name}}</router-link>
+                    <!--</a-tooltip>-->
+                  </div>
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+          </a-card>
+        </a-col>
+
+        <a-col style="padding: 0 12px" :xs="24" :sm="24" :md="24" :lg="8" :xl="10" :xxl="10">
+          <a-card class="tasks-list" style="margin-bottom: 24px" :bordered="false">
+            <div slot="title">
+              <div class="flex ant-row-flex-space-between ant-row-flex-middle">
+                <span>我的任务({{task.total}})</span>
+                <a-select
+                  v-model="task.done"
+                  @select="taskSelectChange"
+                  :defaultActiveFirstOption="false"
+                >
+                  <a-select-option :key="0">未完成</a-select-option>
+                  <a-select-option :key="1">已完成</a-select-option>
+                </a-select>
+              </div>
+            </div>
+            <a-tabs
+              defaultActiveKey="1"
+              size="small"
+              :tabBarGutter="0"
+              :animated="false"
+              @change="taskTabChange"
+            >
+              <a-tab-pane key="1">
+                <span slot="tab">
+                  <a-icon type="bars" />我执行的
+                </span>
+              </a-tab-pane>
+              <a-tab-pane key="2">
+                <span slot="tab">
+                  <a-icon type="team" />我参与的
+                </span>
+              </a-tab-pane>
+              <a-tab-pane key="3">
+                <span slot="tab">
+                  <a-icon type="rocket" />我创建的
+                </span>
+              </a-tab-pane>
+            </a-tabs>
+            <a-list :loading="task.loading">
+              <a-list-item :key="index" v-for="(item, index) in task.list">
+                <a-list-item-meta>
+                  <div slot="title">
+                    <div style="display: flex;justify-content: space-between ">
+                      <router-link
+                        target="_blank"
+                        class="task-title-wrap"
+                        :to="`/project/space/task/${item.projectInfo.code}/detail/${item.code}`"
+                      >
+                        <a-tooltip title="优先级">
+                          <a-tag :color="priColor(item.pri)">{{item.priText}}</a-tag>
+                        </a-tooltip>
+                        <a-tooltip :title="item.name">{{ item.name }}</a-tooltip>
+                      </router-link>
+                      <div>
+                        <a-tooltip title="任务开始 - 截止时间" v-if="item.end_time">
+                          <span
+                            class="label m-r-sm"
+                            :class="showTimeLabel(item.end_time)"
+                          >{{showTaskTime(item.begin_time, item.end_time)}}</span>
+                        </a-tooltip>
+                        <a-tooltip title="子任务" v-if="item.pcode">
+                          <a-icon type="cluster" class="m-r-sm muted" />
+                        </a-tooltip>
+                        <router-link
+                          target="_blank"
+                          class="muted hidden-xs"
+                          :to="'/project/space/task/' + item.projectInfo.code"
+                        >
+                          <a-tooltip title="所属项目">{{ item.projectInfo.name }}</a-tooltip>
+                        </router-link>
+                      </div>
                     </div>
-                </div>
+                  </div>
+                  <!-- <div slot="description">
+                  </div>-->
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+            <a-pagination
+              class="pull-right m-b"
+              size="small"
+              :defaultPageSize="task.pageSize"
+              :hideOnSinglePage="true"
+              v-model="task.page"
+              :total="task.total"
+              @change="onLoadMoreTask"
+            />
+          </a-card>
+
+          <!-- <a-card
+            title="快速开始"
+            style="margin-bottom: 24px"
+            :bordered="false"
+            :body-style="{padding: 0}"
+          >
+            <div class="item-group">
+              <a>操作一</a>
+              <a>操作二</a>
+              <a>操作三</a>
+              <a-button size="small" type="primary" ghost icon="plus">添加</a-button>
+            </div>
+          </a-card>
+          <a-card
+            title="XX 指数"
+            style="margin-bottom: 24px"
+            :loading="radarLoading"
+            :bordered="false"
+            :body-style="{ padding: 0 }"
+          >
+            <div style="min-height: 400px;">
+              <dash :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts" />
+              <radar :data="radarData" />
             </div>
-        </div>
-        <!--<wrapper-content :showHeader="false">-->
-        <div class="page-wrapper">
-            <a-row :gutter="24">
-                <a-col :xl="16" :lg="24" :md="24" :sm="24" :xs="24">
-                    <a-card
-                            class="project-list"
-                            :loading="loading"
-                            style="margin-bottom: 24px;"
-                            :bordered="false"
-                            title="进行中的项目"
-                            :body-style="{ padding: 0 }">
-                        <router-link to="/project/list/my" slot="extra">全部项目</router-link>
-                        <div>
-                            <a-card-grid class="project-card-grid" :key="i" v-for="(item, i) in projectList">
-                                <a-card :bordered="false" :body-style="{ padding: 0 }" @click="routerLink('/project/space/task/' + item.code)">
-                                    <a-card-meta>
-                                        <div slot="title" class="card-title">
-                                            <a-avatar size="small" :src="item.cover"/>
-                                            <router-link :to="'/project/space/task/' + item.code">
-                                                <a-icon type="star" theme="filled" style="color: #ffaf38;margin-right: 6px;" v-show="item.collected"/>{{ item.name }}
-                                            </router-link>
-                                        </div>
-                                        <div slot="description" class="card-description">
-                                            <a-tooltip :mouseEnterDelay="0.3"
-                                                       :title="item.description">
-                                            <span class="description-text">
-                                                <span v-if="item.description">{{ item.description }}</span>
-                                                <span v-else>暂无介绍</span>
-                                            </span>
-                                            </a-tooltip>
-                                            <a-tooltip placement="right" :mouseEnterDelay="0.3"
-                                                       :title="`当前进度：${item.schedule}%`">
-                                                <a-progress :strokeWidth="2" :showInfo="false"
-                                                            :percent="item.schedule"/>
-                                            </a-tooltip>
-                                        </div>
-                                    </a-card-meta>
-                                    <div class="project-item">
-                                        <a href="/#/">{{ item.owner_name }}</a>
-                                        <span class="datetime">{{ formatTime(item.create_time) }}</span>
-                                    </div>
-                                </a-card>
-                            </a-card-grid>
-                            <p class="muted text-center m-t-md m-b-md" v-if="!projectList.length">暂无项目</p>
-                        </div>
-                    </a-card>
-                    <a-card class="activities-list" :loading="loading" title="动态"  :bordered="false">
-                        <a-list>
-                            <a-list-item :key="index" v-for="(item, index) in activities">
-                                <a-list-item-meta>
-                                    <a-avatar slot="avatar" :src="item.member_avatar"/>
-                                    <div slot="title">
-                                        <span>{{ item.member_name }}</span>
-                                        <span v-if="item.is_comment == 0">  <span v-html="item.remark "></span></span>&nbsp;
-                                        <template v-if="item.is_comment == 1">发表了评论
-                                            <p class="comment-text">{{ item.content }}</p>
-                                        </template>
-                                        <router-link target="_blank"
-                                                :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
-                                                class="right-item">「 {{ item.task_name }} 」
-                                        </router-link>
-                                    </div>
-                                    <div slot="description">
-                                        <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
-                                        {{ formatTime(item.create_time) }} -
-                                        <router-link target="_blank" :to="`/project/space/task/${item.project_code}`" class="muted">
-                                            {{item.project_name}}
-                                        </router-link>
-                                        <!--</a-tooltip>-->
-                                    </div>
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                    </a-card>
-                </a-col>
-                <a-col
-                        style="padding: 0 12px"
-                        :xl="8"
-                        :lg="24"
-                        :md="24"
-                        :sm="24"
-                        :xs="24">
-                    <a-card class="tasks-list" style="margin-bottom: 24px"
-                            :bordered="false">
-                        <div slot="title">
-                            <div class="flex ant-row-flex-space-between ant-row-flex-middle">
-                                <span>我的任务 · {{task.total}}</span>
-                                <a-select v-model="task.done" @select="taskSelectChange" :defaultActiveFirstOption="false">
-                                    <a-select-option :key="0">未完成</a-select-option>
-                                    <a-select-option :key="1">已完成</a-select-option>
-                                </a-select>
-                            </div>
-                        </div>
-                        <a-tabs defaultActiveKey="1" :animated="false" @change="taskTabChange">
-                            <a-tab-pane key="1">
-                                <span slot="tab"><a-icon type="bars" />我执行的</span>
-                            </a-tab-pane>
-                            <a-tab-pane key="2">
-                                <span slot="tab"><a-icon type="team" />我参与的</span>
-                            </a-tab-pane>
-                            <a-tab-pane key="3">
-                                <span slot="tab"><a-icon type="rocket" />我创建的</span>
-                            </a-tab-pane>
-                        </a-tabs>
-                        <a-list :loading="task.loading">
-                            <a-list-item :key="index" v-for="(item, index) in task.list">
-                                <a-list-item-meta>
-                                    <div slot="title">
-                                        <div style="display: flex;justify-content: space-between ">
-                                            <router-link target="_blank"
-                                                         class="task-title-wrap"
-                                                         :to="`/project/space/task/${item.projectInfo.code}/detail/${item.code}`">
-                                                <a-tooltip title="优先级">
-                                                    <a-tag :color="priColor(item.pri)">{{item.priText}}</a-tag>
-                                                </a-tooltip>
-                                                <a-tooltip :title="item.name">
-                                                    {{ item.name }}
-                                                </a-tooltip>
-                                            </router-link>
-                                            <div>
-                                                <a-tooltip title="任务开始 - 截止时间" v-if="item.end_time">
-                                                    <span class="label m-r-sm" :class="showTimeLabel(item.end_time)">{{showTaskTime(item.begin_time, item.end_time)}}</span>
-                                                </a-tooltip>
-                                                <a-tooltip title="子任务" v-if="item.pcode">
-                                                    <a-icon type="cluster" class="m-r-sm muted"/>
-                                                </a-tooltip>
-                                                <router-link target="_blank" class="muted" :to="'/project/space/task/' + item.projectInfo.code">
-                                                    <a-tooltip title="所属项目">{{ item.projectInfo.name }}</a-tooltip>
-                                                </router-link>
-                                            </div>
-                                        </div>
-                                    </div>
-                                   <!-- <div slot="description">
-                                    </div>-->
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                        <a-pagination class="pull-right m-b" size="small" :defaultPageSize="task.pageSize" v-model="task.page" :total="task.total" @change="onLoadMoreTask"/>
-                    </a-card>
-                    <!-- <a-col
-                             style="padding: 0 12px"
-                             :xl="8"
-                             :lg="24"
-                             :md="24"
-                             :sm="24"
-                             :xs="24">
-                         <a-card title="快速开始 / 便捷导航" style="margin-bottom: 24px" :bordered="false"
-                                 :body-style="{padding: 0}">
-                             <div class="item-group">
-                                 <a>操作一</a>
-                                 <a>操作二</a>
-                                 <a>操作三</a>
-                                 <a>操作四</a>
-                                 <a>操作五</a>
-                                 <a>操作六</a>
-                                 <a-button size="small" type="primary" ghost icon="plus">添加</a-button>
-                             </div>
-                         </a-card>-->
-                    <!--    <a-card title="XX 指数" style="margin-bottom: 24px" :loading="radarLoading" :bordered="false" :body-style="{ padding: 0 }">
-                            <div style="min-height: 400px;">
-                                &lt;!&ndash; :scale="scale" :axis1Opts="axis1Opts" :axis2Opts="axis2Opts"  &ndash;&gt;
-                                <radar :data="radarData" />
-                            </div>
-                        </a-card>-->
-                    <a-card :loading="loading" :title="'团队  · ' + accounts.total" :bordered="false">
-                        <div class="members">
-                            <a-row>
-                                <a-col :span="8" v-for="(item, index) in accounts.list" :key="index">
-                                    <a @click="routerLink('/members/profile/' + item.membar_account_code + '?key=3')" style="display: flex;align-items: center"
-                                    >
-                                        <a-avatar size="small" :src="item.avatar"/>
-                                        <span class="member">{{ item.name }}</span>
-                                    </a>
-                                </a-col>
-                            </a-row>
-                        </div>
-                        <a-pagination class="pull-right m-b" :defaultPageSize="accounts.pageSize" size="small" v-show="accounts.total > accounts.pageSize" v-model="accounts.page" :total="accounts.total" @change="onLoadMoreAccounts"/>
-                    </a-card>
-                </a-col>
+          </a-card>-->
+
+          <a-card :loading="loading" :title="'团队(' + accounts.total+')'" :bordered="false">
+            <a-row class="members">
+              <a-col
+                :span="8"
+                :xs="12"
+                :sm="8"
+                :md="8"
+                :lg="8"
+                :xl="8"
+                :xxl="6"
+                v-for="(item, index) in accounts.list"
+                :key="index"
+              >
+                <a
+                  @click="routerLink('/members/profile/' + item.membar_account_code + '?key=3')"
+                  style="display: flex;align-items: center"
+                >
+                  <a-avatar size="small" :src="item.avatar" />
+                  <span class="member">{{ item.name }}</span>
+                </a>
+              </a-col>
             </a-row>
-        </div>
-        <!--</wrapper-content>-->
+            <a-pagination
+              class="pull-right m-b"
+              :defaultPageSize="accounts.pageSize"
+              :hideOnSinglePage="true"
+              size="small"
+              v-model="accounts.page"
+              :total="accounts.total"
+              @change="onLoadMoreAccounts"
+            />
+          </a-card>
+        </a-col>
+      </a-row>
     </div>
+    <!--</wrapper-content>-->
+  </div>
 </template>
+
+
 <script>
-    import {mapState} from 'vuex'
-    import moment from "moment";
-    import {getYiYan} from "../../api/other";
-    import {formatTaskTime, relativelyTime, showHelloTime} from "../../assets/js/dateTime";
-    import {selfList as getProjectList} from "../../api/project";
-    import {list as accountList} from "../../api/user";
-    import pagination from "../../mixins/pagination";
-    import {getLogBySelfProject, selfList} from "../../api/task";
-    import task from "../project/space/task";
-
-    export default {
-        components: {},
-        mixins: [pagination],
-        data() {
-            return {
-                loading: false,
-                yiyan: {},
-                projectList: [],
-                projectTotal: 0,
-                activities: [],
-                tasks: [],
-                tasksTotal: 0,
-                // accounts: [],
-                accounts: {
-                    list: [],
-                    total: 0,
-                    page: 1,
-                    pageSize: 10,
-                    loading: false,
-                },
-                task: {
-                    list: [],
-                    taskType: '1',
-                    done: 0,
-                    total: 0,
-                    page: 1,
-                    pageSize: 10,
-                    loading: false,
-                },
+import { mapState } from "vuex";
+import moment from "moment";
+import { getYiYan } from "../../api/other";
+import {
+  formatTaskTime,
+  relativelyTime,
+  showHelloTime,
+} from "../../assets/js/dateTime";
+import { selfList as getProjectList } from "../../api/project";
+import { list as accountList } from "../../api/user";
+import pagination from "../../mixins/pagination";
+import { getLogBySelfProject, selfList } from "../../api/task";
+import task from "../project/space/task";
+
+export default {
+  components: {},
+  mixins: [pagination],
+  data() {
+    return {
+      loading: false,
+      yiyan: {},
+      yiyan_cate_c: 0,
+      yiyan_cate: [
+        { id: "a", name: "动画", title: "动画" },
+        { id: "b", name: "漫画", title: "漫画" },
+        { id: "c", name: "游戏", title: "游戏" },
+        { id: "d", name: "文学", title: "文学" },
+        { id: "e", name: "", title: "原创" },
+        { id: "f", name: "", title: "网络" },
+        { id: "g", name: "", title: "其他" },
+        { id: "h", name: "影视", title: "影视" },
+        { id: "i", name: "诗词", title: "诗词" },
+        { id: "j", name: "", title: "网易云" },
+        { id: "k", name: "哲学", title: "哲学" },
+        { id: "l", name: "", title: "抖机灵" },
+      ],
+      projectList: [],
+      projectTotal: 0,
+      activities: [],
+      tasks: [],
+      tasksTotal: 0,
+      // accounts: [],
+      accounts: {
+        list: [],
+        total: 0,
+        page: 1,
+        pageSize: 10,
+        loading: false,
+      },
+      task: {
+        list: [],
+        taskType: "1",
+        done: 0,
+        total: 0,
+        page: 1,
+        pageSize: 10,
+        loading: false,
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      socketAction: (state) => state.socketAction,
+    }),
+    helloTime() {
+      return showHelloTime();
+    },
+  },
+  created() {
+    this.getYiYan();
+    this.init();
+  },
+  watch: {
+    $route: function (to, from) {
+      this.init();
+    },
+    socketAction(val) {
+      console.log(val);
+      if (val.action === "organization:task") {
+        this.init(false, false);
+      }
+    },
+  },
+  methods: {
+    init(reset = true, loading = true) {
+      if (reset) {
+        this.projectList = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 9;
+      }
+      this.getProjectList(loading);
+      this.getTasks();
+      this.getTaskLog();
+      this.getAccountList();
+    },
+    getProjectList(loading) {
+      if (loading) {
+        this.loading = true;
+      }
+      getProjectList(this.requestData).then((res) => {
+        this.projectList = res.data.list;
+        this.projectTotal = res.data.total;
+        this.loading = false;
+      });
+    },
+    getTaskLog() {
+      getLogBySelfProject().then((res) => {
+        this.activities = res.data;
+      });
+    },
+    getAccountList() {
+      this.accounts.loading = true;
+      accountList({
+        page: this.accounts.page,
+        pageSize: this.accounts.pageSize,
+      }).then((res) => {
+        this.accounts.loading = false;
+        this.accounts.list = res.data.list;
+        this.accounts.total = res.data.total;
+      });
+    },
+    getYiYan() {
+      let app = this;
+      this.yiyan_cate_c = Math.floor(Math.random() * 12);
+      getYiYan(function (data) {
+        app.yiyan = data;
+      }, this.yiyan_cate[this.yiyan_cate_c].id);
+    },
+    getTasks() {
+      this.task.loading = true;
+      selfList({
+        page: this.task.page,
+        pageSize: this.task.pageSize,
+        taskType: this.task.taskType,
+        type: this.task.done,
+      }).then((res) => {
+        this.task.loading = false;
+        this.task.list = res.data.list;
+        // this.task.list =  this.task.list.concat(res.data.list);
+        this.task.total = res.data.total;
+      });
+    },
+    taskTabChange(key) {
+      console.log(key);
+      this.task.taskType = key;
+      this.task.loadingMore = true;
+      this.task.page = 1;
+      this.getTasks();
+    },
+    taskSelectChange(value) {
+      this.task.done = value;
+      this.task.loadingMore = true;
+      this.task.page = 1;
+      this.getTasks();
+    },
+    onLoadMoreTask(page, PageSize) {
+      this.task.loadingMore = true;
+      this.task.page = page;
+      this.getTasks();
+    },
+    onLoadMoreAccounts(page, PageSize) {
+      this.accounts.loadingMore = true;
+      this.accounts.page = page;
+      this.getAccountList();
+    },
+    priColor(pri) {
+      switch (pri) {
+        case 1:
+          return "#ff9900";
+        case 2:
+          return "#ed3f14";
+        default:
+          return "green";
+      }
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+    showTaskTime(time, timeEnd) {
+      return formatTaskTime(time, timeEnd);
+    },
+    showTimeLabel(time) {
+      let str = "label-primary";
+      if (time == null) {
+        return str;
+      }
+      let cha = moment(moment(time).format("YYYY-MM-DD")).diff(
+        moment().format("YYYY-MM-DD"),
+        "days"
+      );
+      if (cha < 0) {
+        str = "label-danger";
+      } else if (cha == 0) {
+        str = "label-warning";
+      } else if (cha > 7) {
+        str = "label-normal";
+      }
+      return str;
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.home-index {
+  .page-header {
+    padding: 1rem 2rem 0;
+    .header-content {
+      .left-content {
+        display: flex;
+        align-items: center;
+        margin: 1rem 0;
+
+        .user-info {
+          margin-left: 12px;
+          line-height: 1.75;
+
+          .title {
+            font-size: 1rem;
+          }
+
+          .team {
+          }
+        }
+      }
+
+      .right-content {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        margin: 1rem auto;
+
+        .content-item {
+          padding: 0 20px;
+          position: relative;
+
+          .item-text {
+            font-size: 30px;
+
+            .small {
+              font-size: 20px;
             }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                socketAction: state => state.socketAction,
-            }),
-            helloTime() {
-                return showHelloTime()
+          }
+
+          &:after {
+            background-color: #e8e8e8;
+            position: absolute;
+            top: 8px;
+            right: 0px;
+            width: 1px;
+            /* height: 40px; */
+            margin: auto 0;
+            bottom: 18px;
+            content: "";
+          }
+
+          &:last-child {
+            &:after {
+              width: 0;
             }
-        },
-        created() {
-            this.getYiYan();
-            this.init();
-        },
-        watch:{
-            $route: function (to, from) {
-                this.init();
-            },
-            socketAction(val) {
-                console.log(val);
-                if (val.action === 'organization:task') {
-                    this.init(false, false);
-                }
-            },
-        },
-        methods: {
-            init(reset = true, loading = true) {
-                if (reset) {
-                    this.projectList = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 9;
-                }
-                this.getProjectList(loading);
-                this.getTasks();
-                this.getTaskLog();
-                this.getAccountList();
-
-            },
-            getProjectList(loading) {
-                if (loading) {
-                    this.loading = true;
-                }
-                getProjectList(this.requestData).then(res => {
-                    this.projectList = res.data.list;
-                    this.projectTotal = res.data.total;
-                    this.loading = false;
-                });
-            },
-            getTaskLog() {
-                getLogBySelfProject().then(res => {
-                    this.activities = res.data;
-                })
-            },
-            getAccountList() {
-                this.accounts.loading = true;
-                accountList({page: this.accounts.page, pageSize: this.accounts.pageSize}).then(res => {
-                    this.accounts.loading = false;
-                    this.accounts.list =  res.data.list;
-                    this.accounts.total = res.data.total;
-                })
-            },
-            getYiYan() {
-                let app = this;
-                getYiYan(function (data) {
-                    app.yiyan = data
-                }, 'd')
-            },
-            getTasks() {
-                this.task.loading = true;
-                selfList({page: this.task.page, pageSize: this.task.pageSize, taskType: this.task.taskType, type: this.task.done}).then(res => {
-                    this.task.loading = false;
-                    this.task.list =  res.data.list;
-                    // this.task.list =  this.task.list.concat(res.data.list);;
-                    this.task.total = res.data.total;
-                })
-            },
-            taskTabChange(key) {
-                console.log(key);
-                this.task.taskType = key;
-                this.task.loadingMore = true;
-                this.task.page = 1;
-                this.getTasks();
-            },
-            taskSelectChange(value) {
-                this.task.done = value;
-                this.task.loadingMore = true;
-                this.task.page = 1;
-                this.getTasks();
-            },
-            onLoadMoreTask(page, PageSize) {
-                this.task.loadingMore = true;
-                this.task.page = page;
-                this.getTasks();
-            },
-            onLoadMoreAccounts(page, PageSize) {
-                this.accounts.loadingMore = true;
-                this.accounts.page = page;
-                this.getAccountList();
-            },
-            priColor(pri) {
-                switch (pri) {
-                    case 1:
-                        return '#ff9900';
-                    case 2:
-                        return '#ed3f14';
-                    default:
-                        return 'green';
-
-                }
-            },
-            formatTime(time) {
-                return relativelyTime(time);
-            },
-            showTaskTime(time, timeEnd) {
-                return formatTaskTime(time, timeEnd);
-            },
-            showTimeLabel(time) {
-                let str = 'label-primary';
-                if (time == null) {
-                    return str;
-                }
-                let cha = moment(moment(time).format("YYYY-MM-DD")).diff(moment().format("YYYY-MM-DD"), 'days');
-                if (cha < 0) {
-                    str = 'label-danger';
-                } else if (cha == 0) {
-                    str = 'label-warning';
-                } else if (cha > 7) {
-                    str = 'label-normal'
-                }
-                return str;
-            },
+          }
         }
+      }
     }
-</script>
-<style lang="less">
-    .home-index {
-        .page-header {
-            .header-content {
-                margin-bottom: 16px;
-                display: flex;
-                justify-content: space-between;
-
-                .left-content {
-                    display: flex;
-                    align-items: center;
-
-                    .user-info {
-                        margin-left: 12px;
-                        line-height: 33px;
-
-                        .title {
-                            font-size: 20px;
-                        }
-
-                        .team {
-
-                        }
-                    }
-                }
-
-                .right-content {
-                    display: flex;
-
-                    .content-item {
-                        padding: 0 32px;
-                        position: relative;
-
-                        .item-text {
-                            font-size: 30px;
-
-                            .small {
-                                font-size: 20px;
-                            }
-                        }
-
-                        &:after {
-                            background-color: #e8e8e8;
-                            position: absolute;
-                            top: 8px;
-                            right: 0;
-                            width: 1px;
-                            height: 40px;
-                            content: "";
-                        }
-
-                        &:last-child {
-                            &:after {
-                                width: 0;
-                            }
-                        }
-                    }
-                }
-            }
+  }
+
+  .page-wrapper {
+    margin: 24px;
+    .ant-card-head {
+      user-select: none;
+    }
+    .project-list {
+      .project-card-grid {
+        padding: 24px !important;
+        border: 0;
+        border-radius: 0;
+        box-shadow: 1px 0 0 0 #e8e8e8, 0 1px 0 0 #e8e8e8, 1px 1px 0 0 #e8e8e8,
+          inset 1px 0 0 0 #e8e8e8, inset 0 1px 0 0 #e8e8e8;
+        transition: all 0.3s;
+        position: relative;
+        box-sizing: border-box;
+        &:hover {
+          position: relative;
+          z-index: 1;
+          box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+        }
+      }
+      .card-title {
+        font-size: 0;
+
+        a {
+          color: rgba(0, 0, 0, 0.85);
+          margin-left: 12px;
+          line-height: 24px;
+          height: 24px;
+          display: inline-block;
+          vertical-align: top;
+          font-size: 14px;
+
+          &:hover {
+            color: #1890ff;
+          }
+        }
+      }
+
+      .card-description {
+        color: rgba(0, 0, 0, 0.45);
+        height: 44px;
+        line-height: 22px;
+        overflow: hidden;
+        .description-text {
+          height: 22px;
+        }
+      }
+
+      .project-item {
+        display: flex;
+        margin-top: 8px;
+        overflow: hidden;
+        font-size: 12px;
+        height: 20px;
+        line-height: 20px;
+
+        a {
+          color: rgba(0, 0, 0, 0.45);
+          display: inline-block;
+          flex: 1 1 0;
+
+          &:hover {
+            color: #1890ff;
+          }
         }
 
-        .page-wrapper {
-            margin: 24px;
-
-            .project-list {
-
-                .card-title {
-                    font-size: 0;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.85);
-                        margin-left: 12px;
-                        line-height: 24px;
-                        height: 24px;
-                        display: inline-block;
-                        vertical-align: top;
-                        font-size: 14px;
-
-                        &:hover {
-                            color: #1890ff;
-                        }
-                    }
-                }
-
-                .card-description {
-                    color: rgba(0, 0, 0, 0.45);
-                    height: 44px;
-                    line-height: 22px;
-                    overflow: hidden;
-                    .description-text{
-                        height: 22px;
-                    }
-                }
-
-                .project-item {
-                    display: flex;
-                    margin-top: 8px;
-                    overflow: hidden;
-                    font-size: 12px;
-                    height: 20px;
-                    line-height: 20px;
-
-                    a {
-                        color: rgba(0, 0, 0, 0.45);
-                        display: inline-block;
-                        flex: 1 1 0;
-
-                        &:hover {
-                            color: #1890ff;
-                        }
-                    }
-
-                    .datetime {
-                        color: rgba(0, 0, 0, 0.25);
-                        flex: 0 0 auto;
-                        float: right;
-                    }
-                }
-
-                .ant-card-meta-description {
-                    color: rgba(0, 0, 0, 0.45);
-                    height: 44px;
-                    line-height: 22px;
-                    overflow: hidden;
-                }
-            }
+        .datetime {
+          color: rgba(0, 0, 0, 0.25);
+          flex: 0 0 auto;
+          float: right;
+        }
+      }
+
+      .ant-card-meta-description {
+        color: rgba(0, 0, 0, 0.45);
+        height: 44px;
+        line-height: 22px;
+        overflow: hidden;
+      }
+    }
 
-            .activities-list {
-                .ant-list-item-meta-title {
-                    position: relative;
-                }
-
-                .comment-text {
-                    margin-bottom: 0;
-                }
-
-                .right-item {
-                    float: right;
-                    position: absolute;
-                    right: 0;
-                    top: 0;
-                }
-            }
+    .activities-list {
+      margin-bottom: 24px;
+      .ant-card-head {
+        user-select: none;
+      }
+      .ant-card-body {
+        padding: 0 20px;
+      }
+      .ant-list-item-meta-title {
+        position: relative;
+        line-height: 1.5;
+      }
+      .ant-list-item-meta-avatar {
+        margin-top: 5px;
+      }
+      .comment-text {
+        margin-bottom: 0;
+      }
+      .ant-list-item-meta-description {
+        line-height: 1.75;
+        font-size: 0.8rem;
+      }
+    }
 
-            .tasks-list {
-                .ant-card-body {
-                    padding: 6px 24px;
-
-                    .ant-list-item-meta, .ant-list-item-meta-content{
-                        width: 100%;
-                    }
-
-                    .task-title-wrap{
-                        /*max-width: 310px;*/
-                        flex: 1;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-                        padding-right: 10px;
-                    }
-                }
-            }
+    .tasks-list {
+      .ant-card-body {
+        padding: 6px 14px;
 
-            .item-group {
-                padding: 20px 0 8px 24px;
-                font-size: 0;
-
-                a {
-                    color: rgba(0, 0, 0, 0.65);
-                    display: inline-block;
-                    font-size: 14px;
-                    margin-bottom: 13px;
-                    width: 25%;
-                }
-            }
+        .ant-list-item-meta,
+        .ant-list-item-meta-content {
+          width: 100%;
+        }
 
-            .members {
-                a {
-                    display: block;
-                    margin: 12px 0;
-                    line-height: 24px;
-                    height: 24px;
-
-                    .member {
-                        font-size: 14px;
-                        color: rgba(0, 0, 0, .65);
-                        line-height: 24px;
-                        max-width: 100px;
-                        vertical-align: top;
-                        margin-left: 6px;
-                        transition: all 0.3s;
-                        display: inline-block;
-                    }
-
-                    &:hover {
-                        span {
-                            color: #1890ff;
-                        }
-                    }
-                }
-            }
+        .task-title-wrap {
+          /*max-width: 310px;*/
+          flex: 1;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          padding-right: 10px;
+        }
+      }
+    }
+
+    .item-group {
+      padding: 20px 0 8px 24px;
+      font-size: 0;
+
+      a {
+        color: rgba(0, 0, 0, 0.65);
+        display: inline-block;
+        font-size: 14px;
+        margin-bottom: 13px;
+        width: 25%;
+      }
+    }
+
+    .members {
+      a {
+        display: block;
+        margin: 12px 0;
+        line-height: 24px;
+        height: 24px;
+
+        .member {
+          font-size: 14px;
+          color: rgba(0, 0, 0, 0.65);
+          line-height: 24px;
+          max-width: 100px;
+          vertical-align: top;
+          margin-left: 6px;
+          transition: all 0.3s;
+          display: inline-block;
+        }
+
+        &:hover {
+          span {
+            color: #1890ff;
+          }
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/index.vue b/src/views/index.vue
index 34f8b98..ef843a7 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -1,369 +1,407 @@
 <!--suppress ALL-->
 <template>
-    <div class="index">
-        <a-spin :spinning="windowLoading">
-            <a-layout id="layout" :class="layoutClass">
-                <a-layout-header :class="{'collapsed':collapsed}">
-                    <div class="logo" @click="toHome">
-                        <img class="logo-img" src="../assets/image/common/logo.png" alt="">
-                        <span class="title" v-if="system">
-                            {{system.app_name}}
-                             <span class="version">{{system.app_version}}</span>
-                        </span>
-                    </div>
-                    <a-menu
-                            mode="horizontal"
-                            v-model="selectedModelKeys"
-                            @click="menuModelClick"
-                            @openChange="onModelOpenChange"
-                            :style="{ lineHeight: '63px',paddingLeft:'15px' }"
-                    >
-                        <a-menu-item
-                                v-for="(model,index) in menu"
-                                :key="model.id.toString()"
-                                :disabled="!model.status"
-                        >
-                            <a-icon v-if="model.icon" :type="model.icon"/>
-                            <span>{{model.title}}</span>
-                        </a-menu-item>
-                    </a-menu>
-                    <div class="right-menu">
-                        <div class="m-r-lg" v-if="config.WS_URI">
-                            <a-badge title="当前在线" :count="online" showZero :numberStyle="{backgroundColor: '#52c41a'} "
-                                     :offset="[10,0]">
-                                <a-icon type="team"/>
-                            </a-badge>
-                        </div>
-                        <div class="action action-organization" v-if="organizationList.length > 1">
-                            <header-select></header-select>
-                        </div>
-                        <div class="action">
-                            <header-notice></header-notice>
-                        </div>
-                        <div class="action action-avatar">
-                            <header-avatar></header-avatar>
-                        </div>
-                    </div>
-                </a-layout-header>
-                <a-layout style="padding-top: 65px;">
-                    <a-sider
-                            mode="inline"
-                            breakpoint="md"
-                            collapsible
-                            v-model="collapsed"
-                    >
-                        <!-- <a-icon
-                         class="trigger"
-                         :type="collapsed ? 'menu-unfold' : 'menu-fold'"
-                         @click="()=> collapsed = !collapsed"
-                         />-->
-                        <a-menu :theme="theme"
-                                v-for="menu in menus"
-                                :key="menu.id.toString()"
-                                :openKeys="openKeys"
-                                v-model="selectedKeys"
-                                @click="menuClick($event, menu)"
-                                @openChange="onOpenChange"
-                                mode="inline">
-                            <a-menu-item
-                                    v-if="!menu.children && !menu.is_inner && menu.node != '#'"
-                                    :key="menu.id"
-                                    :disabled="!menu.status"
-                            >
-                                <a-icon :type="menu.icon"/>
-                                <span>{{menu.title}}</span>
-                            </a-menu-item>
-                            <a-sub-menu
-                                    v-if="menu.children && !menu.is_inner"
-                                    :key="menu.id.toString()"
-                            >
-                                <span slot="title">
-                                     <a-icon :type="menu.icon"/>
-                                    <span>{{menu.title}}</span>
-                                </span>
-                                <a-menu-item
-                                        v-for="(secMenu,index) in menu.children"
-                                        v-if="!secMenu.is_inner"
-                                        :key="secMenu.id.toString()"
-                                        :disabled="!secMenu.status"
-                                >
-                                    {{secMenu.title}}
-                                </a-menu-item>
-                            </a-sub-menu>
-                        </a-menu>
-                    </a-sider>
-                    <a-layout
-                            class="main-content"
-                            :style="collapsed ? { paddingLeft: '80px'} : { paddingLeft: '256px'}">
-                        <!--<vue-scroll ref="contentscroll">-->
-                        <a-layout-content>
-                            <transition name="router-fade" mode="out-in">
-                                <a-spin :spinning="pageLoading">
-                                    <router-view></router-view>
-                                </a-spin>
-                            </transition>
-                        </a-layout-content>
-                        <!-- <a-footer style="text-align: center">
+  <div class="index">
+    <a-spin :spinning="windowLoading">
+      <a-layout id="layout" :class="layoutClass">
+        <a-layout-header class="project-nav" :class="{'collapsed':collapsed}">
+          <div class="logo pc-view" :title="system.site_name" @click="toHome">
+            <img class="logo-img" src="../assets/image/common/logo.png" alt />
+            <span class="title" v-if="system">
+              {{system.app_name}}
+              <sup class="version">{{system.app_version}}</sup>
+            </span>
+          </div>
+          <div class="left-menudrawer wap-menu" @click="collapsed = !collapsed">
+            <a-icon class="trigger" :type="collapsed ? 'menu-unfold' : 'menu-fold'" />
+          </div>
+          <a-menu
+            class="project-nav-menus"
+            mode="horizontal"
+            v-model="selectedModelKeys"
+            @click="menuModelClick"
+            @openChange="onModelOpenChange"
+          >
+            <a-menu-item
+              v-for="(model,index) in menu"
+              :key="model.id.toString()"
+              :disabled="!model.status"
+            >
+              <a-icon v-if="model.icon" :type="model.icon" />
+              <span>{{model.title}}</span>
+            </a-menu-item>
+          </a-menu>
+          <div class="right-menu pc-view">
+            <div class="m-r-lg" v-if="config.WS_URI">
+              <a-badge
+                title="当前在线"
+                :count="online"
+                showZero
+                :numberStyle="{backgroundColor: '#52c41a'} "
+                :offset="[10,0]"
+              >
+                <a-icon type="team" />
+              </a-badge>
+            </div>
+            <header-select class="action action-organization" v-if="organizationList.length > 1"></header-select>
+            <header-notice class="action action-notice"></header-notice>
+            <header-avatar class="action action-avatar" :type="1"></header-avatar>
+          </div>
+          <div class="right-menu wap-menu">
+            <div class="action action-more" @click.stop="wap_visible=!wap_visible">
+              <a-avatar :src="$store.state.userInfo.avatar" />
+            </div>
+            <a-drawer
+              class="right-drawer"
+              title
+              placement="right"
+              :closable="false"
+              :visible="wap_visible"
+              @close="wap_visible=false"
+            >
+              <div>
+                <header-select
+                  class="action action-organization"
+                  v-if="organizationList.length > 1"
+                ></header-select>
+                <header-avatar class="action action-avatar" :type="2" @finish="wap_visible=false"></header-avatar>
+              </div>
+              <div class="m-r-lg" :style="{padding: '1rem 0'}" v-if="config.WS_URI">
+                <a-badge
+                  title="当前在线"
+                  :count="online"
+                  showZero
+                  :numberStyle="{backgroundColor: '#52c41a'} "
+                  :offset="[10,0]"
+                >
+                  <a-icon type="team" />
+                </a-badge>
+              </div>
+            </a-drawer>
+          </div>
+        </a-layout-header>
+        <a-layout style="padding-top: 65px;">
+          <a-sider breakpoint="md" collapsedWidth="0" collapsible v-model="collapsed">
+            <a-menu
+              :theme="theme"
+              v-for="menu in menus"
+              :key="menu.id.toString()"
+              :openKeys="openKeys"
+              v-model="selectedKeys"
+              @click="menuClick($event, menu)"
+              @openChange="onOpenChange"
+              mode="inline"
+            >
+              <a-menu-item
+                v-if="!menu.children && !menu.is_inner && menu.node != '#'"
+                :key="menu.id"
+                :disabled="!menu.status"
+              >
+                <a-icon :type="menu.icon" />
+                <span>{{menu.title}}</span>
+              </a-menu-item>
+              <a-sub-menu v-if="menu.children && !menu.is_inner" :key="menu.id.toString()">
+                <span slot="title">
+                  <a-icon :type="menu.icon" />
+                  <span>{{menu.title}}</span>
+                </span>
+                <a-menu-item
+                  v-for="(secMenu,index) in menu.children"
+                  v-if="!secMenu.is_inner"
+                  :key="secMenu.id.toString()"
+                  :disabled="!secMenu.status"
+                >{{secMenu.title}}</a-menu-item>
+              </a-sub-menu>
+            </a-menu>
+            <a-icon :type="collapsed ? 'right' : 'left'" slot="trigger" />
+          </a-sider>
+          <a-layout class="main-content" :class="!collapsed ? 'toleft':''">
+            <!--<vue-scroll ref="contentscroll">-->
+            <a-layout-content>
+              <transition name="router-fade" mode="out-in">
+                <a-spin :spinning="pageLoading">
+                  <router-view></router-view>
+                </a-spin>
+              </transition>
+            </a-layout-content>
+            <!-- <a-footer style="text-align: center">
                              <template v-if="system">
                                  <span @click="footerClick">  Copyright © 2018 Pear Project技术部出品 </span>
                              </template>
-                         </a-footer>-->
-                        <!--</vue-scroll>-->
-                    </a-layout>
-                </a-layout>
-            </a-layout>
-            <Socket ref="socket" v-if="config.WS_URI"></Socket>
-        </a-spin>
-        <v-uploader></v-uploader>
-    </div>
+            </a-footer>-->
+            <!--</vue-scroll>-->
+          </a-layout>
+        </a-layout>
+      </a-layout>
+      <Socket ref="socket" v-if="config.WS_URI"></Socket>
+    </a-spin>
+    <v-uploader></v-uploader>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import ALayout from 'ant-design-vue/es/layout'
-    import HeaderNotice from '../components/layout/header/HeaderNotice';
-    import HeaderAvatar from '../components/layout/header/HeaderAvatar';
-    import HeaderSelect from '../components/layout/header/HeaderSelect';
-    import VUploader from '../components/tools/VUploader';
-    import Socket from '../components/websocket/socket';
-    import config from "../config/config";
-    import {notice} from "../assets/js/notice";
-    import {getStore} from "../assets/js/storage";
-    import {_getOrgList} from "../api/organization";
+import { mapState } from "vuex";
+import ALayout from "ant-design-vue/es/layout";
+import HeaderNotice from "../components/layout/header/HeaderNotice";
+import HeaderAvatar from "../components/layout/header/HeaderAvatar";
+import HeaderSelect from "../components/layout/header/HeaderSelect";
+import VUploader from "../components/tools/VUploader";
+import Socket from "../components/websocket/socket";
+import config from "../config/config";
+import { notice } from "../assets/js/notice";
+import { getStore } from "../assets/js/storage";
+import { _getOrgList } from "../api/organization";
 
-    const ASider = ALayout.Sider;
-    const AFooter = ALayout.Footer;
+const ASider = ALayout.Sider;
+const AFooter = ALayout.Footer;
 
+export default {
+  name: "index",
+  components: {
+    HeaderNotice,
+    HeaderAvatar,
+    HeaderSelect,
+    ALayout,
+    ASider,
+    AFooter,
+    Socket,
+    VUploader,
+  },
+  data() {
+    return {
+      menus: [],
+      collapsed: false,
+      wap_visible: false,
+      inline: 1,
+      openKeys: [],
+      openKeysTemp: [],
+      selectedKeys: [],
+      selectedModelKeys: [],
+      breadCrumbInfo: [],
+      config: config,
+      online: 0,
+    };
+  },
+  computed: {
+    ...mapState({
+      theme: (state) => state.theme,
+      logged: (state) => state.logged,
+      menu: (state) => state.menu.menu,
+      system: (state) => state.system,
+      pageLoading: (state) => state.pageLoading,
+      windowLoading: (state) => state.windowLoading,
+      organizationList: (state) => state.organizationList,
+      socketAction: (state) => state.socketAction,
+    }),
+    layoutClass() {
+      let className = "layout-" + this.theme;
+      if (!this.$route.meta.info.show_slider) {
+        className += " hide";
+      }
+      return className;
+    },
+  },
+  created() {
+    if (this.logged) {
+      this.checkLayout();
+    }
+    if (this.$route.query.logged) {
+      this.$store.dispatch("checkLogin");
+    }
+    if (this.$route.query.message) {
+      notice({ title: this.$route.query.message }, "notice");
+      // notice(this.$route.query.message);
+    }
+    if (this.logged) {
+      _getOrgList();
+    }
+  },
+  watch: {
+    $route: function (to, from) {
+      this.checkLayout();
+    },
+    collapsed(v) {
+      if (v) {
+        this.openKeysTemp = JSON.parse(JSON.stringify(this.openKeys));
+        this.openKeys = [];
+      } else {
+        this.openKeys = JSON.parse(JSON.stringify(this.openKeysTemp));
+      }
+    },
+    logged(val) {
+      if (!val) {
+        this.$router.push({ name: "login" });
+      }
+    },
+    socketAction(val) {
+      if (val.action === "connect" || val.action === "onClose") {
+        this.online = val.data.online;
+      }
+    },
+  },
+  methods: {
+    footerClick() {
+      autoPlay("order");
+      const socket = this.$refs.socket;
+      this.$websocket.send(
+        JSON.stringify({ uid: this.$store.state.userInfo.id })
+      );
+    },
+    checkLayout() {
+      //更新左侧菜单选中状态
+      let that = this;
+      const name = this.$route.name;
+      const path = this.$route.path;
+      const meta = this.$route.meta;
+      const info = this.$route.meta.info;
+      that.breadCrumbInfo = [];
+      that.breadCrumbInfo.push({ title: info.title, path: "/" + info.fullUrl });
+      if (!info.is_inner) {
+        that.openKeys = [];
+        that.selectedKeys = [];
+      }
+      //这里有点问题
+      // if (!that.menus) {
+      //     that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
+      //     return false;
+      // }
+      let openKey = null;
 
-    export default {
-        name: 'index',
-        components: {
-            HeaderNotice,
-            HeaderAvatar,
-            HeaderSelect,
-            ALayout,
-            ASider,
-            AFooter,
-            Socket,
-            VUploader
-        },
-        data() {
-            return {
-                menus: [],
-                collapsed: false,
-                inline: 1,
-                openKeys: [],
-                openKeysTemp: [],
-                selectedKeys: [],
-                selectedModelKeys: [],
-                breadCrumbInfo: [],
-                config: config,
-                online: 0,
-            }
-        },
-        computed: {
-            ...mapState({
-                theme: state => state.theme,
-                logged: state => state.logged,
-                menu: state => state.menu.menu,
-                system: state => state.system,
-                pageLoading: state => state.pageLoading,
-                windowLoading: state => state.windowLoading,
-                organizationList: state => state.organizationList,
-                socketAction: state => state.socketAction,
-            }),
-            layoutClass() {
-                let className = 'layout-' + this.theme;
-                if (!this.$route.meta.info.show_slider) {
-                    className += ' hide';
-                }
-                return className;
-            }
-        },
-        created() {
-            if (this.logged) {
-                this.checkLayout();
-            }
-            if (this.$route.query.logged) {
-                this.$store.dispatch('checkLogin');
-            }
-            if (this.$route.query.message) {
-                notice({title: this.$route.query.message}, 'notice');
-                // notice(this.$route.query.message);
-            }
-            if (this.logged) {
-                _getOrgList();
-            }
-        },
-        watch: {
-            $route: function (to, from) {
-                this.checkLayout();
-            },
-            collapsed(v) {
-                if (v) {
-                    this.openKeysTemp = JSON.parse(JSON.stringify(this.openKeys));
-                    this.openKeys = [];
-                } else {
-                    this.openKeys = JSON.parse(JSON.stringify(this.openKeysTemp));
-                }
-            },
-            logged(val) {
-                if (!val) {
-                    this.$router.push({name: 'login'})
-                }
-            },
-            socketAction(val) {
-                if (val.action === 'connect' || val.action === 'onClose') {
-                    this.online = val.data.online;
-                }
-            }
-        },
-        methods: {
-            footerClick() {
-                autoPlay('order');
-                const socket = this.$refs.socket;
-                this.$websocket.send(JSON.stringify({uid: this.$store.state.userInfo.id}));
-            },
-            checkLayout() {
-                //更新左侧菜单选中状态
-                let that = this;
-                const name = this.$route.name;
-                const path = this.$route.path;
-                const meta = this.$route.meta;
-                const info = this.$route.meta.info;
-                that.breadCrumbInfo = [];
-                that.breadCrumbInfo.push({title: info.title, 'path': '/' + info.fullUrl});
-                if (!info.is_inner) {
-                    that.openKeys = [];
-                    that.selectedKeys = [];
-                }
-                //这里有点问题
-                // if (!that.menus) {
-                //     that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
-                //     return false;
-                // }
-                let openKey = null;
+      function getArray(data, id) {
+        data.forEach(function (v) {
+          if (v.id == id) {
+            openKey = v;
+          }
+          if (v.children) {
+            getArray(v.children, id);
+          }
+        });
+      }
 
-                function getArray(data, id) {
-                    data.forEach(function (v) {
-                        if (v.id == id) {
-                            openKey = v;
-                        }
-                        if (v.children) {
-                            getArray(v.children, id);
-                        }
-                    });
-                }
-
-                //递归找到当前路由的顶部菜单，然后更新左侧菜单
-                if (meta.model) {
-                    getArray(that.menu, meta.model);
-                    if (!openKey) {
-                        return false;
-                    }
-                    that.breadCrumbInfo.push({title: openKey.title, 'path': '/' + openKey.fullUrl});
-                    openKey.pid && getArray(that.menu, openKey.pid);
-                } else {
-                    getArray(that.menu, meta.info.id);
-                }
-                that.breadCrumbInfo.push({title: openKey.title, 'path': '/' + openKey.fullUrl});
-                this.selectedModelKeys = [openKey.id.toString()];
-                if (!openKey.children) {
-                    that.menus = [];
-                    return false;
-                }
-                that.menus = openKey.children;
-                if (info.is_inner) {
-                    return false;
-                }
-                that.menus.forEach(function (v) {
-                    if (v.pid == that.selectedModelKeys) {
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                if ('/' + v2.fullUrl == path) {
-                                    that.selectedKeys.push(v2.id.toString());
-                                    if (!that.collapsed) {
-                                        that.openKeys.push(v2.pid.toString());
-                                    } else {
-                                        that.openKeysTemp = [v2.pid.toString()];
-                                    }
-                                }
-                            })
-                        } else {
-                            that.selectedKeys.push(v.id.toString());
-                        }
-                    }
-                });
-                that.$store.dispatch('setBreadCrumbInfo', that.breadCrumbInfo);
-            },
-            menuClick(event, menu) {
-                //点击左侧导航跳转页面
-                let that = this;
-                let openKeys = [];
-                if (!this.openKeys.length) {
-                    openKeys = [menu.id.toString()];
+      //递归找到当前路由的顶部菜单，然后更新左侧菜单
+      if (meta.model) {
+        getArray(that.menu, meta.model);
+        if (!openKey) {
+          return false;
+        }
+        that.breadCrumbInfo.push({
+          title: openKey.title,
+          path: "/" + openKey.fullUrl,
+        });
+        openKey.pid && getArray(that.menu, openKey.pid);
+      } else {
+        getArray(that.menu, meta.info.id);
+      }
+      that.breadCrumbInfo.push({
+        title: openKey.title,
+        path: "/" + openKey.fullUrl,
+      });
+      this.selectedModelKeys = [openKey.id.toString()];
+      if (!openKey.children) {
+        that.menus = [];
+        return false;
+      }
+      that.menus = openKey.children;
+      if (info.is_inner) {
+        return false;
+      }
+      that.menus.forEach(function (v) {
+        if (v.pid == that.selectedModelKeys) {
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              if ("/" + v2.fullUrl == path) {
+                that.selectedKeys.push(v2.id.toString());
+                if (!that.collapsed) {
+                  that.openKeys.push(v2.pid.toString());
                 } else {
-                    openKeys = JSON.parse(JSON.stringify(that.openKeys));
+                  that.openKeysTemp = [v2.pid.toString()];
                 }
-                that.menus.forEach(function (v) {
-                    if (v.id == openKeys) {
-                        let turnPath = '/';
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                if (v2.id == event.key) {
-                                    turnPath += v2.fullUrl;
-                                }
-                            })
-                        } else {
-                            turnPath += v.fullUrl;
-                        }
-                        that.$router.push(turnPath);
-                    }
-                });
-            },
-            menuModelClick(event) {
-                //点击顶部导航跳转页面
-                let that = this;
-                that.menu.forEach(function (v, k) {
-                    if (v.id == event.key) {
-                        that.menus = v.children;
-                        let turnPath = '/';
-                        if (!v.children) {
-                            turnPath += v.fullUrl;
-                        } else if (!v.children[0].children) {
-                            turnPath += v.children[0].fullUrl;
-                        } else {
-                            turnPath += v.children[0].children[0].fullUrl;
-                        }
-                        if (turnPath == '/home') {
-                            that.toHome();
-                            return false;
-                        }
-                        if (turnPath != '/#') {
-                            that.$router.push(turnPath);
-                        }
-                    }
-                });
-            },
-            onModelOpenChange(openKeys) {
-            },
-            onOpenChange(openKeys) {
-                let that = this;
-                const latestOpenKey = openKeys.find(key => this.openKeys.indexOf(key) === -1);
-                let hasOpenKey = false;
-                this.menus.forEach(function (v, k) {
-                    if (v.id == latestOpenKey) {
-                        that.openKeys = latestOpenKey ? [latestOpenKey] : [];
-                        hasOpenKey = true;
-
-                    }
-                });
-                if (!hasOpenKey) {
-                    that.openKeys = openKeys
-                }
-            },
-        },
-    }
+              }
+            });
+          } else {
+            that.selectedKeys.push(v.id.toString());
+          }
+        }
+      });
+      that.$store.dispatch("setBreadCrumbInfo", that.breadCrumbInfo);
+    },
+    menuClick(event, menu) {
+      //点击左侧导航跳转页面
+      let that = this;
+      let openKeys = [];
+      if (!this.openKeys.length) {
+        openKeys = [menu.id.toString()];
+      } else {
+        openKeys = JSON.parse(JSON.stringify(that.openKeys));
+      }
+      that.menus.forEach(function (v) {
+        if (v.id == openKeys) {
+          let turnPath = "/";
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              if (v2.id == event.key) {
+                turnPath += v2.fullUrl;
+              }
+            });
+          } else {
+            turnPath += v.fullUrl;
+          }
+          that.$router.push(turnPath);
+        }
+      });
+    },
+    menuModelClick(event) {
+      //点击顶部导航跳转页面
+      let that = this;
+      that.menu.forEach(function (v, k) {
+        if (v.id == event.key) {
+          that.menus = v.children;
+          let turnPath = "/";
+          if (!v.children) {
+            turnPath += v.fullUrl;
+          } else if (!v.children[0].children) {
+            turnPath += v.children[0].fullUrl;
+          } else {
+            turnPath += v.children[0].children[0].fullUrl;
+          }
+          if (turnPath == "/home") {
+            that.toHome();
+            return false;
+          }
+          if (turnPath != "/#") {
+            that.$router.push(turnPath);
+          }
+        }
+      });
+    },
+    onModelOpenChange(openKeys) {},
+    onOpenChange(openKeys) {
+      let that = this;
+      const latestOpenKey = openKeys.find(
+        (key) => this.openKeys.indexOf(key) === -1
+      );
+      let hasOpenKey = false;
+      this.menus.forEach(function (v, k) {
+        if (v.id == latestOpenKey) {
+          that.openKeys = latestOpenKey ? [latestOpenKey] : [];
+          hasOpenKey = true;
+        }
+      });
+      if (!hasOpenKey) {
+        that.openKeys = openKeys;
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-
+.right-drawer {
+  .ant-drawer-body {
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    height: 100%;
+    :nth-last-child(n + 2) {
+      flex: 1;
+    }
+  }
+}
 </style>
diff --git a/src/views/member/Register.vue b/src/views/member/Register.vue
index 182ce40..760d671 100644
--- a/src/views/member/Register.vue
+++ b/src/views/member/Register.vue
@@ -1,330 +1,340 @@
 <template>
-    <div class="main user-layout-register">
-        <h3><span>注册</span></h3>
-        <a-form ref="formRegister" :autoFormCreate="(form)=>{this.form = form}" id="formRegister">
-            <a-form-item
-                    fieldDecoratorId="email"
-                    :fieldDecoratorOptions="{rules: [{ required: true, type: 'email', message: '请输入邮箱地址' }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="text" placeholder="邮箱"></a-input>
-            </a-form-item>
-            <a-form-item
-                    fieldDecoratorId="name"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入姓名' }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="text" placeholder="姓名"></a-input>
-            </a-form-item>
-
-            <a-popover placement="rightTop" trigger="click" :visible="state.passwordLevelChecked">
-                <template slot="content">
-                    <div :style="{ width: '240px' }">
-                        <div :class="['user-register', passwordLevelClass]">强度：<span>{{ passwordLevelName }}</span>
-                        </div>
-                        <a-progress :percent="state.percent" :showInfo="false" :strokeColor=" passwordLevelColor "/>
-                        <div style="margin-top: 10px;">
-                            <span>请至少输入 6 个字符。请不要使用容易被猜到的密码。</span>
-                        </div>
-                    </div>
-                </template>
-                <a-form-item
-                        fieldDecoratorId="password"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change', 'blur']}">
-                    <a-input size="large" type="password" @click="handlePasswordInputClick" autocomplete="false"
-                             placeholder="密码须至少6位，且区分大小写"></a-input>
-                </a-form-item>
-            </a-popover>
-
-            <a-form-item
-                    fieldDecoratorId="password2"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change', 'blur']}">
-
-                <a-input size="large" type="password" autocomplete="false" placeholder="再次确认您的密码"></a-input>
-            </a-form-item>
-
-            <a-form-item
-                    fieldDecoratorId="mobile"
-                    :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/ }, { validator: this.handlePhoneCheck } ], validateTrigger: ['change', 'blur'] }">
-                <a-input size="large" placeholder="11 位手机号">
-                    <a-select slot="addonBefore" size="large" defaultValue="+86">
-                        <a-select-option value="+86">+86</a-select-option>
-                        <!--<a-select-option value="+87">+87</a-select-option>-->
-                    </a-select>
-                </a-input>
-            </a-form-item>
-            <a-row :gutter="16">
-                <a-col class="gutter-row" :span="16">
-                    <a-form-item
-                            fieldDecoratorId="captcha"
-                            :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}">
-                        <a-input size="large" type="text" placeholder="验证码">
-                            <a-icon slot="prefix" type='safety-certificate' :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
-                </a-col>
-                <a-col class="gutter-row" :span="8">
-                    <a-button
-                            class="getCaptcha"
-                            size="large"
-                            :disabled="state.smsSendBtn"
-                            @click.stop.prevent="getCaptcha"
-                            v-text="!state.smsSendBtn && '获取验证码'||(state.time+' s')"></a-button>
-                </a-col>
-            </a-row>
-
-            <a-form-item>
-                <a-button
-                        size="large"
-                        type="primary"
-                        htmlType="submit"
-                        class="register-button"
-                        :loading="registerBtn"
-                        @click.stop.prevent="handleSubmit"
-                        :disabled="registerBtn">注册
-                </a-button>
-                <router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>
-            </a-form-item>
-
-        </a-form>
-    </div>
+  <div class="main user-layout-register">
+    <h3>
+      <span>注册</span>
+    </h3>
+    <a-form ref="formRegister" :autoFormCreate="(form)=>{this.form = form}" id="formRegister">
+      <a-form-item
+        fieldDecoratorId="email"
+        :fieldDecoratorOptions="{rules: [{ required: true, type: 'email', message: '请输入邮箱地址' }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="text" placeholder="邮箱"></a-input>
+      </a-form-item>
+      <a-form-item
+        fieldDecoratorId="name"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入姓名' }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="text" placeholder="姓名"></a-input>
+      </a-form-item>
+
+      <a-popover placement="bottom" trigger="click">
+        <template slot="content">
+          <div :style="{ width: '240px' }">
+            <div :class="['user-register', passwordLevelClass]">
+              强度：
+              <span>{{ passwordLevelName }}</span>
+            </div>
+            <a-progress
+              :percent="state.percent"
+              :showInfo="false"
+              :strokeColor=" passwordLevelColor "
+            />
+            <div style="margin-top: 10px;">
+              <span>请至少输入 6 个字符。请不要使用容易被猜到的密码。</span>
+            </div>
+          </div>
+        </template>
+        <a-form-item
+          fieldDecoratorId="password"
+          :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写'}, { validator: this.handlePasswordLevel }], validateTrigger: ['change']}"
+        >
+          <a-input size="large" type="password" autocomplete="false" placeholder="密码须至少6位，且区分大小写"></a-input>
+        </a-form-item>
+      </a-popover>
+
+      <a-form-item
+        fieldDecoratorId="password2"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '至少6位密码，区分大小写' }, { validator: this.handlePasswordCheck }], validateTrigger: ['change']}"
+      >
+        <a-input size="large" type="password" autocomplete="false" placeholder="再次确认您的密码"></a-input>
+      </a-form-item>
+
+      <a-form-item
+        fieldDecoratorId="mobile"
+        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入正确的手机号', pattern: /^1[3456789]\d{9}$/ }, { validator: this.handlePhoneCheck } ], validateTrigger: ['change'] }"
+      >
+        <a-input size="large" placeholder="11 位手机号">
+          <a-select slot="addonBefore" size="large" defaultValue="+86">
+            <a-select-option value="+86">+86</a-select-option>
+            <!--<a-select-option value="+87">+87</a-select-option>-->
+          </a-select>
+        </a-input>
+      </a-form-item>
+      <a-row :gutter="16">
+        <a-col class="gutter-row" :span="14">
+          <a-form-item
+            fieldDecoratorId="captcha"
+            :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'change'}"
+          >
+            <a-input size="large" type="text" placeholder="验证码">
+              <a-icon
+                slot="prefix"
+                type="safety-certificate"
+                :style="{ color: 'rgba(0,0,0,.25)' }"
+              />
+            </a-input>
+          </a-form-item>
+        </a-col>
+        <a-col class="gutter-row" :span="10">
+          <a-button
+            class="getCaptcha"
+            size="large"
+            :disabled="state.smsSendBtn"
+            @click.stop.prevent="getCaptcha"
+            v-text="!state.smsSendBtn && '获取验证码'||(state.time+' s')"
+          ></a-button>
+        </a-col>
+      </a-row>
+
+      <a-form-item>
+        <a-button
+          size="large"
+          type="primary"
+          htmlType="submit"
+          class="register-button"
+          :loading="registerBtn"
+          @click.stop.prevent="handleSubmit"
+          :disabled="registerBtn"
+        >注册</a-button>
+        <router-link class="login" :to="{ name: 'login' }">使用已有账户登录</router-link>
+      </a-form-item>
+    </a-form>
+  </div>
 </template>
 
 <script>
-    import md5 from 'md5'
-    import {register, getCaptcha} from '@/api/user'
-    import {checkResponse} from "../../assets/js/utils";
-    import {notice} from "../../assets/js/notice";
-
-    const levelNames = {
-        0: '低',
-        1: '低',
-        2: '中',
-        3: '强'
+import md5 from "md5";
+import { register, getCaptcha } from "@/api/user";
+import { checkResponse } from "../../assets/js/utils";
+import { notice } from "../../assets/js/notice";
+
+const levelNames = {
+  0: "低",
+  1: "低",
+  2: "中",
+  3: "强",
+};
+const levelClass = {
+  0: "error",
+  1: "error",
+  2: "warning",
+  3: "success",
+};
+const levelColor = {
+  0: "#ff0000",
+  1: "#ff0000",
+  2: "#ff7e05",
+  3: "#52c41a",
+};
+export default {
+  name: "Register",
+  components: {},
+  data() {
+    return {
+      form: null,
+
+      state: {
+        time: 60,
+        smsSendBtn: false,
+        passwordLevel: 0,
+        passwordLevelChecked: false,
+        percent: 10,
+        progressColor: "#FF0000",
+      },
+      registerBtn: false,
     };
-    const levelClass = {
-        0: 'error',
-        1: 'error',
-        2: 'warning',
-        3: 'success'
-    };
-    const levelColor = {
-        0: '#ff0000',
-        1: '#ff0000',
-        2: '#ff7e05',
-        3: '#52c41a',
-    };
-    export default {
-        name: 'Register',
-        components: {},
-        data() {
-            return {
-                form: null,
-
-                state: {
-                    time: 60,
-                    smsSendBtn: false,
-                    passwordLevel: 0,
-                    passwordLevelChecked: false,
-                    percent: 10,
-                    progressColor: '#FF0000'
-                },
-                registerBtn: false
-            }
-        },
-        computed: {
-            passwordLevelClass() {
-                return levelClass[this.state.passwordLevel]
-            },
-            passwordLevelName() {
-                return levelNames[this.state.passwordLevel]
-            },
-            passwordLevelColor() {
-                return levelColor[this.state.passwordLevel]
+  },
+  computed: {
+    passwordLevelClass() {
+      return levelClass[this.state.passwordLevel];
+    },
+    passwordLevelName() {
+      return levelNames[this.state.passwordLevel];
+    },
+    passwordLevelColor() {
+      return levelColor[this.state.passwordLevel];
+    },
+  },
+  methods: {
+    handlePasswordLevel(rule, value, callback) {
+      let level = 0;
+
+      // 判断这个字符串中有没有数字
+      if (/[0-9]/.test(value)) {
+        level++;
+      }
+      // 判断字符串中有没有字母
+      if (/[a-zA-Z]/.test(value)) {
+        level++;
+      }
+      // 判断字符串中有没有特殊符号
+      if (/[^0-9a-zA-Z_]/.test(value)) {
+        level++;
+      }
+      this.state.passwordLevel = level;
+      this.state.percent = level * 30;
+      if (level >= 2) {
+        if (level >= 3) {
+          this.state.percent = 100;
+        }
+        callback();
+      } else {
+        if (level === 0) {
+          this.state.percent = 10;
+        }
+        callback(new Error("密码强度不够"));
+      }
+    },
+
+    handlePasswordCheck(rule, value, callback) {
+      const password = this.form.getFieldValue("password");
+      if (value === undefined) {
+        callback(new Error("请输入密码"));
+      }
+      if (value && password && value.trim() !== password.trim()) {
+        callback(new Error("两次密码不一致"));
+      }
+      callback();
+    },
+
+    handlePhoneCheck(rule, value, callback) {
+      // console.log('handlePhoneCheck, rule:', rule);
+      // console.log('handlePhoneCheck, value', value);
+      // console.log('handlePhoneCheck, callback', callback);
+
+      callback();
+    },
+
+    handlePasswordInputClick() {
+      this.state.passwordLevelChecked = !this.state.passwordLevelChecked;
+    },
+
+    handleSubmit() {
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          this.registerBtn = true;
+          let params = this.form.getFieldsValue();
+          params.password = md5(params.password);
+          params.password2 = md5(params.password2);
+          register(params).then((res) => {
+            this.registerBtn = false;
+            if (!checkResponse(res)) {
+              return false;
             }
-        },
-        methods: {
-
-            handlePasswordLevel(rule, value, callback) {
-
-                let level = 0;
-
-                // 判断这个字符串中有没有数字
-                if (/[0-9]/.test(value)) {
-                    level++
-                }
-                // 判断字符串中有没有字母
-                if (/[a-zA-Z]/.test(value)) {
-                    level++
-                }
-                // 判断字符串中有没有特殊符号
-                if (/[^0-9a-zA-Z_]/.test(value)) {
-                    level++
-                }
-                this.state.passwordLevel = level;
-                this.state.percent = level * 30;
-                if (level >= 2) {
-                    if (level >= 3) {
-                        this.state.percent = 100
-                    }
-                    callback()
-                } else {
-                    if (level === 0) {
-                        this.state.percent = 10
-                    }
-                    callback(new Error('密码强度不够'))
-                }
-            },
-
-            handlePasswordCheck(rule, value, callback) {
-                const password = this.form.getFieldValue('password');
-                if (value === undefined) {
-                    callback(new Error('请输入密码'))
-                }
-                if (value && password && value.trim() !== password.trim()) {
-                    callback(new Error('两次密码不一致'))
-                }
-                callback()
-            },
-
-            handlePhoneCheck(rule, value, callback) {
-                // console.log('handlePhoneCheck, rule:', rule);
-                // console.log('handlePhoneCheck, value', value);
-                // console.log('handlePhoneCheck, callback', callback);
-
-                callback()
-            },
-
-            handlePasswordInputClick() {
-                this.state.passwordLevelChecked = true;
-            },
-
-            handleSubmit() {
-                this.form.validateFields((err, values) => {
-                    if (!err) {
-                        this.registerBtn = true;
-                        let params = this.form.getFieldsValue();
-                        params.password = md5(params.password);
-                        params.password2 = md5(params.password2);
-                        register(params).then(res => {
-                            this.registerBtn = false;
-                            if (!checkResponse(res)) {
-                                return false;
-                            }
-                            notice({title: '提示', msg: '注册成功，请登陆'}, 'notification', 'success');
-                            this.$router.push({name: 'login'})
-                        });
-                    }
-                })
-            },
-
-            getCaptcha(e) {
-                e.preventDefault();
-                const that = this;
-
-                this.form.validateFields(['mobile'], {force: true},
-                    (err, values) => {
-                        if (!err) {
-                            this.state.smsSendBtn = true;
-
-                            const interval = window.setInterval(() => {
-                                if (that.state.time-- <= 0) {
-                                    that.state.time = 60;
-                                    that.state.smsSendBtn = false;
-                                    window.clearInterval(interval)
-                                }
-                            }, 1000);
-
-                            const hide = this.$message.loading('验证码发送中..', 0);
-                            getCaptcha(values.mobile)
-                                .then(res => {
-                                    this.$message.destroy();
-                                    if (!checkResponse(res)) {
-                                        return false;
-                                    }
-                                    let tips = '验证码获取成功';
-                                    if (res.data) {
-                                        tips += '，您的验证码为：' + res.data;
-                                    }
-                                    this.$notification['success']({
-                                        message: '提示',
-                                        description: tips,
-                                        duration: 8,
-                                        placement: 'bottomLeft'
-                                    })
-                                })
-                                .catch(err => {
-                                    setTimeout(hide, 1);
-                                    clearInterval(interval);
-                                    this.state.time = 60;
-                                    this.state.smsSendBtn = false;
-                                    this.requestFailed(err)
-                                })
-                        }
-                    }
-                )
-            },
-            requestFailed(err) {
-                this.$notification['error']({
-                    message: '错误',
-                    description: ((err.response || {}).data || {}).message || '请求出现错误，请稍后再试',
-                    duration: 4,
-                });
-                this.registerBtn = false
-            },
-        },
-        watch: {
-            'state.passwordLevel'(val) {
-                // console.log(val)
-
+            notice(
+              { title: "提示", msg: "注册成功，请登陆" },
+              "notification",
+              "success"
+            );
+            this.$router.push({ name: "login" });
+          });
+        }
+      });
+    },
+
+    getCaptcha(e) {
+      e.preventDefault();
+      const that = this;
+
+      this.form.validateFields(["mobile"], { force: true }, (err, values) => {
+        if (!err) {
+          this.state.smsSendBtn = true;
+
+          const interval = window.setInterval(() => {
+            if (that.state.time-- <= 0) {
+              that.state.time = 60;
+              that.state.smsSendBtn = false;
+              window.clearInterval(interval);
             }
+          }, 1000);
+
+          const hide = this.$message.loading("验证码发送中..", 0);
+          getCaptcha(values.mobile)
+            .then((res) => {
+              this.$message.destroy();
+              if (!checkResponse(res)) {
+                return false;
+              }
+              let tips = "验证码获取成功";
+              if (res.data) {
+                tips += "，您的验证码为：" + res.data;
+              }
+              this.$notification["success"]({
+                message: "提示",
+                description: tips,
+                duration: 8,
+                placement: "bottomLeft",
+              });
+            })
+            .catch((err) => {
+              setTimeout(hide, 1);
+              clearInterval(interval);
+              this.state.time = 60;
+              this.state.smsSendBtn = false;
+              this.requestFailed(err);
+            });
         }
-    }
+      });
+    },
+    requestFailed(err) {
+      this.$notification["error"]({
+        message: "错误",
+        description:
+          ((err.response || {}).data || {}).message ||
+          "请求出现错误，请稍后再试",
+        duration: 4,
+      });
+      this.registerBtn = false;
+    },
+  },
+  watch: {
+    "state.passwordLevel"(val) {
+      // console.log(val)
+    },
+  },
+};
 </script>
 <style lang="less">
-    .user-register {
-
-        &.error {
-            color: #ff0000;
-        }
-
-        &.warning {
-            color: #ff7e05;
-        }
-
-        &.success {
-            color: #52c41a;
-        }
-
-
-    }
-
-    .user-layout-register {
-        .ant-input-group-addon:first-child {
-            background-color: #fff;
-        }
-    }
+.user-register {
+  &.error {
+    color: #ff0000;
+  }
+
+  &.warning {
+    color: #ff7e05;
+  }
+
+  &.success {
+    color: #52c41a;
+  }
+}
+
+.user-layout-register {
+  .ant-input-group-addon:first-child {
+    background-color: #fff;
+  }
+}
 </style>
 <style lang="less">
-    .user-layout-register {
-
-        & > h3 {
-            font-size: 16px;
-            margin-bottom: 20px;
-        }
-
-
-        .getCaptcha {
-            display: block;
-            width: 100%;
-            height: 40px;
-        }
-
-        .register-button {
-            width: 50%;
-        }
-
-        .login {
-            float: right;
-            line-height: 40px;
-        }
-    }
+.user-layout-register {
+  & > h3 {
+    font-size: 16px;
+    margin-bottom: 20px;
+  }
+
+  .getCaptcha {
+    display: block;
+    width: 100%;
+    height: 40px;
+  }
+
+  .register-button {
+    width: 50%;
+  }
+
+  .login {
+    float: right;
+    line-height: 40px;
+  }
+}
 </style>
diff --git a/src/views/member/login.vue b/src/views/member/login.vue
index 79087ed..9c21cfe 100644
--- a/src/views/member/login.vue
+++ b/src/views/member/login.vue
@@ -1,112 +1,119 @@
 <template>
-    <div class="main">
-        <a-spin class="text-center" :spinning="oauthLoading">
-            <span v-show="oauthLoading">正在登陆，请稍后...</span>
-        </a-spin>
-        <a-form
-                v-show="!oauthLoading"
-                class="user-layout-login"
-                ref="formLogin"
-                id="formLogin"
-                :form="form"
-        >
-            <a-tabs
-                    :activeKey="customActiveKey"
-                    :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }"
-                    @change="handleTabClick"
-            >
-                <a-tab-pane key="tab1" tab="账号密码登录">
-                    <a-form-item>
-                        <a-input size="large" type="text" placeholder="帐户名或邮箱地址"
-                                 v-decorator="[
+  <div class="main">
+    <a-spin class="text-center" :spinning="oauthLoading">
+      <span v-show="oauthLoading">正在登陆，请稍后...</span>
+    </a-spin>
+    <a-form
+      v-show="!oauthLoading"
+      class="user-layout-login"
+      ref="formLogin"
+      id="formLogin"
+      :form="form"
+    >
+      <a-tabs
+        :activeKey="customActiveKey"
+        :tabBarStyle="{ textAlign: 'center', borderBottom: 'unset' }"
+        @change="handleTabClick"
+      >
+        <a-tab-pane key="tab1" tab="账号密码登录">
+          <a-form-item>
+            <a-input
+              size="large"
+              type="text"
+              placeholder="帐户名或邮箱地址"
+              v-decorator="[
                                 'account',
-                                {rules: [{ required: true, message: '请输入帐户名或邮箱地址' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'blur'}
-                            ]">
-                            <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
+                                {rules: [{ required: true, message: '请输入帐户名或邮箱地址' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="user" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
 
-                    <a-form-item
-                    >
-                        <a-input size="large" type="password" autocomplete="false" placeholder="密码"
-                                 v-decorator="[
+          <a-form-item>
+            <a-input
+              size="large"
+              type="password"
+              autocomplete="false"
+              placeholder="密码"
+              v-decorator="[
                                 'password',
-                                {rules: [{ required: true, message: '请输入密码' }], validateTrigger: 'blur'}
-                            ]">
-                            <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
-                </a-tab-pane>
-                <a-tab-pane key="tab2" tab="手机号登录">
-                    <a-form-item
-                    >
-                        <a-input size="large" type="text" placeholder="手机号"
-                                 v-decorator="[
+                                {rules: [{ required: true, message: '请输入密码' }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
+        </a-tab-pane>
+        <a-tab-pane key="tab2" tab="手机号登录">
+          <a-form-item>
+            <a-input
+              size="large"
+              type="text"
+              placeholder="手机号"
+              v-decorator="[
                                 'mobile',
-                                {rules: [{ required: true, pattern: /^1[34578]\d{9}$/, message: '请输入正确的手机号' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
-                            ]">
-                            <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                        </a-input>
-                    </a-form-item>
+                                {rules: [{ required: true, pattern: /^1[3456789]\d{9}$/, message: '请输入正确的手机号' },{ validator: this.handleUsernameOrEmail }], validateTrigger: 'change'}
+                            ]"
+            >
+              <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }" />
+            </a-input>
+          </a-form-item>
 
-                    <a-row :gutter="16">
-                        <a-col class="gutter-row" :span="16">
-                            <a-form-item
-                            >
-                                <a-input size="large" type="text" placeholder="验证码"
-                                         v-decorator="[
+          <a-row :gutter="16">
+            <a-col class="gutter-row" :span="14">
+              <a-form-item>
+                <a-input
+                  size="large"
+                  type="text"
+                  placeholder="验证码"
+                  v-decorator="[
                                 'captcha',
-                                {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}
-                            ]">
-                                    <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                                </a-input>
-                            </a-form-item>
-                        </a-col>
-                        <a-col class="gutter-row" :span="8">
-                            <a-button
-                                    class="getCaptcha"
-                                    tabindex="-1"
-                                    :disabled="state.smsSendBtn"
-                                    @click.stop.prevent="getCaptcha"
-                                    v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"
-                            ></a-button>
-                        </a-col>
-                    </a-row>
-                </a-tab-pane>
-            </a-tabs>
+                                {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'change'}
+                            ]"
+                >
+                  <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }" />
+                </a-input>
+              </a-form-item>
+            </a-col>
+            <a-col class="gutter-row" :span="10">
+              <a-button
+                class="getCaptcha"
+                tabindex="-1"
+                :disabled="state.smsSendBtn"
+                @click.stop.prevent="getCaptcha"
+                v-text="!state.smsSendBtn && '获取验证码' || (state.time+' s')"
+              ></a-button>
+            </a-col>
+          </a-row>
+        </a-tab-pane>
+      </a-tabs>
 
-            <a-form-item>
-                <a-checkbox v-model="formLogin.rememberMe">自动登录</a-checkbox>
-                <a
-                        class="forge-password"
-                        style="float: right;"
-                        @click="routerLink('/member/forgot')"
-                >忘记密码
-                </a>
-            </a-form-item>
+      <a-form-item>
+        <a-checkbox v-model="formLogin.rememberMe">自动登录</a-checkbox>
+        <a class="forge-password" style="float: right;" @click="routerLink('/member/forgot')">忘记密码</a>
+      </a-form-item>
 
-            <a-form-item style="margin-top:24px">
-                <a-button
-                        size="large"
-                        type="primary"
-                        htmlType="submit"
-                        class="login-button"
-                        :loading="loginBtn"
-                        @click.stop.prevent="handleSubmit"
-                        :disabled="loginBtn"
-                >登录
-                </a-button>
-            </a-form-item>
+      <a-form-item style="margin-top:24px">
+        <a-button
+          size="large"
+          type="primary"
+          htmlType="submit"
+          class="login-button"
+          :loading="loginBtn"
+          @click.stop.prevent="handleSubmit"
+          :disabled="loginBtn"
+        >登录</a-button>
+      </a-form-item>
 
-            <div class="user-login-other">
-                <span>其他登录方式</span>
-                <a-tooltip :mouseEnterDelay="0.3"
-                           title="钉钉登录">
-                    <a @click="dingTalkOauth">
-                        <a-icon class="item-icon" type="dingding"/>
-                    </a>
-                </a-tooltip>
-                <!--<a>
+      <div class="user-login-other">
+        <span>其他登录方式</span>
+        <a-tooltip :mouseEnterDelay="0.3" title="钉钉登录">
+          <a @click="dingTalkOauth">
+            <a-icon class="item-icon" type="dingding" />
+          </a>
+        </a-tooltip>
+        <!--<a>
                     <a-icon class="item-icon" type="alipay-circle"></a-icon>
                 </a>
                 <a>
@@ -114,335 +121,354 @@
                 </a>
                 <a>
                     <a-icon class="item-icon" type="weibo-circle"></a-icon>
-                </a>-->
-                <router-link class="register" :to="{ name: 'register' }">注册账户</router-link>
-            </div>
-        </a-form>
-    </div>
+        </a>-->
+        <router-link class="register" :to="{ name: 'register' }">注册账户</router-link>
+      </div>
+    </a-form>
+  </div>
 </template>
 
 <script>
-    import md5 from 'md5'
-    import * as dd from 'dingtalk-jsapi';
-    import {mapActions} from 'vuex'
-    import {mapState} from 'vuex'
-    import {Login, getCaptcha} from '@/api/user'
-    import {info} from '@/api/system';
-    import config from "@/config/config";
-    import {checkResponse, createRoute, timeFix} from '@/assets/js/utils'
-    import {getStore} from '@/assets/js/storage'
-    import {checkInstall} from "../../api/common/common";
-    import {_checkLogin} from "../../api/user";
-    import {dingTalkLoginByCode, dingTalkOauth} from "../../api/oauth";
-    import {notice} from "../../assets/js/notice";
+import md5 from "md5";
+import * as dd from "dingtalk-jsapi";
+import { mapActions } from "vuex";
+import { mapState } from "vuex";
+import { Login, getCaptcha } from "@/api/user";
+import { info } from "@/api/system";
+import config from "@/config/config";
+import { checkResponse, createRoute, timeFix } from "@/assets/js/utils";
+import { getStore } from "@/assets/js/storage";
+import { checkInstall } from "../../api/common/common";
+import { _checkLogin } from "../../api/user";
+import { dingTalkLoginByCode, dingTalkOauth } from "../../api/oauth";
+import { notice } from "../../assets/js/notice";
 
-    export default {
-        components: {},
-        data() {
-            return {
-                customActiveKey: 'tab1',
-                loginBtn: false,
-                oauthLoading: false,
-                // login type: 0 email, 1 account, 2 telephone
-                loginType: 0,
-                requiredTwoStepCaptcha: false,
-                stepCaptchaVisible: false,
-                form: this.$form.createForm(this),
-                state: {
-                    time: 60,
-                    smsSendBtn: false
-                },
-                formLogin: {
-                    account: '',
-                    password: '',
-                    captcha: '',
-                    mobile: '',
-                    rememberMe: true
-                }
-            }
-        },
-        computed: {
-            ...mapState({
-                system: state => state.system,
-            })
-        },
-        mounted() {
-            this.checkInstall();
-            if (this.$route.query.logged) {
-                this.oauthLoading = true;
-                this.checkLogin();
-            }
-            if (this.$route.query.message) {
-                notice({title: this.$route.query.message}, 'notice');
-                // notice(this.$route.query.message);
-            }
-        },
-        methods: {
-            ...mapActions(['Login', 'Logout']),
-            checkInstall() {
-                checkInstall().then(res => {
-                    if (!checkResponse(res)) {
-                        this.$router.push({name: 'install'});
-                        return false;
-                    }
-                    info().then(res => {
-                        if (checkResponse(res)) {
-                            this.$store.dispatch('setSystem', res.data);
-                            this.dingTalkLogin();
-                        }
-                    });
-                });
-            },
-            // handler
-            handleUsernameOrEmail(rule, value, callback) {
-                const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
-                if (regex.test(value)) {
-                    this.loginType = 0
-                } else {
-                    this.loginType = 1
-                }
-                callback()
-            },
-            handleTabClick(key) {
-                this.customActiveKey = key
-                // this.form.resetFields()
-            },
-            handleSubmit() {
-                const app = this;
-                let flag = false;
+export default {
+  components: {},
+  data() {
+    return {
+      customActiveKey: "tab1",
+      loginBtn: false,
+      oauthLoading: false,
+      // login type: 0 email, 1 account, 2 telephone
+      loginType: 0,
+      requiredTwoStepCaptcha: false,
+      stepCaptchaVisible: false,
+      form: this.$form.createForm(this),
+      state: {
+        time: 60,
+        smsSendBtn: false,
+      },
+      formLogin: {
+        account: "",
+        password: "",
+        captcha: "",
+        mobile: "",
+        rememberMe: false,
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      system: (state) => state.system,
+    }),
+  },
+  mounted() {
+    this.checkInstall();
+    if (this.$route.query.logged) {
+      this.oauthLoading = true;
+      this.checkLogin();
+    }
+    if (this.$route.query.message) {
+      notice({ title: this.$route.query.message }, "notice");
+      // notice(this.$route.query.message);
+    }
+  },
+  methods: {
+    ...mapActions(["Login", "Logout"]),
+    checkInstall() {
+      checkInstall().then((res) => {
+        if (!checkResponse(res)) {
+          this.$router.push({ name: "install" });
+          return false;
+        }
+        info().then((res) => {
+          if (checkResponse(res)) {
+            this.$store.dispatch("setSystem", res.data);
+            this.dingTalkLogin();
+          }
+        });
+      });
+    },
+    // handler
+    handleUsernameOrEmail(rule, value, callback) {
+      const regex = /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/;
+      if (regex.test(value)) {
+        this.loginType = 0;
+      } else {
+        this.loginType = 1;
+      }
+      callback();
+    },
+    handleTabClick(key) {
+      this.customActiveKey = key;
+      // this.form.resetFields()
+    },
+    handleSubmit() {
+      const app = this;
+      let flag = false;
 
-                let loginParams = {
-                    remember_me: app.formLogin.rememberMe
-                };
+      let loginParams = {
+        remember_me: app.formLogin.rememberMe,
+      };
 
-                // 使用账户密码登录
-                if (app.customActiveKey === 'tab1') {
-                    app.form.validateFields(['account', 'password'], {force: true}, (err, values) => {
-                        if (!err) {
-                            flag = true;
-                            loginParams[!app.loginType ? 'account' : 'account'] = values.account;
-                            loginParams.password = md5(values.password)
-                        }
-                    })
-                    // 使用手机号登录
-                } else {
-                    app.form.validateFields(['mobile', 'captcha'], {force: true}, (err, values) => {
-                        if (!err) {
-                            flag = true;
-                            loginParams = Object.assign(loginParams, values)
-                        }
-                    })
-                }
+      // 使用账户密码登录
+      if (app.customActiveKey === "tab1") {
+        app.form.validateFields(
+          ["account", "password"],
+          { force: true },
+          (err, values) => {
+            if (!err) {
+              flag = true;
+              loginParams[!app.loginType ? "account" : "account"] =
+                values.account;
+              loginParams.password = md5(values.password);
+            }
+          }
+        );
+        // 使用手机号登录
+      } else {
+        app.form.validateFields(
+          ["mobile", "captcha"],
+          { force: true },
+          (err, values) => {
+            if (!err) {
+              flag = true;
+              loginParams = Object.assign(loginParams, values);
+            }
+          }
+        );
+      }
 
-                if (!flag) return;
+      if (!flag) return;
 
-                app.loginBtn = true;
-                loginParams.clientid = getStore('client_id');
-                Login(loginParams).then(res => {
-                    if (checkResponse(res)) {
-                        loginParams.token = res.token;
-                        this.dealDataBeforeLogin(res);
-                    }
-                    this.loginBtn = false
-                }).catch(() => {
-                    this.loginBtn = false
-                });
-            },
-            getCaptcha(e) {
-                e.preventDefault();
-                const app = this;
+      app.loginBtn = true;
+      loginParams.clientid = getStore("client_id");
+      Login(loginParams)
+        .then((res) => {
+          if (checkResponse(res)) {
+            loginParams.token = res.token;
+            this.dealDataBeforeLogin(res);
+          }
+          this.loginBtn = false;
+        })
+        .catch(() => {
+          this.loginBtn = false;
+        });
+    },
+    getCaptcha(e) {
+      e.preventDefault();
+      const app = this;
 
-                this.form.validateFields(['mobile'], {force: true}, (err, values) => {
-                    if (!err) {
-                        this.state.smsSendBtn = true;
+      this.form.validateFields(["mobile"], { force: true }, (err, values) => {
+        if (!err) {
+          this.state.smsSendBtn = true;
 
-                        const interval = window.setInterval(() => {
-                            if (app.state.time-- <= 0) {
-                                app.state.time = 60;
-                                app.state.smsSendBtn = false;
-                                window.clearInterval(interval)
-                            }
-                        }, 1000);
+          const interval = window.setInterval(() => {
+            if (app.state.time-- <= 0) {
+              app.state.time = 60;
+              app.state.smsSendBtn = false;
+              window.clearInterval(interval);
+            }
+          }, 1000);
 
-                        const hide = this.$message.loading('验证码发送中..', 0);
-                        getCaptcha(values.mobile)
-                            .then(res => {
-                                this.$message.destroy();
+          const hide = this.$message.loading("验证码发送中..", 0);
+          getCaptcha(values.mobile)
+            .then((res) => {
+              this.$message.destroy();
 
-                                if (!checkResponse(res)) {
-                                    return false;
-                                }
-                                let tips = '验证码获取成功';
-                                if (res.data) {
-                                    tips += '，您的验证码为：' + res.data;
-                                }
-                                this.$notification['success']({
-                                    message: '提示',
-                                    description: tips,
-                                    duration: 8,
-                                    placement: 'bottomLeft'
-                                });
-                            })
-                            .catch(err => {
-                                // setTimeout(hide, 1);
-                                clearInterval(interval);
-                                app.state.time = 60;
-                                app.state.smsSendBtn = false;
-                                this.requestFailed(err)
-                            })
-                    }
-                })
-            },
-            loginSuccess(res, org) {
-                const menu = getStore('menu', true);
-                if (menu) {
-                    let routes = this.$router.options.routes;
-                    menu.forEach(function (v) {
-                        routes[0].children.push(createRoute(v));
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                routes[0].children.push(createRoute(v2));
-                                if (v2.children) {
-                                    v2.children.forEach(function (v3) {
-                                        routes[0].children.push(createRoute(v3));
-                                    });
-                                }
-                            });
-                        }
-                    });
-                    this.loginBtn = false;
-                    this.$router.addRoutes(routes);
-                    let redirect = this.$route.query.redirect || config.HOME_PAGE + '/' + org.code;
-                    if (redirect == config.HOME_PAGE) {
-                        redirect = config.HOME_PAGE + '/' + org.code
-                    }
-                    console.log('redirect');
-                    console.log(redirect);
-                    this.$router.push({
-                        path: redirect
-                    });
-                    this.$notification.success({
-                        message: '欢迎',
-                        description: `${res.data.member.name}，${timeFix()}，欢迎回来`,
-                    });
-                    this.oauthLoading = false;
-                }
-            },
-            dingTalkOauth() {
-                let url = dingTalkOauth() + '?redirect=' + this.$route.query.redirect;
-                let redirect = this.$route.query.redirect;
-                if (redirect) {
-                    url += '?redirect=' + redirect;
-                }
-                location.href = url;
-            },
-            dingTalkLogin() {
-                let app = this;
-                dd.ready(function () {
-                    // dd.ready参数为回调函数，在环境准备就绪时触发，jsapi的调用需要保证在该回调函数触发后调用，否则无效。
-                    dd.runtime.permission.requestAuthCode({
-                        corpId: "ding42ccb1a1923b200f35c2f4657eb6378f",
-                        onSuccess: function (result) {
-                            app.oauthLoading = true;
-                            dingTalkLoginByCode({code: result.code}).then(res => {
-                                if (checkResponse(res)) {
-                                    app.dealDataBeforeLogin(res);
-                                }
-                            });
-                        }
-                    });
-                });
-            },
-            checkLogin() {
-                _checkLogin().then(res => {
-                    this.dealDataBeforeLogin(res);
-                });
-            },
-            async dealDataBeforeLogin(res) {
-                let app = this;
-                if (res.data) {
-                    const obj = {
-                        userInfo: res.data.member,
-                        tokenList: res.data.tokenList
-                    };
-                    let currentOrganization = getStore('currentOrganization', true);
-                    const organizationList = res.data.organizationList;
-                    await app.$store.dispatch('SET_LOGGED', obj);
-                    await app.$store.dispatch('setOrganizationList', organizationList);
-                    if (!currentOrganization) {
-                        currentOrganization = organizationList[0];
-                    } else {
-                        const has = organizationList.findIndex(item => item.id == currentOrganization.id);
-                        if (has === -1) {
-                            currentOrganization = organizationList[0];
-                        }
-                    }
-                    await app.$store.dispatch('setCurrentOrganization', currentOrganization);
-                    await app.$store.dispatch('GET_MENU').then(() => {
-                        app.loginSuccess(res, currentOrganization);
-                    });
-                } else {
-                    app.oauthLoading = false;
-                    app.$store.dispatch('SET_LOGOUT');
-                    // app.$router.replace('/login?redirect=' + this.$router.currentRoute.fullPath);
-                }
-            },
-            requestFailed(err) {
-                this.$notification['error']({
-                    message: '错误',
-                    description: ((err.response || {}).data || {}).message || '请求出现错误，请稍后再试',
-                    duration: 4
+              if (!checkResponse(res)) {
+                return false;
+              }
+              let tips = "验证码获取成功";
+              if (res.data) {
+                tips += "，您的验证码为：" + res.data;
+              }
+              this.$notification["success"]({
+                message: "提示",
+                description: tips,
+                duration: 8,
+                placement: "bottomLeft",
+              });
+            })
+            .catch((err) => {
+              // setTimeout(hide, 1);
+              clearInterval(interval);
+              app.state.time = 60;
+              app.state.smsSendBtn = false;
+              this.requestFailed(err);
+            });
+        }
+      });
+    },
+    loginSuccess(res, org) {
+      const menu = getStore("menu", true);
+      if (menu) {
+        let routes = this.$router.options.routes;
+        menu.forEach(function (v) {
+          routes[0].children.push(createRoute(v));
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              routes[0].children.push(createRoute(v2));
+              if (v2.children) {
+                v2.children.forEach(function (v3) {
+                  routes[0].children.push(createRoute(v3));
                 });
-                this.loginBtn = false
-            }
+              }
+            });
+          }
+        });
+        this.loginBtn = false;
+        this.$router.addRoutes(routes);
+        let redirect =
+          this.$route.query.redirect || config.HOME_PAGE + "/" + org.code;
+        if (redirect == config.HOME_PAGE) {
+          redirect = config.HOME_PAGE + "/" + org.code;
         }
-    }
+        console.log("redirect");
+        console.log(redirect);
+        this.$router.push({
+          path: redirect,
+        });
+        this.$notification.success({
+          message: "欢迎",
+          description: `${res.data.member.name}，${timeFix()}，欢迎回来`,
+        });
+        this.oauthLoading = false;
+      }
+    },
+    dingTalkOauth() {
+      let url = dingTalkOauth() + "?redirect=" + this.$route.query.redirect;
+      let redirect = this.$route.query.redirect;
+      if (redirect) {
+        url += "?redirect=" + redirect;
+      }
+      location.href = url;
+    },
+    dingTalkLogin() {
+      let app = this;
+      dd.ready(function () {
+        // dd.ready参数为回调函数，在环境准备就绪时触发，jsapi的调用需要保证在该回调函数触发后调用，否则无效。
+        dd.runtime.permission.requestAuthCode({
+          corpId: "ding42ccb1a1923b200f35c2f4657eb6378f",
+          onSuccess: function (result) {
+            app.oauthLoading = true;
+            dingTalkLoginByCode({ code: result.code }).then((res) => {
+              if (checkResponse(res)) {
+                app.dealDataBeforeLogin(res);
+              }
+            });
+          },
+        });
+      });
+    },
+    checkLogin() {
+      _checkLogin().then((res) => {
+        this.dealDataBeforeLogin(res);
+      });
+    },
+    async dealDataBeforeLogin(res) {
+      let app = this;
+      if (res.data) {
+        const obj = {
+          userInfo: res.data.member,
+          tokenList: res.data.tokenList,
+        };
+        let currentOrganization = getStore("currentOrganization", true);
+        const organizationList = res.data.organizationList;
+        await app.$store.dispatch("SET_LOGGED", obj);
+        await app.$store.dispatch("setOrganizationList", organizationList);
+        if (!currentOrganization) {
+          currentOrganization = organizationList[0];
+        } else {
+          const has = organizationList.findIndex(
+            (item) => item.id == currentOrganization.id
+          );
+          if (has === -1) {
+            currentOrganization = organizationList[0];
+          }
+        }
+        await app.$store.dispatch(
+          "setCurrentOrganization",
+          currentOrganization
+        );
+        await app.$store.dispatch("GET_MENU").then(() => {
+          app.loginSuccess(res, currentOrganization);
+        });
+      } else {
+        app.oauthLoading = false;
+        app.$store.dispatch("SET_LOGOUT");
+        // app.$router.replace('/login?redirect=' + this.$router.currentRoute.fullPath);
+      }
+    },
+    requestFailed(err) {
+      this.$notification["error"]({
+        message: "错误",
+        description:
+          ((err.response || {}).data || {}).message ||
+          "请求出现错误，请稍后再试",
+        duration: 4,
+      });
+      this.loginBtn = false;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .user-layout-login {
-        label {
-            font-size: 14px;
-        }
+.user-layout-login {
+  label {
+    font-size: 14px;
+  }
 
-        .getCaptcha {
-            display: block;
-            width: 100%;
-            height: 40px;
-        }
+  .getCaptcha {
+    display: block;
+    width: 100%;
+    height: 40px;
+  }
 
-        .forge-password {
-            font-size: 14px;
-        }
+  .forge-password {
+    font-size: 14px;
+  }
 
-        button.login-button {
-            padding: 0 15px;
-            font-size: 16px;
-            height: 40px;
-            width: 100%;
-        }
+  button.login-button {
+    padding: 0 15px;
+    font-size: 16px;
+    height: 40px;
+    width: 100%;
+  }
 
-        .user-login-other {
-            text-align: left;
-            margin-top: 24px;
-            line-height: 22px;
+  .user-login-other {
+    text-align: left;
+    margin-top: 24px;
+    line-height: 22px;
 
-            .item-icon {
-                font-size: 24px;
-                color: rgba(0, 0, 0, 0.2);
-                margin-left: 16px;
-                vertical-align: middle;
-                cursor: pointer;
-                transition: color 0.3s;
+    .item-icon {
+      font-size: 24px;
+      color: rgba(0, 0, 0, 0.2);
+      margin-left: 16px;
+      vertical-align: middle;
+      cursor: pointer;
+      transition: color 0.3s;
 
-                &:hover {
-                    color: #1890ff;
-                }
-            }
+      &:hover {
+        color: #1890ff;
+      }
+    }
 
-            .register {
-                float: right;
-            }
-        }
+    .register {
+      float: right;
     }
+  }
+}
 </style>
diff --git a/src/views/members/index.vue b/src/views/members/index.vue
index d41c3fa..11aada0 100644
--- a/src/views/members/index.vue
+++ b/src/views/members/index.vue
@@ -530,7 +530,6 @@
         .left {
             padding: 12px 24px 12px 0;
             width: 280px;
-            height: 85vh;
 
             .left-content {
                 width: 255px;
diff --git a/src/views/organization/index.vue b/src/views/organization/index.vue
index cbdd944..ff87fc7 100644
--- a/src/views/organization/index.vue
+++ b/src/views/organization/index.vue
@@ -1,40 +1,43 @@
 <template>
-    <div class="house-index">
-        <wrapper-content>
-           <!-- <div class="action">
-                <a-button type="primary" icon="plus" @click="rowClick(null,'new')">添加</a-button>
-            </div>-->
-            <a-table :columns="columns" :dataSource="dataSource" :loading="loading" rowKey="id" :pagination="pagination"
-                     @change="pageChange">
-                <template slot="action" slot-scope="text,record,index">
-                    <a @click="rowClick(record,'edit')" v-if="record.owner_code == userInfo.code">编辑</a>
-                    <a @click="rowClick(record,'quit')" v-if="record.owner_code != userInfo.code">退出</a>
-                </template>
-            </a-table>
-        </wrapper-content>
-        <a-modal
-                v-model="actionInfo.modalStatus"
-                :width="800"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="house-index">
+    <wrapper-content>
+      <div class="action">
+        <a-button type="primary" icon="plus" @click="rowClick(null,'new')">添加</a-button>
+      </div>
+      <a-table
+        :columns="columns"
+        :dataSource="dataSource"
+        :loading="loading"
+        rowKey="id"
+        :pagination="pagination"
+        @change="pageChange"
+      >
+        <template slot="action" slot-scope="text,record,index">
+          <a @click="rowClick(record,'edit')" v-if="record.owner_code == userInfo.code">编辑</a>
+          <a @click="rowClick(record,'quit')" v-if="record.owner_code != userInfo.code">退出</a>
+        </template>
+      </a-table>
+    </wrapper-content>
+    <a-modal
+      v-model="actionInfo.modalStatus"
+      :width="800"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form :autoFormCreate="(form)=>{this.form = form}" @submit.prevent="handleSubmit">
+        <a-form-item
+          :form="form"
+          label="组织名称"
+          :labelCol="{ span: 3 }"
+          :wrapperCol="{ span: 21 }"
+          fieldDecoratorId="name"
+          :fieldDecoratorOptions="{rules: [{ required: true, message: '组织名称' }]}"
+          help="必填，请填写组织名称"
         >
-            <a-form
-                    :autoFormCreate="(form)=>{this.form = form}"
-                    @submit.prevent="handleSubmit"
-            >
-                <a-form-item
-                        :form="form"
-                        label='组织名称'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="name"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '组织名称' }]}"
-                        help='必填，请填写组织名称'
-                >
-                    <a-input placeholder='组织名称'/>
-                </a-form-item>
-               <!-- <a-form-item
+          <a-input placeholder="组织名称" />
+        </a-form-item>
+        <!-- <a-form-item
                         label='所在区域'
                         :labelCol="{ span: 3 }"
                         :wrapperCol="{ span: 21 }"
@@ -44,182 +47,186 @@
                 >
                     <a-cascader :fieldNames="{ label: 'Name', value: 'ID', children: 'children' }" :options="options"
                                 placeholder="选择所在省市"/>
-                </a-form-item>-->
+        </a-form-item>-->
 
-                <a-form-item
-                        label='详细地址'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{span: 21 }"
-                        fieldDecoratorId="address"
-                        help="详细地址"
-                >
-                    <a-input/>
-                </a-form-item>
+        <a-form-item
+          label="详细地址"
+          :labelCol="{ span: 3 }"
+          :wrapperCol="{span: 21 }"
+          fieldDecoratorId="address"
+          help="详细地址"
+        >
+          <a-input />
+        </a-form-item>
 
-                <a-form-item
-                        :wrapperCol="{ span: 21, offset: 3 }"
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">保存
-                        </a-button>
-                        <a-button class="middle-btn" @click="actionInfo.modalStatus = false">取消
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+        <a-form-item :wrapperCol="{ span: 21, offset: 3 }">
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >保存</a-button>
+            <a-button class="middle-btn" @click="actionInfo.modalStatus = false">取消</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {list, doData, del} from '@/api/organization';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {_quitOrganization} from "../../api/organization";
+import { mapState } from "vuex";
+import { list, doData, del } from "@/api/organization";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { _quitOrganization } from "../../api/organization";
 
-    const columns = [{
-        title: '组织名称',
-        dataIndex: 'name',
-        width: '30%',
-    }, {
-        title: '操作',
-        scopedSlots: {
-            customRender: 'action'
-        }
-    }];
-
-    export default {
-        mixins: [pagination],
-        data() {
-            return {
-                columns,
-                dataSource: [],
-                loading: true,
-                newData: {
-                    code: 0
-                },
-                form: {},
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑组织',
-                    okText: '保存',
-                    cancelText: '放弃',
-                },
-                showMap: false,
-                options: [],
-            }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            })
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            moment,
-            init(quited) {
-                let app = this;
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = res.data.list;
-                    app.pagination.total = res.data.total;
-                    app.loading = false;
-                    if (quited) {
-                        //退出组织后重新更新当前组织
-                        app.$store.dispatch('setCurrentOrganization',  res.data.list[0]);
-                    }
-                    app.$store.dispatch('setOrganizationList', res.data.list);
-                });
-                // areasData().then(res => {
-                //     app.options = res.data;
-                // });
-            },
-            rowClick(record, action) {
-                let app = this;
-                app.newData = {code: ''};
-                if (action == 'add' || action == 'edit' || action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '添加组织';
-                    if (action == 'edit') {
-                        //modal没显示之前不会实例化modal子元素，延迟处理
-                        setTimeout(function () {
-                            app.actionInfo.modalTitle = '编辑组织';
-                            app.form.setFieldsValue({
-                                name: record.name,
-                                areas: [record.province.toString(), record.city.toString(), record.area.toString()],
-                                address: record.address,
-                            });
-                            app.newData = record;
-                        }, 0);
-                    }
-                }else if (action == 'quit') {
-                    this.$confirm({
-                        title: '确定要退出此组织?',
-                        okText: '退出',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            _quitOrganization({organizationCode: record.code}).then(res=>{
-                                if (checkResponse(res)) {
-                                    app.init(true);
-                                }
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                obj.areas = JSON.stringify(obj.areas);
-                console.log(app.newData);
-                if (app.newData.code) {
-                    app.newData.organizationCode = app.newData.code
-                    //编辑
-                    obj.organizationCode = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    if (app.newData.code) {
-                        app.newData.name = obj.name;
-                        app.newData.address = obj.address;
-                    } else {
-                        app.dataSource.push(res.data);
-                    }
-                    app.form.resetFields();
-                    app.newData = {code: 0};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
+const columns = [
+  {
+    title: "组织名称",
+    dataIndex: "name",
+    width: "30%",
+  },
+  {
+    title: "操作",
+    scopedSlots: {
+      customRender: "action",
+    },
+  },
+];
 
-                });
-            }
+export default {
+  mixins: [pagination],
+  data() {
+    return {
+      columns,
+      dataSource: [],
+      loading: true,
+      newData: {
+        code: 0,
+      },
+      form: {},
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑组织",
+        okText: "保存",
+        cancelText: "放弃",
+      },
+      showMap: false,
+      options: [],
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(quited) {
+      let app = this;
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = res.data.list;
+        app.pagination.total = res.data.total;
+        app.loading = false;
+        if (quited) {
+          //退出组织后重新更新当前组织
+          app.$store.dispatch("setCurrentOrganization", res.data.list[0]);
+        }
+        app.$store.dispatch("setOrganizationList", res.data.list);
+      });
+      // areasData().then(res => {
+      //     app.options = res.data;
+      // });
+    },
+    rowClick(record, action) {
+      let app = this;
+      app.newData = { code: "" };
+      if (action == "add" || action == "edit" || action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "添加组织";
+        if (action == "edit") {
+          //modal没显示之前不会实例化modal子元素，延迟处理
+          setTimeout(function () {
+            app.actionInfo.modalTitle = "编辑组织";
+            app.form.setFieldsValue({
+              name: record.name,
+              areas: [
+                record.province.toString(),
+                record.city.toString(),
+                record.area.toString(),
+              ],
+              address: record.address,
+            });
+            app.newData = record;
+          }, 0);
+        }
+      } else if (action == "quit") {
+        this.$confirm({
+          title: "确定要退出此组织?",
+          okText: "退出",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            _quitOrganization({ organizationCode: record.code }).then((res) => {
+              if (checkResponse(res)) {
+                app.init(true);
+              }
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err, values) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      obj.areas = JSON.stringify(obj.areas);
+      console.log(app.newData);
+      if (app.newData.code) {
+        app.newData.organizationCode = app.newData.code;
+        //编辑
+        obj.organizationCode = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
+        }
+        if (app.newData.code) {
+          app.newData.name = obj.name;
+          app.newData.address = obj.address;
+        } else {
+          app.dataSource.push(res.data);
         }
-    }
+        app.form.resetFields();
+        app.newData = { code: 0 };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+  },
+};
 </script>
diff --git a/src/views/project/archive/index.vue b/src/views/project/archive/index.vue
index b7d670e..1e82e36 100644
--- a/src/views/project/archive/index.vue
+++ b/src/views/project/archive/index.vue
@@ -1,172 +1,172 @@
 <template>
-    <div class="project-archive-index">
-        <wrapper-content :showHeader="false">
-            <a-list
-                    class="project-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-                    :locale="{emptyText:''}"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多项目</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                     <span slot="actions">
-                         <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
-                             <a-icon type="undo"/>
-                         </a-tooltip>
-                    </span>
-                    <span slot="actions" @click="doAction(item,'del',index)">
-                         <a-tooltip title="移至回收站">
-                              <a-icon type="delete"/>
-                         </a-tooltip>
-                    </span>
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <router-link  :to="'/project/space/task/' + item.code" slot="title">{{item.name}}</router-link>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="other-info muted">
-                        <div class="info-item">
-                            <span>移动日期</span>
-                            <span>{{moment(item.archive_time).format('YYYY-MM-DD')}}</span>
-                        </div>
-                    </div>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-    </div>
+  <div class="project-archive-index">
+    <wrapper-content :showHeader="false">
+      <a-list
+        class="project-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+        :locale="{emptyText:''}"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore" />
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <span slot="actions">
+            <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
+              <a-icon type="undo" />
+            </a-tooltip>
+          </span>
+          <span slot="actions" @click="doAction(item,'del',index)">
+            <a-tooltip title="移至回收站">
+              <a-icon type="delete" />
+            </a-tooltip>
+          </span>
+          <a-list-item-meta :description="item.description">
+            <router-link :to="'/project/space/task/' + item.code" slot="title">{{item.name}}</router-link>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="other-info muted">
+            <div class="info-item">
+              <span>移动日期</span>
+              <span>{{moment(item.archive_time).format('YYYY-MM-DD')}}</span>
+            </div>
+          </div>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+  </div>
 </template>
 <script>
-    import {list, doData, del} from '@/api/project';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {recoveryArchive, recycle} from "../../../api/project";
+import { list, doData, del } from "@/api/project";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { recoveryArchive, recycle } from "../../../api/project";
 
-    export default {
-        mixins: [pagination],
-        data() {
-            return {
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                currentProject: {},
-                currentProjectId: 0,
-                newData: {
-                    id: 0
-                },
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            moment,
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 1000;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.archive = 1;
-                this.requestData.type = 'other';
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            inviteProjectMember(item){
-                this.currentProject = item;
-                this.currentProjectId = item.id;
-                this.showInviteMember = true;
-            },
-            doAction(record, action,index) {
-                this.currentProject = record;
-                let app = this;
-                app.newData = {id: 0};
-                 if (action == 'recoveryArchive') {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                                content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }else if (action == 'del') {
-                     this.$confirm({
-                         title: '确定放入回收站？',
-                         content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                         okText: '放入回收站',
-                         okType: 'danger',
-                         cancelText: '再想想',
-                         onOk() {
-                             recycle(record.code).then(()=>{
-                                 app.dataSource.splice(index, 1);
-                             });
-                             return Promise.resolve();
-                         }
-                     });
-                 }
-            },
-        }
-    }
+export default {
+  mixins: [pagination],
+  data() {
+    return {
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      currentProject: {},
+      currentProjectId: 0,
+      newData: {
+        id: 0,
+      },
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 1000;
+        this.showLoadingMore = false;
+      }
+      this.requestData.selectBy = "archive";
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    inviteProjectMember(item) {
+      this.currentProject = item;
+      this.currentProjectId = item.id;
+      this.showInviteMember = true;
+    },
+    doAction(record, action, index) {
+      this.currentProject = record;
+      let app = this;
+      app.newData = { id: 0 };
+      if (action == "recoveryArchive") {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    @import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
+@import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
 
-    .project-archive-index {
-        .project-list {
-            .ant-list-item-meta-avatar {
-                .ant-avatar {
-                    width: 50px;
-                    height: 50px;
-                    border-radius: 3px;
-                }
-            }
+.project-archive-index {
+  .project-list {
+    .ant-list-item-meta-avatar {
+      .ant-avatar {
+        width: 50px;
+        height: 50px;
+        border-radius: 3px;
+      }
+    }
 
-            .ant-list-item-content {
-                .other-info {
-                    display: flex;
+    .ant-list-item-content {
+      .other-info {
+        display: flex;
 
-                    .info-item {
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 48px;
-                    }
-                }
-            }
+        .info-item {
+          display: flex;
+          flex-direction: column;
+          padding-left: 48px;
+        }
+      }
+    }
 
-            .ant-list-item-action {
-                .anticon:hover {
-                    svg {
-                        color: @primary-color;
-                    }
-                }
-            }
+    .ant-list-item-action {
+      .anticon:hover {
+        svg {
+          color: @primary-color;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/project/list/index.vue b/src/views/project/list/index.vue
index a14da16..c0c7d87 100644
--- a/src/views/project/list/index.vue
+++ b/src/views/project/list/index.vue
@@ -1,454 +1,405 @@
 <template>
-    <div class="project-list-index">
-        <wrapper-content :showHeader="false">
-            <!--  <div class="page-search">
-                  <a-form
-                          layout="inline"
-                          :autoFormCreate="(form)=>{this.searchForm = form}"
-                          @submit.prevent="handleSearchSubmit"
-                  >
-                      <a-form-item
-                              label='名称'
-                              fieldDecoratorId="name"
-                      >
-                          <a-input placeholder='请输入'/>
-                      </a-form-item>
-                      <a-form-item
-                              label='创建日期'
-                              fieldDecoratorId="date"
-                      >
-                          <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
-                      </a-form-item>
-                      <a-form-item
-                      >
-                          <a-button icon="search" type="primary" htmlType='submit'
-                                    :loading="actionInfo.confirmLoading"
-                          >搜索
-                          </a-button>
-                      </a-form-item>
-                  </a-form>
-              </div>-->
-          <!--  <div class="action">
-                <a-button type="primary" icon="plus" @click="doAction(null,'new')">创建新项目</a-button>
-            </div>-->
-            <a-tabs v-model="selectBy" @change="selectChange" :animated="false">
-                <a-tab-pane key="my" tab="全部项目"></a-tab-pane>
-                <a-tab-pane key="collect" tab="我的收藏"></a-tab-pane>
-                <a-tab-pane key="archive" tab="已归档"></a-tab-pane>
-                <a-tab-pane key="deleted" tab="回收站"></a-tab-pane>
-                <a-button slot="tabBarExtraContent" type="primary" icon="plus" @click="doAction(null,'new')">创建新项目</a-button>
-            </a-tabs>
-            <a-list
-                    class="project-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多项目</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <div slot="title">
-                            <router-link :to="'/project/space/task/' + item.code">{{item.name}}</router-link>
-                            <a-tag color="green" class="m-l" v-show="!item.private">公开</a-tag>
-                        </div>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="ant-list-item-content">
-                        <div class="other-info muted">
-                            <div class="info-item">
-                                <span>创建日期</span>
-                                <span>{{moment(item.create_time).format('YYYY-MM-DD')}}</span>
-                            </div>
-                            <div class="info-item">
-                                <span>创建人</span>
-                                <span>{{item.owner_name}}</span>
-                            </div>
-                            <div class="info-item schedule">
-                                <span>进度</span>
-                                <a-progress :strokeWidth="5" :percent="item.schedule"/>
-                            </div>
-                        </div>
-                    </div>
-                    <template v-if="selectBy === 'my' || selectBy === 'collect'">
-                        <span slot="actions" @click="inviteProjectMember(item)">
-                             <a-tooltip title="添加成员">
-                                 <a-icon type="user-add"/>
-                             </a-tooltip>
-                        </span>
-                        <span slot="actions" @click="doAction(item,'edit',index)">
-                             <a-tooltip title="项目设置">
-                                  <a-icon type="setting"/>
-                             </a-tooltip>
-                        </span>
-                        <span slot="actions">
-                             <a-tooltip :title="item.collected ? '取消收藏' : '加入收藏'"
-                                        @click="doAction(item,'collect',index)">
-                                 <a-icon type="star" v-show="!item.collected"/>
-                                 <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="item.collected"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                    <template v-if="selectBy === 'archive'">
-                         <span slot="actions">
-                         <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
-                             <a-icon type="undo"/>
-                         </a-tooltip>
-                    </span>
-                    </template>
-                    <template v-if="selectBy === 'archive' || selectBy === 'my' || selectBy === 'collect'">
-                             <span slot="actions" @click="doAction(item,'del',index)">
-                             <a-tooltip title="移至回收站">
-                                  <a-icon type="delete"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                    <template v-if="selectBy === 'deleted'">
-                        <span slot="actions">
-                             <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
-                                 <a-icon type="undo"/>
-                             </a-tooltip>
-                        </span>
-                    </template>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-        <a-modal
-                destroyOnClose
-                :width="360"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="project-list-index">
+    <wrapper-content :showHeader="false">
+      <!-- <div class="page-search">
+        <a-form
+          layout="inline"
+          :autoFormCreate="(form)=>{this.searchForm = form}"
+          @submit.prevent="handleSearchSubmit"
         >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="form"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='项目名称（必填）'
-                             v-decorator="[
+          <a-form-item label="名称" fieldDecoratorId="name">
+            <a-input placeholder="请输入" />
+          </a-form-item>
+          <a-form-item label="创建日期" fieldDecoratorId="date">
+            <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
+          </a-form-item>
+          <a-form-item>
+            <a-button
+              icon="search"
+              type="primary"
+              htmlType="submit"
+              :loading="actionInfo.confirmLoading"
+            >搜索</a-button>
+          </a-form-item>
+        </a-form>
+      </div>-->
+      <a-tabs v-model="selectBy" @change="selectChange" :animated="false">
+        <a-tab-pane key="my" tab="全部项目"></a-tab-pane>
+        <a-tab-pane key="collect" tab="我的收藏"></a-tab-pane>
+        <a-tab-pane key="archive" tab="已归档"></a-tab-pane>
+        <a-tab-pane key="deleted" tab="回收站"></a-tab-pane>
+        <a-button
+          slot="tabBarExtraContent"
+          type="primary"
+          icon="plus"
+          @click="doAction(null,'new')"
+        >创建新项目</a-button>
+      </a-tabs>
+      <a-list
+        class="project-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore" />
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <a-list-item-meta :description="item.description">
+            <div slot="title">
+              <router-link :to="'/project/space/task/' + item.code">{{item.name}}</router-link>
+              <a-tag color="green" class="m-l" v-show="!item.private">公开</a-tag>
+            </div>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="ant-list-item-content other-info muted">
+            <div class="info-item">
+              <span>创建日期</span>
+              <span>{{moment(item.create_time).format('YYYY-MM-DD')}}</span>
+            </div>
+            <div class="info-item">
+              <span>创建人</span>
+              <span>{{item.owner_name}}</span>
+            </div>
+          </div>
+          <div class="ant-list-item-content schedule muted">
+            <div class="info-item">
+              <span>进度</span>
+              <a-progress :strokeWidth="5" :percent="item.schedule" />
+            </div>
+          </div>
+          <template v-if="selectBy === 'my' || selectBy === 'collect'">
+            <span slot="actions" @click="inviteProjectMember(item)">
+              <a-tooltip title="添加成员">
+                <a-icon type="user-add" />
+              </a-tooltip>
+            </span>
+            <span slot="actions" @click="doAction(item,'edit',index)">
+              <a-tooltip title="项目设置">
+                <a-icon type="setting" />
+              </a-tooltip>
+            </span>
+            <span slot="actions">
+              <a-tooltip
+                :title="item.collected ? '取消收藏' : '加入收藏'"
+                @click="doAction(item,'collect',index)"
+              >
+                <a-icon type="star" v-show="!item.collected" />
+                <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="item.collected" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'archive'">
+            <span slot="actions">
+              <a-tooltip title="恢复项目" @click="doAction(item,'recoveryArchive',index)">
+                <a-icon type="undo" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'archive' || selectBy === 'my' || selectBy === 'collect'">
+            <span slot="actions" @click="doAction(item,'del',index)">
+              <a-tooltip title="移至回收站">
+                <a-icon type="delete" />
+              </a-tooltip>
+            </span>
+          </template>
+          <template v-if="selectBy === 'deleted'">
+            <span slot="actions">
+              <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
+                <a-icon type="undo" />
+              </a-tooltip>
+            </span>
+          </template>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+    <a-modal
+      destroyOnClose
+      :width="360"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="form">
+        <a-form-item>
+          <a-input
+            placeholder="项目名称（必填）"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入项目名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-select
-                            placeholder='项目模板'
-                            v-decorator="[
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-select
+            placeholder="项目模板"
+            v-decorator="[
                                             'templateCode',
                                             ]"
-                    >
-                        <a-select-option :key="0">
-                            空白项目
-                        </a-select-option>
-                        <a-select-option :key="template.code" v-for="template in templateList">
-                            {{template.name}}
-                        </a-select-option>
-                    </a-select>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='项目简介'
-                                :rows="2"
-                                v-decorator="['description']"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">完成并创建
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                class="project-config-modal"
-                :width="800"
-                v-model="projectModal.modalStatus"
-                :title="projectModal.modalTitle"
-                :footer="null"
-        >
-            <project-config :code="currentProjectCode" @update="updateProject"></project-config>
-        </a-modal>
-        <invite-project-member v-model="showInviteMember" :project-code="currentProjectCode"
-                               v-if="showInviteMember"></invite-project-member>
-    </div>
+          >
+            <a-select-option :key="0">空白项目</a-select-option>
+            <a-select-option :key="template.code" v-for="template in templateList">{{template.name}}</a-select-option>
+          </a-select>
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="项目简介" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >完成并创建</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      class="project-config-modal"
+      :width="800"
+      v-model="projectModal.modalStatus"
+      :title="projectModal.modalTitle"
+      :footer="null"
+    >
+      <project-config :code="currentProjectCode" @update="updateProject"></project-config>
+    </a-modal>
+    <invite-project-member
+      v-model="showInviteMember"
+      :project-code="currentProjectCode"
+      v-if="showInviteMember"
+    ></invite-project-member>
+  </div>
 </template>
 <script>
-    import inviteProjectMember from '../../../components/project/inviteProjectMember'
-    import projectConfig from '@/components/project/projectConfig'
-    import {list, doData, recycle} from '@/api/project';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {collect} from "../../../api/projectCollect";
-    import {list as projectTemplates} from "../../../api/projectTemplate";
-    import {recovery, recoveryArchive} from "../../../api/project";
+import inviteProjectMember from "../../../components/project/inviteProjectMember";
+import projectConfig from "@/components/project/projectConfig";
+import { list, doData, recycle } from "@/api/project";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { collect } from "../../../api/projectCollect";
+import { list as projectTemplates } from "../../../api/projectTemplate";
+import { recovery, recoveryArchive } from "../../../api/project";
 
-    export default {
-        components: {
-            inviteProjectMember,
-            projectConfig
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                selectBy: this.$route.params.type || 'my',
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                currentProject: {},
-                currentProjectCode: 0,
-                currentProjectIndex: 0,
-                newData: {
-                    code: ''
-                },
-                form: this.$form.createForm(this),
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑项目',
-                },
-                /*项目设置*/
-                projectModal: {
-                    modalStatus: false,
-                    modalTitle: '项目设置',
-                },
-                templateList: [],
-            }
-        },
-        watch: {
-            $route: function () {
-                this.selectBy =  this.$route.params.type || 'my'
-                this.init();
-            },
-        },
-        created() {
-            this.init();
-            this.projectTemplates();
-        },
-        methods: {
-            moment,
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 100;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.selectBy = this.selectBy;
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            projectTemplates() {
-                projectTemplates({pageSize: 100, viewType: -1}).then(res => {
-                    this.templateList = res.data.list;
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            inviteProjectMember(item) {
-                this.currentProject = item;
-                this.currentProjectCode = item.code;
-                this.showInviteMember = true;
-            },
-            doAction(record, action, index) {
-                this.currentProject = record;
-                this.currentProjectIndex = index;
-                let app = this;
-                app.newData = {id: 0};
-                if (action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '创建项目';
-                } else if (action == 'edit') {
-                    app.currentProjectCode = record.code;
-                    app.projectModal.modalStatus = true;
-                } else if (action == 'del') {
-                    this.$confirm({
-                        title: '确定放入回收站？',
-                        content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
-                        okText: '放入回收站',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            recycle(record.code).then(() => {
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else if (action == 'collect') {
-                    const type = record.collected ? 'cancel' : 'collect';
-                    collect(record.code, type).then(() => {
-                        app.$set(app.dataSource[index], 'collected', !record.collected);
-                        if (this.requestData.type == 'collect') {
-                            app.dataSource.splice(index, 1);
-                        }
-                    });
-                } else if (action == 'recoveryArchive') {
-                    this.$confirm({
-                        title: '取消归档项目？',
-                        content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '取消归档',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recoveryArchive(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else if (action == 'recovery') {
-                    this.$confirm({
-                        title: '确定恢复项目？',
-                        content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '恢复项目',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recovery(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            updateProject(data) {
-                this.dataSource[this.currentProjectIndex] = JSON.parse(JSON.stringify(data));
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                if (app.newData.code) {
-                    //编辑
-                    obj.projectCode = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.form.resetFields();
-                    app.newData = {id: 0};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
+export default {
+  components: {
+    inviteProjectMember,
+    projectConfig,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      selectBy: this.$route.params.type || "my",
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      currentProject: {},
+      currentProjectCode: 0,
+      currentProjectIndex: 0,
+      newData: {
+        code: "",
+      },
+      form: this.$form.createForm(this),
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑项目",
+      },
+      /*项目设置*/
+      projectModal: {
+        modalStatus: false,
+        modalTitle: "项目设置",
+      },
+      templateList: [],
+    };
+  },
+  watch: {
+    $route: function () {
+      this.selectBy = this.$route.params.type || "my";
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+    this.projectTemplates();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 100;
+        this.showLoadingMore = false;
+      }
+      this.requestData.selectBy = this.selectBy;
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    projectTemplates() {
+      projectTemplates({ pageSize: 100, viewType: -1 }).then((res) => {
+        this.templateList = res.data.list;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    inviteProjectMember(item) {
+      this.currentProject = item;
+      this.currentProjectCode = item.code;
+      this.showInviteMember = true;
+    },
+    doAction(record, action, index) {
+      this.currentProject = record;
+      this.currentProjectIndex = index;
+      let app = this;
+      app.newData = { id: 0 };
+      if (action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "创建项目";
+      } else if (action == "edit") {
+        app.currentProjectCode = record.code;
+        app.projectModal.modalStatus = true;
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定放入回收站？",
+          content: `一旦将项目「${this.currentProject.name}」放入回收站，所有与项目有关的信息将会被放入回收站`,
+          okText: "放入回收站",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            recycle(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "collect") {
+        const type = record.collected ? "cancel" : "collect";
+        collect(record.code, type).then(() => {
+          app.$set(app.dataSource[index], "collected", !record.collected);
+          if (this.requestData.type == "collect") {
+            app.dataSource.splice(index, 1);
+          }
+        });
+      } else if (action == "recoveryArchive") {
+        this.$confirm({
+          title: "取消归档项目？",
+          content: `取消归档「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "取消归档",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recoveryArchive(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "recovery") {
+        this.$confirm({
+          title: "确定恢复项目？",
+          content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "恢复项目",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recovery(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    updateProject(data) {
+      this.dataSource[this.currentProjectIndex] = JSON.parse(
+        JSON.stringify(data)
+      );
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      if (app.newData.code) {
+        //编辑
+        obj.projectCode = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
 
-                });
-            },
-            handleSearchSubmit() {
-                let app = this;
-                app.searchForm.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.search();
-                        }
-                    })
-            },
-            search() {
-                let obj = this.searchForm.getFieldsValue();
-                Object.assign(this.requestData, obj);
-                this.init();
-            },
-            selectChange() {
-                this.init();
-            }
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
+        }
+        app.form.resetFields();
+        app.newData = { id: 0 };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+    handleSearchSubmit() {
+      let app = this;
+      app.searchForm.validateFields((err) => {
+        if (!err) {
+          app.search();
         }
-    }
+      });
+    },
+    search() {
+      let obj = this.searchForm.getFieldsValue();
+      Object.assign(this.requestData, obj);
+      this.init();
+    },
+    selectChange() {
+      this.init();
+    },
+  },
+};
 </script>
-<style lang="less">
-    @import "~ant-design-vue/lib/style/themes/default";
 
-    .project-list-index {
-        .project-list {
-            .ant-list-item-meta-avatar {
-                .ant-avatar {
-                    width: 50px;
-                    height: 50px;
-                    border-radius: 3px;
-                }
-            }
+<style lang="less" scoped>
+@import "~ant-design-vue/lib/style/themes/default";
 
-            .ant-list-item-content {
-                display: -webkit-box;
-                display: -ms-flexbox;
-                display: flex;
-                -webkit-box-flex: 1;
-                -ms-flex: 1;
-                flex: 1;
-                -webkit-box-pack: end;
-                -ms-flex-pack: end;
-                justify-content: flex-end;
-
-                .other-info {
-                    display: flex;
-
-                    .info-item {
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 48px;
-                    }
-
-                    .schedule {
-                        width: 250px;
-                    }
-                }
-            }
-
-            .ant-list-item-action {
-                .anticon:hover {
-                    svg {
-                        color: @primary-color;
-                    }
-                }
-            }
-        }
-    }
+.wrapper-main {
+  padding: 0;
+}
 </style>
diff --git a/src/views/project/recycle/index.vue b/src/views/project/recycle/index.vue
index 18a2906..fa65db7 100644
--- a/src/views/project/recycle/index.vue
+++ b/src/views/project/recycle/index.vue
@@ -77,8 +77,7 @@
                     this.pagination.pageSize = 100;
                     this.showLoadingMore = false;
                 }
-                this.requestData.recycle = 1;
-                this.requestData.type = 'other';
+                this.requestData.selectBy = 'deleted';
                 app.loading = true;
                 list(app.requestData).then(res => {
                     app.dataSource = app.dataSource.concat(res.data.list);
-- 
Gitee


From 4fba2acaceedae65a13c82ec9f7dc54c48a758b1 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Mon, 31 Aug 2020 16:15:59 +0800
Subject: [PATCH 3/8] =?UTF-8?q?=E4=BB=BB=E5=8A=A1=E8=AF=A6=E6=83=85?=
 =?UTF-8?q?=E7=A7=BB=E5=8A=A8=E7=AB=AF=E5=85=BC=E5=AE=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 babel.config.code-workspace                   |    7 +
 package.json                                  |    2 +-
 src/assets/css/components/base.less           |  229 +-
 src/assets/css/components/index.less          |    2 +
 src/assets/css/components/layout.less         |    5 +
 src/assets/css/components/list.less           |    2 +-
 src/assets/css/components/media.less          |  109 +
 src/assets/css/components/task.less           |  464 ++-
 src/assets/css/components/warpperContent.less |    6 +
 src/components/chart/RankList.vue             |    4 +-
 src/components/layout/account/setting.vue     |  112 +-
 src/components/project/projectSelect.vue      |  307 +-
 src/components/project/versionDetail.vue      | 2615 ++++++++--------
 src/views/account/setting/base.vue            |  329 +-
 src/views/account/setting/security.vue        |  939 +++---
 src/views/project/analysis/index.vue          |  754 ++---
 src/views/project/space/features.vue          | 1390 ++++-----
 src/views/project/space/files.vue             |  826 +++--
 src/views/project/space/overview.vue          | 1359 ++++----
 src/views/project/space/task.vue              | 2765 +++++++++--------
 src/views/project/space/taskdetail.vue        |  118 +-
 21 files changed, 6398 insertions(+), 5946 deletions(-)
 create mode 100644 babel.config.code-workspace
 create mode 100644 src/assets/css/components/media.less

diff --git a/babel.config.code-workspace b/babel.config.code-workspace
new file mode 100644
index 0000000..ef9f5d2
--- /dev/null
+++ b/babel.config.code-workspace
@@ -0,0 +1,7 @@
+{
+    "folders": [
+        {
+            "path": "."
+        }
+    ]
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 83f7020..2ec4b81 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pear-project",
-  "version": "2.0.0",
+  "version": "2.8.1",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
diff --git a/src/assets/css/components/base.less b/src/assets/css/components/base.less
index 2b76236..04b3245 100644
--- a/src/assets/css/components/base.less
+++ b/src/assets/css/components/base.less
@@ -128,6 +128,10 @@ body {
 
 //Form
 .ant-form-horizontal {
+  .ant-form-item {
+    margin-bottom: 1rem;
+  }
+
   .ant-form-item-with-help {
     margin-bottom: 12px;
   }
@@ -191,7 +195,10 @@ body {
 }
 
 .field-right-menu {
-  width: 240px;
+  max-width: 90%;
+  min-width: 10rem;
+  border-radius: 1rem;
+  margin-top: 0.5rem;
 
   .ant-dropdown-menu-item {
     min-height: 36px;
@@ -216,6 +223,14 @@ body {
       justify-content: space-between;
       align-items: center;
     }
+
+    >.menu-item-content>:nth-child(n+2) {
+      //visibility: hidden;
+    }
+
+    &:hover>.menu-item-content>:nth-child(n+2) {
+      //visibility: visible;
+    }
   }
 }
 
@@ -238,7 +253,22 @@ body {
 
 //Modal
 .ant-modal {
-  top: 50px;
+  max-width: 95%;
+  top: 66px;
+
+  &-body {
+    padding-bottom: 1rem;
+
+  }
+
+  .ant-modal-content {
+    border-radius: 1rem;
+  }
+
+  .ant-modal-header {
+    border-radius: 1rem 1rem 0 0;
+    user-select: none;
+  }
 }
 
 //Badge
@@ -317,111 +347,134 @@ body {
   display: none;
 }
 
+
 .project-navigation {
   border-bottom: 1px solid #D9D9D9;
   z-index: 1;
+  line-height: 2;
   background-color: #F5F5F5;
   transition: right 218ms ease;
-  position: fixed;
-  width: 100%;
-}
-
-.project-navigation .ivu-breadcrumb-item-separator {
-  color: #383838;
-}
+  /* position: fixed;*/
 
-.project-navigation .ivu-breadcrumb>span:last-child {
-  font-weight: normal;
-}
+  user-select: none;
 
-.project-navigation .project-nav-header {
-  position: absolute;
-  z-index: 2;
-  left: 0;
-  height: 50px;
-  margin: 0;
-  padding: 15px;
+  .ivu-breadcrumb-item-separator {
+    color: #383838;
+  }
 
-  .nav-title {
-    font-size: 15px;
-    margin-right: 12px;
+  .ivu-breadcrumb>span:last-child {
+    font-weight: normal;
   }
 
-  .actions {
-    cursor: pointer;
-    margin-right: 12px;
+  .project-nav-header,
+  .project-nav-footer {
+    z-index: 2;
+    margin: 0;
+    padding: 0.5rem 1rem;
+    line-height: 2;
+
+    .ant-breadcrumb {
+      line-height: 1.8;
+
+    }
+
+    .nav-title {
+      font-size: 15px;
+      margin-right: 12px;
+    }
+
+    .actions {
+      cursor: pointer;
+      margin-right: 12px;
+    }
   }
-}
 
-.project-navigation .nav-underscore {
-  position: relative;
-  height: 50px;
-  border: none;
-  margin-bottom: 0;
-}
+  .project-nav-footer {
+    text-align: right;
 
-.project-navigation .nav-body {
-  position: relative;
-  white-space: nowrap;
-  z-index: 1;
-  display: -webkit-flex;
-  display: -ms-flexbox;
-  display: flex;
-  -webkit-justify-content: center;
-  -ms-flex-pack: center;
-  justify-content: center;
-}
+    .footer-item {
+      font-size: 14px;
+      position: relative;
+      padding: 0 10px;
+      margin: 0 5px;
+      text-align: center;
 
-.project-navigation .nav-body .nav-wrapper.nav>li {
-  z-index: 2;
-  padding: 0 20px;
-}
+      &.active {
+        color: #2D8cF0;
+      }
 
-.project-navigation .nav-underscore>li {
-  list-style: none;
-  float: left;
-}
+      &:hover {
+        color: #2D8cF0;
+      }
 
-.project-navigation .nav-underscore>li a {
-  display: inline-block;
-  position: relative;
-  height: 50px;
-  margin: 0;
-  padding: 15px 0;
-  color: #383838;
-  font-size: 15px;
-  font-weight: normal;
-}
+      &:nth-last-child(n+2):after {
+        position: absolute;
+        content: '';
+        right: -5px;
+        top: 1px;
+        bottom: 1px;
+        width: 1px;
+        background-color: #d6d6d6;
+      }
+    }
+  }
 
-.project-navigation .nav-body .nav-wrapper.nav>li .app[data-app=tasks] {
-  position: relative;
-  float: left;
-  max-width: 200px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
+  .nav-body {
+    position: relative;
+    white-space: nowrap;
+    z-index: 1;
+    display: flex;
+    justify-content: stretch;
+
+    .nav-underscore {
+      position: relative;
+      border: none;
+      margin-bottom: 0;
+      margin-left: auto;
+      margin-right: auto;
+      padding: 0;
+      display: inline-flex;
+
+      >li {
+        z-index: 2;
+        padding: 0.5rem 1rem;
+        list-style: none;
+        position: relative;
+        margin: 0;
+        color: #383838;
+        font-size: 15px;
+        font-weight: normal;
+        cursor: pointer;
+
+        &:hover {
+          background-color: inherit;
+
+          &::after {
+            border-width: 3px;
+            opacity: 1;
+          }
+        }
 
-.project-navigation .nav-underscore>li>a:hover {
-  background-color: inherit;
-}
+        &:after {
+          position: absolute;
+          left: 0.6rem;
+          right: 0.6rem;
+          bottom: 0;
+          height: 3px;
+          border-bottom: 0 solid #3da8f5;
+          content: '';
+          opacity: 0;
+        }
+      }
 
-.project-navigation .nav-underscore>li>a:after {
-  position: absolute;
-  left: 0;
-  bottom: 0;
-  height: 3px;
-  width: 100%;
-  border-bottom: 0 solid #3da8f5;
-  content: '';
-  opacity: 0;
+      >.actives:after {
+        border-width: 3px;
+        opacity: 1;
+      }
+    }
+  }
 }
 
-.project-navigation .nav-underscore>li>a:hover:after,
-.project-navigation .nav-underscore>.actives>a:after {
-  border-width: 3px;
-  opacity: 1;
-}
 
 .simple {
   .project-navigation {
@@ -431,10 +484,10 @@ body {
 
 
 .ant-tabs-bar {
-  margin: 1rem 1rem 0.5rem;
+  margin: 1rem auto 0.5rem;
 }
 
-.ant-table-thead{
+.ant-table-thead {
   white-space: nowrap;
   word-break: keep-all;
 }
\ No newline at end of file
diff --git a/src/assets/css/components/index.less b/src/assets/css/components/index.less
index a4585c6..40567b1 100644
--- a/src/assets/css/components/index.less
+++ b/src/assets/css/components/index.less
@@ -4,3 +4,5 @@
 @import "list";
 @import "labels";
 @import "warpperContent";
+@import "task";
+@import "media";
diff --git a/src/assets/css/components/layout.less b/src/assets/css/components/layout.less
index 69cce27..7ca7913 100644
--- a/src/assets/css/components/layout.less
+++ b/src/assets/css/components/layout.less
@@ -269,6 +269,11 @@
 
     .ant-layout-sider {
       box-shadow: 2px 0 6px rgba(0, 21, 41, .35);
+
+      .ant-layout-sider-zero-width-trigger {
+        color: #fff;
+        background: #002140;
+      }
     }
 
     .right-menu {
diff --git a/src/assets/css/components/list.less b/src/assets/css/components/list.less
index bf25d48..ca068d7 100644
--- a/src/assets/css/components/list.less
+++ b/src/assets/css/components/list.less
@@ -3,7 +3,7 @@
     .ant-avatar {
       width: 50px;
       height: 50px;
-      border-radius: 3px;
+      border-radius: 1rem;
     }
   }
 
diff --git a/src/assets/css/components/media.less b/src/assets/css/components/media.less
new file mode 100644
index 0000000..4d517f3
--- /dev/null
+++ b/src/assets/css/components/media.less
@@ -0,0 +1,109 @@
+.account-setting-base,
+.account-setting-security {
+  .wrapper-main {
+    padding-left: 0;
+    padding-right: 0;
+  }
+
+  .setting-content {
+    display: flex;
+    flex-direction: row;
+
+    .right {
+      flex: 1 1 0;
+      padding: 8px 40px;
+
+      .setting-info-title {
+        font-size: 20px;
+      }
+
+      .setting-info {
+        display: flex;
+        flex-direction: row;
+        padding-top: 12px;
+
+        &-content {
+          flex: 1;
+        }
+
+        &-avatar {
+          padding-left: 2rem;
+          display: flex;
+          flex-direction: column;
+
+          .avatar {
+            margin-top: 12px;
+            margin-left: auto;
+            margin-right: auto;
+          }
+
+          .avatar-uploader {
+            margin: 1.6rem auto;
+            text-align: center;
+          }
+        }
+      }
+    }
+  }
+}
+
+.account-setting-security {
+  .setting-content {
+    .right {
+      .setting-info {
+        &-content {
+          width: 100%;
+        }
+      }
+    }
+  }
+}
+
+.mobile-modal {
+  .getCaptcha {
+    display: block;
+    width: 100%;
+    height: 40px;
+  }
+}
+
+.wap-menu {
+  display: none;
+  visibility: hidden;
+}
+
+@media (max-width: 768px) {
+  .pc-view {
+    display: none;
+    visibility: hidden;
+  }
+
+  .wap-menu {
+    display: block;
+    visibility: visible;
+  }
+
+  .account-setting .left {
+    width: auto !important;
+    border-right: 0px solid #e8e8e8 !important;
+  }
+
+  .account-setting-base,
+  .account-setting-security {
+    .setting-content {
+      flex-direction: column;
+
+      .right {
+        padding: 1rem;
+
+        .setting-info {
+          flex-direction: column;
+
+          &-avatar {
+            padding-left: 0;
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/task.less b/src/assets/css/components/task.less
index 1b2f4cd..d3eeee6 100644
--- a/src/assets/css/components/task.less
+++ b/src/assets/css/components/task.less
@@ -1,25 +1,34 @@
 .project-space-task {
-}
-
-.project-space-task .wrapper-main {
-  margin: 0;
-  padding: 0;
-  background: inherit;
-}
-
-.project-space-task .wrapper-content {
-  background: #f5f5f5;
-  position: fixed;
   height: 100%;
-  padding: 0 0 63px;
-}
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 
-.project-space-task .layout-content {
-  padding: 60px 10px 0 0;
-  height: 100%;
-  margin-left: 0;
-  margin-right: 0;
-  background: #fff;
+  .tasks-loading {
+    .ant-spin-blur {
+      opacity: 0;
+    }
+  }
+
+  .wrapper-main {
+    margin: 0;
+    padding: 0;
+    background: inherit;
+
+    .wrapper-content {
+      background: #f5f5f5;
+      position: relative;
+      height: 100%;
+      overflow: auto;
+      width: 100%;
+
+      .layout-content {
+        height: 100%;
+        margin-left: 0;
+        margin-right: 0;
+      }
+    }
+  }
 }
 
 .project-space-task .manage-contents {
@@ -79,7 +88,8 @@
   }
 }
 
-.scrum-stage .scrum-stage-header, .scrum-stage .sort-header-placeholder {
+.scrum-stage .scrum-stage-header,
+.scrum-stage .sort-header-placeholder {
   -webkit-flex: 0 0 auto;
   -ms-flex: 0 0 auto;
   flex: 0 0 auto;
@@ -171,11 +181,12 @@
   padding-bottom: 40px;
 }
 
-.scrum-stage .scrum-stage-content > ul {
+.scrum-stage .scrum-stage-content>ul {
   /*margin-bottom: 8px;*/
 }
 
-.scrum-stage .scrum-stage-tasks, .scrum-stage .scrum-stage-tasks-done {
+.scrum-stage .scrum-stage-tasks,
+.scrum-stage .scrum-stage-tasks-done {
   transition: opacity 0.08s ease-out;
   opacity: 1;
   min-height: 5px;
@@ -373,7 +384,9 @@
   font-size: 0;
 }
 
-.task.task-card .task-infos .label, .task.task-card .task-infos .icon-wrapper, .task.task-card .task-infos .tag {
+.task.task-card .task-infos .label,
+.task.task-card .task-infos .icon-wrapper,
+.task.task-card .task-infos .tag {
   display: -webkit-inline-flex;
   display: -ms-inline-flexbox;
   display: inline-flex;
@@ -402,12 +415,15 @@
   padding-left: 6px;
 }
 
-.label-important, .badge-important {
+.label-important,
+.badge-important {
   color: #FFFFFF;
   background-color: #FF4F3E;
 }
 
-.task.task-card .task-infos .label > span, .task.task-card .task-infos .icon-wrapper, .task.task-card .task-infos .tag {
+.task.task-card .task-infos .label>span,
+.task.task-card .task-infos .icon-wrapper,
+.task.task-card .task-infos .tag {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -587,7 +603,8 @@
   color: rgba(0, 0, 0, 0.45);
 }
 
-.task.task-card.done .check-box, .task.task-card.done .task-content-set {
+.task.task-card.done .check-box,
+.task.task-card.done .task-content-set {
   opacity: 0.64;
   filter: alpha(opacity=64);
 }
@@ -604,6 +621,7 @@
   justify-content: center;
   transition: background 218ms;
   border-radius: 3px;
+
   &:hover {
     .check-box {
       color: grey;
@@ -762,7 +780,8 @@
   transition: opacity .15s linear;
 }
 
-input.form-control, textarea.form-control {
+input.form-control,
+textarea.form-control {
   background-color: #FFFFFF;
   border: 1px solid #D9D9D9;
   border-radius: 3px;
@@ -775,7 +794,7 @@ input.form-control, textarea.form-control {
   border-bottom: 1px solid #EEEEEE;
 }
 
-.task-creator .handler-wrap > a {
+.task-creator .handler-wrap>a {
   width: 100%;
   display: inline-block;
   //padding: 15px 0;
@@ -793,7 +812,8 @@ input.form-control, textarea.form-control {
   line-height: 24px;
 }
 
-.task-creator .handler-wrap > a > .icon, .task-creator .handler-wrap > a > .avatar {
+.task-creator .handler-wrap>a>.icon,
+.task-creator .handler-wrap>a>.avatar {
   display: inline-block;
   line-height: 24px;
   float: left;
@@ -816,14 +836,14 @@ input.form-control, textarea.form-control {
   margin: 10px 0 -5px -10px;
 }
 
-.involve-view .involve-members > li {
+.involve-view .involve-members>li {
   position: relative;
   float: left;
   margin: 0 0 10px 10px;
   cursor: pointer;
 }
 
-.involve-view .involve-members > li > .avatar {
+.involve-view .involve-members>li>.avatar {
   display: block;
   width: 24px;
   height: 24px;
@@ -836,7 +856,7 @@ input.form-control, textarea.form-control {
   background-position: center !important;
 }
 
-.involve-view .involve-members > li {
+.involve-view .involve-members>li {
   position: relative;
   float: left;
   margin: 0 0 10px 10px;
@@ -858,7 +878,7 @@ input.form-control, textarea.form-control {
   text-align: center;
 }
 
-.task-creator .handler-wrap > a {
+.task-creator .handler-wrap>a {
   width: 100%;
   display: inline-block;
   padding: 6px 0;
@@ -872,13 +892,15 @@ input.form-control, textarea.form-control {
   line-height: 24px;
 }
 
-.project-space-task .menu-toggler-title, .project-space-task .footer-item {
+.project-space-task .menu-toggler-title,
+.project-space-task .footer-item {
   color: #808080;
   text-decoration: none;
   cursor: pointer;
 }
 
-.task-creator .tags-wrap, .task-creator .involve-wrap {
+.task-creator .tags-wrap,
+.task-creator .involve-wrap {
   border-bottom: 1px solid #EEEEEE;
 }
 
@@ -950,7 +972,8 @@ input.form-control, textarea.form-control {
   flex: 1 0 auto;
 }
 
-.activities-timeline > div, .activities-timeline > ul {
+.activities-timeline>div,
+.activities-timeline>ul {
   margin-right: -1px;
   margin-left: -1px;
   overflow: hidden;
@@ -990,7 +1013,7 @@ input.form-control, textarea.form-control {
   color: #383838;
 }
 
-.readable > *:last-child {
+.readable>*:last-child {
   margin-bottom: 0;
 }
 
@@ -1007,7 +1030,7 @@ input.form-control, textarea.form-control {
   border-left: 5px solid #EEEEEE;
 }
 
-.activity .activity-content > blockquote {
+.activity .activity-content>blockquote {
   margin: 5px 0 0 0;
   padding: 0 0 0 10px;
 }
@@ -1037,7 +1060,9 @@ li.activity.creator i {
   margin-top: 0;
 }
 
-.activities-timeline.early-hidden .activity-early-wrap, .activities-timeline.early-shown .activity-early-wrap, .activities-timeline.early-loading .activity-early-wrap {
+.activities-timeline.early-hidden .activity-early-wrap,
+.activities-timeline.early-shown .activity-early-wrap,
+.activities-timeline.early-loading .activity-early-wrap {
   display: block;
 }
 
@@ -1060,12 +1085,14 @@ li.activity.creator i {
   transition: color 218ms ease;
 }
 
-.task.task-card.ui-sortable-handle.dragging, .scrum-stage-tasks-done .task.task-card.ui-sortable-handle.dragging {
+.task.task-card.ui-sortable-handle.dragging,
+.scrum-stage-tasks-done .task.task-card.ui-sortable-handle.dragging {
   cursor: move;
 }
 
 /*紧急程度一般*/
-.task.task-card.ui-sortable-handle:hover, .scrum-stage-tasks-done .task.task-card.ui-sortable-handle:hover {
+.task.task-card.ui-sortable-handle:hover,
+.scrum-stage-tasks-done .task.task-card.ui-sortable-handle:hover {
   border-left: 3px solid #a6a6a6;
 }
 
@@ -1121,44 +1148,6 @@ li.activity.creator i {
   clear: both;
 }
 
-.project-nav-footer {
-  position: absolute;
-  right: 0;
-  top: 0;
-  display: flex;
-  height: 50px;
-  align-items: center;
-  z-index: 998;
-}
-
-.project-nav-footer .footer-item {
-  font-size: 14px;
-  position: relative;
-  padding: 15px 10px;
-  margin: 0 5px;
-  float: right;
-  display: inline-block;
-  text-align: center;
-}
-
-.project-nav-footer .footer-item.active {
-  color: #2D8cF0;
-}
-
-.project-nav-footer .footer-item:hover {
-  color: #2D8cF0;
-}
-
-.project-nav-footer :not(:first-child):after {
-  position: absolute;
-  content: '';
-  right: -5px;
-  top: 16px;
-  bottom: 16px;
-  width: 1px;
-  background-color: #A6A6A6;
-}
-
 
 .menu-modal .ivu-modal-mask {
   overflow: hidden;
@@ -1211,20 +1200,20 @@ li.activity.creator i {
   background-color: rgba(0, 0, 0, 0.06);
 }
 
-.project-menus .list > li {
+.project-menus .list>li {
   position: relative;
   line-height: 30px;
 }
 
-.project-menus .list > li:first-child > a {
+.project-menus .list>li:first-child>a {
   margin-top: 5px;
 }
 
-.project-menus .list > li:first-child > a {
+.project-menus .list>li:first-child>a {
   margin-top: 5px;
 }
 
-.project-menus .list > li > a {
+.project-menus .list>li>a {
   display: flex;
   align-items: center;
   cursor: pointer;
@@ -1236,19 +1225,19 @@ li.activity.creator i {
   white-space: nowrap;
 }
 
-.project-menus .list > li > a {
+.project-menus .list>li>a {
   color: #808080;
   font-size: 16px;
   width: 35px;
   text-align: center;
 }
 
-.project-menus .activities-panel-menu-list > li > a {
+.project-menus .activities-panel-menu-list>li>a {
   color: #383838;
   font-weight: 600;
 }
 
-.project-menus .activities-panel-menu-list > li:hover a {
+.project-menus .activities-panel-menu-list>li:hover a {
   background-color: #EEEEEE;
 }
 
@@ -1316,7 +1305,7 @@ li.activity.creator i {
   padding-bottom: 10px;
 }
 
-.activity-card-datas .data-statistics > div {
+.activity-card-datas .data-statistics>div {
   display: inline-block;
   vertical-align: middle;
   cursor: pointer;
@@ -1329,7 +1318,7 @@ li.activity.creator i {
   font-size: 14px;
 }
 
-.activity-card-datas .data-statistics > div:hover {
+.activity-card-datas .data-statistics>div:hover {
   background-color: #EEEEEE;
 }
 
@@ -1497,7 +1486,7 @@ li.activity.creator i {
   height: 36px;
 }
 
-.user-menu-modal .project-menus .list > li {
+.user-menu-modal .project-menus .list>li {
   line-height: 10px;
 }
 
@@ -1537,7 +1526,8 @@ li.activity.creator i {
     .layout-content {
       background: inherit;
 
-      .scrum-stage .scrum-stage-header, .scrum-stage .sort-header-placeholder {
+      .scrum-stage .scrum-stage-header,
+      .scrum-stage .sort-header-placeholder {
         padding: 14px 14px;
         font-size: 14px;
       }
@@ -1545,6 +1535,7 @@ li.activity.creator i {
       .scrum-stage-wrap.ui-sortable {
         padding-bottom: 40px;
       }
+
       .scrum-stage-wrap.ui-sortable.hidden-creator-bottom {
         padding-bottom: 80px;
       }
@@ -1605,3 +1596,296 @@ li.activity.creator i {
     }
   }
 }
+
+.project-space-files,
+.project-space-features,
+.project-space-overview {
+  .wrapper-main {
+    background: initial;
+    margin: 1rem;
+  }
+
+  .features-list-dropdown {
+    cursor: pointer;
+  }
+
+  .layout-content {
+    .content-item {
+      background: #fff;
+      padding: 6px 18px 18px 18px;
+      border-radius: 1.3rem;
+      width: 100%;
+
+      .title {
+        font-size: 16px;
+        padding: 6px 0 0 0;
+      }
+
+      &.files-list,
+      &.log-list {
+        background: #fff;
+        margin-bottom: 15px;
+
+        .list-content {
+          padding-top: 12px;
+          position: relative;
+
+          li.list-item-title,
+          li.list-item-title .ant-list-item-action * {
+            cursor: default;
+          }
+
+          li:not(.list-item-title) .ant-list-item-action {
+            visibility: hidden;
+          }
+
+          li:not(.list-item-title):hover .ant-list-item-action {
+            visibility: visible;
+          }
+        }
+      }
+
+      .version-group {
+        margin-top: 0.5rem;
+        margin-bottom: 0.5rem;
+
+        .version-group-title {
+          margin-top: 1rem;
+          margin-bottom: 1rem;
+          user-select: none;
+        }
+
+        .version-content {
+          margin-bottom: 1rem;
+
+          .ant-card {
+            min-height: 102px;
+            border-radius: 1rem;
+            user-select: none;
+            /*display: inline-block;*/
+
+            .ant-card-head {
+              padding: 0 16px;
+              border-bottom: none;
+
+              .ant-card-head-title {
+                padding: 12px 0;
+                display: flex;
+                justify-content: space-between;
+                font-size: 14px;
+
+                .version-status {
+                  display: flex;
+                  align-items: center;
+                  justify-content: center;
+                  min-width: 3rem;
+                  border-radius: 4px;
+                  background: #f5f5f5;
+                  padding: 4px 8px;
+
+                  &.status-0 {
+                    color: #a6a6a6;
+                  }
+
+                  &.status-1 {
+                    color: #1890ff;
+                    background: #e6f7ff;
+                    border-color: #91d5ff;
+                  }
+
+                  &.status-2 {
+                    color: #f5222d;
+                    background: #fff1f0;
+                    border-color: #ffa39e;
+                  }
+
+                  &.status-3 {
+                    color: #52c41a;
+                    background: #f6ffed;
+                    border-color: #b7eb8f;
+                  }
+                }
+              }
+            }
+
+            .ant-card-body {
+              height: 100%;
+              padding: 0 1rem 0.5rem;
+
+              .publish-time {
+                font-size: 0.8rem;
+              }
+            }
+          }
+
+          .version-create {
+            .ant-card-body {
+              padding: 1.5rem;
+              line-height: 1.75;
+            }
+
+            a {
+              height: 100%;
+              display: flex;
+              justify-content: center;
+              align-items: center;
+              text-align: center;
+            }
+          }
+
+          &.published {
+            .ant-card {
+              height: auto;
+              min-height: auto;
+            }
+          }
+        }
+      }
+
+      &.files-list {
+        .header {
+          display: flex;
+          justify-content: space-between;
+
+          .header-actions {
+            justify-self: flex-end;
+            padding-top: 0.2rem;
+          }
+        }
+
+        .list-content {
+          .list-item {
+            border-bottom: none;
+            transition: background-color 218ms;
+            border-radius: 1rem;
+            padding: 0.5rem;
+            overflow: hidden;
+            margin: 0.5rem 0;
+            white-space: nowrap;
+
+            &:hover {
+              background-color: #f5f5f5;
+            }
+          }
+
+          .ant-list-item-meta {
+            flex: 6;
+            position: relative;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            word-break: keep-all;
+          }
+
+          .ant-list-item-action {
+            flex: 2;
+            text-align: right;
+            margin-left: 1.5rem;
+          }
+
+          .other-info {
+            display: flex;
+            white-space: nowrap;
+            flex: 3;
+            justify-content: space-between;
+
+            .info-item {
+              text-align: center;
+              flex: 1;
+              padding: 0 1rem;
+
+              &:nth-child(1) {
+                text-align: left;
+              }
+
+              &:nth-last-child(1) {
+                text-align: right;
+              }
+            }
+          }
+        }
+      }
+    }
+
+    .project-date {
+      .ant-calendar-picker {
+        border: none;
+
+        &:focus {
+          border: none;
+        }
+      }
+
+      .ant-calendar-picker-input {
+        border: none;
+      }
+    }
+
+    .project-stats {
+      .stats-content {
+        .stats-item {
+          .stats-number {
+            /*font-weight: bold;*/
+            font-size: 2rem;
+            text-overflow: ellipsis;
+            word-break: keep-all;
+            white-space: nowrap;
+            overflow: hidden;
+          }
+        }
+      }
+    }
+  }
+}
+
+@media(max-width: 768px) {
+  .project-space-files .layout-content {
+    .content-item {
+      &.files-list {
+        .list-content {
+          .list-item {
+            flex-direction: column;
+            align-items: stretch;
+            position: relative;
+
+            &::after {
+              content: "";
+              height: 1px;
+              position: absolute;
+              bottom: 0;
+              left: 0;
+              right: 0;
+              background: #f6f6f6;
+            }
+          }
+
+          .ant-list-item-meta {
+            flex: 1 !important;
+            white-space: pre-wrap;
+          }
+
+          .ant-list-item-action {
+            flex: 1 !important;
+          }
+
+          .other-info {
+            display: flex;
+            white-space: nowrap;
+            flex: 1 !important;
+            justify-content: space-between;
+
+            .info-item {
+              padding: 0;
+              font-size: 0.8rem;
+
+              &:nth-child(n+2) {
+                padding-left: 0.5rem;
+              }
+            }
+          }
+        }
+      }
+
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/assets/css/components/warpperContent.less b/src/assets/css/components/warpperContent.less
index 821f75f..e94c9cf 100644
--- a/src/assets/css/components/warpperContent.less
+++ b/src/assets/css/components/warpperContent.less
@@ -92,6 +92,7 @@
   margin: 2rem;
   padding: 1rem;
   background: rgb(255, 255, 255);
+  height: 100%;
 }
 
 .wrapper-content {
@@ -150,4 +151,9 @@
   text-align: center;
   padding: 10px 0 20px;
   color: #9ea7b4;
+}
+
+.ant-spin-nested-loading,
+.ant-spin-container {
+  height: 100%;
 }
\ No newline at end of file
diff --git a/src/components/chart/RankList.vue b/src/components/chart/RankList.vue
index e62adb6..7a957e1 100644
--- a/src/components/chart/RankList.vue
+++ b/src/components/chart/RankList.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="rank">
-    <h4 class="title">{{ title }}</h4>
+    <h4 class="title" v-if="title">{{ title }}</h4>
     <ul class="list">
       <li :key="index" v-for="(item, index) in list">
         <span :class="index < 3 ? 'active' : null">{{ index + 1 }}</span>
@@ -31,7 +31,7 @@
 <style lang="less" scoped>
 
   .rank {
-    padding: 0 32px 32px 72px;
+    padding: 0 1rem 1rem;
 
     .list {
       margin: 25px 0 0;
diff --git a/src/components/layout/account/setting.vue b/src/components/layout/account/setting.vue
index 30a8bfb..86bfcdf 100644
--- a/src/components/layout/account/setting.vue
+++ b/src/components/layout/account/setting.vue
@@ -1,66 +1,80 @@
 <template>
-    <div class="account-setting">
-        <div class="layout-item left">
-            <div class="left-content">
-                <div class="search-type">
-                    <a-menu mode="inline" :selectedKeys="keys" @click="menuClick">
-                        <a-menu-item key="base">
-                            <span>基本设置</span>
-                        </a-menu-item>
-                        <a-menu-item key="security">
-                            <span>安全设置</span>
+  <div class="account-setting">
+    <div class="layout-item left">
+      <div class="left-content">
+        <div class="search-type">
+          <a-menu class="pc-view" mode="inline" :selectedKeys="keys" @click="menuClick">
+            <a-menu-item key="base">
+              <span>基本设置</span>
+            </a-menu-item>
+            <a-menu-item key="security">
+              <span>安全设置</span>
+            </a-menu-item>
+            <!-- <a-menu-item key="binding">
+                            <span>账号绑定</span>
                         </a-menu-item>
-                       <!-- <a-menu-item key="binding">
+                        <a-menu-item key="notification">
+                            <span>新消息通知</span>
+            </a-menu-item>-->
+          </a-menu>
+          <a-menu class="wap-menu" mode="horizontal" :selectedKeys="keys" @click="menuClick">
+            <a-menu-item key="base">
+              <span>基本设置</span>
+            </a-menu-item>
+            <a-menu-item key="security">
+              <span>安全设置</span>
+            </a-menu-item>
+            <!-- <a-menu-item key="binding">
                             <span>账号绑定</span>
                         </a-menu-item>
                         <a-menu-item key="notification">
                             <span>新消息通知</span>
-                        </a-menu-item>-->
-                    </a-menu>
-                </div>
-            </div>
+            </a-menu-item>-->
+          </a-menu>
         </div>
+      </div>
     </div>
+  </div>
 </template>
 
 <script>
-    export default {
-        name: "accountSetting",
-        props: {
-            keys: {
-                type: Array,
-                default: function () {
-                    return ['base'];
-                }
-            }
-        },
-        methods: {
-            menuClick(event) {
-                const key = event.key;
-                let url = '';
-                switch (key) {
-                    case "base":
-                        url = '/account/setting/base';
-                        break;
-                    case "security":
-                        url = '/account/setting/security';
-                }
-                this.$router.push(url);
-            },
-        }
-    }
+export default {
+  name: "accountSetting",
+  props: {
+    keys: {
+      type: Array,
+      default: function () {
+        return ["base"];
+      },
+    },
+  },
+  methods: {
+    menuClick(event) {
+      const key = event.key;
+      let url = "";
+      switch (key) {
+        case "base":
+          url = "/account/setting/base";
+          break;
+        case "security":
+          url = "/account/setting/security";
+      }
+      this.$router.push(url);
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .account-setting {
-        .left {
-            height: 100%;
-            width: 225px;
-            border-right: 1px solid #e8e8e8;
+.account-setting {
+  .left {
+    height: 100%;
+    width: 225px;
+    border-right: 1px solid #e8e8e8;
 
-            .ant-menu-root {
-                border-right: none;
-            }
-        }
+    .ant-menu-root {
+      border-right: none;
     }
+  }
+}
 </style>
diff --git a/src/components/project/projectSelect.vue b/src/components/project/projectSelect.vue
index 0e3a460..2fc57ae 100644
--- a/src/components/project/projectSelect.vue
+++ b/src/components/project/projectSelect.vue
@@ -1,159 +1,174 @@
 <template>
-    <div id="project-select" v-if="currentProject">
-        <a-dropdown :trigger="['click']"
-                    v-model="visibleMenu"
-                    class="action-item" placement="bottomCenter">
-            <a-tooltip :mouseEnterDelay="0.3" :title="currentProject.name">
-                <a class="project-select" style="color: #333" @click="visibleMenu = true">
-                    <span>{{currentProject.name}}</span>
-                    <span class="m-l-xs"><a-icon type="down"/></span>
-                </a>
-            </a-tooltip>
-            <div slot="overlay" class="middle-menu member-menu project-select-menu">
-                <div class="search-content">
-                    <a-input v-model="keyword" size="large" placeholder="搜索">
-                        <a-icon slot="prefix" type="search"/>
-                    </a-input>
-                </div>
-                <div class="member-list">
-                    <vue-scroll>
-                        <div class="list-group">
-                            <a-list
-                                    class="list-content"
-                                    itemLayout="horizontal"
-                                    :dataSource="projectList"
-                                    :locale="{emptyText: (keyword && keyword.length > 1) ? '没有找到该项目' : ''}"
-                            >
-                                <a-list-item class="member-list-item"
-                                             slot="renderItem"
-                                             slot-scope="item"
-                                             @click.native="changeProject(item.code)">
-                                 <span slot="actions">
-                                    <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
-                                 </span>
-                                    <a-list-item-meta>
-                                        <span slot="title">{{item.name}}</span>
-                                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                    </vue-scroll>
-                </div>
+  <div id="project-select" v-if="currentProject">
+    <a-dropdown
+      :trigger="['click']"
+      v-model="visibleMenu"
+      class="action-item"
+      placement="bottomCenter"
+    >
+      <a-tooltip :mouseEnterDelay="0.3" :title="currentProject.name">
+        <div class="project-select" style="color: #333">
+          <span>{{currentProject.name}}</span>
+          <span class="m-l-xs">
+            <a-icon type="down" />
+          </span>
+        </div>
+      </a-tooltip>
+      <div slot="overlay" class="middle-menu member-menu project-select-menu">
+        <div class="search-content">
+          <a-input v-model="keyword" size="default" placeholder="搜索">
+            <a-icon slot="prefix" type="search" />
+          </a-input>
+        </div>
+        <div class="member-list">
+          <vue-scroll>
+            <div class="list-group">
+              <a-list
+                class="list-content"
+                itemLayout="horizontal"
+                size="small"
+                :dataSource="projectList"
+                :locale="{emptyText: (keyword && keyword.length > 1) ? '没有找到该项目' : ''}"
+              >
+                <a-list-item
+                  class="member-list-item"
+                  slot="renderItem"
+                  slot-scope="item"
+                  @click.native="changeProject(item.code)"
+                >
+                  <span slot="actions">
+                    <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
+                  </span>
+                  <a-list-item-meta>
+                    <span slot="title">{{item.name}}</span>
+                    <a-avatar slot="avatar" icon="user" :src="item.cover" />
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
             </div>
-        </a-dropdown>
-    </div>
+          </vue-scroll>
+        </div>
+      </div>
+    </a-dropdown>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import {mapState} from 'vuex'
-    import {read as getProject, selfList as getProjectList} from "../../api/project";
-    import pagination from "../../mixins/pagination";
+import _ from "lodash";
+import { mapState } from "vuex";
+import {
+  read as getProject,
+  selfList as getProjectList,
+} from "../../api/project";
+import pagination from "../../mixins/pagination";
 
-    export default {
-        name: 'ProjectSelect',
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
-        },
-        data() {
-            return {
-                visibleMenu: false,
-                keyword: '',
-                loading: false,
-                currentProject: null,
-                projectList: [],
-                projectListCopy: [],
-                projectTotal: 0,
-            }
-        },
-        mixins: [pagination],
-        computed: {
-            ...mapState({
-                currentOrganization: state => state.currentOrganization,
-                organizationList: state => state.organizationList
-            })
-        },
-        watch: {
-            code() {
-                this.init();
-            },
-            keyword() {
-                this.search();
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                this.getProject();
-                this.getProjectList(true);
-            },
-            getProject() {
-                getProject(this.code).then((res) => {
-                    this.currentProject = res.data;
-                });
-            },
-            getProjectList(loading = true) {
-                this.loading = loading;
-                this.requestData.pageSize = 50;
-                this.requestData.archive = -1;
-                getProjectList(this.requestData).then(res => {
-                    this.projectList = res.data.list;
-                    this.projectListCopy = res.data.list;
-                    this.projectTotal = res.data.total;
-                    this.loading = false;
-                });
-            },
-            changeProject(code) {
-                this.visibleMenu = false;
-                this.$router.push('/project/space/task/' + code);
-            },
-            showCheck(code) {
-                if (code == this.code) {
-                    return true;
-                }
-            },
-            search: _.debounce(
-                function () {
-                    this.keyword = this.keyword.trim();
-                    if (!this.keyword) {
-                        this.projectList = JSON.parse(JSON.stringify(this.projectListCopy));
-                    }
-                    if (this.keyword.length <= 1) {
-                        return false;
-                    }
-                    // this.searching = true;
-                    this.projectList = this.projectList.filter(item => item.name.indexOf(this.keyword) != -1);
-                }, 500
-            ),
-            getPopup() {
-                return document.getElementById('project-select');
-            },
-        }
-    }
+export default {
+  name: "ProjectSelect",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      visibleMenu: false,
+      keyword: "",
+      loading: false,
+      currentProject: null,
+      projectList: [],
+      projectListCopy: [],
+      projectTotal: 0,
+    };
+  },
+  mixins: [pagination],
+  computed: {
+    ...mapState({
+      currentOrganization: (state) => state.currentOrganization,
+      organizationList: (state) => state.organizationList,
+    }),
+  },
+  watch: {
+    code() {
+      this.init();
+    },
+    keyword() {
+      this.search();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.getProject();
+      this.getProjectList(true);
+    },
+    getProject() {
+      getProject(this.code).then((res) => {
+        this.currentProject = res.data;
+      });
+    },
+    getProjectList(loading = true) {
+      this.loading = loading;
+      this.requestData.pageSize = 50;
+      this.requestData.archive = -1;
+      getProjectList(this.requestData).then((res) => {
+        this.projectList = res.data.list;
+        this.projectListCopy = res.data.list;
+        this.projectTotal = res.data.total;
+        this.loading = false;
+      });
+    },
+    changeProject(code) {
+      this.visibleMenu = false;
+      if (this.$route.path == "/project/space/task/" + code) {
+        this.init();
+      } else {
+        this.$router.push("/project/space/task/" + code);
+      }
+    },
+    showCheck(code) {
+      if (code == this.code) {
+        return true;
+      }
+    },
+    search: _.debounce(function () {
+      this.keyword = this.keyword.trim();
+      if (!this.keyword) {
+        this.projectList = JSON.parse(JSON.stringify(this.projectListCopy));
+      }
+      if (this.keyword.length <= 1) {
+        return false;
+      }
+      // this.searching = true;
+      this.projectList = this.projectList.filter(
+        (item) => item.name.indexOf(this.keyword) != -1
+      );
+    }, 500),
+    getPopup() {
+      return document.getElementById("project-select");
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    #project-select {
-        cursor: pointer;
+#project-select {
+  cursor: pointer;
 
-        :hover {
-            /*background: rgba(0, 0, 0, 0.025);*/
-        }
-    }
+  :hover {
+    /*background: rgba(0, 0, 0, 0.025);*/
+  }
+}
 
-    .project-select-menu {
-        margin-left: 10px;
+.project-select-menu {
+  margin-left: 10px;
 
-        .member-list {
-            height: 290px;
-        }
-    }
+  .member-list {
+    height: 290px;
+  }
+}
 </style>
diff --git a/src/components/project/versionDetail.vue b/src/components/project/versionDetail.vue
index 9858937..0ce4fbc 100644
--- a/src/components/project/versionDetail.vue
+++ b/src/components/project/versionDetail.vue
@@ -1,1362 +1,1427 @@
 <template>
-    <div class="version-detail">
-        <a-spin class="version-detail-spin" :spinning="loading">
-            <div class="task-header">
-                    <span class="head-title">
-                        <span>{{version.featureName}}</span>
-                    </span>
-                <span class="header-action text-right">
-                        <template>
-                             <a-dropdown :trigger="['click']" placement="bottomCenter" v-model="visibleTaskMenu">
-                              <a-tooltip :mouseEnterDelay="0.5">
-                                 <template slot="title">
-                                    <span>打开菜单</span>
-                                 </template>
-                                  <a class="action-item muted"><a-icon type="ellipsis"/></a>
-                              </a-tooltip>
-                                <a-menu @click="doVersion" class="field-right-menu"
-                                        slot="overlay">
-                                    <a-menu-item key="delete">
-                                           <a-icon type="delete"></a-icon>
-                                            <span>删除版本</span>
-                                    </a-menu-item>
-                                </a-menu>
+  <div class="version-detail">
+    <a-spin class="version-detail-spin" :spinning="loading">
+      <div class="task-header">
+        <span class="head-title">
+          <span>{{version.featureName}}</span>
+        </span>
+        <span class="header-action text-right">
+          <template>
+            <a-dropdown :trigger="['click']" placement="bottomCenter" v-model="visibleTaskMenu">
+              <a-tooltip :mouseEnterDelay="0.5">
+                <template slot="title">
+                  <span>打开菜单</span>
+                </template>
+                <a class="action-item muted">
+                  <a-icon type="ellipsis" />
+                </a>
+              </a-tooltip>
+              <a-menu @click="doVersion" class="field-right-menu" slot="overlay">
+                <a-menu-item key="delete">
+                  <a-icon type="delete" theme="twoTone" two-tone-color="red"></a-icon>
+                  <font color="red">删除版本</font>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>
+          </template>
+          <a-tooltip :mouseEnterDelay="0.5">
+            <template slot="title">
+              <span>关闭面板</span>
+            </template>
+            <a class="action-item muted" @click="detailClose">
+              <a-icon type="close" />
+            </a>
+          </a-tooltip>
+        </span>
+      </div>
+      <div class="task-wrap">
+        <a-row class="task-content" type="flex" align="stretch" justify="center">
+          <a-col :span="16" :xs="24" :sm="14" :md="16" :lg="16">
+            <vue-scroll :ops="scrollOps">
+              <div class="task-title" :class="{'disabled': disableEdit}">
+                <a-input
+                  ref="inputTitle"
+                  auto-focus
+                  @blur="doName"
+                  v-model="version.name"
+                  size="large"
+                  v-show="showEditName"
+                />
+                <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
+                  <template slot="title">
+                    <span>点击即可编辑</span>
+                  </template>
+                  <div class="title-text" @click="editTitle" v-show="!showEditName">{{version.name}}</div>
+                </a-tooltip>
+                <div v-else class="title-text" v-show="!showEditName">{{version.name}}</div>
+              </div>
+              <div class="task-basic-attrs-view muted">
+                <div class="field-list" :class="{'disabled': disableEdit}">
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="check-square" />
+                        <span class="field-name">状态</span>
+                      </div>
+                      <div class="field-right">
+                        <a-dropdown
+                          placement="bottomCenter"
+                          :trigger="['click']"
+                          :disabled="!!task.deleted || !!task.hasUnDone"
+                          :class="{'disabled': task.hasUnDone}"
+                        >
+                          <a-tooltip placement="top">
+                            <template slot="title">
+                              <span v-if="disableEdit" style="font-size: 12px;">版本已发布，不能编辑</span>
+                            </template>
+                            <span>
+                              <span class="version-status" :class="`status-${version.status}`">
+                                <a-icon type="schedule" />
+                                <span class="m-l-xs">{{version.statusText}}</span>
+                              </span>
+                            </span>
+                          </a-tooltip>
+                          <a-menu
+                            class="field-right-menu"
+                            slot="overlay"
+                            :selectable="false"
+                            v-show="!disableEdit"
+                            @click="changeVersionStatus"
+                          >
+                            <a-menu-item key="0">
+                              <div class="menu-item-content">
+                                <a-tag>未开始</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 0"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="1">
+                              <div class="menu-item-content">
+                                <a-tag color="blue">进行中</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 1"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="2">
+                              <div class="menu-item-content">
+                                <a-tag color="red">延期发布</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 2"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="3">
+                              <div class="menu-item-content">
+                                <a-tag color="green">已发布</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 3"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                          </a-menu>
                         </a-dropdown>
-                        </template>
-                         <a-tooltip :mouseEnterDelay="0.5">
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="calendar" />
+                        <span class="field-name">开始时间</span>
+                      </div>
+                      <div class="field-right field-date">
+                        <a-dropdown
+                          :trigger="['click']"
+                          v-model="showStartTime"
+                          :disabled="disableEdit"
+                        >
+                          <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
                             <template slot="title">
-                                <span>关闭面板</span>
+                              <span>点击设置开始时间</span>
                             </template>
-                         <a class="action-item muted" @click="detailClose"><a-icon type="close"/></a>
-                     </a-tooltip>
-                    </span>
-            </div>
-            <div class="task-wrap">
-                <div class="task-content">
-                    <div class="content-left">
-                        <vue-scroll :ops="scrollOps">
-                            <div class="task-title" :class="{'disabled': disableEdit}">
-                                <a-input ref="inputTitle" auto-focus @blur="doName" v-model="version.name" size="large"
-                                         v-show="showEditName"/>
-                                <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
-                                    <template slot="title">
-                                        <span>点击即可编辑</span>
-                                    </template>
-                                    <div class="title-text" @click="editTitle" v-show="!showEditName">
-                                        {{version.name}}
-                                    </div>
-                                </a-tooltip>
-                                <div v-else class="title-text" v-show="!showEditName">
-                                    {{version.name}}
-                                </div>
+                            <div class="field-flex">
+                              <a class="muted name" style="margin: 0">
+                                <template v-if="!version.setStartTime">设置开始时间</template>
+                                <template v-else>{{version.start_time_format}}</template>
+                              </a>
                             </div>
-                            <div class="task-basic-attrs-view muted">
-                                <div class="field-list" :class="{'disabled': disableEdit}">
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="check-square"/>
-                                                <span class="field-name">状态</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <a-dropdown
-                                                        placement="bottomCenter"
-                                                        :trigger="['click']"
-                                                        :disabled="!!task.deleted || !!task.hasUnDone"
-                                                        :class="{'disabled': task.hasUnDone}">
-                                                    <a-tooltip placement="top">
-                                                        <template slot="title">
-                                                            <span v-if="disableEdit"
-                                                                  style="font-size: 12px;">版本已发布，不能编辑</span>
-                                                        </template>
-                                                        <span>
-                                                            <span class="version-status"
-                                                                  :class="`status-${version.status}`">
-                                                                 <a-icon type="schedule"/>
-                                                                 <span class="m-l-xs">{{version.statusText}}</span>
-                                                            </span>
-                                                        </span>
-                                                    </a-tooltip>
-                                                    <a-menu class="field-right-menu" slot="overlay"
-                                                            :selectable="false"
-                                                            v-show="!disableEdit"
-                                                            @click="changeVersionStatus">
-                                                        <a-menu-item key="0">
-                                                            <div class="menu-item-content">
-                                                                <a-tag>未开始</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 0"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="1">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="blue">进行中</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 1"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="2">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="red">延期发布</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 2"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="3">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="green">已发布</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 3"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="calendar"/>
-                                                <span class="field-name">开始时间</span>
-                                            </div>
-                                            <div class="field-right field-date">
-                                                <a-dropdown :trigger="['click']" v-model="showStartTime"
-                                                            :disabled="disableEdit">
-                                                    <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
-                                                        <template slot="title">
-                                                            <span>点击设置开始时间</span>
-                                                        </template>
-                                                        <div class="field-flex">
-                                                            <a class="muted name" style="margin: 0">
-                                                                <template v-if="!version.setStartTime">设置开始时间</template>
-                                                                <template v-else>{{version.start_time_format}}
-                                                                </template>
-                                                            </a>
-                                                        </div>
-                                                    </a-tooltip>
-                                                    <div class="field-flex" v-else>
-                                                        <a class="muted name" style="margin: 0">
-                                                            <template v-if="!version.setStartTime">设置开始时间</template>
-                                                            <template v-else>{{version.start_time_format}}</template>
-                                                        </a>
-                                                    </div>
-                                                    <div slot="overlay">
-                                                        <a-date-picker
-                                                                v-model="version.start_time"
-                                                                size="small"
-                                                                format="MM月DD日 HH:mm"
-                                                                showTime
-                                                                allowClear
-                                                                :showToday="false"
-                                                                :open="showStartTime"
-                                                                @ok="doStartTime(true)"
-                                                        >
-                                                            <template slot="renderExtraFooter">
-                                                                <a style="position: absolute;" size="small"
-                                                                   @click="doStartTime(false)">清除</a>
-                                                            </template>
-                                                        </a-date-picker>
-                                                    </div>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="calendar"/>
-                                                <span class="field-name">发布时间</span>
-                                            </div>
-                                            <div class="field-right field-date">
-                                                <a-dropdown :trigger="['click']" v-model="showPlanPublishTime"
-                                                            :disabled="disableEdit">
-                                                    <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
-                                                        <template slot="title">
-                                                            <span>点击设置发布时间</span>
-                                                        </template>
-                                                        <div class="field-flex">
-                                                            <a class="muted name" style="margin: 0">
-                                                                <template v-if="!version.setPlanPublishTime">设置发布时间
-                                                                </template>
-                                                                <template v-else>{{version.plan_publish_time_format}}
-                                                                </template>
-                                                            </a>
-                                                        </div>
-                                                    </a-tooltip>
-                                                    <div class="field-flex" v-else>
-                                                        <a class="muted name" style="margin: 0">
-                                                            <template v-if="!version.setPlanPublishTime">设置发布时间
-                                                            </template>
-                                                            <template v-else>{{version.plan_publish_time_format}}
-                                                            </template>
-                                                        </a>
-                                                    </div>
-                                                    <div slot="overlay">
-                                                        <a-date-picker
-                                                                v-model="version.plan_publish_time"
-                                                                size="small"
-                                                                format="MM月DD日 HH:mm"
-                                                                showTime
-                                                                allowClear
-                                                                :showToday="false"
-                                                                :open="showPlanPublishTime"
-                                                                @ok="doPlanPublishTime(true)"
-                                                        >
-                                                            <template slot="renderExtraFooter">
-                                                                <a style="position: absolute;" size="small"
-                                                                   @click="doPlanPublishTime(false)">清除</a>
-                                                            </template>
-                                                        </a-date-picker>
-                                                    </div>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="fire"/>
-                                                <span class="field-name">完成进度</span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                                <a-tooltip placement="top"
-                                                           :mouseEnterDelay="0.3"
-                                                           :title="`系统自动统计当前版本的完成进度`">
-                                                    <a-progress :strokeWidth="4"
-                                                                :percent="version.schedule"/>
-                                                </a-tooltip>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="file-text"/>
-                                                <span class="field-name">备注</span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                                <div class="task-description" :class="{'disabled': disableEdit}"
-                                                     v-show="!showVersionDescriptionEdit"
-                                                     @click="showVersionDesc">
-                                                    <div class="description-txt" v-show="version.description"
-                                                         v-html="version.description"></div>
-                                                    <span v-show="!version.description">添加备注</span>
-                                                </div>
-                                                <div v-show="showVersionDescriptionEdit">
-                                                    <a-input type="textarea" v-model="version.description"></a-input>
-                                                    <div class="action-btn pull-right">
-                                                        <a type="text" class="cancel-text muted"
-                                                           @click="showVersionDescriptionEdit = false">
-                                                            取消
-                                                        </a>
-                                                        <a-button type="primary" htmlType='submit'
-                                                                  class="middle-btn"
-                                                                  @click="doContent">保存
-                                                        </a-button>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="bars"/>
-                                                <span class="field-name">发布内容 <span v-show="versionTaskSchedule !== false"> · {{versionTaskDoneNum}}/{{versionTaskList.length}}</span></span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="block-field width-block">
-                                                <div class="task-child">
-                                                    <div class="task-list" v-show="versionTaskList.length">
-                                                        <div v-for="(versionTask, index) in versionTaskList"
-                                                             :key="versionTask.code">
-                                                            <div class="list-item task">
-                                                                <div class="check-box-wrapper task-item"
-                                                                     @click.stop="showTaskDetail(versionTask)">
-                                                                    <a-icon class="check-box disabled"
-                                                                            :type="versionTask.done ? 'check-square' : 'border'"
-                                                                            :style="{fontSize:'16px'}"/>
-                                                                </div>
-                                                                <a-tooltip :mouseEnterDelay="0.5">
-                                                                    <template slot="title">
-                                                                        <span v-if="versionTask.executor">{{versionTask.executor.name}}</span>
-                                                                        <span v-else>待认领</span>
-                                                                    </template>
-                                                                   <div @click.stop="showTaskDetail(versionTask)">
-                                                                       <a-avatar
-                                                                               v-if="versionTask.executor"
-                                                                               class="task-item"
-                                                                               size="small"
-                                                                               icon="user"
-                                                                               :src="versionTask.executor.avatar"
-                                                                       ></a-avatar>
-                                                                       <a-avatar
-                                                                               v-else
-                                                                               class="task-item"
-                                                                               size="small"
-                                                                               icon="user"
-                                                                       ></a-avatar>
-                                                                   </div>
-                                                                </a-tooltip>
-                                                                <div class="task-item task-title"
-                                                                     @click.stop="showTaskDetail(versionTask)">
-                                                                    <div class="title-text"
-                                                                    >
-                                                                        {{versionTask.name}}
-                                                                    </div>
-                                                                </div>
-                                                                <span class="m-r muted">
-                                                                    <span v-if="versionTask.done" class="text-success">已完成</span>
-                                                                    <span v-else>未完成</span>
-                                                                </span>
-                                                                <a class="muted"
-                                                                   @click.stop="removeVersionTask(versionTask)">
-                                                                    <a-icon class="task-item" type="delete"/>
-                                                                </a>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <a-tooltip placement="top">
-                                                        <a class="add-handler"
-                                                           :class="{'disabled': disableEdit}"
-                                                           v-show="!showChildTask"
-                                                           @click="getTaskStages">
-                                                            <a-icon type="plus" style="margin-right: 6px;"/>
-                                                            添加发布内容
-                                                        </a>
-                                                    </a-tooltip>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
+                          </a-tooltip>
+                          <div class="field-flex" v-else>
+                            <a class="muted name" style="margin: 0">
+                              <template v-if="!version.setStartTime">设置开始时间</template>
+                              <template v-else>{{version.start_time_format}}</template>
+                            </a>
+                          </div>
+                          <div slot="overlay">
+                            <a-date-picker
+                              v-model="version.start_time"
+                              size="small"
+                              format="MM月DD日 HH:mm"
+                              showTime
+                              allowClear
+                              :showToday="false"
+                              :open="showStartTime"
+                              @ok="doStartTime(true)"
+                            >
+                              <template slot="renderExtraFooter">
+                                <a
+                                  style="position: absolute;"
+                                  size="small"
+                                  @click="doStartTime(false)"
+                                >清除</a>
+                              </template>
+                            </a-date-picker>
+                          </div>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="calendar" />
+                        <span class="field-name">发布时间</span>
+                      </div>
+                      <div class="field-right field-date">
+                        <a-dropdown
+                          :trigger="['click']"
+                          v-model="showPlanPublishTime"
+                          :disabled="disableEdit"
+                        >
+                          <a-tooltip :mouseEnterDelay="0.5" v-if="!disableEdit">
+                            <template slot="title">
+                              <span>点击设置发布时间</span>
+                            </template>
+                            <div class="field-flex">
+                              <a class="muted name" style="margin: 0">
+                                <template v-if="!version.setPlanPublishTime">设置发布时间</template>
+                                <template v-else>{{version.plan_publish_time_format}}</template>
+                              </a>
                             </div>
-                        </vue-scroll>
+                          </a-tooltip>
+                          <div class="field-flex" v-else>
+                            <a class="muted name" style="margin: 0">
+                              <template v-if="!version.setPlanPublishTime">设置发布时间</template>
+                              <template v-else>{{version.plan_publish_time_format}}</template>
+                            </a>
+                          </div>
+                          <div slot="overlay">
+                            <a-date-picker
+                              v-model="version.plan_publish_time"
+                              size="small"
+                              format="MM月DD日 HH:mm"
+                              showTime
+                              allowClear
+                              :showToday="false"
+                              :open="showPlanPublishTime"
+                              @ok="doPlanPublishTime(true)"
+                            >
+                              <template slot="renderExtraFooter">
+                                <a
+                                  style="position: absolute;"
+                                  size="small"
+                                  @click="doPlanPublishTime(false)"
+                                >清除</a>
+                              </template>
+                            </a-date-picker>
+                          </div>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="fire" />
+                        <span class="field-name">完成进度</span>
+                      </div>
+                      <div class="field-right width-block">
+                        <a-tooltip
+                          placement="top"
+                          :mouseEnterDelay="0.3"
+                          :title="`系统自动统计当前版本的完成进度`"
+                        >
+                          <a-progress :strokeWidth="4" :percent="version.schedule" />
+                        </a-tooltip>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="file-text" />
+                        <span class="field-name">备注</span>
+                      </div>
+                      <div class="field-right width-block">
+                        <div
+                          class="task-description"
+                          :class="{'disabled': disableEdit}"
+                          v-show="!showVersionDescriptionEdit"
+                          @click="showVersionDesc"
+                        >
+                          <div
+                            class="description-txt"
+                            v-show="version.description"
+                            v-html="version.description"
+                          ></div>
+                          <span v-show="!version.description">添加备注</span>
+                        </div>
+                        <div v-show="showVersionDescriptionEdit">
+                          <a-input type="textarea" v-model="version.description"></a-input>
+                          <div class="action-btn pull-right">
+                            <a
+                              type="text"
+                              class="cancel-text muted"
+                              @click="showVersionDescriptionEdit = false"
+                            >取消</a>
+                            <a-button
+                              type="primary"
+                              htmlType="submit"
+                              class="middle-btn"
+                              @click="doContent"
+                            >保存</a-button>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="bars" />
+                        <span class="field-name">
+                          发布内容
+                          <span
+                            v-show="versionTaskSchedule !== false"
+                          >· {{versionTaskDoneNum}}/{{versionTaskList.length}}</span>
+                        </span>
+                      </div>
+                      <div class="field-right width-block"></div>
                     </div>
-                    <div class="content-right">
-                        <div class="log-wrap">
-                            <div class="header">
-                                <span class="text-default">
-                                    所有动态
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="block-field width-block">
+                        <div class="task-child">
+                          <div class="task-list" v-show="versionTaskList.length">
+                            <div
+                              v-for="(versionTask, index) in versionTaskList"
+                              :key="versionTask.code"
+                            >
+                              <div class="list-item task">
+                                <div
+                                  class="check-box-wrapper task-item"
+                                  @click.stop="showTaskDetail(versionTask)"
+                                >
+                                  <a-icon
+                                    class="check-box disabled"
+                                    :type="versionTask.done ? 'check-square' : 'border'"
+                                    :style="{fontSize:'16px'}"
+                                  />
+                                </div>
+                                <a-tooltip :mouseEnterDelay="0.5">
+                                  <template slot="title">
+                                    <span v-if="versionTask.executor">{{versionTask.executor.name}}</span>
+                                    <span v-else>待认领</span>
+                                  </template>
+                                  <div @click.stop="showTaskDetail(versionTask)">
+                                    <a-avatar
+                                      v-if="versionTask.executor"
+                                      class="task-item"
+                                      size="small"
+                                      icon="user"
+                                      :src="versionTask.executor.avatar"
+                                    ></a-avatar>
+                                    <a-avatar v-else class="task-item" size="small" icon="user"></a-avatar>
+                                  </div>
+                                </a-tooltip>
+                                <div
+                                  class="task-item task-title"
+                                  @click.stop="showTaskDetail(versionTask)"
+                                >
+                                  <div class="title-text">{{versionTask.name}}</div>
+                                </div>
+                                <span class="m-r muted">
+                                  <span v-if="versionTask.done" class="text-success">已完成</span>
+                                  <span v-else>未完成</span>
                                 </span>
+                                <a class="muted" @click.stop="removeVersionTask(versionTask)">
+                                  <a-icon class="task-item" type="delete" />
+                                </a>
+                              </div>
                             </div>
-                            <vue-scroll>
-                                <div class="log-list muted">
-                                    <a class="show-more muted" v-show="checkShowMoreLog"
-                                       @click="getMoreVersionLog">
-                                        <a-icon type="ellipsis"/>
-                                        显示较早的 {{versionLogTotal - versionLog.length}} 条动态
-                                    </a>
-                                    <div class="list-item"
-                                         v-for="log in versionLog" :key="log.code">
-                                        <template>
-                                            <a-icon class="log-item" :type="log.icon"/>
-                                            <div class="log-item log-txt">
-                                                <div>{{log.member.name}} <span v-html="log.remark"></span></div>
-                                                <div v-if="log.content" class="log-content"
-                                                     v-html="log.content"></div>
-                                            </div>
-                                        </template>
-                                        <a-tooltip :mouseEnterDelay="0.5">
-                                            <template slot="title">
-                                                <span>{{log.create_time}}</span>
-                                            </template>
-                                            <span class="log-item">{{log.create_time | formatLogTime}}</span>
-                                        </a-tooltip>
-                                    </div>
-                                </div>
-                            </vue-scroll>
+                          </div>
+                          <a-tooltip placement="top">
+                            <a
+                              class="add-handler"
+                              :class="{'disabled': disableEdit}"
+                              v-show="!showChildTask"
+                              @click="getTaskStages"
+                            >
+                              <a-icon type="plus" style="margin-right: 6px;" />添加发布内容
+                            </a>
+                          </a-tooltip>
                         </div>
+                      </div>
                     </div>
+                  </div>
                 </div>
-            </div>
-        </a-spin>
-        <a-modal
-                destroyOnClose
-                :width="360"
-                v-model="publishVersion.modalStatus"
-                title="实际发布时间"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-form
-                    @submit.prevent="handleSubmitPublishVersion"
-                    :form="publishVersionForm"
-            >
-                <a-form-item
-                >
-                    <a-date-picker showTime format="YYYY年MM月DD日 HH:mm" style="width: 100%"
-                                   placeholder="选择实际发布时间" v-decorator="['publishTime']"></a-date-picker>
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="publishVersion.confirmLoading"
-                                  class="middle-btn">确认发布
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                class="publish-task-modal"
-                :width="800"
-                v-model="publishTask.modalStatus"
-                title="规划发布内容"
-                :footer="null"
-        >
-            <div>
-                <p v-show="publishTask.selectTaskList.length">已选择 <span class="text-warning">{{publishTask.selectTaskList.length}}</span>
-                    项</p>
-                <p class="muted" v-show="!publishTask.selectTaskList.length">请勾选需要发布的内容</p>
+              </div>
+            </vue-scroll>
+          </a-col>
+          <a-col class="log-wrap" :span="8" :xs="24" :sm="10" :md="8" :lg="8">
+            <div class="header">
+              <span class="text-default">所有动态</span>
             </div>
             <vue-scroll>
-                <div class="publish-task">
-                    <a-checkbox-group v-model="publishTask.selectTaskList">
-                        <div v-for="(taskStages, stageIndex) in publishTask.taskStages" :key="stageIndex" class="m-b">
-                            <strong>{{taskStages.name}}</strong>
-                            <a-list
-                                    class="publish-task-list"
-                                    :loading="taskStages.tasksLoading"
-                                    itemLayout="horizontal"
-                                    :dataSource="taskStages.tasks"
-                            >
-                                <a-list-item slot="renderItem" slot-scope="task,index">
-                                    <a-list-item-meta
-                                    >
-                                        <div slot="title" :class="{'muted': task.version_code}">
-                                            {{task.name}}
-                                        </div>
-                                        <div slot="avatar">
-                                            <a-checkbox :value="task.code"></a-checkbox>
-                                        </div>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                    </a-checkbox-group>
+              <div class="log-list muted">
+                <a class="show-more muted" v-show="checkShowMoreLog" @click="getMoreVersionLog">
+                  <a-icon type="ellipsis" />
+                  显示较早的 {{versionLogTotal - versionLog.length}} 条动态
+                </a>
+                <div class="list-item" v-for="log in versionLog" :key="log.code">
+                  <template>
+                    <a-icon class="log-item" :type="log.icon" />
+                    <div class="log-item log-txt">
+                      <div>
+                        {{log.member.name}}
+                        <span v-html="log.remark"></span>
+                      </div>
+                      <div v-if="log.content" class="log-content" v-html="log.content"></div>
+                    </div>
+                  </template>
+                  <a-tooltip :mouseEnterDelay="0.5">
+                    <template slot="title">
+                      <span>{{log.create_time}}</span>
+                    </template>
+                    <span class="log-item">{{log.create_time | formatLogTime}}</span>
+                  </a-tooltip>
                 </div>
+              </div>
             </vue-scroll>
-            <div class="footer-item text-right m-t">
-                <a-button type="primary" size="large" class="middle-btn" @click="addVersionTask">保存</a-button>
+          </a-col>
+        </a-row>
+      </div>
+    </a-spin>
+    <a-modal
+      destroyOnClose
+      :width="360"
+      v-model="publishVersion.modalStatus"
+      title="实际发布时间"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmitPublishVersion" :form="publishVersionForm">
+        <a-form-item>
+          <a-date-picker
+            showTime
+            :style="{minWidth:'auto'}"
+            format="YYYY年MM月DD日 HH:mm"
+            style="width: 100%"
+            placeholder="选择实际发布时间"
+            v-decorator="['publishTime']"
+          ></a-date-picker>
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="publishVersion.confirmLoading"
+              class="middle-btn"
+            >确认发布</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      class="publish-task-modal"
+      :width="800"
+      v-model="publishTask.modalStatus"
+      title="规划发布内容"
+      :footer="null"
+    >
+      <div>
+        <p v-show="publishTask.selectTaskList.length">
+          已选择
+          <span class="text-warning">{{publishTask.selectTaskList.length}}</span>
+          项
+        </p>
+        <p class="muted" v-show="!publishTask.selectTaskList.length">请勾选需要发布的内容</p>
+      </div>
+      <vue-scroll>
+        <div class="publish-task">
+          <a-checkbox-group v-model="publishTask.selectTaskList">
+            <div
+              v-for="(taskStages, stageIndex) in publishTask.taskStages"
+              :key="stageIndex"
+              class="m-b"
+            >
+              <strong>{{taskStages.name}}</strong>
+              <a-list
+                class="publish-task-list"
+                :loading="taskStages.tasksLoading"
+                itemLayout="horizontal"
+                :dataSource="taskStages.tasks"
+              >
+                <a-list-item slot="renderItem" slot-scope="task,index">
+                  <a-list-item-meta>
+                    <div slot="title" :class="{'muted': task.version_code}">{{task.name}}</div>
+                    <div slot="avatar">
+                      <a-checkbox :value="task.code"></a-checkbox>
+                    </div>
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
             </div>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                class="task-detail-modal"
-                width="min-content"
-                :closable="false"
-                v-model="showTaskDetailModal"
-                title=""
-                :footer="null"
-                @cancel="taskDetailClose"
-        >
-            <task-detail :taskCode="taskCode" @close="taskDetailClose"></task-detail>
-
-        </a-modal>
-    </div>
+          </a-checkbox-group>
+        </div>
+      </vue-scroll>
+      <div class="footer-item text-right m-t">
+        <a-button type="primary" size="large" class="middle-btn" @click="addVersionTask">保存</a-button>
+      </div>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      class="task-detail-modal"
+      width="min-content"
+      :closable="false"
+      v-model="showTaskDetailModal"
+      title
+      :footer="null"
+      @cancel="taskDetailClose"
+    >
+      <task-detail :taskCode="taskCode" @close="taskDetailClose"></task-detail>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import $ from 'jquery'
-    import moment from 'moment';
-    import taskDetail from '../../components/project/taskDetail'
-    import {
-        edit,
-        del,
-        read as getVersionInfo,
-        getVersionTask as getVersionTask,
-        getVersionLog
-    } from "@/api/projectVersion";
-    import {relativelyTaskTime, relativelyTime} from "@/assets/js/dateTime";
-    import {checkResponse} from "../../assets/js/utils";
-    import {addVersionTask, changeStatus, removeVersionTask} from "../../api/projectVersion";
-    import {list as getTaskStages, tasks as getTasks} from "../../api/taskStages";
-    import {notice} from "../../assets/js/notice";
-
-    export default {
-        name: "version-detail",
-        components: {
-            taskDetail
-        },
-        props: {
-            versionCode: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
-            width: {
-                type: [String, Number],
-                default() {
-                    return '1200'
-                }
-            }
+import { mapState } from "vuex";
+import $ from "jquery";
+import moment from "moment";
+import taskDetail from "../../components/project/taskDetail";
+import {
+  edit,
+  del,
+  read as getVersionInfo,
+  getVersionTask,
+  getVersionLog,
+} from "@/api/projectVersion";
+import { relativelyTaskTime, relativelyTime } from "@/assets/js/dateTime";
+import { checkResponse } from "../../assets/js/utils";
+import {
+  addVersionTask,
+  changeStatus,
+  removeVersionTask,
+} from "../../api/projectVersion";
+import { list as getTaskStages, tasks as getTasks } from "../../api/taskStages";
+import { notice } from "../../assets/js/notice";
+
+export default {
+  name: "version-detail",
+  components: {
+    taskDetail,
+  },
+  props: {
+    versionCode: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+    width: {
+      type: [String, Number],
+      default() {
+        return "1200";
+      },
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      code: this.versionCode,
+      projectCodeCurrent: "",
+      task: {},
+      showTaskDetailModal: false,
+      taskCode: "",
+      version: {},
+
+      /*菜单*/
+      visibleTaskMenu: false,
+
+      /*标题*/
+      versionName: "",
+
+      /*日期*/
+      showEditName: false,
+      showStartTime: false,
+      showPlanPublishTime: false,
+
+      /*备注*/
+      showVersionDescriptionEdit: false,
+
+      versionTaskList: [],
+      showChildTask: false,
+      versionLogTotal: 0,
+      versionLog: [],
+
+      publishVersionForm: this.$form.createForm(this),
+      publishVersion: {
+        modalStatus: false,
+        confirmLoading: false,
+        status: -1,
+      },
+
+      showMoreTaskLog: 0,
+      hasMoreVersionLog: false,
+      hideShowMore: false,
+
+      publishTask: {
+        modalStatus: false,
+        confirmLoading: false,
+        loading: false,
+        selectTaskList: [],
+        taskStages: [],
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+    disableEdit() {
+      return this.version.status == 3;
+    },
+    versionTaskDoneNum() {
+      const list = this.versionTaskList.filter((item) => item.done == 1);
+      return list.length;
+    },
+    checkShowMoreLog() {
+      if (!this.hideShowMore) {
+        if (this.versionLogTotal > 5) {
+          return true;
+        }
+      }
+      return false;
+    },
+    versionTaskSchedule() {
+      if (!this.versionTaskList.length) {
+        return false;
+      }
+      return (this.versionTaskDoneNum / this.versionTaskList.length) * 100;
+    },
+    scrollOps() {
+      return {
+        rail: {
+          background: "#e5e5e5",
+          opacity: 1,
         },
-        data() {
-            return {
-                loading: false,
-                code: this.versionCode,
-                projectCodeCurrent: '',
-                task: {},
-                showTaskDetailModal: false,
-                taskCode: '',
-                version: {},
-
-                /*菜单*/
-                visibleTaskMenu: false,
-
-
-                /*标题*/
-                versionName: '',
-
-                /*日期*/
-                showEditName: false,
-                showStartTime: false,
-                showPlanPublishTime: false,
-
-                /*备注*/
-                showVersionDescriptionEdit: false,
-
-                versionTaskList: [],
-                showChildTask: false,
-                versionLogTotal: 0,
-                versionLog: [],
-
-                publishVersionForm: this.$form.createForm(this),
-                publishVersion: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    status: -1,
-                },
-
-                showMoreTaskLog: 0,
-                hasMoreVersionLog: false,
-                hideShowMore: false,
-
-                publishTask: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    loading: false,
-                    selectTaskList: [],
-                    taskStages: []
-                },
-            }
+        bar: {
+          keepShow: true,
         },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            }),
-            disableEdit() {
-                return this.version.status == 3
-            },
-            versionTaskDoneNum() {
-                const list = this.versionTaskList.filter(item => item.done == 1);
-                return list.length;
-            },
-            checkShowMoreLog() {
-                if (!this.hideShowMore) {
-                    if (this.versionLogTotal > 5) {
-                        return true;
-                    }
-                }
-                return false;
-            },
-            versionTaskSchedule() {
-                if (!this.versionTaskList.length) {
-                    return false;
-                }
-                return this.versionTaskDoneNum / this.versionTaskList.length * 100
-            },
-            scrollOps() {
-                return {
-                    rail: {
-                        background: '#e5e5e5',
-                        opacity: 1
-                    },
-                    bar: {
-                        keepShow: true
-                    }
+      };
+    },
+  },
+  watch: {
+    $route(to, from) {
+      // if (from.name == 'taskdetail') {
+      //     this.init();
+      // }
+    },
+  },
+  created() {
+    this.init();
+  },
+  mounted() {
+    this.changeModalHeight();
+    window.onresize = () => {
+      return (() => {
+        this.changeModalHeight();
+      })();
+    };
+    document.onkeydown = (event) => {
+      var e = event || window.event || arguments.callee.caller.arguments[0];
+      if (13 == e.keyCode && e.ctrlKey) {
+        //处理的部分
+        this.createComment();
+      }
+    };
+  },
+  filters: {
+    formatLogTime(value) {
+      return relativelyTime(value);
+    },
+  },
+  methods: {
+    init() {
+      this.loading = true;
+      this.getVersion();
+      this.getVersionTask();
+    },
+    detailClose() {
+      this.$emit("close", this.version);
+    },
+    getVersion() {
+      getVersionInfo({ versionCode: this.code }).then((res) => {
+        this.getVersionLog();
+        this.version = res.data;
+        this.versionName = res.data.name;
+        if (!this.version.start_time) {
+          this.version.setStartTime = false;
+          this.version.start_time = moment(
+            moment().format("YYYY-MM-DD") + " 18:00"
+          );
+        } else {
+          this.version.setStartTime = true;
+          this.version.start_time = moment(this.version.start_time);
+        }
+        this.version.start_time_format = relativelyTaskTime(
+          this.version.start_time,
+          true
+        );
+
+        if (!this.version.plan_publish_time) {
+          this.version.setPlanPublishTime = false;
+          this.version.plan_publish_time = moment(
+            moment().format("YYYY-MM-DD") + " 18:00"
+          );
+        } else {
+          this.version.setPlanPublishTime = true;
+          this.version.plan_publish_time = moment(
+            this.version.plan_publish_time
+          );
+        }
+        this.version.plan_publish_time_format = relativelyTaskTime(
+          this.version.plan_publish_time,
+          true
+        );
+        this.loading = false;
+      });
+    },
+    getVersionTask() {
+      getVersionTask({ versionCode: this.code }).then((res) => {
+        this.versionTaskList = res.data;
+      });
+    },
+    getVersionLog() {
+      getVersionLog({
+        versionCode: this.code,
+        all: this.showMoreVersionLog,
+        pageSize: 5,
+      }).then((res) => {
+        // this.versionLog = res.data;
+        this.versionLog = res.data.list;
+        this.versionLogTotal = res.data.total;
+        if (res.data.total > 5) {
+          this.hasMoreVersionLog = true;
+          // this.showMoreTaskLog = 1;
+        }
+      });
+    },
+    getMoreVersionLog() {
+      this.showMoreVersionLog = 1;
+      this.hideShowMore = true;
+      this.getVersionLog();
+    },
+    getTaskStages() {
+      if (this.disableEdit) {
+        return false;
+      }
+      this.publishTask.modalStatus = true;
+      this.publishTask.loading = true;
+      getTaskStages({
+        projectCode: this.version.projectCode,
+        pageSize: 30,
+      }).then((res) => {
+        this.publishTask.taskStages = res.data.list;
+        if (this.publishTask.taskStages) {
+          this.publishTask.taskStages.forEach((v) => {
+            getTasks({ stageCode: v.code }).then((res) => {
+              v.tasksLoading = false;
+              v.tasks = res.data;
+            });
+          });
+        }
+        this.changeModalHeight();
+        this.publishTask.loading = false;
+      });
+    },
+    showTaskDetail(task) {
+      this.showTaskDetailModal = true;
+      this.taskCode = task.code;
+    },
+    taskDetailClose() {
+      this.init();
+      this.showTaskDetailModal = false;
+      this.taskCode = "";
+    },
+    doVersion(action) {
+      let app = this;
+      const actionKey = action.key;
+      switch (actionKey) {
+        case "delete":
+          this.$confirm({
+            title: "删除版本",
+            content: `删除版本后，发布内容的版本字段将被清空，是否确定删除？`,
+            okText: "确定",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              del({ versionCode: app.code }).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
                 }
-            }
-        },
-        watch: {
-            $route(to, from) {
-                // if (from.name == 'taskdetail') {
-                //     this.init();
-                // }
+                app.detailClose();
+              });
+              return Promise.resolve();
             },
+          });
+          break;
+      }
+      this.visibleTaskMenu = false;
+    },
+    editTitle() {
+      this.showEditName = true;
+      this.$nextTick(() => {
+        this.$refs.inputTitle.focus();
+      });
+    },
+    deleteTask() {
+      let app = this;
+      this.$confirm({
+        title: "彻底删除",
+        content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
+        okText: "删除",
+        okType: "danger",
+        cancelText: `再想想`,
+        onOk() {
+          del(app.code).then((res) => {
+            ``;
+            app.detailClose();
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.init();
-        },
-        mounted() {
-            this.changeModalHeight();
-            window.onresize = () => {
-                return (() => {
-                    this.changeModalHeight();
-                })()
-            };
-            document.onkeydown = (event) => {
-                var e = event || window.event || arguments.callee.caller.arguments[0];
-                if (13 == e.keyCode && e.ctrlKey) {
-                    //处理的部分
-                    this.createComment();
-                }
-            };
-        },
-        filters: {
-            formatLogTime(value) {
-                return relativelyTime(value)
+      });
+    },
+    changeVersionStatus(e) {
+      let app = this;
+      if (e.key == this.version.code || this.version.status == 3) {
+        return false;
+      }
+      if (e.key == 3) {
+        //请确认当前版本发布内容已全部完成后再发布。
+        this.$confirm({
+          title: "发布提示",
+          content: `请确认当前版本发布内容已全部完成后再发布。`,
+          okText: "确认发布",
+          okType: "primary",
+          onOk() {
+            app.publishVersion.status = e.key;
+            app.publishVersion.modalStatus = true;
+            app.$nextTick(function () {
+              app.publishVersionForm.setFieldsValue({
+                publishTime: moment(),
+              });
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        changeStatus({ versionCode: this.version.code, status: e.key }).then(
+          (res) => {
+            this.getVersion();
+          }
+        );
+      }
+    },
+    handleSubmitPublishVersion() {
+      let app = this;
+      app.publishVersionForm.validateFields((err) => {
+        if (!err) {
+          let obj = app.publishVersionForm.getFieldsValue();
+          obj.publishTime = moment(obj.publishTime).format("YYYY-MM-DD HH:mm");
+          changeStatus({
+            versionCode: this.code,
+            status: this.publishVersion.status,
+            publishTime: obj.publishTime,
+          }).then((res) => {
+            app.publishVersion.modalStatus = false;
+            app.getVersion();
+          });
+        }
+      });
+    },
+    doStartTime(setStartTime = false, showStartTime = false) {
+      this.version.setStartTime = setStartTime;
+      this.showStartTime = showStartTime;
+      let beginTime = "";
+      if (setStartTime) {
+        beginTime = moment(this.version.start_time).format("YYYY-MM-DD HH:mm");
+        this.version.start_time_format = moment(this.version.start_time).format(
+          "MM月DD日 HH:mm"
+        );
+      } else {
+        beginTime = "";
+      }
+      this.editVersion({ start_time: beginTime });
+    },
+    doPlanPublishTime(setPlanPublishTime = false, showPlanPublishTime = false) {
+      this.version.setPlanPublishTime = setPlanPublishTime;
+      this.showPlanPublishTime = showPlanPublishTime;
+      let endTime = "";
+      if (setPlanPublishTime) {
+        endTime = moment(this.version.plan_publish_time).format(
+          "YYYY-MM-DD HH:mm"
+        );
+        this.version.plan_publish_time_format = moment(
+          this.version.plan_publish_time
+        ).format("MM月DD日 HH:mm");
+      } else {
+        endTime = "";
+      }
+      this.editVersion({ plan_publish_time: endTime });
+    },
+    doName() {
+      this.showEditName = false;
+      if (!this.version.name.trim() || this.version.name == this.versionName) {
+        this.version.name = this.versionName;
+        return false;
+      }
+      this.editVersion({ name: this.version.name });
+    },
+    editVersion(data) {
+      data.versionCode = this.code;
+      edit(data).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        this.getVersion();
+      });
+    },
+    showVersionDesc() {
+      if (this.disableEdit) {
+        return false;
+      }
+      this.showVersionDescriptionEdit = true;
+    },
+    doContent() {
+      let content = this.version.description;
+      this.editVersion({ description: content });
+      this.showVersionDescriptionEdit = false;
+    },
+    addVersionTask() {
+      addVersionTask({
+        taskCodeList: JSON.stringify(this.publishTask.selectTaskList),
+        versionCode: this.code,
+      }).then((res) => {
+        notice(
+          { title: `成功添加 ${res.data.successTotal} 项发布内容到版本` },
+          "notice",
+          "success"
+        );
+        this.publishTask.modalStatus = false;
+        this.publishTask.selectTaskList = [];
+        this.init();
+      });
+    },
+    removeVersionTask(task) {
+      let app = this;
+      this.$confirm({
+        title: "移除发布内容",
+        content: `确定移除这个发布内容？`,
+        okText: "确定",
+        okType: "danger",
+        cancelText: `再想想`,
+        onOk() {
+          removeVersionTask({ taskCode: task.code }).then((res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
             }
+            app.init();
+          });
+          return Promise.resolve();
         },
-        methods: {
-            init() {
-                this.loading = true;
-                this.getVersion();
-                this.getVersionTask();
-            },
-            detailClose() {
-                this.$emit('close', this.version);
-            },
-            getVersion() {
-                getVersionInfo({versionCode: this.code}).then(res => {
-                    this.getVersionLog();
-                    this.version = res.data;
-                    this.versionName = res.data.name;
-                    if (!this.version.start_time) {
-                        this.version.setStartTime = false;
-                        this.version.start_time = moment(moment().format('YYYY-MM-DD') + ' 18:00');
-                    } else {
-                        this.version.setStartTime = true;
-                        this.version.start_time = moment(this.version.start_time);
-                    }
-                    this.version.start_time_format = relativelyTaskTime(this.version.start_time, true);
-
-                    if (!this.version.plan_publish_time) {
-                        this.version.setPlanPublishTime = false;
-                        this.version.plan_publish_time = moment(moment().format('YYYY-MM-DD') + ' 18:00');
-                    } else {
-                        this.version.setPlanPublishTime = true;
-                        this.version.plan_publish_time = moment(this.version.plan_publish_time);
-                    }
-                    this.version.plan_publish_time_format = relativelyTaskTime(this.version.plan_publish_time, true);
-                    this.loading = false;
-                });
-            },
-            getVersionTask() {
-                getVersionTask({versionCode: this.code}).then(res => {
-                    this.versionTaskList = res.data;
-                });
-            },
-            getVersionLog() {
-                getVersionLog({
-                    versionCode: this.code, all: this.showMoreVersionLog,
-                    pageSize: 5,
-                }).then(res => {
-                    // this.versionLog = res.data;
-                    this.versionLog = res.data.list;
-                    this.versionLogTotal = res.data.total;
-                    if (res.data.total > 5) {
-                        this.hasMoreVersionLog = true;
-                        // this.showMoreTaskLog = 1;
-                    }
-                });
-            },
-            getMoreVersionLog() {
-                this.showMoreVersionLog = 1;
-                this.hideShowMore = true;
-                this.getVersionLog();
-            },
-            getTaskStages() {
-                if (this.disableEdit) {
-                    return false
-                }
-                this.publishTask.modalStatus = true;
-                this.publishTask.loading = true;
-                getTaskStages({projectCode: this.version.projectCode, pageSize: 30}).then((res) => {
-                    this.publishTask.taskStages = res.data.list;
-                    if (this.publishTask.taskStages) {
-                        this.publishTask.taskStages.forEach((v) => {
-                            getTasks({stageCode: v.code}).then((res) => {
-                                v.tasksLoading = false;
-                                v.tasks = res.data;
-                            })
-                        })
-                    }
-                    this.changeModalHeight();
-                    this.publishTask.loading = false;
-                })
-            },
-            showTaskDetail(task) {
-                this.showTaskDetailModal = true;
-                this.taskCode = task.code;
-            },
-            taskDetailClose() {
-                this.init();
-                this.showTaskDetailModal = false;
-                this.taskCode = '';
-            },
-            doVersion(action) {
-                let app = this;
-                const actionKey = action.key;
-                switch (actionKey) {
-                    case 'delete':
-                        this.$confirm({
-                            title: '删除版本',
-                            content: `删除版本后，发布内容的版本字段将被清空，是否确定删除？`,
-                            okText: '确定',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                del({versionCode: app.code}).then((res) => {
-                                    const result = checkResponse(res);
-                                    if (!result) {
-                                        return false;
-                                    }
-                                    app.detailClose();
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                }
-                this.visibleTaskMenu = false;
-            },
-            editTitle() {
-                this.showEditName = true;
-                this.$nextTick(() => {
-                    this.$refs.inputTitle.focus();
-                });
-            },
-            deleteTask() {
-                let app = this;
-                this.$confirm({
-                    title: '彻底删除',
-                    content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: `再想想`,
-                    onOk() {
-                        del(app.code).then((res) => {
-                            ``
-                            app.detailClose();
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            changeVersionStatus(e) {
-                let app = this;
-                if (e.key == this.version.code || this.version.status == 3) {
-                    return false;
-                }
-                if (e.key == 3) {
-                    //请确认当前版本发布内容已全部完成后再发布。
-                    this.$confirm({
-                        title: '发布提示',
-                        content: `请确认当前版本发布内容已全部完成后再发布。`,
-                        okText: '确认发布',
-                        okType: 'primary',
-                        onOk() {
-                            app.publishVersion.status = e.key;
-                            app.publishVersion.modalStatus = true;
-                            app.$nextTick(function () {
-                                app.publishVersionForm.setFieldsValue({
-                                    publishTime: moment(),
-                                });
-                            });
-                            return Promise.resolve();
-                        }
-                    });
+      });
+    },
+    changeModalHeight() {
+      const defaultWidth = this.width;
+      let width = $(window).width() - 20;
+      let height = $(window).height() - 150;
+      let logHeight = $(window).height() - 200;
+      let publishModalHeight = $(window).height() - 255;
+      if (
+        defaultWidth === "full-screen" ||
+        this.$route.query["full-screen"] !== undefined
+      ) {
+        //全屏显示
+        $(".task-detail-modal").css("width", $(window).width());
+        $(".version-detail").css("width", $(window).width());
+        $(".ant-modal").css("top", 0);
+        height += 85;
+        logHeight += 85;
+        $(".content-left").css("height", height + "px");
+        $(".log-wrap").css("height", logHeight + "px");
+      } else {
+        if (width > defaultWidth) {
+          width = defaultWidth;
+        }
+        $(".version-detail").css("width", width);
+        $(".content-left").css("height", height + "px");
+        $(".log-wrap").css("height", logHeight + "px");
+        $(".publish-task").css("height", publishModalHeight + "px");
+      }
+    },
+  },
+};
+</script>
 
-                } else {
-                    changeStatus({versionCode: this.version.code, status: e.key}).then(res => {
-                        this.getVersion();
-                    });
-                }
-            },
-            handleSubmitPublishVersion() {
-                let app = this;
-                app.publishVersionForm.validateFields(
-                    (err) => {
-                        if (!err) {
-                            let obj = app.publishVersionForm.getFieldsValue();
-                            obj.publishTime = moment(obj.publishTime).format('YYYY-MM-DD HH:mm');
-                            changeStatus({
-                                versionCode: this.code,
-                                status: this.publishVersion.status,
-                                publishTime: obj.publishTime,
-                            }).then(res => {
-                                app.publishVersion.modalStatus = false;
-                                app.getVersion();
-                            });
-                        }
-                    })
-            },
-            doStartTime(setStartTime = false, showStartTime = false) {
-                this.version.setStartTime = setStartTime;
-                this.showStartTime = showStartTime;
-                let beginTime = '';
-                if (setStartTime) {
-                    beginTime = moment(this.version.start_time).format('YYYY-MM-DD HH:mm');
-                    this.version.start_time_format = moment(this.version.start_time).format('MM月DD日 HH:mm');
-                } else {
-                    beginTime = '';
-                }
-                this.editVersion({start_time: beginTime});
+<style lang="less" scoped>
+@import "~ant-design-vue/lib/style/themes/default";
+
+.version-detail {
+  background: #fff;
+  min-height: 1px;
+  min-width: 1px;
+  margin: auto;
+  border-radius: 1rem;
+  max-width: 100%;
+
+  .field-flex {
+    display: flex;
+    justify-content: flex-start;
+  }
+
+  .task-tag {
+    .ant-tag {
+      margin-bottom: 6px;
+    }
+  }
 
-            },
-            doPlanPublishTime(setPlanPublishTime = false, showPlanPublishTime = false) {
-                this.version.setPlanPublishTime = setPlanPublishTime;
-                this.showPlanPublishTime = showPlanPublishTime;
-                let endTime = '';
-                if (setPlanPublishTime) {
-                    endTime = moment(this.version.plan_publish_time).format('YYYY-MM-DD HH:mm');
-                    this.version.plan_publish_time_format = moment(this.version.plan_publish_time).format('MM月DD日 HH:mm');
-                } else {
-                    endTime = '';
-                }
-                this.editVersion({plan_publish_time: endTime});
+  .version-detail-spin {
+    width: 100%;
+  }
 
-            },
-            doName() {
-                this.showEditName = false;
-                if (!this.version.name.trim() || this.version.name == this.versionName) {
-                    this.version.name = this.versionName;
-                    return false;
-                }
-                this.editVersion({name: this.version.name});
-            },
-            editVersion(data) {
-                data.versionCode = this.code;
-                edit(data).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    this.getVersion();
-                });
-            },
-            showVersionDesc() {
-                if (this.disableEdit) {
-                    return false;
-                }
-                this.showVersionDescriptionEdit = true;
-            },
-            doContent() {
-                let content = this.version.description;
-                this.editVersion({description: content});
-                this.showVersionDescriptionEdit = false;
-            },
-            addVersionTask() {
-                addVersionTask({
-                    taskCodeList: JSON.stringify(this.publishTask.selectTaskList),
-                    versionCode: this.code
-                }).then(res => {
-                    notice({title: `成功添加 ${res.data.successTotal} 项发布内容到版本`}, 'notice', 'success');
-                    this.publishTask.modalStatus = false;
-                    this.publishTask.selectTaskList = [];
-                    this.init();
-                })
-            },
-            removeVersionTask(task) {
-                let app = this;
-                this.$confirm({
-                    title: '移除发布内容',
-                    content: `确定移除这个发布内容？`,
-                    okText: '确定',
-                    okType: 'danger',
-                    cancelText: `再想想`,
-                    onOk() {
-                        removeVersionTask({taskCode: task.code}).then((res) => {
-                            const result = checkResponse(res);
-                            if (!result) {
-                                return false;
-                            }
-                            app.init();
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            changeModalHeight() {
-                const defaultWidth = this.width;
-                let width = $(window).width() - 100;
-                let height = $(window).height() - 150;
-                let logHeight = $(window).height() - 200;
-                let publishModalHeight = $(window).height() - 255;
-                if (defaultWidth === 'full-screen' || this.$route.query['full-screen'] !== undefined) {
-                    //全屏显示
-                    $(".task-detail-modal").css("width", $(window).width());
-                    $(".version-detail").css("width", $(window).width());
-                    $(".ant-modal").css("top", 0);
-                    height += 85;
-                    logHeight += 85;
-                    $(".content-left").css("height", height + "px");
-                    $(".log-wrap").css("height", logHeight + "px");
-                } else {
-                    if (width > defaultWidth) {
-                        width = defaultWidth;
-                    }
-                    $(".version-detail").css("width", width);
-                    $(".content-left").css("height", height + "px");
-                    $(".log-wrap").css("height", logHeight + "px");
-                    $(".publish-task").css("height", publishModalHeight + "px");
-                }
-            }
-        }
-    }
-</script>
+  .task-header {
+    padding: 20px 0;
+    border-bottom: 1px solid #e5e5e5;
+    display: flex;
+    vertical-align: middle;
 
+    .head-title {
+      padding: 0 20px 0 20px;
+      flex: 1 1;
 
-<style lang="less">
-    @import "~ant-design-vue/lib/style/themes/default";
-    @import "../../assets/css/components/task";
+      .breadcrumb {
+        display: inline;
 
-    .field-flex {
-        display: flex;
-        justify-content: flex-start;
-    }
+        a {
+          color: inherit;
 
-    .task-tag {
-        .ant-tag {
-            margin-bottom: 6px;
+          &:hover {
+            color: #40a9ff;
+          }
         }
+      }
     }
 
-    .version-detail {
-        background: #FFF;
-        display: -webkit-box;
-        display: -ms-flexbox;
+    .header-action {
+      font-size: 16px;
+      padding: 0 20px;
+      display: flex;
+      max-height: 24px;
+
+      .action-item {
+        margin-left: 10px;
+        padding: 4px;
+        transition: 218ms;
+        transition-property: background, color;
+        border-radius: 4px;
+        align-items: center;
         display: flex;
-        -webkit-box-pack: center;
-        -ms-flex-pack: center;
+        text-align: center;
         justify-content: center;
-        -webkit-box-flex: 1;
-        -ms-flex: 1;
-        flex: 1;
-        min-height: 1px;
-        min-width: 1px;
-        margin: auto;
-
-        .version-detail-spin {
-            width: 100%;
-        }
+        min-width: 32px;
 
-        .task-header {
-            padding: 20px 0;
-            border-bottom: 1px solid #e5e5e5;
-            display: flex;
-            vertical-align: middle;
+        span {
+          margin-left: 6px;
+          font-size: 14px;
+        }
 
+        &.active {
+          color: #3da8f5;
+        }
 
-            .head-title {
-                padding: 0 20px 0 20px;
-                flex: 1 1;
+        &:hover {
+          background: #ecf6fe;
+          color: #3da8f5;
+          border-radius: 4px;
+        }
+      }
+    }
 
-                .breadcrumb {
-                    display: inline;
+    &.disabled {
+      background: #f5f5f5;
+    }
+  }
+
+  .task-wrap {
+    .task-content {
+      > :nth-child(n + 2) {
+        border-left: 1px solid #e5e5e5;
+      }
+
+      .task-title {
+        padding-top: 0.3rem;
+        padding-bottom: 0.3rem;
+        margin: 0 1rem;
+        cursor: text;
+
+        &.disabled {
+          cursor: not-allowed;
+
+          &:hover {
+            background: inherit;
+          }
+
+          .ant-input,
+          .title-text {
+            &:hover,
+            &:focus {
+              background: inherit;
+            }
+          }
+        }
 
-                    a {
-                        color: inherit;
+        &:hover {
+          background: #f5f5f5;
+        }
 
-                        &:hover {
-                            color: #40a9ff;
-                        }
+        .title-text {
+          line-height: 1.5;
+        }
 
-                    }
-                }
-            }
+        .ant-input,
+        .title-text {
+          font-size: 1.2rem;
+          padding: 8px;
+          border: none !important;
+          border-radius: 4px;
+
+          &:hover,
+          &:focus {
+            background: #f5f5f5;
+            box-shadow: none !important;
+            border-right-width: 0 !important;
+            border: none !important;
+            border-radius: 4px;
+          }
+        }
+      }
 
-            .header-action {
-                font-size: 16px;
-                padding: 0 20px;
-                display: flex;
-                max-height: 24px;
-
-                .action-item {
-                    margin-left: 10px;
-                    padding: 4px;
-                    transition: 218ms;
-                    transition-property: background, color;
-                    border-radius: 4px;
-                    align-items: center;
-                    display: flex;
-                    text-align: center;
-                    justify-content: center;
-                    min-width: 32px;
+      .task-basic-attrs-view {
+        padding: 0.5rem 1rem;
+        .field-list {
+          padding: 0 0.5rem;
 
-                    span {
-                        margin-left: 6px;
-                        font-size: 14px;
-                    }
+          &.disabled {
+            .field-right,
+            a {
+              cursor: not-allowed !important;
+            }
+          }
+
+          .component-mount {
+            .field {
+              display: flex;
+              justify-content: flex-start;
+              padding-top: 0.4rem;
+              padding-bottom: 0.4rem;
+              align-items: flex-start;
+
+              .field-left {
+                min-width: 7rem;
+                line-height: 1.75;
+                padding-right: 0.5rem;
+              }
+
+              .field-right {
+                cursor: pointer;
+                max-width: calc(100% - 7.5rem);
+                flex: 1;
+
+                .inline-block {
+                  display: inline-block;
+                }
 
-                    &.active {
-                        color: #3da8f5;
-                    }
+                &.field-date {
+                  display: flex;
+                }
 
-                    &:hover {
-                        background: #ecf6fe;
-                        color: #3da8f5;
-                        border-radius: 4px;
-                    }
+                &.width-block {
+                  .w-e-text {
+                    cursor: text;
+                  }
                 }
-            }
 
-            &.disabled {
-                background: #f5f5f5;
-            }
-        }
+                .name {
+                  margin: 0 8px;
+                }
+              }
 
-        .task-wrap {
-            .task-content {
+              .block-field {
+                width: 100%;
+                border: 1px solid #e5e5e5;
+                border-radius: 1rem;
                 display: flex;
                 justify-content: flex-start;
+                flex-direction: row;
+              }
 
-                .content-left {
-                    border-right: 1px solid #e5e5e5;
-                    min-width: 560px;
-                    width: 63%;
-                    /*width: 760px;*/
+              .task-child {
+                flex: 1;
 
-                    .task-title {
-                        margin: 10px 40px 20px 20px;
-                        cursor: text;
+                .task-list {
+                  padding: 8px 0;
 
-                        &.disabled {
-                            cursor: not-allowed;
+                  .list-item {
+                    display: flex;
+                    align-items: center;
+                    /*justify-content: space-between;*/
 
-                            &:hover {
-                                background: inherit;
-                            }
+                    .task-title,
+                    .task-input {
+                      flex: 1 1;
+                      margin: 0;
+                    }
 
-                            .ant-input, .title-text {
-                                &:hover, &:focus {
-                                    background: inherit;
-                                }
-                            }
-                        }
+                    .title-text {
+                      color: #333;
+                      line-height: 14px;
 
-                        &:hover {
-                            background: #f5f5f5;
-                        }
+                      &.done {
+                        color: #a6a6a6;
+                      }
+                    }
 
-                        .title-text {
-                            line-height: 24px;
-                        }
+                    .ant-input,
+                    .title-text {
+                      font-size: 14px;
 
-                        .ant-input, .title-text {
-                            font-size: 20px;
-                            padding: 8px;
-                            border: none !important;
-                            border-radius: 4px;
-
-                            &:hover, &:focus {
-                                background: #f5f5f5;
-                                box-shadow: none !important;
-                                border-right-width: 0 !important;
-                                border: none !important;
-                                border-radius: 4px;
-                            }
-                        }
+                      &:hover,
+                      &:focus {
+                      }
                     }
 
-                    .task-basic-attrs-view {
-                        .field-list {
-                            padding: 0 40px 0 32px;
-
-                            &.disabled {
-                                .field-right, a {
-                                    cursor: not-allowed !important;
-                                }
-                            }
-
-                            .component-mount {
-                                .field {
-                                    display: flex;
-                                    justify-content: flex-start;
-                                    margin: 12px 0;
-                                    min-height: 36px;
-
-                                    .field-left {
-                                        align-self: flex-start;
-                                        width: 132px;
-                                        height: 36px;
-                                        padding-right: 12px;
-                                    }
-
-                                    .field-right {
-                                        cursor: pointer;
-                                        max-width: calc(100% - 132px);
-
-                                        .inline-block {
-                                            display: inline-block;
-                                        }
-
-                                        &.field-date {
-                                            display: flex;
-                                        }
-
-                                        &.width-block {
-                                            width: 100%;
-
-                                            .w-e-text {
-                                                cursor: text;
-                                            }
-                                        }
-
-                                        .name {
-                                            margin: 0 8px;
-                                        }
-                                    }
-
-                                    .block-field {
-                                        width: 100%;
-                                        border: 1px solid #e5e5e5;
-                                        border-radius: 4px;
-                                        padding: 2px 0;
-                                        margin-bottom: 12px;
-                                        display: flex;
-                                        justify-content: flex-start;
-                                        flex-direction: row;
-                                    }
-
-                                    .task-child {
-                                        width: 100%;
-
-                                        .task-list {
-                                            padding: 8px 0;
-
-                                            .list-item {
-                                                padding: 4px 12px 4px 5px;
-                                                display: flex;
-                                                align-items: center;
-                                                /*justify-content: space-between;*/
-
-                                                .task-title, .task-input {
-                                                    flex: 1 1;
-                                                    margin: 0;
-                                                }
-
-                                                .title-text {
-                                                    color: #333;
-                                                    line-height: 14px;
-
-                                                    &.done {
-                                                        color: #a6a6a6;
-                                                    }
-                                                }
-
-                                                .ant-input, .title-text {
-                                                    font-size: 14px;
-
-                                                    &:hover, &:focus {
-                                                    }
-                                                }
-
-                                                .check-box-wrapper {
-                                                    margin-top: 0;
-                                                }
-
-                                                .task-item {
-                                                    cursor: pointer;
-                                                    margin-right: 12px;
-
-                                                    &.disabled {
-                                                        cursor: not-allowed;
-                                                    }
-
-                                                    &.check-box {
-                                                        .anticon-check {
-                                                            visibility: visible;
-                                                            top: 14px;
-                                                            left: 18px;
-                                                        }
-                                                    }
-
-                                                }
-                                            }
-
-                                            .action-btn {
-                                                padding: 2px 12px 2px 16px;
-                                            }
-                                        }
-
-                                        .add-handler {
-                                            /*margin-bottom: 8px;*/
-                                            padding-left: 16px;
-                                            padding-right: 12px;
-                                            display: flex;
-                                            align-items: center;
-                                            height: 36px;
-                                        }
-                                    }
-
-                                    .file-list {
-                                        width: 100%;
-                                        padding: 8px;
-
-                                        .ant-list-item {
-                                            padding: 10px 12px;
-                                            border-bottom: none;
-                                            border-radius: 4px;
-                                            margin-bottom: 2px;
-
-                                            &:hover {
-                                                background-color: #f5f5f5;
-                                            }
-
-                                            .ant-list-item-meta-title {
-                                                margin-bottom: 0;
-                                                line-height: 24px;
-                                            }
-                                        }
-                                    }
-                                }
-
-                                .field-name {
-                                    overflow: hidden;
-                                    text-overflow: ellipsis;
-                                    white-space: nowrap;
-                                    padding-left: 8px;
-                                }
-
-                                .task-description {
-                                    &:hover {
-                                        background: #f5f5f5;
-                                        border-radius: 4px;
-                                    }
-
-                                    &.disabled {
-                                        &:hover {
-                                            background: inherit;
-                                        }
-                                    }
-
-                                    padding: 8px;
-                                    margin: -8px;
-
-                                    .description-txt {
-                                        max-height: 300px;
-                                        overflow: hidden;
-                                    }
-
-                                    p {
-                                        margin: 0;
-                                    }
-                                }
-                            }
-                        }
+                    .check-box-wrapper {
+                      margin-top: 0;
                     }
-                }
 
-                .content-right {
-                    width: 37%;
-                    /*width: 440px;*/
+                    .task-item {
+                      cursor: pointer;
+                      margin-right: 12px;
 
-                    .header {
-                        padding: 15px 20px 20px 20px;
+                      &.disabled {
+                        cursor: not-allowed;
+                      }
+
+                      &.check-box {
+                        .anticon-check {
+                          visibility: visible;
+                          top: 14px;
+                          left: 18px;
+                        }
+                      }
                     }
+                  }
 
-                    .member-list {
-                        padding-top: 12px;
-                        display: flex;
-                        justify-content: flex-start;
+                  .action-btn {
+                    padding: 2px 12px 2px 16px;
+                  }
+                }
 
-                        .member-item {
-                            margin-right: 10px;
+                .add-handler {
+                  /*margin-bottom: 8px;*/
+                  padding-left: 16px;
+                  padding-right: 12px;
+                  display: flex;
+                  align-items: center;
+                  height: 36px;
+                }
+              }
 
-                            &.invite {
-                                cursor: pointer;
-                            }
-                        }
-                    }
+              .file-list {
+                flex: 1;
 
-                    .log-wrap {
-                        border-top: none;
-                        border-bottom: none;
-                        padding-bottom: 12px;
+                .ant-list-item {
+                  padding: 10px 12px;
+                  border-bottom: none;
+                  border-radius: 4px;
+                  margin-bottom: 2px;
 
-                        .header {
-                            width: 100%;
-                        }
+                  &:hover {
+                    background-color: #f5f5f5;
+                  }
 
-                        .log-list {
-                            /*font-size: 12px;*/
-                            padding: 0 20px 0 20px;
-
-                            .show-more {
-                                display: block;
-                                margin-bottom: 20px;
-                            }
-
-                            .list-item {
-                                display: flex;
-                                justify-content: flex-start;
-                                align-items: baseline;
-                                vertical-align: middle;
-                                width: 100%;
-
-                                &.log-comment {
-                                    align-items: end;
-                                }
-
-                                .log-item {
-                                    margin-right: 12px;
-                                    margin-bottom: 24px;
-
-                                    .anticon {
-                                        font-size: 14px;
-                                    }
-
-                                    .log-content {
-                                        overflow: hidden;
-                                        text-overflow: ellipsis;
-                                        border-left: 5px solid #ccc;
-                                        padding-left: 12px;
-                                        margin-top: 6px;
-                                    }
-                                }
-
-                                .log-txt {
-                                    flex: 1 1;
-                                }
-                            }
-                        }
-                    }
+                  .ant-list-item-meta-title {
+                    margin-bottom: 0;
+                    line-height: 24px;
+                  }
+                }
+              }
+            }
 
-                    .footer {
-                        padding: 20px 20px 0 20px;
-                        display: flex;
-                    }
+            .field-name {
+              overflow: hidden;
+              text-overflow: ellipsis;
+              white-space: nowrap;
+              padding-left: 8px;
+            }
+
+            .task-description {
+              &:hover {
+                background: #f5f5f5;
+                border-radius: 4px;
+              }
+
+              &.disabled {
+                &:hover {
+                  background: inherit;
                 }
+              }
+
+              padding: 8px;
+              margin: -8px;
+
+              .description-txt {
+                max-height: 300px;
+                overflow: hidden;
+              }
+
+              p {
+                margin: 0;
+              }
             }
+          }
         }
-    }
+      }
+
+      .log-wrap {
+        border-top: none;
+        border-bottom: none;
+        display: flex;
+        flex-direction: column;
+        max-height: 72vh;
 
-    .publish-task-modal {
-        .ant-modal-body {
-            padding: 12px 12px 12px 24px;
+        .header {
+          flex: 0 0;
+          padding: 15px 20px 20px 20px;
         }
 
-        .publish-task {
-            padding-right: 18px;
+        .member-list {
+          padding-top: 12px;
+          display: flex;
+          justify-content: flex-start;
 
-            .ant-checkbox-group {
-                width: 100%;
+          .member-item {
+            margin-right: 10px;
+
+            &.invite {
+              cursor: pointer;
+            }
+          }
+        }
+
+        .log-list {
+          flex: 1 0;
+          /*font-size: 12px;*/
+          padding: 0 20px 0 20px;
+
+          .show-more {
+            display: block;
+            margin-bottom: 20px;
+          }
+
+          .list-item {
+            display: flex;
+            justify-content: flex-start;
+            align-items: baseline;
+            vertical-align: middle;
+            width: 100%;
+
+            &.log-comment {
+              align-items: end;
+            }
+
+            .log-item {
+              margin-right: 12px;
+              margin-bottom: 24px;
+
+              .anticon {
+                font-size: 14px;
+              }
+
+              .log-content {
+                overflow: hidden;
+                text-overflow: ellipsis;
+                border-left: 5px solid #ccc;
+                padding-left: 12px;
+                margin-top: 6px;
+              }
+            }
+
+            .log-txt {
+              flex: 1 1;
             }
+          }
+        }
+
+        .footer {
+          padding: 20px 20px 0 20px;
+          display: flex;
         }
+      }
+    }
+  }
+}
+@media (max-width: 574px) {
+  .version-detail {
+    .task-wrap {
+      .task-content {
+        > :nth-child(n + 2) {
+          border-left: 0px solid #e5e5e5;
+        }
+      }
+    }
+  }
+}
+.publish-task-modal {
+  .ant-modal-body {
+    padding: 0.5rem 1rem;
+  }
+
+  .publish-task {
+    overflow: auto;
+
+    .ant-checkbox-group {
+      width: 100%;
     }
+  }
+}
 </style>
diff --git a/src/views/account/setting/base.vue b/src/views/account/setting/base.vue
index cfbb222..2bb780c 100644
--- a/src/views/account/setting/base.vue
+++ b/src/views/account/setting/base.vue
@@ -1,20 +1,21 @@
 <template>
-    <div class="account-setting-base">
-        <wrapper-content :showHeader="false">
-            <div class="setting-content">
-                <account-setting></account-setting>
-                <div class="layout-item right">
-                    <div class="setting-info-title">
-                        <span>基本设置</span>
-                    </div>
-                    <div class="setting-info">
-                        <div class="setting-info-content">
-                            <a-form
-                                    layout="vertical"
-                                    :form="form"
-                                    hideRequiredMark
-                                    @submit.prevent="handleSubmit">
-                                <!-- <a-form-item
+  <div class="account-setting-base">
+    <wrapper-content :showHeader="false">
+      <div class="setting-content">
+        <account-setting></account-setting>
+        <div class="layout-item right">
+          <div class="setting-info-title">
+            <span>基本设置</span>
+          </div>
+          <div class="setting-info">
+            <div class="setting-info-content">
+              <a-form
+                layout="vertical"
+                :form="form"
+                hideRequiredMark
+                @submit.prevent="handleSubmit"
+              >
+                <!-- <a-form-item
                                          label='邮箱'
                                  >
                                      <a-input
@@ -23,188 +24,136 @@
                                              {rules: [{ required: true, message: '请输入您的邮箱' }]}
                                              ]"
                                      />
-                                 </a-form-item>-->
-                                <a-form-item
-                                        label='昵称'
-                                >
-                                    <a-input
-                                            v-decorator="[
+                </a-form-item>-->
+                <a-form-item label="昵称">
+                  <a-input
+                    v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入您的邮箱' }]}
                                             ]"
-                                    />
-                                </a-form-item>
-                                <a-form-item
-                                        label='简介'
-                                >
-                                    <a-textarea placeholder='个人简介'
-                                                :rows="4"
-                                                v-decorator="['description']"
-                                    />
-                                </a-form-item>
-                                <a-form-item
-                                >
-                                    <a-button type='primary' htmlType='submit' :loading="loading">更新基本信息</a-button>
-                                </a-form-item>
-                            </a-form>
-                        </div>
-                        <div class="setting-info-avatar">
-                            <span>头像</span>
-                            <a-avatar class="avatar" :size="150" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
-                            <a-upload
-                                    name="avatar"
-                                    class="avatar-uploader"
-                                    :showUploadList="false"
-                                    :data="{code: userInfo.code}"
-                                    :headers="headers"
-                                    :action="uploadAction"
-                                    :beforeUpload="beforeUpload"
-                                    @change="handleChange"
-                            >
-                                <a-button icon="upload" class="upload">更换头像</a-button>
-                            </a-upload>
-                        </div>
-                    </div>
-                </div>
+                  />
+                </a-form-item>
+                <a-form-item label="简介">
+                  <a-textarea placeholder="个人简介" :rows="4" v-decorator="['description']" />
+                </a-form-item>
+                <a-form-item>
+                  <a-button type="primary" htmlType="submit" :loading="loading">更新基本信息</a-button>
+                </a-form-item>
+              </a-form>
             </div>
-        </wrapper-content>
-    </div>
+            <div class="setting-info-avatar">
+              <span>头像</span>
+              <a-avatar class="avatar" :size="150" :src="userInfo.avatar">{{userInfo.name}}</a-avatar>
+              <a-upload
+                name="avatar"
+                class="avatar-uploader"
+                :showUploadList="false"
+                :data="{code: userInfo.code}"
+                :headers="headers"
+                :action="uploadAction"
+                :beforeUpload="beforeUpload"
+                @change="handleChange"
+              >
+                <a-button icon="upload" class="upload">更换头像</a-button>
+              </a-upload>
+            </div>
+          </div>
+        </div>
+      </div>
+    </wrapper-content>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import AccountSetting from "@/components/layout/account/setting"
-    import {checkResponse, getApiUrl, getAuthorization, getBase64} from "../../../assets/js/utils";
-    import {editPersonal} from "../../../api/user";
-    import {getStore} from "../../../assets/js/storage";
-    import {destroyNotice, notice} from "../../../assets/js/notice";
+import { mapState } from "vuex";
+import AccountSetting from "@/components/layout/account/setting";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+  getBase64,
+} from "../../../assets/js/utils";
+import { editPersonal } from "../../../api/user";
+import { getStore } from "../../../assets/js/storage";
+import { destroyNotice, notice } from "../../../assets/js/notice";
 
-    export default {
-        name: "settingBase",
-        components: {
-            AccountSetting
-        },
-        data() {
-            return {
-                loading: false,
-                form: this.$form.createForm(this),
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/index/uploadAvatar'),
-            }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            }),
-            headers() {
-                return getAuthorization();
+export default {
+  name: "settingBase",
+  components: {
+    AccountSetting,
+  },
+  data() {
+    return {
+      loading: false,
+      form: this.$form.createForm(this),
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/index/uploadAvatar"),
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+    headers() {
+      return getAuthorization();
+    },
+  },
+  mounted() {
+    this.$nextTick(() => {
+      this.form.setFieldsValue({
+        email: this.userInfo.email,
+        name: this.userInfo.name,
+        description: this.userInfo.description,
+      });
+    });
+  },
+  methods: {
+    handleSubmit() {
+      let app = this;
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          let obj = app.form.getFieldsValue();
+          obj.code = app.userInfo.code;
+          obj.avatar = app.userInfo.avatar;
+          editPersonal(obj).then((res) => {
+            app.loading = false;
+            if (!checkResponse(res)) {
+              return;
             }
-        },
-        mounted() {
-            this.$nextTick(() => {
-                this.form.setFieldsValue({
-                    email: this.userInfo.email,
-                    name: this.userInfo.name,
-                    description: this.userInfo.description,
-                });
-            })
-        },
-        methods: {
-            handleSubmit() {
-                let app = this;
-                this.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            let obj = app.form.getFieldsValue();
-                            obj.code = app.userInfo.code;
-                            obj.avatar = app.userInfo.avatar;
-                            editPersonal(obj).then(res => {
-                                app.loading = false;
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.userInfo.email = obj.email;
-                                app.userInfo.name = obj.name;
-                                app.userInfo.name = obj.name;
-                                app.userInfo.description = obj.description;
-                                app.$store.dispatch('SET_USER', app.userInfo);
-                            });
-                        }
-                    },
-                );
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    notice(`正在上传，请稍后...`, 'message', 'loading', 0);
-                    this.uploadLoading = true;
-                    return
-                }
-                if (info.file.status === 'done') {
-                    getBase64(info.file.originFileObj, (imageUrl) => {
-                        this.userInfo.avatar = info.file.response.data.url;
-                        this.$store.dispatch('SET_USER', this.userInfo);
-                        this.uploadLoading = false;
-                        setTimeout(function () {
-                            destroyNotice()
-                        }, 500)
-                        // this.$store.dispatch('SET_USER', this.userInfo);
-                    })
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('图片不能超过2MB!')
-                }
-                return isLt2M
-            },
+            app.userInfo.email = obj.email;
+            app.userInfo.name = obj.name;
+            app.userInfo.name = obj.name;
+            app.userInfo.description = obj.description;
+            app.$store.dispatch("SET_USER", app.userInfo);
+          });
         }
-    }
+      });
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        notice(`正在上传，请稍后...`, "message", "loading", 0);
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        getBase64(info.file.originFileObj, (imageUrl) => {
+          this.userInfo.avatar = info.file.response.data.url;
+          this.$store.dispatch("SET_USER", this.userInfo);
+          this.uploadLoading = false;
+          setTimeout(function () {
+            destroyNotice();
+          }, 500);
+          // this.$store.dispatch('SET_USER', this.userInfo);
+        });
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("图片不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
 </script>
-
-<style lang="less">
-    .account-setting-base {
-        .wrapper-main {
-            padding-left: 0;
-        }
-
-        .setting-content {
-            display: flex;
-            flex-direction: row;
-
-            .right {
-                flex: 1 1 0;
-                padding: 8px 40px;
-
-                .setting-info-title {
-                    font-size: 20px;
-                }
-
-                .setting-info {
-                    display: flex;
-                    flex-direction: row;
-                    padding-top: 12px;
-
-                    &-content {
-                        width: 320px;
-                    }
-
-                    &-avatar {
-                        padding-left: 104px;
-                        display: flex;
-                        flex-direction: column;
-
-                        .avatar {
-                            margin-top: 12px;
-                        }
-
-                        .avatar-uploader {
-                            width: 115px;
-                            margin: 24px auto;
-                        }
-                    }
-                }
-            }
-        }
-    }
-</style>
diff --git a/src/views/account/setting/security.vue b/src/views/account/setting/security.vue
index 20fc4be..7025f70 100644
--- a/src/views/account/setting/security.vue
+++ b/src/views/account/setting/security.vue
@@ -1,511 +1,502 @@
 <template>
-    <div class="account-setting-security">
-        <wrapper-content :showHeader="false">
-            <div class="setting-content">
-                <account-setting :keys="['security']"></account-setting>
-                <div class="layout-item right">
-                    <div class="setting-info-title">
-                        <span>安全设置</span>
+  <div class="account-setting-security">
+    <wrapper-content :showHeader="false">
+      <div class="setting-content">
+        <account-setting :keys="['security']"></account-setting>
+        <div class="layout-item right">
+          <div class="setting-info-title">
+            <span>安全设置</span>
+          </div>
+          <div class="setting-info">
+            <div class="setting-info-content">
+              <div class="ant-list ant-list-split">
+                <div class="ant-spin-nested-loading">
+                  <div class="ant-spin-container">
+                    <div class="ant-list-item">
+                      <div class="ant-list-item-meta">
+                        <div class="ant-list-item-meta-content">
+                          <h4 class="ant-list-item-meta-title">
+                            <a>账户密码</a>
+                          </h4>
+                          <div class="ant-list-item-meta-description">
+                            <span>
+                              <span class="security-list-description">当前密码强度 : 强</span>
+                            </span>
+                          </div>
+                        </div>
+                      </div>
+                      <ul class="ant-list-item-action">
+                        <li @click="editPassword">
+                          <a>修改</a>
+                        </li>
+                      </ul>
+                    </div>
+                    <div class="ant-list-item">
+                      <div class="ant-list-item-meta">
+                        <div class="ant-list-item-meta-content">
+                          <h4 class="ant-list-item-meta-title">
+                            <a>手机账号</a>
+                          </h4>
+                          <div class="ant-list-item-meta-description">
+                            <span>
+                              <span class="security-list-description">
+                                <span v-if="userInfo.mobile">已绑定手机 : {{userInfo.mobile}}</span>
+                                <span v-else>未绑定手机</span>
+                              </span>
+                            </span>
+                          </div>
+                        </div>
+                      </div>
+                      <ul class="ant-list-item-action">
+                        <li @click="editMobile">
+                          <a>
+                            <span v-if="userInfo.mobile">修改</span>
+                            <span v-else>绑定</span>
+                          </a>
+                        </li>
+                      </ul>
                     </div>
-                    <div class="setting-info">
-                        <div class="setting-info-content">
-                            <div class="ant-list ant-list-split">
-                                <div class="ant-spin-nested-loading">
-                                    <div class="ant-spin-container">
-                                        <div class="ant-list-item">
-                                            <div class="ant-list-item-meta">
-                                                <div class="ant-list-item-meta-content">
-                                                    <h4 class="ant-list-item-meta-title"><a>账户密码</a></h4>
-                                                    <div class="ant-list-item-meta-description">
-                                                        <span>
-                                                            <span class="security-list-description">当前密码强度 : 强</span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <ul class="ant-list-item-action">
-                                                <li @click="editPassword"><a>修改</a></li>
-                                            </ul>
-                                        </div>
-                                        <div class="ant-list-item">
-                                            <div class="ant-list-item-meta">
-                                                <div class="ant-list-item-meta-content">
-                                                    <h4 class="ant-list-item-meta-title"><a>手机账号</a></h4>
-                                                    <div class="ant-list-item-meta-description">
-                                                        <span>
-                                                            <span class="security-list-description">
-                                                                <span v-if="userInfo.mobile">已绑定手机 : {{userInfo.mobile}}</span>
-                                                                <span v-else>未绑定手机</span>
-                                                            </span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <ul class="ant-list-item-action">
-                                                <li @click="editMobile"><a>
-                                                    <span v-if="userInfo.mobile">修改</span>
-                                                    <span v-else>绑定</span>
-                                                </a></li>
-                                            </ul>
-                                        </div>
-                                        <div class="ant-list-item">
-                                            <div class="ant-list-item-meta">
-                                                <div class="ant-list-item-meta-content">
-                                                    <h4 class="ant-list-item-meta-title"><a>邮箱帐号</a></h4>
-                                                    <div class="ant-list-item-meta-description">
-                                                        <span>
-                                                            <span class="security-list-description">
-                                                                  <span v-if="userInfo.email">已绑定邮箱 : {{userInfo.email}}</span>
-                                                                <span v-else>未绑定邮箱</span>
-                                                            </span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <ul class="ant-list-item-action">
-                                                <li @click="editMail"><a>
-                                                    <span v-if="userInfo.email">修改</span>
-                                                    <span v-else>绑定</span>
-                                                </a></li>
-                                            </ul>
-                                        </div>
-                                        <div class="ant-list-item">
-                                            <div class="ant-list-item-meta">
-                                                <div class="ant-list-item-meta-content">
-                                                    <h4 class="ant-list-item-meta-title"><a>钉钉账号</a></h4>
-                                                    <div class="ant-list-item-meta-description">
-                                                        <span>
-                                                            <span class="security-list-description">
-                                                                  <span v-if="userInfo.dingtalk_unionid">已绑定</span>
-                                                                <span v-else>未绑定钉钉账号</span>
-                                                            </span>
-                                                        </span>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <ul class="ant-list-item-action">
-                                                <li v-if="userInfo.dingtalk_unionid" @click="unbindDingtalk"><a>解除绑定</a></li>
-                                                <li v-else @click="bindDingtalk"><a>绑定</a></li>
-                                            </ul>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
+                    <div class="ant-list-item">
+                      <div class="ant-list-item-meta">
+                        <div class="ant-list-item-meta-content">
+                          <h4 class="ant-list-item-meta-title">
+                            <a>邮箱帐号</a>
+                          </h4>
+                          <div class="ant-list-item-meta-description">
+                            <span>
+                              <span class="security-list-description">
+                                <span v-if="userInfo.email">已绑定邮箱 : {{userInfo.email}}</span>
+                                <span v-else>未绑定邮箱</span>
+                              </span>
+                            </span>
+                          </div>
                         </div>
+                      </div>
+                      <ul class="ant-list-item-action">
+                        <li @click="editMail">
+                          <a>
+                            <span v-if="userInfo.email">修改</span>
+                            <span v-else>绑定</span>
+                          </a>
+                        </li>
+                      </ul>
                     </div>
+                    <div class="ant-list-item">
+                      <div class="ant-list-item-meta">
+                        <div class="ant-list-item-meta-content">
+                          <h4 class="ant-list-item-meta-title">
+                            <a>钉钉账号</a>
+                          </h4>
+                          <div class="ant-list-item-meta-description">
+                            <span>
+                              <span class="security-list-description">
+                                <span v-if="userInfo.dingtalk_unionid">已绑定</span>
+                                <span v-else>未绑定钉钉账号</span>
+                              </span>
+                            </span>
+                          </div>
+                        </div>
+                      </div>
+                      <ul class="ant-list-item-action">
+                        <li v-if="userInfo.dingtalk_unionid" @click="unbindDingtalk">
+                          <a>解除绑定</a>
+                        </li>
+                        <li v-else @click="bindDingtalk">
+                          <a>绑定</a>
+                        </li>
+                      </ul>
+                    </div>
+                  </div>
                 </div>
+              </div>
             </div>
-        </wrapper-content>
-        <a-modal
-                :width="385"
-                v-model="passwordInfo.modalStatus"
-                :title="passwordInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-alert style="margin-bottom: 12px;"
-                     v-show="errorTips"
-                     :message="errorTips"
-                     type="error"
-            />
-            <a-form
-                    layout="vertical"
-                    :form="form"
-                    :autoFormCreate="(form)=>{this.form = form}"
-                    hideRequiredMark
-                    @submit.prevent="handlePasswordSubmit">
-                <a-form-item
-                        label='原密码'
-                >
-                    <a-input
-                            type="password"
-                            v-decorator="[
+          </div>
+        </div>
+      </div>
+    </wrapper-content>
+    <a-modal
+      :width="385"
+      v-model="passwordInfo.modalStatus"
+      :title="passwordInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-alert style="margin-bottom: 12px;" v-show="errorTips" :message="errorTips" type="error" />
+      <a-form
+        layout="vertical"
+        :form="form"
+        :autoFormCreate="(form)=>{this.form = form}"
+        hideRequiredMark
+        @submit.prevent="handlePasswordSubmit"
+      >
+        <a-form-item label="原密码">
+          <a-input
+            type="password"
+            v-decorator="[
                                             'password',
                                             {rules: [{ required: true, message: '请输入原密码' }]}
                                             ]"
-                    />
-                </a-form-item>
-                <a-form-item
-                        label='新密码'
-                >
-                    <a-input
-                            type="password"
-                            v-decorator="[
+          />
+        </a-form-item>
+        <a-form-item label="新密码">
+          <a-input
+            type="password"
+            v-decorator="[
                                             'newPassword',
                                             {rules: [{ required: true, message: '请输入新密码' }]}
                                             ]"
-                    />
-                </a-form-item>
-                <a-form-item
-                        label='确认新密码'
-                >
-                    <a-input
-                            type="password"
-                            v-decorator="[
+          />
+        </a-form-item>
+        <a-form-item label="确认新密码">
+          <a-input
+            type="password"
+            v-decorator="[
                                             'confirmPassword',
                                             {rules: [{ required: true, message: '请确认新密码' }]}
                                             ]"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-button type='primary' htmlType='submit' block size="large">保存</a-button>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                class="mobile-modal"
-                :width="385"
-                v-model="mobileInfo.modalStatus"
-                :title="mobileInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-alert style="margin-bottom: 12px;"
-                     v-show="errorTips"
-                     :message="errorTips"
-                     type="error"
-            />
-            <a-form
-                    layout="vertical"
-                    :form="mobileForm"
-                    hideRequiredMark
-                    @submit.prevent="handleMobileSubmit">
-                <a-form-item
-                >
-                    <a-input size="large" type="text" placeholder="手机号"
-                             v-decorator="[
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-button type="primary" htmlType="submit" block size="large">保存</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      class="mobile-modal"
+      :width="385"
+      v-model="mobileInfo.modalStatus"
+      :title="mobileInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-alert style="margin-bottom: 12px;" v-show="errorTips" :message="errorTips" type="error" />
+      <a-form
+        layout="vertical"
+        :form="mobileForm"
+        hideRequiredMark
+        @submit.prevent="handleMobileSubmit"
+      >
+        <a-form-item>
+          <a-input
+            size="large"
+            type="text"
+            placeholder="手机号"
+            v-decorator="[
                                 'mobile',
                                 {rules: [{ required: true, pattern: /^1[34578]\d{9}$/, message: '请输入正确的手机号' }], validateTrigger: 'change'}
-                            ]">
-                        <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                    </a-input>
-                </a-form-item>
+                            ]"
+          >
+            <a-icon slot="prefix" type="mobile" :style="{ color: 'rgba(0,0,0,.25)' }" />
+          </a-input>
+        </a-form-item>
 
-                <a-row :gutter="16">
-                    <a-col class="gutter-row" :span="16">
-                        <a-form-item
-                        >
-                            <a-input size="large" type="text" placeholder="验证码"
-                                     v-decorator="[
+        <a-row :gutter="16">
+          <a-col class="gutter-row" :span="13">
+            <a-form-item>
+              <a-input
+                size="large"
+                type="text"
+                placeholder="验证码"
+                v-decorator="[
                                 'captcha',
                                 {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}
-                            ]">
-                                <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                            </a-input>
-                        </a-form-item>
-                    </a-col>
-                    <a-col class="gutter-row" :span="8">
-                        <a-button
-                                class="getCaptcha"
-                                size="large"
-                                tabindex="-1"
-                                :disabled="mobileInfo.state.smsSendBtn"
-                                @click.stop.prevent="getCaptcha"
-                                v-text="!mobileInfo.state.smsSendBtn && '获取验证码' || (mobileInfo.state.time+' s')"
-                        ></a-button>
-                    </a-col>
-                </a-row>
-                <a-form-item
-                >
-                    <a-button type='primary' htmlType='submit' block size="large" :loading="mobileInfo.confirmLoading"
-                              :disabled="mobileInfo.confirmLoading">绑定
-                    </a-button>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                class="mail-modal"
-                :width="385"
-                v-model="mailInfo.modalStatus"
-                :title="mailInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-alert style="margin-bottom: 12px;"
-                     v-show="errorTips"
-                     :message="errorTips"
-                     type="error"
-            />
-            <a-form
-                    layout="vertical"
-                    :form="mailForm"
-                    hideRequiredMark
-                    @submit.prevent="handleMailSubmit">
-                <a-form-item
-                >
-                    <a-input size="large" type="text" placeholder="邮箱地址"
-                             v-decorator="[
+                            ]"
+              >
+                <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }" />
+              </a-input>
+            </a-form-item>
+          </a-col>
+          <a-col class="gutter-row" :span="11">
+            <a-button
+              class="getCaptcha"
+              size="large"
+              tabindex="-1"
+              :disabled="mobileInfo.state.smsSendBtn"
+              @click.stop.prevent="getCaptcha"
+              v-text="!mobileInfo.state.smsSendBtn && '获取验证码' || (mobileInfo.state.time+' s')"
+            ></a-button>
+          </a-col>
+        </a-row>
+        <a-form-item>
+          <a-button
+            type="primary"
+            htmlType="submit"
+            block
+            size="large"
+            :loading="mobileInfo.confirmLoading"
+            :disabled="mobileInfo.confirmLoading"
+          >绑定</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      class="mail-modal"
+      :width="385"
+      v-model="mailInfo.modalStatus"
+      :title="mailInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-alert style="margin-bottom: 12px;" v-show="errorTips" :message="errorTips" type="error" />
+      <a-form
+        layout="vertical"
+        :form="mailForm"
+        hideRequiredMark
+        @submit.prevent="handleMailSubmit"
+      >
+        <a-form-item>
+          <a-input
+            size="large"
+            type="text"
+            placeholder="邮箱地址"
+            v-decorator="[
                                 'mail',
                                 {rules: [{ required: true, pattern: /^([a-zA-Z0-9_-])+@([a-zA-Z0-9_-])+((\.[a-zA-Z0-9_-]{2,3}){1,2})$/, message: '请输入正确的邮箱地址' }], validateTrigger: 'change'}
-                            ]">
-                        <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                    </a-input>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-button type='primary' htmlType='submit' block size="large" :loading="mailInfo.confirmLoading"
-                              :disabled="mailInfo.confirmLoading">保存
-                    </a-button>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+                            ]"
+          >
+            <a-icon slot="prefix" type="mail" :style="{ color: 'rgba(0,0,0,.25)' }" />
+          </a-input>
+        </a-form-item>
+        <a-form-item>
+          <a-button
+            type="primary"
+            htmlType="submit"
+            block
+            size="large"
+            :loading="mailInfo.confirmLoading"
+            :disabled="mailInfo.confirmLoading"
+          >保存</a-button>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import md5 from 'md5'
-    import {mapState} from 'vuex'
-    import AccountSetting from "@/components/layout/account/setting"
-    import {checkResponse} from "../../../assets/js/utils";
-    import {_bindMail, _bindMobile, _unbindDingtalk, editPassword, getCaptcha} from "../../../api/user";
-    import {dingTalkOauth} from "../../../api/oauth";
+import md5 from "md5";
+import { mapState } from "vuex";
+import AccountSetting from "@/components/layout/account/setting";
+import { checkResponse } from "../../../assets/js/utils";
+import {
+  _bindMail,
+  _bindMobile,
+  _unbindDingtalk,
+  editPassword,
+  getCaptcha,
+} from "../../../api/user";
+import { dingTalkOauth } from "../../../api/oauth";
 
-    export default {
-        name: "settingSecurity",
-        components: {
-            AccountSetting
+export default {
+  name: "settingSecurity",
+  components: {
+    AccountSetting,
+  },
+  data() {
+    return {
+      form: this.$form.createForm(this),
+      mobileForm: this.$form.createForm(this),
+      mailForm: this.$form.createForm(this),
+      errorTips: "",
+      passwordInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "修改密码",
+        okText: "保存",
+        cancelText: "放弃",
+      },
+      mobileInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "修改手机",
+        okText: "保存",
+        cancelText: "放弃",
+        state: {
+          time: 60,
+          smsSendBtn: false,
         },
-        data() {
-            return {
-                form: this.$form.createForm(this),
-                mobileForm: this.$form.createForm(this),
-                mailForm: this.$form.createForm(this),
-                errorTips: '',
-                passwordInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '修改密码',
-                    okText: '保存',
-                    cancelText: '放弃',
-                },
-                mobileInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '修改手机',
-                    okText: '保存',
-                    cancelText: '放弃',
-                    state: {
-                        time: 60,
-                        smsSendBtn: false
-                    },
-                },
-                mailInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '修改邮箱',
-                    okText: '保存',
-                    cancelText: '放弃',
-                    state: {
-                        time: 60,
-                        smsSendBtn: false
-                    },
-                },
-            }
+      },
+      mailInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "修改邮箱",
+        okText: "保存",
+        cancelText: "放弃",
+        state: {
+          time: 60,
+          smsSendBtn: false,
         },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            })
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  methods: {
+    editPassword() {
+      this.passwordInfo.modalStatus = true;
+    },
+    editMobile() {
+      this.mobileInfo.modalStatus = true;
+    },
+    editMail() {
+      this.mailInfo.modalStatus = true;
+    },
+    bindDingtalk() {
+      let url =
+        dingTalkOauth() +
+        "?redirectPath=" +
+        this.$route.fullPath +
+        "&bindDingtalk=1";
+      location.href = url;
+    },
+    unbindDingtalk() {
+      let app = this;
+      this.$confirm({
+        title: "确认解绑",
+        content: `解除绑定后将无法使用该帐号进行登录`,
+        okText: "确定",
+        okType: "danger",
+        cancelText: `再想想`,
+        onOk() {
+          _unbindDingtalk().then((res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
+            }
+            app.$store.dispatch("SET_USER", res.data);
+          });
+          return Promise.resolve();
         },
-        methods: {
-            editPassword() {
-                this.passwordInfo.modalStatus = true;
-            },
-            editMobile() {
-                this.mobileInfo.modalStatus = true;
-            },
-            editMail() {
-                this.mailInfo.modalStatus = true;
-            },
-            bindDingtalk() {
-                let url = dingTalkOauth() + '?redirectPath=' + this.$route.fullPath + '&bindDingtalk=1';
-                location.href = url;
-            },
-            unbindDingtalk() {
-                let app = this;
-                this.$confirm({
-                    title: '确认解绑',
-                    content: `解除绑定后将无法使用该帐号进行登录`,
-                    okText: '确定',
-                    okType: 'danger',
-                    cancelText: `再想想`,
-                    onOk() {
-                        _unbindDingtalk().then((res) => {
-                            const result = checkResponse(res);
-                            if (!result) {
-                                return false;
-                            }
-                            app.$store.dispatch('SET_USER', res.data);
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            handlePasswordSubmit() {
-                let app = this;
-                this.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            let obj = app.form.getFieldsValue();
-                            if (obj.password.length < 6 || obj.newPassword.length < 6 || obj.confirmPassword.length < 6) {
-                                this.setErrorTips('密码必须包含6个字符');
-                                return false;
-                            }
-                            if (obj.newPassword != obj.confirmPassword) {
-                                this.setErrorTips('两次新密码不匹配');
-                                return false;
-                            }
-                            this.setErrorTips('');
-                            obj.id = app.userInfo.id;
-                            obj.password = md5(obj.password);
-                            obj.newPassword = md5(obj.newPassword);
-                            obj.confirmPassword = md5(obj.confirmPassword);
-                            editPassword(obj).then(res => {
-                                app.loading = false;
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                this.passwordInfo.modalStatus = false;
-                                app.form && app.form.resetFields();
-                            });
-                        }
-                    },
-                );
-            },
-            handleMobileSubmit() {
-                let app = this;
-                this.mobileForm.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            let obj = app.mobileForm.getFieldsValue();
-                            this.setErrorTips('');
-                            app.mobileInfo.confirmLoading = true;
-                            _bindMobile(obj).then(res => {
-                                app.mobileInfo.confirmLoading = false;
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                const obj = {
-                                    userInfo: res.data.member,
-                                    tokenList: res.data.tokenList
-                                };
-                                app.$store.dispatch('SET_LOGGED', obj);
-                                this.mobileInfo.modalStatus = false;
-                                app.mobileForm && app.mobileForm.resetFields();
-                            });
-                        }
-                    },
-                );
-            },
-            handleMailSubmit() {
-                let app = this;
-                this.mailForm.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            let obj = app.mailForm.getFieldsValue();
-                            this.setErrorTips('');
-                            app.mailInfo.confirmLoading = true;
-                            _bindMail(obj).then(res => {
-                                app.mailInfo.confirmLoading = false;
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                this.mailInfo.modalStatus = false;
-                                app.mailForm && app.mailForm.resetFields();
-                            });
-                        }
-                    },
-                );
-            },
-            setErrorTips(content = '') {
-                this.errorTips = content;
-            },
-            getCaptcha(e) {
-                e.preventDefault();
-                const app = this;
-
-                this.mobileForm.validateFields(['mobile'], {force: true}, (err, values) => {
-                    if (!err) {
-                        this.mobileInfo.state.smsSendBtn = true;
-
-                        const interval = window.setInterval(() => {
-                            if (app.mobileInfo.state.time-- <= 0) {
-                                app.mobileInfo.state.time = 60;
-                                app.mobileInfo.state.smsSendBtn = false;
-                                window.clearInterval(interval)
-                            }
-                        }, 1000);
-
-                        const hide = this.$message.loading('验证码发送中..', 0);
-                        getCaptcha(values.mobile)
-                            .then(res => {
-                                this.$message.destroy();
-
-                                if (!checkResponse(res)) {
-                                    return false;
-                                }
-                                let tips = '验证码获取成功';
-                                if (res.data) {
-                                    tips += '，您的验证码为：' + res.data;
-                                }
-                                this.$notification['success']({
-                                    message: '提示',
-                                    description: tips,
-                                    duration: 8,
-                                    placement: 'bottomLeft'
-                                });
-                            })
-                            .catch(err => {
-                                // setTimeout(hide, 1);
-                                clearInterval(interval);
-                                app.mobileInfo.state.time = 60;
-                                app.mobileInfo.state.smsSendBtn = false;
-                                this.requestFailed(err)
-                            })
-                    }
-                })
-            },
+      });
+    },
+    handlePasswordSubmit() {
+      let app = this;
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          let obj = app.form.getFieldsValue();
+          if (
+            obj.password.length < 6 ||
+            obj.newPassword.length < 6 ||
+            obj.confirmPassword.length < 6
+          ) {
+            this.setErrorTips("密码必须包含6个字符");
+            return false;
+          }
+          if (obj.newPassword != obj.confirmPassword) {
+            this.setErrorTips("两次新密码不匹配");
+            return false;
+          }
+          this.setErrorTips("");
+          obj.id = app.userInfo.id;
+          obj.password = md5(obj.password);
+          obj.newPassword = md5(obj.newPassword);
+          obj.confirmPassword = md5(obj.confirmPassword);
+          editPassword(obj).then((res) => {
+            app.loading = false;
+            if (!checkResponse(res)) {
+              return;
+            }
+            this.passwordInfo.modalStatus = false;
+            app.form && app.form.resetFields();
+          });
         }
-    }
-</script>
-
-<style lang="less">
-    .account-setting-security {
-        .wrapper-main {
-            padding-left: 0;
+      });
+    },
+    handleMobileSubmit() {
+      let app = this;
+      this.mobileForm.validateFields((err, values) => {
+        if (!err) {
+          let obj = app.mobileForm.getFieldsValue();
+          this.setErrorTips("");
+          app.mobileInfo.confirmLoading = true;
+          _bindMobile(obj).then((res) => {
+            app.mobileInfo.confirmLoading = false;
+            if (!checkResponse(res)) {
+              return;
+            }
+            const obj = {
+              userInfo: res.data.member,
+              tokenList: res.data.tokenList,
+            };
+            app.$store.dispatch("SET_LOGGED", obj);
+            this.mobileInfo.modalStatus = false;
+            app.mobileForm && app.mobileForm.resetFields();
+          });
         }
+      });
+    },
+    handleMailSubmit() {
+      let app = this;
+      this.mailForm.validateFields((err, values) => {
+        if (!err) {
+          let obj = app.mailForm.getFieldsValue();
+          this.setErrorTips("");
+          app.mailInfo.confirmLoading = true;
+          _bindMail(obj).then((res) => {
+            app.mailInfo.confirmLoading = false;
+            if (!checkResponse(res)) {
+              return;
+            }
+            this.mailInfo.modalStatus = false;
+            app.mailForm && app.mailForm.resetFields();
+          });
+        }
+      });
+    },
+    setErrorTips(content = "") {
+      this.errorTips = content;
+    },
+    getCaptcha(e) {
+      e.preventDefault();
+      const app = this;
 
-        .setting-content {
-            display: flex;
-            flex-direction: row;
-
-            .right {
-                flex: 1 1 0;
-                padding: 8px 40px;
+      this.mobileForm.validateFields(
+        ["mobile"],
+        { force: true },
+        (err, values) => {
+          if (!err) {
+            this.mobileInfo.state.smsSendBtn = true;
 
-                .setting-info-title {
-                    font-size: 20px;
-                }
+            const interval = window.setInterval(() => {
+              if (app.mobileInfo.state.time-- <= 0) {
+                app.mobileInfo.state.time = 60;
+                app.mobileInfo.state.smsSendBtn = false;
+                window.clearInterval(interval);
+              }
+            }, 1000);
 
-                .setting-info {
-                    display: flex;
-                    flex-direction: row;
-                    padding-top: 12px;
+            const hide = this.$message.loading("验证码发送中..", 0);
+            getCaptcha(values.mobile)
+              .then((res) => {
+                this.$message.destroy();
 
-                    &-content {
-                        width: 100%;
-                    }
+                if (!checkResponse(res)) {
+                  return false;
                 }
-            }
-        }
-    }
-
-    .mobile-modal {
-        .getCaptcha {
-            display: block;
-            width: 100%;
-            height: 40px;
+                let tips = "验证码获取成功";
+                if (res.data) {
+                  tips += "，您的验证码为：" + res.data;
+                }
+                this.$notification["success"]({
+                  message: "提示",
+                  description: tips,
+                  duration: 8,
+                  placement: "bottomLeft",
+                });
+              })
+              .catch((err) => {
+                // setTimeout(hide, 1);
+                clearInterval(interval);
+                app.mobileInfo.state.time = 60;
+                app.mobileInfo.state.smsSendBtn = false;
+                this.requestFailed(err);
+              });
+          }
         }
-    }
-</style>
+      );
+    },
+  },
+};
+</script>
diff --git a/src/views/project/analysis/index.vue b/src/views/project/analysis/index.vue
index 7f827fa..5a7c12f 100644
--- a/src/views/project/analysis/index.vue
+++ b/src/views/project/analysis/index.vue
@@ -1,385 +1,431 @@
 <template>
-    <div class="analysis-index">
-        <div class="page-wrapper">
-            <a-row :gutter="24">
-                <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-                    <chart-card :loading="loading" title="项目总数" :total="projectData.count | NumberFormat">
-                        <a-tooltip title="指标说明" slot="action">
-                            <a-icon type="info-circle-o"/>
-                        </a-tooltip>
-                        <div class="chart-wrapper">
-                            <ve-histogram
-                                    :data="projectData.chartData"
-                                    :settings="projectData.chartSettings"
-                                    :extend="chartExtend"
-                                    :legend-visible="false"
-                                    height="55px"></ve-histogram>
-                        </div>
-                        <template slot="footer">本月立项 <span>3</span></template>
-                    </chart-card>
-                </a-col>
-                <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-                    <chart-card :loading="loading" title="任务总数" :total="taskData.count | NumberFormat">
-                        <a-tooltip title="指标说明" slot="action">
-                            <a-icon type="info-circle-o"/>
-                        </a-tooltip>
-                        <div>
-                            <div class="chart-wrapper">
-                                <ve-line
-                                        :data="taskData.chartData"
-                                        :settings="taskData.chartSettings"
-                                        :extend="chartExtend"
-                                        :legend-visible="false"
-                                        height="55px"></ve-line>
-                            </div>
-                        </div>
-                        <template slot="footer">今日任务<span> {{ '8' | NumberFormat }}</span></template>
-                    </chart-card>
-                </a-col>
-                <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-                    <chart-card :loading="loading" title="逾期任务" :total="taskData.taskOverdueCount | NumberFormat">
-                        <a-tooltip title="指标说明" slot="action">
-                            <a-icon type="info-circle-o"/>
-                        </a-tooltip>
-                        <div>
-                            <trend flag="up" style="margin-right: 16px;">
-                                <span slot="term">周同比</span>
-                                12%
-                            </trend>
-                            <trend flag="down">
-                                <span slot="term">日同比</span>
-                                11%
-                            </trend>
-                        </div>
-                        <template slot="footer">逾期率 <span>{{taskData.taskOverduePercent}}%</span></template>
-                    </chart-card>
-                </a-col>
-                <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
-                    <chart-card :loading="loading" title="整体进度" :total="`${projectData.projectSchedule}%`">
-                        <a-tooltip title="指标说明" slot="action">
-                            <a-icon type="info-circle-o"/>
-                        </a-tooltip>
-                        <div>
-                            <mini-progress color="#ffd401" :target="80" :percentage="projectData.projectSchedule" height="8px"/>
-                        </div>
-                        <template slot="footer">
-                            <trend flag="down" style="margin-right: 16px;">
-                                <span slot="term">周同比</span>
-                                12%
-                            </trend>
-                            <trend flag="up">
-                                <span slot="term">日环比</span>
-                                80%
-                            </trend>
-                        </template>
-                    </chart-card>
-                </a-col>
-            </a-row>
-            <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
-                <div class="salesCard">
-                    <a-tabs default-active-key="1" size="large"
-                            :tab-bar-style="{marginBottom: '24px', paddingLeft: '16px'}">
-                        <div class="extra-wrapper" slot="tabBarExtraContent">
-                            <div class="extra-item">
-                                <a>今日</a>
-                                <a>本周</a>
-                                <a>本月</a>
-                                <a>本年</a>
-                            </div>
-                            <a-range-picker :style="{width: '256px'}"/>
-                        </div>
-                        <a-tab-pane forceRender tab="项目数" key="1">
-                            <a-row>
-                                <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                                    <div class="chart-wrappers-single">
-                                        <ve-histogram
-                                                :data="projectTotalData.chartData"
-                                                :settings="projectTotalData.chartSettings"
-                                                :extend="projectTotalData.chartExtend"
-                                                :legend-visible="false"
-                                                height="300px"></ve-histogram>
-                                    </div>
-                                </a-col>
-                                <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                                    <rank-list title="项目数排行榜" :list="rankList"/>
-                                </a-col>
-                            </a-row>
-                        </a-tab-pane>
-                        <a-tab-pane forceRender tab="任务数" key="2">
-                            <a-row>
-                                <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
-                                    <div class="chart-wrappers-single">
-                                        <ve-histogram
-                                                :data="projectTotalData.chartData"
-                                                :settings="projectTotalData.chartSettings"
-                                                :extend="projectTotalData.chartExtend"
-                                                :legend-visible="false"
-                                                height="300px"></ve-histogram>
-                                    </div>
-                                </a-col>
-                                <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
-                                    <rank-list title="任务数排行榜" :list="rankList"/>
-                                </a-col>
-                            </a-row>
-                        </a-tab-pane>
-                    </a-tabs>
-                </div>
-            </a-card>
-            <a-row :gutter="12">
-                <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
-                    <a-card :loading="loading" :bordered="false" title="我的项目" :style="{ marginTop: '24px' }">
-                        <a-dropdown :trigger="['click']" placement="bottomLeft" slot="extra">
-                            <a class="ant-dropdown-link" href="#">
-                                <a-icon type="ellipsis"/>
-                            </a>
-                            <a-menu slot="overlay">
-                                <a-menu-item>
-                                    <a href="javascript:;">操作一</a>
-                                </a-menu-item>
-                                <a-menu-item>
-                                    <a href="javascript:;">操作二</a>
-                                </a-menu-item>
-                            </a-menu>
-                        </a-dropdown>
-                        <p v-for="project in projectList" :key="project.id">{{project.name}}</p>
-                        <a-pagination v-model="pagination.page" :total="projectTotal"  size="small" @change="pageChange"/>
-                    </a-card>
-                </a-col>
-                <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
-                    <a-card :loading="loading" :bordered="false" title="任务优先级分布" :style="{ marginTop: '24px' }">
-                        <a-dropdown :trigger="['click']" placement="bottomLeft" slot="extra">
-                            <a class="ant-dropdown-link" href="#">
-                                <a-icon type="ellipsis"/>
-                            </a>
-                            <a-menu slot="overlay">
-                                <a-menu-item>
-                                    <a href="javascript:;">操作一</a>
-                                </a-menu-item>
-                                <a-menu-item>
-                                    <a href="javascript:;">操作二</a>
-                                </a-menu-item>
-                            </a-menu>
-                        </a-dropdown>
-                        <p>card content</p>
-                        <p>card content</p>
-                        <p>card content</p>
-                    </a-card>
-                </a-col>
-            </a-row>
-        </div>
+  <div class="analysis-index">
+    <div class="page-wrapper">
+      <a-row :gutter="24">
+        <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+          <chart-card :loading="loading" title="项目总数" :total="projectData.count | NumberFormat">
+            <a-tooltip title="指标说明" slot="action">
+              <a-icon type="info-circle-o" />
+            </a-tooltip>
+            <div class="chart-wrapper">
+              <ve-histogram
+                :data="projectData.chartData"
+                :settings="projectData.chartSettings"
+                :extend="chartExtend"
+                :legend-visible="false"
+                height="55px"
+              ></ve-histogram>
+            </div>
+            <template slot="footer">
+              本月立项
+              <span>3</span>
+            </template>
+          </chart-card>
+        </a-col>
+        <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+          <chart-card :loading="loading" title="任务总数" :total="taskData.count | NumberFormat">
+            <a-tooltip title="指标说明" slot="action">
+              <a-icon type="info-circle-o" />
+            </a-tooltip>
+            <div>
+              <div class="chart-wrapper">
+                <ve-line
+                  :data="taskData.chartData"
+                  :settings="taskData.chartSettings"
+                  :extend="chartExtend"
+                  :legend-visible="false"
+                  height="55px"
+                ></ve-line>
+              </div>
+            </div>
+            <template slot="footer">
+              今日任务
+              <span>{{ '8' | NumberFormat }}</span>
+            </template>
+          </chart-card>
+        </a-col>
+        <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+          <chart-card
+            :loading="loading"
+            title="逾期任务"
+            :total="taskData.taskOverdueCount | NumberFormat"
+          >
+            <a-tooltip title="指标说明" slot="action">
+              <a-icon type="info-circle-o" />
+            </a-tooltip>
+            <div>
+              <trend flag="up" style="margin-right: 16px;">
+                <span slot="term">周同比</span>
+                12%
+              </trend>
+              <trend flag="down">
+                <span slot="term">日同比</span>
+                11%
+              </trend>
+            </div>
+            <template slot="footer">
+              逾期率
+              <span>{{taskData.taskOverduePercent}}%</span>
+            </template>
+          </chart-card>
+        </a-col>
+        <a-col :sm="24" :md="12" :xl="6" :style="{ marginBottom: '24px' }">
+          <chart-card :loading="loading" title="整体进度" :total="`${projectData.projectSchedule}%`">
+            <a-tooltip title="指标说明" slot="action">
+              <a-icon type="info-circle-o" />
+            </a-tooltip>
+            <div>
+              <mini-progress
+                color="#ffd401"
+                :target="80"
+                :percentage="projectData.projectSchedule"
+                height="8px"
+              />
+            </div>
+            <template slot="footer">
+              <trend flag="down" style="margin-right: 16px;">
+                <span slot="term">周同比</span>
+                12%
+              </trend>
+              <trend flag="up">
+                <span slot="term">日环比</span>
+                80%
+              </trend>
+            </template>
+          </chart-card>
+        </a-col>
+      </a-row>
+      <a-row :gutter="12">
+        <a-col :xl="18" :lg="24" :md="24" :sm="24" :xs="24">
+          <a-card :loading="loading" :bordered="false" :body-style="{padding: '0'}">
+            <div class="salesCard">
+              <a-tabs
+                default-active-key="1"
+                size="large"
+                :tab-bar-style="{marginTop: '3px',marginBottom: '24px', paddingLeft: '16px'}"
+              >
+                <!-- <div class="extra-wrapper" slot="tabBarExtraContent">
+                  <div class="extra-item">
+                    <a>今日</a>
+                    <a>本周</a>
+                    <a>本月</a>
+                    <a>本年</a>
+                  </div>
+                  <a-range-picker :style="{width: '256px'}" />
+                </div> -->
+                <a-tab-pane forceRender tab="项目数" key="1">
+                  <a-row>
+                    <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+                      <div class="chart-wrappers-single">
+                        <ve-histogram
+                          :data="projectTotalData.chartData"
+                          :settings="projectTotalData.chartSettings"
+                          :extend="projectTotalData.chartExtend"
+                          :legend-visible="false"
+                          height="288px"
+                        ></ve-histogram>
+                      </div>
+                    </a-col>
+                    <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+                      <rank-list title="项目数排行榜" :list="rankList" />
+                    </a-col>
+                  </a-row>
+                </a-tab-pane>
+                <a-tab-pane forceRender tab="任务数" key="2">
+                  <a-row>
+                    <a-col :xl="16" :lg="12" :md="12" :sm="24" :xs="24">
+                      <div class="chart-wrappers-single">
+                        <ve-histogram
+                          :data="taskData.chartData"
+                          :settings="taskData.chartSettings"
+                          :extend="projectTotalData.chartExtend"
+                          :legend-visible="false"
+                          height="288px"
+                        ></ve-histogram>
+                      </div>
+                    </a-col>
+                    <a-col :xl="8" :lg="12" :md="12" :sm="24" :xs="24">
+                      <rank-list title="任务数排行榜" :list="rankList" />
+                    </a-col>
+                  </a-row>
+                </a-tab-pane>
+              </a-tabs>
+            </div>
+          </a-card>
+        </a-col>
+        <a-col :xl="6" :lg="24" :md="24" :sm="24" :xs="24">
+          <a-card :loading="loading" :bordered="false" title="我的项目">
+            <!-- <a-dropdown :trigger="['click']" placement="bottomLeft" slot="extra">
+              <a class="ant-dropdown-link" href="#">
+                <a-icon type="ellipsis" />
+              </a>
+              <a-menu slot="overlay">
+                <a-menu-item>
+                  <a href="javascript:;">操作一</a>
+                </a-menu-item>
+                <a-menu-item>
+                  <a href="javascript:;">操作二</a>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>-->
+            <p v-for="project in projectList" :key="project.id">
+              <router-link
+                target="_blank"
+                :to="'/project/space/task/' + project.code"
+              >{{project.name}}</router-link>
+            </p>
+
+            <a-pagination
+              v-model="pagination.page"
+              :total="projectTotal"
+              :hideOnSinglePage="false"
+              size="small"
+              @change="pageChange"
+            />
+          </a-card>
+        </a-col>
+        <!-- <a-col :xl="12" :lg="24" :md="24" :sm="24" :xs="24">
+          <a-card
+            :loading="loading"
+            :bordered="false"
+            title="任务优先级分布"
+            :style="{ marginTop: '24px' }"
+          >
+            <a-dropdown :trigger="['click']" placement="bottomLeft" slot="extra">
+              <a class="ant-dropdown-link" href="#">
+                <a-icon type="ellipsis" />
+              </a>
+              <a-menu slot="overlay">
+                <a-menu-item>
+                  <a href="javascript:;">操作一</a>
+                </a-menu-item>
+                <a-menu-item>
+                  <a href="javascript:;">操作二</a>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>
+            <p>card content</p>
+            <p>card content</p>
+            <p>card content</p>
+          </a-card>
+        </a-col>-->
+      </a-row>
     </div>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import moment from "moment";
-    import VeLine from 'v-charts/lib/line.common'
-    import VeHistogram from 'v-charts/lib/histogram.common'
-    import ChartCard from '@/components/chart/ChartCard'
-    import Trend from '@/components/Trend'
-    import MiniProgress from '@/components/chart/MiniProgress'
-    import RankList from '@/components/chart/RankList'
-    import pagination from "@/mixins/pagination";
-    import {analysis, selfList as getProjectList} from "../../../api/project";
+import { mapState } from "vuex";
+import moment from "moment";
+import VeLine from "v-charts/lib/line.common";
+import VeHistogram from "v-charts/lib/histogram.common";
+import ChartCard from "@/components/chart/ChartCard";
+import Trend from "@/components/Trend";
+import MiniProgress from "@/components/chart/MiniProgress";
+import RankList from "@/components/chart/RankList";
+import pagination from "@/mixins/pagination";
+import { analysis, selfList as getProjectList } from "../../../api/project";
 
-    const rankList = [];
-    for (let i = 0; i < 7; i++) {
+const rankList = [];
+/* for (let i = 0; i < 7; i++) {
         rankList.push({
             name: 'XX公司 ' + (i + 1) + ' 号员工',
             total: 1234.56 - i * 100
         })
-    }
-    const taskList = [];
-    for (let i = 1; i < 20; i++) {
+    } */
+const taskList = [];
+/* for (let i = 1; i < 20; i++) {
         taskList.push({
             "日期": `1月${i}日`,
             "任务": (Math.random() * 10 + 1).toFixed(0)
         })
-    }
-    const projectList = [];
-    for (let i = 1; i < 13; i++) {
+    } */
+const projectList = [];
+/* for (let i = 1; i < 13; i++) {
         projectList.push({
             "日期": `${i}月`,
             "数量": (Math.random() * 10 + 1).toFixed(0)
         })
-    }
-    export default {
-        components: {
-            VeLine,
-            VeHistogram,
-            ChartCard,
-            MiniProgress,
-            Trend,
-            RankList
+    } */
+export default {
+  components: {
+    VeLine,
+    VeHistogram,
+    ChartCard,
+    MiniProgress,
+    Trend,
+    RankList,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      loading: false,
+      rankList,
+      chartExtend: {
+        grid: {
+          left: "-25",
+          right: "0",
+          top: "10",
+          bottom: "-15",
+        },
+        series: {
+          barWidth: 15,
+        },
+        xAxis: {
+          show: false,
+        },
+        yAxis: {
+          show: false,
+        },
+        tooltip: {
+          backgroundColor: "#fff",
+          textStyle: {
+            color: "#333",
+          },
+          borderWidth: 1,
+          borderColor: "#e8e8e8",
+        },
+        axisPointer: {
+          lineStyle: {
+            width: 0,
+          },
+        },
+      },
+      projectData: {
+        count: 0,
+        projectSchedule: 0,
+        chartData: {
+          columns: ["日期", "数量"],
+          rows: projectList,
+        },
+        chartSettings: {
+          itemStyle: {
+            color: "#1890ff",
+          },
         },
-        mixins: [pagination],
-        data() {
-            return {
-                loading: false,
-                rankList,
-                chartExtend: {
-                    grid: {
-                        left: '-25',
-                        right: '0',
-                        top: '10',
-                        bottom: '-15'
-                    },
-                    series: {
-                        barWidth: 15,
-                    },
-                    xAxis: {
-                        show: false,
-                    },
-                    yAxis: {
-                        show: false,
-                    },
-                    tooltip: {
-                        backgroundColor: '#fff',
-                        textStyle: {
-                            color: '#333'
-                        },
-                        borderWidth: 1,
-                        borderColor: '#e8e8e8',
-                    },
-                    axisPointer: {
-                        lineStyle: {
-                            width: 0
-                        }
-                    }
-                },
-                projectData: {
-                    count: 0,
-                    projectSchedule: 0,
-                    chartData: {
-                        columns: ['日期', '数量'],
-                        rows: projectList
-                    },
-                    chartSettings: {
-                        itemStyle: {
-                            color: '#1890ff'
-                        },
-                    },
-                },
-                taskData: {
-                    count: 0,
-                    taskOverdueCount: 0,
-                    taskOverduePercent: 0,
-                    chartData: {
-                        columns: ['日期', '任务'],
-                        rows: taskList
-                    },
-                    chartSettings: {
-                        area: true,
-                        itemStyle: {
-                            color: '#b68eec'
-                        },
-                        areaStyle: {
-                            color: '#b68eec'
-                        }
-                    },
-                },
-                projectTotalData: {
-                    chartData: {
-                        columns: ['日期', '数量'],
-                        rows: projectList
-                    },
-                    chartSettings: {
-                        itemStyle: {
-                            color: '#1890ff'
-                        },
-                    },
-                    chartExtend: {
-                        grid: {
-                            left: '30',
-                            right: '0',
-                            top: '15',
-                            bottom: '0'
-                        },
-                        series: {
-                            barWidth: 45,
-                        },
-                    }
-                },
-                projectList: [],
-                projectTotal: 0,
-                projectLoading: false,
-            }
+      },
+      taskData: {
+        count: 0,
+        taskOverdueCount: 0,
+        taskOverduePercent: 0,
+        chartData: {
+          columns: ["日期", "任务"],
+          rows: taskList,
         },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            }),
+        chartSettings: {
+          area: true,
+          itemStyle: {
+            color: "#b68eec",
+          },
+          areaStyle: {
+            color: "#b68eec",
+          },
         },
-        created() {
-            this.init();
+      },
+      projectTotalData: {
+        chartData: {
+          columns: ["日期", "数量"],
+          rows: projectList,
         },
-        methods: {
-            init(reset = true) {
-                analysis({type: 1}).then(res => {
-                    this.projectData.count = res.data.projectCount;
-                    this.projectData.projectSchedule = res.data.projectSchedule;
-                    this.projectData.chartData.rows = res.data.projectList;
-                    this.projectTotalData.chartData.rows = res.data.projectList;
+        chartSettings: {
+          itemStyle: {
+            color: "#1890ff",
+          },
+        },
+        chartExtend: {
+          grid: {
+            left: "30",
+            right: "0",
+            top: "15",
+            bottom: "0",
+          },
+          series: {
+            barWidth: 45,
+          },
+        },
+      },
+      projectList: [],
+      projectTotal: 0,
+      projectLoading: false,
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init(reset = true) {
+      analysis({ type: 1 }).then((res) => {
+        this.projectData.count = res.data.projectCount;
+        this.projectData.projectSchedule = res.data.projectSchedule;
+        this.projectData.chartData.rows = res.data.projectList;
+        this.projectTotalData.chartData.rows = res.data.projectList;
 
-                    this.taskData.count = res.data.taskCount;
-                    this.taskData.taskOverdueCount = res.data.taskOverdueCount;
-                    this.taskData.taskOverduePercent = res.data.taskOverduePercent;
-                    this.taskData.chartData.rows = res.data.taskList;
-                });
-                if (reset) {
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 10;
-                }
-                this.getProjectList(true);
-            },
-            getProjectList(loading) {
-                if (loading) {
-                    this.projectLoading = true;
-                }
-                getProjectList(this.requestData).then(res => {
-                    this.projectList = res.data.list;
-                    this.projectTotal = res.data.total;
-                    this.projectLoading = false;
-                });
-            },
-            pageChange(page, pageSize) {
-                this.pagination.page = page;
-                this.getProjectList(true);
-            }
-        }
-    }
+        this.taskData.count = res.data.taskCount;
+        this.taskData.taskOverdueCount = res.data.taskOverdueCount;
+        this.taskData.taskOverduePercent = res.data.taskOverduePercent;
+        this.taskData.chartData.rows = res.data.taskList;
+      });
+      if (reset) {
+        this.pagination.page = 1;
+        this.pagination.pageSize = 10;
+      }
+      this.getProjectList(true);
+    },
+    getProjectList(loading) {
+      if (loading) {
+        this.projectLoading = true;
+      }
+      getProjectList(this.requestData).then((res) => {
+        this.projectList = res.data.list;
+        this.projectTotal = res.data.total;
+        this.projectLoading = false;
+      });
+    },
+    pageChange(page, pageSize) {
+      this.pagination.page = page;
+      this.getProjectList(true);
+    },
+  },
+};
 </script>
 <style lang="less">
-    .analysis-index {
-        .page-wrapper {
-            margin: 24px;
-
-            .extra-wrapper {
-                line-height: 55px;
-                padding-right: 24px;
+.analysis-index {
+  .page-wrapper {
+    margin: 24px;
+    .salesCard {
+      padding-bottom: 2rem;
+    }
+    .extra-wrapper {
+      line-height: 55px;
+      padding-right: 24px;
 
-                .extra-item {
-                    display: inline-block;
-                    margin-right: 24px;
+      .extra-item {
+        display: inline-block;
+        margin-right: 24px;
 
-                    a {
-                        margin-left: 24px;
-                    }
-                }
-            }
+        a {
+          margin-left: 24px;
+        }
+      }
+    }
 
-            .chart-wrapper {
-                position: absolute;
-                bottom: -10px;
-                width: 100%;
-            }
+    .chart-wrapper {
+      position: absolute;
+      bottom: -10px;
+      width: 100%;
+    }
 
-            .chart-wrappers-single {
-                /*width: 500px;*/
+    .chart-wrappers-single {
+      /*width: 500px;*/
 
-                div {
-                    width: auto !important;
-                }
-            }
-        }
+      div {
+        width: auto !important;
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/project/space/features.vue b/src/views/project/space/features.vue
index f41a241..a87c18a 100644
--- a/src/views/project/space/features.vue
+++ b/src/views/project/space/features.vue
@@ -1,739 +1,695 @@
 <template>
-    <div class="project-space-features" :class="project.task_board_theme">
-        <div class="project-navigation">
-            <div class="project-nav-header">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <router-link to="/home">
-                            <a-icon type="home"/>
-                            首页
-                        </router-link>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>
-                        <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
-                        <span class="actions">
-                             <a-tooltip :mouseEnterDelay="0.3" :title="project.collected ? '取消收藏' : '加入收藏'"
-                                        @click="collectProject">
-                            <a-icon type="star" theme="filled" style="color: grey;" v-show="!project.collected"/>
-                            <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="project.collected"/>
-                        </a-tooltip>
-                        </span>
-                        <span class="label label-normal" v-if="project.private === 0"><a-icon type="global"/> 公开</span>
-                    </a-breadcrumb-item>
-                </a-breadcrumb>
-            </div>
-            <section class="nav-body">
-                <ul class="nav-wrapper nav nav-underscore pull-left">
-                    <li><a class="app" data-app="tasks"
-                           @click="$router.push('/project/space/task/' + code)">任务</a></li>
-                    <li class=""><a class="app" data-app="works"
-                                    @click="$router.push('/project/space/files/' + code)">
-                        文件</a>
-                    <li><a class="app" data-app="build"
-                           @click="$router.push('/project/space/overview/' + code)">
-                        概览</a>
-                    </li>
-                    <li class="actives"><a class="app" data-app="build"
-                                           @click="$router.push('/project/space/features/' + code)">
-                        版本</a>
-                    </li>
-                </ul>
-            </section>
-        </div>
-        <wrapper-content :showHeader="false">
-            <div class="content-wrapper">
-                <div class="content-item features-content">
-                    <div class="actions m-t">
-                        <a-dropdown placement="bottomCenter" :trigger="['click']" v-if="currentProjectFeatures">
-                            <a class="m-r text-default features-list-dropdown">
-                                <span class="m-r-xs">{{currentProjectFeatures.name}}</span>
-                                <a-icon type="down"/>
-                            </a>
-                            <a-menu class="field-right-menu" slot="overlay"
-                                    :selectable="false"
-                                    @click="changeProjectFeatures">
-                                <a-menu-item :key="projectFeatures.code" v-for="projectFeatures in projectFeaturesList">
-                                    <div class="menu-item-content">
-                                        <div>
-                                            <a-radio
-                                                    :checked="currentProjectFeatures.code == projectFeatures.code"></a-radio>
-                                            <span color="green">{{projectFeatures.name}}</span>
-                                        </div>
-                                        <div>
-                                            <a class="muted">
-                                                <a-icon type="edit"
-                                                        @click.stop="editFeatures(projectFeatures)"></a-icon>
-                                            </a>
-                                            <a class="muted">
-                                                <a-icon type="delete" class="m-l"
-                                                        @click.stop="deleteFeatures(projectFeatures)"></a-icon>
-                                            </a>
-                                        </div>
-                                    </div>
-                                </a-menu-item>
-                            </a-menu>
-                        </a-dropdown>
-                        <a-button icon="plus" type="primary" @click="createFeatures">创建版本库</a-button>
-                        <a-divider class="m-b-lg m-t-lg"></a-divider>
+  <div class="project-space-features" :class="project.task_board_theme">
+    <a-row class="project-navigation" align="middle" justify="center">
+      <a-col class="project-nav-header" :span="8" :xs="24" :sm="10" :md="8" :lg="8">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <a @click="toHome">
+              <a-icon type="home" />首页
+            </a>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>
+            <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
+            <span class="actions">
+              <a-tooltip
+                :mouseEnterDelay="0.3"
+                :title="project.collected ? '取消收藏' : '加入收藏'"
+                @click="collectProject"
+              >
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: grey;"
+                  v-show="!project.collected"
+                />
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: #ffaf38;"
+                  v-show="project.collected"
+                />
+              </a-tooltip>
+            </span>
+            <span class="label label-normal" v-if="project.private === 0">
+              <a-icon type="global" />公开
+            </span>
+          </a-breadcrumb-item>
+        </a-breadcrumb>
+      </a-col>
+      <a-col class="nav-body" :span="8" :xs="24" :sm="14" :md="8" :lg="8">
+        <ul class="nav-wrapper nav nav-underscore">
+          <li class data-app="tasks" @click="$router.push('/project/space/task/' + code)">任务</li>
+          <li class data-app="works" @click="$router.push('/project/space/files/' + code)">文件</li>
+          <li class data-app="build" @click="$router.push('/project/space/overview/' + code)">概览</li>
+          <li class="actives" data-app="build" @click="init">版本</li>
+        </ul>
+      </a-col>
+    </a-row>
+    <wrapper-content :showHeader="false">
+      <div class="content-wrapper">
+        <div class="content-item features-content">
+          <div class="actions">
+            <a-dropdown placement="bottomLeft" :trigger="['click']" v-if="currentProjectFeatures">
+              <a class="m-r text-default features-list-dropdown">
+                <span
+                  class="m-r-xs"
+                  :style="{minWidth:'2rem',display: 'inline-block',textAlign: 'justify'}"
+                >{{currentProjectFeatures.name}}</span>
+                <a-icon type="down" />
+              </a>
+              <a-menu
+                class="field-right-menu"
+                slot="overlay"
+                :selectable="false"
+                @click="changeProjectFeatures"
+              >
+                <a-menu-item
+                  :key="projectFeatures.code"
+                  v-for="projectFeatures in projectFeaturesList"
+                >
+                  <div class="menu-item-content">
+                    <div>
+                      <a-radio :checked="currentProjectFeatures.code == projectFeatures.code"></a-radio>
+                      <span color="green">{{projectFeatures.name}}</span>
                     </div>
-                    <a-spin :spinning="loading" v-if="currentProjectFeatures">
-                        <template v-if="versionTotal">
-                            <div :key="versionType" v-for="(versionItem,versionType) in versionList">
-                                <a style="cursor: pointer;display: block" class="muted m-l-sm m-b-sm"
-                                   v-if="versionType == 'published' && versionItem.length"
-                                   @click="showPublished = !showPublished">
-                                    <span class="m-r-sm">已发布版本</span>
-                                    <a-icon type="up" v-show="showPublished"/>
-                                    <a-icon type="ellipsis" v-show="!showPublished"/>
-                                </a>
-                                <div class="version-content" :class="{'published':versionType == 'published'}">
-                                    <template v-for="(version,versionIndex) in versionItem">
-                                        <a-card class="version-item" :key="versionIndex" hoverable
-                                                v-show="versionType != 'published' || (versionType == 'published' && showPublished)" @click="showVersionDetail(version.code)">
-                                            <template slot="title">
-                                                <strong :class="{'muted':versionType == 'published'}">{{version.name}}</strong>
-                                                <a-dropdown  placement="bottomCenter" :trigger="['click']"
-                                                            v-show="versionType == 'normal'">
-                                             <span class="version-status" :class="`status-${version.status}`" @click.stop="()=>{}">
-                                                 <a-icon type="schedule"/> <span
-                                                     class="m-l-xs">{{version.statusText}}</span>
-                                            </span>
-                                                    <a-menu class="field-right-menu" slot="overlay"
-                                                            :selectable="false"
-                                                            @click="changeVersionStatus($event,versionType,version,versionIndex)">
-                                                        <a-menu-item key="0">
-                                                            <div class="menu-item-content">
-                                                                <a-tag>未开始</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 0"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="1">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="blue">进行中</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 1"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="2">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="red">延期发布</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 2"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="3">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="green">已发布</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="version.status == 3"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </template>
-                                            <div class="publish-time muted">
-                                                <template v-if="version.publish_time || version.plan_publish_time ">
-                                                    <span v-if="versionType == 'normal'">预计发布时间：{{version.plan_publish_time}}</span>
-                                                    <span v-else>发布时间：{{version.publish_time}}</span>
-                                                </template>
-                                            </div>
-                                            <a-tooltip v-show="versionType == 'normal'" placement="top"
-                                                       :mouseEnterDelay="0.3"
-                                                       :title="`当前进度：${version.schedule}%`">
-                                                <a-progress :strokeWidth="4" :showInfo="false"
-                                                            :percent="parseInt(version.schedule)"/>
-                                            </a-tooltip>
-                                        </a-card>
-                                    </template>
-                                    <a-card class="version-item version-create" hoverable
-                                            v-show="versionType == 'normal'" @click="createVersion">
-                                        <a class="muted">
-                                            <div>
-                                                <a-icon type="plus"></a-icon>
-                                                <div>创建版本</div>
-                                            </div>
-                                        </a>
-                                    </a-card>
-                                </div>
-                            </div>
+                    <div>
+                      <a class="muted">
+                        <a-icon type="edit" @click.stop="editFeatures(projectFeatures)"></a-icon>
+                      </a>
+                      <a class="muted">
+                        <a-icon
+                          type="delete"
+                          class="m-l"
+                          @click.stop="deleteFeatures(projectFeatures)"
+                        ></a-icon>
+                      </a>
+                    </div>
+                  </div>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>
+            <a-button icon="plus" type="primary" @click="createFeatures">创建版本库</a-button>
+            <a-divider class="m-b-lg m-t-lg"></a-divider>
+          </div>
+          <a-spin :spinning="loading" v-if="currentProjectFeatures">
+            <template v-if="versionTotal">
+              <div class="version-group" :key="versionType" v-for="(versionItem,versionType) in versionList">
+                <a
+                  style="cursor: pointer;display: block"
+                  class="version-group-title muted m-l-sm m-b-sm"
+                  v-if="versionType == 'published' && versionItem.length"
+                  @click="showPublished = !showPublished"
+                >
+                  <span class="m-r-sm">已发布版本</span>
+                  <a-icon type="up" v-show="showPublished" />
+                  <a-icon type="ellipsis" v-show="!showPublished" />
+                </a>
+                <a-row
+                  class="version-content"
+                  :class="{'published':versionType == 'published'}"
+                  align="middle"
+                  justify="center"
+                  :gutter="[6, { xs: 8, sm: 16, md: 24, lg: 32 }]"
+                >
+                  <a-col
+                    v-for="(version,versionIndex) in versionItem"
+                    :key="'v_'+versionIndex"
+                    :span="8"
+                    :xs="24"
+                    :sm="12"
+                    :md="8"
+                    :lg="6"
+                  >
+                    <a-card
+                      class="version-item"
+                      hoverable
+                      v-show="versionType != 'published' || (versionType == 'published' && showPublished)"
+                      @click="showVersionDetail(version.code)"
+                    >
+                      <template slot="title">
+                        <strong :class="{'muted':versionType == 'published'}">{{version.name}}</strong>
+                        <a-dropdown
+                          placement="bottomCenter"
+                          :trigger="['click']"
+                          v-show="versionType == 'normal'"
+                        >
+                          <span
+                            class="version-status"
+                            :class="`status-${version.status}`"
+                            @click.stop="()=>{}"
+                          >
+                            <a-icon type="schedule" />
+                            <span class="m-l-xs">{{version.statusText}}</span>
+                          </span>
+                          <a-menu
+                            class="field-right-menu"
+                            slot="overlay"
+                            :selectable="false"
+                            @click="changeVersionStatus($event,versionType,version,versionIndex)"
+                          >
+                            <a-menu-item key="0">
+                              <div class="menu-item-content">
+                                <a-tag>未开始</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 0"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="1">
+                              <div class="menu-item-content">
+                                <a-tag color="blue">进行中</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 1"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="2">
+                              <div class="menu-item-content">
+                                <a-tag color="red">延期发布</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 2"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="3">
+                              <div class="menu-item-content">
+                                <a-tag color="green">已发布</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="version.status == 3"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                          </a-menu>
+                        </a-dropdown>
+                      </template>
+                      <div class="publish-time muted">
+                        <template v-if="version.publish_time || version.plan_publish_time ">
+                          <span v-if="versionType == 'normal'">预计发布时间：{{version.plan_publish_time}}</span>
+                          <span v-else>发布时间：{{version.publish_time}}</span>
                         </template>
-                        <div class="text-center" v-else>
-                            <p class="muted">暂无可用版本</p>
-                            <a-button type="primary" @click="createVersion">创建版本</a-button>
+                      </div>
+                      <a-tooltip
+                        v-show="versionType == 'normal'"
+                        placement="top"
+                        :mouseEnterDelay="0.3"
+                        :title="`当前进度：${version.schedule}%`"
+                      >
+                        <a-progress
+                          :strokeWidth="4"
+                          :showInfo="false"
+                          :percent="parseInt(version.schedule)"
+                        />
+                      </a-tooltip>
+                    </a-card>
+                  </a-col>
+                  <a-col :span="8" :xs="24" :sm="12" :md="8" :lg="6">
+                    <a-card
+                      class="version-item version-create"
+                      hoverable
+                      v-show="versionType == 'normal'"
+                      @click="createVersion"
+                    >
+                      <a class="muted">
+                        <div>
+                          <a-icon type="plus"></a-icon>
+                          <div>创建版本</div>
                         </div>
-                    </a-spin>
-                </div>
+                      </a>
+                    </a-card>
+                  </a-col>
+                </a-row>
+              </div>
+            </template>
+            <div class="text-center" v-else>
+              <p class="muted">暂无可用版本</p>
+              <a-button type="primary" @click="createVersion">创建版本</a-button>
             </div>
-        </wrapper-content>
-        <a-modal
-                destroyOnClose
-                :width="360"
-                v-model="projectFeatures.modalStatus"
-                :title="projectFeatures.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="form"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='版本库名称'
-                             v-decorator="[
+          </a-spin>
+        </div>
+      </div>
+    </wrapper-content>
+    <a-modal
+      destroyOnClose
+      :width="360"
+      v-model="projectFeatures.modalStatus"
+      :title="projectFeatures.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="form">
+        <a-form-item>
+          <a-input
+            placeholder="版本库名称"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入版本库名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='版本库简介'
-                                :rows="2"
-                                v-decorator="['description']"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="projectFeatures.confirmLoading"
-                                  class="middle-btn">{{projectFeatures.modalTitle}}
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                :width="500"
-                v-model="projectVersion.modalStatus"
-                :title="projectVersion.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-form
-                    @submit.prevent="handleSubmitProjectVersion"
-                    :form="projectVersionForm"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='版本名称'
-                             v-decorator="[
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="版本库简介" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="projectFeatures.confirmLoading"
+              class="middle-btn"
+            >{{projectFeatures.modalTitle}}</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      :width="500"
+      v-model="projectVersion.modalStatus"
+      :title="projectVersion.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmitProjectVersion" :form="projectVersionForm">
+        <a-form-item>
+          <a-input
+            placeholder="版本名称"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入版本名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='版本备注'
-                                :rows="2"
-                                v-decorator="['description']"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-row :gutter="16">
-                        <a-col :span="12">
-                            <a-date-picker showTime format="YYYY年MM月DD日 HH:mm" style="width: 100%"
-                                           placeholder="选择开始时间" v-decorator="['startTime']"></a-date-picker>
-                        </a-col>
-                        <a-col :span="12">
-                            <a-date-picker showTime format="YYYY年MM月DD日 HH:mm" style="width: 100%"
-                                           placeholder="选择预计发布时间" v-decorator="['planPublishTime']"></a-date-picker>
-                        </a-col>
-                    </a-row>
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="projectVersion.confirmLoading"
-                                  class="middle-btn">创建版本
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                :width="360"
-                v-model="publishVersion.modalStatus"
-                title="实际发布时间"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-form
-                    @submit.prevent="handleSubmitPublishVersion"
-                    :form="publishVersionForm"
-            >
-                <a-form-item
-                >
-                    <a-date-picker showTime format="YYYY年MM月DD日 HH:mm" style="width: 100%"
-                                   placeholder="选择实际发布时间" v-decorator="['publishTime']"></a-date-picker>
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="publishVersion.confirmLoading"
-                                  class="middle-btn">确认发布
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <a-modal
-                destroyOnClose
-                class="task-detail-modal"
-                width="min-content"
-                :closable="false"
-                title=""
-                :footer="null"
-                v-model="versionDetail.modalStatus"
-                @cancel="versionDetailClose"
-        >
-            <version-detail :versionCode="versionDetail.code" @close="versionDetailClose"></version-detail>
-
-        </a-modal>
-    </div>
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="版本备注" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+        <a-form-item>
+          <a-row :gutter="16">
+            <a-col :span="12">
+              <a-date-picker
+                showTime
+                :style="{minWidth:'auto'}"
+                format="YYYY年MM月DD日 HH:mm"
+                style="width: 100%"
+                placeholder="选择开始时间"
+                v-decorator="['startTime']"
+              ></a-date-picker>
+            </a-col>
+            <a-col :span="12">
+              <a-date-picker
+                showTime
+                :style="{minWidth:'auto'}"
+                format="YYYY年MM月DD日 HH:mm"
+                style="width: 100%"
+                placeholder="选择预计发布时间"
+                v-decorator="['planPublishTime']"
+              ></a-date-picker>
+            </a-col>
+          </a-row>
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="projectVersion.confirmLoading"
+              class="middle-btn"
+            >创建版本</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      :width="360"
+      v-model="publishVersion.modalStatus"
+      title="实际发布时间"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmitPublishVersion" :form="publishVersionForm">
+        <a-form-item>
+          <a-date-picker
+            showTime
+            :style="{minWidth:'auto'}"
+            format="YYYY年MM月DD日 HH:mm"
+            style="width: 100%"
+            placeholder="选择实际发布时间"
+            v-decorator="['publishTime']"
+          ></a-date-picker>
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="publishVersion.confirmLoading"
+              class="middle-btn"
+            >确认发布</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <a-modal
+      destroyOnClose
+      class="task-detail-modal"
+      width="min-content"
+      :closable="false"
+      title
+      :footer="null"
+      v-model="versionDetail.modalStatus"
+      @cancel="versionDetailClose"
+    >
+      <version-detail :versionCode="versionDetail.code" @close="versionDetailClose"></version-detail>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import moment from "moment";
-    import {read as getProject} from "../../../api/project";
-    import {collect} from "../../../api/projectCollect";
-    import {checkResponse} from "../../../assets/js/utils";
-    import {relativelyTime} from "../../../assets/js/dateTime";
-    import pagination from "../../../mixins/pagination";
-    import {save, list as getProjectFeatureList, edit, del} from "../../../api/projectFeatures";
-    import {save as saveProjectVersion, list as getProjectVersionList, changeStatus} from "../../../api/projectVersion";
-    import versionDetail from "../../../components/project/versionDetail"
-    import projectSelect from '@/components/project/projectSelect'
+import moment from "moment";
+import { read as getProject } from "../../../api/project";
+import { collect } from "../../../api/projectCollect";
+import { checkResponse } from "../../../assets/js/utils";
+import { relativelyTime } from "../../../assets/js/dateTime";
+import pagination from "../../../mixins/pagination";
+import {
+  save,
+  list as getProjectFeatureList,
+  edit,
+  del,
+} from "../../../api/projectFeatures";
+import {
+  save as saveProjectVersion,
+  list as getProjectVersionList,
+  changeStatus,
+} from "../../../api/projectVersion";
+import versionDetail from "../../../components/project/versionDetail";
+import projectSelect from "@/components/project/projectSelect";
 
-    export default {
-        name: "project-space-features",
-        components: {
-            versionDetail,
-            projectSelect
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                code: this.$route.params.code,
-                project: {task_board_theme: 'simple'},
-                loading: true,
-                form: this.$form.createForm(this),
-                projectVersionForm: this.$form.createForm(this),
-                publishVersionForm: this.$form.createForm(this),
-                projectFeaturesList: [],
-                currentProjectFeatures: null,
-                currentProjectVersion: null,
-                versionTotal: 1,
-                versionList: {
-                    normal: [],
-                    published: []
-                },
-                showPublished: false,
-                projectFeatures: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑版本库',
-                    info: null
-                },
-                projectVersion: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑版本',
-                    info: null
-                },
-                publishVersion: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    info: null,
-                    status: -1,
-                },
-                versionDetail: {
-                    modalStatus: false,
-                    code: ''
-                },
+export default {
+  name: "project-space-features",
+  components: {
+    versionDetail,
+    projectSelect,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      code: this.$route.params.code,
+      project: { task_board_theme: "simple" },
+      loading: true,
+      form: this.$form.createForm(this),
+      projectVersionForm: this.$form.createForm(this),
+      publishVersionForm: this.$form.createForm(this),
+      projectFeaturesList: [],
+      currentProjectFeatures: null,
+      currentProjectVersion: null,
+      versionTotal: 1,
+      versionList: {
+        normal: [],
+        published: [],
+      },
+      showPublished: false,
+      projectFeatures: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑版本库",
+        info: null,
+      },
+      projectVersion: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑版本",
+        info: null,
+      },
+      publishVersion: {
+        modalStatus: false,
+        confirmLoading: false,
+        info: null,
+        status: -1,
+      },
+      versionDetail: {
+        modalStatus: false,
+        code: "",
+      },
+    };
+  },
+  created() {
+    this.getProject();
+    this.init();
+  },
+  methods: {
+    init() {
+      this.getProjectFeaturesList();
+    },
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+      });
+    },
+    getProjectFeaturesList() {
+      getProjectFeatureList({ projectCode: this.code }).then((res) => {
+        this.projectFeaturesList = res.data;
+        if (res.data.length && !this.currentProjectFeature) {
+          this.currentProjectFeatures = res.data[0];
+          this.getProjectVersionList();
+        }
+      });
+    },
+    getProjectVersionList() {
+      let app = this;
+      app.loading = true;
+      getProjectVersionList({
+        projectFeaturesCode: this.currentProjectFeatures.code,
+      }).then((res) => {
+        let versionTotal = 0;
+        let normal = [];
+        let published = [];
+        res.data.forEach((v) => {
+          versionTotal++;
+          if (v.status == 3) {
+            published.push(v);
+          } else {
+            normal.push(v);
+          }
+        });
+        app.versionTotal = versionTotal;
+        app.versionList.normal = normal;
+        app.versionList.published = published;
+        app.loading = false;
+      });
+    },
+    createFeatures() {
+      let app = this;
+      app.projectFeatures.modalStatus = true;
+      app.projectFeatures.info = null;
+      app.projectFeatures.modalTitle = "创建版本库";
+    },
+    editFeatures(features) {
+      let app = this;
+      app.projectFeatures.modalStatus = true;
+      app.projectFeatures.modalTitle = "编辑版本库";
+      app.projectFeatures.info = features;
+      this.$nextTick(function () {
+        app.form.setFieldsValue({
+          name: features.name,
+          description: features.description,
+        });
+      });
+    },
+    deleteFeatures(features) {
+      let app = this;
+      this.$confirm({
+        title: "删除版本库",
+        content: `若将『${features["name"]}』 删除，所有与版本库相关的信息将会被彻底删除，删除后不可恢复。`,
+        okText: "删除",
+        okType: "danger",
+        cancelText: `再想想`,
+        onOk() {
+          del({ featuresCode: features.code }).then((res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
             }
+            if (app.currentProjectFeatures.code == features.code) {
+              app.currentProjectFeatures = null;
+            }
+            app.init();
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.getProject();
-            this.init();
-        },
-        methods: {
-            init() {
-                this.getProjectFeaturesList();
-            },
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                });
-            },
-            getProjectFeaturesList() {
-                getProjectFeatureList({projectCode: this.code}).then(res => {
-                    this.projectFeaturesList = res.data;
-                    if (res.data.length && !this.currentProjectFeature) {
-                        this.currentProjectFeatures = res.data[0];
-                        this.getProjectVersionList();
-                    }
-                })
-            },
-            getProjectVersionList() {
-                let app = this;
-                app.loading = true;
-                getProjectVersionList({projectFeaturesCode: this.currentProjectFeatures.code}).then(res => {
-                    let versionTotal = 0;
-                    let normal = [];
-                    let published = [];
-                    res.data.forEach(v => {
-                        versionTotal++;
-                        if (v.status == 3) {
-                            published.push(v);
-                        } else {
-                            normal.push(v);
-                        }
-                    });
-                    app.versionTotal = versionTotal;
-                    app.versionList.normal = normal;
-                    app.versionList.published = published;
-                    app.loading = false;
-                })
-            },
-            createFeatures() {
-                let app = this;
-                app.projectFeatures.modalStatus = true;
-                app.projectFeatures.info = null;
-                app.projectFeatures.modalTitle = '创建版本库';
-            },
-            editFeatures(features) {
-                let app = this;
-                app.projectFeatures.modalStatus = true;
-                app.projectFeatures.modalTitle = '编辑版本库';
-                app.projectFeatures.info = features;
-                this.$nextTick(function () {
-                    app.form.setFieldsValue({
-                        name: features.name,
-                        description: features.description,
-                    });
-                })
-            },
-            deleteFeatures(features) {
-                let app = this;
-                this.$confirm({
-                    title: '删除版本库',
-                    content: `若将『${features['name']}』 删除，所有与版本库相关的信息将会被彻底删除，删除后不可恢复。`,
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: `再想想`,
-                    onOk() {
-                        del({featuresCode: features.code}).then(res => {
-                            const result = checkResponse(res);
-                            if (!result) {
-                                return false;
-                            }
-                            if (app.currentProjectFeatures.code == features.code) {
-                                app.currentProjectFeatures = null;
-                            }
-                            app.init();
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            createVersion() {
-                let app = this;
-                app.projectVersion.modalStatus = true;
-                app.projectVersion.info = null;
-                app.projectVersion.modalTitle = '创建版本';
-            },
-            changeVersionStatus(e, versionType, version, index) {
-                let app = this;
-                if (e.key == version.code) {
-                    return false;
-                }
-                if (e.key == 3) {
-                    //请确认当前版本发布内容已全部完成后再发布。
-                    this.$confirm({
-                        title: '发布提示',
-                        content: `请确认当前版本发布内容已全部完成后再发布。`,
-                        okText: '确认发布',
-                        okType: 'primary',
-                        onOk() {
-                            app.publishVersion.info = version;
-                            app.publishVersion.status = e.key;
-                            app.publishVersion.modalStatus = true;
-                            app.$nextTick(function () {
-                                app.publishVersionForm.setFieldsValue({
-                                    publishTime: moment(),
-                                });
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-
-                } else {
-                    changeStatus({versionCode: version.code, status: e.key}).then(res => {
-                        this.getProjectVersionList();
-                    });
-                }
-            },
-            showVersionDetail(code) {
-                this.versionDetail.modalStatus = true;
-                this.versionDetail.code = code;
-            },
-            versionDetailClose() {
-                this.versionDetail.modalStatus = false;
-                this.versionDetail.code = '';
-                this.getProjectVersionList();
-            },
-            handleSubmitPublishVersion() {
-                let app = this;
-                app.publishVersionForm.validateFields(
-                    (err) => {
-                        if (!err) {
-                            let obj = app.publishVersionForm.getFieldsValue();
-                            obj.publishTime = moment(obj.publishTime).format('YYYY-MM-DD HH:mm');
-                            changeStatus({
-                                versionCode: this.publishVersion.info.code,
-                                status: this.publishVersion.status,
-                                publishTime: obj.publishTime,
-                            }).then(res => {
-                                app.publishVersion.modalStatus = false;
-                                app.getProjectVersionList();
-                            });
-                        }
-                    })
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.projectFeatures.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                obj.projectCode = this.code;
-                if (app.projectFeatures.info) {
-                    obj.featuresCode = app.projectFeatures.info.code;
-                    edit(obj).then(res => {
-                        app.projectFeatures.confirmLoading = false;
-                        if (!checkResponse(res)) {
-                            return;
-                        }
-                        app.form.resetFields();
-                        this.getProjectFeaturesList();
-                        app.projectFeatures.modalStatus = false;
-                    });
-                } else {
-                    save(obj).then(res => {
-                        app.projectFeatures.confirmLoading = false;
-                        if (!checkResponse(res)) {
-                            return;
-                        }
-                        app.form.resetFields();
-                        app.projectFeatures.modalStatus = false;
-                        app.init();
-                    });
-                }
-
-            },
-            handleSubmitProjectVersion() {
-                let app = this;
-                app.projectVersionForm.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOkProjectVersion();
-                        }
-                    })
-            },
-            handleOkProjectVersion() {
-                let app = this;
-                app.projectVersion.confirmLoading = true;
-                let obj = app.projectVersionForm.getFieldsValue();
-                obj.featuresCode = this.currentProjectFeatures.code;
-                obj.startTime = moment(obj.startTime).format('YYYY-MM-DD HH:mm');
-                obj.planPublishTime = moment(obj.planPublishTime).format('YYYY-MM-DD HH:mm');
-                saveProjectVersion(obj).then(res => {
-                    app.projectVersion.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.projectVersionForm.resetFields();
-                    app.projectVersion.modalStatus = false;
-                    app.getProjectVersionList();
-                });
-            },
-            changeProjectFeatures(e) {
-                this.currentProjectFeatures = this.projectFeaturesList.find(item => item.code == e.key);
-                this.getProjectVersionList();
-            },
-            collectProject() {
-                const type = this.project.collected ? 'cancel' : 'collect';
-                collect(this.project.code, type).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.project.collected = !this.project.collected;
-                })
-            },
-            formatTime(time) {
-                return relativelyTime(time);
-            },
+      });
+    },
+    createVersion() {
+      let app = this;
+      app.projectVersion.modalStatus = true;
+      app.projectVersion.info = null;
+      app.projectVersion.modalTitle = "创建版本";
+    },
+    changeVersionStatus(e, versionType, version, index) {
+      let app = this;
+      if (e.key == version.code) {
+        return false;
+      }
+      if (e.key == 3) {
+        //请确认当前版本发布内容已全部完成后再发布。
+        this.$confirm({
+          title: "发布提示",
+          content: `请确认当前版本发布内容已全部完成后再发布。`,
+          okText: "确认发布",
+          okType: "primary",
+          onOk() {
+            app.publishVersion.info = version;
+            app.publishVersion.status = e.key;
+            app.publishVersion.modalStatus = true;
+            app.$nextTick(function () {
+              app.publishVersionForm.setFieldsValue({
+                publishTime: moment(),
+              });
+            });
+            return Promise.resolve();
+          },
+        });
+      } else {
+        changeStatus({ versionCode: version.code, status: e.key }).then(
+          (res) => {
+            this.getProjectVersionList();
+          }
+        );
+      }
+    },
+    showVersionDetail(code) {
+      this.versionDetail.modalStatus = true;
+      this.versionDetail.code = code;
+    },
+    versionDetailClose() {
+      this.versionDetail.modalStatus = false;
+      this.versionDetail.code = "";
+      this.getProjectVersionList();
+    },
+    handleSubmitPublishVersion() {
+      let app = this;
+      app.publishVersionForm.validateFields((err) => {
+        if (!err) {
+          let obj = app.publishVersionForm.getFieldsValue();
+          obj.publishTime = moment(obj.publishTime).format("YYYY-MM-DD HH:mm");
+          changeStatus({
+            versionCode: this.publishVersion.info.code,
+            status: this.publishVersion.status,
+            publishTime: obj.publishTime,
+          }).then((res) => {
+            app.publishVersion.modalStatus = false;
+            app.getProjectVersionList();
+          });
         }
-    }
-</script>
-
-<style lang="less">
-    /*@import "../../../assets/css/components/task";*/
-
-    .project-space-features {
-        .project-navigation {
-            top: 65px;
-            z-index: 4;
+      });
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
         }
-
-        .wrapper-main {
-            background: initial;
-
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.projectFeatures.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      obj.projectCode = this.code;
+      if (app.projectFeatures.info) {
+        obj.featuresCode = app.projectFeatures.info.code;
+        edit(obj).then((res) => {
+          app.projectFeatures.confirmLoading = false;
+          if (!checkResponse(res)) {
+            return;
+          }
+          app.form.resetFields();
+          this.getProjectFeaturesList();
+          app.projectFeatures.modalStatus = false;
+        });
+      } else {
+        save(obj).then((res) => {
+          app.projectFeatures.confirmLoading = false;
+          if (!checkResponse(res)) {
+            return;
+          }
+          app.form.resetFields();
+          app.projectFeatures.modalStatus = false;
+          app.init();
+        });
+      }
+    },
+    handleSubmitProjectVersion() {
+      let app = this;
+      app.projectVersionForm.validateFields((err) => {
+        if (!err) {
+          app.handleOkProjectVersion();
         }
-
-        .layout-content {
-            padding: 12px;
-            width: 1100px;
-            margin: 12px auto auto;
-            background: initial;
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between;
-
-            .content-item {
-                /*background: #fff;*/
-
-                .title {
-                    font-size: 16px;
-                    padding: 6px 0 0 0;
-                }
-            }
-
-            .content-wrapper {
-                width: 100%;
-            }
-
-            .actions {
-
-            }
-
-            .version-content {
-                display: flex;
-                flex-wrap: wrap;
-                margin-bottom: 28px;
-                width: calc(100% + 12px);
-                flex-shrink: 0;
-
-                .ant-card {
-                    width: 345px;
-                    height: 102px;
-                    margin: 0 6px 16px;
-                    flex: 0 0 auto;
-                    align-items: center;
-                    border-radius: 4px;
-                    /*display: inline-block;*/
-
-                    .ant-card-head {
-                        padding: 0 16px;
-                        border-bottom: none;
-
-                        .ant-card-head-title {
-                            padding: 12px 0;
-                            display: flex;
-                            justify-content: space-between;
-                            font-size: 14px;
-
-                            .version-status {
-                                display: flex;
-                                align-items: center;
-                                justify-content: center;
-                                min-width: 82px;
-                                height: 28px;
-                                border-radius: 4px;
-                                background: #f5f5f5;
-                                padding: 4px 8px;
-
-                                &.status-0 {
-                                    color: #a6a6a6;
-                                }
-
-                                &.status-1 {
-                                    color: #1890ff;
-                                    background: #e6f7ff;
-                                    border-color: #91d5ff;
-                                }
-
-                                &.status-2 {
-                                    color: #f5222d;
-                                    background: #fff1f0;
-                                    border-color: #ffa39e;
-                                }
-
-                                &.status-3 {
-                                    color: #52c41a;
-                                    background: #f6ffed;
-                                    border-color: #b7eb8f;
-                                }
-                            }
-                        }
-                    }
-
-                    .ant-card-body {
-                        height: 100%;
-                        padding: 0 16px 16px 16px;
-
-                        .publish-time {
-                            min-height: 21px;
-                        }
-                    }
-                }
-
-                .version-create {
-                    .ant-card-body {
-                        padding-top: 16px;
-                    }
-
-                    a {
-                        height: 100%;
-                        display: flex;
-                        justify-content: center;
-                        align-items: center;
-                        text-align: center;
-                    }
-                }
-
-                &.published {
-                    .ant-card {
-                        height: auto;
-                    }
-                }
-            }
+      });
+    },
+    handleOkProjectVersion() {
+      let app = this;
+      app.projectVersion.confirmLoading = true;
+      let obj = app.projectVersionForm.getFieldsValue();
+      obj.featuresCode = this.currentProjectFeatures.code;
+      obj.startTime = moment(obj.startTime).format("YYYY-MM-DD HH:mm");
+      obj.planPublishTime = moment(obj.planPublishTime).format(
+        "YYYY-MM-DD HH:mm"
+      );
+      saveProjectVersion(obj).then((res) => {
+        app.projectVersion.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
         }
-    }
+        app.projectVersionForm.resetFields();
+        app.projectVersion.modalStatus = false;
+        app.getProjectVersionList();
+      });
+    },
+    changeProjectFeatures(e) {
+      this.currentProjectFeatures = this.projectFeaturesList.find(
+        (item) => item.code == e.key
+      );
+      this.getProjectVersionList();
+    },
+    collectProject() {
+      const type = this.project.collected ? "cancel" : "collect";
+      collect(this.project.code, type).then((res) => {
+        if (!checkResponse(res)) {
+          return;
+        }
+        this.project.collected = !this.project.collected;
+      });
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+  },
+};
+</script>
 
-    .features-list-dropdown {
-        cursor: pointer;
+<style lang="less" scoped >
+.project-space-features {
+  .layout-content {
+    .content-item {
+      background: initial;
     }
+  }
+}
 </style>
diff --git a/src/views/project/space/files.vue b/src/views/project/space/files.vue
index ab85d6a..6dc8932 100644
--- a/src/views/project/space/files.vue
+++ b/src/views/project/space/files.vue
@@ -1,465 +1,393 @@
 <template>
-    <div class="project-space-files" :class="project.task_board_theme">
-        <div class="project-navigation">
-            <div class="project-nav-header">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <router-link to="/home">
-                            <a-icon type="home"/>
-                            首页
-                        </router-link>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>
-                        <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
-                        <span class="actions">
-                             <a-tooltip :mouseEnterDelay="0.3" :title="project.collected ? '取消收藏' : '加入收藏'"
-                                        @click="collectProject">
-                            <a-icon type="star" theme="filled" style="color: grey;" v-show="!project.collected"/>
-                            <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="project.collected"/>
-                        </a-tooltip>
-                        </span>
-                        <span class="label label-normal" v-if="project.private === 0"><a-icon type="global"/> 公开</span>
-                    </a-breadcrumb-item>
-                </a-breadcrumb>
+  <div class="project-space-files" :class="project.task_board_theme">
+    <a-row class="project-navigation" align="middle" justify="center">
+      <a-col class="project-nav-header" :span="8" :xs="24" :sm="10" :md="8" :lg="8">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <a @click="toHome">
+              <a-icon type="home" />首页
+            </a>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>
+            <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
+            <span class="actions">
+              <a-tooltip
+                :mouseEnterDelay="0.3"
+                :title="project.collected ? '取消收藏' : '加入收藏'"
+                @click="collectProject"
+              >
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: grey;"
+                  v-show="!project.collected"
+                />
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: #ffaf38;"
+                  v-show="project.collected"
+                />
+              </a-tooltip>
+            </span>
+            <span class="label label-normal" v-if="project.private === 0">
+              <a-icon type="global" />公开
+            </span>
+          </a-breadcrumb-item>
+        </a-breadcrumb>
+      </a-col>
+      <a-col class="nav-body" :span="8" :xs="24" :sm="14" :md="8" :lg="8">
+        <ul class="nav-wrapper nav nav-underscore">
+          <li class data-app="tasks" @click="$router.push('/project/space/task/' + code)">任务</li>
+          <li class="actives" data-app="works" @click="getFiles">文件</li>
+          <li class data-app="build" @click="$router.push('/project/space/overview/' + code)">概览</li>
+          <li class data-app="build" @click="$router.push('/project/space/features/' + code)">版本</li>
+        </ul>
+      </a-col>
+    </a-row>
+    <wrapper-content :showHeader="false">
+      <div class="content-wrapper">
+        <div class="content-item files-list">
+          <div class="header">
+            <span class="title">我的文件</span>
+            <div class="header-actions">
+              <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
+              <a-button id="upload-file" icon="up-circle" type="dashed" size="small">上传</a-button>
             </div>
-            <section class="nav-body">
-                <ul class="nav-wrapper nav nav-underscore pull-left">
-                    <li><a class="app" data-app="tasks"
-                           @click="$router.push('/project/space/task/' + code)">任务</a></li>
-                    <li class="actives"><a class="app" data-app="works"
-                                           @click="$router.push('/project/space/files/' + code)">
-                        文件</a>
-                    <li><a class="app" data-app="build"
-                           @click="$router.push('/project/space/overview/' + code)">
-                        概览</a>
-                    </li>
-                    <li class=""><a class="app" data-app="build"
-                                    @click="$router.push('/project/space/features/' + code)">
-                        版本</a>
-                    </li>
-                </ul>
-            </section>
-        </div>
-        <wrapper-content :showHeader="false">
-            <div class="content-wrapper">
-                <div class="content-item log-list">
-                    <div class="header">
-                        <span class="title">我的文件</span>
-                        <div class="header-actions">
-                            <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
-                            <a-button id="upload-file" icon="up-circle" type="dashed">上传</a-button>
-                        </div>
-                    </div>
-                    <div class="list-content">
-                        <a-list
-                                :loading="loading"
-                        >
-                            <a-list-item class="list-item-title">
-                                <a-list-item-meta>
-                                    <div class="muted" slot="title">
-                                        名称
-                                    </div>
-                                </a-list-item-meta>
-                                <div class="other-info muted">
-                                    <div class="info-item">
-                                        <span>大小</span>
-                                    </div>
-                                    <div class="info-item">
-                                        <span>创建日期</span>
-                                    </div>
-                                    <div class="info-item">
-                                        <span>创建人</span>
-                                    </div>
-                                </div>
-                                <span slot="actions" :key="item" v-for="item in 3">
-                                    <span>位</span>
-                                </span>
-                            </a-list-item>
-                            <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
-                                <a-list-item-meta>
-                                    <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url"/>
-                                    <div slot="title">
-                                        <a-tooltip :mouseEnterDelay="0.3">
-                                            <template slot="title">
-                                                <span>{{item.fullName}}</span>
-                                            </template>
-                                            <a-input
-                                                    :ref="`inputTitle${index}`"
-                                                    :auto-focus="true"
-                                                    v-model="item.title"
-                                                    v-show="item.editing"
-                                                    @pressEnter="onCellChange(item)"
-                                                    @blur="onCellChange(item)"></a-input>
-                                            <a class="text-default" target="_blank" :href="item | showPreviewUrl"
-                                               v-show="!item.editing">{{item.fullName}}</a>
-                                        </a-tooltip>
-                                    </div>
-                                </a-list-item-meta>
-                                <div class="other-info muted">
-                                    <div class="info-item">
-                                        <span>{{(formatSize(item.size))}}</span>
-                                    </div>
-                                    <div class="info-item">
-                                        <a-tooltip :title="item.create_time">
-                                            <span>{{ formatTime(item.create_time) }}</span>
-                                        </a-tooltip>
-                                    </div>
-                                    <div class="info-item">
-                                        <span>{{item.creatorName}}</span>
-                                    </div>
-                                </div>
-                                <span slot="actions">
-                                    <a-tooltip title="下载">
-                                        <a class="muted" target="_blank" :href="item.file_url"><a-icon type="download"/></a>
-                                    </a-tooltip>
-                                </span>
-                                <!-- <span slot="actions">
+          </div>
+          <div class="list-content">
+            <a-list :loading="loading">
+              <a-list-item class="list-item-title">
+                <a-list-item-meta>
+                  <div class="muted" slot="title">名称</div>
+                </a-list-item-meta>
+                <div class="other-info muted">
+                  <div class="info-item">
+                    <span>大小</span>
+                  </div>
+                  <div class="info-item">
+                    <span>创建日期</span>
+                  </div>
+                  <div class="info-item">
+                    <span>创建人</span>
+                  </div>
+                </div>
+                <span slot="actions">
+                  <a-tooltip :mouseEnterDelay="0.5">
+                    <template slot="title">
+                      <span>移上显示</span>
+                    </template>
+                    操作
+                  </a-tooltip>
+                </span>
+              </a-list-item>
+              <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
+                <a-list-item-meta>
+                  <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
+                  <div slot="title">
+                    <a-tooltip :mouseEnterDelay="0.3">
+                      <template slot="title">
+                        <span>{{item.fullName}}</span>
+                      </template>
+                      <a-input
+                        :ref="`inputTitle${index}`"
+                        :auto-focus="true"
+                        v-model="item.title"
+                        v-show="item.editing"
+                        @pressEnter="onCellChange(item)"
+                        @blur="onCellChange(item)"
+                      ></a-input>
+                      <a
+                        class="text-default"
+                        target="_blank"
+                        :href="item | showPreviewUrl"
+                        :title="item.fullName"
+                        v-show="!item.editing"
+                      >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
+                    </a-tooltip>
+                  </div>
+                </a-list-item-meta>
+                <div class="other-info muted">
+                  <div class="info-item">
+                    <span>{{(formatSize(item.size))}}</span>
+                  </div>
+                  <div class="info-item">
+                    <a-tooltip :title="item.create_time">
+                      <span>{{ formatTime(item.create_time) }}</span>
+                    </a-tooltip>
+                  </div>
+                  <div class="info-item">
+                    <span>{{item.creatorName}}</span>
+                  </div>
+                </div>
+                <span slot="actions">
+                  <a-tooltip title="下载">
+                    <a class="muted" target="_blank" :href="item.file_url">
+                      <a-icon type="download" />
+                    </a>
+                  </a-tooltip>
+                </span>
+                <!-- <span slot="actions">
                                      <a-tooltip title="更新">
                                          <a-icon type="upload"/>
                                      </a-tooltip>
-                                 </span>-->
-                                <span slot="actions" @click="editFile(item,index)">
-                                    <a-tooltip title="编辑">
-                                        <a-icon type="edit"/>
-                                    </a-tooltip>
-                                </span>
-                                <a class="muted" slot="actions">
-                                    <a-dropdown :trigger="['click']" placement="bottomCenter">
-                                        <a-tooltip :mouseEnterDelay="0.5">
-                                            <template slot="title">
-                                                <span>更多操作</span>
-                                            </template>
-                                            <a class="action-item muted">
-                                                <a-icon type="down"/>
-                                            </a>
-                                        </a-tooltip>
-                                        <a-menu class="field-right-menu"
-                                                v-clipboard="item.file_url"
-                                                @click="doFile($event,item.code)"
-                                                slot="overlay">
-                                            <a-menu-item key="copy">
-                                                <a-icon type="link"/>
-                                                <span>复制链接</span>
-                                            </a-menu-item>
-                                            <a-menu-item key="delete">
-                                                <a-icon type="delete"/>
-                                                <span>移到回收站</span>
-                                            </a-menu-item>
-                                        </a-menu>
-                                    </a-dropdown>
-                                </a>
-                            </a-list-item>
-                            <div v-if="showLoadingMore" slot="loadMore"
-                                 :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                                <a-spin v-if="loadingMore"/>
-                                <a-button v-else @click="onLoadMore">查看更多文件</a-button>
-                            </div>
-                        </a-list>
-                    </div>
-                </div>
-            </div>
-        </wrapper-content>
-    </div>
+                </span>-->
+                <span slot="actions" @click="editFile(item,index)">
+                  <a-tooltip title="编辑">
+                    <a-icon type="edit" />
+                  </a-tooltip>
+                </span>
+                <a class="muted" slot="actions">
+                  <a-dropdown :trigger="['click']" placement="bottomRight">
+                    <a-tooltip :mouseEnterDelay="0.5">
+                      <template slot="title">
+                        <span>更多操作</span>
+                      </template>
+                      <a class="action-item muted">
+                        <a-icon type="down" />
+                      </a>
+                    </a-tooltip>
+                    <a-menu
+                      class="field-right-menu"
+                      v-clipboard="item.file_url"
+                      @click="doFile($event,item.code)"
+                      slot="overlay"
+                    >
+                      <a-menu-item key="copy">
+                        <a-icon type="link" />
+                        <span>复制链接</span>
+                      </a-menu-item>
+                      <a-menu-item key="delete">
+                        <a-icon type="delete" />
+                        <span>移到回收站</span>
+                      </a-menu-item>
+                    </a-menu>
+                  </a-dropdown>
+                </a>
+              </a-list-item>
+              <div
+                v-if="showLoadingMore"
+                slot="loadMore"
+                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+              >
+                <a-spin v-if="loadingMore" />
+                <a-button v-else @click="onLoadMore">查看更多文件</a-button>
+              </div>
+            </a-list>
+          </div>
+        </div>
+      </div>
+    </wrapper-content>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import {read as getProject} from "../../../api/project";
-    import {collect} from "../../../api/projectCollect";
-    import {checkResponse} from "../../../assets/js/utils";
-    import {relativelyTime} from "../../../assets/js/dateTime";
-    import {edit, list, recycle} from "../../../api/file";
-    import pagination from "@/mixins/pagination";
-    import {notice} from "../../../assets/js/notice";
-    import projectSelect from '@/components/project/projectSelect'
-
+import { mapState } from "vuex";
+import { read as getProject } from "../../../api/project";
+import { collect } from "../../../api/projectCollect";
+import { checkResponse } from "../../../assets/js/utils";
+import { relativelyTime } from "../../../assets/js/dateTime";
+import { edit, list, recycle } from "../../../api/file";
+import pagination from "@/mixins/pagination";
+import { notice } from "../../../assets/js/notice";
+import projectSelect from "@/components/project/projectSelect";
 
-
-    export default {
-        name: "project-space-files",
-        mixins: [pagination],
-        data() {
-            return {
-                code: this.$route.params.code,
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                project: {task_board_theme: 'simple'},
-                currentFileIndex: {},
-                files: [],
-            }
-        },
-        components: {
-            projectSelect,
-        },
-        computed: {
-            ...mapState({
-                uploader: state => state.common.uploader,
-
-            }),
-        },
-        watch: {
-            uploader: {
-                handler(newVal, oldVal) {
-                    //监听是否有上传文件行为
-                    const files = newVal.fileList;
-                    const index = files.findIndex(item => item.projectName == this.project.name);
-                    if (index !== -1) {
-                        this.getFiles();
-                    }
-                },
-                deep: true
-            }
-        },
-        created() {
-            this.getProject();
-            this.getFiles();
-        },
-        mounted() {
-            setTimeout(() => {
-                this.uploader.assignBrowse(document.getElementById('upload-file'));
-            }, 500)
-        },
-        methods: {
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                    this.$store.dispatch('setTempData', {
-                        projectCode: this.project.code,
-                    })
-                });
-            },
-            getFiles(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 50;
-                    this.showLoadingMore = false;
-                }
-                app.requestData.projectCode = this.code;
-                app.requestData.deleted = 0;
-                list(app.requestData).then(res => {
-                    if (reset) {
-                        this.files = [];
-                    }
-                    res.data.list.forEach((v) => {
-                        v.editing = false;
-                    });
-                    app.files = app.files.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.files.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                })
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.getFiles(false);
-            },
-            collectProject() {
-                const type = this.project.collected ? 'cancel' : 'collect';
-                collect(this.project.code, type).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.project.collected = !this.project.collected;
-                })
-            },
-            editFile(file, index) {
-                let app = this;
-                this.files.forEach((v) => {
-                    v.editing = false;
-                });
-                this.files[index].editing = true;
-                this.$nextTick(() => {
-                    app.$refs[`inputTitle${index}`][0].focus();
-                });
-                this.currentFileIndex = index;
-            },
-            onCellChange(file) {
-                let currentFile = this.files[this.currentFileIndex];
-                this.files.forEach((v) => {
-                    v.editing = false;
-                });
-                const fullName = `${file.title}.${file.extension}`;
-                if (fullName != currentFile.fullName) {
-                    edit({title: currentFile.title, fileCode: currentFile.code}).then(res => {
-                        const result = checkResponse(res);
-                        if (!result) {
-                            return false;
-                        }
-                        currentFile.title = file.title;
-                        currentFile.fullName = fullName;
-                        notice({
-                            title: '重命名成功',
-                        }, 'notice', 'success');
-                    });
-                }
-            },
-            doFile(action, fileCode) {
-                let app = this;
-                const actionKey = action.key;
-                switch (actionKey) {
-                    case 'delete':
-                        this.$confirm({
-                            title: '移到回收站',
-                            content: `您确定要把该文件移到回收站吗？`,
-                            okText: '移到回收站',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                recycle(fileCode).then((res) => {
-                                    const result = checkResponse(res);
-                                    if (!result) {
-                                        return false;
-                                    }
-                                    app.getFiles();
-                                });
-                                notice({
-                                    title: '成功移到回收站',
-                                    msg: '可在 菜单－查看回收站－文件 中查看'
-                                }, 'notice', 'success', 5);
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case 'copy':
-                        notice({
-                            title: '复制链接成功',
-                            msg: '在地址栏粘贴并打开可下载该资源'
-                        }, 'notice', 'success', 5);
-                        return true;
-                }
-            },
-            formatTime(time) {
-                return relativelyTime(time);
-            },
-            formatSize(size) {
-                let type = 'KB';
-                size = size / 1024;
-                if (size >= 1024) {
-                    size /= 1024;
-                    type = 'MB';
-                }
-                return `${size.toFixed(2)} ${type}`;
-            },
+export default {
+  name: "project-space-files",
+  mixins: [pagination],
+  data() {
+    return {
+      code: this.$route.params.code,
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      project: { task_board_theme: "simple" },
+      currentFileIndex: {},
+      files: [],
+    };
+  },
+  components: {
+    projectSelect,
+  },
+  computed: {
+    ...mapState({
+      uploader: (state) => state.common.uploader,
+    }),
+  },
+  watch: {
+    uploader: {
+      handler(newVal, oldVal) {
+        //监听是否有上传文件行为
+        const files = newVal.fileList;
+        const index = files.findIndex(
+          (item) => item.projectName == this.project.name
+        );
+        if (index !== -1) {
+          this.getFiles();
         }
-    }
-</script>
-
-<style lang="less">
-    /*@import "../../../assets/css/components/task";*/
-
-    .project-space-files {
-        .project-navigation {
-            top: 65px;
-            z-index: 4;
+      },
+      deep: true,
+    },
+  },
+  created() {
+    this.getProject();
+    this.getFiles();
+  },
+  mounted() {
+    setTimeout(() => {
+      this.uploader.assignBrowse(document.getElementById("upload-file"));
+    }, 500);
+  },
+  methods: {
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+        this.$store.dispatch("setTempData", {
+          projectCode: this.project.code,
+        });
+      });
+    },
+    getFiles(reset = true) {
+      let app = this;
+      if (reset) {
+        this.pagination.page = 1;
+        this.pagination.pageSize = 50;
+        this.showLoadingMore = false;
+      }
+      app.requestData.projectCode = this.code;
+      app.requestData.deleted = 0;
+      list(app.requestData).then((res) => {
+        if (reset) {
+          this.files = [];
         }
-
-        .wrapper-main {
-            background: initial;
-
+        res.data.list.forEach((v) => {
+          v.editing = false;
+        });
+        app.files = app.files.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.files.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.getFiles(false);
+    },
+    collectProject() {
+      const type = this.project.collected ? "cancel" : "collect";
+      collect(this.project.code, type).then((res) => {
+        if (!checkResponse(res)) {
+          return;
         }
-
-        .layout-content {
-            padding: 12px;
-            width: 1100px;
-            margin: 12px auto auto;
-            background: initial;
-            display: flex;
-            flex-direction: row;
-            justify-content: space-between;
-
-            .content-item {
-                background: #fff;
-                padding: 6px 0 18px 0;
-                border-radius: 4px;
-
-                .header {
-                    padding: 12px 20px 6px 20px;
-                    display: flex;
-                    justify-content: space-between;
-
-                    .title {
-                        font-size: 18px;
-                    }
-                }
+        this.project.collected = !this.project.collected;
+      });
+    },
+    editFile(file, index) {
+      let app = this;
+      this.files.forEach((v) => {
+        v.editing = false;
+      });
+      this.files[index].editing = true;
+      this.$nextTick(() => {
+        app.$refs[`inputTitle${index}`][0].focus();
+      });
+      this.currentFileIndex = index;
+    },
+    onCellChange(file) {
+      let currentFile = this.files[this.currentFileIndex];
+      this.files.forEach((v) => {
+        v.editing = false;
+      });
+      const fullName = `${file.title}.${file.extension}`;
+      if (fullName != currentFile.fullName) {
+        edit({ title: currentFile.title, fileCode: currentFile.code }).then(
+          (res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
             }
-
-            .content-wrapper {
-                width: 100%;
-
-                .log-list {
-                    background: #fff;
-
-                    .list-content {
-
-                        .list-item-title {
-                            padding: 10px 20px;
-
-                            .ant-list-item-action {
-                                li {
-                                    color: #fff;
-                                }
-
-                                em {
-                                    width: 0;
-                                }
-                            }
-                        }
-
-                        .list-item {
-                            border-bottom: none;
-                            margin-bottom: 2px;
-                            /*border-bottom: 1px solid #f5f5f5;*/
-                            padding: 10px 20px;
-                            transition: background-color 218ms;
-
-                            &:hover {
-                                background-color: #f5f5f5;
-                            }
-
-                            .ant-list-item-meta-title {
-                                overflow: hidden;
-                                text-overflow: ellipsis;
-                                white-space: nowrap;
-                                position: relative;
-                                margin-bottom: 0;
-                                line-height: 32px;
-                            }
-
-                            .ant-list-item-action {
-                                em {
-                                    width: 0;
-                                }
-                            }
-                        }
-
-                        .other-info {
-                            display: flex;
-
-                            .info-item {
-                                display: flex;
-                                flex-direction: column;
-                                padding-left: 0;
-                                width: 90px;
-                                text-align: right;
-                            }
-
-                            .schedule {
-                                width: 250px;
-                            }
-                        }
-                    }
+            currentFile.title = file.title;
+            currentFile.fullName = fullName;
+            notice(
+              {
+                title: "重命名成功",
+              },
+              "notice",
+              "success"
+            );
+          }
+        );
+      }
+    },
+    doFile(action, fileCode) {
+      let app = this;
+      const actionKey = action.key;
+      switch (actionKey) {
+        case "delete":
+          this.$confirm({
+            title: "移到回收站",
+            content: `您确定要把该文件移到回收站吗？`,
+            okText: "移到回收站",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              recycle(fileCode).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
                 }
-            }
+                app.getFiles();
+              });
+              notice(
+                {
+                  title: "成功移到回收站",
+                  msg: "可在 菜单－查看回收站－文件 中查看",
+                },
+                "notice",
+                "success",
+                5
+              );
+              return Promise.resolve();
+            },
+          });
+          break;
+        case "copy":
+          notice(
+            {
+              title: "复制链接成功",
+              msg: "在地址栏粘贴并打开可下载该资源",
+            },
+            "notice",
+            "success",
+            5
+          );
+          return true;
+      }
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+    formatSize(size) {
+      let type = "KB";
+      size = size / 1024;
+      if (size >= 1024) {
+        size /= 1024;
+        type = "MB";
+      }
+      return `${size.toFixed(2)} ${type}`;
+    },
+  },
+};
+</script>
 
-            .content-right {
-                width: 325px;
-            }
-        }
-    }
+<style lang="less" scoped>
+.project-space-files {
+  .wrapper-main {
+    background: initial;
+  }
+}
 </style>
diff --git a/src/views/project/space/overview.vue b/src/views/project/space/overview.vue
index ca16d76..0422f2b 100644
--- a/src/views/project/space/overview.vue
+++ b/src/views/project/space/overview.vue
@@ -1,749 +1,660 @@
 <template>
-    <div class="project-space-overview" :class="project.task_board_theme">
-        <div class="project-navigation">
-            <div class="project-nav-header">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <router-link to="/home">
-                            <a-icon type="home"/>
-                            首页
-                        </router-link>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>
-                        <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
-                        <span class="actions">
-                             <a-tooltip :mouseEnterDelay="0.3" :title="project.collected ? '取消收藏' : '加入收藏'"
-                                        @click="collectProject">
-                            <a-icon type="star" theme="filled" style="color: grey;" v-show="!project.collected"/>
-                            <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="project.collected"/>
-                        </a-tooltip>
-                        </span>
-                        <span class="label label-normal" v-if="project.private === 0"><a-icon type="global"/> 公开</span>
-                    </a-breadcrumb-item>
-                </a-breadcrumb>
-            </div>
-            <section class="nav-body">
-                <ul class="nav-wrapper nav nav-underscore pull-left">
-                    <li><a class="app" data-app="tasks"
-                           @click="$router.push('/project/space/task/' + code)">任务</a></li>
-                    <li class=""><a class="app" data-app="works"
-                                    @click="$router.push('/project/space/files/' + code)">
-                        文件</a>
-                    <li class="actives"><a class="app" data-app="build"
-                                           @click="$router.push('/project/space/overview/' + code)">
-                        概览</a>
-                    </li>
-                    <li class=""><a class="app" data-app="build"
-                                    @click="$router.push('/project/space/features/' + code)">
-                        版本</a>
-                    </li>
-                </ul>
-            </section>
+  <div class="project-space-overview" :class="project.task_board_theme">
+    <a-row class="project-navigation" align="middle" justify="center">
+      <a-col class="project-nav-header" :span="8" :xs="24" :sm="10" :md="8" :lg="8">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <a @click="toHome">
+              <a-icon type="home" />首页
+            </a>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>
+            <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
+            <span class="actions">
+              <a-tooltip
+                :mouseEnterDelay="0.3"
+                :title="project.collected ? '取消收藏' : '加入收藏'"
+                @click="collectProject"
+              >
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: grey;"
+                  v-show="!project.collected"
+                />
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: #ffaf38;"
+                  v-show="project.collected"
+                />
+              </a-tooltip>
+            </span>
+            <span class="label label-normal" v-if="project.private === 0">
+              <a-icon type="global" />公开
+            </span>
+          </a-breadcrumb-item>
+        </a-breadcrumb>
+      </a-col>
+      <a-col class="nav-body" :span="8" :xs="24" :sm="14" :md="8" :lg="8">
+        <ul class="nav-wrapper nav nav-underscore">
+          <li class data-app="tasks" @click="$router.push('/project/space/task/' + code)">任务</li>
+          <li class data-app="works" @click="$router.push('/project/space/files/' + code)">文件</li>
+          <li class="actives" data-app="build" @click="init">概览</li>
+          <li class data-app="build" @click="$router.push('/project/space/features/' + code)">版本</li>
+        </ul>
+      </a-col>
+    </a-row>
+    <wrapper-content :showHeader="false">
+      <div class="overview-item m-b">
+        <div class="content-item">
+          <h3 class="m-sm m-b text-center">任务燃尽图</h3>
+          <a-spin :spinning="burnoutMap.loading">
+            <ve-line
+              width="100%"
+              v-if="!burnoutMap.loading"
+              :data="burnoutMap.chartData"
+              :settings="burnoutMap.chartSettings"
+              :extend="burnoutMap.chartExtend"
+              :series="burnoutMap.series"
+              :legend-visible="false"
+              height="200px"
+            ></ve-line>
+          </a-spin>
         </div>
-        <wrapper-content :showHeader="false">
-            <div class="overview-item m-b">
-                <div class="content-item">
-                    <h3 class="m-sm m-b text-center">任务燃尽图</h3>
-                    <a-spin :spinning="burnoutMap.loading">
-                        <ve-line
-                                v-if="!burnoutMap.loading"
-                                :data="burnoutMap.chartData"
-                                :settings="burnoutMap.chartSettings"
-                                :extend="burnoutMap.chartExtend"
-                                :series="burnoutMap.series"
-                                :legend-visible="false"
-                                height="200px"
-                        ></ve-line>
-                    </a-spin>
-                </div>
+      </div>
+      <a-row
+        class="overview-item"
+        align="middle"
+        justify="center"
+        :gutter="[16, { xs: 8, sm: 16, md: 24, lg: 32 }]"
+      >
+        <a-col :span="16" :xs="24" :sm="24" :md="16" :lg="16">
+          <div class="content-item log-list">
+            <div class="title">
+              项目信息
+              <a-tooltip :mouseEnterDelay="0.5">
+                <template slot="title">
+                  <span>添加信息</span>
+                </template>
+                <a class="pull-right muted" @click="createInfo()">
+                  <a-icon type="plus-circle" />
+                </a>
+              </a-tooltip>
             </div>
-            <div class="overview-item">
-                <div class="content-left">
-                    <div class="content-item log-list">
-                        <div class="title">
-                            项目信息
-                            <a-tooltip :mouseEnterDelay="0.5">
-                                <template slot="title">
-                                    <span>添加信息</span>
-                                </template>
-                                <a class="pull-right muted" @click="createInfo()">
-                                    <a-icon type="plus-circle"/>
-                                </a>
-                            </a-tooltip>
-                        </div>
-                        <div class="list-content">
-                            <a-list>
-                                <a-list-item :key="index" v-for="(item, index) in projectInfoList">
-                                    <a-list-item-meta>
-                                        <div slot="title">
-                                            <a-tooltip :mouseEnterDelay="0.5">
-                                                <template slot="title">
-                                                    <span>{{item.description ? item.description : '暂无描述'}}</span>
-                                                </template>
-                                                <span>{{ item.name }} </span>
-                                            </a-tooltip>
-<!--                                            <span class="right-item muted"> {{ formatTime(item.create_time) }}-->
-<!--                                        </span>-->
-                                        </div>
-                                        <div slot="description">
-                                            {{ item.value }}
-                                        </div>
-                                    </a-list-item-meta>
-                                    <span slot="actions" @click="editInfo(item)">
-                                         <a-tooltip title="编辑">
-                                             <a-icon type="edit"/>
-                                         </a-tooltip>
-                                    </span>
-                                    <span slot="actions" @click="delInfo(item,index)">
-                                         <a-tooltip title="删除">
-                                              <a-icon type="delete"/>
-                                         </a-tooltip>
-                                    </span>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                    </div>
-                    <div class="content-item log-list">
-                        <div class="title">
-                            项目动态
-                        </div>
-                        <div class="list-content">
-                            <a-list>
-                                <div v-if="showLoadingMore" slot="loadMore"
-                                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                                    <a-spin v-if="loadingMore"/>
-                                    <a-button v-else @click="onLoadMore">查看更多动态</a-button>
-                                </div>
-                                <a-list-item :key="index" v-for="(item, index) in activities">
-                                    <a-list-item-meta>
-                                        <a-avatar slot="avatar" :src="item.member_avatar"/>
-                                        <div slot="title">
-                                            <span>{{ item.member_name }} </span>
-                                            <span v-if="item.is_comment == 0"> <span
-                                                    v-html="item.remark "></span></span>&nbsp;
-                                            <template v-if="item.is_comment == 1">发表了评论
-                                                <p class="comment-text">{{ item.content }}</p>
-                                            </template>
-                                            <span class="right-item muted"> {{ formatTime(item.create_time) }}
-                                        </span>
-                                        </div>
-                                        <div slot="description">
-                                            <template v-if="item.action_type == 'task'">
-                                                <router-link class="muted"
-                                                             :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
-                                                >
-                                                    {{ item.sourceInfo.name }}
-                                                </router-link>
-                                            </template>
-                                            <template v-if="item.action_type == 'project'">
-                                                <span v-html="item.content"></span>
-                                            </template>
-                                        </div>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
+            <div class="list-content">
+              <a-list>
+                <a-list-item :key="index" v-for="(item, index) in projectInfoList">
+                  <a-list-item-meta>
+                    <div slot="title">
+                      <a-tooltip :mouseEnterDelay="0.5">
+                        <template slot="title">
+                          <span>{{item.description ? item.description : '暂无描述'}}</span>
+                        </template>
+                        <span>{{ item.name }}</span>
+                      </a-tooltip>
+                      <!--                                            <span class="right-item muted"> {{ formatTime(item.create_time) }}-->
+                      <!--                                        </span>-->
                     </div>
+                    <div slot="description">{{ item.value }}</div>
+                  </a-list-item-meta>
+                  <span slot="actions" @click="editInfo(item)">
+                    <a-tooltip title="编辑">
+                      <a-icon type="edit" />
+                    </a-tooltip>
+                  </span>
+                  <span slot="actions" @click="delInfo(item,index)">
+                    <a-tooltip title="删除">
+                      <a-icon type="delete" />
+                    </a-tooltip>
+                  </span>
+                </a-list-item>
+              </a-list>
+            </div>
+          </div>
+          <div class="content-item log-list">
+            <div class="title">项目动态</div>
+            <div class="list-content">
+              <a-list>
+                <div
+                  v-if="showLoadingMore"
+                  slot="loadMore"
+                  :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+                >
+                  <a-spin v-if="loadingMore" />
+                  <a-button v-else @click="onLoadMore">查看更多动态</a-button>
                 </div>
-                <div class="content-right">
-                    <div class="content-item">
-                        <div class="list-content">
-                            <div class="default-list">
-                                <a-list>
-                                    <a-list-item :key="index" v-for="(item, index) in [project]">
-                                        <a-list-item-meta>
-                                            <a-avatar slot="avatar" :src="item.cover"/>
-                                            <div slot="title">
-                                                <span>{{ item.name }}</span>
-                                            </div>
-                                            <div slot="description">
-                                                {{item.owner_name}} 创建于
-                                                {{moment(item.create_time).format('YYYY年MM月DD日')}}
-                                            </div>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </a-list>
-                            </div>
-                        </div>
-                        <p class="">{{project.description}}</p>
-                        <div class="project-date m-b-lg m-t-lg">
-                            <div class="muted m-b-xs">
-                                <a-tag color="green">项目周期</a-tag>
-                            </div>
-                            <a-range-picker
-                                    v-model="projectDate"
-                                    format="YYYY年MM月DD日"
-                                    @change="ondateChange"/>
-                        </div>
-                        <div class="project-stats m-b-lg">
-                            <div class="muted m-b-xs">
-                                <a-tag color="green">项目统计</a-tag>
-                            </div>
-                            <div class="stats-content">
-                                <div class="stats-item" :key="index" v-for="(stats, index) in projectStats">
-                                    <div class="stats-title muted">{{stats.title}}</div>
-                                    <div class="stats-number">{{stats.number}}</div>
-                                    <a-tooltip placement="right" :mouseEnterDelay="0.3"
-                                               :title="`${stats.schedule}%`">
-                                        <a-progress strokeColor="#1890ff" :strokeWidth="3" :showInfo="false"
-                                                    :percent="stats.schedule"/>
-                                    </a-tooltip>
-                                </div>
-                            </div>
-                        </div>
-                        <div>
-                            <div class="muted">
-                                <a-tag color="green">新增任务趋势</a-tag>
-                            </div>
-                            <ve-line
-                                    :data="chartData"
-                                    :settings="chartSettings"
-                                    :extend="chartExtend"
-                                    :legend-visible="false"
-                                    height="200px"
-                            ></ve-line>
-                        </div>
+                <a-list-item :key="index" v-for="(item, index) in activities">
+                  <a-list-item-meta>
+                    <a-avatar slot="avatar" :src="item.member_avatar" />
+                    <div slot="title">
+                      <span>{{ item.member_name }}</span>
+                      <span v-if="item.is_comment == 0">
+                        <span v-html="item.remark "></span>
+                      </span>&nbsp;
+                      <template v-if="item.is_comment == 1">
+                        发表了评论
+                        <p class="comment-text">{{ item.content }}</p>
+                      </template>
+                      <span class="right-item muted">{{ formatTime(item.create_time) }}</span>
                     </div>
-                </div>
+                    <div slot="description">
+                      <template v-if="item.action_type == 'task'">
+                        <router-link
+                          class="muted"
+                          :to="`/project/space/task/${item.project_code}/detail/${item.source_code}`"
+                        >{{ item.sourceInfo.name }}</router-link>
+                      </template>
+                      <template v-if="item.action_type == 'project'">
+                        <span v-html="item.content"></span>
+                      </template>
+                    </div>
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
             </div>
-        </wrapper-content>
-        <!--项目信息-->
-        <a-modal
-                class="project-info"
-                :width="400"
-                v-model="infoModal.modalStatus"
-                :title="infoModal.modalTitle"
-                :confirmLoading="infoModal.loading"
-                @ok="handleSubmit"
-        >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="infoModal.form"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='名称'
-                             v-decorator="[
-                                            'name',
-                                            {rules: [{ required: true, message: '请输入名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='内容'
-                                :rows="2"
-                                v-decorator="['value']"
-                    />
-                </a-form-item>
-                <a-form-item
+          </div>
+        </a-col>
+        <a-col :span="8" :xs="24" :sm="24" :md="8" :lg="8">
+          <div class="content-item">
+            <div class="list-content">
+              <div class="default-list">
+                <a-list>
+                  <a-list-item :key="index" v-for="(item, index) in [project]">
+                    <a-list-item-meta>
+                      <a-avatar slot="avatar" :src="item.cover" />
+                      <div slot="title">
+                        <span>{{ item.name }}</span>
+                      </div>
+                      <div slot="description">
+                        {{item.owner_name}} 创建于
+                        {{moment(item.create_time).format('YYYY年MM月DD日')}}
+                      </div>
+                    </a-list-item-meta>
+                  </a-list-item>
+                </a-list>
+              </div>
+            </div>
+            <p class>{{project.description}}</p>
+            <div class="project-date m-b-lg m-t-lg">
+              <div class="muted m-b-sm">
+                <a-tag color="green">项目周期</a-tag>
+              </div>
+              <a-range-picker
+                :style="{width:'100%'}"
+                v-model="projectDate"
+                format="YYYY年MM月DD日"
+                @change="ondateChange"
+              />
+            </div>
+            <div class="project-stats m-b-lg">
+              <div class="muted m-b-sm">
+                <a-tag color="green">项目统计</a-tag>
+              </div>
+              <a-row
+                class="stats-content"
+                align="middle"
+                justify="center"
+                :gutter="[16, { xs: 8, sm: 16, md: 24, lg: 32 }]"
+              >
+                <a-col
+                  class="stats-item"
+                  :key="index"
+                  v-for="(stats, index) in projectStats"
+                  :span="12"
+                  :xs="12"
+                  :sm="8"
+                  :md="8"
+                  :lg="8"
                 >
-                    <a-textarea placeholder='描述'
-                                :rows="2"
-                                v-decorator="['description']"
+                  <div class="stats-title muted">{{stats.title}}</div>
+                  <div class="stats-number">{{stats.number}}</div>
+                  <a-tooltip placement="right" :mouseEnterDelay="0.3" :title="`${stats.schedule}%`">
+                    <a-progress
+                      strokeColor="#1890ff"
+                      :strokeWidth="3"
+                      :showInfo="false"
+                      :percent="stats.schedule"
                     />
-                </a-form-item>
-                <a-form-item
-                >
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+                  </a-tooltip>
+                </a-col>
+              </a-row>
+            </div>
+            <div>
+              <div class="muted">
+                <a-tag color="green">新增任务趋势</a-tag>
+              </div>
+              <ve-line
+                width="100%"
+                :data="chartData"
+                :settings="chartSettings"
+                :extend="chartExtend"
+                :legend-visible="false"
+                height="200px"
+              ></ve-line>
+            </div>
+          </div>
+        </a-col>
+      </a-row>
+    </wrapper-content>
+    <!--项目信息-->
+    <a-modal
+      class="project-info"
+      :width="400"
+      v-model="infoModal.modalStatus"
+      :title="infoModal.modalTitle"
+      :confirmLoading="infoModal.loading"
+      @ok="handleSubmit"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="infoModal.form">
+        <a-form-item>
+          <a-input
+            placeholder="名称"
+            v-decorator="['name',{rules: [{ required: true, message: '请输入名称' }]}]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="内容" :rows="2" v-decorator="['value']" />
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="描述" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import moment from "moment";
-    import VeLine from 'v-charts/lib/line.common'
-    import {_getProjectReport, _projectStats, doData, read as getProject} from "../../../api/project";
-    import {doData as doInfo, list as getInfoList, del as delProjectInfo} from "../../../api/projectInfo";
-    import {collect} from "../../../api/projectCollect";
-    import {checkResponse} from "../../../assets/js/utils";
-    import {getLogBySelfProject, dateTotalForProject} from "../../../api/task";
-    import {relativelyTime} from "../../../assets/js/dateTime";
-    import pagination from "../../../mixins/pagination";
-    import projectSelect from '@/components/project/projectSelect'
-
-
-    export default {
-        name: "project-space-overview",
-        components: {
-            VeLine,
-            projectSelect,
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                code: this.$route.params.code,
-                loading: true,
-                project: {task_board_theme: 'simple'},
-                projectDate: [],
-                activities: [],
-                projectInfoList: [],
-                showLoadingMore: false,
-                loadingMore: false,
-                infoModal: {
-                    form: this.$form.createForm(this),
-                    newData: {
-                        code: ''
-                    },
-                    loading: false,
-                    modalStatus: false,
-                    modalTitle: '项目信息',
-                },
-                burnoutMap: {
-                    loading: true,
-                    chartData: {
-                        columns: ['日期', '实际剩余任务', '理想剩余任务'],
-                        rows: []
-                    },
-                    series: [
-                        {
-                            type: 'line',
-                            name: '实际剩余任务',
-                            smooth: false,
-                            color: '#1890ff',
-                            data: [],
-                        },
-                        {
-                            type: 'line',
-                            name: '理想剩余任务',
-                            color: '#52C41A',
-                            smooth: false,
-                            lineStyle: {
-                                type: 'dashed'
-                            },
-                            data: []
-                        },
-                    ],
-                    chartSettings: {},
-                    chartExtend: {
-                        grid: {
-                            left: '5',
-                            right: '20',
-                            top: '10',
-                            bottom: '0'
-                        },
-                        xAxis: {
-                            show: true,
-                            // boundaryGap: false,
-                            splitLine: {
-                                show: false
-                            }
-                        },
-                        yAxis: {
-                            show: true,
-                            splitLine: {
-                                show: true,
-                                lineStyle: {
-                                    type: 'dashed',
-                                    color: ['#e4e4e4']
-                                }
-                            }
-                        },
-                        tooltip: {
-                            backgroundColor: '#fff',
-                            textStyle: {
-                                color: '#333'
-                            },
-                            borderWidth: 1,
-                            borderColor: '#e8e8e8',
-                        },
-                        axisPointer: {
-                            lineStyle: {
-                                width: 0
-                            }
-                        }
-                    }
-                },
-                chartData: {
-                    columns: ['日期', '任务'],
-                    rows: [],
-                },
-                chartSettings: {
-                    area: true,
-                    itemStyle: {
-                        color: '#1890ff'
-                    },
-                    areaStyle: {
-                        color: '#e6f7ff'
-                    }
-                },
-                chartExtend: {
-                    grid: {
-                        left: '-20',
-                        right: '0',
-                        top: '10',
-                        bottom: '0'
-                    },
-                    xAxis: {
-                        show: false,
-                    },
-                    yAxis: {
-                        show: false,
-                    },
-                    tooltip: {
-                        backgroundColor: '#fff',
-                        textStyle: {
-                            color: '#333'
-                        },
-                        borderWidth: 1,
-                        borderColor: '#e8e8e8',
-                    },
-                    axisPointer: {
-                        lineStyle: {
-                            width: 0
-                        }
-                    }
-                },
+import moment from "moment";
+import VeLine from "v-charts/lib/line.common";
+import {
+  _getProjectReport,
+  _projectStats,
+  doData,
+  read as getProject,
+} from "../../../api/project";
+import {
+  doData as doInfo,
+  list as getInfoList,
+  del as delProjectInfo,
+} from "../../../api/projectInfo";
+import { collect } from "../../../api/projectCollect";
+import { checkResponse } from "../../../assets/js/utils";
+import { getLogBySelfProject, dateTotalForProject } from "../../../api/task";
+import { relativelyTime } from "../../../assets/js/dateTime";
+import pagination from "../../../mixins/pagination";
+import projectSelect from "@/components/project/projectSelect";
 
-                projectStats: [
-                    {
-                        title: '未完成',
-                        key: 'unDone',
-                        number: 0,
-                        schedule: 0
-                    },
-                    {
-                        title: '已完成',
-                        key: 'done',
-                        number: 0,
-                        schedule: 0
-                    },
-                    {
-                        title: '已逾期',
-                        key: 'overdue',
-                        number: 0,
-                        schedule: 0
-                    },
-                    {
-                        title: '待认领',
-                        key: 'toBeAssign',
-                        number: 0,
-                        schedule: 0
-                    },
-                    {
-                        title: '今日到期',
-                        key: 'expireToday',
-                        number: 0,
-                        schedule: 0
-                    },
-                    {
-                        title: '逾期完成',
-                        key: 'doneOverdue',
-                        number: 0,
-                        schedule: 0
-                    },
-                ]
-            }
+export default {
+  name: "project-space-overview",
+  components: {
+    VeLine,
+    projectSelect,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      code: this.$route.params.code,
+      loading: true,
+      project: { task_board_theme: "simple" },
+      projectDate: [],
+      activities: [],
+      projectInfoList: [],
+      showLoadingMore: false,
+      loadingMore: false,
+      infoModal: {
+        form: this.$form.createForm(this),
+        newData: {
+          code: "",
         },
-        created() {
-            this.getProject();
-            this.init();
+        loading: false,
+        modalStatus: false,
+        modalTitle: "项目信息",
+      },
+      burnoutMap: {
+        loading: true,
+        chartData: {
+          columns: ["日期", "实际剩余任务", "理想剩余任务"],
+          rows: [],
         },
-        methods: {
-            moment,
-            init() {
-                this.getProjectInfoList();
-                this.getProjectLog();
-                this.overviewForProject();
-                this.getProjectStats();
-                this.getProjectReport();
+        series: [
+          {
+            type: "line",
+            name: "实际剩余任务",
+            smooth: false,
+            color: "#1890ff",
+            data: [],
+          },
+          {
+            type: "line",
+            name: "理想剩余任务",
+            color: "#52C41A",
+            smooth: false,
+            lineStyle: {
+              type: "dashed",
             },
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                    if (this.project.begin_time) {
-                        this.projectDate = [moment(this.project.begin_time), moment(this.project.end_time)];
-                    }
-                });
+            data: [],
+          },
+        ],
+        chartSettings: {},
+        chartExtend: {
+          grid: {
+            left: "5",
+            right: "20",
+            top: "10",
+            bottom: "0",
+          },
+          xAxis: {
+            show: true,
+            // boundaryGap: false,
+            splitLine: {
+              show: false,
             },
-            getProjectReport() {
-                let app = this;
-                _getProjectReport({projectCode: this.code}).then(res => {
-                    let rows = [];
-                    res.data.date.forEach((v) => {
-                        rows.push({'日期': v})
-                    });
-                    app.burnoutMap.loading = false;
-                    app.burnoutMap.chartData.rows = rows;
-                    app.burnoutMap.series[0].data = res.data.undoneTask;
-                    app.burnoutMap.series[1].data = res.data.baseLineList;
-
-                });
-            },
-            getProjectLog(reset = true) {
-                let app = this;
-                if (reset) {
-                    app.pagination.page = 1;
-                    app.pagination.pageSize = 20;
-                    app.showLoadingMore = false;
-                }
-                this.requestData.projectCode = this.code;
-                getLogBySelfProject(this.requestData).then(res => {
-                    let list = [];
-                    res.data.list.forEach((item) => {
-                        list.push(item);
-                        //只显示任务的完成动态
-                        // if (item.action_type === 'task') {
-                        //     if ((item.type === 'done' || item.type === 'redo')) {
-                        //         list.push(item);
-                        //     }
-                        // } else {
-                        //     list.push(item);
-                        // }
-                    });
-                    if (reset) {
-                        app.activities = [];
-                    }
-                    app.activities = app.activities.concat(list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.activities.length;
-                    app.loading = false;
-                    app.loadingMore = false;
-                })
-            },
-            getProjectInfoList() {
-                let app = this;
-                getInfoList({projectCode: app.code}).then(res => {
-                    app.projectInfoList = res.data;
-                });
-            },
-            getProjectStats() {
-                _projectStats({
-                    projectCode: this.code
-                }).then(res => {
-                    const taskStats = res.data;
-                    const total = taskStats['total'];
-                    this.projectStats.forEach((v, k) => {
-                        v.number = taskStats[v.key];
-                        if (total) {
-                            v.schedule = parseInt(v.number / total * 100);
-                        }
-                    })
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.getProjectLog(false);
-            },
-            overviewForProject() {
-                dateTotalForProject({projectCode: this.code}).then(res => {
-                    let list = [];
-                    res.data.forEach((v) => {
-                        list.push({
-                            '日期': moment(v.date).format('M月D日'),
-                            '任务': v.total,
-                        })
-                    });
-                    this.chartData.rows = list;
-                })
-            },
-            createInfo() {
-                let app = this;
-                app.infoModal.newData = {code: ''};
-                setTimeout(function () {
-                    app.infoModal.form && app.infoModal.form.resetFields();
-                }, 0);
-                app.infoModal.modalStatus = true;
-                app.infoModal.modalTitle = '添加字段';
-            },
-            editInfo(info) {
-                let app = this;
-                app.infoModal.newData = info;
-                app.infoModal.modalStatus = true;
-                setTimeout(function () {
-                    app.infoModal.modalTitle = '编辑字段';
-                    app.infoModal.form.setFieldsValue({
-                        name: info.name,
-                        value: info.value,
-                        description: info.description,
-                    });
-                }, 0);
-            },
-            delInfo(info, index) {
-                let app = this;
-                app.$confirm({
-                    title: '确定删除当前字段吗？',
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        delProjectInfo({infoCode: info.code}).then(() => {
-                            app.projectInfoList.splice(index, 1);
-                            // app.init();
-                        });
-                        return Promise.resolve();
-                    }
-                });
+          },
+          yAxis: {
+            show: true,
+            splitLine: {
+              show: true,
+              lineStyle: {
+                type: "dashed",
+                color: ["#e4e4e4"],
+              },
             },
-            handleSubmit() {
-                let app = this;
-                app.infoModal.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
+          },
+          tooltip: {
+            backgroundColor: "#fff",
+            textStyle: {
+              color: "#333",
             },
-            handleOk() {
-                let app = this;
-                app.infoModal.loading = true;
-                let obj = app.infoModal.form.getFieldsValue();
-                if (app.infoModal.newData.code) {
-                    //编辑
-                    obj.infoCode = app.infoModal.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.infoModal.newData);
-                }
-                obj.projectCode = app.code;
-                console.log(obj);
-                doInfo(obj).then(res => {
-                    app.infoModal.loading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.infoModal.form.resetFields();
-                    app.infoModal.newData = {code: 0};
-                    app.infoModal.modalStatus = false;
-                    app.getProjectInfoList();
-                });
+            borderWidth: 1,
+            borderColor: "#e8e8e8",
+          },
+          axisPointer: {
+            lineStyle: {
+              width: 0,
             },
-            collectProject() {
-                const type = this.project.collected ? 'cancel' : 'collect';
-                collect(this.project.code, type).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.project.collected = !this.project.collected;
-                })
-            },
-            ondateChange(e) {
-                console.log(e);
-                const project = this.project;
-                doData({
-                    projectCode: project.code,
-                    begin_time: e.length ? e[0].format('YYYY-MM-DD') : '',
-                    end_time: e.length ? e[1].format('YYYY-MM-DD') : '',
-                });
-            },
-            formatTime(time) {
-                return relativelyTime(time);
-            },
-        }
-    }
-</script>
+          },
+        },
+      },
+      chartData: {
+        columns: ["日期", "任务"],
+        rows: [],
+      },
+      chartSettings: {
+        area: true,
+        itemStyle: {
+          color: "#1890ff",
+        },
+        areaStyle: {
+          color: "#e6f7ff",
+        },
+      },
+      chartExtend: {
+        grid: {
+          left: "-20",
+          right: "0",
+          top: "10",
+          bottom: "0",
+        },
+        xAxis: {
+          show: false,
+        },
+        yAxis: {
+          show: false,
+        },
+        tooltip: {
+          backgroundColor: "#fff",
+          textStyle: {
+            color: "#333",
+          },
+          borderWidth: 1,
+          borderColor: "#e8e8e8",
+        },
+        axisPointer: {
+          lineStyle: {
+            width: 0,
+          },
+        },
+      },
 
-<style lang="less">
-    /*@import "../../../assets/css/components/task";*/
-    .project-info {
-        .ant-modal-body {
-            padding-bottom: 0;
+      projectStats: [
+        {
+          title: "未完成",
+          key: "unDone",
+          number: 0,
+          schedule: 0,
+        },
+        {
+          title: "已完成",
+          key: "done",
+          number: 0,
+          schedule: 0,
+        },
+        {
+          title: "已逾期",
+          key: "overdue",
+          number: 0,
+          schedule: 0,
+        },
+        {
+          title: "待认领",
+          key: "toBeAssign",
+          number: 0,
+          schedule: 0,
+        },
+        {
+          title: "今日到期",
+          key: "expireToday",
+          number: 0,
+          schedule: 0,
+        },
+        {
+          title: "逾期完成",
+          key: "doneOverdue",
+          number: 0,
+          schedule: 0,
+        },
+      ],
+    };
+  },
+  created() {
+    this.getProject();
+    this.init();
+  },
+  methods: {
+    moment,
+    init() {
+      this.getProjectInfoList();
+      this.getProjectLog();
+      this.overviewForProject();
+      this.getProjectStats();
+      this.getProjectReport();
+    },
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+        if (this.project.begin_time) {
+          this.projectDate = [
+            moment(this.project.begin_time),
+            moment(this.project.end_time),
+          ];
         }
-    }
-
-    .project-space-overview {
-        .project-navigation {
-            top: 65px;
-            z-index: 4;
+      });
+    },
+    getProjectReport() {
+      let app = this;
+      _getProjectReport({ projectCode: this.code }).then((res) => {
+        let rows = [];
+        res.data.date.forEach((v) => {
+          rows.push({ 日期: v });
+        });
+        app.burnoutMap.loading = false;
+        app.burnoutMap.chartData.rows = rows;
+        app.burnoutMap.series[0].data = res.data.undoneTask;
+        app.burnoutMap.series[1].data = res.data.baseLineList;
+      });
+    },
+    getProjectLog(reset = true) {
+      let app = this;
+      if (reset) {
+        app.pagination.page = 1;
+        app.pagination.pageSize = 20;
+        app.showLoadingMore = false;
+      }
+      this.requestData.projectCode = this.code;
+      getLogBySelfProject(this.requestData).then((res) => {
+        let list = [];
+        res.data.list.forEach((item) => {
+          list.push(item);
+          //只显示任务的完成动态
+          // if (item.action_type === 'task') {
+          //     if ((item.type === 'done' || item.type === 'redo')) {
+          //         list.push(item);
+          //     }
+          // } else {
+          //     list.push(item);
+          // }
+        });
+        if (reset) {
+          app.activities = [];
         }
-
-        .wrapper-main {
-            background: initial;
-
+        app.activities = app.activities.concat(list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.activities.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    getProjectInfoList() {
+      let app = this;
+      getInfoList({ projectCode: app.code }).then((res) => {
+        app.projectInfoList = res.data;
+      });
+    },
+    getProjectStats() {
+      _projectStats({
+        projectCode: this.code,
+      }).then((res) => {
+        const taskStats = res.data;
+        const total = taskStats["total"];
+        this.projectStats.forEach((v, k) => {
+          v.number = taskStats[v.key];
+          if (total) {
+            v.schedule = parseInt((v.number / total) * 100);
+          }
+        });
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.getProjectLog(false);
+    },
+    overviewForProject() {
+      dateTotalForProject({ projectCode: this.code }).then((res) => {
+        let list = [];
+        res.data.forEach((v) => {
+          list.push({
+            日期: moment(v.date).format("M月D日"),
+            任务: v.total,
+          });
+        });
+        this.chartData.rows = list;
+      });
+    },
+    createInfo() {
+      let app = this;
+      app.infoModal.newData = { code: "" };
+      setTimeout(function () {
+        app.infoModal.form && app.infoModal.form.resetFields();
+      }, 0);
+      app.infoModal.modalStatus = true;
+      app.infoModal.modalTitle = "添加字段";
+    },
+    editInfo(info) {
+      let app = this;
+      app.infoModal.newData = info;
+      app.infoModal.modalStatus = true;
+      setTimeout(function () {
+        app.infoModal.modalTitle = "编辑字段";
+        app.infoModal.form.setFieldsValue({
+          name: info.name,
+          value: info.value,
+          description: info.description,
+        });
+      }, 0);
+    },
+    delInfo(info, index) {
+      let app = this;
+      app.$confirm({
+        title: "确定删除当前字段吗？",
+        okText: "删除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          delProjectInfo({ infoCode: info.code }).then(() => {
+            app.projectInfoList.splice(index, 1);
+            // app.init();
+          });
+          return Promise.resolve();
+        },
+      });
+    },
+    handleSubmit() {
+      let app = this;
+      app.infoModal.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
         }
-
-        .layout-content {
-            padding: 12px;
-            width: 1100px;
-            margin: 12px auto auto;
-            background: initial;
-
-            .overview-item {
-                display: flex;
-                flex-direction: row;
-                justify-content: space-between;
-            }
-
-            .content-item {
-                background: #fff;
-                padding: 6px 18px 18px 18px;
-                border-radius: 4px;
-                width: 100%;
-
-                .title {
-                    font-size: 16px;
-                    padding: 6px 0 0 0;
-                }
-            }
-
-            .content-left {
-                width: 730px;
-
-                .log-list {
-                    background: #fff;
-                    margin-bottom: 15px;
-
-                    .list-content {
-                        padding-top: 12px;
-
-                        .ant-list-item-meta-title {
-                            position: relative;
-                        }
-
-                        .right-item {
-                            float: right;
-                            position: absolute;
-                            right: 0;
-                            top: 0;
-                        }
-                    }
-                }
-            }
-
-            .content-right {
-                width: 325px;
-
-                .project-date {
-                    .ant-calendar-picker {
-                        border: none;
-
-                        &:focus {
-                            border: none;
-                        }
-
-                    }
-
-                    .ant-calendar-picker-input {
-                        border: none;
-                    }
-                }
-
-                .project-stats {
-                    .stats-content {
-                        display: flex;
-                        flex-wrap: wrap;
-
-                        .stats-item {
-                            width: 80px;
-                            /*height: 100px;*/
-                            margin-right: 16px;
-                            margin-bottom: 16px;
-                            padding: 12px;
-
-                            .stats-title {
-                            }
-
-                            .stats-number {
-                                /*font-weight: bold;*/
-                                font-size: 32px;
-                            }
-                        }
-                    }
-                }
-            }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.infoModal.loading = true;
+      let obj = app.infoModal.form.getFieldsValue();
+      if (app.infoModal.newData.code) {
+        //编辑
+        obj.infoCode = app.infoModal.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.infoModal.newData);
+      }
+      obj.projectCode = app.code;
+      console.log(obj);
+      doInfo(obj).then((res) => {
+        app.infoModal.loading = false;
+        if (!checkResponse(res)) {
+          return;
         }
-    }
-</style>
+        app.infoModal.form.resetFields();
+        app.infoModal.newData = { code: 0 };
+        app.infoModal.modalStatus = false;
+        app.getProjectInfoList();
+      });
+    },
+    collectProject() {
+      const type = this.project.collected ? "cancel" : "collect";
+      collect(this.project.code, type).then((res) => {
+        if (!checkResponse(res)) {
+          return;
+        }
+        this.project.collected = !this.project.collected;
+      });
+    },
+    ondateChange(e) {
+      console.log(e);
+      const project = this.project;
+      doData({
+        projectCode: project.code,
+        begin_time: e.length ? e[0].format("YYYY-MM-DD") : "",
+        end_time: e.length ? e[1].format("YYYY-MM-DD") : "",
+      });
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+  },
+};
+</script>
diff --git a/src/views/project/space/task.vue b/src/views/project/space/task.vue
index 4c7db7d..964bcbf 100644
--- a/src/views/project/space/task.vue
+++ b/src/views/project/space/task.vue
@@ -1,1391 +1,1504 @@
 <template>
-    <div class="project-space-task" :class="project.task_board_theme">
-        <div class="project-navigation">
-            <div class="project-nav-header">
-                <a-breadcrumb>
-                    <a-breadcrumb-item>
-                        <a @click="toHome">
-                            <a-icon type="home"/>
-                            首页
-                        </a>
-                    </a-breadcrumb-item>
-                    <a-breadcrumb-item>
-                        <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
-                        <span class="actions">
-                             <a-tooltip :mouseEnterDelay="0.3" :title="project.collected ? '取消收藏' : '加入收藏'"
-                                        @click="collectProject">
-                            <a-icon type="star" theme="filled" style="color: grey;" v-show="!project.collected"/>
-                            <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="project.collected"/>
-                        </a-tooltip>
-                        </span>
-                        <span class="label label-normal" v-if="project.private === 0"><a-icon type="global"/> 公开</span>
-                    </a-breadcrumb-item>
-                </a-breadcrumb>
-            </div>
-            <section class="nav-body">
-                <ul class="nav-wrapper nav nav-underscore pull-left">
-                    <li class="actives"><a class="app" data-app="tasks">任务</a></li>
-                    <li class=""><a class="app" data-app="works"
-                                    @click="$router.push('/project/space/files/' + code)">
-                        文件</a>
-                    <li class=""><a class="app" data-app="build"
-                                    @click="$router.push('/project/space/overview/' + code)">
-                        概览</a>
-                    </li>
-                    <li class=""><a class="app" data-app="build"
-                                    @click="$router.push('/project/space/features/' + code)">
-                        版本</a>
-                    </li>
-                </ul>
-            </section>
-            <div class="project-nav-footer">
-                <a class="footer-item" @click="visibleDraw('taskSearch')">
-                    <a-icon type="search"></a-icon>
-                    <span> 筛选</span>
-                </a>
-                <a class="footer-item" :class="{active:slideMenuKey == 'member'}" @click="visibleDraw('member')">
-                    <a-icon type="user"></a-icon>
-                    <span> {{projectMembers.length}}</span>
-                </a>
-                <a class="footer-item" :class="{active:slideMenuKey == 'config'}" @click="visibleDraw('config')">
-                    <a-icon type="menu"></a-icon>
-                    <span> 菜单</span>
-                </a>
-            </div>
-        </div>
-        <wrapper-content :showHeader="false">
-            <draggable v-model="taskStages"
-                       :options="{group:'stages',filter:'.undraggables',handle:'.ui-sortable-handle',ghostClass:'stage-ghost',animation: 200,forceFallback:false}"
-                       id="board-scrum-stages" class="board-scrum-stages" @end="stageSort">
-                <div class="scrum-stage" v-for="(stage,index) in taskStages" :key="index" :id="stage.code"
-                     :class="{ 'fixed-creator': stage.fixedCreator == true}">
-                    <!--<a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">-->
-                    <!--<a-tooltip placement="top" >
+  <div
+    class="project-space-task"
+    ref="taskarea"
+    :class="project.task_board_theme"
+  >
+    <a-row class="project-navigation" align="middle" justify="center">
+      <a-col class="project-nav-header" :span="8" :xs="24" :sm="24" :md="24" :lg="8">
+        <a-breadcrumb>
+          <a-breadcrumb-item>
+            <a @click="toHome">
+              <a-icon type="home" />首页
+            </a>
+          </a-breadcrumb-item>
+          <a-breadcrumb-item>
+            <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
+            <span class="actions">
+              <a-tooltip
+                :mouseEnterDelay="0.3"
+                :title="project.collected ? '取消收藏' : '加入收藏'"
+                @click="collectProject"
+              >
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: grey;"
+                  v-show="!project.collected"
+                />
+                <a-icon
+                  type="star"
+                  theme="filled"
+                  style="color: #ffaf38;"
+                  v-show="project.collected"
+                />
+              </a-tooltip>
+            </span>
+            <span class="label label-normal" v-if="project.private === 0">
+              <a-icon type="global" />公开
+            </span>
+          </a-breadcrumb-item>
+        </a-breadcrumb>
+      </a-col>
+      <a-col class="nav-body" :span="8" :xs="24" :sm="24" :md="24" :lg="8">
+        <ul class="nav-wrapper nav nav-underscore">
+          <li class="actives" data-app="tasks" @click="init">任务</li>
+          <li class data-app="works" @click="$router.push('/project/space/files/' + code)">文件</li>
+          <li class data-app="build" @click="$router.push('/project/space/overview/' + code)">概览</li>
+          <li class data-app="build" @click="$router.push('/project/space/features/' + code)">版本</li>
+        </ul>
+      </a-col>
+      <a-col class="project-nav-footer" :span="8" :xs="24" :sm="24" :md="24" :lg="8">
+        <a class="footer-item" @click="visibleDraw('taskSearch')">
+          <a-icon type="search"></a-icon>
+          <span>筛选</span>
+        </a>
+        <a
+          class="footer-item"
+          :class="{active:slideMenuKey == 'member'}"
+          @click="visibleDraw('member')"
+        >
+          <a-icon type="user"></a-icon>
+          <span>{{projectMembers.length}}</span>
+        </a>
+        <a
+          class="footer-item"
+          :class="{active:slideMenuKey == 'config'}"
+          @click="visibleDraw('config')"
+        >
+          <a-icon type="menu"></a-icon>
+          <span>菜单</span>
+        </a>
+      </a-col>
+    </a-row>
+    <wrapper-content :style="{height:'100%'}" :showHeader="false">
+      <draggable
+        v-model="taskStages"
+        :options="{group:'stages',filter:'.undraggables',handle:'.ui-sortable-handle',ghostClass:'stage-ghost',animation: 200,forceFallback:false}"
+        id="board-scrum-stages"
+        class="board-scrum-stages"
+        :style="{height:'100%'}"
+        @end="stageSort"
+      >
+        <div
+          class="scrum-stage"
+          v-for="(stage,index) in taskStages"
+          :key="index"
+          :id="stage.code"
+          :class="{ 'fixed-creator': stage.fixedCreator == true}"
+        >
+          <!--<a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">-->
+          <!--<a-tooltip placement="top" >
                      <template slot="title">
                          {{ stage.name }}
                          <span class="task-count" v-if="stage.list.length > 0"> · {{ stage.list.length }}</span>
-                     </template>-->
-                    <header class="scrum-stage-header ui-sortable-handle" v-show="!stage.tasksLoading">
-                        <div class="stage-name hinted">
-                            {{ stage.name }}
-                            <span class="task-count"
-                                  v-if="stage.tasks.length > 0"> · {{ stage.tasks.length }}</span>
-                        </div>
-                        <div class="stage-menu-toggler popover">
-                            <a-dropdown :trigger="['click']" placement="bottomCenter">
-                                <a-tooltip placement="top">
-                                    <template slot="title">
-                                        <span>编辑任务列表</span>
-                                    </template>
-                                    <a href="javascript:void(0)" class="menu-toggler-title">
-                                        <a-icon type="ellipsis" style="font-size: 18px;"/>
-                                    </a>
-                                </a-tooltip>
-                                <!--<div slot="overlay" class="task-popover-content">-->
-                                <!--<header class="popover-header" name="333">
+          </template>-->
+          <header class="scrum-stage-header ui-sortable-handle" v-show="!stage.tasksLoading">
+            <div class="stage-name hinted">
+              {{ stage.name }}
+              <span
+                class="task-count"
+                v-if="stage.tasks.length > 0"
+              >· {{ stage.tasks.length }}</span>
+            </div>
+            <div class="stage-menu-toggler popover">
+              <a-dropdown :trigger="['click']" placement="bottomCenter">
+                <a-tooltip placement="top">
+                  <template slot="title">
+                    <span>编辑任务列表</span>
+                  </template>
+                  <a href="javascript:void(0)" class="menu-toggler-title">
+                    <a-icon type="ellipsis" style="font-size: 18px;" />
+                  </a>
+                </a-tooltip>
+                <!--<div slot="overlay" class="task-popover-content">-->
+                <!--<header class="popover-header" name="333">
                                     <span class="popover-title">列表菜单</span>
-                                </header>-->
-                                <a-menu slot="overlay" @click="doStage" :selectable="false">
-                                    <a-menu-item :key="'editStage_' + stage.code + '_' + index">
-                                        <a-icon type="edit"></a-icon>
-                                        编辑列表
-                                    </a-menu-item>
-                                    <a-menu-item :key="'setExecutor_' + stage.code + '_' + index">
-                                        <a-icon size="14" type="user"></a-icon>
-                                        设置本列所有任务执行者
-                                    </a-menu-item>
-                                    <!--<a-menu-item :key="'setEndTime_' + stage.code + '_' + index">
+                </header>-->
+                <a-menu slot="overlay" @click="doStage" :selectable="false">
+                  <a-menu-item :key="'editStage_' + stage.code + '_' + index">
+                    <a-icon type="edit"></a-icon>编辑列表
+                  </a-menu-item>
+                  <a-menu-item :key="'setExecutor_' + stage.code + '_' + index">
+                    <a-icon size="14" type="user"></a-icon>设置本列所有任务执行者
+                  </a-menu-item>
+                  <!--<a-menu-item :key="'setEndTime_' + stage.code + '_' + index">
                                         <a-icon size="14" type="clock-circle"></a-icon>
                                         设置本列所有任务截止时间 *
-                                    </a-menu-item>-->
-                                    <a-menu-item :key="'recycleBatch_' + stage.code + '_' + index">
-                                        <a-icon size="14" type="delete"></a-icon>
-                                        本列所有任务移到回收站
-                                    </a-menu-item>
-                                    <a-menu-item :key="'delStage_' + stage.code + '_' + index">
-                                        <a-icon size="14" type="delete"></a-icon>
-                                        删除列表
-                                    </a-menu-item>
-                                </a-menu>
-                                <!--</div>-->
-                            </a-dropdown>
-                        </div>
-                    </header>
-                    <!--</a-tooltip>-->
-                    <div class="scrum-stage-wrap ui-sortable"
-                         :class="{ 'hidden-creator-bottom': stage.showTaskCard}">
-                        <vue-scroll :ref="index + '-stage'" @handle-resize="handleResize($event,index)"
-                                    :ops="scrollOps">
-                            <section :id="stage.code" :task-type-index="index"
-                                     class="scrum-stage-content thin-scroll">
-                                <a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">
-                                    <!--未完成列表-->
-                                    <draggable v-model="stage.unDoneTasks"
-                                               :options="{group:'task',ghostClass:'task-ghost',dragClass:'task-drag',fallbackClass:'task-drag',forceFallback:false}"
-                                               @end="taskSort"
-                                               class="scrum-stage-tasks">
-                                        <template v-for="(task,taskIndex) in stage.unDoneTasks">
-                                            <div class="task task-card ui-sortable-handle"
-                                                 :index="taskIndex"
-                                                 :id="task.code"
-                                                 :key="task. code"
-                                                 :class="showTaskPri(task.pri)"
-                                                 v-if="!task.done && task.canRead"
-                                                 @click.stop="taskDetail(task.code,index)"
-                                            >
-                                                <div class="task-priority bg-priority-0"></div>
-                                                <a-tooltip :placement="index > 0 ? 'top':'right'">
-                                                    <template slot="title">
-                                                        <span v-if="task.hasUnDone" style="font-size: 12px;">子任务尚未全部完成，无法完成父任务</span>
-                                                    </template>
-                                                    <div class="check-box-wrapper"
-                                                         @click.stop="taskDone(task.code,index,taskIndex,1)">
-                                                        <a-icon class="check-box" :class="{'disabled': task.hasUnDone}"
-                                                                type="border" :style="{fontSize:'16px'}"/>
-                                                    </div>
-                                                    <!--<a class="check-box"
+                  </a-menu-item>-->
+                  <a-menu-item :key="'recycleBatch_' + stage.code + '_' + index">
+                    <a-icon size="14" type="delete"></a-icon>本列所有任务移到回收站
+                  </a-menu-item>
+                  <a-menu-item :key="'delStage_' + stage.code + '_' + index">
+                    <a-icon size="14" type="delete"></a-icon>删除列表
+                  </a-menu-item>
+                </a-menu>
+                <!--</div>-->
+              </a-dropdown>
+            </div>
+          </header>
+          <!--</a-tooltip>-->
+          <div
+            class="scrum-stage-wrap ui-sortable"
+            :class="{ 'hidden-creator-bottom': stage.showTaskCard}"
+          >
+            <vue-scroll
+              :ref="index + '-stage'"
+              @handle-resize="handleResize($event,index)"
+              :ops="scrollOps"
+            >
+              <section
+                :id="stage.code"
+                :task-type-index="index"
+                class="scrum-stage-content thin-scroll"
+              >
+                <a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">
+                  <!--未完成列表-->
+                  <draggable
+                    v-model="stage.unDoneTasks"
+                    :options="{group:'task',ghostClass:'task-ghost',dragClass:'task-drag',fallbackClass:'task-drag',forceFallback:false}"
+                    @end="taskSort"
+                    class="scrum-stage-tasks"
+                  >
+                    <template v-for="(task,taskIndex) in stage.unDoneTasks">
+                      <div
+                        class="task task-card ui-sortable-handle"
+                        :index="taskIndex"
+                        :id="task.code"
+                        :key="task. code"
+                        :class="showTaskPri(task.pri)"
+                        v-if="!task.done && task.canRead"
+                        @click.stop="taskDetail(task.code,index)"
+                      >
+                        <div class="task-priority bg-priority-0"></div>
+                        <a-tooltip :placement="index > 0 ? 'top':'right'">
+                          <template slot="title">
+                            <span v-if="task.hasUnDone" style="font-size: 12px;">子任务尚未全部完成，无法完成父任务</span>
+                          </template>
+                          <div
+                            class="check-box-wrapper"
+                            @click.stop="taskDone(task.code,index,taskIndex,1)"
+                          >
+                            <a-icon
+                              class="check-box"
+                              :class="{'disabled': task.hasUnDone}"
+                              type="border"
+                              :style="{fontSize:'16px'}"
+                            />
+                          </div>
+                          <!--<a class="check-box"
                                                        :class="{'disabled': task.hasUnDone}"
-                                                       @click.stop="taskDone(task.code,index,taskIndex,1)"></a>-->
-                                                </a-tooltip>
-                                                <div class="task-content-set open-detail">
-                                                    <div class="task-content-wrapper">
-                                                        <div class="task-content"> {{ task.name }}</div>
-                                                        <a-tooltip placement="top"
-                                                                   v-if="task.executor && task.executor.avatar">
-                                                            <template slot="title">
-                                                                <span>{{task.executor.name}}</span>
-                                                            </template>
-                                                            <img
-                                                                    :src="task.executor.avatar"
-                                                                    :title="task.executor.name"
-                                                                    class="avatar img-circle img-24 hinted">
-                                                        </a-tooltip>
-                                                    </div>
-                                                    <div class="task-info-wrapper clearfix">
-                                                        <div class="task-infos">
-                                                            <span class="icon-wrapper" :style="{color: getStatusColor(task.status), fontSize: '12px'}" v-if="task.status">{{task.statusText}}</span>
-                                                       <span class="label" :class="showTimeLabel(task.end_time)"
-                                                             v-if="task.end_time">
-                                                            <span :title="task.end_time">
-                                                               {{ showTaskTime(task.begin_time,task.end_time)}}
-                                                            </span>
-                                                        </span>
-                                                            <span class="icon-wrapper muted" v-if="task.description">
-                                                           <a-icon type="file-text"></a-icon>
-                                                       </span>
-                                                            <span class="icon-wrapper muted" v-if="task.hasSource">
-                                                             <a-icon type="link"></a-icon>
-                                                       </span>
-                                                            <span class="icon-wrapper muted" v-if="task.hasComment">
-                                                           <a-icon type="message"/>
-                                                        </span>
-                                                            <span class="icon-wrapper muted"
-                                                                  v-if="task.childCount[0] > 0">
-                                                             <a-icon type="bars"></a-icon>
-                                                            <span>{{task.childCount[1]}}/{{task.childCount[0]}}</span>
-                                                       </span>
-                                                            <span class="tag muted" v-for="tag in task.tags"
-                                                                  :key="tag.code"
-                                                            >
-                                                                <a-badge status="success"
-                                                                         :class="`badge-${tag.tag.color}`"/>
-                                                               {{tag.tag.name}}
-                                                           </span>
-                                                            <span :class="'icon-wrapper text text-' + task.task_execute.color"
-                                                                  v-if="task.execute_state > 0">{{ task.task_execute_name }}</span>
-                                                            <span class="icon-wrapper muted" v-if="task.like">
-                                                           <a-icon type="like"/>
-                                                                <span>{{task.like}}</span>
-                                                       </span>
-                                                        </div>
-                                                    </div>
-                                                    <footer class="task-info-footer"
-                                                            v-if="project.prefix && project.open_prefix">
-                                                        <span class="task-id-number">
-                                                            {{project.prefix}}-{{task.id_num}}
-                                                        </span>
-                                                    </footer>
-                                                </div>
-                                            </div>
-                                        </template>
-                                    </draggable>
-                                    <!--创建任务卡片-->
-                                    <div class="task-creator-wrap card" :id="'card' + index"
-                                         v-show="stage.showTaskCard">
-                                        <form class="task-creator">
-                                            <a-input :ref="`inputTaskName${index}`" v-model="task.name"
-                                                     class="task-content-input" type="textarea"
-                                                     :rows="3"
-                                                     placeholder="任务内容" @keyup.enter="createTask(stage.code,index)"/>
-                                            <div class="handler-wrap">
-                                                <a-dropdown :trigger="['click']">
-                                                    <a class="executor-handler"><img
-                                                            :src="defaultExecutor.avatar"
-                                                            class="avatar img-circle img-24 hinted"> <span
-                                                            class="creator-handler-text name">{{ defaultExecutor.name }}</span></a>
-                                                    <a-menu class="executor-handler-menu" @click="selectExecutor"
-                                                            slot="overlay">
-                                                        <a-menu-item
-                                                                v-for="(member,index) in projectMembers"
-                                                                :key="index">
-                                                            <img class="avatar img-circle img-32 pull-left m-r-sm "
-                                                                 :src="member.avatar">
-                                                            <span class="muted"
-                                                                  style="line-height: 25px;">{{ member.name }}</span>
-                                                            <a-icon type="check" class="muted"
-                                                                    v-if="member.code == defaultExecutor.code"></a-icon>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </div>
-                                            <div class="submit-set">
-                                                <a-button type="default" size="large" class="middle-btn"
-                                                          @click.stop="showTaskCard(index,false)">取消
-                                                </a-button>
-                                                <a-button :loading="createTaskLoading" :disabled="!task.name"
-                                                          type="primary" size="large"
-                                                          class="middle-btn" :class="{'disabled-btn':!task.name}"
-                                                          @click.stop="createTask(stage.code,index)">创建
-                                                </a-button>
-                                            </div>
-                                        </form>
-                                    </div>
-                                    <!--已完成列表-->
-                                    <draggable v-model="stage.doneTasks"
-                                               :options="{group:'task-done',ghostClass:'task-ghost',dragClass:'task-drag',fallbackClass:'task-drag',forceFallback:false}"
-                                               @end="taskSort"
-                                               class="scrum-stage-tasks-done">
-                                        <!--<ul v-if="stage.tasks.length" class="scrum-stage-tasks-done">-->
-                                        <template v-for="(task,taskIndex) in stage.doneTasks">
-                                            <div class="task done task-card ui-sortable-handle"
-                                                 :index="taskIndex"
-                                                 :id="task.code"
-                                                 :key="task.code"
-                                                 v-if="task.canRead"
-                                                 @click.stop="taskDetail(task.code,index)"
-                                            >
-                                                <div class="task-priority bg-priority-0"></div>
-                                                <span class="check-box-wrapper"
-                                                      @click.stop="taskDone(task.code,index,taskIndex,0)">
-                                                       <a-icon class="check-box" type="check-square"
-                                                               :style="{fontSize:'16px'}"
-                                                               :class="{'disabled': task.hasUnDone}"/>
-                                                </span>
-                                                <!--<a class="check-box"
+                          @click.stop="taskDone(task.code,index,taskIndex,1)"></a>-->
+                        </a-tooltip>
+                        <div class="task-content-set open-detail">
+                          <div class="task-content-wrapper">
+                            <div class="task-content">{{ task.name }}</div>
+                            <a-tooltip placement="top" v-if="task.executor && task.executor.avatar">
+                              <template slot="title">
+                                <span>{{task.executor.name}}</span>
+                              </template>
+                              <img
+                                :src="task.executor.avatar"
+                                :title="task.executor.name"
+                                class="avatar img-circle img-24 hinted"
+                              />
+                            </a-tooltip>
+                          </div>
+                          <div class="task-info-wrapper clearfix">
+                            <div class="task-infos">
+                              <span
+                                class="icon-wrapper"
+                                :style="{color: getStatusColor(task.status), fontSize: '12px'}"
+                                v-if="task.status"
+                              >{{task.statusText}}</span>
+                              <span
+                                class="label"
+                                :class="showTimeLabel(task.end_time)"
+                                v-if="task.end_time"
+                              >
+                                <span
+                                  :title="task.end_time"
+                                >{{ showTaskTime(task.begin_time,task.end_time)}}</span>
+                              </span>
+                              <span class="icon-wrapper muted" v-if="task.description">
+                                <a-icon type="file-text"></a-icon>
+                              </span>
+                              <span class="icon-wrapper muted" v-if="task.hasSource">
+                                <a-icon type="link"></a-icon>
+                              </span>
+                              <span class="icon-wrapper muted" v-if="task.hasComment">
+                                <a-icon type="message" />
+                              </span>
+                              <span class="icon-wrapper muted" v-if="task.childCount[0] > 0">
+                                <a-icon type="bars"></a-icon>
+                                <span>{{task.childCount[1]}}/{{task.childCount[0]}}</span>
+                              </span>
+                              <span class="tag muted" v-for="tag in task.tags" :key="tag.code">
+                                <a-badge status="success" :class="`badge-${tag.tag.color}`" />
+                                {{tag.tag.name}}
+                              </span>
+                              <span
+                                :class="'icon-wrapper text text-' + task.task_execute.color"
+                                v-if="task.execute_state > 0"
+                              >{{ task.task_execute_name }}</span>
+                              <span class="icon-wrapper muted" v-if="task.like">
+                                <a-icon type="like" />
+                                <span>{{task.like}}</span>
+                              </span>
+                            </div>
+                          </div>
+                          <footer
+                            class="task-info-footer"
+                            v-if="project.prefix && project.open_prefix"
+                          >
+                            <span class="task-id-number">{{project.prefix}}-{{task.id_num}}</span>
+                          </footer>
+                        </div>
+                      </div>
+                    </template>
+                  </draggable>
+                  <!--创建任务卡片-->
+                  <div
+                    class="task-creator-wrap card"
+                    :id="'card' + index"
+                    v-show="stage.showTaskCard"
+                  >
+                    <form class="task-creator">
+                      <a-input
+                        :ref="`inputTaskName${index}`"
+                        v-model="task.name"
+                        class="task-content-input"
+                        type="textarea"
+                        :rows="3"
+                        placeholder="任务内容"
+                        @keyup.enter="createTask(stage.code,index)"
+                      />
+                      <div class="handler-wrap">
+                        <a-dropdown :trigger="['click']">
+                          <a class="executor-handler">
+                            <img
+                              :src="defaultExecutor.avatar"
+                              class="avatar img-circle img-24 hinted"
+                            />
+                            <span class="creator-handler-text name">{{ defaultExecutor.name }}</span>
+                          </a>
+                          <a-menu
+                            class="executor-handler-menu"
+                            @click="selectExecutor"
+                            slot="overlay"
+                          >
+                            <a-menu-item v-for="(member,index) in projectMembers" :key="index">
+                              <img
+                                class="avatar img-circle img-32 pull-left m-r-sm"
+                                :src="member.avatar"
+                              />
+                              <span class="muted" style="line-height: 25px;">{{ member.name }}</span>
+                              <a-icon
+                                type="check"
+                                class="muted"
+                                v-if="member.code == defaultExecutor.code"
+                              ></a-icon>
+                            </a-menu-item>
+                          </a-menu>
+                        </a-dropdown>
+                      </div>
+                      <div class="submit-set">
+                        <a-button
+                          type="default"
+                          size="large"
+                          class="middle-btn"
+                          @click.stop="showTaskCard(index,false)"
+                        >取消</a-button>
+                        <a-button
+                          :loading="createTaskLoading"
+                          :disabled="!task.name"
+                          type="primary"
+                          size="large"
+                          class="middle-btn"
+                          :class="{'disabled-btn':!task.name}"
+                          @click.stop="createTask(stage.code,index)"
+                        >创建</a-button>
+                      </div>
+                    </form>
+                  </div>
+                  <!--已完成列表-->
+                  <draggable
+                    v-model="stage.doneTasks"
+                    :options="{group:'task-done',ghostClass:'task-ghost',dragClass:'task-drag',fallbackClass:'task-drag',forceFallback:false}"
+                    @end="taskSort"
+                    class="scrum-stage-tasks-done"
+                  >
+                    <!--<ul v-if="stage.tasks.length" class="scrum-stage-tasks-done">-->
+                    <template v-for="(task,taskIndex) in stage.doneTasks">
+                      <div
+                        class="task done task-card ui-sortable-handle"
+                        :index="taskIndex"
+                        :id="task.code"
+                        :key="task.code"
+                        v-if="task.canRead"
+                        @click.stop="taskDetail(task.code,index)"
+                      >
+                        <div class="task-priority bg-priority-0"></div>
+                        <span
+                          class="check-box-wrapper"
+                          @click.stop="taskDone(task.code,index,taskIndex,0)"
+                        >
+                          <a-icon
+                            class="check-box"
+                            type="check-square"
+                            :style="{fontSize:'16px'}"
+                            :class="{'disabled': task.hasUnDone}"
+                          />
+                        </span>
+                        <!--<a class="check-box"
                                                    @click.stop="taskDone(task.code,index,taskIndex,0)">
                                                     <a-icon type="check"/>
-                                                </a>-->
-                                                <div class="task-content-set open-detail">
-                                                    <div class="task-content-wrapper">
-                                                        <div class="task-content">{{ task.name }}</div>
-                                                        <a-tooltip placement="top"
-                                                                   v-if="task.executor && task.executor.avatar">
-                                                            <template slot="title">
-                                                                <span>{{task.executor.name}}</span>
-                                                            </template>
-                                                            <img v-if="task.executor && task.executor.avatar"
-                                                                 :src="task.executor.avatar"
-                                                                 :title="task.executor.name"
-                                                                 class="avatar img-circle img-24 hinted">
-                                                        </a-tooltip>
-                                                    </div>
-                                                    <div class="task-info-wrapper clearfix">
-                                                        <div class="task-infos">
-                                            <span class="tag muted" :class="'tag-color-'+ tag.color"
-                                                  v-for="(tag,tag_index) in task.task_tag_item_list" :key="tag.code"> {{ tag.name }} </span>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </template>
-                                        <!--</ul>-->
-                                    </draggable>
-                                    <div class="scrum-stage-tasks-done" v-show="stage.canNotReadCount">
-                                        <li class="task muted" style="margin: 0 10px 8px;">
-                                            <span><a-icon type="lock"></a-icon>
-                                                有 {{stage.canNotReadCount}} 个任务被隐藏（因为设置了仅参与者可见）</span>
-                                        </li>
-                                    </div>
-                                    <!--添加任务按钮-->
-                                    <div class="task-creator-handler-wrap" @click.stop="showTaskCard(index)"
-                                         v-if="!stage.showTaskCard">
-                                        <a class="task-creator-handler link-add-handler">
-                                            <a-icon type="plus-circle" style="padding-right: 6px;"></a-icon>
-                                            添加任务
-                                        </a>
-                                    </div>
-                                </a-spin>
-                            </section>
-                        </vue-scroll>
-                    </div>
-                    <!--</a-spin>-->
-                </div>
-                <div class="scrum-stage undraggable create-stage">
-                    <header class="scrum-stage-header">
-                        <div class="stage-name hinted" style="width: 100%">
-                            <a class="muted" v-show="!showCreateStage" @click="showInputStrageName">
-                                <a-icon type="plus"/>
-                                <span class="m-l-xs">新建任务列表</span>
-                            </a>
-                            <div v-show="showCreateStage">
-                                <div>
-                                    <a-input ref="inputStageName" v-model="stageName" placeholder="新建任务列表..."
-                                             @keyup.enter="creteStage"
-                                             auto-focus></a-input>
-                                </div>
-                                <div class="submit-set create-stage-footer">
-                                    <a type="text" class="cancel-text muted"
-                                       @click="showCreateStage = !showCreateStage">
-                                        取消
-                                    </a>
-                                    <a-button type="primary" class="middle-btn" @click="creteStage">保存</a-button>
-                                </div>
+                        </a>-->
+                        <div class="task-content-set open-detail">
+                          <div class="task-content-wrapper">
+                            <div class="task-content">{{ task.name }}</div>
+                            <a-tooltip placement="top" v-if="task.executor && task.executor.avatar">
+                              <template slot="title">
+                                <span>{{task.executor.name}}</span>
+                              </template>
+                              <img
+                                v-if="task.executor && task.executor.avatar"
+                                :src="task.executor.avatar"
+                                :title="task.executor.name"
+                                class="avatar img-circle img-24 hinted"
+                              />
+                            </a-tooltip>
+                          </div>
+                          <div class="task-info-wrapper clearfix">
+                            <div class="task-infos">
+                              <span
+                                class="tag muted"
+                                :class="'tag-color-'+ tag.color"
+                                v-for="(tag,tag_index) in task.task_tag_item_list"
+                                :key="tag.code"
+                              >{{ tag.name }}</span>
                             </div>
+                          </div>
                         </div>
-                    </header>
+                      </div>
+                    </template>
+                    <!--</ul>-->
+                  </draggable>
+                  <div class="scrum-stage-tasks-done" v-show="stage.canNotReadCount">
+                    <li class="task muted" style="margin: 0 10px 8px;">
+                      <span>
+                        <a-icon type="lock"></a-icon>
+                        有 {{stage.canNotReadCount}} 个任务被隐藏（因为设置了仅参与者可见）
+                      </span>
+                    </li>
+                  </div>
+                  <!--添加任务按钮-->
+                  <div
+                    class="task-creator-handler-wrap"
+                    @click.stop="showTaskCard(index)"
+                    v-if="!stage.showTaskCard"
+                  >
+                    <a class="task-creator-handler link-add-handler">
+                      <a-icon type="plus-circle" style="padding-right: 6px;"></a-icon>添加任务
+                    </a>
+                  </div>
+                </a-spin>
+              </section>
+            </vue-scroll>
+          </div>
+          <!--</a-spin>-->
+        </div>
+        <div class="scrum-stage undraggable create-stage">
+          <header class="scrum-stage-header">
+            <div class="stage-name hinted" style="width: 100%">
+              <a class="muted" v-show="!showCreateStage" @click="showInputStrageName">
+                <a-icon type="plus" />
+                <span class="m-l-xs">新建任务列表</span>
+              </a>
+              <div v-show="showCreateStage">
+                <div>
+                  <a-input
+                    ref="inputStageName"
+                    v-model="stageName"
+                    placeholder="新建任务列表..."
+                    @keyup.enter="creteStage"
+                    auto-focus
+                  ></a-input>
                 </div>
-            </draggable>
-            <router-view></router-view>
-        </wrapper-content>
-        <!--编辑任务列表-->
-        <a-modal
-                :width="360"
-                v-model="stageModal.modalStatus"
-                :title="stageModal.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <a-form
-                    @submit.prevent="editStage"
-                    :form="stageModal.form"
-            >
-                <a-form-item
-                >
-                    <a-input ref="inputStageTitle" placeholder='列表标题'
-                             v-decorator="[
+                <div class="submit-set create-stage-footer">
+                  <a
+                    type="text"
+                    class="cancel-text muted"
+                    @click="showCreateStage = !showCreateStage"
+                  >取消</a>
+                  <a-button type="primary" class="middle-btn" @click="creteStage">保存</a-button>
+                </div>
+              </div>
+            </div>
+          </header>
+        </div>
+      </draggable>
+      <router-view></router-view>
+    </wrapper-content>
+    <!--编辑任务列表-->
+    <a-modal
+      :width="360"
+      v-model="stageModal.modalStatus"
+      :title="stageModal.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="editStage" :form="stageModal.form">
+        <a-form-item>
+          <a-input
+            ref="inputStageTitle"
+            placeholder="列表标题"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入列表标题' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn pull-right">
-                        <a type="text" class="cancel-text muted"
-                           @click="stageModal.modalStatus = false">
-                            取消
-                        </a>
-                        <a-button type="primary" htmlType='submit' class="middle-btn">保存</a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-        <!--项目成员-->
-        <a-drawer
-                wrapClassName="info-drawer"
-                title="项目成员"
-                width=350
-                placement="right"
-                @close="inviteMemberDraw.visible = false"
-                :visible="inviteMemberDraw.visible"
-        >
-            <div class="search-content">
-                <a-input v-model="inviteMemberDraw.keyword" size="large" placeholder="输入昵称或邮箱查找">
-                    <a-icon slot="prefix" type="search"/>
-                </a-input>
-            </div>
-            <div class="member-list">
-                <div class="member-list-item ant-list-item header-action">
-                    <div class="ant-list-item-meta" @click="showInviteMember = true">
-                        <div class="ant-list-item-meta-avatar">
-                            <a-avatar icon="plus"></a-avatar>
-                        </div>
-                        <div class="ant-list-item-meta-content">
-                            <h4 class="ant-list-item-meta-title"><span>邀请新成员</span></h4>
-                        </div>
-                    </div>
-                </div>
-                <a-list
-                        itemLayout="horizontal"
-                        :loading="inviteMemberDraw.searching"
-                        :dataSource="projectMembers"
-                        :locale="{emptyText: (inviteMemberDraw.keyword && inviteMemberDraw.keyword.length > 1) ? '没有搜索到相关成员' : ''}"
-                >
-                    <a-list-item class="member-list-item" slot="renderItem" slot-scope="item,index">
-                   <span slot="actions" v-if="!item.is_owner">
-                         <a class="muted" @click="removeMember(item,index)"><a-icon type="user-delete"/> 移除</a>
-                       <!-- <a-button size="small" type="dashed" icon="user-add"
-                                  v-if="!item.is_owner"
-                        >操作</a-button>-->
-                     </span>
-                        <a-list-item-meta
-                                :description="item.email"
-                        >
-                            <span slot="title">{{item.name}}</span>
-                            <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                        </a-list-item-meta>
-                    </a-list-item>
-                </a-list>
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn pull-right">
+            <a type="text" class="cancel-text muted" @click="stageModal.modalStatus = false">取消</a>
+            <a-button type="primary" htmlType="submit" class="middle-btn">保存</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+    <!--项目成员-->
+    <a-drawer
+      :getContainer="() => $refs.taskarea"
+      wrapClassName="info-drawer"
+      title="项目成员"
+      width="350"
+      placement="right"
+      @close="inviteMemberDraw.visible = false"
+      :visible="inviteMemberDraw.visible"
+    >
+      <div class="search-content">
+        <a-input v-model="inviteMemberDraw.keyword" size="large" placeholder="输入昵称或邮箱查找">
+          <a-icon slot="prefix" type="search" />
+        </a-input>
+      </div>
+      <div class="member-list">
+        <div class="member-list-item ant-list-item header-action">
+          <div class="ant-list-item-meta" @click="showInviteMember = true">
+            <div class="ant-list-item-meta-avatar">
+              <a-avatar icon="plus"></a-avatar>
             </div>
-        </a-drawer>
-        <!--项目设置菜单-->
-        <a-drawer
-                wrapClassName="info-drawer"
-                title="项目设置"
-                width=350
-                placement="right"
-                @close="configDraw.visible = false"
-                :visible="configDraw.visible"
-        >
-            <div class="config-wrapper">
-                <ul class="config-menus">
-                    <li class="menu-item">
-                        <a @click="projectModal.modalStatus = true">
-                            <a-icon type="setting"/>
-                            项目设置
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a @click="taskTagModal.modalStatus = true">
-                            <a-icon type="tags"/>
-                            标签
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a @click="recycleModal.modalStatus = true">
-                            <a-icon type="delete"/>
-                            查看回收站
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a :href="downLoadUrl" target="_blank">
-                            <a-icon type="copy"/>
-                            下载导入任务模板
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a-upload name="file"
-                                  :showUploadList="false"
-                                  :action="uploadAction"
-                                  :beforeUpload="beforeUpload"
-                                  :data="{projectCode: code}"
-                                  :headers="headers"
-                                  @change="handleChange">
-                            <a class="text-default" :loading="uploadLoading" :disabled="uploadLoading">
-                                <a-icon type="upload" v-show="!uploadLoading"/>
-                                上传文件导入任务
-                            </a>
-                        </a-upload>
-                    </li>
-                    <li class="menu-item">
-                        <a>
-                            <a-icon type="logout"/>
-                            导出任务 *
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a>
-                            <a-icon type="copy"/>
-                            复制项目 *
-                        </a>
-                    </li>
-                    <li class="menu-item">
-                        <a>
-                            <a-icon type="block"/>
-                            保存为项目模板 *
-                        </a>
-                    </li>
-                </ul>
-
+            <div class="ant-list-item-meta-content">
+              <h4 class="ant-list-item-meta-title">
+                <span>邀请新成员</span>
+              </h4>
             </div>
-        </a-drawer>
-        <!--项目设置-->
-        <a-modal
-                destroyOnClose
-                class="project-config-modal"
-                :width="800"
-                v-model="projectModal.modalStatus"
-                :title="projectModal.modalTitle"
-                :footer="null"
-        >
-            <project-config :code="code" @update="updateProject"></project-config>
-        </a-modal>
-        <!--回收站-->
-        <a-modal
-                class="recycle-bin-modal"
-                :width="800"
-                v-model="recycleModal.modalStatus"
-                :title="recycleModal.modalTitle"
-                :footer="null"
-        >
-            <recycle-bin v-if="recycleModal.modalStatus" :code="code" @update="init"></recycle-bin>
-        </a-modal>
-        <!--任务标签-->
-        <a-modal
-                class="task-tag-modal"
-                :width="800"
-                v-model="taskTagModal.modalStatus"
-                :title="taskTagModal.modalTitle"
-                :footer="null"
+          </div>
+        </div>
+        <a-list
+          itemLayout="horizontal"
+          :loading="inviteMemberDraw.searching"
+          :dataSource="projectMembers"
+          :locale="{emptyText: (inviteMemberDraw.keyword && inviteMemberDraw.keyword.length > 1) ? '没有搜索到相关成员' : ''}"
         >
-            <task-tag v-if="taskTagModal.modalStatus" :code="code" @update="init"></task-tag>
-        </a-modal>
-        <!--设置任务执行者-->
-        <a-modal
-                class="invite-project-member"
-                :width="360"
-                v-model="projectMemberModal.modalStatus"
-                :title="projectMemberModal.modalTitle"
-                :footer="null"
+          <a-list-item class="member-list-item" slot="renderItem" slot-scope="item,index">
+            <span slot="actions" v-if="!item.is_owner">
+              <a class="muted" @click="removeMember(item,index)">
+                <a-icon type="user-delete" />移除
+              </a>
+              <!-- <a-button size="small" type="dashed" icon="user-add"
+                                  v-if="!item.is_owner"
+              >操作</a-button>-->
+            </span>
+            <a-list-item-meta :description="item.email">
+              <span slot="title">{{item.name}}</span>
+              <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+            </a-list-item-meta>
+          </a-list-item>
+        </a-list>
+      </div>
+    </a-drawer>
+    <!--项目设置菜单-->
+    <a-drawer
+      :getContainer="() => $refs.taskarea"
+      wrapClassName="info-drawer"
+      title="项目设置"
+      width="350"
+      placement="right"
+      @close="configDraw.visible = false"
+      :visible="configDraw.visible"
+    >
+      <div class="config-wrapper">
+        <ul class="config-menus">
+          <li class="menu-item">
+            <a @click="projectModal.modalStatus = true">
+              <a-icon type="setting" />项目设置
+            </a>
+          </li>
+          <li class="menu-item">
+            <a @click="taskTagModal.modalStatus = true">
+              <a-icon type="tags" />标签
+            </a>
+          </li>
+          <li class="menu-item">
+            <a @click="recycleModal.modalStatus = true">
+              <a-icon type="delete" />查看回收站
+            </a>
+          </li>
+          <li class="menu-item">
+            <a :href="downLoadUrl" target="_blank">
+              <a-icon type="copy" />下载导入任务模板
+            </a>
+          </li>
+          <li class="menu-item">
+            <a-upload
+              name="file"
+              :showUploadList="false"
+              :action="uploadAction"
+              :beforeUpload="beforeUpload"
+              :data="{projectCode: code}"
+              :headers="headers"
+              @change="handleChange"
+            >
+              <a class="text-default" :loading="uploadLoading" :disabled="uploadLoading">
+                <a-icon type="upload" v-show="!uploadLoading" />上传文件导入任务
+              </a>
+            </a-upload>
+          </li>
+          <li class="menu-item">
+            <a>
+              <a-icon type="logout" />导出任务 *
+            </a>
+          </li>
+          <li class="menu-item">
+            <a>
+              <a-icon type="copy" />复制项目 *
+            </a>
+          </li>
+          <li class="menu-item">
+            <a>
+              <a-icon type="block" />保存为项目模板 *
+            </a>
+          </li>
+        </ul>
+      </div>
+    </a-drawer>
+    <!--项目设置-->
+    <a-modal
+      destroyOnClose
+      class="project-config-modal"
+      :width="800"
+      v-model="projectModal.modalStatus"
+      :title="projectModal.modalTitle"
+      :footer="null"
+    >
+      <project-config :code="code" @update="updateProject"></project-config>
+    </a-modal>
+    <!--回收站-->
+    <a-modal
+      class="recycle-bin-modal"
+      :width="800"
+      v-model="recycleModal.modalStatus"
+      :title="recycleModal.modalTitle"
+      :footer="null"
+    >
+      <recycle-bin v-if="recycleModal.modalStatus" :code="code" @update="init"></recycle-bin>
+    </a-modal>
+    <!--任务标签-->
+    <a-modal
+      class="task-tag-modal"
+      :width="800"
+      v-model="taskTagModal.modalStatus"
+      :title="taskTagModal.modalTitle"
+      :footer="null"
+    >
+      <task-tag v-if="taskTagModal.modalStatus" :code="code" @update="init"></task-tag>
+    </a-modal>
+    <!--设置任务执行者-->
+    <a-modal
+      class="invite-project-member"
+      :width="360"
+      v-model="projectMemberModal.modalStatus"
+      :title="projectMemberModal.modalTitle"
+      :footer="null"
+    >
+      <div class="member-list">
+        <a-list
+          class="project-list"
+          itemLayout="horizontal"
+          :loading="loading"
+          :dataSource="projectMembers"
         >
-            <div class="member-list">
-                <a-list
-                        class="project-list"
-                        itemLayout="horizontal"
-                        :loading="loading"
-                        :dataSource="projectMembers"
-                >
-                    <a-list-item slot="renderItem" slot-scope="item">
-                    <span slot="actions">
-                        <a-button size="small" type="dashed" icon="user-add"
-                                  @click="setExecutor(item)"
-                        >设置</a-button>
-                     </span>
-                        <a-list-item-meta
-                                :description="item.email"
-                        >
-                            <span slot="title">{{item.name}}</span>
-                            <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                        </a-list-item-meta>
-                    </a-list-item>
-                </a-list>
-            </div>
-        </a-modal>
+          <a-list-item slot="renderItem" slot-scope="item">
+            <span slot="actions">
+              <a-button size="small" type="dashed" icon="user-add" @click="setExecutor(item)">设置</a-button>
+            </span>
+            <a-list-item-meta :description="item.email">
+              <span slot="title">{{item.name}}</span>
+              <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+            </a-list-item-meta>
+          </a-list-item>
+        </a-list>
+      </div>
+    </a-modal>
 
-        <a-drawer
-                wrapClassName="info-drawer task-search"
-                title="任务筛选"
-                width=350
-                placement="right"
-                @close="taskSearch.visible = false"
-                :visible="taskSearch.visible"
-        >
-            <task-search :project-code="code" @search="taskSearchAction"></task-search>
-        </a-drawer>
-        <invite-project-member v-model="showInviteMember" :project-code="code"
-                               v-if="showInviteMember"></invite-project-member>
-    </div>
+    <a-drawer
+      :getContainer="() => $refs.taskarea"
+      wrapClassName="info-drawer task-search"
+      title="任务筛选"
+      width="350"
+      placement="right"
+      @close="taskSearch.visible = false"
+      :visible="taskSearch.visible"
+    >
+      <task-search :project-code="code" @search="taskSearchAction"></task-search>
+    </a-drawer>
+    <invite-project-member v-model="showInviteMember" :project-code="code" v-if="showInviteMember"></invite-project-member>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import _ from 'lodash'
-    import moment from 'moment'
-    import {COMMON} from '../../../const/common'
-    import draggable from 'vuedraggable'
-    import projectSelect from '@/components/project/projectSelect'
-    import inviteProjectMember from '@/components/project/inviteProjectMember'
-    import projectConfig from '@/components/project/projectConfig'
-    import RecycleBin from '@/components/project/recycleBin'
-    import TaskTag from '@/components/project/taskTag'
-    import TaskSearch from '@/components/project/taskSearch'
-
-    import {list as getTaskStages, sort, tasks as getTasks} from "../../../api/taskStages";
-    import {read as getProject} from "../../../api/project";
-    import {inviteMember, list as getProjectMembers, removeMember} from "../../../api/projectMember";
-    import {save as createTask, taskDone, sort as sortTask, recycleBatch, batchAssignTask} from "../../../api/task";
-    import {save as createState, edit as editStage, del as delStage} from "../../../api/taskStages";
-    import {checkResponse, getApiUrl, getAuthorization, getUploadUrl} from "../../../assets/js/utils";
-    import {formatTaskTime} from "../../../assets/js/dateTime";
-    import {collect} from "../../../api/projectCollect";
-    import {notice} from "../../../assets/js/notice";
+import { mapState } from "vuex";
+import _ from "lodash";
+import moment from "moment";
+import { COMMON } from "../../../const/common";
+import draggable from "vuedraggable";
+import projectSelect from "@/components/project/projectSelect";
+import inviteProjectMember from "@/components/project/inviteProjectMember";
+import projectConfig from "@/components/project/projectConfig";
+import RecycleBin from "@/components/project/recycleBin";
+import TaskTag from "@/components/project/taskTag";
+import TaskSearch from "@/components/project/taskSearch";
 
-    export default {
-        name: "project-space-task",
-        components: {
-            RecycleBin,
-            TaskTag,
-            draggable,
-            projectSelect,
-            TaskSearch,
-            inviteProjectMember,
-            projectConfig
-        },
-        data() {
-            return {
-                code: this.$route.params.code,
-                loading: true,
-                project: {task_board_theme: 'simple'},
-                stageName: '',
-                task: {}, //当前任务
-                taskStatusList: COMMON.TASK_STATUS,
-                taskStages: [], //任务列表
-                defaultExecutor: {},//默认执行人
-                projectMembers: [], //项目成员列表
-                projectMembersCopy: [], //项目成员列表副本
-                createTaskLoading: false, //创建任务loading
-                showCreateStage: false,
+import {
+  list as getTaskStages,
+  sort,
+  tasks as getTasks,
+} from "../../../api/taskStages";
+import { read as getProject } from "../../../api/project";
+import {
+  inviteMember,
+  list as getProjectMembers,
+  removeMember,
+} from "../../../api/projectMember";
+import {
+  save as createTask,
+  taskDone,
+  sort as sortTask,
+  recycleBatch,
+  batchAssignTask,
+} from "../../../api/task";
+import {
+  save as createState,
+  edit as editStage,
+  del as delStage,
+} from "../../../api/taskStages";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+  getUploadUrl,
+} from "../../../assets/js/utils";
+import { formatTaskTime } from "../../../assets/js/dateTime";
+import { collect } from "../../../api/projectCollect";
+import { notice } from "../../../assets/js/notice";
 
-                preCode: '',
-                nextCode: '',
+export default {
+  name: "project-space-task",
+  components: {
+    RecycleBin,
+    TaskTag,
+    draggable,
+    projectSelect,
+    TaskSearch,
+    inviteProjectMember,
+    projectConfig,
+  },
+  data() {
+    return {
+      code: this.$route.params.code,
+      loading: true,
+      project: { task_board_theme: "simple" },
+      stageName: "",
+      task: {}, //当前任务
+      taskStatusList: COMMON.TASK_STATUS,
+      taskStages: [], //任务列表
+      defaultExecutor: {}, //默认执行人
+      projectMembers: [], //项目成员列表
+      projectMembersCopy: [], //项目成员列表副本
+      createTaskLoading: false, //创建任务loading
+      showCreateStage: false,
 
-                preTaskCode: '',
-                nextTaskCode: '',
+      preCode: "",
+      nextCode: "",
 
-                taskSearchParams: {},
+      preTaskCode: "",
+      nextTaskCode: "",
 
-                stageKeys: [],
-                stageModal: {
-                    form: this.$form.createForm(this),
-                    stageCode: '',
-                    stageIndex: 0,
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑列表',
-                },
+      taskSearchParams: {},
 
-                slideMenuKey: '',
-                showInviteMember: false,
-                inviteMemberDraw: {
-                    visible: false,
-                    keyword: '',
-                    searching: false,
-                    list: [],
-                },
-                configDraw: {
-                    visible: false,
-                },
-                taskSearch: {
-                    visible: false,
-                },
+      stageKeys: [],
+      stageModal: {
+        form: this.$form.createForm(this),
+        stageCode: "",
+        stageIndex: 0,
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑列表",
+      },
 
+      slideMenuKey: "",
+      showInviteMember: false,
+      inviteMemberDraw: {
+        visible: false,
+        keyword: "",
+        searching: false,
+        list: [],
+      },
+      configDraw: {
+        visible: false,
+      },
+      taskSearch: {
+        visible: false,
+      },
 
-                downLoadUrl: getUploadUrl('project/task/_downloadTemplate'),
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/task/uploadFile'),
+      downLoadUrl: getUploadUrl("project/task/_downloadTemplate"),
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/task/uploadFile"),
 
-                /*项目设置*/
-                projectModal: {
-                    modalStatus: false,
-                    modalTitle: '项目设置',
-                },
-                /*回收站*/
-                recycleModal: {
-                    modalStatus: false,
-                    modalTitle: '查看回收站',
-                },
-                /*任务标签*/
-                taskTagModal: {
-                    modalStatus: false,
-                    modalTitle: '任务标签',
-                },
+      /*项目设置*/
+      projectModal: {
+        modalStatus: false,
+        modalTitle: "项目设置",
+      },
+      /*回收站*/
+      recycleModal: {
+        modalStatus: false,
+        modalTitle: "查看回收站",
+      },
+      /*任务标签*/
+      taskTagModal: {
+        modalStatus: false,
+        modalTitle: "任务标签",
+      },
 
-                /*项目成员*/
-                projectMemberModal: {
-                    loading: false,
-                    currentStageIndex: 0,
-                    modalStatus: false,
-                    modalTitle: '设置任务执行者',
-                },
-            }
+      /*项目成员*/
+      projectMemberModal: {
+        loading: false,
+        currentStageIndex: 0,
+        modalStatus: false,
+        modalTitle: "设置任务执行者",
+      },
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      viewRefresh: (state) => state.common.viewRefresh,
+      socketAction: (state) => state.socketAction,
+    }),
+    headers() {
+      return getAuthorization();
+    },
+    scrollOps() {
+      return {
+        rail: {
+          background: "#e5e5e5",
+          opacity: 1,
         },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                viewRefresh: state => state.common.viewRefresh,
-                socketAction: state => state.socketAction,
-            }),
-            headers() {
-                return getAuthorization();
-            },
-            scrollOps() {
-                return {
-                    rail: {
-                        background: '#e5e5e5',
-                        opacity: 1
-                    },
-                    bar: {
-                        keepShow: true
-                    }
-                }
-            }
+        bar: {
+          keepShow: true,
         },
-        watch: {
-            $route(to, from) {
-                if (this.code != to.params.code) {
-                    this.code = to.params.code;
-                    this.defaultExecutor = this.userInfo;
-                    this.getProject();
-                    this.getProjectMembers();
-                    this.init();
-                }
-                if (from.name == 'taskdetail') {
-                    const stageIndex = from.query.from;
-                    // this.getTaskStages(false);
-                    if (stageIndex != undefined) {
-                        let searchParams = this.taskSearchParams;
-                        let params = Object.assign({stageCode:this.taskStages[stageIndex].code}, searchParams);
-                        getTasks(params).then((res) => {
-                            this.taskStages[stageIndex].tasksLoading = false;
-                            this.taskStages[stageIndex].tasks = res.data;
-                            let doneTasks = this.taskStages[stageIndex].doneTasks = [];
-                            let unDoneTasks = this.taskStages[stageIndex].unDoneTasks = [];
-                            res.data.forEach((task) => {
-                                if (task.done) {
-                                    doneTasks.push(task);
-                                } else {
-                                    unDoneTasks.push(task);
-                                }
-                            });
-                        });
-                    }
-                }
-            },
-            socketAction(val) {
-                if (val.action === 'organization:task') {
-                    const data = val.data.data;
-                    if (data.projectCode == this.code) {
-                        this.getTaskStages(false);
-                    }
-                }
-            },
-            viewRefresh() {
-                console.log('viewRefresh');
-                // this.getTaskStages(false);
-            },
-            inviteMemberDraw: {
-                handler(newVal) {
-                    if (newVal.visible) {
-                        this.slideMenuKey = 'member';
-                    } else {
-                        this.slideMenuKey = false;
-                    }
-                    if (newVal.keyword) {
-                        this.searchInviteMember();
-                    }
-                },
-                deep: true
-            },
-            configDraw: {
-                handler(newVal) {
-                    if (newVal.visible) {
-                        this.slideMenuKey = 'config';
-                    } else {
-                        this.slideMenuKey = false;
-                    }
-                },
-                deep: true
-            },
-            showInviteMember(val) {
-                if (!val) {
-                    this.getProjectMembers();
-                }
-            },
-        },
-        created() {
-            this.defaultExecutor = this.userInfo;
-            this.getProject();
-            this.getProjectMembers();
-            this.init();
-        },
-        methods: {
-            init() {
-                this.getTaskStages();
-            },
-            getProject() {
-                this.loading = true;
-                getProject(this.code).then((res) => {
-                    this.loading = false;
-                    this.project = res.data;
-                });
-            },
-            getProjectMembers() {
-                getProjectMembers({projectCode: this.code, pageSize: 100}).then((res) => {
-                    this.projectMembers = res.data.list;
-                    this.projectMembersCopy = res.data.list;
-                });
-            },
-            getTaskStages(showLoading = true) {
-                let app = this;
-                getTaskStages({projectCode: this.code, pageSize: 30}).then((res) => {
-                    let taskStages = [];
-                    if (!showLoading) {
-                        res.data.list.forEach((v) => {
-                            v.tasksLoading = false;
-                            taskStages.push(v);
-                        });
-                        // this.taskStages = taskStages;
-                    } else {
-                        //提前赋值，展现loading
-                        this.taskStages = taskStages = res.data.list;
-                    }
-                    if (taskStages) {
-                        let searchParams = app.taskSearchParams;
-                        let params = {};
-                        taskStages.forEach((v, k) => {
-                            params = {stageCode: v.code};
-                            params = Object.assign(params, searchParams);
-                            getTasks(params).then((res) => {
-                                let canNotReadCount = 0;
-                                res.data.forEach((task) => {
-                                    if (!task.canRead) {
-                                        canNotReadCount++;
-                                    }
-                                    if (task.done) {
-                                        v.doneTasks.push(task);
-                                    } else {
-                                        v.unDoneTasks.push(task);
-                                    }
-                                });
-                                v.canNotReadCount = canNotReadCount;
-                                v.tasksLoading = false;
-                                v.tasks = res.data;
-                                if (!showLoading) {
-                                    app.$set(app.taskStages, k, v);
-                                }
-                            })
-                        });
-                    }
-                })
-            },
-            filterTask(tasks, done) {
-                return tasks.filter(item => item.done == done);
-            },
-            taskSearchAction(value) {
-                console.log(value);
-                this.taskSearchParams = value;
-                this.getTaskStages();
-            },
-            //显示添加任务卡片
-            showTaskCard(index = false, show = true) {
-                this.taskStages.forEach((v) => {
-                    v.showTaskCard = false;
-                });
-                if (index === false) {
-                    return false;
-                }
-                this.taskStages[index].showTaskCard = show;
-                this.$nextTick(() => {
-                    //滚动创建到创建窗口
-                    this.$refs[index + '-stage'][0].scrollIntoView('#card' + index);
-                    this.$refs[`inputTaskName${index}`][0].focus();
-
-                });
-            },
-            selectExecutor({key}) {
-                this.defaultExecutor = this.projectMembers[key];
-            },
-            //准备添加任务
-            createTask(stageCode, stageIndex) {
-                if (!this.task.name) {
-                    this.$message.warning('任务内容不能为空', 2);
-                    return false
-                }
-                this.task.stage_code = stageCode;
-                this.task.project_code = this.code;
-                this.task.assign_to = this.defaultExecutor.code;
-                //判断换行，添加多条任务
-                // let titles = this.task.name.split("\n");
-                // if (titles.length > 1) {
-                //     this.$confirm({
-                //         title: '任务提示',
-                //         content: `系统检测到你输入了 ${titles.length} 行内容，你是想创建多条任务吗？`,
-                //         okText: '创建1条',
-                //         cancelText: `创建${titles.length}条`,
-                //         onCancel() {
-                //             console.log('Cancel');
-                //         },
-                //         onOk() {
-                //             this.confirmCreateTask(stageIndex);
-                //             return Promise.resolve();
-                //         }
-                //     });
-                //     return false;
-                // }
-                this.confirmCreateTask(stageIndex);
-            },
-            //添加任务
-            confirmCreateTask(stageIndex) {
-                let app = this;
-                if (app.createTaskLoading) {
-                    app.$message.warning('正在添加任务，请稍后...', 2);
-                    return false;
-                }
-                setTimeout(function () {
-                    if (app.createTaskLoading === true) {
-                        app.$message.loading({
-                            content: '正在添加任务，请稍后...',
-                            duration: 5
-                        })
-                    }
-                }, 2000);
-                app.createTaskLoading = true;
-                createTask(app.task).then(res => {
-                    app.createTaskLoading = false;
-                    const result = checkResponse(res);
-                    if (result) {
-                        app.$message.destroy();
-                        let taskStages = app.taskStages[stageIndex];
-                        taskStages.tasks.push(res.data);
-                        app.taskStages[stageIndex].unDoneTasks.push(res.data);
-                        // getTasks({stageCode: app.task.stage_code}).then((res) => {
-                        //     let taskStages = app.taskStages[stageIndex];
-                        //     taskStages.tasks = res.data;
-                        // });
-                        app.task = {};
-                        // notice({
-                        //     title: '添加任务成功',
-                        //     msg: '你可以点击该任务继续进行详细设置'
-                        // }, 'notice', 'success', 5);
-                    }
-                }).catch(() => {
-                    app.createTaskLoading = false;
-                });
-            },
-            taskDone(taskCode, stageIndex, taskIndex, done) {
-                let task = null;
-                let unDoneTasks = this.taskStages[stageIndex].unDoneTasks;
-                let doneTasks = this.taskStages[stageIndex].doneTasks;
-                if (done) {
-                    task = unDoneTasks[taskIndex];
-                } else {
-                    task = doneTasks[taskIndex];
-                }
-                // let task = this.taskStages[stageIndex].tasks[taskIndex];
-                if (task.hasUnDone) {
-                    return false;
-                }
-                task.done = done;
-                if (done) {
-                    unDoneTasks.splice(taskIndex, 1);
-                    doneTasks.push(task);
-                    doneTasks = doneTasks.sort(function (a, b) {
-                        if (a.sort === b.sort) {
-                            return a.id_num - b.id_num;
-                        } else {
-                            return a.sort - b.sort;
-                        }
-                    });
-                } else {
-                    doneTasks.splice(taskIndex, 1);
-                    unDoneTasks.push(task);
-                    unDoneTasks = unDoneTasks.sort(function (a, b) {
-                        if (a.sort === b.sort) {
-                            return a.id_num - b.id_num;
-                        } else {
-                            return a.sort - b.sort;
-                        }
-                    });
-                }
-                taskDone(taskCode, done).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    //可能会触发工作流，所以全部刷新
-                    this.getTaskStages(false);
-                });
-            },
-            showInputStrageName() {
-                this.showCreateStage = !this.showCreateStage;
-                this.$nextTick(() => {
-                    this.$refs.inputStageName.focus();
-                });
-            },
-            doStage(action) {
-                let app = this;
-                let actionKeys = action.key.split('_');
-                const stageCode = actionKeys[actionKeys.length - 2];
-                const stageIndex = actionKeys[actionKeys.length - 1];
-                const actionKey = actionKeys[0];
-                switch (actionKey) {
-                    case 'editStage':
-                        this.stageModal.stageCode = stageCode;
-                        this.stageModal.stageIndex = stageIndex;
-                        this.$nextTick(() => {
-                            this.stageModal.form.setFieldsValue({
-                                name: this.taskStages[stageIndex].name,
-                            });
-                            this.$refs.inputStageTitle.focus();
-                        });
-                        this.stageModal.modalStatus = true;
-                        break;
-                    case 'recycleBatch':
-                        //您确定要把列表下的所有任务移到回收站吗？
-                        this.$confirm({
-                            title: '移到回收站',
-                            content: `您确定要把列表下的所有任务移到回收站吗？`,
-                            okText: '移到回收站',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                app.taskStages[stageIndex].tasks = [];
-                                app.$set(app.taskStages[stageIndex], 'doneTasks', []);
-                                recycleBatch({stageCode: stageCode}).then(res => {
-                                    const result = checkResponse(res);
-                                    if (!result) {
-                                        return false;
-                                    }
-                                    app.$set(app.taskStages[stageIndex], 'doneTasks', []);
-                                    app.$set(app.taskStages[stageIndex], 'unDoneTasks', []);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case 'setEndTime':
-                        this.set_type_endTime_modal = true;
-                        break;
-                    case 'setExecutor':
-                        this.projectMemberModal.currentStageIndex = stageIndex;
-                        this.projectMemberModal.modalStatus = true;
-                        break;
-                    case 'delStage':
-                        if (this.taskStages[stageIndex].tasks.length > 0) {
-                            this.$warning({
-                                title: '删除列表',
-                                content: `请先清空此列表上的任务，然后再删除这个列表`,
-                                okText: '确定',
-                            });
-                            return false;
-                        }
-                        this.$confirm({
-                            title: '删除列表',
-                            content: `您确定要永远删除这个列表吗？`,
-                            okText: '删除',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                delStage(stageCode);
-                                app.taskStages.splice(stageIndex, 1);
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                }
-            },
-            creteStage() {
-                if (!this.stageName) {
-                    this.$message.warning('请输入列表名称', 2);
-                    return false;
-                }
-                createState({name: this.stageName, projectCode: this.code}).then(res => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    const stage = res.data;
-                    this.taskStages.push(stage);
-                    this.stageName = '';
-                    this.$nextTick(() => {
-                        document.getElementById("board-scrum-stages").scrollLeft = 10000;
-                    });
-                });
-            },
-            editStage() {
-                let stage = this.stageModal.form.getFieldsValue();
-                if (!stage.name) {
-                    this.$message.warning('请输入列表名称', 2);
-                    return false;
-                }
-                editStage({name: stage.name, stageCode: this.stageModal.stageCode}).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    this.taskStages[this.stageModal.stageIndex].name = stage.name;
-                    this.stageModal.modalStatus = false;
-                });
-            },
-            setExecutor(member) {
-                let stage = this.taskStages[this.projectMemberModal.currentStageIndex];
-                let taskCodes = [];
-                stage.tasks.forEach((v) => {
-                    if (v.canRead) {
-                        taskCodes.push(v.code);
-                    }
-                });
-                if (taskCodes) {
-                    batchAssignTask({taskCodes: JSON.stringify(taskCodes), executorCode: member.code}).then(res => {
-                        this.projectMemberModal.modalStatus = false;
-                        if (!checkResponse(res)) {
-                            return false;
-                        }
-                        getTasks({stageCode: stage.code}).then((res) => {
-                            let canNotReadCount = 0;
-                            res.data.forEach((task) => {
-                                if (!task.canRead) {
-                                    canNotReadCount++;
-                                }
-                            });
-                            stage.canNotReadCount = canNotReadCount;
-                            stage.tasksLoading = false;
-                            stage.tasks = res.data;
-                        });
-                    });
-                } else {
-                    this.projectMemberModal.modalStatus = false;
-                }
-            },
-            showTaskPri(pri) {
-                return {
-                    'warning': pri == 1,
-                    'error': pri == 2,
-                }
-            },
-            showTimeLabel(time) {
-                let str = 'label-primary';
-                if (time == null) {
-                    return str;
-                }
-                let cha = moment(moment(time).format("YYYY-MM-DD")).diff(moment().format("YYYY-MM-DD"), 'days');
-                if (cha < 0) {
-                    str = 'label-danger';
-                } else if (cha == 0) {
-                    str = 'label-warning';
-                } else if (cha > 7) {
-                    str = 'label-normal'
-                }
-                return str;
-            },
-            showTaskTime(time, timeEnd) {
-                return formatTaskTime(time, timeEnd);
-                // return moment(time).format('MM月DD日 HH:mm')
-            },
-            taskDetail(code, stageIndex) {
-                this.$router.push(`${this.$route.path}/detail/${code}?from=${stageIndex}`);
-            },
-            stageSort(event) {
-                const list = this.getPreAndNextCode(event);
-                sort(list[0], list[1], this.code);
-            },
-            getPreAndNextCode(event) {
-                const preCode = event.clone.getAttribute('id');
-                let toList = [];
-                let nextCode = '';
-                for (let i = 0, len = event.to.children.length; i < len; i++) {
-                    toList.push(event.to.children[i].getAttribute('id'));
-                }
-                const preCodeIndex = toList.findIndex(item => item === preCode)
-                if (preCodeIndex < toList.length) {
-                    nextCode = toList[preCodeIndex + 1];
-                }
-                return [preCode, nextCode];
-            },
-            taskSort(event) {
-                const list = this.getPreAndNextCode(event);
-                console.log(list);
-                const toStageCode = event.to.parentNode.parentNode.parentNode.getAttribute('id');
-                sortTask({preTaskCode: list[0], nextTaskCode: list[1], toStageCode: toStageCode});
-            },
-            handleResize(vertical, stageIndex) {
-                if (vertical.barSize) {
-                    this.taskStages[stageIndex].fixedCreator = true;
+      };
+    },
+  },
+  watch: {
+    $route(to, from) {
+      if (this.code != to.params.code) {
+        this.code = to.params.code;
+        this.defaultExecutor = this.userInfo;
+        this.getProject();
+        this.getProjectMembers();
+        this.init();
+      }
+      if (from.name == "taskdetail") {
+        const stageIndex = from.query.from;
+        // this.getTaskStages(false);
+        if (stageIndex != undefined) {
+          let searchParams = this.taskSearchParams;
+          let params = Object.assign(
+            { stageCode: this.taskStages[stageIndex].code },
+            searchParams
+          );
+          getTasks(params).then((res) => {
+            this.taskStages[stageIndex].tasksLoading = false;
+            this.taskStages[stageIndex].tasks = res.data;
+            let doneTasks = (this.taskStages[stageIndex].doneTasks = []);
+            let unDoneTasks = (this.taskStages[stageIndex].unDoneTasks = []);
+            res.data.forEach((task) => {
+              if (task.done) {
+                doneTasks.push(task);
+              } else {
+                unDoneTasks.push(task);
+              }
+            });
+          });
+        }
+      }
+    },
+    socketAction(val) {
+      if (val.action === "organization:task") {
+        const data = val.data.data;
+        if (data.projectCode == this.code) {
+          this.getTaskStages(false);
+        }
+      }
+    },
+    viewRefresh() {
+      console.log("viewRefresh");
+      // this.getTaskStages(false);
+    },
+    inviteMemberDraw: {
+      handler(newVal) {
+        if (newVal.visible) {
+          this.slideMenuKey = "member";
+        } else {
+          this.slideMenuKey = false;
+        }
+        if (newVal.keyword) {
+          this.searchInviteMember();
+        }
+      },
+      deep: true,
+    },
+    configDraw: {
+      handler(newVal) {
+        if (newVal.visible) {
+          this.slideMenuKey = "config";
+        } else {
+          this.slideMenuKey = false;
+        }
+      },
+      deep: true,
+    },
+    showInviteMember(val) {
+      if (!val) {
+        this.getProjectMembers();
+      }
+    },
+  },
+  created() {
+    this.defaultExecutor = this.userInfo;
+    this.getProject();
+    this.getProjectMembers();
+    this.init();
+  },
+  methods: {
+    init() {
+      this.getTaskStages();
+    },
+    getProject() {
+      this.loading = true;
+      getProject(this.code).then((res) => {
+        this.loading = false;
+        this.project = res.data;
+      });
+    },
+    getProjectMembers() {
+      getProjectMembers({ projectCode: this.code, pageSize: 100 }).then(
+        (res) => {
+          this.projectMembers = res.data.list;
+          this.projectMembersCopy = res.data.list;
+        }
+      );
+    },
+    getTaskStages(showLoading = true) {
+      let app = this;
+      getTaskStages({ projectCode: this.code, pageSize: 30 }).then((res) => {
+        let taskStages = [];
+        if (!showLoading) {
+          res.data.list.forEach((v) => {
+            v.tasksLoading = false;
+            taskStages.push(v);
+          });
+          // this.taskStages = taskStages;
+        } else {
+          //提前赋值，展现loading
+          this.taskStages = taskStages = res.data.list;
+        }
+        if (taskStages) {
+          let searchParams = app.taskSearchParams;
+          let params = {};
+          taskStages.forEach((v, k) => {
+            params = { stageCode: v.code };
+            params = Object.assign(params, searchParams);
+            getTasks(params).then((res) => {
+              let canNotReadCount = 0;
+              res.data.forEach((task) => {
+                if (!task.canRead) {
+                  canNotReadCount++;
                 }
-            },
-
-            visibleDraw(type) {
-                if (type == 'member') {
-                    this.configDraw.visible = false;
-                    this.taskSearch.visible = false;
-                    this.inviteMemberDraw.visible = !this.inviteMemberDraw.visible;
-
-                } else if (type == 'taskSearch') {
-                    this.taskSearch.visible = !this.taskSearch.visible;
-                    this.configDraw.visible = false;
-                    this.inviteMemberDraw.visible = false;
+                if (task.done) {
+                  v.doneTasks.push(task);
                 } else {
-                    this.inviteMemberDraw.visible = false;
-                    this.taskSearch.visible = false;
-                    this.configDraw.visible = !this.configDraw.visible;
+                  v.unDoneTasks.push(task);
                 }
-            },
-            removeMember(member, index) {
-                let app = this;
-                this.$confirm({
-                    title: `您确定要将「${member.name}」从项目中移除吗？`,
-                    content: `移除后该成员将不能查看任何关于该项目的信息`,
-                    okText: '移除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        removeMember(member.code, app.code).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            app.projectMembers.splice(index, 1);
-                            notice({title: '移除成功'}, 'notice', 'success');
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            inviteMember(item) {
-                inviteMember(item.memberCode, this.projectCode).then((res) => {
-                    const success = checkResponse(res);
-                    if (success) {
-                        item.joined = true;
-                    }
-                })
-            },
-            searchInviteMember: _.debounce(
-                function () {
-                    if (!this.inviteMemberDraw.keyword) {
-                        this.projectMembers = JSON.parse(JSON.stringify(this.projectMembersCopy));
-                    }
-                    if (this.inviteMemberDraw.keyword.length <= 1) {
-                        return false;
-                    }
-                    this.searching = true;
-                    this.projectMembers = this.projectMembers.filter(item => item.name.indexOf(this.inviteMemberDraw.keyword) != -1);
-                }, 500
-            ),
-            updateProject(data) {
-                this.project = data;
-            },
-            collectProject() {
-                const type = this.project.collected ? 'cancel' : 'collect';
-                collect(this.project.code, type).then((res) => {
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    this.project.collected = !this.project.collected;
-                })
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    notice(`正在导入，请稍后...`, 'message', 'loading', 0);
-                    this.uploadLoading = true;
-                    return
-                }
-                if (info.file.status === 'done') {
-                    console.log(info);
-                    this.uploadLoading = false;
-                    if (checkResponse(info.file.response, true)) {
-                        const count = info.file.response.data;
-                        if (count) {
-                            notice(`成功导入${count}个任务`, 'message', 'success');
-                        } else {
-                            notice(`没有成功导入任何任务`, 'message', 'warning');
-                        }
-                        this.getTaskStages(false);
-                    }
+              });
+              v.canNotReadCount = canNotReadCount;
+              v.tasksLoading = false;
+              v.tasks = res.data;
+              if (!showLoading) {
+                app.$set(app.taskStages, k, v);
+              }
+            });
+          });
+        }
+      });
+    },
+    filterTask(tasks, done) {
+      return tasks.filter((item) => item.done == done);
+    },
+    taskSearchAction(value) {
+      console.log(value);
+      this.taskSearchParams = value;
+      this.getTaskStages();
+    },
+    //显示添加任务卡片
+    showTaskCard(index = false, show = true) {
+      this.taskStages.forEach((v) => {
+        v.showTaskCard = false;
+      });
+      if (index === false) {
+        return false;
+      }
+      this.taskStages[index].showTaskCard = show;
+      this.$nextTick(() => {
+        //滚动创建到创建窗口
+        this.$refs[index + "-stage"][0].scrollIntoView("#card" + index);
+        this.$refs[`inputTaskName${index}`][0].focus();
+      });
+    },
+    selectExecutor({ key }) {
+      this.defaultExecutor = this.projectMembers[key];
+    },
+    //准备添加任务
+    createTask(stageCode, stageIndex) {
+      if (!this.task.name) {
+        this.$message.warning("任务内容不能为空", 2);
+        return false;
+      }
+      this.task.stage_code = stageCode;
+      this.task.project_code = this.code;
+      this.task.assign_to = this.defaultExecutor.code;
+      //判断换行，添加多条任务
+      // let titles = this.task.name.split("\n");
+      // if (titles.length > 1) {
+      //     this.$confirm({
+      //         title: '任务提示',
+      //         content: `系统检测到你输入了 ${titles.length} 行内容，你是想创建多条任务吗？`,
+      //         okText: '创建1条',
+      //         cancelText: `创建${titles.length}条`,
+      //         onCancel() {
+      //             console.log('Cancel');
+      //         },
+      //         onOk() {
+      //             this.confirmCreateTask(stageIndex);
+      //             return Promise.resolve();
+      //         }
+      //     });
+      //     return false;
+      // }
+      this.confirmCreateTask(stageIndex);
+    },
+    //添加任务
+    confirmCreateTask(stageIndex) {
+      let app = this;
+      if (app.createTaskLoading) {
+        app.$message.warning("正在添加任务，请稍后...", 2);
+        return false;
+      }
+      setTimeout(function () {
+        if (app.createTaskLoading === true) {
+          app.$message.loading({
+            content: "正在添加任务，请稍后...",
+            duration: 5,
+          });
+        }
+      }, 2000);
+      app.createTaskLoading = true;
+      createTask(app.task)
+        .then((res) => {
+          app.createTaskLoading = false;
+          const result = checkResponse(res);
+          if (result) {
+            app.$message.destroy();
+            let taskStages = app.taskStages[stageIndex];
+            taskStages.tasks.push(res.data);
+            app.taskStages[stageIndex].unDoneTasks.push(res.data);
+            // getTasks({stageCode: app.task.stage_code}).then((res) => {
+            //     let taskStages = app.taskStages[stageIndex];
+            //     taskStages.tasks = res.data;
+            // });
+            app.task = {};
+            // notice({
+            //     title: '添加任务成功',
+            //     msg: '你可以点击该任务继续进行详细设置'
+            // }, 'notice', 'success', 5);
+          }
+        })
+        .catch(() => {
+          app.createTaskLoading = false;
+        });
+    },
+    taskDone(taskCode, stageIndex, taskIndex, done) {
+      let task = null;
+      let unDoneTasks = this.taskStages[stageIndex].unDoneTasks;
+      let doneTasks = this.taskStages[stageIndex].doneTasks;
+      if (done) {
+        task = unDoneTasks[taskIndex];
+      } else {
+        task = doneTasks[taskIndex];
+      }
+      // let task = this.taskStages[stageIndex].tasks[taskIndex];
+      if (task.hasUnDone) {
+        return false;
+      }
+      task.done = done;
+      if (done) {
+        unDoneTasks.splice(taskIndex, 1);
+        doneTasks.push(task);
+        doneTasks = doneTasks.sort(function (a, b) {
+          if (a.sort === b.sort) {
+            return a.id_num - b.id_num;
+          } else {
+            return a.sort - b.sort;
+          }
+        });
+      } else {
+        doneTasks.splice(taskIndex, 1);
+        unDoneTasks.push(task);
+        unDoneTasks = unDoneTasks.sort(function (a, b) {
+          if (a.sort === b.sort) {
+            return a.id_num - b.id_num;
+          } else {
+            return a.sort - b.sort;
+          }
+        });
+      }
+      taskDone(taskCode, done).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        //可能会触发工作流，所以全部刷新
+        this.getTaskStages(false);
+      });
+    },
+    showInputStrageName() {
+      this.showCreateStage = !this.showCreateStage;
+      this.$nextTick(() => {
+        this.$refs.inputStageName.focus();
+      });
+    },
+    doStage(action) {
+      let app = this;
+      let actionKeys = action.key.split("_");
+      const stageCode = actionKeys[actionKeys.length - 2];
+      const stageIndex = actionKeys[actionKeys.length - 1];
+      const actionKey = actionKeys[0];
+      switch (actionKey) {
+        case "editStage":
+          this.stageModal.stageCode = stageCode;
+          this.stageModal.stageIndex = stageIndex;
+          this.$nextTick(() => {
+            this.stageModal.form.setFieldsValue({
+              name: this.taskStages[stageIndex].name,
+            });
+            this.$refs.inputStageTitle.focus();
+          });
+          this.stageModal.modalStatus = true;
+          break;
+        case "recycleBatch":
+          //您确定要把列表下的所有任务移到回收站吗？
+          this.$confirm({
+            title: "移到回收站",
+            content: `您确定要把列表下的所有任务移到回收站吗？`,
+            okText: "移到回收站",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              app.taskStages[stageIndex].tasks = [];
+              app.$set(app.taskStages[stageIndex], "doneTasks", []);
+              recycleBatch({ stageCode: stageCode }).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
                 }
+                app.$set(app.taskStages[stageIndex], "doneTasks", []);
+                app.$set(app.taskStages[stageIndex], "unDoneTasks", []);
+              });
+              return Promise.resolve();
             },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('文件不能超过2MB!')
-                }
-                return isLt2M
+          });
+          break;
+        case "setEndTime":
+          this.set_type_endTime_modal = true;
+          break;
+        case "setExecutor":
+          this.projectMemberModal.currentStageIndex = stageIndex;
+          this.projectMemberModal.modalStatus = true;
+          break;
+        case "delStage":
+          if (this.taskStages[stageIndex].tasks.length > 0) {
+            this.$warning({
+              title: "删除列表",
+              content: `请先清空此列表上的任务，然后再删除这个列表`,
+              okText: "确定",
+            });
+            return false;
+          }
+          this.$confirm({
+            title: "删除列表",
+            content: `您确定要永远删除这个列表吗？`,
+            okText: "删除",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              delStage(stageCode);
+              app.taskStages.splice(stageIndex, 1);
+              return Promise.resolve();
             },
-            getStatusColor(status) {
-                const statusInfo = this.taskStatusList.find(item => item.id == status);
-                if (statusInfo) {
-                    return statusInfo.color;
-                }
-                return '';
-            }
+          });
+          break;
+      }
+    },
+    creteStage() {
+      if (!this.stageName) {
+        this.$message.warning("请输入列表名称", 2);
+        return false;
+      }
+      createState({ name: this.stageName, projectCode: this.code }).then(
+        (res) => {
+          const result = checkResponse(res);
+          if (!result) {
+            return false;
+          }
+          const stage = res.data;
+          this.taskStages.push(stage);
+          this.stageName = "";
+          this.$nextTick(() => {
+            document.getElementById("board-scrum-stages").scrollLeft = 10000;
+          });
         }
-    }
-</script>
-
-<style lang="less">
-    @import "../../../assets/css/components/task";
+      );
+    },
+    editStage() {
+      let stage = this.stageModal.form.getFieldsValue();
+      if (!stage.name) {
+        this.$message.warning("请输入列表名称", 2);
+        return false;
+      }
+      editStage({
+        name: stage.name,
+        stageCode: this.stageModal.stageCode,
+      }).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        this.taskStages[this.stageModal.stageIndex].name = stage.name;
+        this.stageModal.modalStatus = false;
+      });
+    },
+    setExecutor(member) {
+      let stage = this.taskStages[this.projectMemberModal.currentStageIndex];
+      let taskCodes = [];
+      stage.tasks.forEach((v) => {
+        if (v.canRead) {
+          taskCodes.push(v.code);
+        }
+      });
+      if (taskCodes) {
+        batchAssignTask({
+          taskCodes: JSON.stringify(taskCodes),
+          executorCode: member.code,
+        }).then((res) => {
+          this.projectMemberModal.modalStatus = false;
+          if (!checkResponse(res)) {
+            return false;
+          }
+          getTasks({ stageCode: stage.code }).then((res) => {
+            let canNotReadCount = 0;
+            res.data.forEach((task) => {
+              if (!task.canRead) {
+                canNotReadCount++;
+              }
+            });
+            stage.canNotReadCount = canNotReadCount;
+            stage.tasksLoading = false;
+            stage.tasks = res.data;
+          });
+        });
+      } else {
+        this.projectMemberModal.modalStatus = false;
+      }
+    },
+    showTaskPri(pri) {
+      return {
+        warning: pri == 1,
+        error: pri == 2,
+      };
+    },
+    showTimeLabel(time) {
+      let str = "label-primary";
+      if (time == null) {
+        return str;
+      }
+      let cha = moment(moment(time).format("YYYY-MM-DD")).diff(
+        moment().format("YYYY-MM-DD"),
+        "days"
+      );
+      if (cha < 0) {
+        str = "label-danger";
+      } else if (cha == 0) {
+        str = "label-warning";
+      } else if (cha > 7) {
+        str = "label-normal";
+      }
+      return str;
+    },
+    showTaskTime(time, timeEnd) {
+      return formatTaskTime(time, timeEnd);
+      // return moment(time).format('MM月DD日 HH:mm')
+    },
+    taskDetail(code, stageIndex) {
+      this.$router.push(
+        `${this.$route.path}/detail/${code}?from=${stageIndex}`
+      );
+    },
+    stageSort(event) {
+      const list = this.getPreAndNextCode(event);
+      sort(list[0], list[1], this.code);
+    },
+    getPreAndNextCode(event) {
+      const preCode = event.clone.getAttribute("id");
+      let toList = [];
+      let nextCode = "";
+      for (let i = 0, len = event.to.children.length; i < len; i++) {
+        toList.push(event.to.children[i].getAttribute("id"));
+      }
+      const preCodeIndex = toList.findIndex((item) => item === preCode);
+      if (preCodeIndex < toList.length) {
+        nextCode = toList[preCodeIndex + 1];
+      }
+      return [preCode, nextCode];
+    },
+    taskSort(event) {
+      const list = this.getPreAndNextCode(event);
+      console.log(list);
+      const toStageCode = event.to.parentNode.parentNode.parentNode.getAttribute(
+        "id"
+      );
+      sortTask({
+        preTaskCode: list[0],
+        nextTaskCode: list[1],
+        toStageCode: toStageCode,
+      });
+    },
+    handleResize(vertical, stageIndex) {
+      if (vertical.barSize) {
+        this.taskStages[stageIndex].fixedCreator = true;
+      }
+    },
 
-    .project-space-task {
-        .tasks-loading {
-            .ant-spin-blur {
-                opacity: 0;
+    visibleDraw(type) {
+      if (type == "member") {
+        this.configDraw.visible = false;
+        this.taskSearch.visible = false;
+        this.inviteMemberDraw.visible = !this.inviteMemberDraw.visible;
+      } else if (type == "taskSearch") {
+        this.taskSearch.visible = !this.taskSearch.visible;
+        this.configDraw.visible = false;
+        this.inviteMemberDraw.visible = false;
+      } else {
+        this.inviteMemberDraw.visible = false;
+        this.taskSearch.visible = false;
+        this.configDraw.visible = !this.configDraw.visible;
+      }
+    },
+    removeMember(member, index) {
+      let app = this;
+      this.$confirm({
+        title: `您确定要将「${member.name}」从项目中移除吗？`,
+        content: `移除后该成员将不能查看任何关于该项目的信息`,
+        okText: "移除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          removeMember(member.code, app.code).then((res) => {
+            if (!checkResponse(res)) {
+              return;
             }
+            app.projectMembers.splice(index, 1);
+            notice({ title: "移除成功" }, "notice", "success");
+          });
+          return Promise.resolve();
+        },
+      });
+    },
+    inviteMember(item) {
+      inviteMember(item.memberCode, this.projectCode).then((res) => {
+        const success = checkResponse(res);
+        if (success) {
+          item.joined = true;
         }
-    }
-
-    .info-drawer {
-        top: 116px;
-        width: 0 !important;
-
-        .ant-drawer-mask {
-            visibility: hidden;
+      });
+    },
+    searchInviteMember: _.debounce(function () {
+      if (!this.inviteMemberDraw.keyword) {
+        this.projectMembers = JSON.parse(
+          JSON.stringify(this.projectMembersCopy)
+        );
+      }
+      if (this.inviteMemberDraw.keyword.length <= 1) {
+        return false;
+      }
+      this.searching = true;
+      this.projectMembers = this.projectMembers.filter(
+        (item) => item.name.indexOf(this.inviteMemberDraw.keyword) != -1
+      );
+    }, 500),
+    updateProject(data) {
+      this.project = data;
+    },
+    collectProject() {
+      const type = this.project.collected ? "cancel" : "collect";
+      collect(this.project.code, type).then((res) => {
+        if (!checkResponse(res)) {
+          return;
         }
-
-        .ant-drawer-content {
-            /*background-color: #f7f7f7;*/
+        this.project.collected = !this.project.collected;
+      });
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        notice(`正在导入，请稍后...`, "message", "loading", 0);
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        console.log(info);
+        this.uploadLoading = false;
+        if (checkResponse(info.file.response, true)) {
+          const count = info.file.response.data;
+          if (count) {
+            notice(`成功导入${count}个任务`, "message", "success");
+          } else {
+            notice(`没有成功导入任何任务`, "message", "warning");
+          }
+          this.getTaskStages(false);
         }
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("文件不能超过2MB!");
+      }
+      return isLt2M;
+    },
+    getStatusColor(status) {
+      const statusInfo = this.taskStatusList.find((item) => item.id == status);
+      if (statusInfo) {
+        return statusInfo.color;
+      }
+      return "";
+    },
+  },
+};
+</script>
 
-        .ant-drawer-header {
-            /*background-color: #f7f7f7;*/
-            text-align: center;
-        }
+<style lang="less">
+.info-drawer {
+  top: 0;
+  position: absolute;
+  bottom: 0;
 
-        .ant-drawer-body {
-            padding: 12px 0;
-        }
+  .ant-drawer-mask {
+    visibility: hidden;
+  }
 
-        .search-content {
-            padding: 0 24px;
-        }
+  .ant-drawer-content-wrapper {
+    border-radius: 10px;
+    .ant-drawer-content {
+      .ant-drawer-header {
+      }
+
+      .ant-drawer-body {
+        padding: 12px 0;
+      }
     }
+  }
 
-    .info-drawer {
-        .member-list {
-            padding-top: 12px;
+  .search-content {
+    padding: 0 24px;
+  }
+  .member-list {
+    padding-top: 12px;
 
-            .ant-list-item-meta {
-                align-items: center;
-            }
+    .ant-list-item-meta {
+      align-items: center;
+    }
 
-            .member-list-item {
-                padding: 12px 24px;
+    .member-list-item {
+      padding: 12px 24px;
 
-                &:hover {
-                    background-color: #eee;
-                    cursor: pointer;
-                }
-            }
-        }
+      &:hover {
+        background-color: #eee;
+        cursor: pointer;
+      }
     }
+  }
+  .config-wrapper {
+    position: relative;
+    padding-bottom: 1px;
 
-    .info-drawer {
-        .config-wrapper {
-            position: relative;
-            padding-bottom: 1px;
-
-            .config-menus {
-                padding: 0;
-                list-style: none;
+    .config-menus {
+      padding: 0;
+      list-style: none;
 
-                .menu-item {
-                    position: relative;
-                    line-height: 30px;
+      .menu-item {
+        position: relative;
+        line-height: 30px;
 
-                    &:hover {
-                        background: #eeeeee;
-                    }
+        &:hover {
+          background: #eeeeee;
+        }
 
-                    &:first-child > a {
-                        margin-top: -6px;
-                    }
+        &:first-child > a {
+          margin-top: -6px;
+        }
 
-                    a {
-                        display: block;
-                        cursor: pointer;
-                        padding: 5px 15px;
-                        text-decoration: none;
-                        overflow: hidden;
-                        text-overflow: ellipsis;
-                        white-space: nowrap;
-                        color: #383838;
-                        font-weight: 600;
+        a {
+          display: block;
+          cursor: pointer;
+          padding: 5px 15px;
+          text-decoration: none;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          white-space: nowrap;
+          color: #383838;
+          font-weight: 600;
 
-                        .anticon {
-                            width: 24px;
-                            text-align: center;
-                            font-size: 15px;
-                            margin-right: 5px;
-                        }
-                    }
-                }
-            }
+          .anticon {
+            width: 24px;
+            text-align: center;
+            font-size: 15px;
+            margin-right: 5px;
+          }
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/project/space/taskdetail.vue b/src/views/project/space/taskdetail.vue
index 19219ed..ec53689 100644
--- a/src/views/project/space/taskdetail.vue
+++ b/src/views/project/space/taskdetail.vue
@@ -1,74 +1,72 @@
 <template>
-    <a-modal
-            class="task-detail-modal"
-            width="min-content"
-            :closable="false"
-            visible
-            title=""
-            :footer="null"
-            @cancel="detailClose"
-    >
-        <task-detail :taskCode="code" @close="detailClose"></task-detail>
-
-    </a-modal>
+  <a-modal
+    class="task-detail-modal"
+    width="min-content"
+    :closable="false"
+    visible
+    title
+    :footer="null"
+    @cancel="detailClose"
+  >
+    <task-detail :taskCode="code" @close="detailClose"></task-detail>
+  </a-modal>
 </template>
 
 <script>
-    import taskDetail from '../../../components/project/taskDetail'
+import taskDetail from "../../../components/project/taskDetail";
 
-    export default {
-        name: "task-detail-modal",
-        components: {
-            taskDetail
-        },
-        data() {
-            return {
-                loading: false,
-                code: this.$route.params.taskCode,
-                projectCode: this.$route.params.code,
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                this.loading = true;
-            },
-            detailClose() {
-                const stageIndex = this.$route.query.from;
-                let url = '';
-                if (stageIndex) {
-                    url = `?from=${stageIndex}`;
-                }
-                this.$router.push(`/project/space/task/${this.projectCode}${url}`);
-            },
-        }
-    }
+export default {
+  name: "task-detail-modal",
+  components: {
+    taskDetail,
+  },
+  data() {
+    return {
+      loading: false,
+      code: this.$route.params.taskCode,
+      projectCode: this.$route.params.code,
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      this.loading = true;
+    },
+    detailClose() {
+      const stageIndex = this.$route.query.from;
+      let url = "";
+      if (stageIndex) {
+        url = `?from=${stageIndex}`;
+      }
+      this.$router.push(`/project/space/task/${this.projectCode}${url}`);
+    },
+  },
+};
 </script>
 
 
 <style lang="less">
-    .task-detail-modal {
-        /*display: flex;*/
-        /*justify-content: center;*/
-        /*flex: 1;*/
-        /*min-height: 1px;*/
-        /*min-width: 1px;*/
-        width: 1200px;
-
-        &.ant-modal {
-            padding-bottom: 0;
-        }
+.task-detail-modal {
+  /*display: flex;*/
+  /*justify-content: center;*/
+  /*flex: 1;*/
+  /*min-height: 1px;*/
+  /*min-width: 1px;*/
+  width: 1200px;
 
-        .ant-modal-content {
-            /*width: 1200px;*/
-            /*overflow: hidden;*/
+  &.ant-modal {
+    padding-bottom: 0;
+  }
 
-            .ant-modal-body {
-                padding: 0;
-            }
+  .ant-modal-content {
+    /*width: 1200px;*/
+    /*overflow: hidden;*/
 
-        }
+    .ant-modal-body {
+      padding: 0;
     }
+  }
+}
 </style>
-- 
Gitee


From 8c575bfae09e3ce0b09464c2fa753547da3527c0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Wed, 2 Sep 2020 00:59:40 +0800
Subject: [PATCH 4/8] =?UTF-8?q?v2.9.0=5F=E5=A2=9E=E5=8A=A0=E5=85=AC?=
 =?UTF-8?q?=E5=85=B1=E6=96=87=E4=BB=B6=E7=AE=A1=E7=90=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/components/base.less           |    5 +
 src/components/layout/header/HeaderNotice.vue |    1 +
 src/components/project/projectConfig.vue      |    4 +-
 src/components/project/projectMemberMenu.vue  |  453 ++++---
 src/components/project/recycleBin.vue         |  548 ++++----
 src/components/project/taskDetail.vue         |    1 +
 src/components/project/taskMemberMenu.vue     |    1 +
 src/components/project/taskSearch.vue         |  668 ++++-----
 src/components/project/taskTag.vue            |  599 ++++----
 src/components/project/taskTagMenu.vue        |  599 ++++----
 src/components/project/versionDetail.vue      |    1 +
 src/components/tools/VUploader.vue            |  696 +++++-----
 src/config/version.js                         |    2 +-
 src/views/common/forgot.vue                   |  182 +--
 src/views/common/inviteFromLink.vue           |  233 ++--
 src/views/files/index.vue                     |  334 +++++
 src/views/home/index.vue                      |    5 +-
 src/views/index.vue                           |    6 +-
 src/views/member/login.vue                    |    1 +
 src/views/members/index.vue                   | 1208 +++++++++--------
 src/views/project/archive/index.vue           |    4 +-
 src/views/project/list/index.vue              |    4 +-
 src/views/project/recycle/index.vue           |  287 ++--
 src/views/project/space/features.vue          |    7 +-
 src/views/project/space/files.vue             |  167 +--
 src/views/project/space/overview.vue          |    5 +-
 src/views/project/space/task.vue              |    9 +-
 src/views/project/template/index.vue          |  644 ++++-----
 src/views/project/template/taskStages.vue     |  450 +++---
 src/views/system/config/menu.vue              | 1009 +++++++-------
 30 files changed, 4349 insertions(+), 3784 deletions(-)
 create mode 100644 src/views/files/index.vue

diff --git a/src/assets/css/components/base.less b/src/assets/css/components/base.less
index 04b3245..321be07 100644
--- a/src/assets/css/components/base.less
+++ b/src/assets/css/components/base.less
@@ -490,4 +490,9 @@ body {
 .ant-table-thead {
   white-space: nowrap;
   word-break: keep-all;
+}
+
+.ant-empty {
+  margin: 2rem 1rem;
+  user-select: none;
 }
\ No newline at end of file
diff --git a/src/components/layout/header/HeaderNotice.vue b/src/components/layout/header/HeaderNotice.vue
index 6c91f54..0b4b7a3 100644
--- a/src/components/layout/header/HeaderNotice.vue
+++ b/src/components/layout/header/HeaderNotice.vue
@@ -7,6 +7,7 @@
   >
     <template slot="content">
       <a-spin :spinning="loading">
+        <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
         <a-tabs class="header-notice-content" :tabBarGutter="25">
           <a-tab-pane key="1">
             <span slot="tab">
diff --git a/src/components/project/projectConfig.vue b/src/components/project/projectConfig.vue
index 26d140c..678ee70 100644
--- a/src/components/project/projectConfig.vue
+++ b/src/components/project/projectConfig.vue
@@ -373,7 +373,9 @@
                   </template>
                 </template>
                 <div class="text-center">
-                  <a-spin :spinning="loadingWorkflowRule"></a-spin>
+                  <a-spin :spinning="loadingWorkflowRule">
+                    <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                  </a-spin>
                 </div>
               </div>
             </div>
diff --git a/src/components/project/projectMemberMenu.vue b/src/components/project/projectMemberMenu.vue
index ff2a8f4..00b9671 100644
--- a/src/components/project/projectMemberMenu.vue
+++ b/src/components/project/projectMemberMenu.vue
@@ -1,223 +1,246 @@
 <template>
-    <div class="member-menu project-member-menu">
-        <a-spin :spinning="projectMemberLoading || taskMemberLoading">
-            <!--<div class="header">
-            </div>-->
-            <div class="search-content">
-                <a-input v-model="keyword" size="large" placeholder="搜索">
-                    <a-icon slot="prefix" type="search"/>
-                </a-input>
+  <div class="member-menu project-member-menu">
+    <a-spin :spinning="projectMemberLoading || taskMemberLoading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+      <!--<div class="header">
+      </div>-->
+      <div class="search-content">
+        <a-input v-model="keyword" size="large" placeholder="搜索">
+          <a-icon slot="prefix" type="search" />
+        </a-input>
+      </div>
+      <div class="member-list">
+        <vue-scroll>
+          <div class="list-group" v-show="!keyword">
+            <span class="title muted">参与者</span>
+            <a-list
+              class="list-content"
+              itemLayout="horizontal"
+              :dataSource="taskMemberList"
+              v-show="taskMemberList.length"
+            >
+              <a-list-item
+                class="member-list-item"
+                :class="{'owner':item.is_owner}"
+                slot="renderItem"
+                slot-scope="item"
+                @click.native="addToInvite(item.code,item.is_owner)"
+              >
+                <span slot="actions">
+                  <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
+                </span>
+                <a-list-item-meta>
+                  <span slot="title">{{item.name}}</span>
+                  <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+          </div>
+          <div class="list-group">
+            <span class="title muted">其他成员</span>
+            <div class="member-list-item ant-list-item" @click="addToInvite('all')">
+              <div class="ant-list-item-meta">
+                <div class="ant-list-item-meta-avatar">
+                  <a-avatar icon="user"></a-avatar>
+                </div>
+                <div class="ant-list-item-meta-content">
+                  <h4 class="ant-list-item-meta-title">
+                    <span>所有项目成员</span>
+                  </h4>
+                </div>
+              </div>
+              <ul class="ant-list-item-action" v-show="showCheck('all')">
+                <li>
+                  <span>
+                    <a-icon type="check"></a-icon>
+                  </span>
+                </li>
+              </ul>
             </div>
-            <div class="member-list">
-                <vue-scroll>
-                    <div class="list-group" v-show="!keyword">
-                        <span class="title muted">参与者</span>
-                        <a-list
-                                class="list-content"
-                                itemLayout="horizontal"
-                                :dataSource="taskMemberList"
-                                v-show="taskMemberList.length"
-
-                        >
-                            <a-list-item class="member-list-item"
-                                         :class="{'owner':item.is_owner}"
-                                         slot="renderItem"
-                                         slot-scope="item"
-                                         @click.native="addToInvite(item.code,item.is_owner)"
-                            >
-                                <span slot="actions">
-                                    <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
-                                 </span>
-                                <a-list-item-meta>
-                                    <span slot="title">{{item.name}}</span>
-                                    <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                    </div>
-                    <div class="list-group">
-                        <span class="title muted">其他成员</span>
-                        <div class="member-list-item ant-list-item" @click="addToInvite('all')">
-                            <div class="ant-list-item-meta">
-                                <div class="ant-list-item-meta-avatar">
-                                    <a-avatar icon="user"></a-avatar>
-                                </div>
-                                <div class="ant-list-item-meta-content">
-                                    <h4 class="ant-list-item-meta-title"><span>所有项目成员</span></h4>
-                                </div>
-                            </div>
-                            <ul class="ant-list-item-action" v-show="showCheck('all')">
-                                <li>
-                                    <span><a-icon type="check"></a-icon></span>
-                                </li>
-                            </ul>
-                        </div>
-                        <a-list
-                                class="list-content"
-                                itemLayout="horizontal"
-                                :dataSource="projectMemberList"
-                                :locale="{emptyText: (keyword && keyword.length > 1) ? '该成员不在项目成员列表中' : ''}"
-                        >
-                            <a-list-item class="member-list-item"
-                                         slot="renderItem"
-                                         slot-scope="item"
-                                         @click.native="addToInvite(item.code,false)"
-                                         v-if="showMember(item)">
-                                 <span slot="actions">
-                                    <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
-                                 </span>
-                                <a-list-item-meta>
-                                    <span slot="title">{{item.name}}</span>
-                                    <a-avatar slot="avatar" icon="user" :src="item.avatar"/>
-                                </a-list-item-meta>
-                            </a-list-item>
-                        </a-list>
-                    </div>
-                </vue-scroll>
-            </div>
-            <div class="footer">
-                <a-button type="primary" size="large" block @click="inviteTaskMember">确定</a-button>
-            </div>
-        </a-spin>
-    </div>
+            <a-list
+              class="list-content"
+              itemLayout="horizontal"
+              :dataSource="projectMemberList"
+              :locale="{emptyText: (keyword && keyword.length > 1) ? '该成员不在项目成员列表中' : ''}"
+            >
+              <a-list-item
+                class="member-list-item"
+                slot="renderItem"
+                slot-scope="item"
+                @click.native="addToInvite(item.code,false)"
+                v-if="showMember(item)"
+              >
+                <span slot="actions">
+                  <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
+                </span>
+                <a-list-item-meta>
+                  <span slot="title">{{item.name}}</span>
+                  <a-avatar slot="avatar" icon="user" :src="item.avatar" />
+                </a-list-item-meta>
+              </a-list-item>
+            </a-list>
+          </div>
+        </vue-scroll>
+      </div>
+      <div class="footer">
+        <a-button type="primary" size="large" block @click="inviteTaskMember">确定</a-button>
+      </div>
+    </a-spin>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import {inviteMember, list, searchInviteMember} from "../../api/projectMember";
-    import {list as getTaskMembers, inviteMemberBatch} from "../../api/taskMember";
+import _ from "lodash";
+import {
+  inviteMember,
+  list,
+  searchInviteMember,
+} from "../../api/projectMember";
+import {
+  list as getTaskMembers,
+  inviteMemberBatch,
+} from "../../api/taskMember";
 
-    export default {
-        name: "projectMemberMenu",
-        props: {
-            projectCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            },
-            taskCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            }
-        },
-        data() {
-            return {
-                keyword: '',
-                searching: false,
-                taskMemberLoading: true,
-                projectMemberLoading: true,
-                showInviteMember: false,
-                taskMemberList: [],
-                projectMemberList: [],
-                listTemp: [],
-                projectMemberListCopy: [],
-                initAllMember: false, //初始化选择“所有项目成员”
-            };
-        },
-        created() {
-            this.init();
-        },
-        watch: {
-            keyword() {
-                this.search();
-            }
-        },
-        methods: {
-            init() {
-                this.projectMemberLoading = true;
-                this.taskMemberLoading = true;
-                if (this.projectCode) {
-                    list({projectCode: this.projectCode, pageSize: 300}).then(res => {
-                        this.projectMemberList = res.data.list;
-                        this.projectMemberListCopy = res.data.list;
-                        this.projectMemberLoading = false;
-                    });
-                }
-                if (this.taskCode) {
-                    getTaskMembers({taskCode: this.taskCode, pageSize: 300}).then(res => {
-                        this.taskMemberList = res.data.list;
-                        res.data.list.forEach((v) => {
-                            this.listTemp.push(v.code);
-                        });
-                        this.taskMemberLoading = false;
-                    });
-                }
-            },
-            showMember(item) {
-                let show = true;
-                this.taskMemberList.forEach((v) => {
-                    if (item.code == v.code) {
-                        show = false;
-                    }
-                });
-                return show;
-            },
-            showCheck(code) {
-                if (code == 'all' && !this.initAllMember) {
-                    return false;
-                }
-                const index = this.listTemp.find(item => item == code);
-                if (index) {
-                    return true;
-                }
-            },
-            addToInvite(code, isOwner = false) {
-                if (isOwner) {
-                    return false;
-                }
-                if (code == 'all') {
-                    this.initAllMember = true;
-                }
-                const index = this.listTemp.findIndex(item => item == code);
-                if (index !== -1) {
-                    this.listTemp.splice(index, 1);
-                } else {
-                    this.listTemp.push(code);
-                }
-            },
-            inviteTaskMember() {
-                //求差集
-                let memberCodes = [];
-                this.taskMemberList.forEach((item) => {
-                    const index = this.listTemp.findIndex(code => code == item.code);
-                    if (index === -1) {
-                        memberCodes.push(item.code);
-                    }
-                });
-                this.listTemp.forEach((code) => {
-                    const index = this.taskMemberList.findIndex(item => code == item.code);
-                    if (index === -1) {
-                        memberCodes.push(code);
-                    }
-                });
-                if (memberCodes) {
-                    inviteMemberBatch({memberCodes: JSON.stringify(memberCodes), taskCode: this.taskCode}).then(() => {
-                        this.$emit('close')
-                    });
-                }else{
-                    this.$emit('close')
-                }
-            },
-            search: _.debounce(
-                function () {
-                    this.keyword = this.keyword.trim();
-                    if (!this.keyword) {
-                        this.projectMemberList = JSON.parse(JSON.stringify(this.projectMemberListCopy));
-                    }
-                    if (this.keyword.length <= 1) {
-                        return false;
-                    }
-                    this.searching = true;
-                    this.projectMemberList = this.projectMemberList.filter(item => item.name.indexOf(this.keyword) != -1);
-                    // searchInviteMember(this.keyword, this.projectCode).then(res => {
-                    //     this.searching = false;
-                    //     this.list = res.data;
-                    // });
-                }, 500
-            ),
+export default {
+  name: "projectMemberMenu",
+  props: {
+    projectCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+    taskCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      keyword: "",
+      searching: false,
+      taskMemberLoading: true,
+      projectMemberLoading: true,
+      showInviteMember: false,
+      taskMemberList: [],
+      projectMemberList: [],
+      listTemp: [],
+      projectMemberListCopy: [],
+      initAllMember: false, //初始化选择“所有项目成员”
+    };
+  },
+  created() {
+    this.init();
+  },
+  watch: {
+    keyword() {
+      this.search();
+    },
+  },
+  methods: {
+    init() {
+      this.projectMemberLoading = true;
+      this.taskMemberLoading = true;
+      if (this.projectCode) {
+        list({ projectCode: this.projectCode, pageSize: 300 }).then((res) => {
+          this.projectMemberList = res.data.list;
+          this.projectMemberListCopy = res.data.list;
+          this.projectMemberLoading = false;
+        });
+      }
+      if (this.taskCode) {
+        getTaskMembers({ taskCode: this.taskCode, pageSize: 300 }).then(
+          (res) => {
+            this.taskMemberList = res.data.list;
+            res.data.list.forEach((v) => {
+              this.listTemp.push(v.code);
+            });
+            this.taskMemberLoading = false;
+          }
+        );
+      }
+    },
+    showMember(item) {
+      let show = true;
+      this.taskMemberList.forEach((v) => {
+        if (item.code == v.code) {
+          show = false;
+        }
+      });
+      return show;
+    },
+    showCheck(code) {
+      if (code == "all" && !this.initAllMember) {
+        return false;
+      }
+      const index = this.listTemp.find((item) => item == code);
+      if (index) {
+        return true;
+      }
+    },
+    addToInvite(code, isOwner = false) {
+      if (isOwner) {
+        return false;
+      }
+      if (code == "all") {
+        this.initAllMember = true;
+      }
+      const index = this.listTemp.findIndex((item) => item == code);
+      if (index !== -1) {
+        this.listTemp.splice(index, 1);
+      } else {
+        this.listTemp.push(code);
+      }
+    },
+    inviteTaskMember() {
+      //求差集
+      let memberCodes = [];
+      this.taskMemberList.forEach((item) => {
+        const index = this.listTemp.findIndex((code) => code == item.code);
+        if (index === -1) {
+          memberCodes.push(item.code);
+        }
+      });
+      this.listTemp.forEach((code) => {
+        const index = this.taskMemberList.findIndex(
+          (item) => code == item.code
+        );
+        if (index === -1) {
+          memberCodes.push(code);
         }
-    }
+      });
+      if (memberCodes) {
+        inviteMemberBatch({
+          memberCodes: JSON.stringify(memberCodes),
+          taskCode: this.taskCode,
+        }).then(() => {
+          this.$emit("close");
+        });
+      } else {
+        this.$emit("close");
+      }
+    },
+    search: _.debounce(function () {
+      this.keyword = this.keyword.trim();
+      if (!this.keyword) {
+        this.projectMemberList = JSON.parse(
+          JSON.stringify(this.projectMemberListCopy)
+        );
+      }
+      if (this.keyword.length <= 1) {
+        return false;
+      }
+      this.searching = true;
+      this.projectMemberList = this.projectMemberList.filter(
+        (item) => item.name.indexOf(this.keyword) != -1
+      );
+      // searchInviteMember(this.keyword, this.projectCode).then(res => {
+      //     this.searching = false;
+      //     this.list = res.data;
+      // });
+    }, 500),
+  },
+};
 </script>
diff --git a/src/components/project/recycleBin.vue b/src/components/project/recycleBin.vue
index 676e382..2997c81 100644
--- a/src/components/project/recycleBin.vue
+++ b/src/components/project/recycleBin.vue
@@ -1,301 +1,309 @@
 <template>
-    <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
-        <a-tab-pane key="1">
-            <span slot="tab">
-                <a-icon type="check-square"/>
-                任务
-            </span>
-        </a-tab-pane>
-        <a-tab-pane key="2">
-            <span slot="tab">
-                <a-icon type="link"/>
-                文件
-            </span>
-        </a-tab-pane>
-        <div class="config-content">
-            <vue-scroll>
-                <div class="content-item">
-                    <div class="infos">
-                        <a-list>
-                            <div v-if="showLoadingMore" slot="loadMore"
-                                 :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                                <a-spin v-if="loadingMore"/>
-                                <a-button v-else @click="onLoadMore">加载更多</a-button>
-                            </div>
-                            <a-list-item :key="index" v-for="(item, index) in list">
-                                <a-list-item-meta>
-                                    <div slot="title">
-                                        <router-link class="text-default" v-show="tabKey == '1'"
-                                                     :to="`/project/space/task/${code}/detail/${item.code}`">
-                                            {{ item.name }}
-                                        </router-link>
-                                        <a target="_blank" class="text-default" v-show="tabKey == '2'"
-                                                     :href="item.file_url">
-                                            {{ item.fullName }}
-                                        </a>
-                                    </div>
-                                    <div slot="description">
-                                        {{showTaskTime(item.deleted_time)}}
-                                    </div>
-                                </a-list-item-meta>
-                                <a class="muted" slot="actions" @click="recoveryTask(item,index)">
-                                    <a-tooltip title="恢复内容">
-                                        <a-icon type="undo"/>
-                                    </a-tooltip>
-                                </a>
-                                <a class="muted" slot="actions" @click="deleteItem(item,index)">
-                                    <a-tooltip title="彻底删除">
-                                        <a-icon type="delete"/>
-                                    </a-tooltip>
-                                </a>
-                            </a-list-item>
-                        </a-list>
-                    </div>
-                </div>
-            </vue-scroll>
+  <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
+    <a-tab-pane key="1">
+      <span slot="tab">
+        <a-icon type="check-square" />任务
+      </span>
+    </a-tab-pane>
+    <a-tab-pane key="2">
+      <span slot="tab">
+        <a-icon type="link" />文件
+      </span>
+    </a-tab-pane>
+    <div class="config-content">
+      <vue-scroll>
+        <div class="content-item">
+          <div class="infos">
+            <a-list>
+              <div
+                v-if="showLoadingMore"
+                slot="loadMore"
+                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+              >
+                <a-spin v-if="loadingMore">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                </a-spin>
+                <a-button v-else @click="onLoadMore">加载更多</a-button>
+              </div>
+              <a-list-item :key="index" v-for="(item, index) in list">
+                <a-list-item-meta>
+                  <div slot="title">
+                    <router-link
+                      class="text-default"
+                      v-show="tabKey == '1'"
+                      :to="`/project/space/task/${code}/detail/${item.code}`"
+                    >{{ item.name }}</router-link>
+                    <a
+                      target="_blank"
+                      class="text-default"
+                      v-show="tabKey == '2'"
+                      :href="item.file_url"
+                    >{{ item.fullName }}</a>
+                  </div>
+                  <div slot="description">{{showTaskTime(item.deleted_time)}}</div>
+                </a-list-item-meta>
+                <a class="muted" slot="actions" @click="recoveryTask(item,index)">
+                  <a-tooltip title="恢复内容">
+                    <a-icon type="undo" />
+                  </a-tooltip>
+                </a>
+                <a class="muted" slot="actions" @click="deleteItem(item,index)">
+                  <a-tooltip title="彻底删除">
+                    <a-icon type="delete" />
+                  </a-tooltip>
+                </a>
+              </a-list-item>
+            </a-list>
+          </div>
         </div>
-    </a-tabs>
+      </vue-scroll>
+    </div>
+  </a-tabs>
 </template>
 
 <script>
-    import {checkResponse} from "../../assets/js/utils";
-    import {list, recovery, del} from "../../api/task";
-    import {list as getFiles, recovery as recoveryFile, del as delFile} from "../../api/file";
-    import pagination from "../../mixins/pagination";
-    import {relativelyTaskTime} from "../../assets/js/dateTime";
+import { checkResponse } from "../../assets/js/utils";
+import { list, recovery, del } from "../../api/task";
+import {
+  list as getFiles,
+  recovery as recoveryFile,
+  del as delFile,
+} from "../../api/file";
+import pagination from "../../mixins/pagination";
+import { relativelyTaskTime } from "../../assets/js/dateTime";
 
-    export default {
-        name: "recycleBin",
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
+export default {
+  name: "recycleBin",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      loading: false,
+      tabKey: "1",
+      project: {},
+      list: [],
+      showLoadingMore: false,
+      loadingMore: false,
+    };
+  },
+  watch: {
+    code() {
+      this.init();
+    },
+    tabKey(val) {
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.list = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 10;
+        this.showLoadingMore = false;
+      }
+      this.requestData.deleted = 1;
+      this.requestData.projectCode = this.code;
+      app.loading = true;
+      switch (this.tabKey) {
+        case "1":
+          app.getTasks();
+          break;
+        case "2":
+          app.getFiles();
+          break;
+      }
+    },
+    getTasks() {
+      let app = this;
+      list(app.requestData).then((res) => {
+        app.list = app.list.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.list.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    getFiles() {
+      let app = this;
+      getFiles(app.requestData).then((res) => {
+        app.list = app.list.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.list.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    showTaskTime(time) {
+      return relativelyTaskTime(time);
+    },
+    recoveryTask(item, index) {
+      let app = this;
+      switch (this.tabKey) {
+        case "1":
+          this.$confirm({
+            title: "确定恢复内容？",
+            content: `恢复后可在任务列表中查看`,
+            okText: "恢复内容",
+            okType: "primary",
+            cancelText: "再想想",
+            onOk() {
+              recovery(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
             },
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                loading: false,
-                tabKey: '1',
-                project: {},
-                list: [],
-                showLoadingMore: false,
-                loadingMore: false,
-            }
-        },
-        watch: {
-            code() {
-                this.init();
-            },
-            tabKey(val) {
-                this.init();
-            }
-
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.list = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 10;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.deleted = 1;
-                this.requestData.projectCode = this.code;
-                app.loading = true;
-                switch (this.tabKey) {
-                    case '1':
-                        app.getTasks();
-                        break;
-                    case '2':
-                        app.getFiles();
-                        break;
+          });
+          break;
+        case "2":
+          this.$confirm({
+            title: "确定恢复文件？",
+            content: `恢复后可在我的文件中查看`,
+            okText: "恢复文件",
+            okType: "primary",
+            cancelText: "再想想",
+            onOk() {
+              recoveryFile(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
             },
-            getTasks() {
-                let app = this;
-                list(app.requestData).then(res => {
-                    app.list = app.list.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.list.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            getFiles() {
-                let app = this;
-                getFiles(app.requestData).then(res => {
-                    app.list = app.list.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.list.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            showTaskTime(time) {
-                return relativelyTaskTime(time);
-            },
-            recoveryTask(item, index) {
-                let app = this;
-                switch (this.tabKey) {
-                    case '1':
-                        this.$confirm({
-                            title: '确定恢复内容？',
-                            content: `恢复后可在任务列表中查看`,
-                            okText: '恢复内容',
-                            okType: 'primary',
-                            cancelText: '再想想',
-                            onOk() {
-                                recovery(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case '2':
-                        this.$confirm({
-                            title: '确定恢复文件？',
-                            content: `恢复后可在我的文件中查看`,
-                            okText: '恢复文件',
-                            okType: 'primary',
-                            cancelText: '再想想',
-                            onOk() {
-                                recoveryFile(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
+          });
+          break;
+      }
+    },
+    deleteItem(item, index) {
+      let app = this;
+      switch (this.tabKey) {
+        case "1":
+          this.$confirm({
+            title: "确定彻底删除任务？",
+            content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
+            okText: "彻底删除",
+            okType: "danger",
+            cancelText: "再想想",
+            onOk() {
+              del(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
             },
-            deleteItem(item, index) {
-                let app = this;
-                switch (this.tabKey) {
-                    case '1':
-                        this.$confirm({
-                            title: '确定彻底删除任务？',
-                            content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
-                            okText: '彻底删除',
-                            okType: 'danger',
-                            cancelText: '再想想',
-                            onOk() {
-                                del(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case '2':
-                        this.$confirm({
-                            title: '确认彻底删除该文件？',
-                            content: `彻底删除文件后，相关的关联资源将会失效。`,
-                            okText: '彻底删除',
-                            okType: 'danger',
-                            cancelText: '再想想',
-                            onOk() {
-                                delFile(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
+          });
+          break;
+        case "2":
+          this.$confirm({
+            title: "确认彻底删除该文件？",
+            content: `彻底删除文件后，相关的关联资源将会失效。`,
+            okText: "彻底删除",
+            okType: "danger",
+            cancelText: "再想想",
+            onOk() {
+              delFile(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
-            }
-        }
-    }
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
+            },
+          });
+          break;
+      }
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .recycle-bin-modal {
-        .ant-modal-body {
-            padding: 0;
-        }
+.recycle-bin-modal {
+  .ant-modal-body {
+    padding: 0;
+  }
 
-        .ant-modal-body {
-            padding-bottom: 18px;
+  .ant-modal-body {
+    padding-bottom: 18px;
+  }
 
-        }
-
-        .ant-modal-body, .ant-tabs, .ant-tabs-bar {
-            height: 84vh;
-            min-width: 180px;
+  .ant-modal-body,
+  .ant-tabs,
+  .ant-tabs-bar {
+    height: 84vh;
+    min-width: 180px;
 
-            .ant-tabs-tab {
-                padding: 12px 24px;
-                font-size: 16px;
-            }
-        }
+    .ant-tabs-tab {
+      padding: 12px 24px;
+      font-size: 16px;
+    }
+  }
 
-        .ant-tabs-nav-wrap {
-            padding-top: 10px;
-        }
+  .ant-tabs-nav-wrap {
+    padding-top: 10px;
+  }
 
-        .ant-tabs-left-content {
-            padding-top: 6px;
-            padding-right: 12px;
-        }
+  .ant-tabs-left-content {
+    padding-top: 6px;
+    padding-right: 12px;
+  }
 
-        .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
-            text-align: left;
-        }
+  .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
+    text-align: left;
+  }
 
-        .config-content {
-            height: 80vh;
+  .config-content {
+    height: 80vh;
 
-            .content-item {
-                display: flex;
-                justify-content: space-between;
-                flex: 1 1;
-                margin-bottom: 24px;
+    .content-item {
+      display: flex;
+      justify-content: space-between;
+      flex: 1 1;
+      margin-bottom: 24px;
 
-                .infos {
-                    width: 100%;
-                    padding-right: 12px;
+      .infos {
+        width: 100%;
+        padding-right: 12px;
 
-                    p {
-                        margin-bottom: 6px;
-                    }
+        p {
+          margin-bottom: 6px;
+        }
 
-                    .item-title {
-                        font-size: 16px;
-                    }
+        .item-title {
+          font-size: 16px;
+        }
 
-                    .item-tips {
-                        margin-bottom: 12px;
-                    }
-                }
-            }
+        .item-tips {
+          margin-bottom: 12px;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/project/taskDetail.vue b/src/components/project/taskDetail.vue
index be267fd..b07a67a 100644
--- a/src/components/project/taskDetail.vue
+++ b/src/components/project/taskDetail.vue
@@ -1,6 +1,7 @@
 <template>
     <div class="task-detail" id="task-detail">
         <a-spin class="task-detail-spin" :spinning="loading">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
             <div class="task-header" :class="{'disabled': task.deleted}">
                     <span class="head-title" v-if="!task.deleted">
                         <span v-if="task.parentTask">
diff --git a/src/components/project/taskMemberMenu.vue b/src/components/project/taskMemberMenu.vue
index 068fd70..7f27580 100644
--- a/src/components/project/taskMemberMenu.vue
+++ b/src/components/project/taskMemberMenu.vue
@@ -1,6 +1,7 @@
 <template>
     <div class="member-menu">
         <a-spin :spinning="listLoading || doListLoading">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
             <!--<div class="header">
             </div>-->
             <div class="search-content">
diff --git a/src/components/project/taskSearch.vue b/src/components/project/taskSearch.vue
index 3d62cab..894ddf6 100644
--- a/src/components/project/taskSearch.vue
+++ b/src/components/project/taskSearch.vue
@@ -1,170 +1,165 @@
 <template>
-    <div class="task-search">
-        <a-spin :spinning="loading">
-            <!--<div class="header">
-            </div>-->
-            <div class="search-content">
-                <a-form
-                        class="m-t-md"
-                        :form="form"
-                        @submit.prevent="handleSubmit">
-                    <a-form-item
-                            label='标题'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-input
-                                placeholder='搜索项目内任务'
-                                v-decorator="[
+  <div class="task-search">
+    <a-spin :spinning="loading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+      <!--<div class="header">
+      </div>-->
+      <div class="search-content">
+        <a-form class="m-t-md" :form="form" @submit.prevent="handleSubmit">
+          <a-form-item label="标题" :colon="false" :labelCol="{ span: 6 }" :wrapperCol="{ span: 18 }">
+            <a-input
+              placeholder="搜索项目内任务"
+              v-decorator="[
                                             'title',
                                             ]"
-                        >
-                        </a-input>
-                    </a-form-item>
-                    <a-form-item
-                            label='执行者'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                mode="multiple"
-                                showSearch
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+            ></a-input>
+          </a-form-item>
+          <a-form-item
+            label="执行者"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              mode="multiple"
+              showSearch
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'executor',
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="member.code" v-for="member in projectMemberList">
-                                <div class="task-search-member-item">
-                                    <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm"/>
-                                    <div>
-                                        <div>{{member.name}}</div>
-                                        <div class="muted">{{member.email}}</div>
-                                    </div>
-                                </div>
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <a-form-item
-                            label='创建者'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                mode="multiple"
-                                showSearch
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+              optionFilterProp="children"
+            >
+              <a-select-option :key="member.code" v-for="member in projectMemberList">
+                <div class="task-search-member-item">
+                  <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm" />
+                  <div>
+                    <div>{{member.name}}</div>
+                    <div class="muted">{{member.email}}</div>
+                  </div>
+                </div>
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item
+            label="创建者"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              mode="multiple"
+              showSearch
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'creator',
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="member.code" v-for="member in projectMemberList">
-                                <div class="task-search-member-item">
-                                    <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm"/>
-                                    <div>
-                                        <div>{{member.name}}</div>
-                                        <div class="muted">{{member.email}}</div>
-                                    </div>
-                                </div>
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <a-form-item
-                            label='参与者'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                mode="multiple"
-                                showSearch
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+              optionFilterProp="children"
+            >
+              <a-select-option :key="member.code" v-for="member in projectMemberList">
+                <div class="task-search-member-item">
+                  <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm" />
+                  <div>
+                    <div>{{member.name}}</div>
+                    <div class="muted">{{member.email}}</div>
+                  </div>
+                </div>
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item
+            label="参与者"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              mode="multiple"
+              showSearch
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'joiner',
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="member.code" v-for="member in projectMemberList">
-                                <div class="task-search-member-item">
-                                    <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm"/>
-                                    <div>
-                                        <div>{{member.name}}</div>
-                                        <div class="muted">{{member.email}}</div>
-                                    </div>
-                                </div>
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <a-form-item
-                            label='是否完成'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+              optionFilterProp="children"
+            >
+              <a-select-option :key="member.code" v-for="member in projectMemberList">
+                <div class="task-search-member-item">
+                  <a-avatar :size="24" icon="user" :src="member.avatar" class="m-r-sm" />
+                  <div>
+                    <div>{{member.name}}</div>
+                    <div class="muted">{{member.email}}</div>
+                  </div>
+                </div>
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item
+            label="是否完成"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'done',
                                              {initialValue: -1}
 
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="-1">全部</a-select-option>
-                            <a-select-option :key="1">是</a-select-option>
-                            <a-select-option :key="0">否</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <a-form-item
-                            label='优先级'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                mode="multiple"
-                                showSearch
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+              optionFilterProp="children"
+            >
+              <a-select-option :key="-1">全部</a-select-option>
+              <a-select-option :key="1">是</a-select-option>
+              <a-select-option :key="0">否</a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item
+            label="优先级"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              mode="multiple"
+              showSearch
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'pri',
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="0">普通</a-select-option>
-                            <a-select-option :key="1">紧急</a-select-option>
-                            <a-select-option :key="2">非常紧急</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <a-form-item
-                            label='执行状态'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-select
-                                mode="multiple"
-                                showSearch
-                                allowClear
-                                placeholder='请选择'
-                                v-decorator="[
+              optionFilterProp="children"
+            >
+              <a-select-option :key="0">普通</a-select-option>
+              <a-select-option :key="1">紧急</a-select-option>
+              <a-select-option :key="2">非常紧急</a-select-option>
+            </a-select>
+          </a-form-item>
+          <a-form-item
+            label="执行状态"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-select
+              mode="multiple"
+              showSearch
+              allowClear
+              placeholder="请选择"
+              v-decorator="[
                                             'status',
                                             ]"
-                                optionFilterProp="children"
-                        >
-                            <a-select-option :key="status.id" v-for="(status, index) in taskStatusList">{{status.name}}</a-select-option>
-                        </a-select>
-                    </a-form-item>
-                    <!--<a-form-item
+              optionFilterProp="children"
+            >
+              <a-select-option
+                :key="status.id"
+                v-for="(status, index) in taskStatusList"
+              >{{status.name}}</a-select-option>
+            </a-select>
+          </a-form-item>
+          <!--<a-form-item
                             label='任务列表'
                             :colon="false"
                             :labelCol="{ span: 6 }"
@@ -183,208 +178,217 @@
                             <a-select-option :key="stage.code" v-for="stage in taskStageList">{{stage.name}}
                             </a-select-option>
                         </a-select>
-                    </a-form-item>-->
-                    <a-form-item
-                            label='截止日期'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-range-picker
-                                style="width: 100%"
-                                allowClear
-                                format="YYYY-MM-DD"
-                                v-decorator="[
+          </a-form-item>-->
+          <a-form-item
+            label="截止日期"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-range-picker
+              style="width: 100%"
+              allowClear
+              format="YYYY-MM-DD"
+              v-decorator="[
                                             'end_time',
                                             ]"
-                        >
-                        </a-range-picker>
-                    </a-form-item>
-                    <a-form-item
-                            label='创建日期'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-range-picker
-                                style="width: 100%"
-                                allowClear
-                                format="YYYY-MM-DD"
-                                v-decorator="[
+            ></a-range-picker>
+          </a-form-item>
+          <a-form-item
+            label="创建日期"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-range-picker
+              style="width: 100%"
+              allowClear
+              format="YYYY-MM-DD"
+              v-decorator="[
                                             'create_time',
                                             ]"
-                        >
-                        </a-range-picker>
-                    </a-form-item>
-                    <a-form-item
-                            label='完成日期'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-range-picker
-                                style="width: 100%"
-                                allowClear
-                                format="YYYY-MM-DD"
-                                v-decorator="[
+            ></a-range-picker>
+          </a-form-item>
+          <a-form-item
+            label="完成日期"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-range-picker
+              style="width: 100%"
+              allowClear
+              format="YYYY-MM-DD"
+              v-decorator="[
                                             'done_time',
                                             ]"
-                        >
-                        </a-range-picker>
-                    </a-form-item>
-                    <a-form-item
-                            label='开始日期'
-                            :colon="false"
-                            :labelCol="{ span: 6 }"
-                            :wrapperCol="{ span: 18 }"
-                    >
-                        <a-range-picker
-                                style="width: 100%"
-                                allowClear
-                                format="YYYY-MM-DD"
-                                v-decorator="[
+            ></a-range-picker>
+          </a-form-item>
+          <a-form-item
+            label="开始日期"
+            :colon="false"
+            :labelCol="{ span: 6 }"
+            :wrapperCol="{ span: 18 }"
+          >
+            <a-range-picker
+              style="width: 100%"
+              allowClear
+              format="YYYY-MM-DD"
+              v-decorator="[
                                             'begin_time',
                                             ]"
-                        >
-                        </a-range-picker>
-                    </a-form-item>
-                </a-form>
-                <div class="footer m-t-md">
-                    <a-button class="m-r" type="primary" size="large" @click="handleSubmit">搜索</a-button>
-                    <a-button size="large" @click="resetForm">重置</a-button>
-                </div>
-            </div>
-        </a-spin>
-    </div>
+            ></a-range-picker>
+          </a-form-item>
+        </a-form>
+        <div class="footer m-t-md">
+          <a-button class="m-r" type="primary" size="large" @click="handleSubmit">搜索</a-button>
+          <a-button size="large" @click="resetForm">重置</a-button>
+        </div>
+      </div>
+    </a-spin>
+  </div>
 </template>
 <script>
-    import _ from 'lodash'
-    import moment from 'moment';
-    import {list as getProjectMember} from "../../api/projectMember";
-    import {_getAll as getTaskStage} from "../../api/taskStages";
-    import {notice} from "../../assets/js/notice";
-    import {COMMON} from "../../const/common";
+import _ from "lodash";
+import moment from "moment";
+import { list as getProjectMember } from "../../api/projectMember";
+import { _getAll as getTaskStage } from "../../api/taskStages";
+import { notice } from "../../assets/js/notice";
+import { COMMON } from "../../const/common";
 
-    export default {
-        name: "taskSearch",
-        props: {
-            projectCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            },
-        },
-        data() {
-            return {
-                moment,
-                form: this.$form.createForm(this),
-                loading: false,
-                projectMemberList: [],
-                taskStageList: [],
-                taskStatusList: COMMON.TASK_STATUS,
-            };
-        },
-        watch: {
-            projectCode() {
-                this.init();
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                if (this.projectCode) {
-                    this.resetForm();
-                    this.loading = true;
-                    this.getProjectMemberList();
-                    this.getTaskStageList();
-                }
-            },
-            getProjectMemberList() {
-                getProjectMember({projectCode: this.projectCode, pageSize: 300}).then(res => {
-                    this.projectMemberList = res.data.list;
-                    this.loading = false;
-                });
-            },
-            getTaskStageList() {
-                getTaskStage({projectCode: this.projectCode}).then(res => {
-                    this.taskStageList = res.data;
-                    this.loading = false;
-                });
-            },
-            resetForm() {
-                this.form.resetFields();
-            },
-            handleSubmit() {
-                this.form.validateFields((err, values) => {
-                    if (!err) {
-                        let params = this.form.getFieldsValue();
-                        params.executor = JSON.stringify(params.executor);
-                        params.creator = JSON.stringify(params.creator);
-                        params.joiner = JSON.stringify(params.joiner);
-                        params.status = JSON.stringify(params.status);
-                        console.log(params);
-                        if (params.end_time && params.end_time.length) {
-                            params.endTime = JSON.stringify([moment(params.end_time[0]).format('YYYY-MM-DD'), moment(params.end_time[1]).format('YYYY-MM-DD')]);
-                        } else {
-                            params.endTime = undefined;
-                        }
-                        if (params.begin_time && params.begin_time.length) {
-                            params.beginTime = JSON.stringify([moment(params.begin_time[0]).format('YYYY-MM-DD'), moment(params.begin_time[1]).format('YYYY-MM-DD')]);
-                        } else {
-                            params.beginTime = undefined;
-                        }
-                        if (params.create_time && params.create_time.length) {
-                            params.createTime = JSON.stringify([moment(params.create_time[0]).format('YYYY-MM-DD'), moment(params.create_time[1]).format('YYYY-MM-DD')]);
-                        } else {
-                            params.createTime = undefined;
-                        }
-                        if (params.done_time && params.done_time.length) {
-                            params.doneTime = JSON.stringify([moment(params.done_time[0]).format('YYYY-MM-DD'), moment(params.done_time[1]).format('YYYY-MM-DD')]);
-                        } else {
-                            params.doneTime = undefined;
-                        }
-                        console.log(params);
-                        this.$emit('search', params)
-                    }
-                })
-            },
+export default {
+  name: "taskSearch",
+  props: {
+    projectCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      moment,
+      form: this.$form.createForm(this),
+      loading: false,
+      projectMemberList: [],
+      taskStageList: [],
+      taskStatusList: COMMON.TASK_STATUS,
+    };
+  },
+  watch: {
+    projectCode() {
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      if (this.projectCode) {
+        this.resetForm();
+        this.loading = true;
+        this.getProjectMemberList();
+        this.getTaskStageList();
+      }
+    },
+    getProjectMemberList() {
+      getProjectMember({ projectCode: this.projectCode, pageSize: 300 }).then(
+        (res) => {
+          this.projectMemberList = res.data.list;
+          this.loading = false;
         }
-    }
+      );
+    },
+    getTaskStageList() {
+      getTaskStage({ projectCode: this.projectCode }).then((res) => {
+        this.taskStageList = res.data;
+        this.loading = false;
+      });
+    },
+    resetForm() {
+      this.form.resetFields();
+    },
+    handleSubmit() {
+      this.form.validateFields((err, values) => {
+        if (!err) {
+          let params = this.form.getFieldsValue();
+          params.executor = JSON.stringify(params.executor);
+          params.creator = JSON.stringify(params.creator);
+          params.joiner = JSON.stringify(params.joiner);
+          params.status = JSON.stringify(params.status);
+          console.log(params);
+          if (params.end_time && params.end_time.length) {
+            params.endTime = JSON.stringify([
+              moment(params.end_time[0]).format("YYYY-MM-DD"),
+              moment(params.end_time[1]).format("YYYY-MM-DD"),
+            ]);
+          } else {
+            params.endTime = undefined;
+          }
+          if (params.begin_time && params.begin_time.length) {
+            params.beginTime = JSON.stringify([
+              moment(params.begin_time[0]).format("YYYY-MM-DD"),
+              moment(params.begin_time[1]).format("YYYY-MM-DD"),
+            ]);
+          } else {
+            params.beginTime = undefined;
+          }
+          if (params.create_time && params.create_time.length) {
+            params.createTime = JSON.stringify([
+              moment(params.create_time[0]).format("YYYY-MM-DD"),
+              moment(params.create_time[1]).format("YYYY-MM-DD"),
+            ]);
+          } else {
+            params.createTime = undefined;
+          }
+          if (params.done_time && params.done_time.length) {
+            params.doneTime = JSON.stringify([
+              moment(params.done_time[0]).format("YYYY-MM-DD"),
+              moment(params.done_time[1]).format("YYYY-MM-DD"),
+            ]);
+          } else {
+            params.doneTime = undefined;
+          }
+          console.log(params);
+          this.$emit("search", params);
+        }
+      });
+    },
+  },
+};
 </script>
 <style lang="less">
-    .task-search {
-        .ant-drawer-body {
-            padding-top: 0 !important;
-        }
+.task-search {
+  .ant-drawer-body {
+    padding-top: 0 !important;
+  }
 
-        .search-content {
-            padding: 0 24px 120px 24px !important;
-        }
+  .search-content {
+    padding: 0 24px 120px 24px !important;
+  }
 
-        .footer {
-            display: flex;
+  .footer {
+    display: flex;
 
-            .ant-btn {
-                flex: 1;
-            }
-        }
+    .ant-btn {
+      flex: 1;
     }
+  }
+}
 
-    .ant-select-selection__choice__content {
-        .task-search-member-item {
-            .ant-avatar {
-                display: none;
-            }
-        }
+.ant-select-selection__choice__content {
+  .task-search-member-item {
+    .ant-avatar {
+      display: none;
     }
+  }
+}
 
-    .task-search-member-item {
-        display: flex;
-        align-items: center;
-
-    }
+.task-search-member-item {
+  display: flex;
+  align-items: center;
+}
 </style>
 
diff --git a/src/components/project/taskTag.vue b/src/components/project/taskTag.vue
index 0d5feb5..9b5c966 100644
--- a/src/components/project/taskTag.vue
+++ b/src/components/project/taskTag.vue
@@ -1,332 +1,347 @@
 <template>
-    <div>
-        <a-tabs class="task-tag-index" tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
-            <a-tab-pane :key="taskTag.code" v-for="taskTag in taskTagList">
-                <div slot="tab">
-                    <div class="tag-item">
-                        <a-badge status="success"
-                                 :class="`badge-${taskTag.color}`"/>
-                        {{taskTag.name}}
-                    </div>
-                </div>
-                <div class="config-content">
-                    <vue-scroll>
-                        <div class="content-item">
-                            <div class="infos">
-                                <a-list :loading="{spinning: loading,delay: 300}">
-                                    <div v-if="showLoadingMore" slot="loadMore"
-                                         :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                                        <a-spin v-if="loadingMore"/>
-                                        <a-button v-else @click="onLoadMore">加载更多</a-button>
-                                    </div>
-                                    <a-list-item :key="index" v-for="(item, index) in list">
-                                        <a-list-item-meta>
-                                            <div class="task-list" slot="title" :class="{'done': item.done}">
-                                                <div>
-                                                    <!--                                                <a-avatar size="small" icon="user" class="m-r-sm"></a-avatar>-->
+  <div>
+    <a-tabs
+      class="task-tag-index"
+      tabPosition="left"
+      defaultActiveKey="1"
+      :animated="false"
+      v-model="tabKey"
+    >
+      <a-tab-pane :key="taskTag.code" v-for="taskTag in taskTagList">
+        <div slot="tab">
+          <div class="tag-item">
+            <a-badge status="success" :class="`badge-${taskTag.color}`" />
+            {{taskTag.name}}
+          </div>
+        </div>
+        <div class="config-content">
+          <vue-scroll>
+            <div class="content-item">
+              <div class="infos">
+                <a-list :loading="{spinning: loading,delay: 300}">
+                  <div
+                    v-if="showLoadingMore"
+                    slot="loadMore"
+                    :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+                  >
+                    <a-spin v-if="loadingMore">
+                      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                    </a-spin>
+                    <a-button v-else @click="onLoadMore">加载更多</a-button>
+                  </div>
+                  <a-list-item :key="index" v-for="(item, index) in list">
+                    <a-list-item-meta>
+                      <div class="task-list" slot="title" :class="{'done': item.done}">
+                        <div>
+                          <!--                                                <a-avatar size="small" icon="user" class="m-r-sm"></a-avatar>-->
 
-                                                    <router-link class="text-default task-content"
-                                                                 :to="`/project/space/task/${code}/detail/${item.code}`">
-                                                        <a-tooltip placement="top"
-                                                                   v-if="item.executor && item.executor.avatar">
-                                                            <template slot="title">
-                                                                <span>{{item.executor.name}}</span>
-                                                            </template>
-                                                            <img
-                                                                    :src="item.executor.avatar"
-                                                                    :title="item.executor.name"
-                                                                    class="avatar task-executor img-circle img-24 hinted m-r-sm">
-                                                        </a-tooltip>
-                                                        <a-avatar size="small" icon="user" class="m-r-sm" v-else></a-avatar>
-                                                        <span class="task-name m-r">{{ item.name }}</span>
-                                                        <span class="muted flex m-r tag-name" v-for="tag in item.tags"
-                                                              :key="tag.code"
-                                                        >
-                                                    <a-badge status="success"
-                                                             :class="`badge-${tag.tag.color} m-r-xs`"/>
-                                                   {{tag.tag.name}}
-                                                </span>
-                                                    </router-link>
-                                                </div>
-                                                <div class="label task-time" :class="showTimeLabel(item.end_time)"
-                                                     v-if="item.end_time">
-                                                    {{showTaskTime(item.begin_time, item.end_time)}}
-                                                </div>
-                                            </div>
-                                        </a-list-item-meta>
-                                    </a-list-item>
-                                </a-list>
-                            </div>
+                          <router-link
+                            class="text-default task-content"
+                            :to="`/project/space/task/${code}/detail/${item.code}`"
+                          >
+                            <a-tooltip placement="top" v-if="item.executor && item.executor.avatar">
+                              <template slot="title">
+                                <span>{{item.executor.name}}</span>
+                              </template>
+                              <img
+                                :src="item.executor.avatar"
+                                :title="item.executor.name"
+                                class="avatar task-executor img-circle img-24 hinted m-r-sm"
+                              />
+                            </a-tooltip>
+                            <a-avatar size="small" icon="user" class="m-r-sm" v-else></a-avatar>
+                            <span class="task-name m-r">{{ item.name }}</span>
+                            <span
+                              class="muted flex m-r tag-name"
+                              v-for="tag in item.tags"
+                              :key="tag.code"
+                            >
+                              <a-badge status="success" :class="`badge-${tag.tag.color} m-r-xs`" />
+                              {{tag.tag.name}}
+                            </span>
+                          </router-link>
                         </div>
-                    </vue-scroll>
-                </div>
-            </a-tab-pane>
-            <div class="m-t text-center" v-if="!loading && !list.length">
-                <strong>
-                    <h2>项目中还没有标签</h2>
-                </strong>
+                        <div
+                          class="label task-time"
+                          :class="showTimeLabel(item.end_time)"
+                          v-if="item.end_time"
+                        >{{showTaskTime(item.begin_time, item.end_time)}}</div>
+                      </div>
+                    </a-list-item-meta>
+                  </a-list-item>
+                </a-list>
+              </div>
             </div>
-        </a-tabs>
-    </div>
-
+          </vue-scroll>
+        </div>
+      </a-tab-pane>
+      <div class="m-t text-center" v-if="!loading && !list.length">
+        <strong>
+          <h2>项目中还没有标签</h2>
+        </strong>
+      </div>
+    </a-tabs>
+  </div>
 </template>
 
 <script>
-    import {checkResponse} from "../../assets/js/utils";
-    import {list, del} from "../../api/taskTag";
-    import pagination from "../../mixins/pagination";
-    import {formatTaskTime, relativelyTaskTime} from "../../assets/js/dateTime";
-    import {getListByTaskTag} from "../../api/task";
-    import moment from "moment";
-
-    export default {
-        name: "taskTag",
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                loading: false,
-                tabKey: '0',
-                project: {},
-                taskTagList: [],
-                list: [],
-                showLoadingMore: false,
-                loadingMore: false,
-            }
-        },
-        watch: {
-            code() {
-                this.init();
-            },
-            tabKey(val) {
-                this.getTaskList();
-            }
+import { checkResponse } from "../../assets/js/utils";
+import { list, del } from "../../api/taskTag";
+import pagination from "../../mixins/pagination";
+import { formatTaskTime, relativelyTaskTime } from "../../assets/js/dateTime";
+import { getListByTaskTag } from "../../api/task";
+import moment from "moment";
 
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                let app = this;
-                this.requestData.projectCode = this.code;
-                app.getTaskTags();
-            },
-            getTaskTags() {
-                let app = this;
-                list(app.requestData).then(res => {
-                    app.taskTagList = res.data;
-                    if (res.data.length) {
-                        app.tabKey = res.data[0].code;
-                    }
-                });
-            },
-            getTaskList(reset = true) {
-                if (!this.tabKey) {
-                    return false;
-                }
-                let app = this;
-                app.loading = true;
-                if (reset) {
-                    this.list = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 10;
-                    this.showLoadingMore = false;
+export default {
+  name: "taskTag",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      loading: false,
+      tabKey: "0",
+      project: {},
+      taskTagList: [],
+      list: [],
+      showLoadingMore: false,
+      loadingMore: false,
+    };
+  },
+  watch: {
+    code() {
+      this.init();
+    },
+    tabKey(val) {
+      this.getTaskList();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      let app = this;
+      this.requestData.projectCode = this.code;
+      app.getTaskTags();
+    },
+    getTaskTags() {
+      let app = this;
+      list(app.requestData).then((res) => {
+        app.taskTagList = res.data;
+        if (res.data.length) {
+          app.tabKey = res.data[0].code;
+        }
+      });
+    },
+    getTaskList(reset = true) {
+      if (!this.tabKey) {
+        return false;
+      }
+      let app = this;
+      app.loading = true;
+      if (reset) {
+        this.list = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 10;
+        this.showLoadingMore = false;
+      }
+      getListByTaskTag({ taskTagCode: this.tabKey }).then((res) => {
+        app.list = app.list.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.list.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.getTaskList(false);
+    },
+    showTaskTime(time, timeEnd) {
+      return formatTaskTime(time, timeEnd);
+    },
+    showTimeLabel(time) {
+      let str = "label-primary";
+      if (time == null) {
+        return str;
+      }
+      let cha = moment(moment(time).format("YYYY-MM-DD")).diff(
+        moment().format("YYYY-MM-DD"),
+        "days"
+      );
+      if (cha < 0) {
+        str = "label-danger";
+      } else if (cha == 0) {
+        str = "label-warning";
+      } else if (cha > 7) {
+        str = "label-normal";
+      }
+      return str;
+    },
+    deleteItem(item, index) {
+      let app = this;
+      switch (this.tabKey) {
+        case "1":
+          this.$confirm({
+            title: "确定彻底删除任务？",
+            content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
+            okText: "彻底删除",
+            okType: "danger",
+            cancelText: "再想想",
+            onOk() {
+              del(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
-                getListByTaskTag({taskTagCode: this.tabKey}).then(res => {
-                    app.list = app.list.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.list.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
             },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.getTaskList(false);
-            },
-            showTaskTime(time, timeEnd) {
-                return formatTaskTime(time, timeEnd);
-            },
-            showTimeLabel(time) {
-                let str = 'label-primary';
-                if (time == null) {
-                    return str;
-                }
-                let cha = moment(moment(time).format("YYYY-MM-DD")).diff(moment().format("YYYY-MM-DD"), 'days');
-                if (cha < 0) {
-                    str = 'label-danger';
-                } else if (cha == 0) {
-                    str = 'label-warning';
-                } else if (cha > 7) {
-                    str = 'label-normal'
+          });
+          break;
+        case "2":
+          this.$confirm({
+            title: "确认彻底删除该文件？",
+            content: `彻底删除文件后，相关的关联资源将会失效。`,
+            okText: "彻底删除",
+            okType: "danger",
+            cancelText: "再想想",
+            onOk() {
+              delFile(item.code).then((res) => {
+                if (!checkResponse(res)) {
+                  return;
                 }
-                return str;
+                app.list.splice(index, 1);
+                app.$emit("update", item);
+              });
+              return Promise.resolve();
             },
-            deleteItem(item, index) {
-                let app = this;
-                switch (this.tabKey) {
-                    case '1':
-                        this.$confirm({
-                            title: '确定彻底删除任务？',
-                            content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
-                            okText: '彻底删除',
-                            okType: 'danger',
-                            cancelText: '再想想',
-                            onOk() {
-                                del(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case '2':
-                        this.$confirm({
-                            title: '确认彻底删除该文件？',
-                            content: `彻底删除文件后，相关的关联资源将会失效。`,
-                            okText: '彻底删除',
-                            okType: 'danger',
-                            cancelText: '再想想',
-                            onOk() {
-                                delFile(item.code).then((res) => {
-                                    if (!checkResponse(res)) {
-                                        return;
-                                    }
-                                    app.list.splice(index, 1);
-                                    app.$emit('update', item);
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                }
-            }
-        }
-    }
+          });
+          break;
+      }
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .task-tag-modal {
-        .ant-modal-body {
-            padding: 0;
-        }
+.task-tag-modal {
+  .ant-modal-body {
+    padding: 0;
+  }
 
-        .ant-modal-body {
-            padding-bottom: 18px;
-
-        }
+  .ant-modal-body {
+    padding-bottom: 18px;
+  }
 
-        .ant-modal-body, .ant-tabs, .ant-tabs-bar {
-            height: 84vh;
-            min-width: 180px;
+  .ant-modal-body,
+  .ant-tabs,
+  .ant-tabs-bar {
+    height: 84vh;
+    min-width: 180px;
 
-            .ant-tabs-tab {
-                padding: 12px 24px;
-                font-size: 16px;
-            }
-        }
+    .ant-tabs-tab {
+      padding: 12px 24px;
+      font-size: 16px;
+    }
+  }
 
-        .ant-tabs-nav-wrap {
-            padding-top: 10px;
-        }
+  .ant-tabs-nav-wrap {
+    padding-top: 10px;
+  }
 
-        .ant-tabs-left-content {
-            padding-top: 6px;
-            padding-right: 12px;
-        }
+  .ant-tabs-left-content {
+    padding-top: 6px;
+    padding-right: 12px;
+  }
 
-        .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
-            text-align: left;
-        }
+  .ant-tabs .ant-tabs-left-bar .ant-tabs-tab {
+    text-align: left;
+  }
 
-        .config-content {
-            height: 80vh;
+  .config-content {
+    height: 80vh;
 
-            .content-item {
-                display: flex;
-                justify-content: space-between;
-                flex: 1 1;
-                margin-bottom: 24px;
-                padding-right: 12px;
+    .content-item {
+      display: flex;
+      justify-content: space-between;
+      flex: 1 1;
+      margin-bottom: 24px;
+      padding-right: 12px;
 
-                .infos {
-                    width: 100%;
-                    padding-right: 12px;
+      .infos {
+        width: 100%;
+        padding-right: 12px;
 
-                    p {
-                        margin-bottom: 6px;
-                    }
+        p {
+          margin-bottom: 6px;
+        }
 
-                    .item-title {
-                        font-size: 16px;
-                    }
+        .item-title {
+          font-size: 16px;
+        }
 
-                    .item-tips {
-                        margin-bottom: 12px;
-                    }
-                }
-            }
+        .item-tips {
+          margin-bottom: 12px;
         }
+      }
     }
+  }
+}
 
-    .task-tag-index {
-        .tag-item {
-            display: flex;
-
-            .ant-badge-status-dot {
-                width: 8px;
-                height: 8px;
-            }
-        }
+.task-tag-index {
+  .tag-item {
+    display: flex;
 
-        .config-content {
-            text-decoration: none;
+    .ant-badge-status-dot {
+      width: 8px;
+      height: 8px;
+    }
+  }
 
-            .task-list {
-                display: flex;
-                align-items: center;
-                justify-content: space-between;
+  .config-content {
+    text-decoration: none;
 
-                &.done {
-                    .task-name {
-                        color: #A6A6A6;
-                        text-decoration: line-through;
-                    }
-                }
-            }
+    .task-list {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
 
-            .task-content {
-                /*display: flex;*/
-                /*align-items: inherit;*/
-                text-decoration: none;
-            }
+      &.done {
+        .task-name {
+          color: #a6a6a6;
+          text-decoration: line-through;
+        }
+      }
+    }
 
-            .tag-name {
-                display: inline-block;
-            }
+    .task-content {
+      /*display: flex;*/
+      /*align-items: inherit;*/
+      text-decoration: none;
+    }
 
+    .tag-name {
+      display: inline-block;
+    }
 
-            .task-executor {
-                width: 24px !important;
-                height: 24px !important;
-            }
+    .task-executor {
+      width: 24px !important;
+      height: 24px !important;
+    }
 
-            .task-name {
-                /*line-height: 1px;*/
-            }
-        }
+    .task-name {
+      /*line-height: 1px;*/
     }
+  }
+}
 </style>
diff --git a/src/components/project/taskTagMenu.vue b/src/components/project/taskTagMenu.vue
index 7285529..2e62449 100644
--- a/src/components/project/taskTagMenu.vue
+++ b/src/components/project/taskTagMenu.vue
@@ -1,304 +1,343 @@
 <template>
-    <div class="member-menu" :class="{'creating': creating,'editing': editing}">
-        <a-spin :spinning="listLoading">
-            <div class="search-content">
-                <a-input v-model="keyword" size="large" :placeholder="(creating || editing) ? '标签名称': '搜索标签'">
-                    <a-icon slot="prefix" type="search" v-if="!creating && !editing"/>
-                    <a-icon slot="prefix" type="tag" v-else/>
-                </a-input>
+  <div class="member-menu" :class="{'creating': creating,'editing': editing}">
+    <a-spin :spinning="listLoading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+      <div class="search-content">
+        <a-input
+          v-model="keyword"
+          size="large"
+          :placeholder="(creating || editing) ? '标签名称': '搜索标签'"
+        >
+          <a-icon slot="prefix" type="search" v-if="!creating && !editing" />
+          <a-icon slot="prefix" type="tag" v-else />
+        </a-input>
+      </div>
+      <div class="member-list tag-list">
+        <template v-if="!creating && !editing">
+          <vue-scroll>
+            <div class="list-group">
+              <a-list
+                class="list-content"
+                itemLayout="horizontal"
+                :dataSource="list"
+                v-show="list.length"
+              >
+                <a-list-item
+                  class="member-list-item"
+                  slot="renderItem"
+                  slot-scope="item,index"
+                  @click.native="setTag(item)"
+                >
+                  <span slot="actions">
+                    <a class="tag-edit muted">
+                      <a-icon type="edit" @click.stop="editTag(item,index)"></a-icon>
+                    </a>
+                    <a-icon type="check" class="m-l-sm" v-show="showCheck(item)"></a-icon>
+                  </span>
+                  <a-list-item-meta>
+                    <span class="tag-title" slot="title">
+                      <a-badge status="success" :class="`badge-${item.color}`" />
+                      {{item.name}}
+                    </span>
+                  </a-list-item-meta>
+                </a-list-item>
+              </a-list>
             </div>
-            <div class="member-list tag-list">
-                <template v-if="!creating && !editing">
-                    <vue-scroll>
-                        <div class="list-group">
-                            <a-list
-                                    class="list-content"
-                                    itemLayout="horizontal"
-                                    :dataSource="list"
-                                    v-show="list.length"
-
-                            >
-                                <a-list-item class="member-list-item" slot="renderItem" slot-scope="item,index"
-                                             @click.native="setTag(item)">
-                                    <span slot="actions">
-                                       <a class="tag-edit muted">
-                                            <a-icon type="edit"
-                                                    @click.stop="editTag(item,index)"></a-icon>
-                                       </a>
-                                        <a-icon type="check" class="m-l-sm" v-show="showCheck(item)"></a-icon>
-                                     </span>
-                                    <a-list-item-meta>
-                                    <span class="tag-title" slot="title"> <a-badge status="success" :class="`badge-${item.color}`"/> {{item.name}}</span>
-                                    </a-list-item-meta>
-                                </a-list-item>
-                            </a-list>
-                        </div>
-                    </vue-scroll>
-                </template>
-                <template v-if="creating || editing">
-                    <div class="tag-badge">
-                        <span class="badge-item" v-for="badge in badgeList" :key="badge" @click="currentBadge = badge">
-                            <a-badge status="success"
-                                     :class="`badge-${badge}`"/>
-                            <a-icon type="check" v-show="currentBadge == badge"/>
-                        </span>
-                    </div>
-                </template>
-
-            </div>
-            <div class="footer">
-                <template v-if="creating">
-                    <a-button type="default" size="large" @click="creating = false,keyword = ''">取消</a-button>
-                    <a-button type="primary" :disabled="!keyword" size="large" @click="createTag">创建</a-button>
-                </template>
-                <template v-else-if="editing">
-                    <a-popconfirm :overlayStyle="{zIndex: '1080'}" title="确认删除标签？" okText="确定" cancelText="取消"
-                                  @confirm="deleteTag">
-                        <a-button type="danger" size="large">删除</a-button>
-                    </a-popconfirm>
-                    <a-button type="primary" :disabled="!keyword" size="large" @click="saveTag">完成</a-button>
-                </template>
-                <template v-else>
-                    <a-button type="primary" size="large" block @click="creating = true,activeCreating = true">新建标签
-                    </a-button>
-                </template>
-            </div>
-        </a-spin>
-    </div>
+          </vue-scroll>
+        </template>
+        <template v-if="creating || editing">
+          <div class="tag-badge">
+            <span
+              class="badge-item"
+              v-for="badge in badgeList"
+              :key="badge"
+              @click="currentBadge = badge"
+            >
+              <a-badge status="success" :class="`badge-${badge}`" />
+              <a-icon type="check" v-show="currentBadge == badge" />
+            </span>
+          </div>
+        </template>
+      </div>
+      <div class="footer">
+        <template v-if="creating">
+          <a-button type="default" size="large" @click="creating = false,keyword = ''">取消</a-button>
+          <a-button type="primary" :disabled="!keyword" size="large" @click="createTag">创建</a-button>
+        </template>
+        <template v-else-if="editing">
+          <a-popconfirm
+            :overlayStyle="{zIndex: '1080'}"
+            title="确认删除标签？"
+            okText="确定"
+            cancelText="取消"
+            @confirm="deleteTag"
+          >
+            <a-button type="danger" size="large">删除</a-button>
+          </a-popconfirm>
+          <a-button type="primary" :disabled="!keyword" size="large" @click="saveTag">完成</a-button>
+        </template>
+        <template v-else>
+          <a-button
+            type="primary"
+            size="large"
+            block
+            @click="creating = true,activeCreating = true"
+          >新建标签</a-button>
+        </template>
+      </div>
+    </a-spin>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import {del, edit, list, save} from "../../api/taskTag";
-    import {setTag, taskToTags} from "../../api/task";
-    import {checkResponse} from "../../assets/js/utils";
+import _ from "lodash";
+import { del, edit, list, save } from "../../api/taskTag";
+import { setTag, taskToTags } from "../../api/task";
+import { checkResponse } from "../../assets/js/utils";
 
-    export default {
-        name: "taskTagMenu",
-        props: {
-            projectCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            },
-            taskCode: {
-                type: [String, Number],
-                default() {
-                    return ''
-                }
-            },
-            isCommit: {//选择后是否提交
-                type: [Boolean],
-                default() {
-                    return true
-                }
-            },
-        },
-        data() {
-            return {
-                keyword: '',
-                editing: false, //编辑标签状态
-                creating: false, //创建标签状态
-                activeCreating: false,//是否手动发起的创建（搜索结果为空时，也会发起创建，但不属于手动发起）
-                searching: false,
-                listLoading: false,
-                showInviteMember: false,
-                tags: [],
-                list: [],
-                listTemp: [],
-                badgeList: ['blue', 'red', 'orange', 'green', 'brown', 'purple'],
-                currentBadge: 'blue',
-                currentTag: {
-                    tag: null,
-                    index: -1,
-                },
-            };
-        },
-        created() {
-            this.init();
-        },
-        watch: {
-            keyword() {
-                this.search();
-            }
-        },
-        methods: {
-            init() {
-                if (this.projectCode) {
-                    this.listLoading = true;
-                    list({projectCode: this.projectCode}).then(res => {
-                        this.list = res.data;
-                        this.listTemp = res.data;
-                        this.listLoading = false;
-                    });
-                }
-                if (this.taskCode) {
-                    taskToTags({taskCode: this.taskCode}).then(res => {
-                        this.tags = res.data;
-                    });
-                }
-            },
-            showCheck(tag) {
-                const index = this.tags.findIndex(item => item.tag_code == tag.code)
-                if (index !== -1) {
-                    return true;
-                }
-            },
-            checkTaskChange(tag) {
-                const index = this.tags.findIndex(item => item.tag_code == tag.code)
-                if (index !== -1) {
-                    this.tags.splice(index, 1);
-                } else {
-                    this.tags.push({
-                        tag_code: tag.code
-                    });
-                }
-            },
-            editTag(tag, index) {
-                this.editing = true;
-                this.keyword = tag.name;
-                this.currentBadge = tag.color;
-                this.currentTag.tag = tag;
-                this.currentTag.index = index;
-            },
-            saveTag() {
-                edit({name: this.keyword, color: this.currentBadge, tagCode: this.currentTag.tag.code}).then(res => {
-                    if (!checkResponse(res)) {
-                        return false;
-                    }
-                    this.currentTag.tag.name = this.listTemp[this.currentTag.index].name = this.keyword;
-                    this.currentTag.tag.color = this.listTemp[this.currentTag.index].color = this.currentBadge;
-                    this.$emit('update', this.currentTag.tag);
-                    this.clearCreating();
-                });
-            },
-            deleteTag() {
-                del(this.currentTag.tag.code).then(res => {
-                    if (!checkResponse(res)) {
-                        return false;
-                    }
-                    this.listTemp.splice(this.currentTag.index, 1);
-                    this.$emit('delete', this.currentTag.tag);
-                    this.clearCreating();
-                });
-            },
-            setTag(tag) {
-                this.checkTaskChange(tag);
-                if (this.isCommit) {
-                    setTag({taskCode: this.taskCode, tagCode: tag.code}).then(() => {
-                        this.$emit('change', tag)
-                    });
-                } else {
-                    this.$emit('change', tag)
-                }
-            },
-            createTag() {
-                save({projectCode: this.projectCode, name: this.keyword, color: this.currentBadge}).then(res => {
-                    if (!checkResponse(res)) {
-                        return false;
-                    }
-                    const tag = res.data;
-                    this.listTemp.push(tag);
-                    this.list.push(tag);
-                    this.checkTaskChange(tag);
-                    setTag({taskCode: this.taskCode, tagCode: tag.code}).then(() => {
-                        this.$emit('change', tag);
-                        this.clearCreating();
-                    });
-                });
-            },
-            clearCreating() {
-                this.editing = false;
-                this.creating = false;
-                this.activeCreating = false;
-                this.keyword = '';
-            },
-            search() {
-                this.keyword = this.keyword.trim();
-                if (!this.keyword) {
-                    this.list = JSON.parse(JSON.stringify(this.listTemp));
-                    if (!this.activeCreating) {//如果不是手动发起的创建，则返回搜索结果
-                        this.creating = false;
-                    }
-                }
-                this.searching = true;
-                this.list = this.list.filter(item => item.name.indexOf(this.keyword) != -1);
-                if (!this.list.length && !this.editing) {
-                    this.creating = true;
-                }
-            },
+export default {
+  name: "taskTagMenu",
+  props: {
+    projectCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+    taskCode: {
+      type: [String, Number],
+      default() {
+        return "";
+      },
+    },
+    isCommit: {
+      //选择后是否提交
+      type: [Boolean],
+      default() {
+        return true;
+      },
+    },
+  },
+  data() {
+    return {
+      keyword: "",
+      editing: false, //编辑标签状态
+      creating: false, //创建标签状态
+      activeCreating: false, //是否手动发起的创建（搜索结果为空时，也会发起创建，但不属于手动发起）
+      searching: false,
+      listLoading: false,
+      showInviteMember: false,
+      tags: [],
+      list: [],
+      listTemp: [],
+      badgeList: ["blue", "red", "orange", "green", "brown", "purple"],
+      currentBadge: "blue",
+      currentTag: {
+        tag: null,
+        index: -1,
+      },
+    };
+  },
+  created() {
+    this.init();
+  },
+  watch: {
+    keyword() {
+      this.search();
+    },
+  },
+  methods: {
+    init() {
+      if (this.projectCode) {
+        this.listLoading = true;
+        list({ projectCode: this.projectCode }).then((res) => {
+          this.list = res.data;
+          this.listTemp = res.data;
+          this.listLoading = false;
+        });
+      }
+      if (this.taskCode) {
+        taskToTags({ taskCode: this.taskCode }).then((res) => {
+          this.tags = res.data;
+        });
+      }
+    },
+    showCheck(tag) {
+      const index = this.tags.findIndex((item) => item.tag_code == tag.code);
+      if (index !== -1) {
+        return true;
+      }
+    },
+    checkTaskChange(tag) {
+      const index = this.tags.findIndex((item) => item.tag_code == tag.code);
+      if (index !== -1) {
+        this.tags.splice(index, 1);
+      } else {
+        this.tags.push({
+          tag_code: tag.code,
+        });
+      }
+    },
+    editTag(tag, index) {
+      this.editing = true;
+      this.keyword = tag.name;
+      this.currentBadge = tag.color;
+      this.currentTag.tag = tag;
+      this.currentTag.index = index;
+    },
+    saveTag() {
+      edit({
+        name: this.keyword,
+        color: this.currentBadge,
+        tagCode: this.currentTag.tag.code,
+      }).then((res) => {
+        if (!checkResponse(res)) {
+          return false;
         }
-    }
+        this.currentTag.tag.name = this.listTemp[
+          this.currentTag.index
+        ].name = this.keyword;
+        this.currentTag.tag.color = this.listTemp[
+          this.currentTag.index
+        ].color = this.currentBadge;
+        this.$emit("update", this.currentTag.tag);
+        this.clearCreating();
+      });
+    },
+    deleteTag() {
+      del(this.currentTag.tag.code).then((res) => {
+        if (!checkResponse(res)) {
+          return false;
+        }
+        this.listTemp.splice(this.currentTag.index, 1);
+        this.$emit("delete", this.currentTag.tag);
+        this.clearCreating();
+      });
+    },
+    setTag(tag) {
+      this.checkTaskChange(tag);
+      if (this.isCommit) {
+        setTag({ taskCode: this.taskCode, tagCode: tag.code }).then(() => {
+          this.$emit("change", tag);
+        });
+      } else {
+        this.$emit("change", tag);
+      }
+    },
+    createTag() {
+      save({
+        projectCode: this.projectCode,
+        name: this.keyword,
+        color: this.currentBadge,
+      }).then((res) => {
+        if (!checkResponse(res)) {
+          return false;
+        }
+        const tag = res.data;
+        this.listTemp.push(tag);
+        this.list.push(tag);
+        this.checkTaskChange(tag);
+        setTag({ taskCode: this.taskCode, tagCode: tag.code }).then(() => {
+          this.$emit("change", tag);
+          this.clearCreating();
+        });
+      });
+    },
+    clearCreating() {
+      this.editing = false;
+      this.creating = false;
+      this.activeCreating = false;
+      this.keyword = "";
+    },
+    search() {
+      this.keyword = this.keyword.trim();
+      if (!this.keyword) {
+        this.list = JSON.parse(JSON.stringify(this.listTemp));
+        if (!this.activeCreating) {
+          //如果不是手动发起的创建，则返回搜索结果
+          this.creating = false;
+        }
+      }
+      this.searching = true;
+      this.list = this.list.filter(
+        (item) => item.name.indexOf(this.keyword) != -1
+      );
+      if (!this.list.length && !this.editing) {
+        this.creating = true;
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    .creating, .editing {
-        &.member-menu {
-            height: 190px;
+.creating,
+.editing {
+  &.member-menu {
+    height: 190px;
 
-            .member-list {
-                height: auto;
-            }
-        }
+    .member-list {
+      height: auto;
+    }
+  }
 
-        .footer {
-            display: flex;
-            justify-content: space-between;
+  .footer {
+    display: flex;
+    justify-content: space-between;
 
-            .ant-btn {
-                flex: 1;
+    .ant-btn {
+      flex: 1;
 
-                &:first-child {
-                    margin-right: 6px;
-                }
-            }
-        }
+      &:first-child {
+        margin-right: 6px;
+      }
     }
+  }
+}
 
-    .tag-list {
-        .tag-title {
-            display: flex;
-            align-items: center;
+.tag-list {
+  .tag-title {
+    display: flex;
+    align-items: center;
 
-            .ant-badge-status-dot {
-                width: 7px;
-                height: 7px;
-            }
-        }
+    .ant-badge-status-dot {
+      width: 7px;
+      height: 7px;
+    }
+  }
 
-        .tag-badge {
-            display: flex;
-            justify-content: space-between;
-            margin: 6px 12px 12px 12px;
+  .tag-badge {
+    display: flex;
+    justify-content: space-between;
+    margin: 6px 12px 12px 12px;
 
-            .badge-item {
-                position: relative;
+    .badge-item {
+      position: relative;
 
-                .ant-badge-status-dot {
-                    width: 25px;
-                    height: 25px;
-                    cursor: pointer;
-                }
+      .ant-badge-status-dot {
+        width: 25px;
+        height: 25px;
+        cursor: pointer;
+      }
 
-                .anticon {
-                    position: absolute;
-                    left: 5px;
-                    top: 5px;
-                    color: #fff;
-                }
-            }
-        }
+      .anticon {
+        position: absolute;
+        left: 5px;
+        top: 5px;
+        color: #fff;
+      }
+    }
+  }
 
-        .tag-edit {
-            visibility: hidden;
-        }
+  .tag-edit {
+    visibility: hidden;
+  }
 
-        .member-list-item {
-            &:hover {
-                .tag-edit {
-                    visibility: visible;
-                }
-            }
-        }
+  .member-list-item {
+    &:hover {
+      .tag-edit {
+        visibility: visible;
+      }
     }
+  }
+}
 </style>
diff --git a/src/components/project/versionDetail.vue b/src/components/project/versionDetail.vue
index 0ce4fbc..787ace8 100644
--- a/src/components/project/versionDetail.vue
+++ b/src/components/project/versionDetail.vue
@@ -1,6 +1,7 @@
 <template>
   <div class="version-detail">
     <a-spin class="version-detail-spin" :spinning="loading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
       <div class="task-header">
         <span class="head-title">
           <span>{{version.featureName}}</span>
diff --git a/src/components/tools/VUploader.vue b/src/components/tools/VUploader.vue
index 40cdf19..82d4b55 100644
--- a/src/components/tools/VUploader.vue
+++ b/src/components/tools/VUploader.vue
@@ -1,377 +1,403 @@
 <template>
-    <div class="v-uploader" :class="{'hidden-files': !showFiles,'hidden-uploader': !showUploader}">
-        <a-card :title="uploaderTitle">
-            <div class="actions" slot="extra">
-                <a class="muted action-item" @click="showFiles = !showFiles">
-                    <a-icon type="shrink" v-show="showFiles"/>
-                    <a-icon type="arrows-alt" v-show="!showFiles"/>
-                </a>
-                <a class="muted action-item" @click="closeUploader">
-                    <a-icon type="close"/>
-                </a>
-            </div>
-            <uploader ref="uploader"
-                      :options="options"
-                      :autoStart="autoStart"
-                      @files-submitted="filesSubmitted"
-                      @file-progress="fileProgress"
-                      @file-success="fileSuccess"
-                      @file-error="fileError"
-                      @file-complete="fileComplete"
-                      @complete="complete"
-                      class="uploader-workplace">
-                <vue-scroll>
-                    <!--<a-button @click="testSomeThing">测试</a-button>-->
-                    <!--<uploader-unsupport></uploader-unsupport>-->
-                    <!--<uploader-btn>select files</uploader-btn>-->
-                    <!--<uploader-drop>
+  <div class="v-uploader" :class="{'hidden-files': !showFiles,'hidden-uploader': !showUploader}">
+    <a-card :title="uploaderTitle">
+      <div class="actions" slot="extra">
+        <a class="muted action-item" @click="showFiles = !showFiles">
+          <a-icon type="shrink" v-show="showFiles" />
+          <a-icon type="arrows-alt" v-show="!showFiles" />
+        </a>
+        <a class="muted action-item" @click="closeUploader">
+          <a-icon type="close" />
+        </a>
+      </div>
+      <uploader
+        ref="uploader"
+        :options="options"
+        :autoStart="autoStart"
+        @files-submitted="filesSubmitted"
+        @file-progress="fileProgress"
+        @file-success="fileSuccess"
+        @file-error="fileError"
+        @file-complete="fileComplete"
+        @complete="complete"
+        class="uploader-workplace"
+      >
+        <vue-scroll>
+          <!--<a-button @click="testSomeThing">测试</a-button>-->
+          <!--<uploader-unsupport></uploader-unsupport>-->
+          <!--<uploader-btn>select files</uploader-btn>-->
+          <!--<uploader-drop>
                         <p>Drop files here to upload or</p>
                         <uploader-btn>select files</uploader-btn>
                         <uploader-btn :attrs="attrs">select images</uploader-btn>
                         <uploader-btn :directory="true">select folder</uploader-btn>
-                    </uploader-drop>-->
-                    <uploader-list>
-                        <template slot-scope="files">
-                            <ul class="uploader-wrapper">
-                                <uploader-file :key="file.id" :file="file" :list="true"
-                                               v-for="file in files.fileList">
-                                    <template slot-scope="file">
-                                        <li class="uploader-item">
-                                            <div class="item-content">
-                                                <div class="item-info">
-                                                    <div class="file-item">
-                                                        <div class="file-icon">
-                                                            <a-avatar icon="link" shape="square"
-                                                                      :src="file.file.fileUrl"/>
-                                                        </div>
-                                                        <div class="file-info">
-                                                            <div class="file-content">
-                                                                <div class="file-title">
-                                                                    <a-tooltip placement="top" :mouseEnterDelay="0.3"
-                                                                               :title="file.file.name">
-                                                                        {{file.file.name}}
-                                                                    </a-tooltip>
-                                                                </div>
-                                                                <div class="file-extra">
-                                                                    <span>{{file.file.projectName ? file.file.projectName : tempData.projectName}}</span>
-                                                                    <span v-if="file.status == 'success'">({{file.formatedSize }})</span>
-                                                                    <span v-else>({{(Number(file.uploadedSize) / (1024 * 1000)).toFixed(2) }}MB/{{file.formatedSize }})</span>
-                                                                </div>
-                                                            </div>
-                                                            <div class="uploader-progress"
-                                                                 v-show="file.status != 'success'">
-                                                                <a-progress :strokeWidth="2" :showInfo="false"
-                                                                            :percent="file.progress * 100"/>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                </div>
-                                                <div class="item-status">
-                                                    <a class="muted" @click="cancelUpload(file)">
-                                                        <a-icon type="close" v-show="file.status != 'success'"/>
-                                                    </a>
-                                                    <a-icon class="text-success" type="check"
-                                                            v-show="file.status == 'success'"/>
-                                                </div>
-                                            </div>
-                                        </li>
-                                    </template>
-                                </uploader-file>
-                            </ul>
-                        </template>
-                    </uploader-list>
-                    <!--<uploader-files>
-                    </uploader-files>-->
-                </vue-scroll>
-            </uploader>
-        </a-card>
-    </div>
+          </uploader-drop>-->
+          <uploader-list>
+            <template slot-scope="files">
+              <ul class="uploader-wrapper">
+                <uploader-file
+                  :key="file.id"
+                  :file="file"
+                  :list="true"
+                  v-for="file in files.fileList"
+                >
+                  <template slot-scope="file">
+                    <li class="uploader-item">
+                      <div class="item-content">
+                        <div class="item-info">
+                          <div class="file-item">
+                            <div class="file-icon">
+                              <a-avatar icon="link" shape="square" :src="file.file.fileUrl" />
+                            </div>
+                            <div class="file-info">
+                              <div class="file-content">
+                                <div class="file-title">
+                                  <a-tooltip
+                                    placement="top"
+                                    :mouseEnterDelay="0.3"
+                                    :title="file.file.name"
+                                  >{{file.file.name}}</a-tooltip>
+                                </div>
+                                <div class="file-extra">
+                                  <span
+                                    v-if="file.file.projectName"
+                                  >{{file.file.projectName ? file.file.projectName : tempData.projectName}}</span>
+                                  <span v-else>公共文件</span>
+                                  <span v-if="file.status == 'success'">({{file.formatedSize }})</span>
+                                  <span
+                                    v-else
+                                  >({{(Number(file.uploadedSize) / (1024 * 1000)).toFixed(2) }}MB/{{file.formatedSize }})</span>
+                                </div>
+                              </div>
+                              <div class="uploader-progress" v-show="file.status != 'success'">
+                                <a-progress
+                                  :strokeWidth="2"
+                                  :showInfo="false"
+                                  :percent="file.progress * 100"
+                                />
+                              </div>
+                            </div>
+                          </div>
+                        </div>
+                        <div class="item-status">
+                          <a class="muted" @click="cancelUpload(file)">
+                            <a-icon type="close" v-show="file.status != 'success'" />
+                          </a>
+                          <a-icon
+                            class="text-success"
+                            type="check"
+                            v-show="file.status == 'success'"
+                          />
+                        </div>
+                      </div>
+                    </li>
+                  </template>
+                </uploader-file>
+              </ul>
+            </template>
+          </uploader-list>
+          <!--<uploader-files>
+          </uploader-files>-->
+        </vue-scroll>
+      </uploader>
+    </a-card>
+  </div>
 </template>
 
 <script>
-    import {checkResponse, getApiUrl, getAuthorization} from "../../assets/js/utils";
-    import {mapState} from 'vuex'
-    import {getStore} from "../../assets/js/storage";
-    import {notice} from "../../assets/js/notice";
-    import {uploadFiles} from "../../api/file";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+} from "../../assets/js/utils";
+import { mapState } from "vuex";
+import { getStore } from "../../assets/js/storage";
+import { notice } from "../../assets/js/notice";
+import { uploadFiles } from "../../api/file";
 
-    export default {
-        name: "v-uploader",
-        props: {
-            code: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
-        },
-        data() {
-            return {
-                loading: false,
-                showFiles: false, //显示上传文件
-                showUploader: false,//显示上传窗口
-                progressTotal: 0, //上传中的文件数
-                completeTotal: 0, //已完成的文件数
-                options: {
-                    target: uploadFiles,
-                    testChunks: false,
-                    query: function () {
-                        return getStore('tempData', true);//query暂时无法动态响应
-                    },
-                    headers: function () {
-                        let organization = getStore('currentOrganization', true);
-                        const auth = getAuthorization();
-                        auth.organizationcode = organization.code;
-                        return auth;
-                    },
-                },
-                attrs: {
-                    accept: 'image/*'
-                },
-                autoStart: true,
-            }
-        },
-        computed: {
-            ...mapState({
-                uploader: state => state.common.uploader,
-                tempData: state => state.common.tempData,
-            }),
-            uploaderTitle() {
-                if (!this.progressTotal) {
-                    return '上传完成';
-                }
-                let current = this.completeTotal + 1;
-                if (current > this.progressTotal) {
-                    current = this.progressTotal;
-                }
-                return `正在上传 ${current}/${this.progressTotal}`;
-            }
-        },
-        watch: {
-            code() {
-                this.init();
-            },
+export default {
+  name: "v-uploader",
+  props: {
+    code: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      showFiles: false, //显示上传文件
+      showUploader: false, //显示上传窗口
+      progressTotal: 0, //上传中的文件数
+      completeTotal: 0, //已完成的文件数
+      options: {
+        target: uploadFiles,
+        testChunks: false,
+        query: function () {
+          return getStore("tempData", true); //query暂时无法动态响应
         },
-        created() {
-            this.init();
+        headers: function () {
+          let organization = getStore("currentOrganization", true);
+          const auth = getAuthorization();
+          auth.organizationcode = organization.code;
+          return auth;
         },
-        mounted() {
-            this.$nextTick(() => {
-                window.uploader = this.$refs.uploader.uploader;
-                this.$store.dispatch('setUploader', window.uploader);
-                console.log(window.uploader);
-            })
-        },
-        methods: {
-            init() {
-
-            },
-            closeUploader() {//关闭上传窗口
-                this.showUploader = false;
-                this.uploader.cancel();
-            },
-            filesSubmitted(files) { //添加上传文件
-                // this.$refs.uploader.uploader.opts.query = this.tempData;
-                this.showUploader = true;
-                this.showFiles = true;
-                this.progressTotal += files.length;
-                console.log('file submitted', files)
-
-            },
-            fileProgress(rootFile, file, chunk) { //有文件上传中
-                this.showUploader = true;
-                this.showFiles = true;
-                console.log('file progress', arguments)
-            },
-            fileSuccess(rootFile, file, message, chunk) { //一个文件上传成功
-                const response = JSON.parse(message);
-                if (!checkResponse(response)) {
-                    notice({title: response.msg}, 'notice', 'error');
-                    return false;
-                }
-                rootFile.projectName = response.data.projectName;
-                rootFile.fileUrl = response.data.url;
-                console.log('file success', rootFile);
-                this.completeTotal++;
-            },
-            fileError(rootFile, file, message, chunk) { //一个文件上传失败                this.progressTotal--;
-                this.completeTotal--;
-                const response = JSON.parse(message);
-                file.cancel();
-                rootFile.projectName = response.data.projectName;
-                console.log('file error', rootFile);
-                notice({title: response.msg}, 'notice', 'error');
-            },
-            fileComplete(rootFile) { //一个文件上传完成
-                console.log('file complete', rootFile);
-            },
-            complete() { //所有文件上传完成
-                console.log('complete', arguments);
-                this.progressTotal = this.completeTotal = 0;
-                notice({title: '关联文件成功'}, 'notice', 'success');
-                setTimeout(() => {
-                    this.showFiles = false;
-                }, 3000);
-            },
-            cancelUpload(file) {
-                console.log(file);
-                this.progressTotal--;
-                this.completeTotal--;
-                file.file.cancel();
-            },
-            filterList(list) {
-                return list;
-                return list.reverse();
-            },
-            testSomeThing() {
-                console.log(this.uploader.fileList);
-                this.uploader.fileList[0].resume();
-            },
-        }
-    }
+      },
+      attrs: {
+        accept:
+          "image/*,video/*,audio/*,text/*,Model/*,drawing/*,application/*",
+      },
+      autoStart: true,
+    };
+  },
+  computed: {
+    ...mapState({
+      uploader: (state) => state.common.uploader,
+      tempData: (state) => state.common.tempData,
+    }),
+    uploaderTitle() {
+      if (!this.progressTotal) {
+        return "上传完成";
+      }
+      let current = this.completeTotal + 1;
+      if (current > this.progressTotal) {
+        current = this.progressTotal;
+      }
+      return `正在上传 ${current}/${this.progressTotal}`;
+    },
+  },
+  watch: {
+    code() {
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+  },
+  mounted() {
+    this.$nextTick(() => {
+      window.uploader = this.$refs.uploader.uploader;
+      this.$store.dispatch("setUploader", window.uploader);
+      console.log(window.uploader);
+    });
+  },
+  methods: {
+    init() {},
+    closeUploader() {
+      //关闭上传窗口
+      this.showUploader = false;
+      this.uploader.cancel();
+    },
+    filesSubmitted(files) {
+      //添加上传文件
+      // this.$refs.uploader.uploader.opts.query = this.tempData;
+      this.showUploader = true;
+      this.showFiles = true;
+      this.progressTotal += files.length;
+      console.log("file submitted", files);
+    },
+    fileProgress(rootFile, file, chunk) {
+      //有文件上传中
+      this.showUploader = true;
+      this.showFiles = true;
+      console.log("file progress", arguments);
+    },
+    fileSuccess(rootFile, file, message, chunk) {
+      //一个文件上传成功
+      const response = JSON.parse(message);
+      if (!checkResponse(response)) {
+        notice({ title: response.msg }, "notice", "error");
+        return false;
+      }
+      rootFile.projectName = response.data.projectName;
+      rootFile.fileUrl = response.data.url;
+      console.log("file success", rootFile);
+      this.completeTotal++;
+    },
+    fileError(rootFile, file, message, chunk) {
+      //一个文件上传失败                this.progressTotal--;
+      this.completeTotal--;
+      const response = JSON.parse(message);
+      file.cancel();
+      rootFile.projectName = response.data.projectName;
+      console.log("file error", rootFile);
+      notice({ title: response.msg }, "notice", "error");
+    },
+    fileComplete(rootFile) {
+      //一个文件上传完成
+      console.log("file complete", rootFile);
+    },
+    complete() {
+      //所有文件上传完成
+      console.log("complete", arguments);
+      this.progressTotal = this.completeTotal = 0;
+      notice({ title: "关联文件成功" }, "notice", "success");
+      setTimeout(() => {
+        this.showFiles = false;
+      }, 3000);
+    },
+    cancelUpload(file) {
+      console.log(file);
+      this.progressTotal--;
+      this.completeTotal--;
+      file.file.cancel();
+    },
+    filterList(list) {
+      return list;
+      return list.reverse();
+    },
+    testSomeThing() {
+      console.log(this.uploader.fileList);
+      this.uploader.fileList[0].resume();
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    @import "~ant-design-vue/lib/style/themes/default";
+@import "~ant-design-vue/lib/style/themes/default";
 
-    .v-uploader {
-        position: fixed;
-        bottom: 12px;
-        right: 24px;
-        width: 485px;
-        z-index: 1001;
-        box-shadow: 0 7px 21px rgba(0, 0, 0, .1);
-        transition: bottom 218ms ease;
+.v-uploader {
+  position: fixed;
+  bottom: 12px;
+  right: 24px;
+  width: 485px;
+  z-index: 1001;
+  box-shadow: 0 7px 21px rgba(0, 0, 0, 0.1);
+  transition: bottom 218ms ease;
 
-        .ant-card {
-            box-shadow: 0 7px 21px rgba(0, 0, 0, .1);
-
-            .ant-card-head {
-                margin-bottom: 0;
-                border-bottom: 1px solid #e1e1e1;
-            }
+  .ant-card {
+    box-shadow: 0 7px 21px rgba(0, 0, 0, 0.1);
 
-            .ant-card-head-title, .ant-card-extra {
-                padding: 12px 0;
-            }
-
-            .ant-card-body {
-                padding: 0;
-            }
-        }
+    .ant-card-head {
+      margin-bottom: 0;
+      border-bottom: 1px solid #e1e1e1;
+    }
 
-        &.hidden-files {
-            bottom: -241px;
-        }
+    .ant-card-head-title,
+    .ant-card-extra {
+      padding: 12px 0;
+    }
 
-        &.hidden-uploader {
-            bottom: -291px;
-        }
+    .ant-card-body {
+      padding: 0;
+    }
+  }
 
-        .actions {
-            .action-item {
-                margin-left: 12px;
-                font-size: 16px;
-            }
-        }
+  &.hidden-files {
+    bottom: -241px;
+  }
 
-        .uploader-workplace {
-            height: 240px;
-            background-color: #f7f7f7;
-            padding: 12px 0 0 12px;
+  &.hidden-uploader {
+    bottom: -291px;
+  }
 
-            .uploader-list {
-                padding-right: 12px;
+  .actions {
+    .action-item {
+      margin-left: 12px;
+      font-size: 16px;
+    }
+  }
 
-                .uploader-wrapper {
-                    .uploader-file {
-                        padding: 0;
-                        height: auto;
-                        line-height: 36px;
-                        border-bottom: none;
-                        border-radius: 4px;
+  .uploader-workplace {
+    height: 240px;
+    background-color: #f7f7f7;
+    padding: 12px 0 0 12px;
 
-                        .uploader-item {
-                            width: 100%;
-                            margin-bottom: 8px;
-                            background: #eee;
+    .uploader-list {
+      padding-right: 12px;
 
-                            .item-content {
-                                padding: 6px 12px;
-                                display: flex;
-                                justify-content: space-between;
-                                flex: 1;
+      .uploader-wrapper {
+        .uploader-file {
+          padding: 0;
+          height: auto;
+          line-height: 36px;
+          border-bottom: none;
+          border-radius: 4px;
 
-                                .item-info {
-                                    flex: 1 1 auto;
-                                    position: relative;
-                                    overflow: hidden;
-                                    text-overflow: ellipsis;
-                                    white-space: nowrap;
+          .uploader-item {
+            width: 100%;
+            margin-bottom: 8px;
+            background: #eee;
 
-                                    .file-item {
-                                        display: flex;
+            .item-content {
+              padding: 6px 12px;
+              display: flex;
+              justify-content: space-between;
+              flex: 1;
 
-                                        .file-icon {
-                                            margin-right: 8px;
-                                        }
+              .item-info {
+                flex: 1 1 auto;
+                position: relative;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
 
-                                        .file-info {
-                                            width: 100%;
-                                            min-width: 0;
-                                            padding: 4px 0;
-                                            line-height: 16px;
-                                            display: flex;
-                                            flex-direction: column;
-                                            justify-content: center;
+                .file-item {
+                  display: flex;
 
-                                            .file-content {
-                                                width: 100%;
-                                                display: flex;
-                                                align-items: center;
-                                                justify-content: space-between;
+                  .file-icon {
+                    margin-right: 8px;
+                  }
 
-                                                .file-title {
-                                                    max-width: 210px;
-                                                    text-overflow: ellipsis;
-                                                    overflow: hidden;
-                                                    min-width: 0;
-                                                }
+                  .file-info {
+                    width: 100%;
+                    min-width: 0;
+                    padding: 4px 0;
+                    line-height: 16px;
+                    display: flex;
+                    flex-direction: column;
+                    justify-content: center;
 
-                                                .file-extra {
-                                                    display: flex;
-                                                    align-items: center;
-                                                    max-width: 200px;
-                                                    margin-left: 16px;
-                                                    color: gray;
-                                                    font-size: 12px;
+                    .file-content {
+                      width: 100%;
+                      display: flex;
+                      align-items: center;
+                      justify-content: space-between;
 
-                                                    span {
-                                                        margin-left: 3px;
-                                                    }
-                                                }
-                                            }
-                                        }
+                      .file-title {
+                        max-width: 210px;
+                        text-overflow: ellipsis;
+                        overflow: hidden;
+                        min-width: 0;
+                      }
 
-                                        .uploader-progress {
-                                            .ant-progress-outer {
-                                                margin: 0;
-                                            }
-                                        }
-                                    }
-                                }
+                      .file-extra {
+                        display: flex;
+                        align-items: center;
+                        max-width: 200px;
+                        margin-left: 16px;
+                        color: gray;
+                        font-size: 12px;
 
-                                .item-status {
-                                    display: flex;
-                                    justify-content: flex-end;
-                                    align-items: center;
-                                    width: 30px;
-                                }
-                            }
+                        span {
+                          margin-left: 3px;
                         }
+                      }
                     }
+                  }
+
+                  .uploader-progress {
+                    .ant-progress-outer {
+                      margin: 0;
+                    }
+                  }
                 }
+              }
+
+              .item-status {
+                display: flex;
+                justify-content: flex-end;
+                align-items: center;
+                width: 30px;
+              }
             }
+          }
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/config/version.js b/src/config/version.js
index 3094b17..c589f16 100644
--- a/src/config/version.js
+++ b/src/config/version.js
@@ -1,3 +1,3 @@
 export default {
-    VERSION: '2.8.16',
+    VERSION: '2.9.0',
 };
diff --git a/src/views/common/forgot.vue b/src/views/common/forgot.vue
index 5f4fbb5..75479fc 100644
--- a/src/views/common/forgot.vue
+++ b/src/views/common/forgot.vue
@@ -1,95 +1,115 @@
 <template>
-    <div class="forgot" style="height: 100%;">
-        <div class="content">
-            <a-spin :spinning="loading">
-                ddd
-            </a-spin>
-        </div>
+  <div class="forgot" style="height: 100%;">
+    <div class="content">
+      <a-spin :spinning="loading">
+        ddd
+        <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+      </a-spin>
     </div>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {checkResponse} from "@/assets/js/utils";
-    import {inviteInfo} from "../../api/common/common";
-    import {_joinByInviteLink} from "../../api/projectMember";
-    import {_joinByInviteLink as joinOrganation} from "../../api/user";
+import { mapState } from "vuex";
+import { checkResponse } from "@/assets/js/utils";
+import { inviteInfo } from "../../api/common/common";
+import { _joinByInviteLink } from "../../api/projectMember";
+import { _joinByInviteLink as joinOrganation } from "../../api/user";
 
-    export default {
-        data() {
-            return {
-                loading: false,
-                inviteLink: undefined,
-            }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            })
-        },
-        created() {
-            this.getInviteInfo();
-        },
-        methods: {
-            getInviteInfo() {
-                this.loading = true;
-                inviteInfo(this.$route.params.code).then(res => {
-                    this.inviteLink = res.data;
-                    this.loading = false;
-                });
-            },
-            acceptInvite() {
-                let app = this;
-                if (this.inviteLink.invite_type == 'project') {
-                    _joinByInviteLink(this.$route.params.code).then(res => {
-                        const result = checkResponse(res);
-                        if (!result) {
-                            return false;
-                        }
-                        this.$store.dispatch('setOrganizationList', res.data.organizationList);
-                        this.$store.dispatch('setCurrentOrganization', res.data.currentOrganization);
-                        setTimeout(function () {
-                            app.$router.replace({name: 'task', params: {code: app.inviteLink.source_code}})
-                        }, 500);
-                    });
-                } else if (this.inviteLink.invite_type == 'organization') {
-                    joinOrganation(this.$route.params.code).then(res => {
-                        this.$store.dispatch('setOrganizationList', res.data.organizationList);
-                        this.$store.dispatch('setCurrentOrganization', res.data.currentOrganization);
-                        this.$notice({title: '你已成功加入组织', msg: '你可以在右上方切换当前组织'}, 'notice', 'success');
-                        setTimeout(function () {
-                            app.$router.replace('/')
-                        }, 500);
-                    });
-                }
-            }
-        }
-    }
+export default {
+  data() {
+    return {
+      loading: false,
+      inviteLink: undefined,
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.getInviteInfo();
+  },
+  methods: {
+    getInviteInfo() {
+      this.loading = true;
+      inviteInfo(this.$route.params.code).then((res) => {
+        this.inviteLink = res.data;
+        this.loading = false;
+      });
+    },
+    acceptInvite() {
+      let app = this;
+      if (this.inviteLink.invite_type == "project") {
+        _joinByInviteLink(this.$route.params.code).then((res) => {
+          const result = checkResponse(res);
+          if (!result) {
+            return false;
+          }
+          this.$store.dispatch(
+            "setOrganizationList",
+            res.data.organizationList
+          );
+          this.$store.dispatch(
+            "setCurrentOrganization",
+            res.data.currentOrganization
+          );
+          setTimeout(function () {
+            app.$router.replace({
+              name: "task",
+              params: { code: app.inviteLink.source_code },
+            });
+          }, 500);
+        });
+      } else if (this.inviteLink.invite_type == "organization") {
+        joinOrganation(this.$route.params.code).then((res) => {
+          this.$store.dispatch(
+            "setOrganizationList",
+            res.data.organizationList
+          );
+          this.$store.dispatch(
+            "setCurrentOrganization",
+            res.data.currentOrganization
+          );
+          this.$notice(
+            { title: "你已成功加入组织", msg: "你可以在右上方切换当前组织" },
+            "notice",
+            "success"
+          );
+          setTimeout(function () {
+            app.$router.replace("/");
+          }, 500);
+        });
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    .forgot {
-        .content {
-            width: 600px;
-            margin: 50px auto;
+.forgot {
+  .content {
+    width: 600px;
+    margin: 50px auto;
 
-            .header {
-                font-size: 18px;
-            }
+    .header {
+      font-size: 18px;
+    }
 
-            .member-info {
-                margin: 36px 0;
-                display: flex;
-                align-items: center;
+    .member-info {
+      margin: 36px 0;
+      display: flex;
+      align-items: center;
 
-                .avatar {
-                    margin-right: 12px;
-                }
+      .avatar {
+        margin-right: 12px;
+      }
 
-                .info {
-                    p {
-                        margin: 0;
-                    }
-                }
-            }
+      .info {
+        p {
+          margin: 0;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/common/inviteFromLink.vue b/src/views/common/inviteFromLink.vue
index 77fc6f7..7b12301 100644
--- a/src/views/common/inviteFromLink.vue
+++ b/src/views/common/inviteFromLink.vue
@@ -1,119 +1,142 @@
 <template>
-    <div class="inviteFromLink" style="height: 100%;">
-        <div class="content">
-            <a-spin :spinning="loading">
-                <a-card v-if="inviteLink" :title="`来自 ${inviteLink.member.name} 的邀请`">
-                    <div class="header">
-                    <span>
-                        {{inviteLink.member.name}} 邀请你
-                        <span v-if="inviteLink.invite_type == 'project'">加入项目「{{inviteLink.sourceDetail.name}}」</span>
-                        <span v-if="inviteLink.invite_type == 'organization'">加入组织「{{inviteLink.sourceDetail.name}}」</span>
-
-                    </span>
-                    </div>
-                    <div class="member-info">
-                        <div class="avatar">
-                            <a-avatar size="large" :src="inviteLink.member.avatar"></a-avatar>
-                        </div>
-                        <div class="info">
-                            <p>{{inviteLink.member.name}}</p>
-                            <p class="muted">{{inviteLink.member.email}}</p>
-                        </div>
-                    </div>
-                    <a-button type="primary" block size="large" class="middle-btn" @click="acceptInvite">
-                        <span v-if="inviteLink.invite_type == 'project'">加入项目</span>
-                        <span v-if="inviteLink.invite_type == 'organization'">加入组织</span>
-                    </a-button>
-                </a-card>
-            </a-spin>
-        </div>
+  <div class="inviteFromLink" style="height: 100%;">
+    <div class="content">
+      <a-spin :spinning="loading">
+        <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+        <a-card v-if="inviteLink" :title="`来自 ${inviteLink.member.name} 的邀请`">
+          <div class="header">
+            <span>
+              {{inviteLink.member.name}} 邀请你
+              <span
+                v-if="inviteLink.invite_type == 'project'"
+              >加入项目「{{inviteLink.sourceDetail.name}}」</span>
+              <span
+                v-if="inviteLink.invite_type == 'organization'"
+              >加入组织「{{inviteLink.sourceDetail.name}}」</span>
+            </span>
+          </div>
+          <div class="member-info">
+            <div class="avatar">
+              <a-avatar size="large" :src="inviteLink.member.avatar"></a-avatar>
+            </div>
+            <div class="info">
+              <p>{{inviteLink.member.name}}</p>
+              <p class="muted">{{inviteLink.member.email}}</p>
+            </div>
+          </div>
+          <a-button type="primary" block size="large" class="middle-btn" @click="acceptInvite">
+            <span v-if="inviteLink.invite_type == 'project'">加入项目</span>
+            <span v-if="inviteLink.invite_type == 'organization'">加入组织</span>
+          </a-button>
+        </a-card>
+      </a-spin>
     </div>
+  </div>
 </template>
 <script>
-    import {mapState} from 'vuex'
-    import {checkResponse} from "@/assets/js/utils";
-    import {inviteInfo} from "../../api/common/common";
-    import {_joinByInviteLink} from "../../api/projectMember";
-    import {_joinByInviteLink as joinOrganation} from "../../api/user";
+import { mapState } from "vuex";
+import { checkResponse } from "@/assets/js/utils";
+import { inviteInfo } from "../../api/common/common";
+import { _joinByInviteLink } from "../../api/projectMember";
+import { _joinByInviteLink as joinOrganation } from "../../api/user";
 
-    export default {
-        data() {
-            return {
-                loading: false,
-                inviteLink: undefined,
-            }
-        },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-            })
-        },
-        created() {
-            this.getInviteInfo();
-        },
-        methods: {
-            getInviteInfo() {
-                this.loading = true;
-                inviteInfo(this.$route.params.code).then(res => {
-                    this.inviteLink = res.data;
-                    this.loading = false;
-                });
-            },
-            acceptInvite() {
-                let app = this;
-                if (this.inviteLink.invite_type == 'project') {
-                    _joinByInviteLink(this.$route.params.code).then(res => {
-                        const result = checkResponse(res);
-                        if (!result) {
-                            return false;
-                        }
-                        this.$store.dispatch('setOrganizationList', res.data.organizationList);
-                        this.$store.dispatch('setCurrentOrganization', res.data.currentOrganization);
-                        setTimeout(function () {
-                            app.$router.replace({name: 'task', params: {code: app.inviteLink.source_code}})
-                        }, 500);
-                    });
-                } else if (this.inviteLink.invite_type == 'organization') {
-                    joinOrganation(this.$route.params.code).then(res => {
-                        if (checkResponse(res)) {
-                            this.$store.dispatch('setOrganizationList', res.data.organizationList);
-                            this.$store.dispatch('setCurrentOrganization', res.data.currentOrganization);
-                            this.$notice({title: '你已成功加入组织', msg: '你可以在右上方切换当前组织'}, 'notice', 'success');
-                            setTimeout(function () {
-                                app.$router.replace('/')
-                            }, 500);
-                        }
-                    });
-                }
-            }
-        }
-    }
+export default {
+  data() {
+    return {
+      loading: false,
+      inviteLink: undefined,
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.getInviteInfo();
+  },
+  methods: {
+    getInviteInfo() {
+      this.loading = true;
+      inviteInfo(this.$route.params.code).then((res) => {
+        this.inviteLink = res.data;
+        this.loading = false;
+      });
+    },
+    acceptInvite() {
+      let app = this;
+      if (this.inviteLink.invite_type == "project") {
+        _joinByInviteLink(this.$route.params.code).then((res) => {
+          const result = checkResponse(res);
+          if (!result) {
+            return false;
+          }
+          this.$store.dispatch(
+            "setOrganizationList",
+            res.data.organizationList
+          );
+          this.$store.dispatch(
+            "setCurrentOrganization",
+            res.data.currentOrganization
+          );
+          setTimeout(function () {
+            app.$router.replace({
+              name: "task",
+              params: { code: app.inviteLink.source_code },
+            });
+          }, 500);
+        });
+      } else if (this.inviteLink.invite_type == "organization") {
+        joinOrganation(this.$route.params.code).then((res) => {
+          if (checkResponse(res)) {
+            this.$store.dispatch(
+              "setOrganizationList",
+              res.data.organizationList
+            );
+            this.$store.dispatch(
+              "setCurrentOrganization",
+              res.data.currentOrganization
+            );
+            this.$notice(
+              { title: "你已成功加入组织", msg: "你可以在右上方切换当前组织" },
+              "notice",
+              "success"
+            );
+            setTimeout(function () {
+              app.$router.replace("/");
+            }, 500);
+          }
+        });
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    .inviteFromLink {
-        .content {
-            width: 600px;
-            margin: 50px auto;
+.inviteFromLink {
+  .content {
+    width: 600px;
+    margin: 50px auto;
 
-            .header {
-                font-size: 18px;
-            }
+    .header {
+      font-size: 18px;
+    }
 
-            .member-info {
-                margin: 36px 0;
-                display: flex;
-                align-items: center;
+    .member-info {
+      margin: 36px 0;
+      display: flex;
+      align-items: center;
 
-                .avatar {
-                    margin-right: 12px;
-                }
+      .avatar {
+        margin-right: 12px;
+      }
 
-                .info {
-                    p {
-                        margin: 0;
-                    }
-                }
-            }
+      .info {
+        p {
+          margin: 0;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/files/index.vue b/src/views/files/index.vue
new file mode 100644
index 0000000..fafa42b
--- /dev/null
+++ b/src/views/files/index.vue
@@ -0,0 +1,334 @@
+<template>
+  <div class="project-space-files">
+    <wrapper-content :showHeader="false">
+      <div class="content-wrapper">
+        <div class="content-item files-list">
+          <div class="header">
+            <span class="title">公共文件</span>
+            <div class="header-actions">
+              <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
+              <a-button id="upload-file" icon="up-circle" type="dashed" size="small">上传</a-button>
+            </div>
+          </div>
+          <div class="list-content">
+            <a-list :loading="loading">
+              <a-list-item class="list-item-title">
+                <a-list-item-meta>
+                  <div class="muted" slot="title">名称</div>
+                </a-list-item-meta>
+                <div class="other-info muted">
+                  <div class="info-item">
+                    <span>大小</span>
+                  </div>
+                  <div class="info-item">
+                    <span>创建日期</span>
+                  </div>
+                  <div class="info-item">
+                    <span>创建人</span>
+                  </div>
+                </div>
+                <span slot="actions">
+                  <a-tooltip :mouseEnterDelay="0.5">
+                    <template slot="title">
+                      <span>移上显示</span>
+                    </template>
+                    操作
+                  </a-tooltip>
+                </span>
+              </a-list-item>
+              <template v-if="files.length>0">
+                <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
+                  <a-list-item-meta>
+                    <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
+                    <div slot="title">
+                      <a-tooltip :mouseEnterDelay="0.3">
+                        <template slot="title">
+                          <span>{{item.fullName}}</span>
+                        </template>
+                        <a-input
+                          :ref="`inputTitle${index}`"
+                          :auto-focus="true"
+                          v-model="item.title"
+                          v-show="item.editing"
+                          @pressEnter="onCellChange(item)"
+                          @blur="onCellChange(item)"
+                        ></a-input>
+                        <a
+                          class="text-default"
+                          target="_blank"
+                          :href="item | showPreviewUrl"
+                          :title="item.fullName"
+                          v-show="!item.editing"
+                        >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
+                      </a-tooltip>
+                    </div>
+                  </a-list-item-meta>
+                  <div class="other-info muted">
+                    <div class="info-item">
+                      <span>{{(formatSize(item.size))}}</span>
+                    </div>
+                    <div class="info-item">
+                      <a-tooltip :title="item.create_time">
+                        <span>{{ formatTime(item.create_time) }}</span>
+                      </a-tooltip>
+                    </div>
+                    <div class="info-item">
+                      <span>{{item.creatorName}}</span>
+                    </div>
+                  </div>
+                  <span slot="actions">
+                    <a-tooltip title="下载">
+                      <a class="muted" target="_blank" :href="item.file_url">
+                        <a-icon type="download" />
+                      </a>
+                    </a-tooltip>
+                  </span>
+                  <!-- <span slot="actions">
+                                     <a-tooltip title="更新">
+                                         <a-icon type="upload"/>
+                                     </a-tooltip>
+                  </span>-->
+                  <span slot="actions" @click="editFile(item,index)">
+                    <a-tooltip title="编辑">
+                      <a-icon type="edit" />
+                    </a-tooltip>
+                  </span>
+                  <a class="muted" slot="actions">
+                    <a-dropdown :trigger="['click']" placement="bottomRight">
+                      <a-tooltip :mouseEnterDelay="0.5">
+                        <template slot="title">
+                          <span>更多操作</span>
+                        </template>
+                        <a class="action-item muted">
+                          <a-icon type="down" />
+                        </a>
+                      </a-tooltip>
+                      <a-menu
+                        class="field-right-menu"
+                        v-clipboard="item.file_url"
+                        @click="doFile($event,item.code)"
+                        slot="overlay"
+                      >
+                        <a-menu-item key="copy">
+                          <a-icon type="link" />
+                          <span>复制链接</span>
+                        </a-menu-item>
+                        <a-menu-item key="delete">
+                          <a-icon type="delete" />
+                          <span>移到回收站</span>
+                        </a-menu-item>
+                      </a-menu>
+                    </a-dropdown>
+                  </a>
+                </a-list-item>
+              </template>
+              <template v-else>
+                <a-empty description="无文件" />
+              </template>
+              <div
+                v-if="showLoadingMore"
+                slot="loadMore"
+                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+              >
+                <a-spin v-if="loadingMore">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                </a-spin>
+                <a-button v-else @click="onLoadMore">查看更多文件</a-button>
+              </div>
+            </a-list>
+          </div>
+        </div>
+      </div>
+    </wrapper-content>
+  </div>
+</template>
+
+<script>
+import { mapState } from "vuex";
+import { checkResponse } from "../../assets/js/utils";
+import { relativelyTime } from "../../assets/js/dateTime";
+import { edit, list, recycle } from "../../api/file";
+import pagination from "@/mixins/pagination";
+import { notice } from "../../assets/js/notice";
+
+export default {
+  name: "organization-files",
+  mixins: [pagination],
+  data() {
+    return {
+      code: "",
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      currentFileIndex: {},
+      files: [],
+    };
+  },
+  components: {},
+  computed: {
+    ...mapState({
+      uploader: (state) => state.common.uploader,
+      organizationCode: (state) => state.currentOrganization.code,
+    }),
+  },
+  watch: {
+    uploader: {
+      handler(newVal, oldVal) {
+        //监听是否有上传文件行为
+        const files = newVal.fileList;
+        const index = files.findIndex((item) => item.projectName == "");
+        console.log(files);
+        if (index !== -1) {
+          this.getFiles();
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {
+    this.clearProject();
+    this.getFiles();
+  },
+  mounted() {
+    setTimeout(() => {
+      this.uploader.assignBrowse(document.getElementById("upload-file"));
+    }, 500);
+  },
+  methods: {
+    clearProject() {
+      this.$store.dispatch("setTempData", {});
+    },
+    getFiles(reset = true) {
+      let app = this;
+      if (reset) {
+        this.pagination.page = 1;
+        this.pagination.pageSize = 50;
+        this.showLoadingMore = false;
+      }
+      app.requestData.organizationCode = this.organizationCode;
+      app.requestData.projectCode = this.code;
+      app.requestData.deleted = 0;
+      list(app.requestData).then((res) => {
+        if (reset) {
+          this.files = [];
+        }
+        res.data.list.forEach((v) => {
+          v.editing = false;
+        });
+        app.files = app.files.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.files.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.getFiles(false);
+    },
+    editFile(file, index) {
+      let app = this;
+      this.files.forEach((v) => {
+        v.editing = false;
+      });
+      this.files[index].editing = true;
+      this.$nextTick(() => {
+        app.$refs[`inputTitle${index}`][0].focus();
+      });
+      this.currentFileIndex = index;
+    },
+    onCellChange(file) {
+      let currentFile = this.files[this.currentFileIndex];
+      this.files.forEach((v) => {
+        v.editing = false;
+      });
+      const fullName = `${file.title}.${file.extension}`;
+      if (fullName != currentFile.fullName) {
+        edit({ title: currentFile.title, fileCode: currentFile.code }).then(
+          (res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
+            }
+            currentFile.title = file.title;
+            currentFile.fullName = fullName;
+            notice(
+              {
+                title: "重命名成功",
+              },
+              "notice",
+              "success"
+            );
+          }
+        );
+      }
+    },
+    doFile(action, fileCode) {
+      let app = this;
+      const actionKey = action.key;
+      switch (actionKey) {
+        case "delete":
+          this.$confirm({
+            title: "移到回收站",
+            content: `您确定要把该文件移到回收站吗？`,
+            okText: "移到回收站",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              recycle(fileCode).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
+                }
+                app.getFiles();
+              });
+              notice(
+                {
+                  title: "成功移到回收站",
+                  msg: "可在 菜单－查看回收站－文件 中查看",
+                },
+                "notice",
+                "success",
+                5
+              );
+              return Promise.resolve();
+            },
+          });
+          break;
+        case "copy":
+          notice(
+            {
+              title: "复制链接成功",
+              msg: "在地址栏粘贴并打开可下载该资源",
+            },
+            "notice",
+            "success",
+            5
+          );
+          return true;
+      }
+    },
+    formatTime(time) {
+      return relativelyTime(time);
+    },
+    formatSize(size) {
+      let type = "KB";
+      size = size / 1024;
+      if (size >= 1024) {
+        size /= 1024;
+        type = "MB";
+      }
+      return `${size.toFixed(2)} ${type}`;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.project-space-files {
+  .wrapper-main {
+    background: initial;
+  }
+}
+</style>
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index b97b0f1..020cfbc 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -355,7 +355,10 @@ export default {
   mixins: [pagination],
   data() {
     return {
-      loading: false,
+      loading: {
+        spinning: false,
+        indicator: <a-icon type="loading" style="font-size: 2rem" spin />,
+      },
       yiyan: {},
       yiyan_cate_c: 0,
       yiyan_cate: [
diff --git a/src/views/index.vue b/src/views/index.vue
index ef843a7..26b8008 100644
--- a/src/views/index.vue
+++ b/src/views/index.vue
@@ -2,13 +2,14 @@
 <template>
   <div class="index">
     <a-spin :spinning="windowLoading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
       <a-layout id="layout" :class="layoutClass">
         <a-layout-header class="project-nav" :class="{'collapsed':collapsed}">
           <div class="logo pc-view" :title="system.site_name" @click="toHome">
             <img class="logo-img" src="../assets/image/common/logo.png" alt />
             <span class="title" v-if="system">
               {{system.app_name}}
-              <sup class="version">{{system.app_version}}</sup>
+              <sup class="version">{{version.VERSION}}</sup>
             </span>
           </div>
           <div class="left-menudrawer wap-menu" @click="collapsed = !collapsed">
@@ -119,6 +120,7 @@
             <a-layout-content>
               <transition name="router-fade" mode="out-in">
                 <a-spin :spinning="pageLoading">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
                   <router-view></router-view>
                 </a-spin>
               </transition>
@@ -146,6 +148,7 @@ import HeaderSelect from "../components/layout/header/HeaderSelect";
 import VUploader from "../components/tools/VUploader";
 import Socket from "../components/websocket/socket";
 import config from "../config/config";
+import version from "../config/version";
 import { notice } from "../assets/js/notice";
 import { getStore } from "../assets/js/storage";
 import { _getOrgList } from "../api/organization";
@@ -177,6 +180,7 @@ export default {
       selectedModelKeys: [],
       breadCrumbInfo: [],
       config: config,
+      version: version,
       online: 0,
     };
   },
diff --git a/src/views/member/login.vue b/src/views/member/login.vue
index 9c21cfe..a5609ca 100644
--- a/src/views/member/login.vue
+++ b/src/views/member/login.vue
@@ -2,6 +2,7 @@
   <div class="main">
     <a-spin class="text-center" :spinning="oauthLoading">
       <span v-show="oauthLoading">正在登陆，请稍后...</span>
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
     </a-spin>
     <a-form
       v-show="!oauthLoading"
diff --git a/src/views/members/index.vue b/src/views/members/index.vue
index 11aada0..e26843d 100644
--- a/src/views/members/index.vue
+++ b/src/views/members/index.vue
@@ -1,643 +1,651 @@
 <template>
-    <div class="members-index">
-        <div class="layout-item left">
-            <div class="left-content">
-                <div class="search-content">
-                    <a-input size="large" v-model="keyword" ref="keywordInput" placeholder="搜索">
-                        <a-icon slot="prefix" class="muted" type="search"/>
-                        <a-icon v-if="keyword" slot="suffix" class="muted" type="close-circle" @click="emitEmpty"/>
-                    </a-input>
-                </div>
-                <div class="content-item muted">成员</div>
-                <div class="menus">
-                    <a-menu mode="inline" v-model="selectedKeys" @click="getMembers">
-                        <a-menu-item :key="index.toString()" v-for="(item,index) in menus">
-                            <a-icon :type="item.icon"/>
-                            <span>{{item.title}}</span>
-                        </a-menu-item>
-                    </a-menu>
-                </div>
-                <div class="content-item muted">部门</div>
-                <div class="actions content-item">
-                    <a-dropdown
-                            :trigger="['click']"
-                            v-model="showCreateDepartment"
-                            placement="bottomCenter"
-                    >
-                        <a>
-                            <a-icon :style="{fontSize: '14px'}" type="plus-circle"/>
-                            创建部门</a>
-                        <div slot="overlay">
-                            <create-department
-                                    v-if="showCreateDepartment"
-                                    @update="createDepartmentSuccess"
-                            ></create-department>
-                        </div>
-                    </a-dropdown>
-                    <a>
-                        <a-icon type="bars"/>
-                        部门排序*</a>
-                </div>
-                <div class="content-item department">
-                    <a-spin :spinning="departmentLoading">
-                        <a-tree
-                                :loadData="onLoadData"
-                                :treeData="treeData"
-                                showIcon
-                                @select="onSelect"
-                        >
-                            <template slot="custom" slot-scope="{selected}">
-                                <a-icon type="bulb"/>
-                            </template>
-                        </a-tree>
-                    </a-spin>
-                </div>
+  <div class="members-index">
+    <div class="layout-item left">
+      <div class="left-content">
+        <div class="search-content">
+          <a-input size="large" v-model="keyword" ref="keywordInput" placeholder="搜索">
+            <a-icon slot="prefix" class="muted" type="search" />
+            <a-icon
+              v-if="keyword"
+              slot="suffix"
+              class="muted"
+              type="close-circle"
+              @click="emitEmpty"
+            />
+          </a-input>
+        </div>
+        <div class="content-item muted">成员</div>
+        <div class="menus">
+          <a-menu mode="inline" v-model="selectedKeys" @click="getMembers">
+            <a-menu-item :key="index.toString()" v-for="(item,index) in menus">
+              <a-icon :type="item.icon" />
+              <span>{{item.title}}</span>
+            </a-menu-item>
+          </a-menu>
+        </div>
+        <div class="content-item muted">部门</div>
+        <div class="actions content-item">
+          <a-dropdown :trigger="['click']" v-model="showCreateDepartment" placement="bottomCenter">
+            <a>
+              <a-icon :style="{fontSize: '14px'}" type="plus-circle" />创建部门
+            </a>
+            <div slot="overlay">
+              <create-department v-if="showCreateDepartment" @update="createDepartmentSuccess"></create-department>
             </div>
+          </a-dropdown>
+          <a>
+            <a-icon type="bars" />部门排序*
+          </a>
         </div>
-        <div class="layout-item right">
-            <div class="header">
-                <div class="title">
-                    <span>{{currentMenu.title}} · {{pagination.total}}</span>
-                </div>
-                <div class="actions">
-                    <!-- <a>
+        <div class="content-item department">
+          <a-spin :spinning="departmentLoading">
+            <a-tree :loadData="onLoadData" :treeData="treeData" showIcon @select="onSelect">
+              <template slot="custom" slot-scope="{selected}">
+                <a-icon type="bulb" />
+              </template>
+            </a-tree>
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
+        </div>
+      </div>
+    </div>
+    <div class="layout-item right">
+      <div class="header">
+        <div class="title">
+          <span>{{currentMenu.title}} · {{pagination.total}}</span>
+        </div>
+        <div class="actions">
+          <!-- <a>
                          <a-icon type="reload"/>
                          批量更新成员信息*
-                     </a>-->
-
-                    <a-dropdown :trigger="['click']" placement="bottomCenter">
-                        <a class="ant-dropdown-link" href="#">
-                            <a-icon type="user-add"/>
-                            添加成员
-                        </a>
-                        <a-menu slot="overlay">
-                            <a-menu-item>
-                                <a href="javascript:;" @click="showInviteMember = true">
-                                    <a-icon type="user-add"/>
-                                    通过邮箱邀请
-                                </a>
-                            </a-menu-item>
-                            <a-menu-divider/>
-                            <a-menu-item>
-                                <a :href="downLoadUrl" target="_blank" class="m-l">
-                                    <a-icon type="copy"/>
-                                    下载批量导入成员模板
-                                </a>
-                            </a-menu-item>
-                            <a-menu-item>
-                                <a-upload name="file"
-                                          :showUploadList="false"
-                                          :action="uploadAction"
-                                          :beforeUpload="beforeUpload"
-                                          :headers="headers"
-                                          @change="handleChange">
-                                    <a class="text-default" :loading="uploadLoading" :disabled="uploadLoading">
-                                        <a-icon type="upload" v-show="!uploadLoading"/>
-                                        上传文件批量导入成员
-                                    </a>
-                                </a-upload>
-                            </a-menu-item>
-                        </a-menu>
-                    </a-dropdown>
-                    <template v-if="currentDepartmentCode">
-                        <a-dropdown
-                                :trigger="['click']"
-                                v-model="showCreateChildDepartment"
-                                placement="bottomCenter"
-                        >
-                            <a>
-                                <a-icon :style="{fontSize: '14px'}" type="plus-circle"/>
-                                创建子部门</a>
-                            <div slot="overlay">
-                                <create-department
-                                        v-if="showCreateChildDepartment"
-                                        :parentDepartmentCode="currentDepartmentCode"
-                                        @update="createChildDepartmentSuccess"
-                                ></create-department>
-                            </div>
-                        </a-dropdown>
-                        <a-dropdown
-                                :trigger="['click']"
-                                v-model="showEditDepartment"
-                                placement="bottomCenter"
-                        >
-                            <a>
-                                <a-icon :style="{fontSize: '14px'}" type="edit"/>
-                                编辑部门</a>
-                            <div slot="overlay">
-                                <create-department
-                                        v-if="showEditDepartment"
-                                        :departmentCode="currentDepartmentCode"
-                                        @edit="editDepartmentSuccess"
-                                ></create-department>
-                            </div>
-                        </a-dropdown>
-                        <a @click="deleteDepartment">
-                            <a-icon :style="{fontSize: '14px'}" type="delete"/>
-                            删除部门</a>
-                    </template>
-                </div>
-            </div>
-            <div class="members-content">
-                <vue-scroll ref="contentscroll">
-                    <a-list class="member-list" :loading="loading">
-                        <div v-if="showLoadingMore" slot="loadMore"
-                             :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                            <!--                            <a-spin v-if="loadingMore"/>-->
-                            <a-button @click="onLoadMore">加载更多</a-button>
-                        </div>
-                        <a-list-item :key="index" v-for="(item, index) in members">
-                            <a-list-item-meta>
-                                <a-avatar slot="avatar" :src="item.avatar"/>
-                                <div slot="title">
-                                    <router-link :to="`/members/profile/${item.code}`" class="text-default">{{ item.name
-                                        }}
-                                    </router-link>
-                                    <a-tag class="m-l-sm" v-if="item.is_owner">拥有者</a-tag>
-                                </div>
-                                <div slot="description">
-                                    <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
-                                    <span>{{item.email}}
-                                    <span v-if="item.departments"> - {{ item.departments }}</span>
-                                </span>
-                                    <!--</a-tooltip>-->
-                                </div>
-                            </a-list-item-meta>
-                            <template v-if="!item.is_owner">
-                                <a class="muted" slot="actions" v-if="item.status == 0"
-                                   @click="resumeAccount(item,index)">
-                                    <a-tooltip title="启用账号">
-                                        <a-icon type="check-circle"/>
-                                    </a-tooltip>
-                                </a>
-                                <a class="muted" slot="actions" v-if="item.status == 1"
-                                   @click="forbidAccount(item,index)">
-                                    <a-tooltip title="停用账号">
-                                        <a-icon type="stop"/>
-                                    </a-tooltip>
-                                </a>
-                                <a class="muted" slot="actions" @click="deleteAccount(item,index)">
-                                    <a-tooltip :title="`从${actionTitle}内移除`">
-                                        <a-icon type="user-delete"/>
-                                    </a-tooltip>
-                                </a>
-                            </template>
-                        </a-list-item>
-                    </a-list>
-                </vue-scroll>
-            </div>
-
+          </a>-->
+
+          <a-dropdown :trigger="['click']" placement="bottomCenter">
+            <a class="ant-dropdown-link" href="#">
+              <a-icon type="user-add" />添加成员
+            </a>
+            <a-menu slot="overlay">
+              <a-menu-item>
+                <a href="javascript:;" @click="showInviteMember = true">
+                  <a-icon type="user-add" />通过邮箱邀请
+                </a>
+              </a-menu-item>
+              <a-menu-divider />
+              <a-menu-item>
+                <a :href="downLoadUrl" target="_blank" class="m-l">
+                  <a-icon type="copy" />下载批量导入成员模板
+                </a>
+              </a-menu-item>
+              <a-menu-item>
+                <a-upload
+                  name="file"
+                  :showUploadList="false"
+                  :action="uploadAction"
+                  :beforeUpload="beforeUpload"
+                  :headers="headers"
+                  @change="handleChange"
+                >
+                  <a class="text-default" :loading="uploadLoading" :disabled="uploadLoading">
+                    <a-icon type="upload" v-show="!uploadLoading" />上传文件批量导入成员
+                  </a>
+                </a-upload>
+              </a-menu-item>
+            </a-menu>
+          </a-dropdown>
+          <template v-if="currentDepartmentCode">
+            <a-dropdown
+              :trigger="['click']"
+              v-model="showCreateChildDepartment"
+              placement="bottomCenter"
+            >
+              <a>
+                <a-icon :style="{fontSize: '14px'}" type="plus-circle" />创建子部门
+              </a>
+              <div slot="overlay">
+                <create-department
+                  v-if="showCreateChildDepartment"
+                  :parentDepartmentCode="currentDepartmentCode"
+                  @update="createChildDepartmentSuccess"
+                ></create-department>
+              </div>
+            </a-dropdown>
+            <a-dropdown :trigger="['click']" v-model="showEditDepartment" placement="bottomCenter">
+              <a>
+                <a-icon :style="{fontSize: '14px'}" type="edit" />编辑部门
+              </a>
+              <div slot="overlay">
+                <create-department
+                  v-if="showEditDepartment"
+                  :departmentCode="currentDepartmentCode"
+                  @edit="editDepartmentSuccess"
+                ></create-department>
+              </div>
+            </a-dropdown>
+            <a @click="deleteDepartment">
+              <a-icon :style="{fontSize: '14px'}" type="delete" />删除部门
+            </a>
+          </template>
         </div>
-        <invite-department-member v-model="showInviteMember" :department-code="currentDepartmentCode"
-                                  v-if="showInviteMember" @update="getMembers"></invite-department-member>
+      </div>
+      <div class="members-content">
+        <vue-scroll ref="contentscroll">
+          <a-list class="member-list" :loading="loading">
+            <div
+              v-if="showLoadingMore"
+              slot="loadMore"
+              :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+            >
+              <!--                            <a-spin v-if="loadingMore"/>-->
+              <a-button @click="onLoadMore">加载更多</a-button>
+            </div>
+            <a-list-item :key="index" v-for="(item, index) in members">
+              <a-list-item-meta>
+                <a-avatar slot="avatar" :src="item.avatar" />
+                <div slot="title">
+                  <router-link :to="`/members/profile/${item.code}`" class="text-default">
+                    {{ item.name
+                    }}
+                  </router-link>
+                  <a-tag class="m-l-sm" v-if="item.is_owner">拥有者</a-tag>
+                </div>
+                <div slot="description">
+                  <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
+                  <span>
+                    {{item.email}}
+                    <span v-if="item.departments">- {{ item.departments }}</span>
+                  </span>
+                  <!--</a-tooltip>-->
+                </div>
+              </a-list-item-meta>
+              <template v-if="!item.is_owner">
+                <a
+                  class="muted"
+                  slot="actions"
+                  v-if="item.status == 0"
+                  @click="resumeAccount(item,index)"
+                >
+                  <a-tooltip title="启用账号">
+                    <a-icon type="check-circle" />
+                  </a-tooltip>
+                </a>
+                <a
+                  class="muted"
+                  slot="actions"
+                  v-if="item.status == 1"
+                  @click="forbidAccount(item,index)"
+                >
+                  <a-tooltip title="停用账号">
+                    <a-icon type="stop" />
+                  </a-tooltip>
+                </a>
+                <a class="muted" slot="actions" @click="deleteAccount(item,index)">
+                  <a-tooltip :title="`从${actionTitle}内移除`">
+                    <a-icon type="user-delete" />
+                  </a-tooltip>
+                </a>
+              </template>
+            </a-list-item>
+          </a-list>
+        </vue-scroll>
+      </div>
     </div>
+    <invite-department-member
+      v-model="showInviteMember"
+      :department-code="currentDepartmentCode"
+      v-if="showInviteMember"
+      @update="getMembers"
+    ></invite-department-member>
+  </div>
 </template>
 
 <script>
-    import _ from 'lodash'
-    import inviteDepartmentMember from '../../components/project/inviteDepartmentMember'
-    import createDepartment from '../../components/project/createDepartment'
-    import {list} from "../../api/department";
-    import {del, forbid, list as getMembers, resume} from "../../api/user";
-    import pagination from "../../mixins/pagination";
-    import {checkResponse, getApiUrl, getAuthorization, getUploadUrl} from "../../assets/js/utils";
-    import {notice} from "../../assets/js/notice";
-    import {removeMember} from "../../api/departmentMember";
-    import {del as deleteDepartment} from "../../api/department";
-    import {getStore} from "../../assets/js/storage";
-
-    export default {
-        name: "members",
-        components: {
-            inviteDepartmentMember,
-            createDepartment,
-        },
-        mixins: [pagination],
-        data() {
-            return {
-                keyword: '',
-                selectedKeys: ['0'],
-                menus: [
-                    {icon: 'team', title: '所有成员'},
-                    {icon: 'usergroup-add', title: '新加入的成员'},
-                    {icon: 'user', title: '未分配部门的成员'},
-                    {icon: 'stop', title: '停用的成员'},
-                ],
-                currentMenu: {},
-                currentDepartmentCode: '',
-                currentTreeNode: '',//当前部门树节点
-                treeData: [],
-                departmentLoading: false,
-                loading: false,
-                members: [],
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                showCreateDepartment: false,
-                showEditDepartment: false,
-                showCreateChildDepartment: false,
-
-                downLoadUrl: getUploadUrl('project/department_member/_downloadTemplate'),
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/department_member/uploadFile'),
-
+import _ from "lodash";
+import inviteDepartmentMember from "../../components/project/inviteDepartmentMember";
+import createDepartment from "../../components/project/createDepartment";
+import { list } from "../../api/department";
+import { del, forbid, list as getMembers, resume } from "../../api/user";
+import pagination from "../../mixins/pagination";
+import {
+  checkResponse,
+  getApiUrl,
+  getAuthorization,
+  getUploadUrl,
+} from "../../assets/js/utils";
+import { notice } from "../../assets/js/notice";
+import { removeMember } from "../../api/departmentMember";
+import { del as deleteDepartment } from "../../api/department";
+import { getStore } from "../../assets/js/storage";
+
+export default {
+  name: "members",
+  components: {
+    inviteDepartmentMember,
+    createDepartment,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      keyword: "",
+      selectedKeys: ["0"],
+      menus: [
+        { icon: "team", title: "所有成员" },
+        { icon: "usergroup-add", title: "新加入的成员" },
+        { icon: "user", title: "未分配部门的成员" },
+        { icon: "stop", title: "停用的成员" },
+      ],
+      currentMenu: {},
+      currentDepartmentCode: "",
+      currentTreeNode: "", //当前部门树节点
+      treeData: [],
+      departmentLoading: false,
+      loading: false,
+      members: [],
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      showCreateDepartment: false,
+      showEditDepartment: false,
+      showCreateChildDepartment: false,
+
+      downLoadUrl: getUploadUrl("project/department_member/_downloadTemplate"),
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/department_member/uploadFile"),
+    };
+  },
+  computed: {
+    actionTitle() {
+      return this.currentDepartmentCode ? "部门" : "组织";
+    },
+    headers() {
+      let headers = getAuthorization();
+      let organization = getStore("currentOrganization", true);
+      if (organization) {
+        headers.organizationCode = organization.code;
+      }
+      return headers;
+    },
+  },
+  watch: {
+    keyword() {
+      this.search();
+    },
+  },
+  created() {
+    this.currentMenu = this.menus[0];
+    this.getMembers({ key: 0 });
+    this.getDepartment();
+  },
+  methods: {
+    getDepartment() {
+      this.departmentLoading = true;
+      list({ page: 1, pageSize: 100 }).then((res) => {
+        let list = [];
+        if (res.data.list) {
+          res.data.list.forEach((v) => {
+            list.push({
+              key: v.code,
+              title: v.name,
+              isLeaf: !v.hasNext,
+              scopedSlots: { icon: "custom" },
+            });
+          });
+        }
+        this.treeData = list;
+        this.departmentLoading = false;
+      });
+    },
+    getMembers({ key } = {}, reload = true) {
+      let app = this;
+      if (key != undefined) {
+        this.currentDepartmentCode = "";
+        this.currentMenu = this.menus[key];
+        this.selectedKeys = [key.toString()];
+        this.requestData.searchType = key;
+      }
+      app.loading = true;
+      if (reload) {
+        this.pagination.page = 1;
+      }
+      getMembers(this.requestData).then((res) => {
+        if (reload) {
+          app.members = res.data.list;
+        } else {
+          app.members = app.members.concat(res.data.list);
+        }
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.members.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    search: _.debounce(function () {
+      if (!this.keyword) {
+        this.list = [];
+      }
+      if (this.keyword.length <= 1) {
+        return false;
+      }
+      this.requestData.keyword = this.keyword;
+      this.getMembers();
+    }, 500),
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.getMembers({}, false);
+    },
+    onSelect(selectedKeys, e) {
+      // this.onLoadData(e.node);
+      this.selectedKeys = [];
+      this.currentMenu = e.node.dataRef;
+      this.currentDepartmentCode = e.node.dataRef.key;
+      this.currentTreeNode = e.node;
+      let app = this;
+      this.requestData.searchType = 4;
+      this.requestData.departmentCode = e.node.dataRef.key;
+      app.loading = true;
+      getMembers(this.requestData).then((res) => {
+        app.members = res.data.list;
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.members.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadData(treeNode) {
+      return new Promise((resolve) => {
+        list({ page: 1, pageSize: 100, pcode: treeNode.dataRef.key }).then(
+          (res) => {
+            let list = [];
+            if (res.data.list.length) {
+              res.data.list.forEach((v) => {
+                list.push({
+                  key: v.code,
+                  title: v.name,
+                  isLeaf: !v.hasNext,
+                  scopedSlots: { icon: "custom" },
+                });
+              });
+            }
+            treeNode.dataRef.isLeaf = !list.length > 0;
+            treeNode.dataRef.children = list;
+            this.treeData = [...this.treeData];
+            resolve();
+          }
+        );
+      });
+    },
+    createDepartmentSuccess(data) {
+      let list = [...this.treeData];
+      list.push({
+        key: data.code,
+        title: data.name,
+        isLeaf: true,
+        scopedSlots: { icon: "custom" },
+      });
+      this.treeData = [];
+      this.treeData = list;
+      this.showCreateDepartment = false;
+    },
+    createChildDepartmentSuccess() {
+      this.onLoadData(this.currentTreeNode);
+      this.showCreateChildDepartment = false;
+    },
+    editDepartmentSuccess(data) {
+      this.currentTreeNode.dataRef.title = data;
+      this.showEditDepartment = false;
+    },
+    deleteDepartment() {
+      let app = this;
+      this.$confirm({
+        title: "您确定要删除当前部门吗？",
+        content: `删除部门会同时删除其子部门，部门中的成员不会被移出组织。`,
+        okText: "删除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          deleteDepartment(app.currentDepartmentCode).then((res) => {
+            if (!checkResponse(res)) {
+              return;
+            }
+            if (app.currentTreeNode.$parent.dataRef) {
+              app.onLoadData(app.currentTreeNode.$parent);
+              app.onSelect(null, { node: app.currentTreeNode.$parent });
+            } else {
+              app.getMembers({ key: 0 });
+              app.getDepartment();
             }
+            notice({ title: "删除成功" }, "notice", "success");
+          });
+          return Promise.resolve();
         },
-        computed: {
-            actionTitle() {
-                return this.currentDepartmentCode ? '部门' : '组织'
-            },
-            headers() {
-                let headers = getAuthorization();
-                let organization = getStore('currentOrganization', true);
-                if (organization) {
-                    headers.organizationCode = organization.code;
-                }
-                return headers;
+      });
+    },
+    forbidAccount(member, index) {
+      let app = this;
+      this.$confirm({
+        title: "您确定要停用当前帐号吗？",
+        content: `被停用的帐号将无法访问该${this.actionTitle}，但帐号信息仍保留，方便工作交接和管理。支持帐号恢复`,
+        okText: "停用",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          forbid(member.code).then((res) => {
+            if (!checkResponse(res)) {
+              return;
             }
+            app.members.splice(index, 1);
+            notice({ title: "已成功停用账号" }, "notice", "success");
+          });
+          return Promise.resolve();
         },
-        watch: {
-            keyword() {
-                this.search();
-            },
+      });
+    },
+    resumeAccount(member, index) {
+      let app = this;
+      this.$confirm({
+        title: "您确定要启用账号吗？",
+        content: `被启用的帐号将重新加入该${this.actionTitle}`,
+        okText: "启用",
+        okType: "primary",
+        cancelText: "再想想",
+        onOk() {
+          resume(member.code).then((res) => {
+            if (!checkResponse(res)) {
+              return;
+            }
+            app.members.splice(index, 1);
+            notice({ title: "已成功启用账号" }, "notice", "success");
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.currentMenu = this.menus[0];
-            this.getMembers({key: 0});
-            this.getDepartment();
+      });
+    },
+    deleteAccount(member, index) {
+      let app = this;
+      this.$confirm({
+        title: `确认从${this.actionTitle}中移除成员吗？`,
+        content: `移除后该账号在${this.actionTitle}内的相关信息将会被清除`,
+        okText: "移除",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          if (app.currentDepartmentCode) {
+            removeMember(member.code, app.currentDepartmentCode).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.members.splice(index, 1);
+              notice({ title: "移除成功" }, "notice", "success");
+            });
+          } else {
+            del(member.code).then((res) => {
+              if (!checkResponse(res)) {
+                return;
+              }
+              app.members.splice(index, 1);
+              notice({ title: "移除成功" }, "notice", "success");
+            });
+          }
+          return Promise.resolve();
         },
-        methods: {
-            getDepartment() {
-                this.departmentLoading = true;
-                list({page: 1, pageSize: 100}).then(res => {
-                    let list = [];
-                    if (res.data.list) {
-                        res.data.list.forEach((v) => {
-                            list.push({
-                                key: v.code,
-                                title: v.name,
-                                isLeaf: !v.hasNext,
-                                scopedSlots: {icon: 'custom'}
-                            })
-                        });
-                    }
-                    this.treeData = list;
-                    this.departmentLoading = false;
-                });
-            },
-            getMembers({key} = {}, reload = true) {
-                let app = this;
-                if (key != undefined) {
-                    this.currentDepartmentCode = '';
-                    this.currentMenu = this.menus[key];
-                    this.selectedKeys = [key.toString()];
-                    this.requestData.searchType = key;
-                }
-                app.loading = true;
-                if (reload) {
-                    this.pagination.page = 1;
-                }
-                getMembers(this.requestData).then(res => {
-                    if (reload) {
-                        app.members = res.data.list;
-                    } else {
-                        app.members = app.members.concat(res.data.list);
-                    }
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.members.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            search: _.debounce(
-                function () {
-                    if (!this.keyword) {
-                        this.list = [];
-                    }
-                    if (this.keyword.length <= 1) {
-                        return false;
-                    }
-                    this.requestData.keyword = this.keyword;
-                    this.getMembers();
-                }, 500
-            ),
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.getMembers({}, false);
-            },
-            onSelect(selectedKeys, e) {
-                // this.onLoadData(e.node);
-                this.selectedKeys = [];
-                this.currentMenu = e.node.dataRef;
-                this.currentDepartmentCode = e.node.dataRef.key;
-                this.currentTreeNode = e.node;
-                let app = this;
-                this.requestData.searchType = 4;
-                this.requestData.departmentCode = e.node.dataRef.key;
-                app.loading = true;
-                getMembers(this.requestData).then(res => {
-                    app.members = res.data.list;
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.members.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadData(treeNode) {
-                return new Promise((resolve) => {
-                    list({page: 1, pageSize: 100, pcode: treeNode.dataRef.key}).then(res => {
-                        let list = [];
-                        if (res.data.list.length) {
-                            res.data.list.forEach((v) => {
-                                list.push({
-                                    key: v.code,
-                                    title: v.name,
-                                    isLeaf: !v.hasNext,
-                                    scopedSlots: {icon: 'custom'}
-                                })
-                            });
-                        }
-                        treeNode.dataRef.isLeaf = !list.length > 0;
-                        treeNode.dataRef.children = list;
-                        this.treeData = [...this.treeData];
-                        resolve();
-                    });
-                })
-            },
-            createDepartmentSuccess(data) {
-                let list = [...this.treeData];
-                list.push({
-                    key: data.code,
-                    title: data.name,
-                    isLeaf: true,
-                    scopedSlots: {icon: 'custom'}
-                });
-                this.treeData = [];
-                this.treeData = list;
-                this.showCreateDepartment = false
-            },
-            createChildDepartmentSuccess() {
-                this.onLoadData(this.currentTreeNode);
-                this.showCreateChildDepartment = false;
-            },
-            editDepartmentSuccess(data) {
-                this.currentTreeNode.dataRef.title = data;
-                this.showEditDepartment = false;
-            },
-            deleteDepartment() {
-                let app = this;
-                this.$confirm({
-                    title: '您确定要删除当前部门吗？',
-                    content: `删除部门会同时删除其子部门，部门中的成员不会被移出组织。`,
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        deleteDepartment(app.currentDepartmentCode).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            if (app.currentTreeNode.$parent.dataRef) {
-                                app.onLoadData(app.currentTreeNode.$parent);
-                                app.onSelect(null, {node: app.currentTreeNode.$parent});
-                            } else {
-                                app.getMembers({key: 0});
-                                app.getDepartment();
-                            }
-                            notice({title: '删除成功'}, 'notice', 'success');
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            forbidAccount(member, index) {
-                let app = this;
-                this.$confirm({
-                    title: '您确定要停用当前帐号吗？',
-                    content: `被停用的帐号将无法访问该${this.actionTitle}，但帐号信息仍保留，方便工作交接和管理。支持帐号恢复`,
-                    okText: '停用',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        forbid(member.code).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            app.members.splice(index, 1);
-                            notice({title: '已成功停用账号'}, 'notice', 'success');
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            resumeAccount(member, index) {
-                let app = this;
-                this.$confirm({
-                    title: '您确定要启用账号吗？',
-                    content: `被启用的帐号将重新加入该${this.actionTitle}`,
-                    okText: '启用',
-                    okType: 'primary',
-                    cancelText: '再想想',
-                    onOk() {
-                        resume(member.code).then((res) => {
-                            if (!checkResponse(res)) {
-                                return;
-                            }
-                            app.members.splice(index, 1);
-                            notice({title: '已成功启用账号'}, 'notice', 'success');
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            deleteAccount(member, index) {
-                let app = this;
-                this.$confirm({
-                    title: `确认从${this.actionTitle}中移除成员吗？`,
-                    content: `移除后该账号在${this.actionTitle}内的相关信息将会被清除`,
-                    okText: '移除',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        if (app.currentDepartmentCode) {
-                            removeMember(member.code, app.currentDepartmentCode).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.members.splice(index, 1);
-                                notice({title: '移除成功'}, 'notice', 'success');
-                            });
-                        } else {
-                            del(member.code).then((res) => {
-                                if (!checkResponse(res)) {
-                                    return;
-                                }
-                                app.members.splice(index, 1);
-                                notice({title: '移除成功'}, 'notice', 'success');
-                            });
-                        }
-                        return Promise.resolve();
-                    }
-                });
-            },
-            emitEmpty() {
-                this.$refs.keywordInput.focus();
-                this.keyword = '';
-                this.requestData.keyword = '';
-                this.getMembers();
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    notice(`正在导入，请稍后...`, 'message', 'loading', 0);
-                    this.uploadLoading = true;
-                    return
-                }
-                if (info.file.status === 'done') {
-                    console.log(info);
-                    this.uploadLoading = false;
-                    if (checkResponse(info.file.response, true)) {
-                        const count = info.file.response.data;
-                        notice(`导入成功`, 'message', 'success');
-                        this.getMembers();
-                    }
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('文件不能超过2MB!')
-                }
-                return isLt2M
-            },
+      });
+    },
+    emitEmpty() {
+      this.$refs.keywordInput.focus();
+      this.keyword = "";
+      this.requestData.keyword = "";
+      this.getMembers();
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        notice(`正在导入，请稍后...`, "message", "loading", 0);
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        console.log(info);
+        this.uploadLoading = false;
+        if (checkResponse(info.file.response, true)) {
+          const count = info.file.response.data;
+          notice(`导入成功`, "message", "success");
+          this.getMembers();
         }
-    }
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("文件不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
 </script>
 
 <style lang="less">
-    .members-index {
-        margin: 24px auto;
-        display: flex;
-        flex-direction: row;
-        width: 1100px;
-        padding: 0 12px;
-
-        .layout-item {
-            background: #FFF;
-            width: 100%;
+.members-index {
+  margin: 24px auto;
+  display: flex;
+  flex-direction: row;
+  width: 1100px;
+  padding: 0 12px;
+
+  .layout-item {
+    background: #fff;
+    width: 100%;
+  }
+
+  .left {
+    padding: 12px 24px 12px 0;
+    width: 280px;
+
+    .left-content {
+      width: 255px;
+      height: 100%;
+      border-right: 1px solid #e8e8e8;
+
+      .content-item {
+        padding: 6px 24px 12px 24px;
+      }
+
+      .search-content {
+        padding: 12px;
+
+        .anticon-close-circle {
+          cursor: pointer;
+          color: #ccc;
+          transition: color 0.3s;
+          font-size: 12px;
         }
 
-        .left {
-            padding: 12px 24px 12px 0;
-            width: 280px;
-
-            .left-content {
-                width: 255px;
-                height: 100%;
-                border-right: 1px solid #e8e8e8;
-
-                .content-item {
-                    padding: 6px 24px 12px 24px;
-                }
-
-                .search-content {
-                    padding: 12px;
-
-                    .anticon-close-circle {
-                        cursor: pointer;
-                        color: #ccc;
-                        transition: color 0.3s;
-                        font-size: 12px;
-                    }
-
-                    .anticon-close-circle:hover {
-                        color: #999;
-                    }
-
-                    .anticon-close-circle:active {
-                        color: #666;
-                    }
-                }
-
-                .menus {
-                }
+        .anticon-close-circle:hover {
+          color: #999;
+        }
 
-                .actions {
-                    display: flex;
-                    justify-content: space-between;
-                    padding-bottom: 0;
-                }
+        .anticon-close-circle:active {
+          color: #666;
+        }
+      }
 
-                .department {
-                    padding: 6px 12px 12px 12px;
+      .menus {
+      }
 
-                    .ant-tree li {
-                        position: relative;
+      .actions {
+        display: flex;
+        justify-content: space-between;
+        padding-bottom: 0;
+      }
 
-                        .ant-tree-node-content-wrapper {
-                            height: 40px;
-                            line-height: 40px;
-                            width: 100%;
+      .department {
+        padding: 6px 12px 12px 12px;
 
-                            &.ant-tree-node-selected, &:hover {
-                                background-color: #f5f5f5;
-                            }
-                        }
+        .ant-tree li {
+          position: relative;
 
-                        .ant-tree-iconEle {
-                            height: 40px;
-                            line-height: 40px;
-                        }
+          .ant-tree-node-content-wrapper {
+            height: 40px;
+            line-height: 40px;
+            width: 100%;
 
-                        .ant-tree-switcher {
-                            position: absolute;
-                            right: 0;
-                            height: 40px;
-                            line-height: 40px;
+            &.ant-tree-node-selected,
+            &:hover {
+              background-color: #f5f5f5;
+            }
+          }
 
-                            .ant-tree-switcher-loading-icon {
-                                height: 40px;
-                            }
-                        }
-                    }
-                }
+          .ant-tree-iconEle {
+            height: 40px;
+            line-height: 40px;
+          }
 
-            }
+          .ant-tree-switcher {
+            position: absolute;
+            right: 0;
+            height: 40px;
+            line-height: 40px;
 
-            .ant-menu-root {
-                border-right: none;
+            .ant-tree-switcher-loading-icon {
+              height: 40px;
             }
+          }
         }
+      }
+    }
 
-        .right {
-            padding: 24px 12px 12px 0;
-
-            .header {
-                padding-right: 12px;
-                display: flex;
-                justify-content: space-between;
-                border-bottom: 1px solid #e8e8e8;
-                padding-bottom: 24px;
+    .ant-menu-root {
+      border-right: none;
+    }
+  }
 
-                .title {
-                    font-size: 18px;
-                }
+  .right {
+    padding: 24px 12px 12px 0;
 
-                .actions {
-                    a {
-                        margin-left: 12px;
-                    }
-                }
-            }
+    .header {
+      padding-right: 12px;
+      display: flex;
+      justify-content: space-between;
+      border-bottom: 1px solid #e8e8e8;
+      padding-bottom: 24px;
 
-            .members-content {
-                height: 75vh;
+      .title {
+        font-size: 18px;
+      }
 
-                .member-list {
-                    margin-right: 12px;
-                }
-            }
+      .actions {
+        a {
+          margin-left: 12px;
         }
+      }
     }
 
+    .members-content {
+      height: 75vh;
+
+      .member-list {
+        margin-right: 12px;
+      }
+    }
+  }
+}
 </style>
diff --git a/src/views/project/archive/index.vue b/src/views/project/archive/index.vue
index 1e82e36..d291695 100644
--- a/src/views/project/archive/index.vue
+++ b/src/views/project/archive/index.vue
@@ -13,7 +13,9 @@
           slot="loadMore"
           :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
         >
-          <a-spin v-if="loadingMore" />
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
           <a-button v-else @click="onLoadMore">查看更多项目</a-button>
         </div>
         <a-list-item slot="renderItem" slot-scope="item,index">
diff --git a/src/views/project/list/index.vue b/src/views/project/list/index.vue
index c0c7d87..fd40e42 100644
--- a/src/views/project/list/index.vue
+++ b/src/views/project/list/index.vue
@@ -46,7 +46,9 @@
           slot="loadMore"
           :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
         >
-          <a-spin v-if="loadingMore" />
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
           <a-button v-else @click="onLoadMore">查看更多项目</a-button>
         </div>
         <a-list-item slot="renderItem" slot-scope="item,index">
diff --git a/src/views/project/recycle/index.vue b/src/views/project/recycle/index.vue
index fa65db7..f367451 100644
--- a/src/views/project/recycle/index.vue
+++ b/src/views/project/recycle/index.vue
@@ -1,158 +1,161 @@
 <template>
-    <div class="project-recycle-index">
-        <wrapper-content :showHeader="false">
-            <a-list
-                    class="project-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-                    :locale="{emptyText:''}"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多项目</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                     <span slot="actions">
-                         <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
-                             <a-icon type="undo"/>
-                         </a-tooltip>
-                    </span>
-                   <!-- <span slot="actions" @click="doAction(item,'del',index)">
+  <div class="project-recycle-index">
+    <wrapper-content :showHeader="false">
+      <a-list
+        class="project-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+        :locale="{emptyText:''}"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <span slot="actions">
+            <a-tooltip title="恢复项目" @click="doAction(item,'recovery',index)">
+              <a-icon type="undo" />
+            </a-tooltip>
+          </span>
+          <!-- <span slot="actions" @click="doAction(item,'del',index)">
                          <a-tooltip title="彻底删除">
                               <a-icon type="delete"/>
                          </a-tooltip>
-                    </span>-->
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <router-link :to="'/project/space/task/' + item.code"  slot="title">{{item.name}}</router-link>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="other-info muted">
-                        <div class="info-item">
-                            <span>移动日期</span>
-                            <span>{{moment(item.deleted_time).format('YYYY-MM-DD')}}</span>
-                        </div>
-                    </div>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-    </div>
+          </span>-->
+          <a-list-item-meta :description="item.description">
+            <router-link :to="'/project/space/task/' + item.code" slot="title">{{item.name}}</router-link>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="other-info muted">
+            <div class="info-item">
+              <span>移动日期</span>
+              <span>{{moment(item.deleted_time).format('YYYY-MM-DD')}}</span>
+            </div>
+          </div>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+  </div>
 </template>
 <script>
-    import {list, doData, del} from '@/api/project';
-    import {checkResponse} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import moment from 'moment';
-    import {recovery, recycle} from "../../../api/project";
+import { list, doData, del } from "@/api/project";
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { recovery, recycle } from "../../../api/project";
 
-    export default {
-        mixins: [pagination],
-        data() {
-            return {
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                showInviteMember: false,
-                currentProject: {},
-                currentProjectId: 0,
-                newData: {
-                    id: 0
-                },
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            moment,
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.pagination.pageSize = 100;
-                    this.showLoadingMore = false;
-                }
-                this.requestData.selectBy = 'deleted';
-                app.loading = true;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            inviteProjectMember(item){
-                this.currentProject = item;
-                this.currentProjectId = item.id;
-                this.showInviteMember = true;
-            },
-            doAction(record, action,index) {
-                this.currentProject = record;
-                let app = this;
-                app.newData = {id: 0};
-                 if (action == 'recovery') {
-                    this.$confirm({
-                        title: '确定恢复项目？',
-                                content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
-                        okText: '恢复项目',
-                        okType: 'primary',
-                        cancelText: '再想想',
-                        onOk() {
-                            recovery(record.code).then(()=>{
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-        }
-    }
+export default {
+  mixins: [pagination],
+  data() {
+    return {
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      showInviteMember: false,
+      currentProject: {},
+      currentProjectId: 0,
+      newData: {
+        id: 0,
+      },
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 100;
+        this.showLoadingMore = false;
+      }
+      this.requestData.selectBy = "deleted";
+      app.loading = true;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    inviteProjectMember(item) {
+      this.currentProject = item;
+      this.currentProjectId = item.id;
+      this.showInviteMember = true;
+    },
+    doAction(record, action, index) {
+      this.currentProject = record;
+      let app = this;
+      app.newData = { id: 0 };
+      if (action == "recovery") {
+        this.$confirm({
+          title: "确定恢复项目？",
+          content: `恢复「${this.currentProject.name}」后就可以正常使用了`,
+          okText: "恢复项目",
+          okType: "primary",
+          cancelText: "再想想",
+          onOk() {
+            recovery(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+  },
+};
 </script>
 <style lang="less">
-    @import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
+@import "../../../../node_modules/ant-design-vue/lib/style/themes/default";
 
-    .project-recycle-index {
-        .project-list {
-            .ant-list-item-meta-avatar {
-                .ant-avatar {
-                    width: 50px;
-                    height: 50px;
-                    border-radius: 3px;
-                }
-            }
+.project-recycle-index {
+  .project-list {
+    .ant-list-item-meta-avatar {
+      .ant-avatar {
+        width: 50px;
+        height: 50px;
+        border-radius: 3px;
+      }
+    }
 
-            .ant-list-item-content {
-                .other-info {
-                    display: flex;
+    .ant-list-item-content {
+      .other-info {
+        display: flex;
 
-                    .info-item {
-                        display: flex;
-                        flex-direction: column;
-                        padding-left: 48px;
-                    }
-                }
-            }
+        .info-item {
+          display: flex;
+          flex-direction: column;
+          padding-left: 48px;
+        }
+      }
+    }
 
-            .ant-list-item-action {
-                .anticon:hover {
-                    svg {
-                        color: @primary-color;
-                    }
-                }
-            }
+    .ant-list-item-action {
+      .anticon:hover {
+        svg {
+          color: @primary-color;
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/views/project/space/features.vue b/src/views/project/space/features.vue
index a87c18a..1e4ec26 100644
--- a/src/views/project/space/features.vue
+++ b/src/views/project/space/features.vue
@@ -93,7 +93,11 @@
           </div>
           <a-spin :spinning="loading" v-if="currentProjectFeatures">
             <template v-if="versionTotal">
-              <div class="version-group" :key="versionType" v-for="(versionItem,versionType) in versionList">
+              <div
+                class="version-group"
+                :key="versionType"
+                v-for="(versionItem,versionType) in versionList"
+              >
                 <a
                   style="cursor: pointer;display: block"
                   class="version-group-title muted m-l-sm m-b-sm"
@@ -232,6 +236,7 @@
               <p class="muted">暂无可用版本</p>
               <a-button type="primary" @click="createVersion">创建版本</a-button>
             </div>
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
           </a-spin>
         </div>
       </div>
diff --git a/src/views/project/space/files.vue b/src/views/project/space/files.vue
index 6dc8932..bce3909 100644
--- a/src/views/project/space/files.vue
+++ b/src/views/project/space/files.vue
@@ -49,7 +49,7 @@
       <div class="content-wrapper">
         <div class="content-item files-list">
           <div class="header">
-            <span class="title">我的文件</span>
+            <span class="title">项目文件</span>
             <div class="header-actions">
               <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
               <a-button id="upload-file" icon="up-circle" type="dashed" size="small">上传</a-button>
@@ -81,96 +81,103 @@
                   </a-tooltip>
                 </span>
               </a-list-item>
-              <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
-                <a-list-item-meta>
-                  <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
-                  <div slot="title">
-                    <a-tooltip :mouseEnterDelay="0.3">
-                      <template slot="title">
-                        <span>{{item.fullName}}</span>
-                      </template>
-                      <a-input
-                        :ref="`inputTitle${index}`"
-                        :auto-focus="true"
-                        v-model="item.title"
-                        v-show="item.editing"
-                        @pressEnter="onCellChange(item)"
-                        @blur="onCellChange(item)"
-                      ></a-input>
-                      <a
-                        class="text-default"
-                        target="_blank"
-                        :href="item | showPreviewUrl"
-                        :title="item.fullName"
-                        v-show="!item.editing"
-                      >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
-                    </a-tooltip>
-                  </div>
-                </a-list-item-meta>
-                <div class="other-info muted">
-                  <div class="info-item">
-                    <span>{{(formatSize(item.size))}}</span>
+              <template v-if="files.length>0">
+                <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
+                  <a-list-item-meta>
+                    <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
+                    <div slot="title">
+                      <a-tooltip :mouseEnterDelay="0.3">
+                        <template slot="title">
+                          <span>{{item.fullName}}</span>
+                        </template>
+                        <a-input
+                          :ref="`inputTitle${index}`"
+                          :auto-focus="true"
+                          v-model="item.title"
+                          v-show="item.editing"
+                          @pressEnter="onCellChange(item)"
+                          @blur="onCellChange(item)"
+                        ></a-input>
+                        <a
+                          class="text-default"
+                          target="_blank"
+                          :href="item | showPreviewUrl"
+                          :title="item.fullName"
+                          v-show="!item.editing"
+                        >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
+                      </a-tooltip>
+                    </div>
+                  </a-list-item-meta>
+                  <div class="other-info muted">
+                    <div class="info-item">
+                      <span>{{(formatSize(item.size))}}</span>
+                    </div>
+                    <div class="info-item">
+                      <a-tooltip :title="item.create_time">
+                        <span>{{ formatTime(item.create_time) }}</span>
+                      </a-tooltip>
+                    </div>
+                    <div class="info-item">
+                      <span>{{item.creatorName}}</span>
+                    </div>
                   </div>
-                  <div class="info-item">
-                    <a-tooltip :title="item.create_time">
-                      <span>{{ formatTime(item.create_time) }}</span>
+                  <span slot="actions">
+                    <a-tooltip title="下载">
+                      <a class="muted" target="_blank" :href="item.file_url">
+                        <a-icon type="download" />
+                      </a>
                     </a-tooltip>
-                  </div>
-                  <div class="info-item">
-                    <span>{{item.creatorName}}</span>
-                  </div>
-                </div>
-                <span slot="actions">
-                  <a-tooltip title="下载">
-                    <a class="muted" target="_blank" :href="item.file_url">
-                      <a-icon type="download" />
-                    </a>
-                  </a-tooltip>
-                </span>
-                <!-- <span slot="actions">
+                  </span>
+                  <!-- <span slot="actions">
                                      <a-tooltip title="更新">
                                          <a-icon type="upload"/>
                                      </a-tooltip>
-                </span>-->
-                <span slot="actions" @click="editFile(item,index)">
-                  <a-tooltip title="编辑">
-                    <a-icon type="edit" />
-                  </a-tooltip>
-                </span>
-                <a class="muted" slot="actions">
-                  <a-dropdown :trigger="['click']" placement="bottomRight">
-                    <a-tooltip :mouseEnterDelay="0.5">
-                      <template slot="title">
-                        <span>更多操作</span>
-                      </template>
-                      <a class="action-item muted">
-                        <a-icon type="down" />
-                      </a>
+                  </span>-->
+                  <span slot="actions" @click="editFile(item,index)">
+                    <a-tooltip title="编辑">
+                      <a-icon type="edit" />
                     </a-tooltip>
-                    <a-menu
-                      class="field-right-menu"
-                      v-clipboard="item.file_url"
-                      @click="doFile($event,item.code)"
-                      slot="overlay"
-                    >
-                      <a-menu-item key="copy">
-                        <a-icon type="link" />
-                        <span>复制链接</span>
-                      </a-menu-item>
-                      <a-menu-item key="delete">
-                        <a-icon type="delete" />
-                        <span>移到回收站</span>
-                      </a-menu-item>
-                    </a-menu>
-                  </a-dropdown>
-                </a>
-              </a-list-item>
+                  </span>
+                  <a class="muted" slot="actions">
+                    <a-dropdown :trigger="['click']" placement="bottomRight">
+                      <a-tooltip :mouseEnterDelay="0.5">
+                        <template slot="title">
+                          <span>更多操作</span>
+                        </template>
+                        <a class="action-item muted">
+                          <a-icon type="down" />
+                        </a>
+                      </a-tooltip>
+                      <a-menu
+                        class="field-right-menu"
+                        v-clipboard="item.file_url"
+                        @click="doFile($event,item.code)"
+                        slot="overlay"
+                      >
+                        <a-menu-item key="copy">
+                          <a-icon type="link" />
+                          <span>复制链接</span>
+                        </a-menu-item>
+                        <a-menu-item key="delete">
+                          <a-icon type="delete" />
+                          <span>移到回收站</span>
+                        </a-menu-item>
+                      </a-menu>
+                    </a-dropdown>
+                  </a>
+                </a-list-item>
+              </template>
+              <template v-else>
+                <a-empty description="无文件" />
+              </template>
               <div
                 v-if="showLoadingMore"
                 slot="loadMore"
                 :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
               >
-                <a-spin v-if="loadingMore" />
+                <a-spin v-if="loadingMore">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                </a-spin>
                 <a-button v-else @click="onLoadMore">查看更多文件</a-button>
               </div>
             </a-list>
diff --git a/src/views/project/space/overview.vue b/src/views/project/space/overview.vue
index 0422f2b..ab512f6 100644
--- a/src/views/project/space/overview.vue
+++ b/src/views/project/space/overview.vue
@@ -60,6 +60,7 @@
               :legend-visible="false"
               height="200px"
             ></ve-line>
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
           </a-spin>
         </div>
       </div>
@@ -121,7 +122,9 @@
                   slot="loadMore"
                   :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
                 >
-                  <a-spin v-if="loadingMore" />
+                  <a-spin v-if="loadingMore">
+                    <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                  </a-spin>
                   <a-button v-else @click="onLoadMore">查看更多动态</a-button>
                 </div>
                 <a-list-item :key="index" v-for="(item, index) in activities">
diff --git a/src/views/project/space/task.vue b/src/views/project/space/task.vue
index 964bcbf..50777f5 100644
--- a/src/views/project/space/task.vue
+++ b/src/views/project/space/task.vue
@@ -1,9 +1,5 @@
 <template>
-  <div
-    class="project-space-task"
-    ref="taskarea"
-    :class="project.task_board_theme"
-  >
+  <div class="project-space-task" ref="taskarea" :class="project.task_board_theme">
     <a-row class="project-navigation" align="middle" justify="center">
       <a-col class="project-nav-header" :span="8" :xs="24" :sm="24" :md="24" :lg="8">
         <a-breadcrumb>
@@ -87,7 +83,7 @@
           :id="stage.code"
           :class="{ 'fixed-creator': stage.fixedCreator == true}"
         >
-          <!--<a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">-->
+          <!--<a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading"><a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />-->
           <!--<a-tooltip placement="top" >
                      <template slot="title">
                          {{ stage.name }}
@@ -153,6 +149,7 @@
                 class="scrum-stage-content thin-scroll"
               >
                 <a-spin wrapperClassName="tasks-loading" :spinning="stage.tasksLoading">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
                   <!--未完成列表-->
                   <draggable
                     v-model="stage.unDoneTasks"
diff --git a/src/views/project/template/index.vue b/src/views/project/template/index.vue
index fb05b72..8c6aff4 100644
--- a/src/views/project/template/index.vue
+++ b/src/views/project/template/index.vue
@@ -1,339 +1,343 @@
 <template>
-    <div class="project-template-index">
-        <wrapper-content :showHeader="false">
-            <a-tabs :animated="false" v-model="viewType">
-                <a-tab-pane tab="自定义模板" key="0"></a-tab-pane>
-                <a-tab-pane tab="公共模板" key="1"></a-tab-pane>
-                <a-button type="primary" slot="tabBarExtraContent" icon="plus" @click="doAction(null,'new')">制作项目模板
-                </a-button>
-            </a-tabs>
-            <a-list
-                    class="default-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多模板</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                    <span slot="actions" v-if="!item.is_system" @click="doAction(item,'stages')">
-                         <a-tooltip title="任务列表">
-                              <a-icon type="bars"/>
-                         </a-tooltip>
-                    </span>
-                    <span slot="actions" v-if="!item.is_system" @click="doAction(item,'edit')">
-                         <a-tooltip title="编辑">
-                              <a-icon type="edit"/>
-                         </a-tooltip>
-                    </span>
-                    <span slot="actions" v-if="!item.is_system" @click="doAction(item,'del',index)">
-                         <a-tooltip title="删除">
-                              <a-icon type="delete"/>
-                         </a-tooltip>
-                    </span>
-                    <a-list-item-meta
-                            :description="item.description"
-                    >
-                        <span slot="title">{{item.name}}</span>
-                        <a-avatar slot="avatar" icon="user" :src="item.cover"/>
-                    </a-list-item-meta>
-                    <div class="other-info muted">
-                        <div class="info-item task" v-if="item.task_stages.length">
-                            <!--<span>任务流</span>-->
-                            <a-breadcrumb separator=">">
-                                <a-breadcrumb-item v-for="task in item.task_stages" :key="task.name">{{task.name}}
-                                </a-breadcrumb-item>
-                            </a-breadcrumb>
-                        </div>
-                    </div>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-        <a-modal
-                class="project-template-modal"
-                :width="360"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="project-template-index">
+    <wrapper-content :showHeader="false">
+      <a-tabs :animated="false" v-model="viewType">
+        <a-tab-pane tab="自定义模板" key="0"></a-tab-pane>
+        <a-tab-pane tab="公共模板" key="1"></a-tab-pane>
+        <a-button
+          type="primary"
+          slot="tabBarExtraContent"
+          icon="plus"
+          @click="doAction(null,'new')"
+        >制作项目模板</a-button>
+      </a-tabs>
+      <a-list
+        class="default-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
         >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="form"
-            >
-                <div class="cover-item">
-                    <template v-if="cover">
-                        <img class="avatar" :src="cover"/>
-                    </template>
-                    <span class="no-avatar" v-show="!cover"></span>
-                    <a-upload
-                            name="cover"
-                            class="cover-uploader"
-                            :showUploadList="false"
-                            :headers="headers"
-                            :action="uploadAction"
-                            :beforeUpload="beforeUpload"
-                            @change="handleChange"
-                    >
-                        <a-button icon="upload" class="upload">上传封面</a-button>
-                        <span class="upload-tips muted">最佳图片比例为300*150</span>
-                    </a-upload>
-                </div>
-                <a-form-item
-                >
-                    <a-input placeholder='模板名称（必填）'
-                             v-decorator="[
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
+          <a-button v-else @click="onLoadMore">查看更多模板</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <span slot="actions" v-if="!item.is_system" @click="doAction(item,'stages')">
+            <a-tooltip title="任务列表">
+              <a-icon type="bars" />
+            </a-tooltip>
+          </span>
+          <span slot="actions" v-if="!item.is_system" @click="doAction(item,'edit')">
+            <a-tooltip title="编辑">
+              <a-icon type="edit" />
+            </a-tooltip>
+          </span>
+          <span slot="actions" v-if="!item.is_system" @click="doAction(item,'del',index)">
+            <a-tooltip title="删除">
+              <a-icon type="delete" />
+            </a-tooltip>
+          </span>
+          <a-list-item-meta :description="item.description">
+            <span slot="title">{{item.name}}</span>
+            <a-avatar slot="avatar" icon="user" :src="item.cover" />
+          </a-list-item-meta>
+          <div class="other-info muted">
+            <div class="info-item task" v-if="item.task_stages.length">
+              <!--<span>任务流</span>-->
+              <a-breadcrumb separator=">">
+                <a-breadcrumb-item v-for="task in item.task_stages" :key="task.name">{{task.name}}</a-breadcrumb-item>
+              </a-breadcrumb>
+            </div>
+          </div>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+    <a-modal
+      class="project-template-modal"
+      :width="360"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="form">
+        <div class="cover-item">
+          <template v-if="cover">
+            <img class="avatar" :src="cover" />
+          </template>
+          <span class="no-avatar" v-show="!cover"></span>
+          <a-upload
+            name="cover"
+            class="cover-uploader"
+            :showUploadList="false"
+            :headers="headers"
+            :action="uploadAction"
+            :beforeUpload="beforeUpload"
+            @change="handleChange"
+          >
+            <a-button icon="upload" class="upload">上传封面</a-button>
+            <span class="upload-tips muted">最佳图片比例为300*150</span>
+          </a-upload>
+        </div>
+        <a-form-item>
+          <a-input
+            placeholder="模板名称（必填）"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入模板名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <a-textarea placeholder='模板说明'
-                                :rows="2"
-                                v-decorator="['description']"
-                    />
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">保存模板
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <a-textarea placeholder="模板说明" :rows="2" v-decorator="['description']" />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >保存模板</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 <script>
-    import {list, doData, del} from '@/api/projectTemplate';
-    import {checkResponse, getApiUrl, getBase64} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
-    import config from "@/config/config"
-    import {getAuthorization} from "../../../assets/js/utils";
+import { list, doData, del } from "@/api/projectTemplate";
+import { checkResponse, getApiUrl, getBase64 } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import config from "@/config/config";
+import { getAuthorization } from "../../../assets/js/utils";
 
-    export default {
-        components: {},
-        mixins: [pagination],
-        data() {
-            return {
-                viewType: '0',
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                currentTemplate: {},
-                cover:'https://beta.vilson.xyz/static/image/default/project-cover.png',
-                // cover: config.PROD_URL + '/static/image/default/cover.png',
-                newData: {
-                    id: 0,
-                },
-                form: this.$form.createForm(this),
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑模板',
-                },
-                uploadLoading: false,
-                uploadAction: getApiUrl('project/project_template/uploadCover'),
-            }
-        },
-        computed: {
-            headers() {
-                return getAuthorization();
-            }
-        },
-        watch: {
-            $route() {
-                this.init();
-            },
-            viewType() {
-                this.init();
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.showLoadingMore = false;
-                }
-                app.loading = true;
-                app.requestData.viewType = app.viewType;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            doAction(record, action, index) {
-                this.currentTemplate = record;
-                let app = this;
-                app.newData = {code: ''};
-                if (action == 'edit' || action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '自定义模板';
-                    if (action == 'edit') {
-                        //modal没显示之前不会实例化modal子元素，延迟处理
-                        setTimeout(function () {
-                            app.actionInfo.modalTitle = '编辑模板';
-                            app.form.setFieldsValue({
-                                name: record.name,
-                                description: record.description,
-                            });
-                            app.cover = record.cover;
-                            app.newData = record;
-                        }, 0);
-                    }
-                } else if (action == 'del') {
-                    this.$confirm({
-                        title: '确定删除模板？',
-                        content: `删除模板「${this.currentTemplate.name}」后已从该模板创建的项目不受影响`,
-                        okText: '删除模板',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            del(record.code).then(() => {
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                } else if (action == 'stages') {
-                    const {href} = this.$router.resolve({
-                        path: '/project/template/taskstages/' + record.code + '?name=' + record.name,
-                    });
-                    window.open(href, '_blank');
-                }
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                obj.cover = this.cover;
-                if (app.newData.code) {
-                    //编辑
-                    obj.code = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.form.resetFields();
-                    app.newData = {code: ''};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
-
-                });
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    this.uploadLoading = true;
-                    return
-                }
-                if (info.file.status === 'done') {
-                    getBase64(info.file.originFileObj, (imageUrl) => {
-                        this.cover = info.file.response.data.url;
-                        this.uploadLoading = false;
-                    })
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('图片不能超过2MB!')
-                }
-                return isLt2M
-            },
+export default {
+  components: {},
+  mixins: [pagination],
+  data() {
+    return {
+      viewType: "0",
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      currentTemplate: {},
+      cover: "https://beta.vilson.xyz/static/image/default/project-cover.png",
+      // cover: config.PROD_URL + '/static/image/default/cover.png',
+      newData: {
+        id: 0,
+      },
+      form: this.$form.createForm(this),
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑模板",
+      },
+      uploadLoading: false,
+      uploadAction: getApiUrl("project/project_template/uploadCover"),
+    };
+  },
+  computed: {
+    headers() {
+      return getAuthorization();
+    },
+  },
+  watch: {
+    $route() {
+      this.init();
+    },
+    viewType() {
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.showLoadingMore = false;
+      }
+      app.loading = true;
+      app.requestData.viewType = app.viewType;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    doAction(record, action, index) {
+      this.currentTemplate = record;
+      let app = this;
+      app.newData = { code: "" };
+      if (action == "edit" || action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "自定义模板";
+        if (action == "edit") {
+          //modal没显示之前不会实例化modal子元素，延迟处理
+          setTimeout(function () {
+            app.actionInfo.modalTitle = "编辑模板";
+            app.form.setFieldsValue({
+              name: record.name,
+              description: record.description,
+            });
+            app.cover = record.cover;
+            app.newData = record;
+          }, 0);
         }
-    }
-</script>
-<style lang="less">
-    .project-template-index {
-        .ant-breadcrumb > span:last-child {
-            color: rgba(0, 0, 0, 0.45) !important;
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定删除模板？",
+          content: `删除模板「${this.currentTemplate.name}」后已从该模板创建的项目不受影响`,
+          okText: "删除模板",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            del(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      } else if (action == "stages") {
+        const { href } = this.$router.resolve({
+          path:
+            "/project/template/taskstages/" +
+            record.code +
+            "?name=" +
+            record.name,
+        });
+        window.open(href, "_blank");
+      }
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
         }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      obj.cover = this.cover;
+      if (app.newData.code) {
+        //编辑
+        obj.code = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
 
-        .ant-list-item-content {
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
         }
-    }
+        app.form.resetFields();
+        app.newData = { code: "" };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        getBase64(info.file.originFileObj, (imageUrl) => {
+          this.cover = info.file.response.data.url;
+          this.uploadLoading = false;
+        });
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("图片不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
+</script>
+<style lang="less">
+.project-template-index {
+  .ant-breadcrumb > span:last-child {
+    color: rgba(0, 0, 0, 0.45) !important;
+  }
 
-    .project-template-modal {
-        .cover-item {
-            display: flex;
-            flex-direction: column;
+  .ant-list-item-content {
+  }
+}
 
-            .avatar, .no-avatar {
-                width: 300px;
-                height: 150px;
-                line-height: 150px;
-                font-size: 18px;
-                border-radius: 4px;
-            }
+.project-template-modal {
+  .cover-item {
+    display: flex;
+    flex-direction: column;
 
-            .no-avatar {
-                box-sizing: border-box;
-                margin: 0;
-                padding: 0;
-                list-style: none;
-                text-align: center;
-                background: #ccc;
-                color: #fff;
-                white-space: nowrap;
-                position: relative;
-                overflow: hidden;
-                vertical-align: middle;
-                display: block;
-            }
+    .avatar,
+    .no-avatar {
+      width: 300px;
+      height: 150px;
+      line-height: 150px;
+      font-size: 18px;
+      border-radius: 4px;
+    }
 
-            .upload {
-                margin: 18px 0;
-            }
+    .no-avatar {
+      box-sizing: border-box;
+      margin: 0;
+      padding: 0;
+      list-style: none;
+      text-align: center;
+      background: #ccc;
+      color: #fff;
+      white-space: nowrap;
+      position: relative;
+      overflow: hidden;
+      vertical-align: middle;
+      display: block;
+    }
 
-            .upload-tips {
-                margin-left: 12px;
-            }
-        }
+    .upload {
+      margin: 18px 0;
+    }
 
-        .cover-uploader {
-            display: block;
-        }
+    .upload-tips {
+      margin-left: 12px;
     }
+  }
+
+  .cover-uploader {
+    display: block;
+  }
+}
 </style>
diff --git a/src/views/project/template/taskStages.vue b/src/views/project/template/taskStages.vue
index 3b89599..1e820bd 100644
--- a/src/views/project/template/taskStages.vue
+++ b/src/views/project/template/taskStages.vue
@@ -1,237 +1,239 @@
 <template>
-    <div class="project-template-index">
-        <wrapper-content :showHeader="false">
-            <div class="action">
-                <a-button type="primary" icon="plus" @click="doAction(null,'new')">添加任务</a-button>
-            </div>
-            <h3>「{{$route.query.name}}」任务列表</h3>
-            <a-list
-                    class="default-list"
-                    :loading="loading"
-                    itemLayout="horizontal"
-                    :dataSource="dataSource"
-            >
-                <div v-if="showLoadingMore" slot="loadMore"
-                     :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }">
-                    <a-spin v-if="loadingMore"/>
-                    <a-button v-else @click="onLoadMore">查看更多任务</a-button>
-                </div>
-                <a-list-item slot="renderItem" slot-scope="item,index">
-                    <span slot="actions" @click="doAction(item,'edit')">
-                         <a-tooltip title="编辑">
-                              <a-icon type="edit"/>
-                         </a-tooltip>
-                    </span>
-                    <span slot="actions" @click="doAction(item,'del',index)">
-                         <a-tooltip title="删除">
-                              <a-icon type="delete"/>
-                         </a-tooltip>
-                    </span>
-                    <a-list-item-meta
-                            :description="'排序：'+item.sort"
-                    >
-                        <span slot="title">{{item.name}}</span>
-                    </a-list-item-meta>
-                </a-list-item>
-            </a-list>
-        </wrapper-content>
-        <a-modal
-                :width="360"
-                v-model="actionInfo.modalStatus"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
+  <div class="project-template-index">
+    <wrapper-content :showHeader="false">
+      <div class="action">
+        <a-button type="primary" icon="plus" @click="doAction(null,'new')">添加任务</a-button>
+      </div>
+      <h3>「{{$route.query.name}}」任务列表</h3>
+      <a-list
+        class="default-list"
+        :loading="loading"
+        itemLayout="horizontal"
+        :dataSource="dataSource"
+      >
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
         >
-            <a-form
-                    @submit.prevent="handleSubmit"
-                    :form="form"
-            >
-                <a-form-item
-                >
-                    <a-input placeholder='任务名称（必填）'
-                             v-decorator="[
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
+          <a-button v-else @click="onLoadMore">查看更多任务</a-button>
+        </div>
+        <a-list-item slot="renderItem" slot-scope="item,index">
+          <span slot="actions" @click="doAction(item,'edit')">
+            <a-tooltip title="编辑">
+              <a-icon type="edit" />
+            </a-tooltip>
+          </span>
+          <span slot="actions" @click="doAction(item,'del',index)">
+            <a-tooltip title="删除">
+              <a-icon type="delete" />
+            </a-tooltip>
+          </span>
+          <a-list-item-meta :description="'排序：'+item.sort">
+            <span slot="title">{{item.name}}</span>
+          </a-list-item-meta>
+        </a-list-item>
+      </a-list>
+    </wrapper-content>
+    <a-modal
+      :width="360"
+      v-model="actionInfo.modalStatus"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <a-form @submit.prevent="handleSubmit" :form="form">
+        <a-form-item>
+          <a-input
+            placeholder="任务名称（必填）"
+            v-decorator="[
                                             'name',
                                             {rules: [{ required: true, message: '请输入任务名称' }]}
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                        help="排序，值越大越靠前，默认0"
-                >
-                    <a-input-number style="width: 100%" :min="0" placeholder='排序'
-                             v-decorator="[
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item help="排序，值越大越靠前，默认0">
+          <a-input-number
+            style="width: 100%"
+            :min="0"
+            placeholder="排序"
+            v-decorator="[
                                             'sort',
-                                            ]"/>
-                </a-form-item>
-                <a-form-item
-                >
-                    <div class="action-btn">
-                        <a-button type="primary" htmlType='submit'
-                                  block
-                                  size="large"
-                                  :loading="actionInfo.confirmLoading"
-                                  class="middle-btn">保存任务
-                        </a-button>
-                    </div>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+                                            ]"
+          />
+        </a-form-item>
+        <a-form-item>
+          <div class="action-btn">
+            <a-button
+              type="primary"
+              htmlType="submit"
+              block
+              size="large"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >保存任务</a-button>
+          </div>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 <script>
-    import {list, doData, del} from '@/api/taskStagesTemplate';
-    import {checkResponse, getBase64} from '@/assets/js/utils';
-    import pagination from "@/mixins/pagination";
+import { list, doData, del } from "@/api/taskStagesTemplate";
+import { checkResponse, getBase64 } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
 
-    export default {
-        components: {},
-        mixins: [pagination],
-        data() {
-            return {
-                dataSource: [],
-                loading: true,
-                showLoadingMore: false,
-                loadingMore: false,
-                currentTemplate: {},
-                newData: {
-                    id: 0,
-                },
-                form: this.$form.createForm(this),
-                searchForm: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑任务',
-                },
-            }
-        },
-        watch: {
-            $route() {
-                this.init();
-            },
-            viewType() {
-                this.init();
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init(reset = true) {
-                let app = this;
-                if (reset) {
-                    this.dataSource = [];
-                    this.pagination.page = 1;
-                    this.showLoadingMore = false;
-                }
-                app.loading = true;
-                app.requestData.code = app.$route.params.code;
-                list(app.requestData).then(res => {
-                    app.dataSource = app.dataSource.concat(res.data.list);
-                    app.pagination.total = res.data.total;
-                    app.showLoadingMore = app.pagination.total > app.dataSource.length;
-                    app.loading = false;
-                    app.loadingMore = false
-                });
-            },
-            onLoadMore() {
-                this.loadingMore = true;
-                this.pagination.page++;
-                this.init(false);
-            },
-            doAction(record, action, index) {
-                this.currentTemplate = record;
-                let app = this;
-                app.newData = {code: ''};
-                if (action == 'edit' || action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '添加任务';
-                    if (action == 'edit') {
-                        //modal没显示之前不会实例化modal子元素，延迟处理
-                        setTimeout(function () {
-                            app.actionInfo.modalTitle = '编辑任务';
-                            app.form.setFieldsValue({
-                                name: record.name,
-                                sort: record.sort,
-                            });
-                            app.cover = record.cover;
-                            app.newData = record;
-                        }, 0);
-                    }
-                } else if (action == 'del') {
-                    this.$confirm({
-                        title: '确定删除任务？',
-                        content: `删除任务「${this.currentTemplate.name}」后已以该任务创建的项目不受影响`,
-                        okText: '删除任务',
-                        okType: 'danger',
-                        cancelText: '再想想',
-                        onOk() {
-                            del(record.code).then(() => {
-                                app.dataSource.splice(index, 1);
-                                // app.init();
-                            });
-                            return Promise.resolve();
-                        }
-                    });
-                }
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                obj.template_code = this.$route.params.code;
-                if (app.newData.code) {
-                    //编辑
-                    obj.code = app.newData.code;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newData);
-                }
-
-                doData(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
-                    }
-                    app.form.resetFields();
-                    app.newData = {code: ''};
-                    app.actionInfo.modalStatus = false;
-                    app.init();
+export default {
+  components: {},
+  mixins: [pagination],
+  data() {
+    return {
+      dataSource: [],
+      loading: true,
+      showLoadingMore: false,
+      loadingMore: false,
+      currentTemplate: {},
+      newData: {
+        id: 0,
+      },
+      form: this.$form.createForm(this),
+      searchForm: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑任务",
+      },
+    };
+  },
+  watch: {
+    $route() {
+      this.init();
+    },
+    viewType() {
+      this.init();
+    },
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.dataSource = [];
+        this.pagination.page = 1;
+        this.showLoadingMore = false;
+      }
+      app.loading = true;
+      app.requestData.code = app.$route.params.code;
+      list(app.requestData).then((res) => {
+        app.dataSource = app.dataSource.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.dataSource.length;
+        app.loading = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    doAction(record, action, index) {
+      this.currentTemplate = record;
+      let app = this;
+      app.newData = { code: "" };
+      if (action == "edit" || action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "添加任务";
+        if (action == "edit") {
+          //modal没显示之前不会实例化modal子元素，延迟处理
+          setTimeout(function () {
+            app.actionInfo.modalTitle = "编辑任务";
+            app.form.setFieldsValue({
+              name: record.name,
+              sort: record.sort,
+            });
+            app.cover = record.cover;
+            app.newData = record;
+          }, 0);
+        }
+      } else if (action == "del") {
+        this.$confirm({
+          title: "确定删除任务？",
+          content: `删除任务「${this.currentTemplate.name}」后已以该任务创建的项目不受影响`,
+          okText: "删除任务",
+          okType: "danger",
+          cancelText: "再想想",
+          onOk() {
+            del(record.code).then(() => {
+              app.dataSource.splice(index, 1);
+              // app.init();
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      obj.template_code = this.$route.params.code;
+      if (app.newData.code) {
+        //编辑
+        obj.code = app.newData.code;
+      } else {
+        //新增
+        Object.assign(obj, app.newData);
+      }
 
-                });
-            },
-            handleChange(info) {
-                if (info.file.status === 'uploading') {
-                    this.uploadLoading = true;
-                    return
-                }
-                if (info.file.status === 'done') {
-                    getBase64(info.file.originFileObj, (imageUrl) => {
-                        this.cover = info.file.response.data.url;
-                        this.uploadLoading = false;
-                    })
-                }
-            },
-            beforeUpload(file) {
-                const isLt2M = file.size / 1024 / 1024 < 2;
-                if (!isLt2M) {
-                    this.$message.error('图片不能超过2MB!')
-                }
-                return isLt2M
-            },
+      doData(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
         }
-    }
+        app.form.resetFields();
+        app.newData = { code: "" };
+        app.actionInfo.modalStatus = false;
+        app.init();
+      });
+    },
+    handleChange(info) {
+      if (info.file.status === "uploading") {
+        this.uploadLoading = true;
+        return;
+      }
+      if (info.file.status === "done") {
+        getBase64(info.file.originFileObj, (imageUrl) => {
+          this.cover = info.file.response.data.url;
+          this.uploadLoading = false;
+        });
+      }
+    },
+    beforeUpload(file) {
+      const isLt2M = file.size / 1024 / 1024 < 2;
+      if (!isLt2M) {
+        this.$message.error("图片不能超过2MB!");
+      }
+      return isLt2M;
+    },
+  },
+};
 </script>
 <style lang="less">
 </style>
diff --git a/src/views/system/config/menu.vue b/src/views/system/config/menu.vue
index a0f3417..2411e46 100644
--- a/src/views/system/config/menu.vue
+++ b/src/views/system/config/menu.vue
@@ -1,100 +1,104 @@
 <template>
-    <div class="admin-menu">
-        <wrapper-content>
-            <div class="action">
-                <Button type="primary" icon="plus" @click="rowClick(null,'new')">添加</Button>
-            </div>
-            <Table :columns="columns" :dataSource="dataSource" :loading="loading" :pagination="false">
-                <template slot="url" slot-scope="text,record,index">
-                    <span v-if="record.params">{{record.url + '/' + record.params}}</span>
-                    <span v-else>{{record.url}}</span>
-                    <span v-if="record.values !== null && record.values !== ''"> - {{record.values}}</span>
-                </template>
-                <template slot="status" slot-scope="text,record,index">
-                    <span class="success-color" v-if="record.status">使用中</span>
-                    <span v-else>已禁用</span>
-                </template>
-                <template slot="action" slot-scope="text,record,index">
-                    <a :disabled="record.dept == 3" @click="rowClick(record,'add')">添加下级</a>
-                    <Divider type="vertical"/>
-                    <a @click="rowClick(record,'edit')">编辑</a>
-                    <Divider type="vertical"/>
-                    <a @click="rowClick(record,'status')"><span v-if="record.status">禁用</span><span v-else>启用</span></a>
-                    <Divider type="vertical"/>
-                    <a @click="rowClick(record,'del')">删除</a>
-                </template>
-            </Table>
-        </wrapper-content>
-        <Modal
-                v-model="actionInfo.modalStatus"
-                :width="800"
-                :title="actionInfo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                :footer="null"
-        >
-            <Form
-                    :autoFormCreate="(form)=>{this.form = form}"
-                    @submit.prevent="handleSubmit"
+  <div class="admin-menu">
+    <wrapper-content>
+      <div class="action">
+        <Button type="primary" icon="plus" @click="rowClick(null,'new')">添加</Button>
+      </div>
+      <Table :columns="columns" :dataSource="dataSource" :loading="loading" :pagination="false">
+        <template slot="url" slot-scope="text,record,index">
+          <span v-if="record.params">{{record.url + '/' + record.params}}</span>
+          <span v-else>{{record.url}}</span>
+          <span v-if="record.values !== null && record.values !== ''">- {{record.values}}</span>
+        </template>
+        <template slot="status" slot-scope="text,record,index">
+          <span class="success-color" v-if="record.status">使用中</span>
+          <span v-else>已禁用</span>
+        </template>
+        <template slot="action" slot-scope="text,record,index">
+          <a :disabled="record.dept == 3" @click="rowClick(record,'add')">添加下级</a>
+          <Divider type="vertical" />
+          <a @click="rowClick(record,'edit')">编辑</a>
+          <Divider type="vertical" />
+          <a @click="rowClick(record,'status')">
+            <span v-if="record.status">禁用</span>
+            <span v-else>启用</span>
+          </a>
+          <Divider type="vertical" />
+          <a @click="rowClick(record,'del')">删除</a>
+        </template>
+      </Table>
+    </wrapper-content>
+    <Modal
+      v-model="actionInfo.modalStatus"
+      :width="800"
+      :title="actionInfo.modalTitle"
+      :bodyStyle="{paddingBottom:'1px'}"
+      :footer="null"
+    >
+      <Form :autoFormCreate="(form)=>{this.form = form}" @submit.prevent="handleSubmit">
+        <a-row :gutter="24">
+          <a-col :span="12">
+            <FormItem
+              :form="form"
+              label="名称"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="title"
+              :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入名称' }]}"
+              help="必填，请填写菜单名称（如：系统管理），建议字符不要太长，一般4-6个汉字"
             >
-                <a-row :gutter="24">
-                    <a-col :span="12">
-                        <FormItem
-                        :form="form"
-                        label='名称'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="title"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入名称' }]}"
-                        help='必填，请填写菜单名称（如：系统管理），建议字符不要太长，一般4-6个汉字'
-                >
-                    <Input placeholder='菜单名称'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='地址'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="url"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入路由地址' }]}"
-                        help='必填，请填写路由地址（如：admin/user/index，对应的文件位于：views/admin/user/index.vue）。如果是上级菜单时，请填写"#"符号，不要填写路由地址。'
-                >
-                    <Input placeholder='路由地址'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='路径'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="file_path"
-                        help='选填，文件路径。默认与地址相同，特殊的文件路径可以在此定义'
-                >
-                    <Input placeholder='路由地址'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <a-form-item
-                        label='节点'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="node"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '请绑定权限节点' }]}"
-                        help='必填，将当前路由与权限节点进行绑定，没有该节点权限的菜单将会被隐藏。不进行绑定，请填写"#"符号。'
-                >
-                    <a-select
-                            showSearch
-                            placeholder="请选择权限节点"
-                            :filterOption="false"
-                            @search="fetchNode"
-                            @change="handleChange"
-                            :notFoundContent="fetching ? undefined : null"
-                    >
-                        <a-spin v-if="fetching" slot="notFoundContent" size="small"/>
-                        <a-select-option v-for="node in nodeList" :key="node.node">{{node.node}} - {{node.title}}
-                        </a-select-option>
-                    </a-select>
-                    <!-- <a-tree-select
+              <Input placeholder="菜单名称" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="地址"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="url"
+              :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入路由地址' }]}"
+              help="必填，请填写路由地址（如：admin/user/index，对应的文件位于：views/admin/user/index.vue）。如果是上级菜单时，请填写"#"符号，不要填写路由地址。"
+            >
+              <Input placeholder="路由地址" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="路径"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="file_path"
+              help="选填，文件路径。默认与地址相同，特殊的文件路径可以在此定义"
+            >
+              <Input placeholder="路由地址" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item
+              label="节点"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="node"
+              :fieldDecoratorOptions="{rules: [{ required: true, message: '请绑定权限节点' }]}"
+              help="必填，将当前路由与权限节点进行绑定，没有该节点权限的菜单将会被隐藏。不进行绑定，请填写"#"符号。"
+            >
+              <a-select
+                showSearch
+                placeholder="请选择权限节点"
+                :filterOption="false"
+                @search="fetchNode"
+                @change="handleChange"
+                :notFoundContent="fetching ? undefined : null"
+              >
+                <a-spin v-if="fetching" slot="notFoundContent" size="small">
+                  <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+                </a-spin>
+                <a-select-option
+                  v-for="node in nodeList"
+                  :key="node.node"
+                >{{node.node}} - {{node.title}}</a-select-option>
+              </a-select>
+              <!-- <a-tree-select
                              showSearch
                              treeNodeFilterProp="title"
                              :showCheckedStrategy="SHOW_ALL"
@@ -104,421 +108,438 @@
                              placeholder='请选择权限节点'
                              treeDefaultExpandAll
                      >
-                     </a-tree-select>-->
-                </a-form-item>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='排序'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="sort"
-                        :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入排序' }],initialValue:0}"
-                        help='必填，整数。数字越小越靠前，最小值为0。'
-                >
-                    <Input placeholder='排序'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='参数'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="params"
-                        help='选填，请填写路由的额外参数（如：:id，则路由为：admin/user/index/:id）'
-                >
-                    <Input placeholder='额外参数'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='数值'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="values"
-                        help='选填，请填写路由的额外参数数值（如路由为 admin/user/index/:id，参数值为 1，则最终的链接会解析成：admin/user/index/1）'
-                >
-                    <Input placeholder='参数数值'/>
-                </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                <FormItem
-                        label='图标'
-                        :labelCol="{ span: 3 }"
-                        :wrapperCol="{ span: 21 }"
-                        fieldDecoratorId="icon"
-                        help='可选，设置菜单选项前置图标'
-                >
-                    <Input placeholder='前置图标'/>
-                </FormItem>
-                    </a-col>
-                </a-row>
-                <a-row :gutter="24">
-                    <a-col :span="12">
-                        <FormItem
-                                label='侧栏'
-                                :labelCol="{ span: 3 }"
-                                :wrapperCol="{ span: 21 }"
-                                fieldDecoratorId="show_slider"
-                                :fieldDecoratorOptions="{valuePropName:'checked',initialValue: true}"
-                                help='可选，取消勾选，则该页面将不显示侧边菜单栏'
-                        >
-                            <Checkbox>是否显示侧栏</Checkbox>
-                        </FormItem>
-                    </a-col>
-                    <a-col :span="12">
-                        <FormItem
-                                label='内页'
-                                :labelCol="{ span: 3 }"
-                                :wrapperCol="{ span: 21 }"
-                                fieldDecoratorId="is_inner"
-                                :fieldDecoratorOptions="{valuePropName:'checked',initialValue: false}"
-                                help='可选，选中为菜单内页，将不会显示在导航菜单上。用于菜单选中项渲染判断'
-                        >
-                            <Checkbox>是否内页</Checkbox>
-                        </FormItem>
-                    </a-col>
-                </a-row>
-                <FormItem
-                >
-                    <div class="action-btn" style="text-align: center">
-                        <Button type="primary" htmlType='submit'
-                                size="large"
-                                :loading="actionInfo.confirmLoading"
-                                class="middle-btn">保存
-                        </Button>
-                        <Button class="middle-btn" size="large" @click="actionInfo.modalStatus = false">取消
-                        </Button>
-                    </div>
-                </FormItem>
-            </Form>
-        </Modal>
-    </div>
+              </a-tree-select>-->
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="排序"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="sort"
+              :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入排序' }],initialValue:0}"
+              help="必填，整数。数字越小越靠前，最小值为0。"
+            >
+              <Input placeholder="排序" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="参数"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="params"
+              help="选填，请填写路由的额外参数（如：:id，则路由为：admin/user/index/:id）"
+            >
+              <Input placeholder="额外参数" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="数值"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="values"
+              help="选填，请填写路由的额外参数数值（如路由为 admin/user/index/:id，参数值为 1，则最终的链接会解析成：admin/user/index/1）"
+            >
+              <Input placeholder="参数数值" />
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="图标"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="icon"
+              help="可选，设置菜单选项前置图标"
+            >
+              <Input placeholder="前置图标" />
+            </FormItem>
+          </a-col>
+        </a-row>
+        <a-row :gutter="24">
+          <a-col :span="12">
+            <FormItem
+              label="侧栏"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="show_slider"
+              :fieldDecoratorOptions="{valuePropName:'checked',initialValue: true}"
+              help="可选，取消勾选，则该页面将不显示侧边菜单栏"
+            >
+              <Checkbox>是否显示侧栏</Checkbox>
+            </FormItem>
+          </a-col>
+          <a-col :span="12">
+            <FormItem
+              label="内页"
+              :labelCol="{ span: 3 }"
+              :wrapperCol="{ span: 21 }"
+              fieldDecoratorId="is_inner"
+              :fieldDecoratorOptions="{valuePropName:'checked',initialValue: false}"
+              help="可选，选中为菜单内页，将不会显示在导航菜单上。用于菜单选中项渲染判断"
+            >
+              <Checkbox>是否内页</Checkbox>
+            </FormItem>
+          </a-col>
+        </a-row>
+        <FormItem>
+          <div class="action-btn" style="text-align: center">
+            <Button
+              type="primary"
+              htmlType="submit"
+              size="large"
+              :loading="actionInfo.confirmLoading"
+              class="middle-btn"
+            >保存</Button>
+            <Button class="middle-btn" size="large" @click="actionInfo.modalStatus = false">取消</Button>
+          </div>
+        </FormItem>
+      </Form>
+    </Modal>
+  </div>
 </template>
 <script>
-    import {Table, Button, Divider, Modal, Form, Input, Checkbox} from 'ant-design-vue';
-    import {getMenu, doMenu, forbid, resume, delMenu} from '@/api/menu';
-    import {createRoute, checkResponse} from '@/assets/js/utils';
-    import {getStore} from '@/assets/js/storage';
-    import {allList} from "@/api/node";
-    import debounce from 'lodash/debounce';
+import {
+  Table,
+  Button,
+  Divider,
+  Modal,
+  Form,
+  Input,
+  Checkbox,
+} from "ant-design-vue";
+import { getMenu, doMenu, forbid, resume, delMenu } from "@/api/menu";
+import { createRoute, checkResponse } from "@/assets/js/utils";
+import { getStore } from "@/assets/js/storage";
+import { allList } from "@/api/node";
+import debounce from "lodash/debounce";
 
-    const FormItem = Form.Item;
+const FormItem = Form.Item;
 
-    const columns = [{
-        title: '名称',
-        dataIndex: 'title',
-        width: '15%',
-    }, {
-        title: '地址',
-        dataIndex: 'url',
-        width: '20%',
-        scopedSlots: {
-            customRender: 'url'
-        },
-    }, {
-        title: '路径',
-        dataIndex: 'file_path',
-    }, {
-        title: '节点',
-        width: '20%',
-        dataIndex: 'node',
-    }, {
-        title: '排序',
-        dataIndex: 'sort',
-    }, {
-        title: '类型',
-        dataIndex: 'innerText',
+const columns = [
+  {
+    title: "名称",
+    dataIndex: "title",
+    width: "15%",
+  },
+  {
+    title: "地址",
+    dataIndex: "url",
+    width: "20%",
+    scopedSlots: {
+      customRender: "url",
+    },
+  },
+  {
+    title: "路径",
+    dataIndex: "file_path",
+  },
+  {
+    title: "节点",
+    width: "20%",
+    dataIndex: "node",
+  },
+  {
+    title: "排序",
+    dataIndex: "sort",
+  },
+  {
+    title: "类型",
+    dataIndex: "innerText",
+  },
+  //     {
+  //     title: '状态',
+  //     dataIndex: 'statusText',
+  //     width: '15%',
+  //     scopedSlots: {
+  //         customRender: 'status'
+  //     },
+  // },
+  {
+    title: "操作",
+    dataIndex: "id",
+    scopedSlots: {
+      customRender: "action",
     },
-    //     {
-    //     title: '状态',
-    //     dataIndex: 'statusText',
-    //     width: '15%',
-    //     scopedSlots: {
-    //         customRender: 'status'
-    //     },
-    // },
-        {
-        title: '操作',
-        dataIndex: 'id',
-        scopedSlots: {
-            customRender: 'action'
+  },
+];
+export default {
+  components: {
+    Table,
+    Button,
+    Divider,
+    Modal,
+    Form,
+    FormItem,
+    Input,
+    Checkbox,
+  },
+  data() {
+    this.lastFetchId = 0;
+    this.fetchNode = debounce(this.fetchNode, 800);
+    return {
+      columns,
+      data: [],
+      dataSource: [],
+      nodeList: [],
+      loading: true,
+      fetching: false,
+      newMenu: null,
+      form: {},
+      actionInfo: {
+        modalStatus: false,
+        confirmLoading: false,
+        modalTitle: "编辑菜单",
+        okText: "确定",
+        cancelText: "放弃",
+      },
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init() {
+      let app = this;
+      app.loading = true;
+      getMenu().then((res) => {
+        app.loading = false;
+        let list = res.data;
+        list.forEach(function (v) {
+          v.key = v.id;
+          v.dept = 1;
+          if (v.children) {
+            v.children.forEach(function (v2) {
+              v2.key = v2.id;
+              v2.dept = 2;
+              if (v2.children) {
+                v2.children.forEach(function (v3) {
+                  v3.key = v3.id;
+                  v3.dept = 3;
+                });
+              }
+            });
+          }
+        });
+        app.dataSource = list;
+      });
+    },
+    rowClick(record, action) {
+      let app = this;
+      app.newMenu = null;
+      app.nodeList = [];
+      if (action == "add" || action == "edit" || action == "new") {
+        setTimeout(function () {
+          app.form && app.form.resetFields();
+        }, 0);
+        app.actionInfo.modalStatus = true;
+        app.actionInfo.modalTitle = "添加菜单";
+        if (action == "edit") {
+          //modal没显示之前不会实例化modal子元素，延迟处理
+          setTimeout(function () {
+            app.actionInfo.modalTitle = "编辑菜单";
+            app.form.setFieldsValue({
+              title: record.title,
+              file_path: record.file_path,
+              url: record.url,
+              sort: record.sort,
+              node: record.node,
+              params: record.params,
+              values: record.values,
+              icon: record.icon,
+              is_inner: record.is_inner,
+              show_slider: record.show_slider,
+            });
+            app.newMenu = record;
+          }, 0);
+        } else if (action == "add") {
+          app.newMenu = {
+            status: 1,
+            dept: parseInt(record.dept) + 1,
+          };
+          app.newMenu.pid = record.id;
+        } else {
+          app.newMenu = {
+            status: 1,
+            dept: 1,
+            pid: 0,
+          };
         }
-    }];
-    export default {
-        components: {
-            Table,
-            Button,
-            Divider,
-            Modal,
-            Form,
-            FormItem,
-            Input,
-            Checkbox
-        },
-        data() {
-            this.lastFetchId = 0;
-            this.fetchNode = debounce(this.fetchNode, 800);
-            return {
-                columns,
-                data: [],
-                dataSource: [],
-                nodeList: [],
-                loading: true,
-                fetching: false,
-                newMenu: null,
-                form: {},
-                actionInfo: {
-                    modalStatus: false,
-                    confirmLoading: false,
-                    modalTitle: '编辑菜单',
-                    okText: '确定',
-                    cancelText: '放弃',
+      } else if (action == "status") {
+        const status = record.status;
+        record.status = Number(!status);
+        status
+          ? forbid(record.id, record.status)
+          : resume(record.id, record.status);
+      } else if (action == "del") {
+        const confirm = Modal.confirm({
+          title: "确定要删除此菜单?",
+          content: "删除后不可恢复，且子菜单会被同时删除",
+          okText: "确定",
+          okType: "danger",
+          cancelText: "放弃",
+          onOk() {
+            delMenu(record.id).then((res) => {
+              app.dataSource.forEach(function (v, k) {
+                if (v.id == record.id) {
+                  app.dataSource.splice(k, 1);
+                  return;
                 }
-            }
-        },
-        created() {
-            this.init();
-        },
-        methods: {
-            init() {
-                let app = this;
-                app.loading = true;
-                getMenu().then(res => {
-                    app.loading = false;
-                    let list = res.data;
-                    list.forEach(function (v) {
-                        v.key = v.id;
-                        v.dept = 1;
-                        if (v.children) {
-                            v.children.forEach(function (v2) {
-                                v2.key = v2.id;
-                                v2.dept = 2;
-                                if (v2.children) {
-                                    v2.children.forEach(function (v3) {
-                                        v3.key = v3.id;
-                                        v3.dept = 3;
-                                    })
-                                }
-                            })
-                        }
-                    });
-                    app.dataSource = list;
-                });
-            },
-            rowClick(record, action) {
-                let app = this;
-                app.newMenu = null;
-                app.nodeList = [];
-                if (action == 'add' || action == 'edit' || action == 'new') {
-                    setTimeout(function () {
-                        app.form && app.form.resetFields();
-                    }, 0);
-                    app.actionInfo.modalStatus = true;
-                    app.actionInfo.modalTitle = '添加菜单';
-                    if (action == 'edit') {
-                        //modal没显示之前不会实例化modal子元素，延迟处理
-                        setTimeout(function () {
-                            app.actionInfo.modalTitle = '编辑菜单';
-                            app.form.setFieldsValue({
-                                title: record.title,
-                                file_path: record.file_path,
-                                url: record.url,
-                                sort: record.sort,
-                                node: record.node,
-                                params: record.params,
-                                values: record.values,
-                                icon: record.icon,
-                                is_inner: record.is_inner,
-                                show_slider: record.show_slider,
-                            });
-                            app.newMenu = record;
-                        }, 0);
-                    } else if (action == 'add') {
-                        app.newMenu = {
-                            status: 1,
-                            dept: parseInt(record.dept) + 1
-                        };
-                        app.newMenu.pid = record.id;
-                    } else {
-                        app.newMenu = {
-                            status: 1,
-                            dept: 1,
-                            pid: 0
-                        };
+                if (v.children) {
+                  v.children.forEach(function (v2, k2) {
+                    if (v2.id == record.id) {
+                      v.children.splice(k2, 1);
+                      return;
                     }
-                } else if (action == 'status') {
-                    const status = record.status;
-                    record.status = Number(!status);
-                    status ? forbid(record.id, record.status) : resume(record.id, record.status);
-                } else if (action == 'del') {
-                    const confirm = Modal.confirm({
-                        title: '确定要删除此菜单?',
-                        content: '删除后不可恢复，且子菜单会被同时删除',
-                        okText: '确定',
-                        okType: 'danger',
-                        cancelText: '放弃',
-                        onOk() {
-                            delMenu(record.id).then(res => {
-                                app.dataSource.forEach(function (v, k) {
-                                    if (v.id == record.id) {
-                                        app.dataSource.splice(k, 1);
-                                        return;
-                                    }
-                                    if (v.children) {
-                                        v.children.forEach(function (v2, k2) {
-                                            if (v2.id == record.id) {
-                                                v.children.splice(k2, 1);
-                                                return;
-                                            }
-                                            if (v2.children) {
-                                                v2.children.forEach(function (v3, k3) {
-                                                    if (v3.id == record.id) {
-                                                        v2.children.splice(k3, 1);
-                                                        return;
-                                                    }
-                                                })
-                                            }
-                                        });
-                                    }
-                                });
-                            });
-                            return Promise.resolve();
+                    if (v2.children) {
+                      v2.children.forEach(function (v3, k3) {
+                        if (v3.id == record.id) {
+                          v2.children.splice(k3, 1);
+                          return;
                         }
-                    })
+                      });
+                    }
+                  });
                 }
-            },
-            handleSubmit() {
-                let app = this;
-                app.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            app.handleOk();
-                        }
-                    })
-            },
-            handleOk() {
-                let app = this;
-                app.actionInfo.confirmLoading = true;
-                let obj = app.form.getFieldsValue();
-                if (app.newMenu.id) {
-                    //编辑
-                    obj.id = app.newMenu.id;
-                } else {
-                    //新增
-                    Object.assign(obj, app.newMenu);
+              });
+            });
+            return Promise.resolve();
+          },
+        });
+      }
+    },
+    handleSubmit() {
+      let app = this;
+      app.form.validateFields((err, values) => {
+        if (!err) {
+          app.handleOk();
+        }
+      });
+    },
+    handleOk() {
+      let app = this;
+      app.actionInfo.confirmLoading = true;
+      let obj = app.form.getFieldsValue();
+      if (app.newMenu.id) {
+        //编辑
+        obj.id = app.newMenu.id;
+      } else {
+        //新增
+        Object.assign(obj, app.newMenu);
+      }
+      doMenu(obj).then((res) => {
+        app.actionInfo.confirmLoading = false;
+        if (!checkResponse(res)) {
+          return;
+        }
+        // app.freshMenu();
+        if (app.newMenu.id) {
+          app.newMenu.title = obj.title;
+          app.newMenu.url = obj.url;
+          app.newMenu.sort = obj.sort;
+          app.newMenu.file_path = obj.file_path;
+          app.newMenu.node = obj.node;
+          app.newMenu.params = obj.params;
+          app.newMenu.values = obj.values;
+          app.newMenu.icon = obj.icon;
+          app.newMenu.is_inner = !!obj.is_inner;
+          app.newMenu.show_slider = !!obj.show_slider;
+          app.dataSource.forEach(function (v) {
+            if (v.id == obj.id) {
+              Object.assign(v, obj);
+              return;
+            }
+            if (v.children) {
+              v.children.forEach(function (v2) {
+                if (v2.id == obj.id) {
+                  Object.assign(v2, obj);
+                  return;
                 }
-                doMenu(obj).then(res => {
-                    app.actionInfo.confirmLoading = false;
-                    if (!checkResponse(res)) {
-                        return;
+                if (v2.children) {
+                  v2.children.forEach(function (v3) {
+                    if (v3.id == obj.id) {
+                      Object.assign(v3, obj);
+                      return;
                     }
-                    // app.freshMenu();
-                    if (app.newMenu.id) {
-                        app.newMenu.title = obj.title;
-                        app.newMenu.url = obj.url;
-                        app.newMenu.sort = obj.sort;
-                        app.newMenu.file_path = obj.file_path;
-                        app.newMenu.node = obj.node;
-                        app.newMenu.params = obj.params;
-                        app.newMenu.values = obj.values;
-                        app.newMenu.icon = obj.icon;
-                        app.newMenu.is_inner = !!obj.is_inner;
-                        app.newMenu.show_slider = !!obj.show_slider;
-                        app.dataSource.forEach(function (v) {
-                            if (v.id == obj.id) {
-                                Object.assign(v, obj);
-                                return;
-                            }
-                            if (v.children) {
-                                v.children.forEach(function (v2) {
-                                    if (v2.id == obj.id) {
-                                        Object.assign(v2, obj);
-                                        return;
-                                    }
-                                    if (v2.children) {
-                                        v2.children.forEach(function (v3) {
-                                            if (v3.id == obj.id) {
-                                                Object.assign(v3, obj);
-                                                return;
-                                            }
-                                        })
-                                    }
-                                });
-                            }
-                        });
+                  });
+                }
+              });
+            }
+          });
+        } else {
+          obj = res.data;
+          obj.key = res.data.id;
+          obj.is_inner = !!res.data.is_inner;
+          obj.show_slider = !!res.data.show_slider;
+          obj.dept = app.newMenu.dept;
+          if (app.newMenu.pid == 0) {
+            app.dataSource.push(obj);
+          } else {
+            app.dataSource.forEach(function (v) {
+              if (v.id == obj.pid) {
+                if (v.children) {
+                  v.children.push(obj);
+                } else {
+                  v.children = [obj];
+                }
+                return;
+              }
+              if (v.children) {
+                v.children.forEach(function (v2) {
+                  if (v2.id == obj.pid) {
+                    if (v2.children) {
+                      v2.children.push(obj);
                     } else {
-                        obj = res.data;
-                        obj.key = res.data.id;
-                        obj.is_inner = !!res.data.is_inner;
-                        obj.show_slider = !!res.data.show_slider;
-                        obj.dept = app.newMenu.dept;
-                        if (app.newMenu.pid == 0) {
-                            app.dataSource.push(obj);
+                      v2.children = [obj];
+                    }
+                    return;
+                  }
+                  if (v2.children) {
+                    v2.children.forEach(function (v3) {
+                      if (v3.id == obj.id) {
+                        if (v3.children) {
+                          v3.children.push(obj);
                         } else {
-                            app.dataSource.forEach(function (v) {
-                                if (v.id == obj.pid) {
-                                    if (v.children) {
-                                        v.children.push(obj);
-                                    } else {
-                                        v.children = [obj];
-                                    }
-                                    return;
-                                }
-                                if (v.children) {
-                                    v.children.forEach(function (v2) {
-                                        if (v2.id == obj.pid) {
-                                            if (v2.children) {
-                                                v2.children.push(obj);
-                                            } else {
-                                                v2.children = [obj];
-                                            }
-                                            return;
-                                        }
-                                        if (v2.children) {
-                                            v2.children.forEach(function (v3) {
-                                                if (v3.id == obj.id) {
-                                                    if (v3.children) {
-                                                        v3.children.push(obj);
-                                                    } else {
-                                                        v3.children = [obj];
-                                                    }
-                                                    return;
-                                                }
-                                            })
-                                        }
-                                    });
-                                }
-                            });
+                          v3.children = [obj];
                         }
-                    }
-                    app.form.resetFields();
-                    app.newMenu = null;
-                    app.actionInfo.modalStatus = false;
-                });
-            },
-            handleChange(value) {
-                this.nodeList = [];
-                this.fetching = false;
-                // Object.assign(this, {
-                //     data: [],
-                //     fetching: false,
-                // })
-            },
-            fetchNode(value) {
-                let app = this;
-                this.lastFetchId += 1;
-                const fetchId = this.lastFetchId;
-                this.nodeList = [];
-                this.fetching = true;
-                allList('project',value).then(res => {
-                    if (fetchId !== app.lastFetchId) { // for fetch callback order
                         return;
-                    }
-                    app.fetching = false;
-                    app.nodeList = res.data;
+                      }
+                    });
+                  }
                 });
-            },
+              }
+            });
+          }
         }
-    }
+        app.form.resetFields();
+        app.newMenu = null;
+        app.actionInfo.modalStatus = false;
+      });
+    },
+    handleChange(value) {
+      this.nodeList = [];
+      this.fetching = false;
+      // Object.assign(this, {
+      //     data: [],
+      //     fetching: false,
+      // })
+    },
+    fetchNode(value) {
+      let app = this;
+      this.lastFetchId += 1;
+      const fetchId = this.lastFetchId;
+      this.nodeList = [];
+      this.fetching = true;
+      allList("project", value).then((res) => {
+        if (fetchId !== app.lastFetchId) {
+          // for fetch callback order
+          return;
+        }
+        app.fetching = false;
+        app.nodeList = res.data;
+      });
+    },
+  },
+};
 </script>
-- 
Gitee


From 446501b3878dfe7a9dbf8cadd4e8586d76c9d28a Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Fri, 4 Sep 2020 11:07:12 +0800
Subject: [PATCH 5/8] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=A1=B9=E7=9B=AE?=
 =?UTF-8?q?=E5=B9=BF=E5=9C=BA?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/assets/css/components/base.less |   4 +
 src/assets/css/components/list.less |   2 +
 src/components/tools/VUploader.vue  |   4 +-
 src/router/index.js                 | 290 +++++++++++++++-------------
 src/views/project/list/index.vue    |  36 ++--
 src/views/system/config/menu.vue    |   4 +-
 6 files changed, 187 insertions(+), 153 deletions(-)

diff --git a/src/assets/css/components/base.less b/src/assets/css/components/base.less
index 321be07..36ca4f3 100644
--- a/src/assets/css/components/base.less
+++ b/src/assets/css/components/base.less
@@ -495,4 +495,8 @@ body {
 .ant-empty {
   margin: 2rem 1rem;
   user-select: none;
+}
+
+.ant-spin-nested-loading>div>.ant-spin .ant-spin-dot {
+  margin: 10px;
 }
\ No newline at end of file
diff --git a/src/assets/css/components/list.less b/src/assets/css/components/list.less
index ca068d7..1123ba8 100644
--- a/src/assets/css/components/list.less
+++ b/src/assets/css/components/list.less
@@ -31,6 +31,8 @@
 }
 
 .project-list {
+  min-height: 3rem;
+
   .ant-list-item {
     padding: 1rem 0 1rem;
     background: #fff;
diff --git a/src/components/tools/VUploader.vue b/src/components/tools/VUploader.vue
index 82d4b55..8974889 100644
--- a/src/components/tools/VUploader.vue
+++ b/src/components/tools/VUploader.vue
@@ -60,7 +60,7 @@
                                 </div>
                                 <div class="file-extra">
                                   <span
-                                    v-if="file.file.projectName"
+                                    v-if="file.file.projectName || tempData.projectName"
                                   >{{file.file.projectName ? file.file.projectName : tempData.projectName}}</span>
                                   <span v-else>公共文件</span>
                                   <span v-if="file.status == 'success'">({{file.formatedSize }})</span>
@@ -233,7 +233,7 @@ export default {
       //所有文件上传完成
       console.log("complete", arguments);
       this.progressTotal = this.completeTotal = 0;
-      notice({ title: "关联文件成功" }, "notice", "success");
+      notice({ title: "上传文件成功" }, "notice", "success");
       setTimeout(() => {
         this.showFiles = false;
       }, 3000);
diff --git a/src/router/index.js b/src/router/index.js
index 86ac64a..3bc7e4a 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -1,165 +1,181 @@
-import Vue from 'vue'
-import store from '@/store'
-import Router from 'vue-router'
-import Index from '@/views/index'
-import Home from './home';
-import {getStore, setStore} from "../assets/js/storage";
-import {createRoute, isTokenExpired} from "../assets/js/utils";
+import Vue from "vue";
+import store from "@/store";
+import Router from "vue-router";
+import Index from "@/views/index";
+import Home from "./home";
+import { getStore, setStore } from "../assets/js/storage";
+import { createRoute, isTokenExpired } from "../assets/js/utils";
 import config from "../config/config";
-import {refreshAccessToken} from "../api/common/common";
+import { refreshAccessToken } from "../api/common/common";
 
 let HOME_PAGE = config.HOME_PAGE;
-const currentOrganization = getStore('currentOrganization', true);
+const currentOrganization = getStore("currentOrganization", true);
 if (currentOrganization) {
-    HOME_PAGE = HOME_PAGE + '/' + currentOrganization.code;
+  HOME_PAGE = HOME_PAGE + "/" + currentOrganization.code;
 }
 
+//禁止全局路由错误处理打印
+const originalPush = Router.prototype.push;
+Router.prototype.push = function push(location, onResolve, onReject) {
+  if (onResolve || onReject)
+    return originalPush.call(this, location, onResolve, onReject);
+  return originalPush.call(this, location).catch((err) => err);
+};
+
 Vue.use(Router);
-const routes = [].concat(
-    Home
-);
+const routes = [].concat(Home);
 // const router = new Router({
 //     routes: routers
 // });
-const menu = getStore('menu', true);
+const menu = getStore("menu", true);
 if (menu) {
-    menu.forEach(function (v) {
-        routes.push(createRoute(v));
-        if (v.children) {
-            v.children.forEach(function (v2) {
-                routes.push(createRoute(v2));
-                if (v2.children) {
-                    v2.children.forEach(function (v3) {
-                        routes.push(createRoute(v3));
-                    });
-                }
-            });
+  menu.forEach(function(v) {
+    routes.push(createRoute(v));
+    if (v.children) {
+      v.children.forEach(function(v2) {
+        routes.push(createRoute(v2));
+        if (v2.children) {
+          v2.children.forEach(function(v3) {
+            routes.push(createRoute(v3));
+          });
         }
-    });
+      });
+    }
+  });
 }
 const router = new Router({
-    routes: [
-        {
-            path: '/',
-            name: 'index',
-            component: Index,
-            children: routes
-        },
-        // {
-        //     name: 'login',
-        //     path: '/login',
-        //     component: resolve => require(['@/views/login'], resolve),
-        //     meta: {model: 'Login'},
-        // },
-        {
-            name: 'member',
-            path: '/member',
-            component: resolve => require(['@/components/layout/UserLayout'], resolve),
-            meta: {model: 'Login'},
-            children: [
-                {
-                    path: 'login',
-                    name: 'login',
-                    component: () => import(/* webpackChunkName: "user" */ '@/views/member/login'),
-                    meta: {model: 'Login'},
-                },
-                {
-                    path: 'register',
-                    name: 'register',
-                    component: () => import(/* webpackChunkName: "user" */ '@/views/member/Register'),
-                    meta: {model: 'Login'},
-                },
-                {
-                    path: 'forgot',
-                    name: 'forgot',
-                    component: () => import(/* webpackChunkName: "user" */ '@/views/member/forgot'),
-                    meta: {model: 'Login'},
-                },
-                // {
-                //     path: 'register-result',
-                //     name: 'registerResult',
-                //     component: () => import(/* webpackChunkName: "user" */ '@/views/member/RegisterResult')
-                // }
-            ]
-        },
-        {
-            name: 'install',
-            path: '/install',
-            component: resolve => require(['@/views/error/install'], resolve),
-            meta: {model: 'error'},
-        },
+  routes: [
+    {
+      path: "/",
+      name: "index",
+      component: Index,
+      children: routes,
+    },
+    // {
+    //     name: 'login',
+    //     path: '/login',
+    //     component: resolve => require(['@/views/login'], resolve),
+    //     meta: {model: 'Login'},
+    // },
+    {
+      name: "member",
+      path: "/member",
+      component: (resolve) =>
+        require(["@/components/layout/UserLayout"], resolve),
+      meta: { model: "Login" },
+      children: [
         {
-            name: 'resetEmail',
-            path: '/reset/email',
-            component: resolve => require(['@/views/reset/email'], resolve),
-            meta: {model: 'error'},
+          path: "login",
+          name: "login",
+          component: () =>
+            import(/* webpackChunkName: "user" */ "@/views/member/login"),
+          meta: { model: "Login" },
         },
         {
-            name: '404',
-            path: '/404',
-            component: resolve => require(['@/views/error/404'], resolve),
-            meta: {model: 'error'},
+          path: "register",
+          name: "register",
+          component: () =>
+            import(/* webpackChunkName: "user" */ "@/views/member/Register"),
+          meta: { model: "Login" },
         },
         {
-            name: '403',
-            path: '/403',
-            component: resolve => require(['@/views/error/403'], resolve),
-            meta: {model: 'error'},
+          path: "forgot",
+          name: "forgot",
+          component: () =>
+            import(/* webpackChunkName: "user" */ "@/views/member/forgot"),
+          meta: { model: "Login" },
         },
-        {
-            name: '500',
-            path: '/500',
-            component: resolve => require(['@/views/error/500'], resolve),
-            meta: {model: 'error'},
-        },
-    ]
+        // {
+        //     path: 'register-result',
+        //     name: 'registerResult',
+        //     component: () => import(/* webpackChunkName: "user" */ '@/views/member/RegisterResult')
+        // }
+      ],
+    },
+    {
+      name: "install",
+      path: "/install",
+      component: (resolve) => require(["@/views/error/install"], resolve),
+      meta: { model: "error" },
+    },
+    {
+      name: "resetEmail",
+      path: "/reset/email",
+      component: (resolve) => require(["@/views/reset/email"], resolve),
+      meta: { model: "error" },
+    },
+    {
+      name: "404",
+      path: "/404",
+      component: (resolve) => require(["@/views/error/404"], resolve),
+      meta: { model: "error" },
+    },
+    {
+      name: "403",
+      path: "/403",
+      component: (resolve) => require(["@/views/error/403"], resolve),
+      meta: { model: "error" },
+    },
+    {
+      name: "500",
+      path: "/500",
+      component: (resolve) => require(["@/views/error/500"], resolve),
+      meta: { model: "error" },
+    },
+  ],
 });
 
 router.beforeEach((to, from, next) => {
-    console.log(to);
-    let tokenList = getStore('tokenList', true);
-    if (tokenList) {
-        let refreshToken = tokenList.refreshToken;
-        let accessTokenExp = tokenList.accessTokenExp;
-        //判断accessToken即将到期后刷新token
-        if (accessTokenExp && isTokenExpired(accessTokenExp)) {
-            refreshAccessToken(refreshToken).then(res => {
-                tokenList.accessToken = res.data.accessToken;
-                tokenList.accessTokenExp = res.data.accessTokenExp;
-                setStore('tokenList', tokenList);
-            }).catch((() => {
-                store.state.logged = false;
-                store.state.userInfo = null;
-                return false;
-            }));
-        }
-    }
-    //页面中转
-    if (to.name === 'index' || to.path === '/index' || to.path === '/') {
-        next({path: HOME_PAGE});
-        return false;
-    }
-    //无效页面跳转至首页
-    if (!to.name && from.meta.model !== 'Login' && to.path !== HOME_PAGE) {
-        next({path: '/404'});
-        return false;
-    }
-    if (to.meta.model === 'Login' && store.state.logged) {
-        next({path: HOME_PAGE});
-        return false;
-    }
-    if (!store.state.logged && to.meta.model !== 'Login' && to.meta.model !== 'error') {
-        next({
-            name: 'login',
-            query: {redirect: to.fullPath}
+  //console.log(to);
+  let tokenList = getStore("tokenList", true);
+  if (tokenList) {
+    let refreshToken = tokenList.refreshToken;
+    let accessTokenExp = tokenList.accessTokenExp;
+    //判断accessToken即将到期后刷新token
+    if (accessTokenExp && isTokenExpired(accessTokenExp)) {
+      refreshAccessToken(refreshToken)
+        .then((res) => {
+          tokenList.accessToken = res.data.accessToken;
+          tokenList.accessTokenExp = res.data.accessTokenExp;
+          setStore("tokenList", tokenList);
+        })
+        .catch(() => {
+          store.state.logged = false;
+          store.state.userInfo = null;
+          return false;
         });
-        return false;
     }
-    next();
+  }
+  //页面中转
+  if (to.name === "index" || to.path === "/index" || to.path === "/") {
+    next({ path: HOME_PAGE });
+    return false;
+  }
+  //无效页面跳转至首页
+  if (!to.name && from.meta.model !== "Login" && to.path !== HOME_PAGE) {
+    next({ path: "/404" });
+    return false;
+  }
+  if (to.meta.model === "Login" && store.state.logged) {
+    next({ path: HOME_PAGE });
+    return false;
+  }
+  if (
+    !store.state.logged &&
+    to.meta.model !== "Login" &&
+    to.meta.model !== "error"
+  ) {
+    next({
+      name: "login",
+      query: { redirect: to.fullPath },
+    });
+    return false;
+  }
+  next();
 });
-router.afterEach(route => {
-    //预留
-    // window.scrollTo(0,0)
+router.afterEach((route) => {
+  //预留
+  // window.scrollTo(0,0)
 });
 
-export default router
+export default router;
diff --git a/src/views/project/list/index.vue b/src/views/project/list/index.vue
index fd40e42..848f4dd 100644
--- a/src/views/project/list/index.vue
+++ b/src/views/project/list/index.vue
@@ -8,7 +8,7 @@
           @submit.prevent="handleSearchSubmit"
         >
           <a-form-item label="名称" fieldDecoratorId="name">
-            <a-input placeholder="请输入" />
+            <a-input placeholder="请输入" allowClear />
           </a-form-item>
           <a-form-item label="创建日期" fieldDecoratorId="date">
             <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
@@ -22,12 +22,11 @@
             >搜索</a-button>
           </a-form-item>
         </a-form>
-      </div>-->
+      </div> -->
       <a-tabs v-model="selectBy" @change="selectChange" :animated="false">
-        <a-tab-pane key="my" tab="全部项目"></a-tab-pane>
+        <a-tab-pane key="public" tab="项目广场"></a-tab-pane>
+        <a-tab-pane key="my" tab="我的项目"></a-tab-pane>
         <a-tab-pane key="collect" tab="我的收藏"></a-tab-pane>
-        <a-tab-pane key="archive" tab="已归档"></a-tab-pane>
-        <a-tab-pane key="deleted" tab="回收站"></a-tab-pane>
         <a-button
           slot="tabBarExtraContent"
           type="primary"
@@ -44,7 +43,7 @@
         <div
           v-if="showLoadingMore"
           slot="loadMore"
-          :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+          :style="{ textAlign: 'center', marginTop: '3rem',marginBottom: '3rem', height: '32px', lineHeight: '32px' }"
         >
           <a-spin v-if="loadingMore">
             <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
@@ -202,9 +201,12 @@ export default {
   mixins: [pagination],
   data() {
     return {
-      selectBy: this.$route.params.type || "my",
+      selectBy: this.$route.params.type || "public",
       dataSource: [],
-      loading: true,
+      loading: {
+        spinning: false,
+        indicator: <a-icon type="loading" style="font-size: 2rem" spin />,
+      },
       showLoadingMore: false,
       loadingMore: false,
       showInviteMember: false,
@@ -250,12 +252,12 @@ export default {
         this.showLoadingMore = false;
       }
       this.requestData.selectBy = this.selectBy;
-      app.loading = true;
+      app.loading.spinning = true;
       list(app.requestData).then((res) => {
         app.dataSource = app.dataSource.concat(res.data.list);
         app.pagination.total = res.data.total;
         app.showLoadingMore = app.pagination.total > app.dataSource.length;
-        app.loading = false;
+        app.loading.spinning = false;
         app.loadingMore = false;
       });
     },
@@ -388,11 +390,21 @@ export default {
     },
     search() {
       let obj = this.searchForm.getFieldsValue();
+      if (Array.isArray(obj.date) && obj.date.length >= 2) {
+        obj.date[0] =
+          obj.date[0].format instanceof Function
+            ? obj.date[0].format("YYYY-MM-DD")
+            : obj.date[0];
+        obj.date[1] =
+          obj.date[1].format instanceof Function
+            ? obj.date[1].format("YYYY-MM-DD")
+            : obj.date[1];
+      }
       Object.assign(this.requestData, obj);
       this.init();
     },
-    selectChange() {
-      this.init();
+    selectChange(e = "my") {
+      return this.$router.push("/project/list/" + e);
     },
   },
 };
diff --git a/src/views/system/config/menu.vue b/src/views/system/config/menu.vue
index 2411e46..a4def95 100644
--- a/src/views/system/config/menu.vue
+++ b/src/views/system/config/menu.vue
@@ -57,7 +57,7 @@
               :wrapperCol="{ span: 21 }"
               fieldDecoratorId="url"
               :fieldDecoratorOptions="{rules: [{ required: true, message: '请输入路由地址' }]}"
-              help="必填，请填写路由地址（如：admin/user/index，对应的文件位于：views/admin/user/index.vue）。如果是上级菜单时，请填写"#"符号，不要填写路由地址。"
+              help="必填，请填写路由地址（如：admin/user/index，对应的文件位于：views/admin/user/index.vue）。如果是上级菜单时，请填写'#'符号，不要填写路由地址。"
             >
               <Input placeholder="路由地址" />
             </FormItem>
@@ -80,7 +80,7 @@
               :wrapperCol="{ span: 21 }"
               fieldDecoratorId="node"
               :fieldDecoratorOptions="{rules: [{ required: true, message: '请绑定权限节点' }]}"
-              help="必填，将当前路由与权限节点进行绑定，没有该节点权限的菜单将会被隐藏。不进行绑定，请填写"#"符号。"
+              help="必填，将当前路由与权限节点进行绑定，没有该节点权限的菜单将会被隐藏。不进行绑定，请填写'#'符号。"
             >
               <a-select
                 showSearch
-- 
Gitee


From af3fe662b775fac860d33532c78f870ae655a740 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Tue, 8 Sep 2020 23:13:38 +0800
Subject: [PATCH 6/8] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E7=9F=A5=E8=AF=86?=
 =?UTF-8?q?=E5=BA=93(=E4=BB=BB=E5=8A=A1=E9=9B=86=E5=90=88)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/home/index.vue          |   2 +-
 src/views/project/tasks/index.vue | 160 ++++++++++++++++++++++++++++++
 2 files changed, 161 insertions(+), 1 deletion(-)
 create mode 100644 src/views/project/tasks/index.vue

diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 020cfbc..54b5c67 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -78,7 +78,7 @@
             :loading="loading"
             style="margin-bottom: 24px;"
             :bordered="false"
-            title="进行中的项目"
+            title="最近的项目"
             :body-style="{ padding: 0 }"
           >
             <router-link to="/project/list/my" slot="extra">全部项目</router-link>
diff --git a/src/views/project/tasks/index.vue b/src/views/project/tasks/index.vue
new file mode 100644
index 0000000..9480dd1
--- /dev/null
+++ b/src/views/project/tasks/index.vue
@@ -0,0 +1,160 @@
+<template>
+  <div class="project-list-index">
+    <wrapper-content :showHeader="false">
+      <div class="page-search">
+        <a-form
+          layout="inline"
+          :autoFormCreate="(form)=>{this.searchForm = form}"
+          @submit.prevent="handleSearchSubmit"
+        >
+          <a-form-item label="关键词" fieldDecoratorId="keyword">
+            <a-input placeholder="请输入" allowClear />
+          </a-form-item>
+          <!-- <a-form-item label="创建日期" fieldDecoratorId="date">
+            <a-range-picker :placeholder="['开始日期','结束日期']"></a-range-picker>
+          </a-form-item>:loading="actionInfo.confirmLoading" -->
+          <a-form-item>
+            <a-button
+              icon="search"
+              type="primary"
+              htmlType="submit"
+              
+            >搜索</a-button>
+          </a-form-item>
+        </a-form>
+      </div>
+      <a-list class="project-list" :loading="loading" size="small">
+        <a-list-item :style="{padding:'8px 0'}" :key="index" v-for="(item, index) in list">
+          <a-list-item-meta>
+            <div slot="title">
+              <div style="display: flex;justify-content: space-between ">
+                <router-link
+                  target="_blank"
+                  class="task-title-wrap"
+                  :to="`/project/space/task/${item.project_code}/detail/${item.code}`"
+                >
+                  <a-tooltip :title="item.name">{{ item.name }}</a-tooltip>
+                </router-link>
+                <router-link
+                  target="_blank"
+                  class="muted hidden-xs"
+                  :to="'/project/space/task/' + item.project_code"
+                >
+                  <a-tooltip title="所属项目">{{ item.organization.project_name }}</a-tooltip>
+                </router-link>
+              </div>
+            </div>
+            <!-- <div slot="description">
+            </div>-->
+          </a-list-item-meta>
+          <span slot="actions">
+            <a-tooltip :title="item.stared ? '取消收藏' : '加入收藏'" @click="doAction(item,'star',index)">
+              <a-icon type="star" v-show="!item.stared" />
+              <a-icon type="star" theme="filled" style="color: #ffaf38;" v-show="item.stared" />
+            </a-tooltip>
+          </span>
+        </a-list-item>
+        <div
+          v-if="showLoadingMore"
+          slot="loadMore"
+          :style="{ textAlign: 'center', marginTop: '3rem',marginBottom: '3rem', height: '32px', lineHeight: '32px' }"
+        >
+          <a-spin v-if="loadingMore">
+            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+          </a-spin>
+          <a-button v-else @click="onLoadMore">查看更多项目</a-button>
+        </div>
+      </a-list>
+    </wrapper-content>
+  </div>
+</template>
+<script>
+import { checkResponse } from "@/assets/js/utils";
+import pagination from "@/mixins/pagination";
+import moment from "moment";
+import { list, star } from "../../../api/task";
+
+export default {
+  components: {},
+  mixins: [pagination],
+  data() {
+    return {
+      list: [],
+      loading: {
+        spinning: false,
+        indicator: <a-icon type="loading" style="font-size: 2rem" spin />,
+      },
+      showLoadingMore: false,
+      loadingMore: false,
+      form: this.$form.createForm(this),
+      searchForm: {},
+    };
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    moment,
+    init(reset = true) {
+      let app = this;
+      if (reset) {
+        this.list = [];
+        this.pagination.page = 1;
+        this.pagination.pageSize = 100;
+        this.showLoadingMore = false;
+      }
+      this.requestData.public = "faq";
+      app.loading.spinning = true;
+      list(app.requestData).then((res) => {
+        app.list = app.list.concat(res.data.list);
+        app.pagination.total = res.data.total;
+        app.showLoadingMore = app.pagination.total > app.list.length;
+        app.loading.spinning = false;
+        app.loadingMore = false;
+      });
+    },
+    onLoadMore() {
+      this.loadingMore = true;
+      this.pagination.page++;
+      this.init(false);
+    },
+    handleSearchSubmit() {
+      let app = this;
+      app.searchForm.validateFields((err) => {
+        if (!err) {
+          app.search();
+        }
+      });
+    },
+    search() {
+      let obj = this.searchForm.getFieldsValue();
+      if (Array.isArray(obj.date) && obj.date.length >= 2) {
+        obj.date[0] =
+          obj.date[0].format instanceof Function
+            ? obj.date[0].format("YYYY-MM-DD")
+            : obj.date[0];
+        obj.date[1] =
+          obj.date[1].format instanceof Function
+            ? obj.date[1].format("YYYY-MM-DD")
+            : obj.date[1];
+      }
+      Object.assign(this.requestData, obj);
+      this.init();
+    },
+    doAction(record, action, index) {
+      let app = this;
+      if (action == "star") {
+        star(record.code, record.stared ? 0 : 1).then(() => {
+          app.$set(app.list[index], "stared", !record.stared);
+        });
+      }
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.wrapper-main {
+  padding: 0;
+}
+</style>
-- 
Gitee


From 03cc242589e17b272db22f4e00dcaecb8befb6d7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Fri, 30 Jul 2021 12:51:17 +0800
Subject: [PATCH 7/8] =?UTF-8?q?v2.9.1=20=E5=A2=9E=E5=8A=A0=E5=B7=A5?=
 =?UTF-8?q?=E6=97=B6=E5=B0=8F=E6=95=B0=E7=82=B9=E6=98=BE=E7=A4=BA;=20?=
 =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E9=80=89=E6=8B=A9=E5=99=A8=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=AE=8C=E5=96=84=E5=86=85=E9=83=A8=E8=B0=83=E7=94=A8;=20?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=85=AC=E5=85=B1=E6=96=87=E4=BB=B6=E5=8C=BA?=
 =?UTF-8?q?=E5=9B=9E=E6=94=B6=E7=AB=99;=20=E5=A2=9E=E5=8A=A0=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E5=BD=BB=E5=BA=95=E5=88=A0=E9=99=A4;=20=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E4=BF=AE=E5=A4=8D=E4=B8=80=E4=BA=9B=E4=B8=9C=E8=A5=BF?=
 =?UTF-8?q?=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json                                  |    3 +-
 src/assets/css/components/warpperContent.less |    1 +
 src/assets/js/dateTime.js                     |  440 +-
 src/components/project/projectSelect.vue      |   40 +-
 src/components/project/recycleBin.vue         |  110 +-
 src/components/project/taskDetail.vue         | 4810 +++++++++--------
 src/config/version.js                         |   18 +-
 src/main.js                                   |    4 +-
 src/utils/utils.js                            |   17 +
 src/views/files/index.vue                     |  114 +-
 src/views/members/index.vue                   |  113 +-
 src/views/project/calendar/index.vue          |  370 ++
 src/views/project/space/files.vue             |  146 +-
 src/views/project/space/task.vue              |    2 +-
 14 files changed, 3563 insertions(+), 2625 deletions(-)
 create mode 100644 src/utils/utils.js
 create mode 100644 src/views/project/calendar/index.vue

diff --git a/package.json b/package.json
index 2ec4b81..80062d3 100644
--- a/package.json
+++ b/package.json
@@ -8,7 +8,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
-    "ant-design-vue": "latest",
+    "ant-design-vue": "^1.7.5",
     "axios": "^0.19.0",
     "core-js": "^2.6.9",
     "dingtalk-jsapi": "^2.7.6",
@@ -21,6 +21,7 @@
     "vue": "^2.5.17",
     "vue-clipboards": "^1.2.4",
     "vue-cropper": "^0.4.7",
+    "vue-ganttastic": "^0.9.32",
     "vue-router": "^3.0.1",
     "vue-simple-uploader": "^0.5.6",
     "vuedraggable": "^2.17.0",
diff --git a/src/assets/css/components/warpperContent.less b/src/assets/css/components/warpperContent.less
index e94c9cf..fa147a5 100644
--- a/src/assets/css/components/warpperContent.less
+++ b/src/assets/css/components/warpperContent.less
@@ -93,6 +93,7 @@
   padding: 1rem;
   background: rgb(255, 255, 255);
   height: 100%;
+  border-radius: 1rem;
 }
 
 .wrapper-content {
diff --git a/src/assets/js/dateTime.js b/src/assets/js/dateTime.js
index 2f7c27a..86da4a6 100644
--- a/src/assets/js/dateTime.js
+++ b/src/assets/js/dateTime.js
@@ -5,31 +5,41 @@
 import moment from "moment";
 
 export const getWeekDay = () => {
-    //起止日期数组
-    var startStop = [];
-    //获取当前时间
-    var currentDate = new Date();
-    //返回date是一周中的某一天
-    var week = currentDate.getDay();
-    //返回date是一个月中的某一天
-    var month = currentDate.getDate();
+  //起止日期数组
+  var startStop = [];
+  //获取当前时间
+  var currentDate = new Date();
+  //返回date是一周中的某一天
+  var week = currentDate.getDay();
+  //返回date是一个月中的某一天
+  var month = currentDate.getDate();
 
-    //一天的毫秒数
-    var millisecond = 1000 * 60 * 60 * 24;
-    //减去的天数
-    var minusDay = week != 0 ? week - 1 : 6;
-    //alert(minusDay)
-    //本周 周一
-    var monday = new Date(currentDate.getTime() - (minusDay * millisecond));
-    //本周 周日
-    var sunday = new Date(monday.getTime() + (6 * millisecond));
-    monday = monday.getFullYear() + "-" + (monday.getMonth() + 1) + "-" + monday.getDate();
-    sunday = sunday.getFullYear() + "-" + (sunday.getMonth() + 1) + "-" + sunday.getDate();
-    var week_day = {
-        monday: monday,
-        sunday: sunday,
-    };
-    return week_day
+  //一天的毫秒数
+  var millisecond = 1000 * 60 * 60 * 24;
+  //减去的天数
+  var minusDay = week != 0 ? week - 1 : 6;
+  //alert(minusDay)
+  //本周 周一
+  var monday = new Date(currentDate.getTime() - minusDay * millisecond);
+  //本周 周日
+  var sunday = new Date(monday.getTime() + 6 * millisecond);
+  monday =
+    monday.getFullYear() +
+    "-" +
+    (monday.getMonth() + 1) +
+    "-" +
+    monday.getDate();
+  sunday =
+    sunday.getFullYear() +
+    "-" +
+    (sunday.getMonth() + 1) +
+    "-" +
+    sunday.getDate();
+  var week_day = {
+    monday: monday,
+    sunday: sunday,
+  };
+  return week_day;
 };
 /**
  * 格式化相对时间
@@ -38,38 +48,42 @@ export const getWeekDay = () => {
  * @param now
  */
 export const relativelyTime = (value, now) => {
-    if (!now) {
-        now = moment();
-    }
-    const diff = moment(now).diff(moment(value), 'hours');
-    if (diff <= 1) {
-        return moment(value).fromNow();
-    }
-    const today = moment(now).get('date');
-    const current = moment(value).get('date');
-    if (current < today - 1) {
-        // return moment(value).format('M月D日 H:mm');
-    }
-    let detailTime = moment(value).format('H:mm');
-    const currentDate = moment(value).format('YYYY-MM-DD');
-    const currentMonday = moment().weekday(0).format('YYYY-MM-DD');
-    const currentSunday = moment().weekday(6).format('YYYY-MM-DD');
-    let weekDate = '';
-    if (currentDate < currentMonday) {
-        weekDate = '[上周]dd ' + detailTime;
-    }else if (currentDate > currentSunday) {
-        weekDate = '[下周]dd ' + detailTime;
-    }else{
-        weekDate = '[周]dd ' + detailTime;
-    }
-    return moment(value).calendar(null, {
-        sameDay: '[今天 ]' + moment(value).format('H:mm'),
-        nextDay: '[明天 ]' + detailTime,
-        nextWeek: weekDate,
-        lastDay: '[昨天 ]' + detailTime,
-        lastWeek: weekDate,
-        sameElse: 'M月D日 H:mm'
-    });
+  if (!now) {
+    now = moment();
+  }
+  const diff = moment(now).diff(moment(value), "hours");
+  if (diff <= 1) {
+    return moment(value).fromNow();
+  }
+  const today = moment(now).get("date");
+  const current = moment(value).get("date");
+  if (current < today - 1) {
+    // return moment(value).format('M月D日 H:mm');
+  }
+  let detailTime = moment(value).format("H:mm");
+  const currentDate = moment(value).format("YYYY-MM-DD");
+  const currentMonday = moment()
+    .weekday(0)
+    .format("YYYY-MM-DD");
+  const currentSunday = moment()
+    .weekday(6)
+    .format("YYYY-MM-DD");
+  let weekDate = "";
+  if (currentDate < currentMonday) {
+    weekDate = "[上周]dd " + detailTime;
+  } else if (currentDate > currentSunday) {
+    weekDate = "[下周]dd " + detailTime;
+  } else {
+    weekDate = "[周]dd " + detailTime;
+  }
+  return moment(value).calendar(null, {
+    sameDay: "[今天 ]" + moment(value).format("H:mm"),
+    nextDay: "[明天 ]" + detailTime,
+    nextWeek: weekDate,
+    lastDay: "[昨天 ]" + detailTime,
+    lastWeek: weekDate,
+    sameElse: "M月D日 H:mm",
+  });
 };
 /**
  *
@@ -78,39 +92,49 @@ export const relativelyTime = (value, now) => {
  * @returns {string}
  */
 export const relativelyTaskTime = (value, showDetailTime = false) => {
-    let detailTime = moment(value).format('H:mm');
-    if (!showDetailTime) {
-        detailTime = '';
-    }
-    const currentDate = moment(value).format('YYYY-MM-DD');
-    const currentMonday = moment().weekday(0).format('YYYY-MM-DD');
-    const currentSunday = moment().weekday(6).format('YYYY-MM-DD');
-    let weekDate = '';
-    if (currentDate < currentMonday) {
-        weekDate = '[上周]dd ' + detailTime;
-    }else if (currentDate > currentSunday) {
-        weekDate = '[下周]dd ' + detailTime;
-    }else{
-        weekDate = '[周]dd ' + detailTime;
-    }
-    return moment(value).calendar(null, {
-        sameDay: '[今天 ]' + moment(value).format('H:mm'),
-        nextDay: '[明天 ]' + detailTime,
-        nextWeek: weekDate,
-        lastDay: '[昨天 ]' + detailTime,
-        lastWeek: weekDate,
-        sameElse: 'M月D日 H:mm'
-    });
+  let detailTime = moment(value).format("H:mm");
+  if (!showDetailTime) {
+    detailTime = "";
+  }
+  const currentDate = moment(value).format("YYYY-MM-DD");
+  const currentMonday = moment()
+    .weekday(0)
+    .format("YYYY-MM-DD");
+  const currentSunday = moment()
+    .weekday(6)
+    .format("YYYY-MM-DD");
+  let weekDate = "";
+  if (currentDate < currentMonday) {
+    weekDate = "[上周]dd " + detailTime;
+  } else if (currentDate > currentSunday) {
+    weekDate = "[下周]dd " + detailTime;
+  } else {
+    weekDate = "[周]dd " + detailTime;
+  }
+  return moment(value).calendar(null, {
+    sameDay: "[今天 ]" + moment(value).format("H:mm"),
+    nextDay: "[明天 ]" + detailTime,
+    nextWeek: weekDate,
+    lastDay: "[昨天 ]" + detailTime,
+    lastWeek: weekDate,
+    sameElse: "M月D日 H:mm",
+  });
 };
 export const formatTaskTime = (begin, end) => {
-    //如果不是今天则不显示具体时间
-    if (!end && begin) {
-        return relativelyTaskTime(begin) + ' 开始';
-    }
-    if (!begin) {
-        return relativelyTaskTime(end) + ' 截止';
-    }
-    return relativelyTaskTime(begin) + ' - ' + relativelyTaskTime(end);
+  //如果不是今天则不显示具体时间
+  if (!end && begin) {
+    return relativelyTaskTime(begin, true) + " 开始";
+  }
+  if (!begin) {
+    return relativelyTaskTime(end, true) + " 截止";
+  }
+  return (
+    relativelyTaskTime(begin, true) +
+    " - " +
+    (moment(end).isSame(begin, "day")
+      ? moment(end).format("H:mm")
+      : relativelyTaskTime(end, true))
+  );
 };
 /**
  * 格式化时间
@@ -119,59 +143,59 @@ export const formatTaskTime = (begin, end) => {
  * @returns {string}
  */
 export const format_date = (data, show) => {
-    if (show == undefined) {
-        show = true
-    }
-    //格式化时间
-    let now = new Date(data * 1000);
-    let year = now.getFullYear();
-    let month = now.getMonth() + 1;
-    let date = now.getDate();
-    let hour = now.getHours();
-    let minute = now.getMinutes();
-    // let second = now.getSeconds();
-    if (month < 10) {
-        month = '0' + month;
-    }
-    if (date < 10) {
-        date = '0' + date;
-    }
-    if (hour < 10) {
-        hour = '0' + hour;
-    }
-    if (minute < 10) {
-        minute = '0' + minute;
-    }
-    const finally_date = {
-        year: year,
-        month: month,
-        day: date,
-        hour: hour,
-        minute: minute
-    };
-    if (show) {
-        return year + "-" + month + "-" + date + "   " + hour + ":" + minute;
-    } else {
-        return finally_date
-    }
+  if (show == undefined) {
+    show = true;
+  }
+  //格式化时间
+  let now = new Date(data * 1000);
+  let year = now.getFullYear();
+  let month = now.getMonth() + 1;
+  let date = now.getDate();
+  let hour = now.getHours();
+  let minute = now.getMinutes();
+  // let second = now.getSeconds();
+  if (month < 10) {
+    month = "0" + month;
+  }
+  if (date < 10) {
+    date = "0" + date;
+  }
+  if (hour < 10) {
+    hour = "0" + hour;
+  }
+  if (minute < 10) {
+    minute = "0" + minute;
+  }
+  const finally_date = {
+    year: year,
+    month: month,
+    day: date,
+    hour: hour,
+    minute: minute,
+  };
+  if (show) {
+    return year + "-" + month + "-" + date + "   " + hour + ":" + minute;
+  } else {
+    return finally_date;
+  }
 };
 
 export const formatDateNow = (day) => {
-    //格式化时间
-    if (day == undefined) {
-        day = 0;
-    }
-    let now = new Date();
-    let year = now.getFullYear();
-    let month = now.getMonth() + 1;
-    let date = now.getDate() + day;
-    if (month < 10) {
-        month = '0' + month;
-    }
-    if (date < 10) {
-        date = '0' + date;
-    }
-    return year + "-" + month + "-" + date;
+  //格式化时间
+  if (day == undefined) {
+    day = 0;
+  }
+  let now = new Date();
+  let year = now.getFullYear();
+  let month = now.getMonth() + 1;
+  let date = now.getDate() + day;
+  if (month < 10) {
+    month = "0" + month;
+  }
+  if (date < 10) {
+    date = "0" + date;
+  }
+  return year + "-" + month + "-" + date;
 };
 
 /**
@@ -181,36 +205,36 @@ export const formatDateNow = (day) => {
  * @returns {string}
  */
 export const showTaskTime = (begin_time, end_time) => {
-    let task_time = '';
-    let begin_time_format = '';
-    let end_time_format = '';
-    begin_time = Date.parse(new Date(begin_time)) / 1000;
-    end_time = Date.parse(new Date(end_time)) / 1000;
-    if (begin_time > 0) {
-        let begin = format_date(begin_time, false);
-        begin_time_format = begin.month + '月' + begin.day + '日' + ' - '
+  let task_time = "";
+  let begin_time_format = "";
+  let end_time_format = "";
+  begin_time = Date.parse(new Date(begin_time)) / 1000;
+  end_time = Date.parse(new Date(end_time)) / 1000;
+  if (begin_time > 0) {
+    let begin = format_date(begin_time, false);
+    begin_time_format = begin.month + "月" + begin.day + "日" + " - ";
+  }
+  if (end_time > 0) {
+    let end = format_date(end_time, false);
+    end_time_format = end.month + "月" + end.day + "日";
+    if (end.hour > 12 && end.hour <= 18) {
+      end_time_format += " 下午下班前";
+    }
+    if (end.hour > 18) {
+      end_time_format += " 加班";
     }
-    if (end_time > 0) {
-        let end = format_date(end_time, false);
-        end_time_format = end.month + '月' + end.day + '日';
-        if (end.hour > 12 && end.hour <= 18) {
-            end_time_format += ' 下午下班前'
-        }
-        if (end.hour > 18) {
-            end_time_format += ' 加班'
-        }
-        if (end.hour <= 12 && end.hour >= 8) {
-            end_time_format += ' 上午下班前'
-        }
-        if (end.hour < 8 && end.hour > 0) {
-            end_time_format += ' 通宵'
-        }
+    if (end.hour <= 12 && end.hour >= 8) {
+      end_time_format += " 上午下班前";
     }
-    if (begin_time_format == '') {
-        end_time_format += '完成'
+    if (end.hour < 8 && end.hour > 0) {
+      end_time_format += " 通宵";
     }
-    task_time += begin_time_format + end_time_format;
-    return task_time
+  }
+  if (begin_time_format == "") {
+    end_time_format += "完成";
+  }
+  task_time += begin_time_format + end_time_format;
+  return task_time;
 };
 /**
  *
@@ -218,28 +242,20 @@ export const showTaskTime = (begin_time, end_time) => {
  * @param time
  */
 export const showHelloTime = (time) => {
-    let time_format = '';
-    if (time == undefined) {
-        time = new Date();
-    }
-    let hr = time.getHours();
-    if ((hr >= 0) && (hr <= 4))
-        time_format = "深夜了，注意身体，";
-    if ((hr >= 4) && (hr < 7))
-        time_format = "清晨好， ";
-    if ((hr >= 7) && (hr < 12))
-        time_format = "早安，";
-    if ((hr >= 12) && (hr <= 13))
-        time_format = "午饭时间到了，";
-    if ((hr >= 13) && (hr <= 17))
-        time_format = "下午好，";
-    if ((hr >= 17) && (hr <= 18))
-        time_format = "进入傍晚了，";
-    if ((hr >= 18) && (hr <= 20))
-        time_format = "吃过晚饭了吗，";
-    if ((hr >= 20) && (hr <= 24))
-        time_format = "在加班吗？辛苦了，";
-    return time_format
+  let time_format = "";
+  if (time == undefined) {
+    time = new Date();
+  }
+  let hr = time.getHours();
+  if (hr >= 0 && hr <= 4) time_format = "深夜了，注意身体，";
+  if (hr >= 4 && hr < 7) time_format = "清晨好， ";
+  if (hr >= 7 && hr < 12) time_format = "早安，";
+  if (hr >= 12 && hr <= 13) time_format = "午饭时间到了，";
+  if (hr >= 13 && hr <= 17) time_format = "下午好，";
+  if (hr >= 17 && hr <= 18) time_format = "进入傍晚了，";
+  if (hr >= 18 && hr <= 20) time_format = "吃过晚饭了吗，";
+  if (hr >= 20 && hr <= 24) time_format = "在加班吗？辛苦了，";
+  return time_format;
 };
 
 /**
@@ -249,24 +265,28 @@ export const showHelloTime = (time) => {
  * @param format
  */
 export const dateFormat = (date, format) => {
-    let o = {
-        "M+": date.getMonth() + 1, //month
-        "d+": date.getDate(),    //day
-        "h+": date.getHours(),   //hour
-        "m+": date.getMinutes(), //minute
-        "s+": date.getSeconds(), //second
-        "q+": Math.floor((date.getMonth() + 3) / 3),  //quarter
-        "S": date.getMilliseconds() //millisecond
-    };
-    if (/(y+)/.test(format)) {
-        format = format.replace(RegExp.$1,
-            (date.getFullYear() + "").substr(4 - RegExp.$1.length));
-    }
-    for (let k in o) if (new RegExp("(" + k + ")").test(format))
-        format = format.replace(RegExp.$1,
-            RegExp.$1.length == 1 ? o[k] :
-                ("00" + o[k]).substr(("" + o[k]).length));
-    return format;
+  let o = {
+    "M+": date.getMonth() + 1, //month
+    "d+": date.getDate(), //day
+    "h+": date.getHours(), //hour
+    "m+": date.getMinutes(), //minute
+    "s+": date.getSeconds(), //second
+    "q+": Math.floor((date.getMonth() + 3) / 3), //quarter
+    S: date.getMilliseconds(), //millisecond
+  };
+  if (/(y+)/.test(format)) {
+    format = format.replace(
+      RegExp.$1,
+      (date.getFullYear() + "").substr(4 - RegExp.$1.length)
+    );
+  }
+  for (let k in o)
+    if (new RegExp("(" + k + ")").test(format))
+      format = format.replace(
+        RegExp.$1,
+        RegExp.$1.length == 1 ? o[k] : ("00" + o[k]).substr(("" + o[k]).length)
+      );
+  return format;
 };
 
 /**
@@ -276,10 +296,10 @@ export const dateFormat = (date, format) => {
  * @returns {string}
  */
 export const convert = (num) => {
-    let result = "";
-    while (num) {
-        result = String.fromCharCode(--num % 26 + 65) + result;
-        num = Math.floor(num / 26)
-    }
-    return result
+  let result = "";
+  while (num) {
+    result = String.fromCharCode((--num % 26) + 65) + result;
+    num = Math.floor(num / 26);
+  }
+  return result;
 };
diff --git a/src/components/project/projectSelect.vue b/src/components/project/projectSelect.vue
index 2fc57ae..6cdb312 100644
--- a/src/components/project/projectSelect.vue
+++ b/src/components/project/projectSelect.vue
@@ -1,14 +1,17 @@
 <template>
-  <div id="project-select" v-if="currentProject">
+  <div id="project-select">
     <a-dropdown
       :trigger="['click']"
       v-model="visibleMenu"
       class="action-item"
       placement="bottomCenter"
     >
-      <a-tooltip :mouseEnterDelay="0.3" :title="currentProject.name">
+      <a-tooltip
+        :mouseEnterDelay="0.3"
+        :title="(currentProject && currentProject.name) || '全部'"
+      >
         <div class="project-select" style="color: #333">
-          <span>{{currentProject.name}}</span>
+          <span>{{ (currentProject && currentProject.name) || "全部" }}</span>
           <span class="m-l-xs">
             <a-icon type="down" />
           </span>
@@ -23,12 +26,28 @@
         <div class="member-list">
           <vue-scroll>
             <div class="list-group">
+              <a-list-item
+                class="member-list-item"
+                slot="renderItem"
+                v-if="rettype"
+                @click.native="changeProject('');currentProject = null"
+              >
+                <span slot="actions">
+                  <a-icon type="check" v-show="showCheck('')"></a-icon>
+                </span>
+                <a-list-item-meta>
+                  <span slot="title">全部</span>
+                </a-list-item-meta>
+              </a-list-item>
               <a-list
                 class="list-content"
                 itemLayout="horizontal"
                 size="small"
                 :dataSource="projectList"
-                :locale="{emptyText: (keyword && keyword.length > 1) ? '没有找到该项目' : ''}"
+                :locale="{
+                  emptyText:
+                    keyword && keyword.length > 1 ? '没有找到该项目' : '',
+                }"
               >
                 <a-list-item
                   class="member-list-item"
@@ -40,7 +59,7 @@
                     <a-icon type="check" v-show="showCheck(item.code)"></a-icon>
                   </span>
                   <a-list-item-meta>
-                    <span slot="title">{{item.name}}</span>
+                    <span slot="title">{{ item.name }}</span>
                     <a-avatar slot="avatar" icon="user" :src="item.cover" />
                   </a-list-item-meta>
                 </a-list-item>
@@ -71,6 +90,12 @@ export default {
         return "";
       },
     },
+    rettype: {
+      type: [Boolean],
+      default() {
+        return false;
+      },
+    },
   },
   data() {
     return {
@@ -103,7 +128,7 @@ export default {
   },
   methods: {
     init() {
-      this.getProject();
+      this.code && this.getProject();
       this.getProjectList(true);
     },
     getProject() {
@@ -124,6 +149,9 @@ export default {
     },
     changeProject(code) {
       this.visibleMenu = false;
+      if (this.rettype) {
+        return this.$emit("change-project", code);
+      }
       if (this.$route.path == "/project/space/task/" + code) {
         this.init();
       } else {
diff --git a/src/components/project/recycleBin.vue b/src/components/project/recycleBin.vue
index 2997c81..e9c3861 100644
--- a/src/components/project/recycleBin.vue
+++ b/src/components/project/recycleBin.vue
@@ -1,14 +1,16 @@
 <template>
-  <a-tabs tabPosition="left" defaultActiveKey="1" :animated="false" v-model="tabKey">
+  <a-tabs
+    tabPosition="left"
+    defaultActiveKey="1"
+    :animated="false"
+    v-model="tabKey"
+    v-if="code"
+  >
     <a-tab-pane key="1">
-      <span slot="tab">
-        <a-icon type="check-square" />任务
-      </span>
+      <span slot="tab"> <a-icon type="check-square" />任务 </span>
     </a-tab-pane>
     <a-tab-pane key="2">
-      <span slot="tab">
-        <a-icon type="link" />文件
-      </span>
+      <span slot="tab"> <a-icon type="link" />文件 </span>
     </a-tab-pane>
     <div class="config-content">
       <vue-scroll>
@@ -18,7 +20,12 @@
               <div
                 v-if="showLoadingMore"
                 slot="loadMore"
-                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+                :style="{
+                  textAlign: 'center',
+                  marginTop: '12px',
+                  height: '32px',
+                  lineHeight: '32px',
+                }"
               >
                 <a-spin v-if="loadingMore">
                   <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
@@ -32,24 +39,26 @@
                       class="text-default"
                       v-show="tabKey == '1'"
                       :to="`/project/space/task/${code}/detail/${item.code}`"
-                    >{{ item.name }}</router-link>
+                      >{{ item.name }}</router-link
+                    >
                     <a
                       target="_blank"
                       class="text-default"
                       v-show="tabKey == '2'"
                       :href="item.file_url"
-                    >{{ item.fullName }}</a>
+                      >{{ item.fullName }}</a
+                    >
                   </div>
-                  <div slot="description">{{showTaskTime(item.deleted_time)}}</div>
+                  <div slot="description">{{ showTaskTime(item.deleted_time) }}</div>
                 </a-list-item-meta>
-                <a class="muted" slot="actions" @click="recoveryTask(item,index)">
+                <a class="muted" slot="actions" @click="recoveryTask(item, index)">
                   <a-tooltip title="恢复内容">
                     <a-icon type="undo" />
                   </a-tooltip>
                 </a>
-                <a class="muted" slot="actions" @click="deleteItem(item,index)">
+                <a class="muted" slot="actions" @click="deleteItem(item, index)">
                   <a-tooltip title="彻底删除">
-                    <a-icon type="delete" />
+                    <a-icon class="text-error" type="delete" />
                   </a-tooltip>
                 </a>
               </a-list-item>
@@ -59,6 +68,56 @@
       </vue-scroll>
     </div>
   </a-tabs>
+
+  <div class="config-content" v-else>
+    <vue-scroll>
+      <div class="content-item">
+        <div class="files-infos">
+          <a-list>
+            <div
+              v-if="showLoadingMore"
+              slot="loadMore"
+              :style="{
+                textAlign: 'center',
+                marginTop: '12px',
+                height: '32px',
+                lineHeight: '32px',
+              }"
+            >
+              <a-spin v-if="loadingMore">
+                <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+              </a-spin>
+              <a-button v-else @click="onLoadMore">加载更多</a-button>
+            </div>
+            <a-list-item
+              class="file-list-item"
+              :key="index"
+              v-for="(item, index) in list"
+            >
+              <a-list-item-meta>
+                <div slot="title">
+                  <a target="_blank" class="text-default" :href="item.file_url">{{
+                    item.fullName
+                  }}</a>
+                </div>
+                <div slot="description">{{ showTaskTime(item.deleted_time) }}</div>
+              </a-list-item-meta>
+              <a class="muted" slot="actions" @click="recoveryTask(item, index)">
+                <a-tooltip title="放回原处">
+                  <a-icon type="undo" />
+                </a-tooltip>
+              </a>
+              <a slot="actions" @click="deleteItem(item, index)">
+                <a-tooltip title="彻底删除">
+                  <a-icon class="text-error" type="delete" />
+                </a-tooltip>
+              </a>
+            </a-list-item>
+          </a-list>
+        </div>
+      </div>
+    </vue-scroll>
+  </div>
 </template>
 
 <script>
@@ -81,6 +140,12 @@ export default {
         return "";
       },
     },
+    organizationCode: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
   },
   mixins: [pagination],
   data() {
@@ -98,7 +163,7 @@ export default {
       this.init();
     },
     tabKey(val) {
-      this.init();
+      if (this.code) this.init();
     },
   },
   created() {
@@ -115,6 +180,8 @@ export default {
       }
       this.requestData.deleted = 1;
       this.requestData.projectCode = this.code;
+      this.requestData.organizationCode = this.organizationCode;
+      if (!this.code && this.tabKey == "1") this.tabKey = "2";
       app.loading = true;
       switch (this.tabKey) {
         case "1":
@@ -155,6 +222,7 @@ export default {
     },
     recoveryTask(item, index) {
       let app = this;
+      if (!this.code && this.tabKey == "1") this.tabKey = "2";
       switch (this.tabKey) {
         case "1":
           this.$confirm({
@@ -198,6 +266,7 @@ export default {
     },
     deleteItem(item, index) {
       let app = this;
+      if (!this.code && this.tabKey == "1") this.tabKey = "2";
       switch (this.tabKey) {
         case "1":
           this.$confirm({
@@ -287,9 +356,9 @@ export default {
       flex: 1 1;
       margin-bottom: 24px;
 
-      .infos {
+      .infos,
+      .files-infos {
         width: 100%;
-        padding-right: 12px;
 
         p {
           margin-bottom: 6px;
@@ -302,6 +371,13 @@ export default {
         .item-tips {
           margin-bottom: 12px;
         }
+
+        .file-list-item {
+          padding: 12px 1rem;
+        }
+      }
+      .infos {
+        padding-right: 12px;
       }
     }
   }
diff --git a/src/components/project/taskDetail.vue b/src/components/project/taskDetail.vue
index b07a67a..e667757 100644
--- a/src/components/project/taskDetail.vue
+++ b/src/components/project/taskDetail.vue
@@ -1,550 +1,688 @@
 <template>
-    <div class="task-detail" id="task-detail">
-        <a-spin class="task-detail-spin" :spinning="loading">
-            <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
-            <div class="task-header" :class="{'disabled': task.deleted}">
-                    <span class="head-title" v-if="!task.deleted">
-                        <span v-if="task.parentTask">
-                            <span class="muted">属于任务：</span>
-                            <!--<a class="text-default" @click="init(task.pcode)">{{task.parentTask.name}}</a>-->
-                             <a-breadcrumb separator=">" class="breadcrumb text-default">
-                                <a-breadcrumb-item v-for="parent in  task.parentTasks" :key="parent.code">
-                                    <a class="text-default" @click="init(parent.code)">{{parent.name}}</a>
-                                </a-breadcrumb-item>
-                            </a-breadcrumb>
-                        </span>
-                        <span v-else>{{task.projectName}} · {{task.stageName}}</span>
-                    </span>
-                <span class="head-title muted" v-else>
-                        <a-icon type="delete"/>&nbsp;
-                        <span>任务已在回收站中，不可修改</span>
-                    </span>
-                <span class="header-action text-right">
-                        <template v-if="!task.deleted">
-                            <a-tooltip :mouseEnterDelay="0.5">
+  <div class="task-detail" id="task-detail">
+    <a-spin class="task-detail-spin" :spinning="loading">
+      <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
+      <div class="task-header" :class="{ disabled: task.deleted }">
+        <span class="head-title" v-if="!task.deleted">
+          <span v-if="task.parentTask">
+            <span class="muted">属于任务：</span>
+            <!--<a class="text-default" @click="init(task.pcode)">{{task.parentTask.name}}</a>-->
+            <a-breadcrumb separator=">" class="breadcrumb text-default">
+              <a-breadcrumb-item v-for="parent in task.parentTasks" :key="parent.code">
+                <a class="text-default" @click="init(parent.code)">{{ parent.name }}</a>
+              </a-breadcrumb-item>
+            </a-breadcrumb>
+          </span>
+          <span v-else>{{ task.projectName }} · {{ task.stageName }}</span>
+        </span>
+        <span class="head-title muted" v-else>
+          <a-icon type="delete" />&nbsp;
+          <span>任务已在回收站中，不可修改</span>
+        </span>
+        <span class="header-action text-right">
+          <template v-if="!task.deleted">
+            <a-tooltip :mouseEnterDelay="0.5">
+              <template slot="title">
+                <span>复制任务链接</span>
+              </template>
+              <a class="action-item muted" v-clipboard="taskLink" @success="copyLink"
+                ><a-icon type="link"
+              /></a>
+            </a-tooltip>
+            <a-tooltip :mouseEnterDelay="0.5">
+              <template slot="title">
+                <span>点个赞</span>
+              </template>
+              <a
+                class="action-item muted"
+                :class="{ active: task.liked }"
+                @click="like(!task.liked)"
+              >
+                <a-icon type="like" />
+                <span v-show="task.like">{{ task.like }}</span>
+              </a>
+            </a-tooltip>
+            <a-dropdown
+              :trigger="['click']"
+              placement="bottomCenter"
+              v-model="visibleTaskMenu"
+            >
+              <a-tooltip :mouseEnterDelay="0.5">
+                <template slot="title">
+                  <span>打开菜单</span>
+                </template>
+                <a class="action-item muted"><a-icon type="ellipsis" /></a>
+              </a-tooltip>
+              <a-menu @click="doTask" class="field-right-menu" slot="overlay">
+                <a-menu-item key="copy">
+                  <a-icon type="copy" />
+                  <span>复制任务 *</span>
+                </a-menu-item>
+                <a-menu-item key="move">
+                  <a-icon type="snippets" />
+                  <span>移动任务 *</span>
+                </a-menu-item>
+                <a-menu-item key="star">
+                  <a-icon type="star"></a-icon>
+                  <span v-if="task.stared">取消收藏</span>
+                  <span v-else>收藏任务</span>
+                </a-menu-item>
+                <a-menu-item key="recycle">
+                  <a-icon type="delete"></a-icon>
+                  <span>移到回收站</span>
+                </a-menu-item>
+                <a-menu-item key="open">
+                  <a-icon type="book" />
+                  <span>以新标签页打开</span>
+                </a-menu-item>
+                <a-menu-divider />
+                <a-menu-item key="private">
+                  <a-icon :type="task.private ? 'lock' : 'unlock'" />
+                  <span>隐私模式</span>
+                  <a class="menu-action text-primary">
+                    <span v-if="task.private">已开启</span>
+                    <span v-else>已关闭</span>
+                  </a>
+                  <div class="menu-desc muted">
+                    <span v-if="task.private">仅参与者可见</span>
+                    <span v-else>所有成员可见</span>
+                  </div>
+                </a-menu-item>
+              </a-menu>
+            </a-dropdown>
+          </template>
+          <template v-else>
+            <a class="action-item muted" @click="recoveryTask">
+              <a-icon type="undo" /> <span>恢复内容</span>
+            </a>
+            <a class="action-item muted" @click="deleteTask">
+              <a-icon type="delete" /> <span>彻底删除</span>
+            </a>
+          </template>
+          <a-tooltip :mouseEnterDelay="0.5">
+            <template slot="title">
+              <span>关闭面板</span>
+            </template>
+            <a class="action-item muted" @click="detailClose"><a-icon type="close" /></a>
+          </a-tooltip>
+        </span>
+      </div>
+      <div class="task-wrap">
+        <div class="task-content">
+          <div class="content-left">
+            <vue-scroll :ops="scrollOps">
+              <div class="task-title" :class="{ disabled: task.deleted }">
+                <a-input
+                  ref="inputTitle"
+                  auto-focus
+                  @blur="doName"
+                  v-model="task.name"
+                  size="large"
+                  v-show="showEditName"
+                />
+                <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
+                  <template slot="title">
+                    <span>点击即可编辑</span>
+                  </template>
+                  <div class="title-text" @click="editTitle" v-show="!showEditName">
+                    {{ task.name }}
+                  </div>
+                </a-tooltip>
+                <div v-else class="title-text" v-show="!showEditName">
+                  {{ task.name }}
+                </div>
+              </div>
+              <div class="task-basic-attrs-view muted">
+                <div class="field-list" :class="{ disabled: task.deleted }">
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="check-square" />
+                        <span class="field-name">完成状态</span>
+                      </div>
+                      <div class="field-right">
+                        <a-dropdown
+                          :trigger="['click']"
+                          :disabled="!!task.deleted || !!task.hasUnDone"
+                          :class="{ disabled: task.hasUnDone }"
+                        >
+                          <a-tooltip placement="top">
                             <template slot="title">
-                                <span>复制任务链接</span>
+                              <span v-if="task.hasUnDone" style="font-size: 12px"
+                                >子任务尚未全部完成，无法完成父任务</span
+                              >
                             </template>
-                             <a class="action-item muted" v-clipboard="taskLink" @success="copyLink"><a-icon
-                                     type="link"/></a>
-                         </a-tooltip>
-                             <a-tooltip :mouseEnterDelay="0.5">
-                                <template slot="title">
-                                    <span>点个赞</span>
-                                </template>
-                                <a class="action-item muted" :class="{'active': task.liked}" @click="like(!task.liked)">
-                                    <a-icon type="like"/>
-                                    <span v-show="task.like">{{task.like}}</span>
-                                </a>
-                             </a-tooltip>
-                             <a-dropdown :trigger="['click']" placement="bottomCenter" v-model="visibleTaskMenu">
-                              <a-tooltip :mouseEnterDelay="0.5">
-                                 <template slot="title">
-                                    <span>打开菜单</span>
-                                 </template>
-                                  <a class="action-item muted"><a-icon type="ellipsis"/></a>
-                              </a-tooltip>
-                                <a-menu @click="doTask" class="field-right-menu"
-                                        slot="overlay">
-                                    <a-menu-item key="copy">
-                                           <a-icon type="copy"/>
-                                            <span>复制任务 *</span>
-                                    </a-menu-item>
-                                    <a-menu-item key="move">
-                                          <a-icon type="snippets"/>
-                                            <span>移动任务 *</span>
-                                    </a-menu-item>
-                                    <a-menu-item key="star">
-                                           <a-icon type="star"></a-icon>
-                                            <span v-if="task.stared">取消收藏</span>
-                                            <span v-else>收藏任务</span>
-                                    </a-menu-item>
-                                    <a-menu-item key="recycle">
-                                           <a-icon type="delete"></a-icon>
-                                            <span>移到回收站</span>
-                                    </a-menu-item>
-                                    <a-menu-item key="open">
-                                           <a-icon type="book"/>
-                                            <span>以新标签页打开</span>
-                                    </a-menu-item>
-                                     <a-menu-divider/>
-                                    <a-menu-item key="private">
-                                           <a-icon :type="task.private ? 'lock' : 'unlock'"/>
-                                            <span>隐私模式</span>
-                                            <a class="menu-action text-primary">
-                                                <span v-if="task.private">已开启</span>
-                                                <span v-else>已关闭</span>
-                                            </a>
-                                            <div class="menu-desc muted">
-                                                <span v-if="task.private">仅参与者可见</span>
-                                                <span v-else>所有成员可见</span>
-                                            </div>
-                                    </a-menu-item>
-                                </a-menu>
+                            <span>
+                              <!--<a-icon type="check-square"/>-->
+                              <a-tag v-if="task.done" color="green">已完成</a-tag>
+                              <span v-show="!task.done">未完成</span>
+                            </span>
+                          </a-tooltip>
+                          <a-menu
+                            class="field-right-menu"
+                            slot="overlay"
+                            :selectable="false"
+                            @click="taskDone(task.code, !task.done)"
+                          >
+                            <a-menu-item key="done">
+                              <div class="menu-item-content">
+                                <a-tag color="green">已完成</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="task.done"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item key="undone">
+                              <div class="menu-item-content">
+                                <a-tag color="grey">未完成</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="!task.done"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                          </a-menu>
                         </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="deployment-unit" />
+                        <span class="field-name">执行状态</span>
+                      </div>
+                      <div class="field-right">
+                        <a-dropdown
+                          :trigger="['click']"
+                          :disabled="!!task.deleted || !!task.hasUnDone"
+                          :class="{ disabled: task.hasUnDone }"
+                        >
+                          <span>{{ task.statusText }}</span>
+                          <a-menu
+                            class="field-right-menu"
+                            slot="overlay"
+                            :selectable="false"
+                            @click="taskStatusChange"
+                          >
+                            <a-menu-item
+                              :key="status.id"
+                              v-for="(status, index) in taskStatusList"
+                            >
+                              <div class="menu-item-content">
+                                <span color="green">{{ status.name }}</span>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="task.status == status.id"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                          </a-menu>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="user" />
+                        <span class="field-name">执行者</span>
+                      </div>
+                      <div class="field-right">
+                        <a-dropdown
+                          :trigger="['click']"
+                          v-model="visibleTaskMemberMenu"
+                          :disabled="!!task.deleted"
+                          placement="bottomCenter"
+                        >
+                          <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
+                            <template slot="title">
+                              <span>点击设置执行者</span>
+                            </template>
+                            <div class="field-flex">
+                              <template v-if="task.executor">
+                                <a-avatar
+                                  :src="task.executor.avatar"
+                                  icon="user"
+                                  size="small"
+                                />
+                                <a class="muted name">{{ task.executor.name }}</a>
+                              </template>
+                              <template v-if="!task.executor">
+                                <a-avatar icon="user" size="small" />
+                                <a class="muted name">待认领</a>
+                              </template>
+                            </div>
+                          </a-tooltip>
+                          <div class="field-flex" v-else>
+                            <template v-if="task.executor">
+                              <a-avatar
+                                :src="task.executor.avatar"
+                                icon="user"
+                                size="small"
+                              />
+                              <a class="muted name">{{ task.executor.name }}</a>
+                            </template>
+                            <template v-if="!task.executor">
+                              <a-avatar icon="user" size="small" />
+                              <a class="muted name">待认领</a>
+                            </template>
+                          </div>
+                          <div slot="overlay">
+                            <task-member-menu
+                              v-if="visibleTaskMemberMenu"
+                              :projectCode="projectCodeCurrent"
+                              :taskCode="code"
+                              @close="init(false)"
+                              @inviteProjectMember="
+                                (showInviteMember = true), (visibleTaskMemberMenu = false)
+                              "
+                            ></task-member-menu>
+                          </div>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="calendar" />
+                        <span class="field-name">时间</span>
+                      </div>
+                      <div class="field-right field-date">
+                        <template v-if="task.openBeginTime">
+                          <a-dropdown
+                            :trigger="['click']"
+                            v-model="showBeginTime"
+                            :disabled="!!task.deleted"
+                          >
+                            <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
+                              <template slot="title">
+                                <span>点击设置开始时间</span>
+                              </template>
+                              <div class="field-flex">
+                                <a class="muted name" style="margin: 0">
+                                  <template v-if="!task.setBeginTime"
+                                    >设置开始时间
+                                  </template>
+                                  <template v-else
+                                    >{{ task.begin_time_format }}
+                                  </template>
+                                </a>
+                              </div>
+                            </a-tooltip>
+                            <div class="field-flex" v-else>
+                              <a class="muted name" style="margin: 0">
+                                <template v-if="!task.setBeginTime"
+                                  >设置开始时间</template
+                                >
+                                <template v-else>{{ task.begin_time_format }}</template>
+                              </a>
+                            </div>
+                            <div slot="overlay">
+                              <a-date-picker
+                                v-model="task.begin_time"
+                                size="small"
+                                format="MM月DD日 HH:mm"
+                                showTime
+                                allowClear
+                                :showToday="false"
+                                :open="showBeginTime"
+                                @ok="doBeginTime(true)"
+                              >
+                                <template slot="renderExtraFooter">
+                                  <a
+                                    style="position: absolute"
+                                    size="small"
+                                    @click="doBeginTime(false)"
+                                    >清除</a
+                                  >
+                                </template>
+                              </a-date-picker>
+                            </div>
+                          </a-dropdown>
+                          <span class="m-l-sm m-r-sm">-</span>
                         </template>
-                        <template v-else>
-                            <a class="action-item muted" @click="recoveryTask">
-                                <a-icon type="undo"/> <span>恢复内容</span>
+                        <a-dropdown
+                          :trigger="['click']"
+                          v-model="showEndTime"
+                          :disabled="!!task.deleted"
+                        >
+                          <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
+                            <template slot="title">
+                              <span>点击设置截止时间</span>
+                            </template>
+                            <div class="field-flex">
+                              <a class="muted name" style="margin: 0">
+                                <template v-if="!task.setEndTime">设置截止时间</template>
+                                <template v-else>{{ task.end_time_format }}</template>
+                              </a>
+                            </div>
+                          </a-tooltip>
+                          <div class="field-flex" v-else>
+                            <a class="muted name" style="margin: 0">
+                              <template v-if="!task.setEndTime">设置截止时间</template>
+                              <template v-else>{{ task.end_time_format }}</template>
                             </a>
-                            <a class="action-item muted" @click="deleteTask">
-                                <a-icon type="delete"/> <span>彻底删除</span>
+                          </div>
+                          <div slot="overlay">
+                            <a-date-picker
+                              v-model="task.end_time"
+                              size="small"
+                              format="MM月DD日 HH:mm"
+                              showTime
+                              allowClear
+                              :showToday="false"
+                              :open="showEndTime"
+                              @ok="doEndTime(true)"
+                            >
+                              <template slot="renderExtraFooter">
+                                <a
+                                  style="position: absolute"
+                                  size="small"
+                                  @click="doEndTime(false)"
+                                  >清除</a
+                                >
+                              </template>
+                            </a-date-picker>
+                          </div>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="file-text" />
+                        <span class="field-name">备注</span>
+                      </div>
+                      <div class="field-right width-block">
+                        <div
+                          class="task-description"
+                          :class="{ disabled: task.deleted }"
+                          v-show="!showTaskDescriptionEdit"
+                          @click="showTaskDesc"
+                        >
+                          <div
+                            class="description-txt"
+                            v-show="task.description"
+                            v-html="task.description"
+                          ></div>
+                          <span v-show="!task.description">添加备注</span>
+                        </div>
+                        <div class="m-t-sm" v-if="hasMoreDesc">
+                          <a v-show="!showMoreDesc" @click="checkShowMoreDesc(true)"
+                            >显示更多</a
+                          >
+                          <a v-show="showMoreDesc" @click="checkShowMoreDesc(false)"
+                            >收起备注</a
+                          >
+                        </div>
+                        <div v-show="showTaskDescriptionEdit">
+                          <editor
+                            ref="vueWangeditor"
+                            id="editor"
+                            :uploadImgServer="editorConfig.uploadImgServer"
+                            :uploadImgHeaders="editorConfig.uploadImgHeaders"
+                            :menus="editorConfig.menus"
+                          ></editor>
+                          <div class="action-btn pull-right">
+                            <a
+                              type="text"
+                              class="cancel-text muted"
+                              @click="
+                                (showTaskDescriptionEdit = false), initContent(false)
+                              "
+                            >
+                              取消
                             </a>
-                        </template>
-                         <a-tooltip :mouseEnterDelay="0.5">
+                            <a-button
+                              type="primary"
+                              htmlType="submit"
+                              class="middle-btn"
+                              @click="doContent"
+                              >保存
+                            </a-button>
+                          </div>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="bulb" />
+                        <span class="field-name">优先级</span>
+                      </div>
+                      <div class="field-right">
+                        <a-dropdown :trigger="['click']" :disabled="!!task.deleted">
+                          <span>
+                            <a-tag :color="priColor(task.pri)">{{ task.priText }}</a-tag>
+                          </span>
+                          <a-menu
+                            class="field-right-menu"
+                            slot="overlay"
+                            @click="doPri"
+                            :selectable="false"
+                          >
+                            <a-menu-item :key="0">
+                              <div class="menu-item-content">
+                                <a-tag :color="priColor(0)">普通</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="task.pri == 0"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item :key="1">
+                              <div class="menu-item-content">
+                                <a-tag :color="priColor(1)">紧急</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="task.pri == 1"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                            <a-menu-item :key="2">
+                              <div class="menu-item-content">
+                                <a-tag :color="priColor(2)">非常紧急</a-tag>
+                                <a-icon
+                                  type="check"
+                                  class="check muted"
+                                  v-show="task.pri == 2"
+                                ></a-icon>
+                              </div>
+                            </a-menu-item>
+                          </a-menu>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount task-tag">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="tag" />
+                        <span class="field-name">标签</span>
+                      </div>
+                      <div class="field-right">
+                        <div class="inline-block">
+                          <a-tag
+                            :color="tag.tag.color"
+                            v-for="(tag, index) in task.tags"
+                            :key="index"
+                          >
+                            {{ tag.tag.name }}
+                            <a-icon type="close" @click="removeTag(tag.tag, index)" />
+                          </a-tag>
+                        </div>
+                        <a-dropdown
+                          :trigger="['click']"
+                          v-model="visibleTaskTagMenu"
+                          :disabled="!!task.deleted"
+                          placement="bottomCenter"
+                        >
+                          <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
                             <template slot="title">
-                                <span>关闭面板</span>
+                              <span>添加标签</span>
                             </template>
-                         <a class="action-item muted" @click="detailClose"><a-icon type="close"/></a>
-                     </a-tooltip>
-                    </span>
-            </div>
-            <div class="task-wrap">
-                <div class="task-content">
-                    <div class="content-left">
-                        <vue-scroll :ops="scrollOps">
-                            <div class="task-title" :class="{'disabled': task.deleted}">
-                                <a-input ref="inputTitle" auto-focus @blur="doName" v-model="task.name" size="large"
-                                         v-show="showEditName"/>
-                                <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
+                            <div class="inline-block">
+                              <a-icon
+                                class="member-item invite"
+                                type="plus-circle"
+                                theme="twoTone"
+                              />
+                            </div>
+                          </a-tooltip>
+                          <div class="inline-block">
+                            <a-icon
+                              class="member-item invite"
+                              type="plus-circle"
+                              theme="twoTone"
+                            />
+                          </div>
+                          <div slot="overlay">
+                            <task-tag-menu
+                              v-if="visibleTaskTagMenu"
+                              :projectCode="projectCodeCurrent"
+                              :taskCode="code"
+                              @change="taskTagChange"
+                              @update="taskTagUpdate"
+                              @delete="taskTagDelete"
+                            ></task-tag-menu>
+                          </div>
+                        </a-dropdown>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="bars" />
+                        <span class="field-name"
+                          >子任务
+                          <span v-show="childTaskList.length">
+                            · {{ childTaskDoneNum }}/{{ childTaskList.length }}</span
+                          ></span
+                        >
+                      </div>
+                      <div class="field-right width-block"></div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="block-field width-block">
+                        <div class="task-child">
+                          <div class="task-list" v-show="childTaskList.length">
+                            <div v-for="done in [0, 1]" :key="done">
+                              <div
+                                v-for="(childTask, index) in childTaskList"
+                                :key="childTask.code"
+                              >
+                                <div class="list-item task" v-if="childTask.done == done">
+                                  <a-tooltip placement="top">
                                     <template slot="title">
-                                        <span>点击即可编辑</span>
+                                      <span
+                                        v-if="childTask.parentDone"
+                                        style="font-size: 12px"
+                                        >父任务已完成，无法重做子任务</span
+                                      >
+                                      <span
+                                        v-else-if="childTask.hasUnDone"
+                                        style="font-size: 12px"
+                                        >子任务尚未全部完成，无法完成父任务</span
+                                      >
                                     </template>
-                                    <div class="title-text" @click="editTitle" v-show="!showEditName">
-                                        {{task.name}}
-                                    </div>
-                                </a-tooltip>
-                                <div v-else class="title-text" v-show="!showEditName">
-                                    {{task.name}}
-                                </div>
-                            </div>
-                            <div class="task-basic-attrs-view muted">
-                                <div class="field-list" :class="{'disabled': task.deleted}">
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="check-square"/>
-                                                <span class="field-name">完成状态</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <a-dropdown :trigger="['click']"
-                                                            :disabled="!!task.deleted || !!task.hasUnDone"
-                                                            :class="{'disabled': task.hasUnDone}">
-                                                    <a-tooltip placement="top">
-                                                        <template slot="title">
-                                                            <span v-if="task.hasUnDone" style="font-size: 12px;">子任务尚未全部完成，无法完成父任务</span>
-                                                        </template>
-                                                        <span>
-                                                        <!--<a-icon type="check-square"/>-->
-                                                        <a-tag v-if="task.done" color="green">已完成</a-tag>
-                                                        <span v-show="!task.done">未完成</span>
-                                                    </span>
-                                                    </a-tooltip>
-                                                    <a-menu class="field-right-menu" slot="overlay"
-                                                            :selectable="false"
-                                                            @click="taskDone(task.code,!task.done)">
-                                                        <a-menu-item key="done">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="green">已完成</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="task.done"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item key="undone">
-                                                            <div class="menu-item-content">
-                                                                <a-tag color="grey">未完成</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="!task.done"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="deployment-unit"/>
-                                                <span class="field-name">执行状态</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <a-dropdown :trigger="['click']"
-                                                            :disabled="!!task.deleted || !!task.hasUnDone"
-                                                            :class="{'disabled': task.hasUnDone}">
-                                                    <span>{{task.statusText}}</span>
-                                                    <a-menu class="field-right-menu" slot="overlay"
-                                                            :selectable="false"
-                                                            @click="taskStatusChange">
-                                                        <a-menu-item :key="status.id" v-for="(status, index) in taskStatusList">
-                                                            <div class="menu-item-content">
-                                                                <span color="green">{{status.name}}</span>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="task.status == status.id"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="user"/>
-                                                <span class="field-name">执行者</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <a-dropdown
-                                                        :trigger="['click']"
-                                                        v-model="visibleTaskMemberMenu"
-                                                        :disabled="!!task.deleted"
-                                                        placement="bottomCenter"
-                                                >
-                                                    <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
-                                                        <template slot="title">
-                                                            <span>点击设置执行者</span>
-                                                        </template>
-                                                        <div class="field-flex">
-                                                            <template v-if="task.executor">
-                                                                <a-avatar :src="task.executor.avatar" icon="user"
-                                                                          size="small"/>
-                                                                <a class="muted name">{{task.executor.name}}</a>
-                                                            </template>
-                                                            <template v-if="!task.executor">
-                                                                <a-avatar icon="user" size="small"/>
-                                                                <a class="muted name">待认领</a>
-                                                            </template>
-                                                        </div>
-                                                    </a-tooltip>
-                                                    <div class="field-flex" v-else>
-                                                        <template v-if="task.executor">
-                                                            <a-avatar :src="task.executor.avatar" icon="user"
-                                                                      size="small"/>
-                                                            <a class="muted name">{{task.executor.name}}</a>
-                                                        </template>
-                                                        <template v-if="!task.executor">
-                                                            <a-avatar icon="user" size="small"/>
-                                                            <a class="muted name">待认领</a>
-                                                        </template>
-                                                    </div>
-                                                    <div slot="overlay">
-                                                        <task-member-menu
-                                                                v-if="visibleTaskMemberMenu"
-                                                                :projectCode="projectCodeCurrent"
-                                                                :taskCode="code"
-                                                                @close="init(false)"
-                                                                @inviteProjectMember="
-                                                            showInviteMember = true,
-                                                            visibleTaskMemberMenu = false"
-                                                        ></task-member-menu>
-                                                    </div>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="calendar"/>
-                                                <span class="field-name">时间</span>
-                                            </div>
-                                            <div class="field-right field-date">
-                                                <template v-if="task.openBeginTime">
-                                                    <a-dropdown :trigger="['click']" v-model="showBeginTime"
-                                                                :disabled="!!task.deleted">
-                                                        <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
-                                                            <template slot="title">
-                                                                <span>点击设置开始时间</span>
-                                                            </template>
-                                                            <div class="field-flex">
-                                                                <a class="muted name" style="margin: 0">
-                                                                    <template v-if="!task.setBeginTime">设置开始时间
-                                                                    </template>
-                                                                    <template v-else>{{task.begin_time_format}}
-                                                                    </template>
-                                                                </a>
-                                                            </div>
-                                                        </a-tooltip>
-                                                        <div class="field-flex" v-else>
-                                                            <a class="muted name" style="margin: 0">
-                                                                <template v-if="!task.setBeginTime">设置开始时间</template>
-                                                                <template v-else>{{task.begin_time_format}}</template>
-                                                            </a>
-                                                        </div>
-                                                        <div slot="overlay">
-                                                            <a-date-picker
-                                                                    v-model="task.begin_time"
-                                                                    size="small"
-                                                                    format="MM月DD日 HH:mm"
-                                                                    showTime
-                                                                    allowClear
-                                                                    :showToday="false"
-                                                                    :open="showBeginTime"
-                                                                    @ok="doBeginTime(true)"
-                                                            >
-                                                                <template slot="renderExtraFooter">
-                                                                    <a style="position: absolute;" size="small"
-                                                                       @click="doBeginTime(false)">清除</a>
-                                                                </template>
-                                                            </a-date-picker>
-                                                        </div>
-                                                    </a-dropdown>
-                                                    <span class="m-l-sm m-r-sm">-</span>
-                                                </template>
-                                                <a-dropdown :trigger="['click']" v-model="showEndTime"
-                                                            :disabled="!!task.deleted">
-                                                    <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
-                                                        <template slot="title">
-                                                            <span>点击设置截止时间</span>
-                                                        </template>
-                                                        <div class="field-flex">
-                                                            <a class="muted name" style="margin: 0">
-                                                                <template v-if="!task.setEndTime">设置截止时间</template>
-                                                                <template v-else>{{task.end_time_format}}</template>
-                                                            </a>
-                                                        </div>
-                                                    </a-tooltip>
-                                                    <div class="field-flex" v-else>
-                                                        <a class="muted name" style="margin: 0">
-                                                            <template v-if="!task.setEndTime">设置截止时间</template>
-                                                            <template v-else>{{task.end_time_format}}</template>
-                                                        </a>
-                                                    </div>
-                                                    <div slot="overlay">
-                                                        <a-date-picker
-                                                                v-model="task.end_time"
-                                                                size="small"
-                                                                format="MM月DD日 HH:mm"
-                                                                showTime
-                                                                allowClear
-                                                                :showToday="false"
-                                                                :open="showEndTime"
-                                                                @ok="doEndTime(true)"
-                                                        >
-                                                            <template slot="renderExtraFooter">
-                                                                <a style="position: absolute;" size="small"
-                                                                   @click="doEndTime(false)">清除</a>
-                                                            </template>
-                                                        </a-date-picker>
-                                                    </div>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="file-text"/>
-                                                <span class="field-name">备注</span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                                <div class="task-description" :class="{'disabled': task.deleted}"
-                                                     v-show="!showTaskDescriptionEdit"
-                                                     @click="showTaskDesc">
-                                                    <div class="description-txt" v-show="task.description"
-                                                         v-html="task.description"></div>
-                                                    <span v-show="!task.description">添加备注</span>
-                                                </div>
-                                                <div class="m-t-sm" v-if="hasMoreDesc">
-                                                    <a v-show="!showMoreDesc"
-                                                       @click="checkShowMoreDesc(true)">显示更多</a>
-                                                    <a v-show="showMoreDesc"
-                                                       @click="checkShowMoreDesc(false)">收起备注</a>
-                                                </div>
-                                                <div v-show="showTaskDescriptionEdit">
-                                                    <editor ref="vueWangeditor"
-                                                            id="editor"
-                                                            :uploadImgServer="editorConfig.uploadImgServer"
-                                                            :uploadImgHeaders="editorConfig.uploadImgHeaders"
-                                                            :menus="editorConfig.menus"
-                                                    ></editor>
-                                                    <div class="action-btn pull-right">
-                                                        <a type="text" class="cancel-text muted"
-                                                           @click="showTaskDescriptionEdit = false,initContent(false)">
-                                                            取消
-                                                        </a>
-                                                        <a-button type="primary" htmlType='submit'
-                                                                  class="middle-btn"
-                                                                  @click="doContent">保存
-                                                        </a-button>
-                                                    </div>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="bulb"/>
-                                                <span class="field-name">优先级</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <a-dropdown :trigger="['click']" :disabled="!!task.deleted">
-                                                <span>
-                                                    <a-tag :color="priColor(task.pri)">{{task.priText}}</a-tag>
-                                                </span>
-                                                    <a-menu class="field-right-menu" slot="overlay" @click="doPri"
-                                                            :selectable="false">
-                                                        <a-menu-item :key="0">
-                                                            <div class="menu-item-content">
-                                                                <a-tag :color="priColor(0)">普通</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="task.pri == 0"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item :key="1">
-                                                            <div class="menu-item-content">
-                                                                <a-tag :color="priColor(1)">紧急</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="task.pri == 1"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                        <a-menu-item :key="2">
-                                                            <div class="menu-item-content">
-                                                                <a-tag :color="priColor(2)">非常紧急</a-tag>
-                                                                <a-icon type="check" class="check muted"
-                                                                        v-show="task.pri == 2"></a-icon>
-                                                            </div>
-                                                        </a-menu-item>
-                                                    </a-menu>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount task-tag">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="tag"/>
-                                                <span class="field-name">标签</span>
-                                            </div>
-                                            <div class="field-right">
-                                                <div class="inline-block">
-                                                    <a-tag :color="tag.tag.color" v-for="(tag,index) in task.tags"
-                                                           :key="index">
-                                                        {{tag.tag.name}}
-                                                        <a-icon type="close" @click="removeTag(tag.tag,index)"/>
-                                                    </a-tag>
-                                                </div>
-                                                <a-dropdown
-                                                        :trigger="['click']"
-                                                        v-model="visibleTaskTagMenu"
-                                                        :disabled="!!task.deleted"
-                                                        placement="bottomCenter"
-                                                >
-                                                    <a-tooltip :mouseEnterDelay="0.5" v-if="!task.deleted">
-                                                        <template slot="title">
-                                                            <span>添加标签</span>
-                                                        </template>
-                                                        <div class="inline-block">
-                                                            <a-icon class="member-item invite" type="plus-circle"
-                                                                    theme="twoTone"/>
-                                                        </div>
-                                                    </a-tooltip>
-                                                    <div class="inline-block">
-                                                        <a-icon class="member-item invite" type="plus-circle"
-                                                                theme="twoTone"/>
-                                                    </div>
-                                                    <div slot="overlay">
-                                                        <task-tag-menu
-                                                                v-if="visibleTaskTagMenu"
-                                                                :projectCode="projectCodeCurrent"
-                                                                :taskCode="code"
-                                                                @change="taskTagChange"
-                                                                @update="taskTagUpdate"
-                                                                @delete="taskTagDelete"
-                                                        ></task-tag-menu>
-                                                    </div>
-                                                </a-dropdown>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="bars"/>
-                                                <span class="field-name">子任务 <span v-show="childTaskList.length"> · {{childTaskDoneNum}}/{{childTaskList.length}}</span></span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                            </div>
-                                        </div>
+                                    <div
+                                      class="check-box-wrapper task-item"
+                                      @click.stop="
+                                        () => {
+                                          if (
+                                            task.deleted ||
+                                            childTask.parentDone ||
+                                            childTask.hasUnDone
+                                          )
+                                            return false;
+                                          taskDone(
+                                            childTask.code,
+                                            !childTask.done,
+                                            index,
+                                            'child'
+                                          );
+                                        }
+                                      "
+                                    >
+                                      <a-icon
+                                        class="check-box"
+                                        :class="{
+                                          disabled:
+                                            task.deleted ||
+                                            childTask.parentDone ||
+                                            childTask.hasUnDone,
+                                        }"
+                                        :type="childTask.done ? 'check-square' : 'border'"
+                                        :style="{ fontSize: '16px' }"
+                                      />
                                     </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="block-field width-block">
-                                                <div class="task-child">
-                                                    <div class="task-list" v-show="childTaskList.length">
-                                                        <div v-for="done in [0,1]" :key="done">
-                                                            <div
-                                                                    v-for="(childTask, index) in childTaskList"
-                                                                    :key="childTask.code">
-                                                                <div class="list-item task"
-                                                                     v-if="childTask.done == done"
-                                                                >
-                                                                    <a-tooltip placement="top">
-                                                                        <template slot="title">
-                                                                            <span v-if="childTask.parentDone"
-                                                                                  style="font-size: 12px;">父任务已完成，无法重做子任务</span>
-                                                                            <span v-else-if="childTask.hasUnDone"
-                                                                                  style="font-size: 12px;">子任务尚未全部完成，无法完成父任务</span>
-                                                                        </template>
-                                                                        <div class="check-box-wrapper task-item"
-                                                                             @click.stop="()=>{if(task.deleted || childTask.parentDone || childTask.hasUnDone) return false;taskDone(childTask.code,!childTask.done,index,'child')}">
-                                                                            <a-icon class="check-box"
-                                                                                    :class="{'disabled': task.deleted || childTask.parentDone || childTask.hasUnDone}"
-                                                                                    :type="childTask.done ? 'check-square' : 'border'"
-                                                                                    :style="{fontSize:'16px'}"/>
-                                                                        </div>
-                                                                        <!--<a class="task-item check-box"
+                                    <!--<a class="task-item check-box"
                                                                            :class="{'disabled': task.deleted || childTask.parentDone || childTask.hasUnDone}"
                                                                            @click="()=>{if(task.deleted || childTask.parentDone || childTask.hasUnDone) return false;taskDone(childTask.code,!childTask.done,index,'child')}">
                                                                             <a-icon type="check"
                                                                                     v-show="childTask.done"/>
                                                                         </a>-->
-                                                                    </a-tooltip>
-                                                                    <a-dropdown :trigger="['click']"
-                                                                                v-model="childTask.visibleChildTaskMemberMenu"
-                                                                                :disabled="!!task.deleted"
-                                                                                placement="bottomCenter"
-
-                                                                    >
-                                                                        <a-tooltip :mouseEnterDelay="0.5">
-                                                                            <template slot="title">
-                                                                                <span v-if="childTask.executor">{{childTask.executor.name}}</span>
-                                                                                <span v-else>待认领</span>
-                                                                            </template>
-                                                                            <a-avatar
-                                                                                    v-if="childTask.executor"
-                                                                                    class="task-item"
-                                                                                    :class="{'disabled': task.deleted}"
-
-                                                                                    size="small"
-                                                                                    icon="user"
-                                                                                    :src="childTask.executor.avatar"
-                                                                            ></a-avatar>
-                                                                            <a-avatar
-                                                                                    v-else
-                                                                                    class="task-item"
-                                                                                    :class="{'disabled': task.deleted}"
-
-                                                                                    size="small"
-                                                                                    icon="user"
-                                                                            ></a-avatar>
-                                                                        </a-tooltip>
-                                                                        <div slot="overlay">
-                                                                            <task-member-menu
-                                                                                    v-if="childTask.visibleChildTaskMemberMenu"
-                                                                                    :projectCode="projectCodeCurrent"
-                                                                                    :taskCode="childTask.code"
-                                                                                    :isCommit="true"
-                                                                                    @close="childTask.visibleChildTaskMemberMenu = false;getChildTasks();"
-                                                                                    @inviteProjectMember="
-                                                                                    showInviteMember = true,
-                                                                                    childTask.visibleChildTaskMemberMenu = false"
-                                                                            ></task-member-menu>
-                                                                        </div>
-                                                                    </a-dropdown>
-                                                                 <!--   <a-tooltip :mouseEnterDelay="0.5">
+                                  </a-tooltip>
+                                  <a-dropdown
+                                    :trigger="['click']"
+                                    v-model="childTask.visibleChildTaskMemberMenu"
+                                    :disabled="!!task.deleted"
+                                    placement="bottomCenter"
+                                  >
+                                    <a-tooltip :mouseEnterDelay="0.5">
+                                      <template slot="title">
+                                        <span v-if="childTask.executor">{{
+                                          childTask.executor.name
+                                        }}</span>
+                                        <span v-else>待认领</span>
+                                      </template>
+                                      <a-avatar
+                                        v-if="childTask.executor"
+                                        class="task-item"
+                                        :class="{ disabled: task.deleted }"
+                                        size="small"
+                                        icon="user"
+                                        :src="childTask.executor.avatar"
+                                      ></a-avatar>
+                                      <a-avatar
+                                        v-else
+                                        class="task-item"
+                                        :class="{ disabled: task.deleted }"
+                                        size="small"
+                                        icon="user"
+                                      ></a-avatar>
+                                    </a-tooltip>
+                                    <div slot="overlay">
+                                      <task-member-menu
+                                        v-if="childTask.visibleChildTaskMemberMenu"
+                                        :projectCode="projectCodeCurrent"
+                                        :taskCode="childTask.code"
+                                        :isCommit="true"
+                                        @close="
+                                          childTask.visibleChildTaskMemberMenu = false;
+                                          getChildTasks();
+                                        "
+                                        @inviteProjectMember="
+                                          (showInviteMember = true),
+                                            (childTask.visibleChildTaskMemberMenu = false)
+                                        "
+                                      ></task-member-menu>
+                                    </div>
+                                  </a-dropdown>
+                                  <!--   <a-tooltip :mouseEnterDelay="0.5">
                                                                         <template slot="title">
                                                                             <span v-if="childTask.executor">{{childTask.executor.name}}</span>
                                                                             <span v-else>待认领</span>
@@ -567,1849 +705,1989 @@
                                                                                 icon="user"
                                                                         ></a-avatar>
                                                                     </a-tooltip>-->
-                                                                    <div class="task-item task-title"
-                                                                         @click.stop="init(childTask.code)">
-                                                                        <div class="title-text"
-                                                                             :class="{'done': childTask.done}"
-                                                                        >
-                                                                            {{childTask.name}}
-                                                                        </div>
-                                                                    </div>
-                                                                    <a class="muted" @click.stop="init(childTask.code)">
-                                                                        <a-icon class="task-item" type="right"/>
-                                                                    </a>
-                                                                </div>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <div class="task-list" v-show="showChildTask">
-                                                        <div class="add-task">
-                                                            <div class="list-item task">
-                                                                <span class="task-item check-box"></span>
-
-                                                                <a-dropdown :trigger="['click']"
-                                                                            v-model="visibleChildTaskMemberMenu"
-                                                                            :disabled="!!task.deleted"
-                                                                            placement="bottomCenter"
-
-                                                                >
-                                                                    <a-tooltip :mouseEnterDelay="0.5">
-                                                                        <template slot="title">
-                                                                            <span v-if="childExecutor">{{childExecutor.name}}</span>
-                                                                            <span v-else>待认领</span>
-                                                                        </template>
-                                                                        <div class="field-flex">
-                                                                            <template v-if="childExecutor">
-                                                                                <a-avatar class="task-item"
-                                                                                          :src="childExecutor.avatar"
-                                                                                          icon="user"
-                                                                                          size="small"/>
-                                                                            </template>
-                                                                            <template v-if="!childExecutor">
-                                                                                <a-avatar class="task-item"
-
-                                                                                          icon="user"
-                                                                                          size="small"/>
-                                                                            </template>
-                                                                        </div>
-                                                                    </a-tooltip>
-                                                                    <div slot="overlay">
-                                                                        <task-member-menu
-                                                                                v-if="visibleChildTaskMemberMenu"
-                                                                                :projectCode="projectCodeCurrent"
-                                                                                :taskCode="childExecutor ? code : ''"
-                                                                                :isCommit="false"
-                                                                                @close="updateChildExecutor"
-                                                                                @inviteProjectMember="
-                                                            showInviteChildTaskMember = true,
-                                                            visibleChildTaskMemberMenu = false"
-                                                                        ></task-member-menu>
-                                                                    </div>
-                                                                </a-dropdown>
-                                                                <div class="task-item task-input">
-                                                                    <a-input v-model="childTaskName"
-                                                                             @pressEnter="createTask"/>
-                                                                </div>
-                                                            </div>
-                                                            <div class="action-btn text-right">
-                                                                <a type="text" class="cancel-text muted"
-                                                                   @click="showChildTask = false">取消</a>
-                                                                <a-button type="primary" htmlType='submit'
-                                                                          class="middle-btn"
-                                                                          @click="createTask">保存
-                                                                </a-button>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <a-tooltip placement="top">
-                                                        <template slot="title">
-                                                            <span v-if="task.done" style="font-size: 12px;">父任务已完成，无法添加新的子任务</span>
-                                                        </template>
-                                                        <a class="add-handler"
-                                                           :class="{'disabled': task.done}"
-                                                           v-show="!showChildTask"
-                                                           @click="()=>{if (task.deleted || task.done) return false; showChildTask = true}">
-                                                            <a-icon type="plus" style="margin-right: 6px;"/>
-                                                            添加子任务
-                                                        </a>
-                                                    </a-tooltip>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left" style="width: 100%">
-                                                <a-icon type="clock-circle"/>
-                                                <span class="field-name">工时
-                                                    <span v-if="workTimeList.length"> · 实际工时 {{workTimeTotal}} 小时，工时记录 {{workTimeList.length}} 条，预估工时 {{task.work_time}} 小时   <a
-                                                            class="muted m-l-sm" @click="doPlainWorkTime">
-                                                                    <a-icon class="task-item" type="edit"/>
-                                                                </a>
-                                                    </span>
-                                                    <span v-else>
-                                                         <span v-if="task.work_time"> · 预估工时 {{task.work_time}} 小时</span>
-                                                         <a-tooltip>
-                                                            <template slot="title">
-                                                                <span>设置预估工时</span>
-                                                            </template>
-                                                           <a class="muted m-l-sm" @click="doPlainWorkTime">
-                                                               <a-icon class="task-item" type="edit"/>
-                                                           </a>
-                                                         </a-tooltip>
-                                                    </span>
-                                                </span>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="block-field width-block">
-                                                <div class="task-child">
-                                                    <div class="task-list" v-show="workTimeList.length">
-                                                        <div
-                                                                v-for="(workTime, index) in workTimeList"
-                                                                :key="workTime.code">
-                                                            <div class="list-item task m-l-xs">
-                                                                <div class="task-item task-title hover-none">
-                                                                    <div class="title-text"
-                                                                    >
-                                                                        <a-tooltip :mouseEnterDelay="0.5">
-                                                                            <template slot="title">
-                                                                                <span v-if="workTime.member">{{workTime.member.name}}</span>
-                                                                                <span v-else>待认领</span>
-                                                                            </template>
-                                                                            <a-avatar
-                                                                                    class="task-item"
-                                                                                    size="small"
-                                                                                    icon="user"
-                                                                                    :src="workTime.member.avatar"
-                                                                            ></a-avatar>
-                                                                        </a-tooltip>
-                                                                        {{workTime.member.name}}
-                                                                        {{moment(workTime.begin_time).format('MM月DD日 HH:mm')}}开始 工时为
-                                                                        {{workTime.num}} 小时
-                                                                        <div class="muted"
-                                                                             v-show="workTime.content"
-                                                                             style="padding-left: 40px;margin-top: 6px;">
-                                                                            {{workTime.content}}
-                                                                        </div>
-                                                                    </div>
-                                                                </div>
-                                                                <a class="muted" @click="doWorkTime(workTime)">
-                                                                    <a-icon class="task-item" type="edit"/>
-                                                                </a>
-                                                                <a class="muted"
-                                                                   @click="deleteWorkTime(workTime, index)">
-                                                                    <a-icon class="task-item" type="delete"/>
-                                                                </a>
-                                                            </div>
-                                                        </div>
-                                                    </div>
-                                                    <a-tooltip placement="top">
-                                                        <a class="add-handler" @click="doWorkTime(false)">
-                                                            <a-icon type="plus" style="margin-right: 6px;"/>
-                                                            添加工时
-                                                        </a>
-                                                    </a-tooltip>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="field-left">
-                                                <a-icon type="paper-clip"/>
-                                                <span class="field-name">关联文件</span>
-                                            </div>
-                                            <div class="field-right width-block">
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount">
-                                        <div class="field">
-                                            <div class="block-field width-block">
-                                                <div class="task-child">
-                                                    <a class="add-handler" id="upload-file">
-                                                        <a-icon type="plus" style="margin-right: 6px;"/>
-                                                        上传文件
-                                                    </a>
-                                                </div>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="component-mount" v-show="taskSourceList.length > 0">
-                                        <div class="field">
-                                            <div class="block-field width-block">
-                                                <div class="file-list">
-                                                    <div class="m-xs m-t-none">关联的文件</div>
-                                                    <a-list>
-                                                        <a-list-item :key="index"
-                                                                     v-for="(item, index) in taskSourceList">
-                                                            <a-list-item-meta>
-                                                                <a-avatar size="small" slot="avatar" shape="square"
-                                                                          icon="link"
-                                                                          :src="item.sourceDetail.file_url"/>
-                                                                <div slot="title">
-                                                                    <a class="muted" target="_blank"
-                                                                       :href="item.sourceDetail.file_url">{{ item.title
-                                                                        }}</a>
-                                                                </div>
-                                                                <div slot="description">
-                                                                    <!--{{item.create_time}}-->
-                                                                </div>
-                                                            </a-list-item-meta>
-                                                            <a class="muted" slot="actions">
-                                                                <span>{{item.sourceDetail.projectName}}</span>
-                                                            </a>
-                                                            <a class="muted" slot="actions">
-                                                                <a-dropdown :trigger="['click']"
-                                                                            placement="bottomCenter">
-                                                                    <!-- <a-tooltip :mouseEnterDelay="0.5">
-                                                                         <template slot="title">
-                                                                             <span>更多操作</span>
-                                                                         </template>-->
-                                                                    <a class="action-item muted">
-                                                                        <a-icon type="down"/>
-                                                                    </a>
-                                                                    <!--</a-tooltip>-->
-                                                                    <a-menu v-clipboard="item.sourceDetail.file_url"
-                                                                            @click="doSource($event,item)"
-                                                                            class="field-right-menu"
-                                                                            slot="overlay">
-                                                                        <a-menu-item key="copy">
-                                                                            <a-icon type="link"/>
-                                                                            <span>复制链接</span>
-                                                                        </a-menu-item>
-                                                                        <a-menu-item key="unlink">
-                                                                            <a-icon type="disconnect"/>
-                                                                            <span>取消关联</span>
-                                                                        </a-menu-item>
-                                                                    </a-menu>
-                                                                </a-dropdown>
-                                                            </a>
-                                                        </a-list-item>
-                                                    </a-list>
-                                                </div>
-                                            </div>
-                                        </div>
+                                  <div
+                                    class="task-item task-title"
+                                    @click.stop="init(childTask.code)"
+                                  >
+                                    <div
+                                      class="title-text"
+                                      :class="{ done: childTask.done }"
+                                    >
+                                      {{ childTask.name }}
                                     </div>
+                                  </div>
+                                  <a class="muted" @click.stop="init(childTask.code)">
+                                    <a-icon class="task-item" type="right" />
+                                  </a>
                                 </div>
+                              </div>
                             </div>
-                        </vue-scroll>
-                    </div>
-                    <div class="content-right">
-                        <div class="header">
-                            <div class="title">
-                                参与者 · {{taskMemberList.length}}
-                            </div>
-                            <div class="member-list">
-                                <a-tooltip
-                                        :mouseEnterDelay="0.5"
-                                        v-for="member in taskMemberList"
-                                        :key="member.code"
+                          </div>
+                          <div class="task-list" v-show="showChildTask">
+                            <div class="add-task">
+                              <div class="list-item task">
+                                <span class="task-item check-box"></span>
+
+                                <a-dropdown
+                                  :trigger="['click']"
+                                  v-model="visibleChildTaskMemberMenu"
+                                  :disabled="!!task.deleted"
+                                  placement="bottomCenter"
                                 >
+                                  <a-tooltip :mouseEnterDelay="0.5">
                                     <template slot="title">
-                                        <span>{{member.name}} <span v-if="member.is_owner"> · 创建者</span></span>
+                                      <span v-if="childExecutor">{{
+                                        childExecutor.name
+                                      }}</span>
+                                      <span v-else>待认领</span>
                                     </template>
-                                    <a-avatar
-                                            class="member-item"
-                                            icon="user"
-                                            size="small"
-                                            :src="member.avatar"
-                                            @click="routerLink('/members/profile/' + member.membar_account_code + '?key=3')"
-                                    />
-                                </a-tooltip>
-                                <a-dropdown :trigger="['click']" placement="bottomCenter"
-                                            v-model="visibleProjectMemberMenu">
-                                    <a-tooltip :mouseEnterDelay="0.5">
-                                        <template slot="title">
-                                            <span>点击添加参与者</span>
-                                        </template>
-                                        <a-icon class="member-item invite" type="plus-circle" theme="twoTone"
-                                                style="font-size: 24px;"/>
-                                    </a-tooltip>
-                                    <div slot="overlay">
-                                        <project-member-menu
-                                                v-if="visibleProjectMemberMenu"
-                                                :taskCode="code"
-                                                :projectCode="projectCodeCurrent"
-                                                @close="init(false)"
-                                                @inviteProjectMember="
-                                                            showInviteMember = true,
-                                                            visibleProjectMemberMenu = false"
-                                        ></project-member-menu>
+                                    <div class="field-flex">
+                                      <template v-if="childExecutor">
+                                        <a-avatar
+                                          class="task-item"
+                                          :src="childExecutor.avatar"
+                                          icon="user"
+                                          size="small"
+                                        />
+                                      </template>
+                                      <template v-if="!childExecutor">
+                                        <a-avatar
+                                          class="task-item"
+                                          icon="user"
+                                          size="small"
+                                        />
+                                      </template>
                                     </div>
+                                  </a-tooltip>
+                                  <div slot="overlay">
+                                    <task-member-menu
+                                      v-if="visibleChildTaskMemberMenu"
+                                      :projectCode="projectCodeCurrent"
+                                      :taskCode="childExecutor ? code : ''"
+                                      :isCommit="false"
+                                      @close="updateChildExecutor"
+                                      @inviteProjectMember="
+                                        (showInviteChildTaskMember = true),
+                                          (visibleChildTaskMemberMenu = false)
+                                      "
+                                    ></task-member-menu>
+                                  </div>
                                 </a-dropdown>
+                                <div class="task-item task-input">
+                                  <a-input
+                                    v-model="childTaskName"
+                                    @pressEnter="createTask"
+                                  />
+                                </div>
+                              </div>
+                              <div class="action-btn text-right">
+                                <a
+                                  type="text"
+                                  class="cancel-text muted"
+                                  @click="showChildTask = false"
+                                  >取消</a
+                                >
+                                <a-button
+                                  type="primary"
+                                  htmlType="submit"
+                                  class="middle-btn"
+                                  @click="createTask"
+                                  >保存
+                                </a-button>
+                              </div>
                             </div>
+                          </div>
+                          <a-tooltip placement="top">
+                            <template slot="title">
+                              <span v-if="task.done" style="font-size: 12px"
+                                >父任务已完成，无法添加新的子任务</span
+                              >
+                            </template>
+                            <a
+                              class="add-handler"
+                              :class="{ disabled: task.done }"
+                              v-show="!showChildTask"
+                              @click="
+                                () => {
+                                  if (task.deleted || task.done) return false;
+                                  showChildTask = true;
+                                }
+                              "
+                            >
+                              <a-icon type="plus" style="margin-right: 6px" />
+                              添加子任务
+                            </a>
+                          </a-tooltip>
                         </div>
-                        <div class="log-wrap">
-                            <div class="header">
-                                <a-dropdown :trigger="['click']">
-                                    <a class="text-default">
-                                        所有动态
-                                        <a-icon type="down"/>
-                                    </a>
-                                    <a-menu v-model="taskLogType" class="field-right-menu" slot="overlay"
-                                            selectable>
-                                        <a-menu-item key="all">
-                                            <div class="menu-item-content">
-                                                <span>所有动态</span>
-                                            </div>
-                                        </a-menu-item>
-                                        <a-menu-item key="comment">
-                                            <div class="menu-item-content">
-                                                <span>仅评论</span>
-                                            </div>
-                                        </a-menu-item>
-                                        <a-menu-item key="log">
-                                            <div class="menu-item-content">
-                                                <span>仅动态</span>
-                                            </div>
-                                        </a-menu-item>
-                                    </a-menu>
-                                </a-dropdown>
-                            </div>
-                            <vue-scroll>
-                                <div class="log-list muted">
-                                    <a class="show-more muted" v-show="checkShowMoreLog"
-                                       @click="getMoreTaskLog">
-                                        <a-icon type="ellipsis"/>
-                                        显示较早的 {{taskLogTotal - taskLogList.length}} 条动态
-                                    </a>
-                                    <div :class="{'log-comment': log.is_comment,'list-item': !log.is_comment}"
-                                         v-for="log in taskLogList" :key="log.code">
-                                        <template v-if="!log.is_comment">
-                                            <a-icon class="log-item" :type="log.icon"/>
-                                            <div class="log-item log-txt">
-                                                <div>{{log.member.name}} <span v-html="log.remark"></span></div>
-                                                <div v-if="log.content" class="log-content"
-                                                     v-html="log.content"></div>
-                                            </div>
-                                        </template>
-                                        <template v-if="log.is_comment">
-                                            <div class="log-txt text-default" style="width:100%; display: flex;justify-content: space-between">
-                                               <div style="display: flex;align-items: center">
-                                                   <a-avatar :size="24" :src="log.member.avatar" class="m-r-sm" style="margin-left: -5px"/>
-                                                   <div>{{log.member.name}}</div>
-                                               </div>
-                                                <a-tooltip :mouseEnterDelay="0.5">
-                                                    <template slot="title">
-                                                        <span>{{log.create_time}}</span>
-                                                    </template>
-                                                    <span class="muted">{{log.create_time | formatLogTime}}</span>
-                                                </a-tooltip>
-                                            </div>
-                                            <div class="log-txt text-default" style="padding: 0 0 0 30px;">
-                                                <div class="m-t-xs" v-html="checkLink(log.content)" ></div>
-                                            </div>
-                                        </template>
-                                        <a-tooltip v-if="!log.is_comment" :mouseEnterDelay="0.5">
-                                            <template slot="title">
-                                                <span>{{log.create_time}}</span>
-                                            </template>
-                                            <span>{{log.create_time | formatLogTime}}</span>
-                                        </a-tooltip>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left" style="width: 100%">
+                        <a-icon type="clock-circle" />
+                        <span class="field-name"
+                          >工时
+                          <span v-if="workTimeList.length">
+                            · 实际工时 {{ workTimeTotal }} 小时，工时记录
+                            {{ workTimeList.length }} 条，预估工时
+                            {{ task.work_time }} 小时
+                            <a class="muted m-l-sm" @click="doPlainWorkTime">
+                              <a-icon class="task-item" type="edit" />
+                            </a>
+                          </span>
+                          <span v-else>
+                            <span v-if="task.work_time">
+                              · 预估工时 {{ task.work_time }} 小时</span
+                            >
+                            <a-tooltip>
+                              <template slot="title">
+                                <span>设置预估工时</span>
+                              </template>
+                              <a class="muted m-l-sm" @click="doPlainWorkTime">
+                                <a-icon class="task-item" type="edit" />
+                              </a>
+                            </a-tooltip>
+                          </span>
+                        </span>
+                      </div>
+                    </div>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="block-field width-block">
+                        <div class="task-child">
+                          <div class="task-list" v-show="workTimeList.length">
+                            <div
+                              v-for="(workTime, index) in workTimeList"
+                              :key="workTime.code"
+                            >
+                              <div class="list-item task m-l-xs">
+                                <div class="task-item task-title hover-none">
+                                  <div class="title-text">
+                                    <a-tooltip :mouseEnterDelay="0.5">
+                                      <template slot="title">
+                                        <span v-if="workTime.member">{{
+                                          workTime.member.name
+                                        }}</span>
+                                        <span v-else>待认领</span>
+                                      </template>
+                                      <a-avatar
+                                        class="task-item"
+                                        size="small"
+                                        icon="user"
+                                        :src="workTime.member.avatar"
+                                      ></a-avatar>
+                                    </a-tooltip>
+                                    {{ workTime.member.name }}
+                                    {{
+                                      moment(workTime.begin_time).format(
+                                        "MM月DD日 HH:mm"
+                                      )
+                                    }}开始 工时为 {{ workTime.num }} 小时
+                                    <div
+                                      class="muted"
+                                      v-show="workTime.content"
+                                      style="padding-left: 40px; margin-top: 6px"
+                                    >
+                                      {{ workTime.content }}
                                     </div>
+                                  </div>
                                 </div>
-                            </vue-scroll>
-                        </div>
-                        <div class="footer" id="footer">
-                            <a-popover trigger="click" placement="top" :visible="showMentions" arrowPointAtCenter :getPopupContainer="getPopup">
-                                <template slot="content">
-                                    <div class="mentions-content" style="width: 200px;">
-                                        <div class="mentions-wrapper" v-for="member in taskMemberList" :key="member.id" @click="selectMentionMember(member)">
-                                            <a-avatar :src="member.avatar" icon="user" :size="28"/>
-                                            <span class="muted name m-l-xs">{{member.name}}</span>
-                                        </div>
-                                    </div>
-                                </template>
-<!--                                <span slot="title">Title</span>-->
-                                <a-textarea @focus="commenting = true" @blur="commenting = false" ref="commentText" v-model="comment" :rows="1" placeholder="支持@提及任务成员，Ctrl+Enter发表评论"
-                                            style="margin-right: 24px;"/>
-                            </a-popover>
-                            <a-button class="middle-btn" type="primary" @click="createComment">评论</a-button>
+                                <a class="muted" @click="doWorkTime(workTime)">
+                                  <a-icon class="task-item" type="edit" />
+                                </a>
+                                <a class="muted" @click="deleteWorkTime(workTime, index)">
+                                  <a-icon class="task-item" type="delete" />
+                                </a>
+                              </div>
+                            </div>
+                          </div>
+                          <a-tooltip placement="top">
+                            <a class="add-handler" @click="doWorkTime(false)">
+                              <a-icon type="plus" style="margin-right: 6px" />
+                              添加工时
+                            </a>
+                          </a-tooltip>
                         </div>
+                      </div>
                     </div>
-                </div>
-            </div>
-        </a-spin>
-        <invite-project-member v-model="showInviteMember" :project-code="projectCodeCurrent"
-                               v-if="showInviteMember"></invite-project-member>
-        <a-modal
-                class="work-time-modal"
-                v-model="workTimeDo.modalStatus"
-                :title="workTimeDo.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                @ok="workTimeHandleSubmit"
-                :confirmLoading="workTimeDo.confirmLoading"
-        >
-            <a-form
-                    layout="vertical"
-                    @submit.prevent="workTimeHandleSubmit"
-                    :form="workTimeDo.form">
-                <div>
-                    <div style="font-size: 15px;">登记任务</div>
-                    <div>{{task.name}}</div>
-                    <a-divider class="m-t-xs m-b-md"></a-divider>
-                </div>
-                <div class="work-time-stats">
-                    <div class="work-time-item">
-                        <div class="muted title">预估工时</div>
-                        <span class="work-time-num">{{task.work_time}}</span>
-                        <span>小时</span>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="field-left">
+                        <a-icon type="paper-clip" />
+                        <span class="field-name">关联文件</span>
+                      </div>
+                      <div class="field-right width-block"></div>
                     </div>
-                    <div class="work-time-item">
-                        <div class="muted title">剩余工时</div>
-                        <span class="work-time-num">
-                            <template v-if="task.work_time - workTimeTotal < 0">0</template>
-                            <template v-else>{{task.work_time - workTimeTotal}}</template>
-                        </span>
-                        <span>小时</span>
+                  </div>
+                  <div class="component-mount">
+                    <div class="field">
+                      <div class="block-field width-block">
+                        <div class="task-child">
+                          <a class="add-handler" id="upload-file">
+                            <a-icon type="plus" style="margin-right: 6px" />
+                            上传文件
+                          </a>
+                        </div>
+                      </div>
                     </div>
-                </div>
-                <a-row :gutter="24">
-                    <a-col :span="12">
-                        <a-form-item
-                                label="开始时间"
-                        >
-                            <a-date-picker
-                                    showTime
-                                    format="YYYY年MM月DD日 HH:mm"
-                                    allowClear
-                                    placeholder="请选择日期"
-                                    v-decorator="[
-                                'begin_time',
-                                {rules: [{ required: true, message: '请选择日期' }], validateTrigger: 'change',initialValue: moment()}
-                            ]"
+                  </div>
+                  <div class="component-mount" v-show="taskSourceList.length > 0">
+                    <div class="field">
+                      <div class="block-field width-block">
+                        <div class="file-list">
+                          <div class="m-xs m-t-none">关联的文件</div>
+                          <a-list>
+                            <a-list-item
+                              :key="index"
+                              v-for="(item, index) in taskSourceList"
                             >
-                            </a-date-picker>
-                        </a-form-item>
-                    </a-col>
-                    <a-col :span="12">
-                        <a-form-item
-                                label="消耗时间"
-                        >
-                            <a-input
-                                    type="text"
-                                    placeholder="请输入数字"
-                                    addonAfter="小时"
-                                    v-decorator="[
-                                'num',
-                                {rules: [{ required: true, message: '请输入消耗时间' }], validateTrigger: 'change'}
-                            ]"
-                            >
-                            </a-input>
-                        </a-form-item>
-                    </a-col>
-                    <a-col :span="24">
-                        <a-form-item
-                                label="工作内容"
-                        >
-                            <a-textarea
-                                    :rows="4"
-                                    type="text"
-                                    placeholder="在这期间做了什么"
-                                    v-decorator="[
-                                'content',
-                            ]"
-                            >
-                            </a-textarea>
-                        </a-form-item>
-                    </a-col>
-                </a-row>
-            </a-form>
-        </a-modal>
-        <a-modal
-                v-model="plainWorkTime.modalStatus"
-                :title="plainWorkTime.modalTitle"
-                :bodyStyle="{paddingBottom:'1px'}"
-                @ok="workTimePlainHandleSubmit"
-                :confirmLoading="plainWorkTime.confirmLoading"
-        >
-            <a-form
-                    layout="vertical"
-                    @submit.prevent="workTimePlainHandleSubmit"
-                    :form="plainWorkTime.form">
-                <a-form-item
-                        label=""
+                              <a-list-item-meta>
+                                <a-avatar
+                                  size="small"
+                                  slot="avatar"
+                                  shape="square"
+                                  icon="link"
+                                  :src="item.sourceDetail.file_url"
+                                />
+                                <div slot="title">
+                                  <a
+                                    class="muted"
+                                    target="_blank"
+                                    :href="item.sourceDetail.file_url"
+                                    >{{ item.title }}</a
+                                  >
+                                </div>
+                                <div slot="description">
+                                  <!--{{item.create_time}}-->
+                                </div>
+                              </a-list-item-meta>
+                              <a class="muted" slot="actions">
+                                <span>{{ item.sourceDetail.projectName }}</span>
+                              </a>
+                              <a class="muted" slot="actions">
+                                <a-dropdown :trigger="['click']" placement="bottomCenter">
+                                  <!-- <a-tooltip :mouseEnterDelay="0.5">
+                                                                         <template slot="title">
+                                                                             <span>更多操作</span>
+                                                                         </template>-->
+                                  <a class="action-item muted">
+                                    <a-icon type="down" />
+                                  </a>
+                                  <!--</a-tooltip>-->
+                                  <a-menu
+                                    v-clipboard="item.sourceDetail.file_url"
+                                    @click="doSource($event, item)"
+                                    class="field-right-menu"
+                                    slot="overlay"
+                                  >
+                                    <a-menu-item key="copy">
+                                      <a-icon type="link" />
+                                      <span>复制链接</span>
+                                    </a-menu-item>
+                                    <a-menu-item key="unlink">
+                                      <a-icon type="disconnect" />
+                                      <span>取消关联</span>
+                                    </a-menu-item>
+                                  </a-menu>
+                                </a-dropdown>
+                              </a>
+                            </a-list-item>
+                          </a-list>
+                        </div>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </vue-scroll>
+          </div>
+          <div class="content-right">
+            <div class="header">
+              <div class="title">参与者 · {{ taskMemberList.length }}</div>
+              <div class="member-list">
+                <a-tooltip
+                  :mouseEnterDelay="0.5"
+                  v-for="member in taskMemberList"
+                  :key="member.code"
                 >
-                    <a-input
-                            type="text"
-                            placeholder="请输入数字"
-                            addonAfter="小时"
-                            v-decorator="[
-                                'work_time',
-                                {rules: [{ required: true, message: '请输入预估工时' }], validateTrigger: 'change'}
-                            ]"
+                  <template slot="title">
+                    <span
+                      >{{ member.name }}
+                      <span v-if="member.is_owner"> · 创建者</span></span
+                    >
+                  </template>
+                  <a-avatar
+                    class="member-item"
+                    icon="user"
+                    size="small"
+                    :src="member.avatar"
+                    @click="
+                      routerLink(
+                        '/members/profile/' + member.membar_account_code + '?key=3'
+                      )
+                    "
+                  />
+                </a-tooltip>
+                <a-dropdown
+                  :trigger="['click']"
+                  placement="bottomCenter"
+                  v-model="visibleProjectMemberMenu"
+                >
+                  <a-tooltip :mouseEnterDelay="0.5">
+                    <template slot="title">
+                      <span>点击添加参与者</span>
+                    </template>
+                    <a-icon
+                      class="member-item invite"
+                      type="plus-circle"
+                      theme="twoTone"
+                      style="font-size: 24px"
+                    />
+                  </a-tooltip>
+                  <div slot="overlay">
+                    <project-member-menu
+                      v-if="visibleProjectMemberMenu"
+                      :taskCode="code"
+                      :projectCode="projectCodeCurrent"
+                      @close="init(false)"
+                      @inviteProjectMember="
+                        (showInviteMember = true), (visibleProjectMemberMenu = false)
+                      "
+                    ></project-member-menu>
+                  </div>
+                </a-dropdown>
+              </div>
+            </div>
+            <div class="log-wrap">
+              <div class="header">
+                <a-dropdown :trigger="['click']">
+                  <a class="text-default">
+                    所有动态
+                    <a-icon type="down" />
+                  </a>
+                  <a-menu
+                    v-model="taskLogType"
+                    class="field-right-menu"
+                    slot="overlay"
+                    selectable
+                  >
+                    <a-menu-item key="all">
+                      <div class="menu-item-content">
+                        <span>所有动态</span>
+                      </div>
+                    </a-menu-item>
+                    <a-menu-item key="comment">
+                      <div class="menu-item-content">
+                        <span>仅评论</span>
+                      </div>
+                    </a-menu-item>
+                    <a-menu-item key="log">
+                      <div class="menu-item-content">
+                        <span>仅动态</span>
+                      </div>
+                    </a-menu-item>
+                  </a-menu>
+                </a-dropdown>
+              </div>
+              <vue-scroll>
+                <div class="log-list muted">
+                  <a
+                    class="show-more muted"
+                    v-show="checkShowMoreLog"
+                    @click="getMoreTaskLog"
+                  >
+                    <a-icon type="ellipsis" />
+                    显示较早的 {{ taskLogTotal - taskLogList.length }} 条动态
+                  </a>
+                  <div
+                    :class="{
+                      'log-comment': log.is_comment,
+                      'list-item': !log.is_comment,
+                    }"
+                    v-for="log in taskLogList"
+                    :key="log.code"
+                  >
+                    <template v-if="!log.is_comment">
+                      <a-icon class="log-item" :type="log.icon" />
+                      <div class="log-item log-txt">
+                        <div>{{ log.member.name }} <span v-html="log.remark"></span></div>
+                        <div
+                          v-if="log.content"
+                          class="log-content"
+                          v-html="log.content"
+                        ></div>
+                      </div>
+                    </template>
+                    <template v-if="log.is_comment">
+                      <div
+                        class="log-txt text-default"
+                        style="width: 100%; display: flex; justify-content: space-between"
+                      >
+                        <div style="display: flex; align-items: center">
+                          <a-avatar
+                            :size="24"
+                            :src="log.member.avatar"
+                            class="m-r-sm"
+                            style="margin-left: -5px"
+                          />
+                          <div>{{ log.member.name }}</div>
+                        </div>
+                        <a-tooltip :mouseEnterDelay="0.5">
+                          <template slot="title">
+                            <span>{{ log.create_time }}</span>
+                          </template>
+                          <span class="muted">{{ log.create_time | formatLogTime }}</span>
+                        </a-tooltip>
+                      </div>
+                      <div class="log-txt text-default" style="padding: 0 0 0 30px">
+                        <div class="m-t-xs" v-html="checkLink(log.content)"></div>
+                      </div>
+                    </template>
+                    <a-tooltip v-if="!log.is_comment" :mouseEnterDelay="0.5">
+                      <template slot="title">
+                        <span>{{ log.create_time }}</span>
+                      </template>
+                      <span>{{ log.create_time | formatLogTime }}</span>
+                    </a-tooltip>
+                  </div>
+                </div>
+              </vue-scroll>
+            </div>
+            <div class="footer" id="footer">
+              <a-popover
+                trigger="click"
+                placement="top"
+                :visible="showMentions"
+                arrowPointAtCenter
+                :getPopupContainer="getPopup"
+              >
+                <template slot="content">
+                  <div class="mentions-content" style="width: 200px">
+                    <div
+                      class="mentions-wrapper"
+                      v-for="member in taskMemberList"
+                      :key="member.id"
+                      @click="selectMentionMember(member)"
                     >
-                    </a-input>
-                </a-form-item>
-            </a-form>
-        </a-modal>
-    </div>
+                      <a-avatar :src="member.avatar" icon="user" :size="28" />
+                      <span class="muted name m-l-xs">{{ member.name }}</span>
+                    </div>
+                  </div>
+                </template>
+                <!--                                <span slot="title">Title</span>-->
+                <a-textarea
+                  @focus="commenting = true"
+                  @blur="commenting = false"
+                  ref="commentText"
+                  v-model="comment"
+                  :rows="1"
+                  placeholder="支持@提及任务成员，Ctrl+Enter发表评论"
+                  style="margin-right: 24px"
+                />
+              </a-popover>
+              <a-button class="middle-btn" type="primary" @click="createComment"
+                >评论</a-button
+              >
+            </div>
+          </div>
+        </div>
+      </div>
+    </a-spin>
+    <invite-project-member
+      v-model="showInviteMember"
+      :project-code="projectCodeCurrent"
+      v-if="showInviteMember"
+    ></invite-project-member>
+    <a-modal
+      class="work-time-modal"
+      v-model="workTimeDo.modalStatus"
+      :title="workTimeDo.modalTitle"
+      :bodyStyle="{ paddingBottom: '1px' }"
+      @ok="workTimeHandleSubmit"
+      :confirmLoading="workTimeDo.confirmLoading"
+    >
+      <a-form
+        layout="vertical"
+        @submit.prevent="workTimeHandleSubmit"
+        :form="workTimeDo.form"
+      >
+        <div>
+          <div style="font-size: 15px">登记任务</div>
+          <div>{{ task.name }}</div>
+          <a-divider class="m-t-xs m-b-md"></a-divider>
+        </div>
+        <div class="work-time-stats">
+          <div class="work-time-item">
+            <div class="muted title">预估工时</div>
+            <span class="work-time-num">{{ task.work_time }}</span>
+            <span>小时</span>
+          </div>
+          <div class="work-time-item">
+            <div class="muted title">剩余工时</div>
+            <span class="work-time-num">
+              <template v-if="task.work_time - workTimeTotal < 0">0</template>
+              <template v-else>{{
+                (task.work_time * 100 - workTimeTotal * 100) / 100
+              }}</template>
+            </span>
+            <span>小时</span>
+          </div>
+        </div>
+        <a-row :gutter="24">
+          <a-col :span="12">
+            <a-form-item label="开始时间">
+              <a-date-picker
+                showTime
+                format="YYYY年MM月DD日 HH:mm"
+                allowClear
+                placeholder="请选择日期"
+                v-decorator="[
+                  'begin_time',
+                  {
+                    rules: [{ required: true, message: '请选择日期' }],
+                    validateTrigger: 'change',
+                    initialValue: moment(),
+                  },
+                ]"
+              >
+              </a-date-picker>
+            </a-form-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-item label="消耗时间">
+              <a-input-number
+                placeholder="请输入数字"
+                addonAfter="小时"
+                :step="0.1"
+                v-decorator="[
+                  'num',
+                  {
+                    rules: [{ required: true, message: '请输入消耗时间' }],
+                    validateTrigger: 'change',
+                  },
+                ]"
+              ></a-input-number>
+            </a-form-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-item label="工作内容">
+              <a-textarea
+                :rows="4"
+                type="text"
+                placeholder="在这期间做了什么"
+                v-decorator="['content']"
+              >
+              </a-textarea>
+            </a-form-item>
+          </a-col>
+        </a-row>
+      </a-form>
+    </a-modal>
+    <a-modal
+      v-model="plainWorkTime.modalStatus"
+      :title="plainWorkTime.modalTitle"
+      :bodyStyle="{ paddingBottom: '1px' }"
+      @ok="workTimePlainHandleSubmit"
+      :confirmLoading="plainWorkTime.confirmLoading"
+    >
+      <a-form
+        layout="vertical"
+        @submit.prevent="workTimePlainHandleSubmit"
+        :form="plainWorkTime.form"
+      >
+        <a-form-item label="">
+          <a-input-number
+            placeholder="请输入数字"
+            addonAfter="小时"
+            :step="0.1"
+            v-decorator="[
+              'work_time',
+              {
+                rules: [{ required: true, message: '请输入预估工时' }],
+                validateTrigger: 'change',
+              },
+            ]"
+          >
+          </a-input-number>
+        </a-form-item>
+      </a-form>
+    </a-modal>
+  </div>
 </template>
 
 <script>
-    import {mapState} from 'vuex'
-    import $ from 'jquery'
-    import moment from 'moment';
-    import {COMMON} from '../../const/common'
-    import editor from '@/components/editor'
-    import {createComment, del, edit, logs, read, recovery, recycle, star, taskDone} from "@/api/task";
-    import {del as delSourceLink} from "@/api/sourceLink";
-    import {list as getTaskMembers} from "@/api/taskMember";
-    import taskMemberMenu from "@/components/project/taskMemberMenu"
-    import taskTagMenu from "@/components/project/taskTagMenu"
-    import projectMemberMenu from "@/components/project/projectMemberMenu"
-    import inviteProjectMember from '@/components/project/inviteProjectMember'
-    import {getStore} from "@/assets/js/storage";
-    import {getApiUrl} from "@/assets/js/utils";
-    import {save as createTask, list as getTasks, like as doLike} from "@/api/task";
-    import {notice} from "@/assets/js/notice";
-    import {relativelyTaskTime, relativelyTime} from "@/assets/js/dateTime";
-    import {checkResponse} from "../../assets/js/utils";
-    import {
-        _taskWorkTimeList, delTaskWorkTime,
-        editTaskWorkTime,
-        saveTaskWorkTime,
-        setPrivate,
-        setTag,
-        taskSources
-    } from "../../api/task";
-    import ATextarea from "ant-design-vue/es/input/TextArea";
-    import {detail} from "../../api/departmentMember";
-
-    let tokenList = getStore('tokenList', true);
-    let authorization = '';
-    if (tokenList) {
-        let accessToken = tokenList.accessToken;
-        let tokenType = tokenList.tokenType;
-        authorization = `${tokenType} ${accessToken}`;
-    }
-    export default {
-        name: "task-detail",
-        components: {
-            ATextarea,
-            editor,
-            taskMemberMenu,
-            taskTagMenu,
-            projectMemberMenu,
-            inviteProjectMember
+import { mapState } from "vuex";
+import $ from "jquery";
+import moment from "moment";
+import { COMMON } from "../../const/common";
+import editor from "@/components/editor";
+import {
+  createComment,
+  del,
+  edit,
+  logs,
+  read,
+  recovery,
+  recycle,
+  star,
+  taskDone,
+} from "@/api/task";
+import { del as delSourceLink } from "@/api/sourceLink";
+import { list as getTaskMembers } from "@/api/taskMember";
+import taskMemberMenu from "@/components/project/taskMemberMenu";
+import taskTagMenu from "@/components/project/taskTagMenu";
+import projectMemberMenu from "@/components/project/projectMemberMenu";
+import inviteProjectMember from "@/components/project/inviteProjectMember";
+import { getStore } from "@/assets/js/storage";
+import { getApiUrl } from "@/assets/js/utils";
+import { save as createTask, list as getTasks, like as doLike } from "@/api/task";
+import { notice } from "@/assets/js/notice";
+import { relativelyTaskTime, relativelyTime } from "@/assets/js/dateTime";
+import { checkResponse } from "../../assets/js/utils";
+import {
+  _taskWorkTimeList,
+  delTaskWorkTime,
+  editTaskWorkTime,
+  saveTaskWorkTime,
+  setPrivate,
+  setTag,
+  taskSources,
+} from "../../api/task";
+import ATextarea from "ant-design-vue/es/input/TextArea";
+import { detail } from "../../api/departmentMember";
+
+let tokenList = getStore("tokenList", true);
+let authorization = "";
+if (tokenList) {
+  let accessToken = tokenList.accessToken;
+  let tokenType = tokenList.tokenType;
+  authorization = `${tokenType} ${accessToken}`;
+}
+export default {
+  name: "task-detail",
+  components: {
+    ATextarea,
+    editor,
+    taskMemberMenu,
+    taskTagMenu,
+    projectMemberMenu,
+    inviteProjectMember,
+  },
+  props: {
+    taskCode: {
+      type: [String],
+      default() {
+        return "";
+      },
+    },
+    width: {
+      type: [String, Number],
+      default() {
+        return "1200";
+      },
+    },
+  },
+  data() {
+    return {
+      moment,
+      loading: false,
+      code: this.taskCode,
+      projectCodeCurrent: "",
+      task: {},
+      taskStatusList: COMMON.TASK_STATUS,
+      taskLogList: [],
+      taskLogTotal: 0,
+      taskMemberList: [],
+      workTimeList: [],
+      workTimeTotal: [],
+
+      /*任务菜单*/
+      visibleTaskMenu: false,
+
+      /*成员菜单*/
+      visibleTaskMemberMenu: false,
+      /*任务标签*/
+      visibleTaskTagMenu: false,
+      visibleProjectMemberMenu: false,
+      showInviteMember: false,
+
+      /*任务标题*/
+      taskName: "",
+
+      /*日期*/
+      showEditName: false,
+      showBeginTime: false,
+      showEndTime: false,
+
+      /*备注*/
+      showTaskDescriptionEdit: false,
+      showMoreDesc: false,
+      hasMoreDesc: false,
+      editorConfig: {
+        uploadImgServer: getApiUrl("project/index/uploadImg"),
+        uploadImgHeaders: {
+          Authorization: authorization,
         },
-        props: {
-            taskCode: {
-                type: [String],
-                default() {
-                    return ''
-                }
-            },
-            width: {
-                type: [String, Number],
-                default() {
-                    return '1200'
-                }
-            }
+        menus: [
+          "head", // 标题
+          "bold", // 粗体
+          "italic", // 斜体
+          "justify", // 居中
+          "image", // 图片
+          "link", // 链接
+          "list", // 无序列表
+          "quote", // 引用
+          "table", // 表格
+          "|",
+          "fullscreen", // 全屏
+        ],
+      },
+
+      departmentMemberInfo: null,
+
+      /*子任务*/
+      childTaskList: [],
+      showChildTask: false,
+      childTaskName: "",
+      childExecutor: null,
+      visibleChildTaskMemberMenu: false,
+      showInviteChildTaskMember: false,
+
+      /*资源*/
+      taskSourceList: [],
+
+      /*任务动态*/
+      taskLogType: ["all"],
+      showMoreTaskLog: 0,
+      hasMoreTaskLog: false,
+      hideShowMore: false,
+
+      /*评论*/
+      comment: "",
+      commenting: false,
+
+      /*工时*/
+      workTimeDo: {
+        form: this.$form.createForm(this),
+        info: null,
+        modalTitle: "登记工时记录",
+        modalStatus: false,
+        confirmLoading: false,
+      },
+      plainWorkTime: {
+        form: this.$form.createForm(this),
+        modalTitle: "设置预估工时",
+        modalStatus: false,
+        confirmLoading: false,
+      },
+      //显示评论提及
+      showMentions: false,
+      mentionsList: [],
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+      uploader: (state) => state.common.uploader,
+      socketAction: (state) => state.socketAction,
+    }),
+    childTaskDoneNum() {
+      const list = this.childTaskList.filter((item) => item.done == 1);
+      return list.length;
+    },
+    checkShowMoreLog() {
+      if (!this.hideShowMore) {
+        if (this.taskLogTotal > 5) {
+          return true;
+        }
+      }
+      return false;
+    },
+    taskLink() {
+      return window.location.href;
+    },
+    scrollOps() {
+      return {
+        rail: {
+          background: "#e5e5e5",
+          opacity: 1,
         },
-        data() {
-            return {
-                moment,
-                loading: false,
-                code: this.taskCode,
-                projectCodeCurrent: '',
-                task: {},
-                taskStatusList: COMMON.TASK_STATUS,
-                taskLogList: [],
-                taskLogTotal: 0,
-                taskMemberList: [],
-                workTimeList: [],
-                workTimeTotal: [],
-
-                /*任务菜单*/
-                visibleTaskMenu: false,
-
-                /*成员菜单*/
-                visibleTaskMemberMenu: false,
-                /*任务标签*/
-                visibleTaskTagMenu: false,
-                visibleProjectMemberMenu: false,
-                showInviteMember: false,
-
-                /*任务标题*/
-                taskName: '',
-
-                /*日期*/
-                showEditName: false,
-                showBeginTime: false,
-                showEndTime: false,
-
-                /*备注*/
-                showTaskDescriptionEdit: false,
-                showMoreDesc: false,
-                hasMoreDesc: false,
-                editorConfig: {
-                    uploadImgServer: getApiUrl('project/index/uploadImg'),
-                    uploadImgHeaders: {
-                        Authorization: authorization
-                    },
-                    menus: [
-                        'head',	// 标题
-                        'bold',	// 粗体
-                        'italic',	// 斜体
-                        'justify',	// 居中
-                        'image',	// 图片
-                        'link',	// 链接
-                        'list',	// 无序列表
-                        'quote',	// 引用
-                        'table',	// 表格
-                        '|',
-                        'fullscreen'	// 全屏
-                    ],
-                },
-
-                departmentMemberInfo: null,
-
-                /*子任务*/
-                childTaskList: [],
-                showChildTask: false,
-                childTaskName: '',
-                childExecutor: null,
-                visibleChildTaskMemberMenu: false,
-                showInviteChildTaskMember: false,
-
-                /*资源*/
-                taskSourceList: [],
-
-                /*任务动态*/
-                taskLogType: ['all'],
-                showMoreTaskLog: 0,
-                hasMoreTaskLog: false,
-                hideShowMore: false,
-
-                /*评论*/
-                comment: '',
-                commenting: false,
-
-                /*工时*/
-                workTimeDo: {
-                    form: this.$form.createForm(this),
-                    info: null,
-                    modalTitle: '登记工时记录',
-                    modalStatus: false,
-                    confirmLoading: false,
-                },
-                plainWorkTime: {
-                    form: this.$form.createForm(this),
-                    modalTitle: '设置预估工时',
-                    modalStatus: false,
-                    confirmLoading: false,
-                },
-                //显示评论提及
-                showMentions: false,
-                mentionsList: []
-            }
+        bar: {
+          keepShow: true,
         },
-        computed: {
-            ...mapState({
-                userInfo: state => state.userInfo,
-                uploader: state => state.common.uploader,
-                socketAction: state => state.socketAction,
-            }),
-            childTaskDoneNum() {
-                const list = this.childTaskList.filter(item => item.done == 1);
-                return list.length;
-            },
-            checkShowMoreLog() {
-                if (!this.hideShowMore) {
-                    if (this.taskLogTotal > 5) {
-                        return true;
-                    }
+      };
+    },
+  },
+  watch: {
+    $route(to, from) {
+      // if (from.name == 'taskdetail') {
+      //     this.init();
+      // }
+    },
+    showInviteMember(val) {
+      if (!val) {
+        this.getTaskMembers();
+      }
+    },
+    taskLogType() {
+      this.getTaskLog();
+    },
+    socketAction(val) {
+      if (val.action === "organization:task") {
+        const data = val.data.data;
+        if (data.taskCode == this.code) {
+          this.init(null, false);
+        }
+      }
+    },
+    uploader: {
+      handler(newVal, oldVal) {
+        //监听是否有上传文件行为
+        console.log(newVal);
+        console.log(newVal.fileList);
+        const files = newVal.fileList;
+        const index = files.findIndex(
+          (item) => item.projectName == this.task.projectName
+        );
+        if (index !== -1) {
+          this.taskSources();
+          this.getTaskLog();
+        }
+      },
+      deep: true,
+    },
+  },
+  created() {
+    this.init();
+  },
+  mounted() {
+    this.changeModalHeight();
+    window.onresize = () => {
+      return (() => {
+        this.changeModalHeight();
+      })();
+    };
+    document.onkeydown = (event) => {
+      console.log(event);
+      var e = event || window.event || arguments.callee.caller.arguments[0];
+      if (13 == e.keyCode && e.ctrlKey) {
+        //处理的部分
+        this.createComment();
+      }
+      if ("@" == e.key && this.commenting) {
+        this.showMentions = true;
+      } else {
+        this.showMentions = false;
+      }
+    };
+    setTimeout(() => {
+      this.uploader.assignBrowse(document.getElementById("upload-file"));
+    }, 500);
+  },
+  filters: {
+    formatLogTime(value) {
+      return relativelyTime(value);
+    },
+  },
+  methods: {
+    init(code = null, loading = true) {
+      if (code) {
+        this.code = code; //子任务
+      }
+      if (loading) {
+        this.loading = true;
+      }
+      this.clearMemberMenu();
+      this.getTask();
+      this.getChildTasks();
+      this.getTaskMembers();
+      this.getTaskWorkTimeList();
+    },
+    detailClose() {
+      this.$emit("close", this.task);
+      // this.$router.push(`/project/space/task/${this.task.project_code}`);
+    },
+    clearMemberMenu() {
+      this.visibleTaskTagMenu = false;
+      this.visibleTaskMemberMenu = false;
+      this.visibleProjectMemberMenu = false;
+      // this.showChildTask = false;
+    },
+    getTask() {
+      this.$store.commit("viewRefresh");
+      this.clearMemberMenu();
+      read(this.code).then((res) => {
+        this.getTaskLog();
+        this.taskSources();
+        this.taskName = res.data.name;
+        this.task = res.data;
+        this.projectCodeCurrent = res.data.project_code;
+        if (!this.task.end_time) {
+          this.task.setEndTime = false;
+          this.task.end_time = moment(moment().format("YYYY-MM-DD") + " 18:00");
+        } else {
+          this.task.setEndTime = true;
+          this.task.end_time = moment(this.task.end_time);
+        }
+        this.task.end_time_format = relativelyTaskTime(this.task.end_time, true);
+        if (!this.task.begin_time) {
+          this.task.setBeginTime = false;
+          this.task.begin_time = moment(moment().format("YYYY-MM-DD") + " 18:00");
+        } else {
+          this.task.setBeginTime = true;
+          this.task.begin_time = moment(this.task.begin_time);
+        }
+        this.task.begin_time_format = relativelyTaskTime(this.task.begin_time, true);
+        this.initContent(this.task.description);
+        if (this.task.executor && !this.childExecutor) {
+          this.childExecutor = this.task.executor;
+        }
+        this.loading = false;
+        this.$store.dispatch("setTempData", {
+          projectCode: this.projectCodeCurrent,
+          taskCode: this.code,
+          projectName: res.data.projectName,
+        });
+      });
+    },
+    getTaskLog() {
+      logs({
+        taskCode: this.code,
+        all: this.showMoreTaskLog,
+        pageSize: 5,
+        comment: this.taskLogType[0] == "comment" ? 1 : 0,
+      }).then((res) => {
+        this.taskLogList = res.data.list;
+        this.taskLogTotal = res.data.total;
+        if (res.data.total > 5) {
+          this.hasMoreTaskLog = true;
+          // this.showMoreTaskLog = 1;
+        }
+      });
+    },
+    taskSources() {
+      taskSources({ taskCode: this.code }).then((res) => {
+        this.taskSourceList = res.data;
+      });
+    },
+    getMoreTaskLog() {
+      this.showMoreTaskLog = 1;
+      this.hideShowMore = true;
+      this.getTaskLog();
+    },
+    getTaskWorkTimeList() {
+      _taskWorkTimeList({ taskCode: this.code }).then((res) => {
+        this.workTimeList = res.data;
+        let total = 0;
+        if (res.data) {
+          res.data.forEach((v) => {
+            total += Number(v.num);
+          });
+          this.workTimeTotal = total;
+        }
+      });
+    },
+    getTaskMembers() {
+      this.clearMemberMenu();
+      getTaskMembers({ taskCode: this.code, pageSize: 100 }).then((res) => {
+        this.taskMemberList = res.data.list;
+        this.loading = false;
+      });
+    },
+    doTask(action) {
+      let app = this;
+      const actionKey = action.key;
+      switch (actionKey) {
+        case "recycle":
+          this.$confirm({
+            title: "移到回收站",
+            content: `您确定要把该任务移到回收站吗？`,
+            okText: "确定",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              recycle(app.code).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
                 }
-                return false;
-            },
-            taskLink() {
-                return window.location.href;
+                app.task.deleted = 1;
+                app.getTaskLog();
+              });
+              return Promise.resolve();
             },
-            scrollOps() {
-                return {
-                    rail: {
-                        background: '#e5e5e5',
-                        opacity: 1
-                    },
-                    bar: {
-                        keepShow: true
-                    }
-                }
+          });
+          break;
+        case "star":
+          this.task.stared ? (this.task.stared = 0) : (this.task.stared = 1);
+          star(app.code, this.task.stared);
+          return true;
+        case "open":
+          var url = window.location.href;
+          if (url.indexOf("?") !== -1) {
+            url += "&full-screen";
+          } else {
+            url += "?full-screen";
+          }
+          window.open(url);
+          break;
+        case "private":
+          setPrivate(app.code, Number(!this.task.private)).then((res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
             }
-        },
-        watch: {
-            $route(to, from) {
-                // if (from.name == 'taskdetail') {
-                //     this.init();
-                // }
-            },
-            showInviteMember(val) {
-                if (!val) {
-                    this.getTaskMembers();
+            this.task.private = Number(!this.task.private);
+          });
+          return true;
+      }
+      this.visibleTaskMenu = false;
+    },
+    editTitle() {
+      this.showEditName = true;
+      this.$nextTick(() => {
+        this.$refs.inputTitle.focus();
+      });
+    },
+    doSource(action, source) {
+      let app = this;
+      const actionKey = action.key;
+      switch (actionKey) {
+        case "unlink":
+          this.$confirm({
+            title: "取消关联",
+            content: `您确定永久删除这个关联？`,
+            okText: "确定",
+            okType: "danger",
+            cancelText: `再想想`,
+            onOk() {
+              delSourceLink(source.code).then((res) => {
+                const result = checkResponse(res);
+                if (!result) {
+                  return false;
                 }
+                app.taskSources();
+                app.getTaskLog();
+              });
+              return Promise.resolve();
             },
-            taskLogType() {
-                this.getTaskLog();
-            },
-            socketAction(val) {
-                if (val.action === 'organization:task') {
-                    const data = val.data.data;
-                    if (data.taskCode == this.code) {
-                        this.init(null, false);
-                    }
-                }
+          });
+          break;
+        case "copy":
+          notice(
+            {
+              title: "复制链接成功",
+              msg: "在地址栏粘贴并打开可下载该资源",
             },
-            uploader: {
-                handler(newVal, oldVal) {
-                    //监听是否有上传文件行为
-                    console.log(newVal);
-                    console.log(newVal.fileList);
-                    const files = newVal.fileList;
-                    const index = files.findIndex(item => item.projectName == this.task.projectName);
-                    if (index !== -1) {
-                        this.taskSources();
-                        this.getTaskLog();
-                    }
-                },
-                deep: true
-            }
+            "notice",
+            "success",
+            5
+          );
+          return true;
+      }
+    },
+    deleteTask() {
+      let app = this;
+      this.$confirm({
+        title: "彻底删除",
+        content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
+        okText: "删除",
+        okType: "danger",
+        cancelText: `再想想`,
+        onOk() {
+          del(app.code).then((res) => {
+            ``;
+            app.detailClose();
+          });
+          return Promise.resolve();
         },
-        created() {
-            this.init();
+      });
+    },
+    recoveryTask() {
+      let app = this;
+      this.$confirm({
+        title: "恢复内容",
+        content: `您确定要恢复该任务吗？`,
+        okText: "确定",
+        okType: "primary",
+        cancelText: `再想想`,
+        onOk() {
+          recovery(app.code).then((res) => {
+            const result = checkResponse(res);
+            if (!result) {
+              return false;
+            }
+            app.getTaskLog();
+          });
+          app.task.deleted = 0;
+          return Promise.resolve();
         },
-        mounted() {
-            this.changeModalHeight();
-            window.onresize = () => {
-                return (() => {
-                    this.changeModalHeight();
-                })()
-            };
-            document.onkeydown = (event) => {
-                console.log(event);
-                var e = event || window.event || arguments.callee.caller.arguments[0];
-                if (13 == e.keyCode && e.ctrlKey) {
-                    //处理的部分
-                    this.createComment();
-                }
-                if ('@' == e.key && this.commenting) {
-                    this.showMentions = true;
-                }else{
-                    this.showMentions = false;
-                }
-            };
-            setTimeout(() => {
-                this.uploader.assignBrowse(document.getElementById('upload-file'));
-            }, 500)
+      });
+    },
+    copyLink() {
+      notice(
+        {
+          title: "复制链接成功",
+          msg: "你可以在其他标签页粘贴并快速打开任务页面",
         },
-        filters: {
-            formatLogTime(value) {
-                return relativelyTime(value)
+        "notice",
+        "success",
+        5
+      );
+    },
+    like(like) {
+      like = Number(like);
+      doLike(this.code, like);
+      if (like) {
+        this.task.like++;
+      } else {
+        this.task.like--;
+      }
+      this.task.liked = like;
+    },
+    taskDone(taskCode, done, index, type = "self") {
+      done ? (done = 1) : (done = 0);
+      taskDone(taskCode, done).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        this.getTaskLog();
+        if (type == "self") {
+          //自身完成
+          this.task.done = done;
+          // this.init();
+        } else {
+          //完成子任务
+          this.childTaskList[index].done = done;
+          // this.init(this.childTaskList[index].pcode);
+        }
+        this.getTask();
+        this.getChildTasks();
+      });
+    },
+    doBeginTime(setBeginTime = false, showBeginTime = false) {
+      this.task.setBeginTime = setBeginTime;
+      this.showBeginTime = showBeginTime;
+      let beginTime = "";
+      if (setBeginTime) {
+        beginTime = moment(this.task.begin_time).format("YYYY-MM-DD HH:mm");
+        this.task.begin_time_format = moment(this.task.begin_time).format(
+          "MM月DD日 HH:mm"
+        );
+      } else {
+        beginTime = "";
+      }
+      this.editTask({ begin_time: beginTime });
+    },
+    doEndTime(setEndTime = false, showEndTime = false) {
+      this.task.setEndTime = setEndTime;
+      this.showEndTime = showEndTime;
+      let endTime = "";
+      if (setEndTime) {
+        endTime = moment(this.task.end_time).format("YYYY-MM-DD HH:mm");
+        this.task.end_time_format = moment(this.task.end_time).format("MM月DD日 HH:mm");
+      } else {
+        endTime = "";
+      }
+      this.editTask({ end_time: endTime });
+    },
+    doPri(item) {
+      this.editTask({ pri: item.key });
+    },
+    doName() {
+      this.showEditName = false;
+      if (!this.task.name.trim() || this.task.name == this.taskName) {
+        this.task.name = this.taskName;
+        return false;
+      }
+      this.editTask({ name: this.task.name });
+    },
+    taskStatusChange(item) {
+      this.task.status = item.key;
+      this.editTask({ status: item.key });
+    },
+    editTask(data) {
+      data.taskCode = this.code;
+      edit(data).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        this.getTask();
+      });
+    },
+    priColor(pri) {
+      switch (pri) {
+        case 1:
+          return "#ff9900";
+        case 2:
+          return "#ed3f14";
+        default:
+          return "green";
+      }
+    },
+    showTaskDesc() {
+      if (this.task.deleted) {
+        return false;
+      }
+      this.showTaskDescriptionEdit = true;
+      this.initContent(this.task.description);
+    },
+    initContent(value) {
+      if (value) {
+        this.$refs.vueWangeditor.setHtml(value);
+      } else {
+        this.$refs.vueWangeditor.setHtml("");
+      }
+      this.$nextTick(() => {
+        this.checkShowMoreDesc(false, true);
+      });
+    },
+    doContent() {
+      let content = this.$refs.vueWangeditor.getHtml();
+      const obj = {
+        taskCode: this.code,
+        description: content,
+      };
+      edit(obj).then(() => {
+        this.task.description = content;
+        this.showTaskDescriptionEdit = false;
+        this.$nextTick(() => {
+          this.checkShowMoreDesc(false, true);
+        });
+        this.getTaskLog();
+      });
+    },
+    createComment() {
+      let comment = this.comment.trim();
+      if (!comment) {
+        return false;
+      }
+      comment += " ";
+      const regx = /(@[^@]+) /g;
+      const res = comment.match(regx);
+      if (res) {
+        res.forEach((v) => {
+          let str = v.substring(1, v.length - 1);
+          if (this.mentionsList.findIndex((item) => item == str) === -1) {
+            this.mentionsList.push(str);
+          }
+        });
+      }
+      createComment(this.code, this.comment, JSON.stringify(this.mentionsList)).then(
+        () => {
+          this.comment = "";
+          this.mentionsList = [];
+          this.getTaskLog();
+        }
+      );
+    },
+    checkShowMoreDesc(show = false, init = false) {
+      let dom = $(".description-txt");
+      if (!init) {
+        if (show) {
+          this.showMoreDesc = true;
+          dom.css("max-height", () => {
+            return "100%";
+          });
+        } else {
+          this.showMoreDesc = false;
+          dom.css("max-height", () => {
+            return "300px";
+          });
+        }
+      }
+      if (init) {
+        const height = dom.height();
+        if (height >= 300) {
+          this.hasMoreDesc = true;
+          return true;
+        } else {
+          this.hasMoreDesc = false;
+          return false;
+        }
+      }
+      return false;
+    },
+    createTask() {
+      let obj = { pcode: this.code, name: this.childTaskName };
+      if (this.childExecutor) {
+        obj.assign_to = this.childExecutor.code;
+      }
+      createTask(obj).then((res) => {
+        const result = checkResponse(res);
+        if (!result) {
+          return false;
+        }
+        this.childTaskName = "";
+        this.getChildTasks();
+        this.getTaskLog();
+      });
+    },
+    getChildTasks() {
+      getTasks({ pcode: this.code, pageSize: 100, deleted: 0 }).then((res) => {
+        let list = [];
+        res.data.list.forEach((v) => {
+          v.visibleChildTaskMemberMenu = false;
+          list.push(v);
+        });
+        this.childTaskList = list;
+      });
+    },
+    taskTagChange(tag) {
+      const index = this.task.tags.findIndex((item) => item.tag_code == tag.code);
+      if (index !== -1) {
+        this.task.tags.splice(index, 1);
+      } else {
+        this.task.tags.push({
+          tag_code: tag.code,
+          tag: tag,
+        });
+      }
+    },
+    taskTagUpdate(tag) {
+      const index = this.task.tags.findIndex((item) => item.tag_code == tag.code);
+      if (index !== -1) {
+        this.task.tags[index].tag = tag;
+      }
+    },
+    taskTagDelete(tag) {
+      const index = this.task.tags.findIndex((item) => item.tag_code == tag.code);
+      if (index !== -1) {
+        this.task.tags.splice(index, 1);
+      }
+    },
+    removeTag(tag, index) {
+      setTag({ taskCode: this.task.code, tagCode: tag.code }).then(() => {
+        this.task.tags.splice(index, 1);
+      });
+    },
+    doPlainWorkTime() {
+      let app = this;
+      this.plainWorkTime.modalStatus = true;
+      this.$nextTick(function () {
+        app.plainWorkTime.form.setFieldsValue({
+          work_time: app.task.work_time,
+        });
+      });
+    },
+    doWorkTime(workTime = false) {
+      let app = this;
+      this.workTimeDo.modalStatus = true;
+      if (workTime) {
+        this.workTimeDo.info = workTime;
+        this.$nextTick(function () {
+          app.workTimeDo.form.setFieldsValue({
+            num: workTime.num,
+            begin_time: moment(workTime.begin_time),
+            content: workTime.content,
+          });
+        });
+      } else {
+        this.workTimeDo.form.resetFields();
+        this.workTimeDo.info = null;
+      }
+    },
+    deleteWorkTime(workTime, index) {
+      let app = this;
+      this.$confirm({
+        title: "删除工时记录",
+        content: `确定要删除工时记录吗？`,
+        okText: "确定",
+        okType: "danger",
+        cancelText: "再想想",
+        onOk() {
+          delTaskWorkTime({ code: workTime.code }).then((res) => {
+            if (checkResponse(res)) {
+              app.workTimeList.splice(index, 1);
+              app.workTimeTotal -= workTime.num;
             }
+          });
+          return Promise.resolve();
         },
-        methods: {
-            init(code = null, loading = true) {
-                if (code) {
-                    this.code = code;//子任务
-                }
-                if (loading) {
-                    this.loading = true;
-                }
-                this.clearMemberMenu();
-                this.getTask();
-                this.getChildTasks();
-                this.getTaskMembers();
-                this.getTaskWorkTimeList();
-            },
-            detailClose() {
-                this.$emit('close', this.task);
-                // this.$router.push(`/project/space/task/${this.task.project_code}`);
-            },
-            clearMemberMenu() {
-                this.visibleTaskTagMenu = false;
-                this.visibleTaskMemberMenu = false;
-                this.visibleProjectMemberMenu = false;
-                // this.showChildTask = false;
-            },
-            getTask() {
-                this.$store.commit('viewRefresh');
-                this.clearMemberMenu();
-                read(this.code).then((res) => {
-                    this.getTaskLog();
-                    this.taskSources();
-                    this.taskName = res.data.name;
-                    this.task = res.data;
-                    this.projectCodeCurrent = res.data.project_code;
-                    if (!this.task.end_time) {
-                        this.task.setEndTime = false;
-                        this.task.end_time = moment(moment().format('YYYY-MM-DD') + ' 18:00');
-                    } else {
-                        this.task.setEndTime = true;
-                        this.task.end_time = moment(this.task.end_time);
-                    }
-                    this.task.end_time_format = relativelyTaskTime(this.task.end_time, true);
-                    if (!this.task.begin_time) {
-                        this.task.setBeginTime = false;
-                        this.task.begin_time = moment(moment().format('YYYY-MM-DD') + ' 18:00');
-                    } else {
-                        this.task.setBeginTime = true;
-                        this.task.begin_time = moment(this.task.begin_time);
-                    }
-                    this.task.begin_time_format = relativelyTaskTime(this.task.begin_time, true);
-                    this.initContent(this.task.description);
-                    if (this.task.executor && !this.childExecutor) {
-                        this.childExecutor = this.task.executor;
-                    }
-                    this.loading = false;
-                    this.$store.dispatch('setTempData', {
-                        projectCode: this.projectCodeCurrent,
-                        taskCode: this.code,
-                        projectName: res.data.projectName
-                    })
-                });
-            },
-            getTaskLog() {
-                logs({
-                    taskCode: this.code,
-                    all: this.showMoreTaskLog,
-                    pageSize: 5,
-                    comment: this.taskLogType[0] == 'comment' ? 1 : 0
-                }).then((res) => {
-                    this.taskLogList = res.data.list;
-                    this.taskLogTotal = res.data.total;
-                    if (res.data.total > 5) {
-                        this.hasMoreTaskLog = true;
-                        // this.showMoreTaskLog = 1;
-                    }
-                })
-            },
-            taskSources() {
-                taskSources({taskCode: this.code,}).then((res) => {
-                    this.taskSourceList = res.data;
-                })
-            },
-            getMoreTaskLog() {
-                this.showMoreTaskLog = 1;
-                this.hideShowMore = true;
-                this.getTaskLog();
-            },
-            getTaskWorkTimeList() {
-                _taskWorkTimeList({taskCode: this.code}).then(res => {
-                    this.workTimeList = res.data;
-                    let total = 0;
-                    if (res.data) {
-                        res.data.forEach(v => {
-                            total += Number(v.num);
-                        });
-                        this.workTimeTotal = total;
-                    }
-                })
-            },
-            getTaskMembers() {
-                this.clearMemberMenu();
-                getTaskMembers({taskCode: this.code, pageSize: 100}).then((res) => {
-                    this.taskMemberList = res.data.list;
-                    this.loading = false;
-                })
-            },
-            doTask(action) {
-                let app = this;
-                const actionKey = action.key;
-                switch (actionKey) {
-                    case 'recycle':
-                        this.$confirm({
-                            title: '移到回收站',
-                            content: `您确定要把该任务移到回收站吗？`,
-                            okText: '确定',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                recycle(app.code).then((res) => {
-                                    const result = checkResponse(res);
-                                    if (!result) {
-                                        return false;
-                                    }
-                                    app.task.deleted = 1;
-                                    app.getTaskLog();
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case 'star':
-                        this.task.stared ? this.task.stared = 0 : this.task.stared = 1;
-                        star(app.code, this.task.stared);
-                        return true;
-                    case 'open':
-                        var url = window.location.href;
-                        if (url.indexOf('?') !== -1) {
-                            url += '&full-screen';
-                        }else{
-                            url += '?full-screen';
-                        }
-                        window.open(url);
-                        break;
-                    case 'private':
-                        setPrivate(app.code, Number(!this.task.private)).then(res => {
-                            const result = checkResponse(res);
-                            if (!result) {
-                                return false;
-                            }
-                            this.task.private = Number(!this.task.private);
-                        });
-                        return true;
-                }
-                this.visibleTaskMenu = false;
-            },
-            editTitle() {
-                this.showEditName = true;
-                this.$nextTick(() => {
-                    this.$refs.inputTitle.focus();
-                });
-            },
-            doSource(action, source) {
-                let app = this;
-                const actionKey = action.key;
-                switch (actionKey) {
-                    case 'unlink':
-                        this.$confirm({
-                            title: '取消关联',
-                            content: `您确定永久删除这个关联？`,
-                            okText: '确定',
-                            okType: 'danger',
-                            cancelText: `再想想`,
-                            onOk() {
-                                delSourceLink(source.code).then((res) => {
-                                    const result = checkResponse(res);
-                                    if (!result) {
-                                        return false;
-                                    }
-                                    app.taskSources();
-                                    app.getTaskLog();
-                                });
-                                return Promise.resolve();
-                            }
-                        });
-                        break;
-                    case 'copy':
-                        notice({
-                            title: '复制链接成功',
-                            msg: '在地址栏粘贴并打开可下载该资源'
-                        }, 'notice', 'success', 5);
-                        return true;
-                }
-            },
-            deleteTask() {
-                let app = this;
-                this.$confirm({
-                    title: '彻底删除',
-                    content: `彻底删除任务后，该任务及其子任务将会被永久被删除。`,
-                    okText: '删除',
-                    okType: 'danger',
-                    cancelText: `再想想`,
-                    onOk() {
-                        del(app.code).then((res) => {
-                            ``
-                            app.detailClose();
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            recoveryTask() {
-                let app = this;
-                this.$confirm({
-                    title: '恢复内容',
-                    content: `您确定要恢复该任务吗？`,
-                    okText: '确定',
-                    okType: 'primary',
-                    cancelText: `再想想`,
-                    onOk() {
-                        recovery(app.code).then((res) => {
-                            const result = checkResponse(res);
-                            if (!result) {
-                                return false;
-                            }
-                            app.getTaskLog();
-                        });
-                        app.task.deleted = 0;
-                        return Promise.resolve();
-                    }
-                });
-            },
-            copyLink() {
-                notice({
-                    title: '复制链接成功',
-                    msg: '你可以在其他标签页粘贴并快速打开任务页面'
-                }, 'notice', 'success', 5);
-            },
-            like(like) {
-                like = Number(like);
-                doLike(this.code, like);
-                if (like) {
-                    this.task.like++;
-                } else {
-                    this.task.like--;
-                }
-                this.task.liked = like;
-            },
-            taskDone(taskCode, done, index, type = 'self') {
-                done ? done = 1 : done = 0;
-                taskDone(taskCode, done).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    this.getTaskLog();
-                    if (type == 'self') {
-                        //自身完成
-                        this.task.done = done;
-                        // this.init();
-                    } else {
-                        //完成子任务
-                        this.childTaskList[index].done = done;
-                        // this.init(this.childTaskList[index].pcode);
-                    }
-                    this.getTask();
-                    this.getChildTasks();
-                });
-            },
-            doBeginTime(setBeginTime = false, showBeginTime = false) {
-                this.task.setBeginTime = setBeginTime;
-                this.showBeginTime = showBeginTime;
-                let beginTime = '';
-                if (setBeginTime) {
-                    beginTime = moment(this.task.begin_time).format('YYYY-MM-DD HH:mm');
-                    this.task.begin_time_format = moment(this.task.begin_time).format('MM月DD日 HH:mm');
-                } else {
-                    beginTime = '';
-                }
-                this.editTask({begin_time: beginTime});
-
-            },
-            doEndTime(setEndTime = false, showEndTime = false) {
-                this.task.setEndTime = setEndTime;
-                this.showEndTime = showEndTime;
-                let endTime = '';
-                if (setEndTime) {
-                    endTime = moment(this.task.end_time).format('YYYY-MM-DD HH:mm');
-                    this.task.end_time_format = moment(this.task.end_time).format('MM月DD日 HH:mm');
-                } else {
-                    endTime = '';
-                }
-                this.editTask({end_time: endTime});
-
-            },
-            doPri(item) {
-                this.editTask({pri: item.key});
-            },
-            doName() {
-                this.showEditName = false;
-                if (!this.task.name.trim() || this.task.name == this.taskName) {
-                    this.task.name = this.taskName;
-                    return false;
-                }
-                this.editTask({name: this.task.name});
-            },
-            taskStatusChange(item) {
-                this.task.status = item.key;
-                this.editTask({status: item.key});
-            },
-            editTask(data) {
-                data.taskCode = this.code;
-                edit(data).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    this.getTask();
-                });
-            },
-            priColor(pri) {
-                switch (pri) {
-                    case 1:
-                        return '#ff9900';
-                    case 2:
-                        return '#ed3f14';
-                    default:
-                        return 'green';
-
-                }
-            },
-            showTaskDesc() {
-                if (this.task.deleted) {
-                    return false;
-                }
-                this.showTaskDescriptionEdit = true;
-                this.initContent(this.task.description)
-            },
-            initContent(value) {
-                if (value) {
-                    this.$refs.vueWangeditor.setHtml(value)
-                } else {
-                    this.$refs.vueWangeditor.setHtml('')
-                }
-                this.$nextTick(() => {
-                    this.checkShowMoreDesc(false, true);
-                });
-            },
-            doContent() {
-                let content = this.$refs.vueWangeditor.getHtml();
-                const obj = {
-                    taskCode: this.code,
-                    description: content
-                };
-                edit(obj).then(() => {
-                    this.task.description = content;
-                    this.showTaskDescriptionEdit = false;
-                    this.$nextTick(() => {
-                        this.checkShowMoreDesc(false, true);
-                    });
-                    this.getTaskLog();
-                });
-            },
-            createComment() {
-                let comment = this.comment.trim();
-                if (!comment) {
-                    return false;
-                }
-                comment += ' ';
-                const regx = /(@[^@]+) /g;
-                const res = comment.match(regx);
-                if (res) {
-                    res.forEach((v) => {
-                        let str = v.substring(1, v.length - 1);
-                        if (this.mentionsList.findIndex(item => item == str) === -1) {
-                            this.mentionsList.push(str);
-                        }
-                    });
-                }
-                createComment(this.code, this.comment, JSON.stringify(this.mentionsList)).then(() => {
-                    this.comment = '';
-                    this.mentionsList = [];
-                    this.getTaskLog();
-                });
-            },
-            checkShowMoreDesc(show = false, init = false) {
-                let dom = $(".description-txt");
-                if (!init) {
-                    if (show) {
-                        this.showMoreDesc = true;
-                        dom.css("max-height", () => {
-                            return '100%';
-                        });
-                    } else {
-                        this.showMoreDesc = false;
-                        dom.css("max-height", () => {
-                            return '300px';
-                        });
-                    }
-                }
-                if (init) {
-                    const height = dom.height();
-                    if (height >= 300) {
-                        this.hasMoreDesc = true;
-                        return true;
-                    } else {
-                        this.hasMoreDesc = false;
-                        return false;
-                    }
-                }
-                return false;
-            },
-            createTask() {
-                let obj = {pcode: this.code, name: this.childTaskName};
-                if (this.childExecutor) {
-                    obj.assign_to = this.childExecutor.code;
-                }
-                createTask(obj).then((res) => {
-                    const result = checkResponse(res);
-                    if (!result) {
-                        return false;
-                    }
-                    this.childTaskName = '';
-                    this.getChildTasks();
-                    this.getTaskLog();
-                });
-            },
-            getChildTasks() {
-                getTasks({pcode: this.code, pageSize: 100, deleted: 0}).then((res) => {
-                    let list = [];
-                    res.data.list.forEach(v => {
-                        v.visibleChildTaskMemberMenu = false;
-                        list.push(v);
-                    });
-                    this.childTaskList = list;
-                })
-            },
-            taskTagChange(tag) {
-                const index = this.task.tags.findIndex(item => item.tag_code == tag.code);
-                if (index !== -1) {
-                    this.task.tags.splice(index, 1);
-                } else {
-                    this.task.tags.push({
-                        tag_code: tag.code,
-                        tag: tag
-                    });
-                }
-            },
-            taskTagUpdate(tag) {
-                const index = this.task.tags.findIndex(item => item.tag_code == tag.code);
-                if (index !== -1) {
-                    this.task.tags[index].tag = tag;
-                }
-            },
-            taskTagDelete(tag) {
-                const index = this.task.tags.findIndex(item => item.tag_code == tag.code);
-                if (index !== -1) {
-                    this.task.tags.splice(index, 1);
-                }
-            },
-            removeTag(tag, index) {
-                setTag({taskCode: this.task.code, tagCode: tag.code}).then(() => {
-                    this.task.tags.splice(index, 1);
-                });
-            },
-            doPlainWorkTime() {
-                let app = this;
-                this.plainWorkTime.modalStatus = true;
-                this.$nextTick(function () {
-                    app.plainWorkTime.form.setFieldsValue({
-                        work_time: app.task.work_time,
-                    });
-                })
-            },
-            doWorkTime(workTime = false) {
-                let app = this;
-                this.workTimeDo.modalStatus = true;
-                if (workTime) {
-                    this.workTimeDo.info = workTime;
-                    this.$nextTick(function () {
-                        app.workTimeDo.form.setFieldsValue({
-                            num: workTime.num,
-                            begin_time: moment(workTime.begin_time),
-                            content: workTime.content,
-                        });
-                    })
-                } else {
-                    this.workTimeDo.form.resetFields();
-                    this.workTimeDo.info = null;
-                }
-            },
-            deleteWorkTime(workTime, index) {
-                let app = this;
-                this.$confirm({
-                    title: '删除工时记录',
-                    content: `确定要删除工时记录吗？`,
-                    okText: '确定',
-                    okType: 'danger',
-                    cancelText: '再想想',
-                    onOk() {
-                        delTaskWorkTime({code: workTime.code}).then((res) => {
-                            if (checkResponse(res)) {
-                                app.workTimeList.splice(index, 1);
-                                app.workTimeTotal -= workTime.num;
-                            }
-                        });
-                        return Promise.resolve();
-                    }
-                });
-            },
-            workTimePlainHandleSubmit() {
-                let app = this;
-                this.plainWorkTime.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            app.editTask({work_time: values.work_time});
-                            app.plainWorkTime.modalStatus = false;
-                        }
-                    }
-                );
-            },
-            workTimeHandleSubmit() {
-                let app = this;
-                this.workTimeDo.form.validateFields(
-                    (err, values) => {
-                        if (!err) {
-                            app.workTimeDo.confirmLoading = true;
-                            let data = {
-                                beginTime: values.begin_time.format('YYYY-MM-DD HH:mm'),
-                                num: values.num,
-                                content: values.content,
-                                taskCode: app.code,
-                            };
-                            if (app.workTimeDo.info) {
-                                data.code = app.workTimeDo.info.code;
-                                editTaskWorkTime(data).then(res => {
-                                    app.workTimeDo.confirmLoading = false;
-                                    if (checkResponse(res)) {
-                                        app.workTimeDo.modalStatus = false;
-                                        app.getTaskWorkTimeList();
-                                    }
-                                })
-                            } else {
-                                saveTaskWorkTime(data).then(res => {
-                                    app.workTimeDo.confirmLoading = false;
-                                    if (checkResponse(res)) {
-                                        app.workTimeDo.modalStatus = false;
-                                        app.getTaskWorkTimeList();
-                                    }
-                                });
-                            }
-                        }
-                    }
-                );
-            },
-            checkLink(text) {
-                let reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g;
-                if(!reg.exec(text)){
-                    return text
-                }else{
-                    text = text.replace(reg, "<a target='_blank' href='$1$2'>$1$2</a>");
-                }
-                return text;
-            },
-            updateChildExecutor(member) {
-                this.visibleChildTaskMemberMenu = false;
-                this.childExecutor = member;
-            },
-            getPopup() {
-                return document.getElementById('footer');
-            },
-            getTaskMemberPopup() {
-                return document.getElementById('task-detail');
-            },
-            departmentMemberDetail(code) {
-                detail({code: code,organization: this.$store.state.currentOrganization.code}).then(res=>{
-                    this.departmentMemberInfo = res.data;
-                })
-            },
-            selectMentionMember(member) {
-                this.showMentions = false;
-                this.comment += member.name + ' ';
-                this.$nextTick(() => {
-                    this.$refs.commentText.focus();
-                });
-            },
-            changeModalHeight() {
-                const defaultWidth = this.width;
-                let width = $(window).width() - 100;
-                let height = $(window).height() - 150;
-                let logHeight = $(window).height() - 315;
-                if (defaultWidth === 'full-screen' || this.$route.query['full-screen'] !== undefined) {
-                    //全屏显示
-                    $(".task-detail-modal").css("width", $(window).width());
-                    $(".task-detail").css("width", $(window).width());
-                    $(".ant-modal").css("top", 0);
-                    height += 85;
-                    logHeight += 85;
-                    $(".content-left").css("height", height + "px");
-                    $(".log-wrap").css("height", logHeight + "px");
-                } else {
-                    if (width > defaultWidth) {
-                        width = defaultWidth;
-                    }
-                    $(".task-detail").css("width", width);
-                    $(".content-left").css("height", height + "px");
-                    $(".log-wrap").css("height", logHeight + "px");
-                }
-            }
+      });
+    },
+    workTimePlainHandleSubmit() {
+      let app = this;
+      this.plainWorkTime.form.validateFields((err, values) => {
+        if (!err) {
+          app.editTask({ work_time: values.work_time });
+          app.plainWorkTime.modalStatus = false;
         }
-    }
+      });
+    },
+    workTimeHandleSubmit() {
+      let app = this;
+      this.workTimeDo.form.validateFields((err, values) => {
+        if (!err) {
+          app.workTimeDo.confirmLoading = true;
+          let data = {
+            beginTime: values.begin_time.format("YYYY-MM-DD HH:mm"),
+            num: values.num,
+            content: values.content,
+            taskCode: app.code,
+          };
+          if (app.workTimeDo.info) {
+            data.code = app.workTimeDo.info.code;
+            editTaskWorkTime(data).then((res) => {
+              app.workTimeDo.confirmLoading = false;
+              if (checkResponse(res)) {
+                app.workTimeDo.modalStatus = false;
+                app.getTaskWorkTimeList();
+              }
+            });
+          } else {
+            saveTaskWorkTime(data).then((res) => {
+              app.workTimeDo.confirmLoading = false;
+              if (checkResponse(res)) {
+                app.workTimeDo.modalStatus = false;
+                app.getTaskWorkTimeList();
+              }
+            });
+          }
+        }
+      });
+    },
+    checkLink(text) {
+      let reg = /(http:\/\/|https:\/\/)((\w|=|\?|\.|\/|&|-)+)/g;
+      if (!reg.exec(text)) {
+        return text;
+      } else {
+        text = text.replace(reg, "<a target='_blank' href='$1$2'>$1$2</a>");
+      }
+      return text;
+    },
+    updateChildExecutor(member) {
+      this.visibleChildTaskMemberMenu = false;
+      this.childExecutor = member;
+    },
+    getPopup() {
+      return document.getElementById("footer");
+    },
+    getTaskMemberPopup() {
+      return document.getElementById("task-detail");
+    },
+    departmentMemberDetail(code) {
+      detail({
+        code: code,
+        organization: this.$store.state.currentOrganization.code,
+      }).then((res) => {
+        this.departmentMemberInfo = res.data;
+      });
+    },
+    selectMentionMember(member) {
+      this.showMentions = false;
+      this.comment += member.name + " ";
+      this.$nextTick(() => {
+        this.$refs.commentText.focus();
+      });
+    },
+    changeModalHeight() {
+      const defaultWidth = this.width;
+      let width = $(window).width() - 100;
+      let height = $(window).height() - 150;
+      let logHeight = $(window).height() - 315;
+      if (
+        defaultWidth === "full-screen" ||
+        this.$route.query["full-screen"] !== undefined
+      ) {
+        //全屏显示
+        $(".task-detail-modal").css("width", $(window).width());
+        $(".task-detail").css("width", $(window).width());
+        $(".ant-modal").css("top", 0);
+        height += 85;
+        logHeight += 85;
+        $(".content-left").css("height", height + "px");
+        $(".log-wrap").css("height", logHeight + "px");
+      } else {
+        if (width > defaultWidth) {
+          width = defaultWidth;
+        }
+        $(".task-detail").css("width", width);
+        $(".content-left").css("height", height + "px");
+        $(".log-wrap").css("height", logHeight + "px");
+      }
+    },
+  },
+};
 </script>
 
-
 <style lang="less">
-    @import "~ant-design-vue/lib/style/themes/default";
-
-    .field-flex {
-        display: flex;
-        justify-content: flex-start;
-    }
-
-    .task-tag {
-        .ant-tag {
-            margin-bottom: 6px;
+@import "~ant-design-vue/lib/style/themes/default";
+
+.field-flex {
+  display: flex;
+  justify-content: flex-start;
+}
+
+.task-tag {
+  .ant-tag {
+    margin-bottom: 6px;
+  }
+}
+
+.task-detail {
+  background: #fff;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+  min-height: 1px;
+  min-width: 1px;
+  margin: auto;
+
+  .task-detail-spin {
+    width: 100%;
+  }
+
+  .task-header {
+    padding: 20px 0;
+    border-bottom: 1px solid #e5e5e5;
+    display: flex;
+    vertical-align: middle;
+
+    .head-title {
+      padding: 0 20px 0 20px;
+      flex: 1 1;
+
+      .breadcrumb {
+        display: inline;
+
+        a {
+          color: inherit;
+
+          &:hover {
+            color: #40a9ff;
+          }
         }
+      }
     }
 
-    .task-detail {
-        background: #FFF;
-        display: -webkit-box;
-        display: -ms-flexbox;
+    .header-action {
+      font-size: 16px;
+      padding: 0 20px;
+      display: flex;
+      max-height: 24px;
+
+      .action-item {
+        margin-left: 10px;
+        padding: 4px;
+        transition: 218ms;
+        transition-property: background, color;
+        border-radius: 4px;
+        align-items: center;
         display: flex;
-        -webkit-box-pack: center;
-        -ms-flex-pack: center;
+        text-align: center;
         justify-content: center;
-        -webkit-box-flex: 1;
-        -ms-flex: 1;
-        flex: 1;
-        min-height: 1px;
-        min-width: 1px;
-        margin: auto;
-
-        .task-detail-spin {
-            width: 100%;
+        min-width: 32px;
+
+        span {
+          margin-left: 6px;
+          font-size: 14px;
         }
 
-        .task-header {
-            padding: 20px 0;
-            border-bottom: 1px solid #e5e5e5;
-            display: flex;
-            vertical-align: middle;
+        &.active {
+          color: #3da8f5;
+        }
+
+        &:hover {
+          background: #ecf6fe;
+          color: #3da8f5;
+          border-radius: 4px;
+        }
+      }
+    }
 
+    &.disabled {
+      background: #f5f5f5;
+    }
+  }
 
-            .head-title {
-                padding: 0 20px 0 20px;
-                flex: 1 1;
+  .task-wrap {
+    .task-content {
+      display: flex;
+      justify-content: flex-start;
 
-                .breadcrumb {
-                    display: inline;
+      .content-left {
+        border-right: 1px solid #e5e5e5;
+        min-width: 560px;
+        width: 63%;
+        /*width: 760px;*/
 
-                    a {
-                        color: inherit;
+        .task-title {
+          margin: 10px 40px 20px 20px;
+          cursor: text;
 
-                        &:hover {
-                            color: #40a9ff;
-                        }
+          &.disabled {
+            cursor: not-allowed;
 
-                    }
-                }
+            &:hover {
+              background: inherit;
             }
 
-            .header-action {
-                font-size: 16px;
-                padding: 0 20px;
+            .ant-input,
+            .title-text {
+              &:hover,
+              &:focus {
+                background: inherit;
+              }
+            }
+          }
+
+          &:hover {
+            background: #f5f5f5;
+          }
+          &.hover-none {
+            background: initial;
+          }
+
+          .title-text {
+            line-height: 24px;
+          }
+
+          .ant-input,
+          .title-text {
+            font-size: 20px;
+            padding: 8px;
+            border: none !important;
+            border-radius: 4px;
+
+            &:hover,
+            &:focus {
+              background: #f5f5f5;
+              box-shadow: none !important;
+              border-right-width: 0 !important;
+              border: none !important;
+              border-radius: 4px;
+            }
+          }
+        }
+
+        .task-basic-attrs-view {
+          .field-list {
+            padding: 0 40px 0 32px;
+
+            &.disabled {
+              .field-right,
+              a {
+                cursor: not-allowed !important;
+              }
+            }
+
+            .component-mount {
+              .field {
                 display: flex;
-                max-height: 24px;
+                justify-content: flex-start;
+                margin: 12px 0;
+                min-height: 36px;
+
+                .field-left {
+                  align-self: flex-start;
+                  width: 132px;
+                  height: 36px;
+                  padding-right: 12px;
+                }
 
-                .action-item {
-                    margin-left: 10px;
-                    padding: 4px;
-                    transition: 218ms;
-                    transition-property: background, color;
-                    border-radius: 4px;
-                    align-items: center;
+                .field-right {
+                  cursor: pointer;
+                  max-width: calc(100% - 132px);
+
+                  .inline-block {
+                    display: inline-block;
+                  }
+
+                  &.field-date {
                     display: flex;
-                    text-align: center;
-                    justify-content: center;
-                    min-width: 32px;
+                  }
 
-                    span {
-                        margin-left: 6px;
-                        font-size: 14px;
-                    }
+                  &.width-block {
+                    width: 100%;
 
-                    &.active {
-                        color: #3da8f5;
+                    .w-e-text {
+                      cursor: text;
                     }
+                  }
 
-                    &:hover {
-                        background: #ecf6fe;
-                        color: #3da8f5;
-                        border-radius: 4px;
-                    }
+                  .name {
+                    margin: 0 8px;
+                  }
                 }
-            }
-
-            &.disabled {
-                background: #f5f5f5;
-            }
-        }
 
-        .task-wrap {
-            .task-content {
-                display: flex;
-                justify-content: flex-start;
+                .block-field {
+                  width: 100%;
+                  border: 1px solid #e5e5e5;
+                  border-radius: 4px;
+                  padding: 2px 0;
+                  margin-bottom: 12px;
+                  display: flex;
+                  justify-content: flex-start;
+                  flex-direction: row;
+                }
 
-                .content-left {
-                    border-right: 1px solid #e5e5e5;
-                    min-width: 560px;
-                    width: 63%;
-                    /*width: 760px;*/
+                .task-child {
+                  width: 100%;
 
-                    .task-title {
-                        margin: 10px 40px 20px 20px;
-                        cursor: text;
+                  .task-list {
+                    padding: 8px 0;
 
-                        &.disabled {
-                            cursor: not-allowed;
+                    .list-item {
+                      padding: 4px 12px 4px 5px;
+                      display: flex;
+                      align-items: center;
+                      /*justify-content: space-between;*/
 
-                            &:hover {
-                                background: inherit;
-                            }
+                      .task-title,
+                      .task-input {
+                        flex: 1 1;
+                        margin: 0;
+                      }
 
-                            .ant-input, .title-text {
-                                &:hover, &:focus {
-                                    background: inherit;
-                                }
-                            }
-                        }
+                      .title-text {
+                        color: #333;
+                        line-height: 14px;
 
-                        &:hover {
-                            background: #f5f5f5;
-                        }
-                        &.hover-none{
-                            background: initial;
+                        &.done {
+                          color: #a6a6a6;
                         }
+                      }
 
-                        .title-text {
-                            line-height: 24px;
-                        }
+                      .ant-input,
+                      .title-text {
+                        font-size: 14px;
 
-                        .ant-input, .title-text {
-                            font-size: 20px;
-                            padding: 8px;
-                            border: none !important;
-                            border-radius: 4px;
-
-                            &:hover, &:focus {
-                                background: #f5f5f5;
-                                box-shadow: none !important;
-                                border-right-width: 0 !important;
-                                border: none !important;
-                                border-radius: 4px;
-                            }
+                        &:hover,
+                        &:focus {
                         }
-                    }
+                      }
 
-                    .task-basic-attrs-view {
-                        .field-list {
-                            padding: 0 40px 0 32px;
+                      .check-box-wrapper {
+                        margin-top: 0;
+                      }
 
-                            &.disabled {
-                                .field-right, a {
-                                    cursor: not-allowed !important;
-                                }
-                            }
-
-                            .component-mount {
-                                .field {
-                                    display: flex;
-                                    justify-content: flex-start;
-                                    margin: 12px 0;
-                                    min-height: 36px;
-
-                                    .field-left {
-                                        align-self: flex-start;
-                                        width: 132px;
-                                        height: 36px;
-                                        padding-right: 12px;
-                                    }
-
-                                    .field-right {
-                                        cursor: pointer;
-                                        max-width: calc(100% - 132px);
-
-                                        .inline-block {
-                                            display: inline-block;
-                                        }
+                      .task-item {
+                        cursor: pointer;
+                        margin-right: 12px;
 
-                                        &.field-date {
-                                            display: flex;
-                                        }
+                        &.disabled {
+                          cursor: not-allowed;
+                        }
 
-                                        &.width-block {
-                                            width: 100%;
+                        &.check-box {
+                          .anticon-check {
+                            visibility: visible;
+                            top: 14px;
+                            left: 18px;
+                          }
+                        }
+                      }
+                    }
 
-                                            .w-e-text {
-                                                cursor: text;
-                                            }
-                                        }
+                    .action-btn {
+                      padding: 2px 12px 2px 16px;
+                    }
+                  }
 
-                                        .name {
-                                            margin: 0 8px;
-                                        }
-                                    }
-
-                                    .block-field {
-                                        width: 100%;
-                                        border: 1px solid #e5e5e5;
-                                        border-radius: 4px;
-                                        padding: 2px 0;
-                                        margin-bottom: 12px;
-                                        display: flex;
-                                        justify-content: flex-start;
-                                        flex-direction: row;
-                                    }
-
-                                    .task-child {
-                                        width: 100%;
-
-                                        .task-list {
-                                            padding: 8px 0;
-
-                                            .list-item {
-                                                padding: 4px 12px 4px 5px;
-                                                display: flex;
-                                                align-items: center;
-                                                /*justify-content: space-between;*/
-
-                                                .task-title, .task-input {
-                                                    flex: 1 1;
-                                                    margin: 0;
-                                                }
-
-                                                .title-text {
-                                                    color: #333;
-                                                    line-height: 14px;
-
-                                                    &.done {
-                                                        color: #a6a6a6;
-                                                    }
-                                                }
-
-                                                .ant-input, .title-text {
-                                                    font-size: 14px;
-
-                                                    &:hover, &:focus {
-                                                    }
-                                                }
-
-                                                .check-box-wrapper {
-                                                    margin-top: 0;
-                                                }
-
-                                                .task-item {
-                                                    cursor: pointer;
-                                                    margin-right: 12px;
-
-                                                    &.disabled {
-                                                        cursor: not-allowed;
-                                                    }
-
-                                                    &.check-box {
-                                                        .anticon-check {
-                                                            visibility: visible;
-                                                            top: 14px;
-                                                            left: 18px;
-                                                        }
-                                                    }
-
-                                                }
-                                            }
-
-                                            .action-btn {
-                                                padding: 2px 12px 2px 16px;
-                                            }
-                                        }
+                  .add-handler {
+                    /*margin-bottom: 8px;*/
+                    padding-left: 16px;
+                    padding-right: 12px;
+                    display: flex;
+                    align-items: center;
+                    height: 36px;
+                  }
+                }
 
-                                        .add-handler {
-                                            /*margin-bottom: 8px;*/
-                                            padding-left: 16px;
-                                            padding-right: 12px;
-                                            display: flex;
-                                            align-items: center;
-                                            height: 36px;
-                                        }
-                                    }
-
-                                    .file-list {
-                                        width: 100%;
-                                        padding: 8px;
-
-                                        .ant-list-item {
-                                            padding: 10px 12px;
-                                            border-bottom: none;
-                                            border-radius: 4px;
-                                            margin-bottom: 2px;
-
-                                            &:hover {
-                                                background-color: #f5f5f5;
-                                            }
-
-                                            .ant-list-item-meta-title {
-                                                margin-bottom: 0;
-                                                line-height: 24px;
-                                            }
-                                        }
-                                    }
-                                }
+                .file-list {
+                  width: 100%;
+                  padding: 8px;
 
-                                .field-name {
-                                    overflow: hidden;
-                                    text-overflow: ellipsis;
-                                    white-space: nowrap;
-                                    padding-left: 8px;
-                                }
+                  .ant-list-item {
+                    padding: 10px 12px;
+                    border-bottom: none;
+                    border-radius: 4px;
+                    margin-bottom: 2px;
 
-                                .task-description {
-                                    &:hover {
-                                        background: #f5f5f5;
-                                        border-radius: 4px;
-                                    }
+                    &:hover {
+                      background-color: #f5f5f5;
+                    }
 
-                                    &.disabled {
-                                        &:hover {
-                                            background: inherit;
-                                        }
-                                    }
+                    .ant-list-item-meta-title {
+                      margin-bottom: 0;
+                      line-height: 24px;
+                    }
+                  }
+                }
+              }
+
+              .field-name {
+                overflow: hidden;
+                text-overflow: ellipsis;
+                white-space: nowrap;
+                padding-left: 8px;
+              }
+
+              .task-description {
+                &:hover {
+                  background: #f5f5f5;
+                  border-radius: 4px;
+                }
 
-                                    padding: 8px;
-                                    margin: -8px;
+                &.disabled {
+                  &:hover {
+                    background: inherit;
+                  }
+                }
 
-                                    .description-txt {
-                                        max-height: 300px;
-                                        overflow: hidden;
-                                    }
+                padding: 8px;
+                margin: -8px;
 
-                                    p {
-                                        margin: 0;
-                                    }
-                                }
-                            }
-                        }
-                    }
+                .description-txt {
+                  max-height: 300px;
+                  overflow: hidden;
                 }
 
-                .content-right {
-                    width: 37%;
-                    /*width: 440px;*/
+                p {
+                  margin: 0;
+                }
+              }
+            }
+          }
+        }
+      }
 
-                    .header {
-                        padding: 15px 20px 20px 20px;
-                    }
+      .content-right {
+        width: 37%;
+        /*width: 440px;*/
 
-                    .member-list {
-                        padding-top: 12px;
-                        display: flex;
-                        justify-content: flex-start;
+        .header {
+          padding: 15px 20px 20px 20px;
+        }
 
-                        .member-item {
-                            margin-right: 10px;
-                            cursor: pointer;
+        .member-list {
+          padding-top: 12px;
+          display: flex;
+          justify-content: flex-start;
 
-                            &.invite {
-                                cursor: pointer;
-                            }
-                        }
-                    }
+          .member-item {
+            margin-right: 10px;
+            cursor: pointer;
 
-                    .log-wrap {
-                        border-top: 1px solid #e5e5e5;
-                        border-bottom: 1px solid #e5e5e5;
-                        padding-bottom: 60px;
+            &.invite {
+              cursor: pointer;
+            }
+          }
+        }
 
-                        .header {
-                            width: 100%;
-                        }
+        .log-wrap {
+          border-top: 1px solid #e5e5e5;
+          border-bottom: 1px solid #e5e5e5;
+          padding-bottom: 60px;
 
-                        .log-list {
-                            /*font-size: 12px;*/
-                            padding: 0 20px 0 20px;
-
-                            .show-more {
-                                display: block;
-                                margin-bottom: 20px;
-                            }
-
-                            .log-comment {
-                                max-width: 405px;
-                                align-items: end;
-                                margin-bottom: 15px;
-                            }
-
-                            .list-item {
-                                display: flex;
-                                justify-content: flex-start;
-                                align-items: baseline;
-                                vertical-align: middle;
-                                width: 100%;
-                                .log-item {
-                                    margin-right: 12px;
-                                    margin-bottom: 24px;
-
-                                    .anticon {
-                                        font-size: 14px;
-                                    }
-
-                                    .log-content {
-                                        overflow: hidden;
-                                        text-overflow: ellipsis;
-                                        border-left: 5px solid #ccc;
-                                        padding-left: 12px;
-                                        margin-top: 6px;
-                                    }
-                                }
+          .header {
+            width: 100%;
+          }
 
-                                .log-txt {
-                                    flex: 1 1;
-                                }
-                            }
-                        }
-                    }
+          .log-list {
+            /*font-size: 12px;*/
+            padding: 0 20px 0 20px;
 
-                    .footer {
-                        padding: 20px 20px 0 20px;
-                        display: flex;
-                    }
-                }
+            .show-more {
+              display: block;
+              margin-bottom: 20px;
             }
-        }
-    }
 
-    .work-time-modal {
-        .work-time-stats {
-            display: flex;
-            margin-bottom: 18px;
-
-            .work-time-item {
-                margin-right: 36px;
+            .log-comment {
+              max-width: 405px;
+              align-items: end;
+              margin-bottom: 15px;
+            }
 
-                .title {
-                    font-size: 12px;
+            .list-item {
+              display: flex;
+              justify-content: flex-start;
+              align-items: baseline;
+              vertical-align: middle;
+              width: 100%;
+              .log-item {
+                margin-right: 12px;
+                margin-bottom: 24px;
+
+                .anticon {
+                  font-size: 14px;
                 }
 
-                .work-time-num {
-                    font-size: 22px;
-                    font-weight: 500;
-                    margin-right: 5px;
-                    font-family: dinmedium;
+                .log-content {
+                  overflow: hidden;
+                  text-overflow: ellipsis;
+                  border-left: 5px solid #ccc;
+                  padding-left: 12px;
+                  margin-top: 6px;
                 }
+              }
+
+              .log-txt {
+                flex: 1 1;
+              }
             }
+          }
+        }
+
+        .footer {
+          padding: 20px 20px 0 20px;
+          display: flex;
         }
+      }
     }
-    .footer{
-        .ant-popover-inner-content{
-            padding: 0;
-            .mentions-content {
-                width: 200px;
-                padding: 12px 0;
-                .mentions-wrapper {
-                    width: 100%;
-                    display: flex;
-                    align-items: center;
-                    padding: 6px 12px;
-                    &:hover{
-                        cursor: pointer;
-                        background: rgba(51, 143, 229, 0.1);
-                    }
-                }
-            }
+  }
+}
+
+.work-time-modal {
+  .work-time-stats {
+    display: flex;
+    margin-bottom: 18px;
+
+    .work-time-item {
+      margin-right: 36px;
+
+      .title {
+        font-size: 12px;
+      }
+
+      .work-time-num {
+        font-size: 22px;
+        font-weight: 500;
+        margin-right: 5px;
+        font-family: dinmedium;
+      }
+    }
+  }
+}
+.footer {
+  .ant-popover-inner-content {
+    padding: 0;
+    .mentions-content {
+      width: 200px;
+      padding: 12px 0;
+      .mentions-wrapper {
+        width: 100%;
+        display: flex;
+        align-items: center;
+        padding: 6px 12px;
+        &:hover {
+          cursor: pointer;
+          background: rgba(51, 143, 229, 0.1);
         }
+      }
     }
+  }
+}
 </style>
diff --git a/src/config/version.js b/src/config/version.js
index c589f16..004129f 100644
--- a/src/config/version.js
+++ b/src/config/version.js
@@ -1,3 +1,19 @@
 export default {
-    VERSION: '2.9.0',
+    VERSION: '2.9.1',
 };
+/*
+1. 新增甘特图
+2. 项目选择器组件完善内部调用
+3. 新增工时小数显示
+
+ALTER TABLE `pear_task` MODIFY COLUMN `work_time` decimal(10,1)  NULL DEFAULT 0.0 COMMENT '预估工时' AFTER `features_code`;
+ALTER TABLE `pear_task_work_time` MODIFY COLUMN `num` decimal(10,1)  NULL DEFAULT 0.0 COMMENT '工时' AFTER `begin_time`;
+
+4. 优化一些项目创建默认设置
+
+ALTER TABLE `pear_project` MODIFY COLUMN `open_begin_time` tinyint(1) NULL DEFAULT 1 COMMENT '是否开启任务开始时间' AFTER `archive_time`;
+ALTER TABLE `pear_project` MODIFY COLUMN `auto_update_schedule` tinyint(1) NULL DEFAULT 1 COMMENT '自动更新项目进度' AFTER `end_time`;
+UPDATE `projectdb`.`pear_project` SET `auto_update_schedule`=1;
+UPDATE `projectdb`.`pear_project` SET `open_begin_time`=1;
+
+*/
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index bef08ae..074a392 100644
--- a/src/main.js
+++ b/src/main.js
@@ -19,7 +19,8 @@ import 'moment/locale/zh-cn';
 
 import common from "./mixins/common";
 
-import '@/utils/filter' // global filter
+import '@/utils/filter'; // global filter
+
 
 
 moment.locale('zh-cn');
@@ -41,6 +42,7 @@ Vue.prototype.$message = message;
 Vue.prototype.$notification = notification;
 Vue.prototype.$notice = notice;
 Vue.prototype.$destroyNotice = destroyNotice;
+Vue.prototype.$moment = moment;
 
 Vue.use(vuescroll);
 Vue.prototype.$vuescrollConfig = {
diff --git a/src/utils/utils.js b/src/utils/utils.js
new file mode 100644
index 0000000..a8d9ace
--- /dev/null
+++ b/src/utils/utils.js
@@ -0,0 +1,17 @@
+
+/***
+ * 随机颜色生成
+ * param type为1是生成rgb三色的随机，为2则是十六进制的颜色
+ */
+export function randomColor(type = 1) {
+  let r = Math.floor(Math.random() * 256);
+  let g = Math.floor(Math.random() * 256);
+  let b = Math.floor(Math.random() * 256);
+  if (type == 1) {
+    //rgb颜色随机
+    return "rgb(" + r + "," + g + "," + b + ")";
+  } else {
+    //十六进制颜色随机
+    return "#" + r.toString(16) + g.toString(16) + b.toString(16);
+  }
+}
diff --git a/src/views/files/index.vue b/src/views/files/index.vue
index fafa42b..3a0719b 100644
--- a/src/views/files/index.vue
+++ b/src/views/files/index.vue
@@ -4,11 +4,20 @@
       <div class="content-wrapper">
         <div class="content-item files-list">
           <div class="header">
-            <span class="title">公共文件</span>
-            <div class="header-actions">
+            <span class="title">公共文件({{ pagination.total || 0 }})</span>
+            <a-space class="header-actions" size="small">
               <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
-              <a-button id="upload-file" icon="up-circle" type="dashed" size="small">上传</a-button>
-            </div>
+              <a-button
+                icon="delete"
+                type="default"
+                size="small"
+                @click="recycleModal.modalStatus = true"
+                >回收站</a-button
+              >
+              <a-button id="upload-file" icon="up-circle" type="primary" size="small"
+                >上传</a-button
+              >
+            </a-space>
           </div>
           <div class="list-content">
             <a-list :loading="loading">
@@ -36,14 +45,23 @@
                   </a-tooltip>
                 </span>
               </a-list-item>
-              <template v-if="files.length>0">
-                <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
+              <template v-if="files.length > 0">
+                <a-list-item
+                  class="list-item"
+                  :key="index"
+                  v-for="(item, index) in files"
+                >
                   <a-list-item-meta>
-                    <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
+                    <a-avatar
+                      slot="avatar"
+                      shape="square"
+                      icon="link"
+                      :src="item.file_url"
+                    />
                     <div slot="title">
                       <a-tooltip :mouseEnterDelay="0.3">
                         <template slot="title">
-                          <span>{{item.fullName}}</span>
+                          <span>{{ item.fullName }}</span>
                         </template>
                         <a-input
                           :ref="`inputTitle${index}`"
@@ -59,13 +77,18 @@
                           :href="item | showPreviewUrl"
                           :title="item.fullName"
                           v-show="!item.editing"
-                        >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
+                          >{{
+                            item.fullName.length > 30
+                              ? item.fullName.substr(0, 30) + "..."
+                              : item.fullName
+                          }}</a
+                        >
                       </a-tooltip>
                     </div>
                   </a-list-item-meta>
                   <div class="other-info muted">
                     <div class="info-item">
-                      <span>{{(formatSize(item.size))}}</span>
+                      <span>{{ formatSize(item.size) }}</span>
                     </div>
                     <div class="info-item">
                       <a-tooltip :title="item.create_time">
@@ -73,7 +96,7 @@
                       </a-tooltip>
                     </div>
                     <div class="info-item">
-                      <span>{{item.creatorName}}</span>
+                      <span>{{ item.creatorName }}</span>
                     </div>
                   </div>
                   <span slot="actions">
@@ -88,7 +111,7 @@
                                          <a-icon type="upload"/>
                                      </a-tooltip>
                   </span>-->
-                  <span slot="actions" @click="editFile(item,index)">
+                  <span slot="actions" @click="editFile(item, index)">
                     <a-tooltip title="编辑">
                       <a-icon type="edit" />
                     </a-tooltip>
@@ -106,7 +129,7 @@
                       <a-menu
                         class="field-right-menu"
                         v-clipboard="item.file_url"
-                        @click="doFile($event,item.code)"
+                        @click="doFile($event, item.code)"
                         slot="overlay"
                       >
                         <a-menu-item key="copy">
@@ -128,7 +151,12 @@
               <div
                 v-if="showLoadingMore"
                 slot="loadMore"
-                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+                :style="{
+                  textAlign: 'center',
+                  marginTop: '12px',
+                  height: '32px',
+                  lineHeight: '32px',
+                }"
               >
                 <a-spin v-if="loadingMore">
                   <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
@@ -139,11 +167,28 @@
           </div>
         </div>
       </div>
+      <!--回收站-->
+      <a-modal
+        class="recycle-bin-modal"
+        :width="800"
+        v-model="recycleModal.modalStatus"
+        :title="recycleModal.modalTitle"
+        :footer="null"
+      >
+        <recycle-bin
+          v-if="recycleModal.modalStatus"
+          :code="code"
+          :organization-code="organizationCode"
+          @update="getFiles"
+        ></recycle-bin>
+      </a-modal>
     </wrapper-content>
   </div>
 </template>
 
 <script>
+import RecycleBin from "@/components/project/recycleBin";
+
 import { mapState } from "vuex";
 import { checkResponse } from "../../assets/js/utils";
 import { relativelyTime } from "../../assets/js/dateTime";
@@ -153,6 +198,9 @@ import { notice } from "../../assets/js/notice";
 
 export default {
   name: "organization-files",
+  components: {
+    RecycleBin,
+  },
   mixins: [pagination],
   data() {
     return {
@@ -162,9 +210,13 @@ export default {
       loadingMore: false,
       currentFileIndex: {},
       files: [],
+      /*回收站*/
+      recycleModal: {
+        modalStatus: false,
+        modalTitle: "公共文件回收站",
+      },
     };
   },
-  components: {},
   computed: {
     ...mapState({
       uploader: (state) => state.common.uploader,
@@ -245,23 +297,21 @@ export default {
       });
       const fullName = `${file.title}.${file.extension}`;
       if (fullName != currentFile.fullName) {
-        edit({ title: currentFile.title, fileCode: currentFile.code }).then(
-          (res) => {
-            const result = checkResponse(res);
-            if (!result) {
-              return false;
-            }
-            currentFile.title = file.title;
-            currentFile.fullName = fullName;
-            notice(
-              {
-                title: "重命名成功",
-              },
-              "notice",
-              "success"
-            );
+        edit({ title: currentFile.title, fileCode: currentFile.code }).then((res) => {
+          const result = checkResponse(res);
+          if (!result) {
+            return false;
           }
-        );
+          currentFile.title = file.title;
+          currentFile.fullName = fullName;
+          notice(
+            {
+              title: "重命名成功",
+            },
+            "notice",
+            "success"
+          );
+        });
       }
     },
     doFile(action, fileCode) {
@@ -286,7 +336,7 @@ export default {
               notice(
                 {
                   title: "成功移到回收站",
-                  msg: "可在 菜单－查看回收站－文件 中查看",
+                  msg: "可在 本页回收站 中查看",
                 },
                 "notice",
                 "success",
diff --git a/src/views/members/index.vue b/src/views/members/index.vue
index e26843d..229e92b 100644
--- a/src/views/members/index.vue
+++ b/src/views/members/index.vue
@@ -17,30 +17,38 @@
         <div class="content-item muted">成员</div>
         <div class="menus">
           <a-menu mode="inline" v-model="selectedKeys" @click="getMembers">
-            <a-menu-item :key="index.toString()" v-for="(item,index) in menus">
+            <a-menu-item :key="index.toString()" v-for="(item, index) in menus">
               <a-icon :type="item.icon" />
-              <span>{{item.title}}</span>
+              <span>{{ item.title }}</span>
             </a-menu-item>
           </a-menu>
         </div>
         <div class="content-item muted">部门</div>
         <div class="actions content-item">
-          <a-dropdown :trigger="['click']" v-model="showCreateDepartment" placement="bottomCenter">
-            <a>
-              <a-icon :style="{fontSize: '14px'}" type="plus-circle" />创建部门
-            </a>
+          <a-dropdown
+            :trigger="['click']"
+            v-model="showCreateDepartment"
+            placement="bottomCenter"
+          >
+            <a> <a-icon :style="{ fontSize: '14px' }" type="plus-circle" />创建部门 </a>
             <div slot="overlay">
-              <create-department v-if="showCreateDepartment" @update="createDepartmentSuccess"></create-department>
+              <create-department
+                v-if="showCreateDepartment"
+                @update="createDepartmentSuccess"
+              ></create-department>
             </div>
           </a-dropdown>
-          <a>
-            <a-icon type="bars" />部门排序*
-          </a>
+          <a> <a-icon type="bars" />部门排序* </a>
         </div>
         <div class="content-item department">
           <a-spin :spinning="departmentLoading">
-            <a-tree :loadData="onLoadData" :treeData="treeData" showIcon @select="onSelect">
-              <template slot="custom" slot-scope="{selected}">
+            <a-tree
+              :loadData="onLoadData"
+              :treeData="treeData"
+              showIcon
+              @select="onSelect"
+            >
+              <template slot="custom" slot-scope="{ selected }">
                 <a-icon type="bulb" />
               </template>
             </a-tree>
@@ -52,7 +60,7 @@
     <div class="layout-item right">
       <div class="header">
         <div class="title">
-          <span>{{currentMenu.title}} · {{pagination.total}}</span>
+          <span>{{ currentMenu.title }} · {{ pagination.total }}</span>
         </div>
         <div class="actions">
           <!-- <a>
@@ -61,9 +69,7 @@
           </a>-->
 
           <a-dropdown :trigger="['click']" placement="bottomCenter">
-            <a class="ant-dropdown-link" href="#">
-              <a-icon type="user-add" />添加成员
-            </a>
+            <a class="ant-dropdown-link" href="#"> <a-icon type="user-add" />添加成员 </a>
             <a-menu slot="overlay">
               <a-menu-item>
                 <a href="javascript:;" @click="showInviteMember = true">
@@ -85,7 +91,11 @@
                   :headers="headers"
                   @change="handleChange"
                 >
-                  <a class="text-default" :loading="uploadLoading" :disabled="uploadLoading">
+                  <a
+                    class="text-default"
+                    :loading="uploadLoading"
+                    :disabled="uploadLoading"
+                  >
                     <a-icon type="upload" v-show="!uploadLoading" />上传文件批量导入成员
                   </a>
                 </a-upload>
@@ -99,7 +109,7 @@
               placement="bottomCenter"
             >
               <a>
-                <a-icon :style="{fontSize: '14px'}" type="plus-circle" />创建子部门
+                <a-icon :style="{ fontSize: '14px' }" type="plus-circle" />创建子部门
               </a>
               <div slot="overlay">
                 <create-department
@@ -109,10 +119,12 @@
                 ></create-department>
               </div>
             </a-dropdown>
-            <a-dropdown :trigger="['click']" v-model="showEditDepartment" placement="bottomCenter">
-              <a>
-                <a-icon :style="{fontSize: '14px'}" type="edit" />编辑部门
-              </a>
+            <a-dropdown
+              :trigger="['click']"
+              v-model="showEditDepartment"
+              placement="bottomCenter"
+            >
+              <a> <a-icon :style="{ fontSize: '14px' }" type="edit" />编辑部门 </a>
               <div slot="overlay">
                 <create-department
                   v-if="showEditDepartment"
@@ -122,7 +134,7 @@
               </div>
             </a-dropdown>
             <a @click="deleteDepartment">
-              <a-icon :style="{fontSize: '14px'}" type="delete" />删除部门
+              <a-icon :style="{ fontSize: '14px' }" type="delete" />删除部门
             </a>
           </template>
         </div>
@@ -133,7 +145,12 @@
             <div
               v-if="showLoadingMore"
               slot="loadMore"
-              :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+              :style="{
+                textAlign: 'center',
+                marginTop: '12px',
+                height: '32px',
+                lineHeight: '32px',
+              }"
             >
               <!--                            <a-spin v-if="loadingMore"/>-->
               <a-button @click="onLoadMore">加载更多</a-button>
@@ -143,15 +160,14 @@
                 <a-avatar slot="avatar" :src="item.avatar" />
                 <div slot="title">
                   <router-link :to="`/members/profile/${item.code}`" class="text-default">
-                    {{ item.name
-                    }}
+                    {{ item.name }}
                   </router-link>
                   <a-tag class="m-l-sm" v-if="item.is_owner">拥有者</a-tag>
                 </div>
                 <div slot="description">
                   <!--<a-tooltip :mouseEnterDelay="0.3" :title="item.create_time">-->
                   <span>
-                    {{item.email}}
+                    {{ item.email }}
                     <span v-if="item.departments">- {{ item.departments }}</span>
                   </span>
                   <!--</a-tooltip>-->
@@ -162,7 +178,7 @@
                   class="muted"
                   slot="actions"
                   v-if="item.status == 0"
-                  @click="resumeAccount(item,index)"
+                  @click="resumeAccount(item, index)"
                 >
                   <a-tooltip title="启用账号">
                     <a-icon type="check-circle" />
@@ -172,13 +188,13 @@
                   class="muted"
                   slot="actions"
                   v-if="item.status == 1"
-                  @click="forbidAccount(item,index)"
+                  @click="forbidAccount(item, index)"
                 >
                   <a-tooltip title="停用账号">
                     <a-icon type="stop" />
                   </a-tooltip>
                 </a>
-                <a class="muted" slot="actions" @click="deleteAccount(item,index)">
+                <a class="muted" slot="actions" @click="deleteAccount(item, index)">
                   <a-tooltip :title="`从${actionTitle}内移除`">
                     <a-icon type="user-delete" />
                   </a-tooltip>
@@ -353,25 +369,23 @@ export default {
     },
     onLoadData(treeNode) {
       return new Promise((resolve) => {
-        list({ page: 1, pageSize: 100, pcode: treeNode.dataRef.key }).then(
-          (res) => {
-            let list = [];
-            if (res.data.list.length) {
-              res.data.list.forEach((v) => {
-                list.push({
-                  key: v.code,
-                  title: v.name,
-                  isLeaf: !v.hasNext,
-                  scopedSlots: { icon: "custom" },
-                });
+        list({ page: 1, pageSize: 100, pcode: treeNode.dataRef.key }).then((res) => {
+          let list = [];
+          if (res.data.list.length) {
+            res.data.list.forEach((v) => {
+              list.push({
+                key: v.code,
+                title: v.name,
+                isLeaf: !v.hasNext,
+                scopedSlots: { icon: "custom" },
               });
-            }
-            treeNode.dataRef.isLeaf = !list.length > 0;
-            treeNode.dataRef.children = list;
-            this.treeData = [...this.treeData];
-            resolve();
+            });
           }
-        );
+          treeNode.dataRef.isLeaf = !list.length > 0;
+          treeNode.dataRef.children = list;
+          this.treeData = [...this.treeData];
+          resolve();
+        });
       });
     },
     createDepartmentSuccess(data) {
@@ -539,6 +553,8 @@ export default {
   .left {
     padding: 12px 24px 12px 0;
     width: 280px;
+    border-top-left-radius: 1.4rem;
+    border-bottom-left-radius: 1.4rem;
 
     .left-content {
       width: 255px;
@@ -620,7 +636,8 @@ export default {
 
   .right {
     padding: 24px 12px 12px 0;
-
+    border-top-right-radius: 1.4rem;
+    border-bottom-right-radius: 1.4rem;
     .header {
       padding-right: 12px;
       display: flex;
diff --git a/src/views/project/calendar/index.vue b/src/views/project/calendar/index.vue
new file mode 100644
index 0000000..2079c5b
--- /dev/null
+++ b/src/views/project/calendar/index.vue
@@ -0,0 +1,370 @@
+<template>
+  <div class="calendar-index">
+    <wrapper-content class="page-wrapper" :showHeader="false">
+      <div class="tools">
+        <project-select
+          class="nav-title"
+          style="display: inline-block"
+          :code="code"
+          :rettype="true"
+          @change-project="changeProject"
+        ></project-select>
+
+        <a-popover placement="bottomRight" trigger="click">
+          <div slot="content" style="max-width: 200px">
+            <p>
+              时间轴:
+              <a-switch
+                size="small"
+                default-checked
+                :checked-children="true"
+                unchecked-children="false"
+                @click="ganttChart.hideTimeaxis = !ganttChart.hideTimeaxis"
+              />
+            </p>
+            <p>
+              重叠:
+              <a-switch
+                size="small"
+                default-checked
+                :checked-children="true"
+                unchecked-children="false"
+                @click="ganttChart.pushOnOverlap = !ganttChart.pushOnOverlap"
+              />
+            </p>
+            <p>
+              表格线:
+              <a-switch
+                size="small"
+                default-checked
+                :checked-children="true"
+                unchecked-children="false"
+                @click="ganttChart.grid = !ganttChart.grid"
+              />
+            </p>
+            <p>
+              悬停突出:
+              <a-switch
+                size="small"
+                default-checked
+                :checked-children="true"
+                unchecked-children="false"
+                @click="ganttChart.highlightedHours = !ganttChart.highlightedHours"
+              />
+            </p>
+            <p>
+              行高:
+              <a-slider
+                :default-value="40"
+                v-model="ganttChart.rowHeight"
+                :min="10"
+                :max="200"
+              />
+            </p>
+            <p>
+              行标题宽:
+              <a-slider
+                :default-value="6"
+                v-model="ganttChart.rowLabelWidth"
+                :min="1"
+                :max="1000"
+              />
+            </p>
+            <p>
+              时间标记偏移:
+              <a-slider
+                :default-value="0"
+                v-model="ganttChart.timemarkerOffset"
+                :min="0"
+                :max="200"
+              />
+            </p>
+            <p>
+              整体大小:
+              <a-slider v-model="ganttChart.width" :min="100" :max="100000" />
+            </p>
+            <p>
+              主题:
+              <a-select
+                size="small"
+                default-value="default"
+                v-model="ganttChart.selectedTheme"
+              >
+                <a-select-option
+                  :value="theme.value"
+                  v-for="theme in ganttChart.themes"
+                  :key="'setting-theme-' + theme.value"
+                  >{{ theme.name }}</a-select-option
+                >
+              </a-select>
+            </p>
+            <!-- <p>
+              时间显示:
+              <a-select
+                size="small"
+                :default-value="[...Array(24).keys()]"
+                mode="multiple"
+                v-model="ganttChart.hours"
+              >
+                <a-select-option
+                  :value="hour"
+                  v-for="hour in [...Array(24).keys()]"
+                  :key="'setting-hour-' + hour"
+                  >{{ hour }}</a-select-option
+                >
+              </a-select>
+            </p> -->
+            <p>
+              时间高亮:
+              <a-select
+                size="small"
+                :default-value="[0, 18]"
+                mode="multiple"
+                v-model="ganttChart.highlightedHours"
+              >
+                <a-select-option
+                  :value="hour"
+                  v-for="hour in ganttChart.hours"
+                  :key="'setting-hours-' + hour"
+                  >{{ hour }}</a-select-option
+                >
+              </a-select>
+            </p>
+          </div>
+          <template slot="title">
+            <span>设置</span>
+          </template>
+          <a-button size="small" type="default" shape="circle" icon="setting"></a-button>
+        </a-popover>
+      </div>
+      <!--  :themeColors="'#f00'" -->
+      <div class="calendar-layout">
+        <g-gantt-chart
+          class="calendar-view"
+          :style="{ width: `${ganttChart.width}px` }"
+          :chartWidth="ganttChart.width"
+          :chart-start="ganttChart.start"
+          :chart-end="ganttChart.end"
+          locale="zh-cn"
+          :timemarkerOffset="ganttChart.timemarkerOffset"
+          :grid="ganttChart.grid"
+          :hours="ganttChart.hours"
+          :hide-timeaxis="ganttChart.hideTimeaxis"
+          :push-on-overlap="ganttChart.pushOnOverlap"
+          :highlighted-hours="ganttChart.highlightedHours"
+          :row-label-width="`${ganttChart.rowLabelWidth}px`"
+          :row-height="ganttChart.rowHeight"
+          :theme="ganttChart.selectedTheme"
+          @mousedown-bar="onMousedownBar($event)"
+          @contextmenu-bar="onContextmenuBar($event)"
+          @dragend-bar="stoppedDraggingBar($event)"
+        >
+          <g-gantt-row
+            class="calendar-row"
+            :highlight-on-hover="ganttChart.highlightOnHover"
+            v-for="row in rowList"
+            :key="row.label"
+            :label="row.label"
+            :bars="row.barList"
+            bar-start="myStart"
+            bar-end="myEnd"
+          >
+            <template #bar-label="{ bar }">
+              <div class="calendar-row-babel">{{ bar.label }}</div>
+            </template>
+          </g-gantt-row>
+        </g-gantt-chart>
+      </div>
+    </wrapper-content>
+  </div>
+</template>
+<script>
+import { mapState } from "vuex";
+import projectSelect from "@/components/project/projectSelect";
+import { GGanttChart, GGanttRow } from "vue-ganttastic";
+import pagination from "@/mixins/pagination";
+import { list, getListByTaskTag } from "../../../api/task";
+import { tasks as getTasks } from "../../../api/taskStages";
+import { randomColor } from "../../../utils/utils";
+
+const taskList = [];
+
+export default {
+  components: {
+    projectSelect,
+    GGanttChart,
+    GGanttRow,
+  },
+  mixins: [pagination],
+  data() {
+    return {
+      code: "",
+      loading: false,
+      ganttChart: {
+        width: 14900,
+        start: this.$moment().startOf("week").format("YYYY-MM-DD HH:mm:ss"),
+        end: this.$moment().startOf("week").add("day", 7).format("YYYY-MM-DD HH:mm:ss"), //this.$moment().endOf("week").format("YYYY-MM-DD HH:mm:ss"),
+        pushOnOverlap: false,
+        grid: true,
+        rowHeight: 40,
+        rowLabelWidth: 50,
+        hideTimeaxis: false,
+        highlightOnHover: false,
+        hours: [...Array(24).keys()],
+        highlightedHours: [0, 18],
+        showContextmenu: false,
+        timemarkerOffset: 0,
+        contextmenuTimeout: null,
+        contextmenuX: 0,
+        contextmenuY: 0,
+        selectedTheme: "default",
+        themes: [
+          { name: "默认主题", value: "default" },
+          { name: "深色主题", value: "dark" },
+          { name: "蓝色主题", value: "material-blue" },
+          { name: "温馨主题", value: "creamy" },
+          { name: "天空主题", value: "sky" },
+          { name: "slumber", value: "slumber" },
+          { name: "crimson", value: "crimson" },
+          { name: "grove", value: "grove" },
+          { name: "fuchsia", value: "fuchsia" },
+          { name: "flare", value: "flare" },
+          { name: "vue", value: "vue" },
+        ],
+      },
+      rowList: [],
+    };
+  },
+  computed: {
+    ...mapState({
+      userInfo: (state) => state.userInfo,
+    }),
+  },
+  created() {
+    this.init();
+  },
+  methods: {
+    init(reset = true) {
+      if (reset) {
+        this.pagination.page = 1;
+        this.pagination.pageSize = 10;
+      }
+    },
+    changeProject(code) {
+      this.code = code;
+
+      list({
+        projectCode: this.code,
+        //stageCode: "azfhobi08vucpj7dr25n91sl",
+        //createTime: [this.ganttChart.start, this.ganttChart.end],
+        beginTime: this.ganttChart.start,
+        endTime: this.ganttChart.end,
+      }).then((res) => {
+        if (res.data.total > 0) {
+          this.rowList = res.data.list
+            .map((task, index) => {
+              if (task.begin_time && task.end_time) {
+                let color = randomColor(2);
+                return {
+                  label: `Row-${task.id}`,
+                  barList: [
+                    {
+                      myStart: task.begin_time || task.create_time,
+                      myEnd: task.end_time,
+                      label: task.name + " - " + task.executor.name,
+                      project_code: task.project_code,
+                      code: task.code,
+                      id: task.id,
+                      ganttBarConfig: {
+                        color: color,
+                        backgroundColor: color,
+                        bundle: "groveBundle",
+                        opacity: 1,
+                        immobile: true,
+                        handles: false, //缩放
+                        borderRadius: 20,
+                      },
+                    },
+                  ],
+                };
+              }
+            })
+            .filter((e) => e);
+        } else {
+          this.rowList = [];
+        }
+      });
+    },
+    onMousedownBar({ bar }) {
+      window.open(
+        `/#/project/space/task/${bar.project_code}/detail/${bar.code}`,
+        "_blank"
+      );
+    },
+    stoppedDraggingBar() {},
+    onContextmenuBar(e) {
+      e.event.preventDefault();
+      this.contextmenuY = e.event.clientY;
+      this.contextmenuX = e.event.clientX;
+      this.showContextmenu = true;
+      if (this.contextmenuTimeout) {
+        clearTimeout(this.contextmenuTimeout);
+      }
+      this.contextmenuTimeout = setTimeout(() => (this.showContextmenu = false), 3000);
+    },
+  },
+};
+</script>
+<style lang="less">
+.g-gantt-bar {
+  &:hover {
+    filter: brightness(1.1);
+  }
+}
+</style>
+
+<style lang="less" scoped>
+.calendar-index {
+  .page-wrapper {
+    .tools {
+      margin: 0 0 1rem 0;
+      display: flex;
+      justify-content: space-between;
+      align-items: stretch;
+    }
+    .calendar-layout {
+      overflow: auto;
+      position: relative;
+      #g-timeaxis {
+        box-shadow: 0px 1px 3px 2px rgb(234 234 234 / 66%);
+      }
+      #g-timeaxis-marker {
+        width: 2px;
+        background: rgb(0 0 0 / 50%);
+      }
+      .g-gantt-row > .g-gantt-row-bars-container {
+        width: 80%;
+      }
+      .calendar-view {
+        position: relative;
+        /* width: max-content; */
+        min-width: 100%;
+        .calendar-row {
+          position: relative;
+          .calendar-row-babel {
+            filter: invert(1) brightness(1.4);
+            color: inherit;
+            white-space: normal;
+            font-size: 50%;
+          }
+
+          .g-gantt-bar-label > * {
+            overflow: initial;
+            text-overflow: unset;
+          }
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/views/project/space/files.vue b/src/views/project/space/files.vue
index bce3909..2504eae 100644
--- a/src/views/project/space/files.vue
+++ b/src/views/project/space/files.vue
@@ -4,12 +4,14 @@
       <a-col class="project-nav-header" :span="8" :xs="24" :sm="10" :md="8" :lg="8">
         <a-breadcrumb>
           <a-breadcrumb-item>
-            <a @click="toHome">
-              <a-icon type="home" />首页
-            </a>
+            <a @click="toHome"> <a-icon type="home" />首页 </a>
           </a-breadcrumb-item>
           <a-breadcrumb-item>
-            <project-select class="nav-title" style="display: inline-block" :code="code"></project-select>
+            <project-select
+              class="nav-title"
+              style="display: inline-block"
+              :code="code"
+            ></project-select>
             <span class="actions">
               <a-tooltip
                 :mouseEnterDelay="0.3"
@@ -19,13 +21,13 @@
                 <a-icon
                   type="star"
                   theme="filled"
-                  style="color: grey;"
+                  style="color: grey"
                   v-show="!project.collected"
                 />
                 <a-icon
                   type="star"
                   theme="filled"
-                  style="color: #ffaf38;"
+                  style="color: #ffaf38"
                   v-show="project.collected"
                 />
               </a-tooltip>
@@ -38,10 +40,24 @@
       </a-col>
       <a-col class="nav-body" :span="8" :xs="24" :sm="14" :md="8" :lg="8">
         <ul class="nav-wrapper nav nav-underscore">
-          <li class data-app="tasks" @click="$router.push('/project/space/task/' + code)">任务</li>
+          <li class data-app="tasks" @click="$router.push('/project/space/task/' + code)">
+            任务
+          </li>
           <li class="actives" data-app="works" @click="getFiles">文件</li>
-          <li class data-app="build" @click="$router.push('/project/space/overview/' + code)">概览</li>
-          <li class data-app="build" @click="$router.push('/project/space/features/' + code)">版本</li>
+          <li
+            class
+            data-app="build"
+            @click="$router.push('/project/space/overview/' + code)"
+          >
+            概览
+          </li>
+          <li
+            class
+            data-app="build"
+            @click="$router.push('/project/space/features/' + code)"
+          >
+            版本
+          </li>
         </ul>
       </a-col>
     </a-row>
@@ -49,11 +65,20 @@
       <div class="content-wrapper">
         <div class="content-item files-list">
           <div class="header">
-            <span class="title">项目文件</span>
-            <div class="header-actions">
+            <span class="title">项目文件({{ pagination.total }})</span>
+            <a-space class="header-actions" size="small">
               <!--<a><a-icon type="upload"></a-icon> 上传文件</a>-->
-              <a-button id="upload-file" icon="up-circle" type="dashed" size="small">上传</a-button>
-            </div>
+              <a-button
+                icon="delete"
+                type="default"
+                size="small"
+                @click="recycleModal.modalStatus = true"
+                >回收站</a-button
+              >
+              <a-button id="upload-file" icon="up-circle" type="primary" size="small"
+                >上传</a-button
+              >
+            </a-space>
           </div>
           <div class="list-content">
             <a-list :loading="loading">
@@ -81,14 +106,23 @@
                   </a-tooltip>
                 </span>
               </a-list-item>
-              <template v-if="files.length>0">
-                <a-list-item class="list-item" :key="index" v-for="(item, index) in files">
+              <template v-if="files.length > 0">
+                <a-list-item
+                  class="list-item"
+                  :key="index"
+                  v-for="(item, index) in files"
+                >
                   <a-list-item-meta>
-                    <a-avatar slot="avatar" shape="square" icon="link" :src="item.file_url" />
+                    <a-avatar
+                      slot="avatar"
+                      shape="square"
+                      icon="link"
+                      :src="item.file_url"
+                    />
                     <div slot="title">
                       <a-tooltip :mouseEnterDelay="0.3">
                         <template slot="title">
-                          <span>{{item.fullName}}</span>
+                          <span>{{ item.fullName }}</span>
                         </template>
                         <a-input
                           :ref="`inputTitle${index}`"
@@ -104,13 +138,18 @@
                           :href="item | showPreviewUrl"
                           :title="item.fullName"
                           v-show="!item.editing"
-                        >{{item.fullName.length>30?item.fullName.substr(0,30)+'...':item.fullName}}</a>
+                          >{{
+                            item.fullName.length > 30
+                              ? item.fullName.substr(0, 30) + "..."
+                              : item.fullName
+                          }}</a
+                        >
                       </a-tooltip>
                     </div>
                   </a-list-item-meta>
                   <div class="other-info muted">
                     <div class="info-item">
-                      <span>{{(formatSize(item.size))}}</span>
+                      <span>{{ formatSize(item.size) }}</span>
                     </div>
                     <div class="info-item">
                       <a-tooltip :title="item.create_time">
@@ -118,7 +157,7 @@
                       </a-tooltip>
                     </div>
                     <div class="info-item">
-                      <span>{{item.creatorName}}</span>
+                      <span>{{ item.creatorName }}</span>
                     </div>
                   </div>
                   <span slot="actions">
@@ -133,7 +172,7 @@
                                          <a-icon type="upload"/>
                                      </a-tooltip>
                   </span>-->
-                  <span slot="actions" @click="editFile(item,index)">
+                  <span slot="actions" @click="editFile(item, index)">
                     <a-tooltip title="编辑">
                       <a-icon type="edit" />
                     </a-tooltip>
@@ -151,7 +190,7 @@
                       <a-menu
                         class="field-right-menu"
                         v-clipboard="item.file_url"
-                        @click="doFile($event,item.code)"
+                        @click="doFile($event, item.code)"
                         slot="overlay"
                       >
                         <a-menu-item key="copy">
@@ -173,7 +212,12 @@
               <div
                 v-if="showLoadingMore"
                 slot="loadMore"
-                :style="{ textAlign: 'center', marginTop: '12px', height: '32px', lineHeight: '32px' }"
+                :style="{
+                  textAlign: 'center',
+                  marginTop: '12px',
+                  height: '32px',
+                  lineHeight: '32px',
+                }"
               >
                 <a-spin v-if="loadingMore">
                   <a-icon slot="indicator" type="loading" style="font-size: 2rem" spin />
@@ -184,11 +228,27 @@
           </div>
         </div>
       </div>
+
+      <!--回收站-->
+      <a-modal
+        class="recycle-bin-modal"
+        :width="800"
+        v-model="recycleModal.modalStatus"
+        :title="recycleModal.modalTitle"
+        :footer="null"
+      >
+        <recycle-bin
+          v-if="recycleModal.modalStatus"
+          :code="code"
+          @update="getFiles"
+        ></recycle-bin>
+      </a-modal>
     </wrapper-content>
   </div>
 </template>
 
 <script>
+import RecycleBin from "@/components/project/recycleBin";
 import { mapState } from "vuex";
 import { read as getProject } from "../../../api/project";
 import { collect } from "../../../api/projectCollect";
@@ -211,9 +271,15 @@ export default {
       project: { task_board_theme: "simple" },
       currentFileIndex: {},
       files: [],
+      /*回收站*/
+      recycleModal: {
+        modalStatus: false,
+        modalTitle: "项目回收站",
+      },
     };
   },
   components: {
+    RecycleBin,
     projectSelect,
   },
   computed: {
@@ -226,9 +292,7 @@ export default {
       handler(newVal, oldVal) {
         //监听是否有上传文件行为
         const files = newVal.fileList;
-        const index = files.findIndex(
-          (item) => item.projectName == this.project.name
-        );
+        const index = files.findIndex((item) => item.projectName == this.project.name);
         if (index !== -1) {
           this.getFiles();
         }
@@ -311,23 +375,21 @@ export default {
       });
       const fullName = `${file.title}.${file.extension}`;
       if (fullName != currentFile.fullName) {
-        edit({ title: currentFile.title, fileCode: currentFile.code }).then(
-          (res) => {
-            const result = checkResponse(res);
-            if (!result) {
-              return false;
-            }
-            currentFile.title = file.title;
-            currentFile.fullName = fullName;
-            notice(
-              {
-                title: "重命名成功",
-              },
-              "notice",
-              "success"
-            );
+        edit({ title: currentFile.title, fileCode: currentFile.code }).then((res) => {
+          const result = checkResponse(res);
+          if (!result) {
+            return false;
           }
-        );
+          currentFile.title = file.title;
+          currentFile.fullName = fullName;
+          notice(
+            {
+              title: "重命名成功",
+            },
+            "notice",
+            "success"
+          );
+        });
       }
     },
     doFile(action, fileCode) {
diff --git a/src/views/project/space/task.vue b/src/views/project/space/task.vue
index 50777f5..88630bf 100644
--- a/src/views/project/space/task.vue
+++ b/src/views/project/space/task.vue
@@ -771,7 +771,7 @@ export default {
       /*回收站*/
       recycleModal: {
         modalStatus: false,
-        modalTitle: "查看回收站",
+        modalTitle: "项目回收站",
       },
       /*任务标签*/
       taskTagModal: {
-- 
Gitee


From a5f34f9dd326c6693a4cdaa8384bdef96ca353d3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=B0=8F=E6=9E=97=E5=9B=9D?= <dong@linyudong.cn>
Date: Fri, 30 Jul 2021 13:02:11 +0800
Subject: [PATCH 8/8] =?UTF-8?q?v2.9.1=20=E5=A2=9E=E5=8A=A0=E5=B7=A5?=
 =?UTF-8?q?=E6=97=B6=E5=B0=8F=E6=95=B0=E7=82=B9=E6=98=BE=E7=A4=BA;=20?=
 =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E9=80=89=E6=8B=A9=E5=99=A8=E7=BB=84=E4=BB=B6?=
 =?UTF-8?q?=E5=AE=8C=E5=96=84=E5=86=85=E9=83=A8=E8=B0=83=E7=94=A8;=20?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E5=85=AC=E5=85=B1=E6=96=87=E4=BB=B6=E5=8C=BA?=
 =?UTF-8?q?=E5=9B=9E=E6=94=B6=E7=AB=99;=20=E5=A2=9E=E5=8A=A0=E6=96=87?=
 =?UTF-8?q?=E4=BB=B6=E5=BD=BB=E5=BA=95=E5=88=A0=E9=99=A4;=20=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E4=BF=AE=E5=A4=8D=E4=B8=80=E4=BA=9B=E4=B8=9C=E8=A5=BF?=
 =?UTF-8?q?=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 package.json          | 2 +-
 src/config/version.js | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/package.json b/package.json
index 80062d3..e6990aa 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pear-project",
-  "version": "2.8.1",
+  "version": "2.9.1",
   "private": true,
   "scripts": {
     "serve": "vue-cli-service serve",
diff --git a/src/config/version.js b/src/config/version.js
index 004129f..7696a66 100644
--- a/src/config/version.js
+++ b/src/config/version.js
@@ -16,4 +16,8 @@ ALTER TABLE `pear_project` MODIFY COLUMN `auto_update_schedule` tinyint(1) NULL
 UPDATE `projectdb`.`pear_project` SET `auto_update_schedule`=1;
 UPDATE `projectdb`.`pear_project` SET `open_begin_time`=1;
 
+5. 增加文件物理删除
+ALTER TABLE `pear_project_log` ADD COLUMN `file_code` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT '' COMMENT '文件id' AFTER `is_robot`;
+
+
 */
\ No newline at end of file
-- 
Gitee