ui md-01

src/assets/styles/base.less

@@ -97,7 +97,7 @@ select {
 }
 ::-webkit-scrollbar-thumb {
   border-radius: 8px;
-  background: @gray;
+  background: @dark-color-lighter;
 }
 ::-webkit-scrollbar-corner {
   background: transparent;
@@ -111,23 +111,24 @@ body {
     "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
-  font-size: @fontSize;
-  color: @fontMain;
+  font-size: @font-size-base;
+  color: @font-color-main;
+  background-color: @background-color;
 }
 
 /* part */
 .part-box {
-  box-shadow: 0 0 2px 1px #e9e9e9;
-  padding: 20px 30px;
-  margin-bottom: 15px;
-  background-color: #fff;
+  padding: 20px;
+  margin-bottom: 20px;
+  background-color: @white;
+  border-radius: @box-border-radius;
 
   .ivu-form-item-label {
     text-align: right;
   }
 
   &-head {
-    margin-bottom: 15px;
+    margin-bottom: 10px;
     overflow: hidden;
     &-left {
       float: left;
@@ -164,7 +165,7 @@ body {
 .part-none {
   padding: 100px;
   font-size: 20px;
-  color: @gray;
+  color: @dark-color-lighter;
   text-align: center;
 }
 .part-box-top {
@@ -196,24 +197,24 @@ body {
   padding: 8px;
   line-height: 20px;
   letter-spacing: 1px;
-  border: 1px solid @shadowGray;
+  border: 1px solid @border-color-split;
 }
 .table td {
   padding: 8px;
   line-height: 20px;
-  border: 1px solid @shadowGray;
+  border: 1px solid @border-color-split;
 }
 .table .td-th {
   font-weight: 600;
-  color: @dark;
+  color: @dark-color;
 }
 tr.row-active td {
-  color: @mainColor;
+  color: @main-color;
 }
 tr.tr-tips-error td {
   padding: 2px 10px;
   font-size: 13px;
-  color: @pink;
+  color: @error-color;
 }
 
 /* list */
@@ -279,11 +280,21 @@ h3.account-title {
   font-size: 14px;
   height: 25px;
   line-height: 25px;
-  color: @gray;
+  color: @dark-color-lighter;
 }
 .tips-error {
-  color: @pink;
+  color: @error-color;
 }
 .text-center {
   text-align: center;
 }
+
+// border-randius
+.border-radius {
+  &-small {
+    border-radius: @box-border-radius-small;
+  }
+  &-large {
+    border-radius: @box-border-radius-large;
+  }
+}

src/assets/styles/common-component.less

@@ -32,7 +32,7 @@
     cursor: pointer;
 
     &:hover {
-      color: @pink;
+      color: @error-color;
     }
   }
   &-body {
@@ -125,7 +125,7 @@
     top: 50%;
     left: 50%;
     margin: -30px 0 0 -30px;
-    color: @mainColor;
+    color: @main-color;
     font-size: 50px;
     text-align: center;
     line-height: 60px;
@@ -248,7 +248,7 @@
     padding: 10px 0;
     font-size: 14px;
     a:hover {
-      color: @mainColor;
+      color: @main-color;
     }
   }
 }
@@ -274,9 +274,9 @@
 // tips
 .cc-tips {
   &-success {
-    color: @mainColor;
+    color: @main-color;
   }
   &-error {
-    color: @pink;
+    color: @error-color;
   }
 }

src/assets/styles/home.less

@@ -8,16 +8,16 @@
 .home-body {
   position: absolute;
   left: 0;
-  top: 50px;
+  top: 64px;
   right: 0;
   bottom: 0;
   overflow: auto;
-  background: @background;
+  background: @background-color;
   z-index: 98;
 }
 .home-main {
   position: relative;
-  padding: 20px 20px 60px;
+  padding: 32px;
   min-height: 100%;
 
   &-nofooter {
@@ -29,92 +29,119 @@
 .home-footer {
   position: absolute;
   width: 100%;
-  height: 60px;
+  height: 32px;
   bottom: 0;
   left: 0;
   z-index: auto;
-  padding: 20px 0;
-  line-height: 20px;
-  color: @gray;
+  line-height: 32px;
+  border-radius: 16px 16px 0 0;
+  color: @dark-color-lighter;
+  background-color: @white;
   text-align: center;
-  font-size: 13px;
-}
-.home-footer a {
-  color: @midDark;
-}
-.home-footer a:hover {
-  color: @dark;
+  font-size: 12px;
+  a {
+    color: @dark-color-light;
+    &:hover {
+      color: @dark-color;
+    }
+  }
 }
 
 /* head */
-.home-header {
+.view-header {
   position: absolute;
   width: 100%;
-  height: 50px;
   top: 0;
   left: 0;
   z-index: 100;
   background: #fff;
-  box-shadow: 0 0 1px 0 @shadowGray;
-}
-.head-logo {
-  float: left;
-  width: 200px;
-  height: 50px;
-  padding: 10px 0;
-  line-height: 30px;
-  color: #fff;
-  background: @pink;
-  font-size: 20px;
-  text-align: center;
-  cursor: pointer;
-}
+  border-radius: 0px 0px 20px 20px;
 
-.head-info {
-  margin: 0 150px 0 210px;
-}
-.head-user {
-  float: right;
-  height: 50px;
-  padding: 10px 20px 10px 10px;
-  line-height: 30px;
-  color: @midDark;
-}
-.head-user span {
-  display: inline-block;
-  vertical-align: middle;
-  margin-left: 10px;
-  font-weight: 600;
-  cursor: pointer;
-}
-.user-logout i {
-  vertical-align: middle;
-  margin-top: -5px;
+  .head-main {
+    height: 64px;
+  }
+  .head-logo {
+    float: left;
+    padding: 18px 0 18px 32px;
+    line-height: 28px;
+    color: @font-color-main;
+    font-size: 20px;
+    cursor: pointer;
+  }
+  .head-nav {
+    margin: 0 150px 0 190px;
+  }
+  .head-user {
+    float: right;
+    height: 50px;
+    padding: 16px 32px 16px 10px;
+    line-height: 32px;
+    color: @dark-color-light;
+    span {
+      display: inline-block;
+      vertical-align: middle;
+      margin-left: 10px;
+      padding: 0 10px;
+      font-weight: 600;
+      background: @background-color;
+      border-radius: 16px;
+      cursor: pointer;
+    }
+  }
+  .user-name {
+    > i {
+      color: #bec3d1;
+    }
+  }
+  .user-logout {
+    i {
+      vertical-align: middle;
+      margin-top: -3px;
+    }
+
+    &:hover {
+      background-color: shade(@background-color, 5%);
+    }
+  }
+
+  .head-sub {
+    border-top: 1px solid @background-color;
+    height: 60px;
+    line-height: 59px;
+    text-align: center;
+  }
 }
-.user-logout:hover {
-  color: @pink;
+
+.view-header-sub + .home-body {
+  top: 124px;
 }
+
 /* navs */
 .home-navs {
   font-size: 0;
   overflow-x: auto;
   overflow-y: hidden;
+  color: @dark-color-light;
   ul {
     word-wrap: none;
   }
   li {
     display: inline-block;
     vertical-align: top;
-    font-size: 15px;
-    padding: 15px;
-    line-height: 20px;
+    font-size: 14px;
+    padding: 0 16px;
     cursor: pointer;
 
+    > i {
+      margin-right: 8px;
+      margin-top: -2px;
+    }
+
     &.act {
-      background: @background;
+      color: @main-color;
     }
     &:hover {
-      color: @mainColor;
+      color: @main-color;
     }
   }
 }

src/assets/styles/icons.less

@@ -0,0 +1,130 @@
+/* icon */
+.icon {
+  width: 16px;
+  height: 16px;
+  display: inline-block;
+  vertical-align: middle;
+  background-size: 100% 100%;
+  &.ivu-icon {
+    &-analysis {
+      background-image: url(../images/icon-analysis.png);
+    }
+    &-analysis-act {
+      background-image: url(../images/icon-analysis-act.png);
+    }
+    &-files {
+      background-image: url(../images/icon-files.png);
+    }
+    &-files-act {
+      background-image: url(../images/icon-files-act.png);
+    }
+    &-grade-set {
+      background-image: url(../images/icon-grade-set.png);
+    }
+    &-grade-set-act {
+      background-image: url(../images/icon-grade-set-act.png);
+    }
+    &-group {
+      background-image: url(../images/icon-group.png);
+    }
+    &-group-act {
+      background-image: url(../images/icon-group-act.png);
+    }
+    &-monitor {
+      background-image: url(../images/icon-monitor.png);
+    }
+    &-monitor-act {
+      background-image: url(../images/icon-monitor-act.png);
+    }
+    &-overview {
+      background-image: url(../images/icon-overview.png);
+    }
+    &-overview-act {
+      background-image: url(../images/icon-overview-act.png);
+    }
+    &-paper {
+      background-image: url(../images/icon-paper.png);
+    }
+    &-paper-act {
+      background-image: url(../images/icon-paper-act.png);
+    }
+    &-progress {
+      background-image: url(../images/icon-progress.png);
+    }
+    &-progress-act {
+      background-image: url(../images/icon-progress-act.png);
+    }
+    &-recode {
+      background-image: url(../images/icon-recode.png);
+    }
+    &-recode-act {
+      background-image: url(../images/icon-recode-act.png);
+    }
+    &-score {
+      background-image: url(../images/icon-score.png);
+    }
+    &-score-act {
+      background-image: url(../images/icon-score-act.png);
+    }
+    &-score-detail {
+      background-image: url(../images/icon-score-detail.png);
+    }
+    &-score-detail-act {
+      background-image: url(../images/icon-score-detail-act.png);
+    }
+    &-score-set {
+      background-image: url(../images/icon-score-set.png);
+    }
+    &-score-set-act {
+      background-image: url(../images/icon-score-set-act.png);
+    }
+    &-student {
+      background-image: url(../images/icon-student.png);
+    }
+    &-student-act {
+      background-image: url(../images/icon-student-act.png);
+    }
+    &-task {
+      background-image: url(../images/icon-task.png);
+    }
+    &-task-act {
+      background-image: url(../images/icon-task-act.png);
+    }
+    &-view {
+      background-image: url(../images/icon-view.png);
+    }
+    &-view-act {
+      background-image: url(../images/icon-view-act.png);
+    }
+
+    &-arrow-left {
+      background-image: url(../images/icon-arrow-left.png);
+    }
+    &-arrow-left-act {
+      background-image: url(../images/icon-arrow-left-act.png);
+    }
+    &-arrow-left-disabled {
+      background-image: url(../images/icon-arrow-left-disabled.png);
+    }
+    &-arrow-right {
+      background-image: url(../images/icon-arrow-right.png);
+    }
+    &-arrow-right-act {
+      background-image: url(../images/icon-arrow-right-act.png);
+    }
+    &-arrow-right-disabled {
+      background-image: url(../images/icon-arrow-right-disabled.png);
+    }
+
+    &-logout {
+      background-image: url(../images/icon-logout.png);
+    }
+    &-upload {
+      height: 14px;
+      background-image: url(../images/icon-upload.png);
+    }
+    &-area {
+      background-image: url(../images/icon-area.png);
+    }
+  }
+}

src/assets/styles/index.less

@@ -1,9 +1,10 @@
+@import "./iview.less";
 @import "./variables.less";
+@import "./iview-custom.less";
 @import "./base.less";
 @import "./home.less";
+@import "./icons.less";
 @import "./login.less";
-@import "./account.less";
-@import "./common-component.less";
 @import "./main.less";
 @import "./mark.less";
-@import "./iview-style-choosable.less";
+@import "./common-component.less";

src/assets/styles/iview-custom-var.less

@@ -0,0 +1,245 @@
+@import "color/colors";
+
+// Prefix
+@css-prefix             : ivu-;
+@css-prefix-iconfont    : ivu-icon;
+
+// Color
+@primary-color          : #2d8cf0;
+@info-color             : #2db7f5;
+@success-color          : #19be6b;
+@processing-color       : @primary-color;
+@warning-color          : #ff9900;
+@error-color            : #ed4014;
+@normal-color           : #e6ebf1;
+@link-color             : #2D8cF0;
+@link-hover-color       : tint(@link-color, 20%);
+@link-active-color      : shade(@link-color, 5%);
+@selected-color         : fade(@primary-color, 90%);
+@tooltip-color          : #fff;
+@subsidiary-color       : #808695;
+@rate-star-color        : #f5a623;
+@white: #fff;
+@black: #000;
+
+// Base
+@body-background        : #fff;
+@component-background   : #fff;
+@font-family            : "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
+@code-family            : Consolas,Menlo,Courier,monospace;
+@title-color            : #17233d;
+@text-color             : #515a6e;
+@text-color-secondary: fade(@black, 45%);
+@heading-color: fade(#000, 85%);
+@heading-color-dark: fade(@white, 100%);
+@font-size-base         : 14px;
+@font-size-small        : 12px;
+@font-size-large        : @font-size-base + 2px;
+@line-height-base       : 1.5;
+@line-height-computed   : floor((@font-size-base * @line-height-base));
+@border-radius-base     : 6px;
+@border-radius-small    : 4px;
+@cursor-disabled        : not-allowed;
+
+// vertical paddings
+@padding-lg: 24px; // containers
+@padding-md: 16px; // small containers and buttons
+@padding-sm: 12px; // Form controls and items
+@padding-xs: 8px; // small items
+
+// Border color
+@border-color-base      : #dcdee2;  // outside
+@border-color-split     : #e8eaec;  // inside
+@border-width-base      : 1px;            // width of the border for a component
+@border-style-base      : solid;          // style of a components border
+
+// Background color
+@background-color-base        : #f7f7f7;  // base
+@background-color-select-hover: @input-disabled-bg;
+@tooltip-bg                   : rgba(70, 76, 91, .9);
+@head-bg                      : #f9fafc;
+@table-thead-bg               : #f8f8f9;
+@table-td-stripe-bg           : #f8f8f9;
+@table-td-hover-bg            : #ebf7ff;
+@table-td-highlight-bg        : #ebf7ff;
+@menu-dark-title              : #515a6e;
+@menu-dark-active-bg          : #363e4f;
+@menu-dark-subsidiary-color   : rgba(255,255,255,.7);
+@menu-dark-group-title-color  : rgba(255,255,255,.36);
+@date-picker-cell-hover-bg    : #e1f0fe;
+
+// Shadow
+@shadow-color           : rgba(0, 0, 0, .2);
+@shadow-base            : @shadow-down;
+@shadow-card            : 0 1px 1px 0 rgba(0,0,0,.1);
+@shadow-up              : 0 -1px 6px @shadow-color;
+@shadow-down            : 0 1px 6px @shadow-color;
+@shadow-left            : -1px 0 6px @shadow-color;
+@shadow-right           : 1px 0 6px @shadow-color;
+
+// Button
+@btn-height-base        : 32px;
+@btn-height-large       : 40px;
+@btn-height-small       : 24px;
+
+@btn-padding-base       : 0 @padding-md - 1px;
+@btn-padding-large      : @btn-padding-base;
+@btn-padding-small      : 0 @padding-xs - 1px;
+
+@btn-font-weight        : normal;
+@btn-padding-base-icon  : 5px 15px 6px;
+@btn-padding-large-icon : 6px 15px 6px 15px;
+@btn-padding-small-icon : 1px 7px 2px;
+@btn-font-size          : @font-size-base;
+@btn-font-size-large    : @font-size-large;
+@btn-font-size-small    : @font-size-base;
+@btn-border-radius      : 4px;
+@btn-border-radius-small: 3px;
+@btn-group-border       : shade(@primary-color, 5%);
+
+@btn-disable-color      : #c5c8ce;
+@btn-disable-bg         : @background-color-base;
+@btn-disable-border     : @border-color-base;
+
+@btn-default-color      : @text-color;
+@btn-default-bg         : #fff;
+@btn-default-border     : @border-color-base;
+
+@btn-primary-color      : #fff;
+@btn-primary-bg         : @primary-color;
+
+@btn-ghost-color        : @text-color;
+@btn-ghost-bg           : #fff;
+@btn-ghost-border       : @border-color-base;
+
+@btn-circle-size        : @btn-height-base;
+@btn-circle-size-large  : @btn-height-large;
+@btn-circle-size-small  : @btn-height-small;
+
+@btn-square-size        : @btn-height-base;
+@btn-square-size-large  : @btn-height-large;
+@btn-square-size-small  : @btn-height-small;
+
+// Layout and Grid
+@grid-columns                : 24;
+@grid-gutter-width           : 0;
+@layout-body-background      : #f5f7f9;
+@layout-header-background    : #515a6e;
+@layout-header-height        : 64px;
+@layout-header-padding       : 0 50px;
+@layout-footer-padding       : 24px 50px;
+@layout-footer-background    : @layout-body-background;
+@layout-sider-background     : @layout-header-background;
+@layout-trigger-height       : 48px;
+@layout-trigger-color        : #fff;
+@layout-zero-trigger-width   : 36px;
+@layout-zero-trigger-height  : 42px;
+
+// Legend
+@legend-color           : #999;
+
+// Input
+@input-height-base           : 32px;
+@input-height-large          : 40px;
+@input-height-small          : 24px;
+
+@input-padding-horizontal    : 7px;
+@input-padding-vertical-base : 4px;
+@input-padding-vertical-small: 1px;
+@input-padding-vertical-large: 6px;
+
+@input-placeholder-color     : @btn-disable-color;
+@input-color                 : @text-color;
+@input-border-color          : @border-color-base;
+@input-bg                    : #fff;
+@input-group-bg              : #f8f8f9;
+
+@input-hover-border-color    : @primary-color;
+@input-focus-border-color    : @primary-color;
+@input-disabled-bg           : #f3f3f3;
+
+// Tag
+@tag-font-size          : 12px;
+
+// Media queries breakpoints
+// Extra small screen / phone
+@screen-xs              : 480px;
+@screen-xs-min          : @screen-xs;
+@screen-xs-max          : (@screen-xs-min - 1);
+
+// Small screen / tablet
+@screen-sm              : 576px;
+@screen-sm-min          : @screen-sm;
+@screen-sm-max          : (@screen-sm-min - 1);
+
+// Medium screen / desktop
+@screen-md              : 768px;
+@screen-md-min          : @screen-md;
+@screen-md-max          : (@screen-md-min - 1);
+
+// Large screen / wide desktop
+@screen-lg              : 992px;
+@screen-lg-min          : @screen-lg;
+@screen-lg-max          : (@screen-lg-min - 1);
+
+// Extra large screen / full hd
+@screen-xl              : 1200px;
+@screen-xl-min          : @screen-xl;
+@screen-xl-max          : (@screen-xl-min - 1);
+
+// Extra extra large screen / large descktop
+@screen-xxl             : 1600px;
+@screen-xxl-min         : @screen-xxl;
+@screen-xxl-max         : (@screen-xxl-min - 1);
+
+// Z-index
+@zindex-spin            : 8;
+@zindex-affix           : 10;
+@zindex-back-top        : 10;
+@zindex-select          : 900;
+@zindex-modal           : 1000;
+@zindex-drawer          : 1000;
+@zindex-message         : 1010;
+@zindex-notification    : 1010;
+@zindex-tooltip         : 1060;
+@zindex-transfer        : 1060;
+@zindex-loading-bar     : 2000;
+@zindex-spin-fullscreen : 2010;
+
+// Animation
+@animation-time         : .3s;
+@animation-time-quick   : .15s;
+@transition-time        : .2s;
+@ease-in-out            : ease-in-out;
+
+// Slider
+@slider-color              : tint(@primary-color, 20%);
+@slider-height             : 4px;
+@slider-margin             : 16px 0;
+@slider-button-wrap-size   : 18px;
+@slider-button-wrap-offset : -5px;
+@slider-disabled-color     : #ccc;
+
+// Avatar
+@avatar-size-base: 32px;
+@avatar-size-lg: 40px;
+@avatar-size-sm: 24px;
+@avatar-font-size-base: 18px;
+@avatar-font-size-lg: 24px;
+@avatar-font-size-sm: 14px;
+@avatar-bg: #ccc;
+@avatar-color: #fff;
+@avatar-border-radius: @border-radius-small;
+
+// Anchor
+@anchor-border-width: 2px;
+
+// List
+// ---
+@list-header-background: transparent;
+@list-footer-background: transparent;
+@list-empty-text-padding: @padding-md;
+@list-item-padding: @padding-sm 0;
+@list-item-meta-margin-bottom: @padding-md;
+@list-item-meta-avatar-margin-right: @padding-md;
+@list-item-meta-title-margin-bottom: @padding-sm;

src/assets/styles/iview-custom.less

@@ -0,0 +1,97 @@
+/* form */
+.ivu-form {
+  .ivu-form-item-error-tip {
+    font-size: 14px;
+    margin-top: 3px;
+    padding-left: 20px;
+    padding-top: 0;
+    line-height: 20px;
+    white-space: nowrap;
+    background-image: url(../images/icon-error-tips.png);
+    background-size: 16px 16px;
+    background-repeat: no-repeat;
+    background-position: 0 2px;
+  }
+}
+.ivu-form-inline {
+  .ivu-form-item {
+    margin-bottom: 10px;
+  }
+  .ivu-form-item-label,
+  .ivu-form-item-content {
+    display: inline-block;
+    vertical-align: middle;
+  }
+}
+.ivu-form-item-label {
+  font-size: 14px !important;
+}
+
+// input
+.ivu-input {
+  &-with-prefix {
+    padding-left: 40px;
+  }
+  &-prefix {
+    width: 40px;
+    padding-left: 10px;
+  }
+}
+
+// table
+.ivu-table {
+  background-color: transparent;
+  color: @dark-color;
+  .ivu-table-header {
+    border-radius: @box-border-radius-small;
+    background-color: @white;
+  }
+  .ivu-table-row {
+    background-color: @white;
+    color: @dark-color-light;
+    td {
+      &:first-child {
+        border-radius: @box-border-radius-small 0 0 @box-border-radius-small;
+      }
+      &:last-child {
+        border-radius: 0 @box-border-radius-small @box-border-radius-small 0;
+      }
+    }
+  }
+  table {
+    border-spacing: 0 4px;
+    border-collapse: separate;
+  }
+}
+.ivu-table-wrapper {
+  border: 0;
+}
+
+.ivu-table:after,
+.ivu-table:before {
+  background: transparent;
+}
+.ivu-table td,
+.ivu-table th {
+  font-size: 14px;
+  background: transparent;
+  border: 0;
+  letter-spacing: 1px;
+}
+.ivu-table-body {
+  min-height: 200px;
+}
+.ivu-table-tip td {
+  font-size: 20px;
+  height: 200px;
+  color: @dark-color-lighter;
+}
+
+.ivu-tree-children > li {
+  font-size: 14px;
+}
+
+/* button */
+.ivu-btn + .ivu-btn {
+  margin-left: 10px;
+}

src/assets/styles/iview-style-choosable.less

@@ -1,65 +0,0 @@
-/* form */
-.ivu-form-inline {
-  .ivu-form-item {
-    margin-bottom: 10px;
-  }
-  .ivu-form-item-label,
-  .ivu-form-item-content {
-    display: inline-block;
-    vertical-align: middle;
-  }
-}
-.ivu-form-item-label {
-  font-size: 14px !important;
-}
-// table
-.ivu-table-wrapper {
-  border: 0;
-}
-.ivu-table-header {
-  border-bottom: 1px dashed #e6e6e6;
-}
-.ivu-table:after,
-.ivu-table:before {
-  background: transparent;
-}
-.ivu-table td,
-.ivu-table th {
-  color: #2c3e50;
-  padding: 10px 0;
-  font-size: 14px;
-  background: transparent;
-  border: 0;
-  letter-spacing: 1px;
-}
-.ivu-table th {
-  height: 48px;
-}
-.ivu-table .ivu-table-cell {
-  padding: 5px 10px;
-}
-.ivu-table-body {
-  min-height: 200px;
-}
-.ivu-table-tip td {
-  font-size: 20px;
-  height: 200px;
-  color: #999999;
-}
-.ivu-table-fixed-right {
-  background: #fff;
-  box-shadow: none;
-}
-.ivu-transfer .ivu-transfer-list {
-  min-width: 180px;
-  max-width: 300px;
-  width: auto;
-}
-.ivu-tree-children > li {
-  font-size: 14px;
-}
-
-/* button */
-.ivu-btn + .ivu-btn {
-  margin-left: 10px;
-}

src/assets/styles/iview.less

@@ -1,2 +1,43 @@
 @import "~view-design/src/styles/index.less";
-// @error-color: #ed3f14;
+@primary-color: #4e7cff;
+@info-color: #22c0ff;
+@success-color: #41cd7d;
+@warning-color: #ffcc40;
+@error-color: #f65164;
+@black: #353d57;
+@title-color: #181d22;
+
+@border-color-base: rgba(221, 226, 237, 1);
+@background-color-base: rgba(235, 239, 247, 1);
+
+// table
+@table-thead-bg: #d6e5f8;
+@table-td-stripe-bg: rgba(237, 242, 250, 1);
+
+// Button
+@btn-height-base: 36px;
+@btn-height-large: 50px;
+@btn-height-small: 32px;
+@btn-border-radius: 10px;
+// @btn-padding-large: 10px 15px;
+@btn-font-size-large: 16px;
+
+// @btn-padding-base: 6px 20px;
+@btn-font-size: 14px;
+
+// input
+@input-height-large: 50px;
+
+@input-padding-vertical-base: 4px;
+@input-padding-vertical-large: 14px;
+
+@input-padding-horizontal: 20px;
+
+// @input-bg : rgba(237,242,250,1);
+@input-placeholder-color: #c2c7d5;
+@input-disabled-bg: #f0f0f0;
+
+// tag
+@tag-font-size: 14px;
+// Animation
+@animation-time: 0.2s;

src/assets/styles/login.less

@@ -7,18 +7,9 @@
   right: 0;
   z-index: 8;
   padding: 20px 0;
-  background: linear-gradient(
-    90deg,
-    rgba(71, 195, 233, 1) 0%,
-    rgba(92, 158, 238, 1) 100%
-  );
+  background: @background-color;
   overflow: auto;
 
-  .view-footer {
-    z-index: 99;
-    position: fixed;
-  }
-
   &::before {
     content: "";
     display: block;
@@ -30,32 +21,34 @@
     z-index: 8;
     opacity: 0.8;
     background-image: url(../images/home-back.png);
+    background-repeat: no-repeat;
+    background-size: 100% auto;
     background-position: center center;
   }
 }
 
 .login-box {
-  position: absolute;
-  width: 400px;
-  top: 50%;
-  left: 50%;
+  position: relative;
+  width: 440px;
+  padding: 64px 80px;
+  margin: 160px auto 0;
   z-index: 9;
-  transform: translate(-50%, -50%);
-  overflow: hidden;
+  background-color: @white;
+  border-radius: @box-border-radius;
+
+  .login-title {
+    margin-bottom: 32px;
+    text-align: center;
 
-  &.register {
-    position: static;
-    transform: none;
-    margin: 20px auto;
+    h1 {
+      line-height: 35px;
+      font-size: 24px;
+      color: @font-color-main;
+    }
   }
-}
-.login-title {
-  margin-bottom: 50px;
-  text-align: center;
-  h1 {
-    line-height: 40px;
-    font-size: 34px;
-    color: #fff;
+  /* iview */
+  .ivu-form-item {
+    margin-bottom: 26px;
   }
 }
 .login-form {
@@ -63,29 +56,26 @@
     margin: 0;
   }
 }
+.login-footer {
+  text-align: center;
+  font-size: 12px;
+  font-weight: 400;
+  color: @dark-color-lighter;
+  line-height: 17px;
+  margin-top: 20px;
+  position: relative;
+  z-index: 9;
+}
 
-.login-link {
-  padding: 10px 0;
-  overflow: hidden;
-  a {
-    color: @borderGray;
-    font-size: 15px;
-    font-weight: 600;
-    margin-right: 18px;
-    letter-spacing: 1px;
-    text-decoration: none;
-    float: left;
-    &:last-child {
-      float: right;
-    }
+// reset-pswd
+.reset-pswd {
+  // iview
+  .ivu-modal-header,
+  .ivu-modal-close {
+    display: none;
   }
-  a:hover {
-    color: @mainColor;
-    text-decoration: underline;
+  .ivu-modal-body {
+    top: 0;
+    .login-home;
   }
 }
-
-/* iview */
-.login-box .ivu-form-item {
-  margin-bottom: 26px;
-}

src/assets/styles/main.less

@@ -3,74 +3,171 @@
 // work-overview
 .overview {
   &-head {
-    padding: 20px;
-    text-align: center;
-    background-color: #fff;
-    margin: -20px -20px 0;
+    height: 138px;
+    background: rgba(78, 87, 170, 1);
+    border-radius: 20px;
+    color: @white;
+    position: relative;
+    padding: 31px 320px 0 220px;
+    margin-bottom: 32px;
+
+    &::before {
+      content: "";
+      position: absolute;
+      width: 95px;
+      height: 138px;
+      left: 0;
+      top: 0;
+      background-image: url(../images/bg-left-leaf.png);
+      background-size: 100% 100%;
+      background-repeat: no-repeat;
+      z-index: 7;
+    }
+    &::after {
+      content: "";
+      position: absolute;
+      width: 97px;
+      height: 138px;
+      right: 0;
+      top: 0;
+      background-image: url(../images/bg-right-leaf.png);
+      background-size: 100% 100%;
+      background-repeat: no-repeat;
+      z-index: 7;
+    }
+  }
+  &-bg-person {
+    position: absolute;
+    width: 135px;
+    height: 165px;
+    left: 40px;
+    bottom: 0;
+    background-image: url(../images/bg-penson.png);
+    background-size: 100% 100%;
+    background-repeat: no-repeat;
+    z-index: 8;
   }
   &-title {
-    font-size: 30px;
-    margin: 20px 0 30px;
+    font-size: 32px;
+    line-height: 44px;
   }
   &-actions {
-    margin-top: 20px;
+    position: absolute;
+    z-index: 9;
+    right: 20px;
+    top: 51px;
   }
   &-body {
-    margin-top: 20px;
+    margin: 0 -16px;
     font-size: 0;
   }
 
-  &-list {
+  &-infos {
     font-size: 0;
+    margin-top: 11px;
+    color: rgba(255, 255, 255, 0.5);
     > li {
       display: inline-block;
-      vertical-align: top;
-      font-size: 14px;
-      height: 80px;
-      width: 20%;
-      p {
-        &:last-child {
-          font-size: 24px;
-          margin-top: 5px;
-        }
+      vertical-align: middle;
+      font-size: @font-size-base;
+      &:not(:last-child) {
+        margin-right: 30px;
+      }
+      span:first-child {
+        margin-right: 5px;
       }
     }
   }
   &-subject {
-    font-size: 14px;
+    font-size: @font-size-base;
     display: inline-block;
     vertical-align: top;
     width: 33.33%;
-    padding: 0 10px;
+    padding: 0 16px;
   }
 
   .subject {
     &-content {
       text-align: center;
-      background-color: #fff;
-      .overview-list li {
-        width: 33.33%;
-      }
-    }
-    &-name,
-    &-infos {
-      background-color: @mainColor;
-      color: #fff;
+      background-color: @white;
+      border-radius: @box-border-radius;
+      padding: 20px;
     }
     &-name {
-      font-size: 30px;
-      padding: 20px;
+      color: @title-color;
+      font-size: 40px;
+      line-height: 56px;
+      margin-top: 12px;
     }
+    &-infos {
+      margin: 20px 0 32px;
+      color: @dark-color-light;
+      li {
+        position: relative;
+        display: inline-block;
+        vertical-align: top;
+        width: 105px;
 
+        &:not(:last-child)::before {
+          content: "";
+          position: absolute;
+          width: 13px;
+          height: 22px;
+          top: 50%;
+          right: -6px;
+          margin-top: -11px;
+          background-image: url(../images/icon-split.png);
+          background-size: 100% 100%;
+          background-repeat: no-repeat;
+        }
+      }
+      p {
+        line-height: 20px;
+        margin-bottom: 5px;
+        &:last-child {
+          font-size: 18px;
+          font-weight: 600;
+        }
+      }
+    }
     &-actions {
-      padding: 20px;
+      height: 116px;
+      padding: 32px 20px;
+      margin-bottom: 32px;
+      background: rgba(231, 234, 241, 1);
+      position: relative;
+      border-radius: @box-border-radius;
+      text-align: left;
+
+      &::after {
+        content: "";
+        position: absolute;
+        width: 78px;
+        height: 100%;
+        top: 0;
+        right: 0;
+        background-image: url(../images/bg-leaf-gray.png);
+        background-size: 100% 100%;
+        background-repeat: no-repeat;
+        z-index: 8;
+      }
+
       > p:first-child {
-        color: @gray;
-        font-size: 16px;
+        color: @dark-color-light;
+        margin-bottom: 4px;
       }
       > p:nth-of-type(2) {
-        font-size: 28px;
-        padding: 10px 0 40px;
+        color: @dark-color;
+        font-weight: 600;
+        font-size: 20px;
+        line-height: 28px;
+      }
+
+      &-detail {
+        position: absolute;
+        right: 20px;
+        top: 40px;
+        z-index: 9;
       }
     }
   }
@@ -81,18 +178,24 @@
 .image-view {
   display: inline-block;
   vertical-align: top;
-  font-size: 14px;
-  padding: 10px;
-  width: 300px;
+  font-size: @font-size-base;
+  padding: 0 10px;
+  width: 310px;
   text-align: center;
   &-act {
-    box-shadow: 0 0 1px @mainColor;
+    box-shadow: 0 0 1px @main-color;
+  }
+
+  &-container {
+    padding: 20px 25px;
+    border-radius: @box-border-radius;
+    background-color: @white;
   }
 
   &-title {
-    font-size: 16px;
-    line-height: 32px;
-    margin-bottom: 5px;
+    font-size: 18px;
+    line-height: 25px;
+    margin-bottom: 20px;
   }
   &-contain {
     position: relative;
@@ -110,17 +213,16 @@
       right: 0;
       bottom: 0;
       margin: auto;
-      border: 5px solid #fff;
-      box-shadow: 0 0 1px #000;
       cursor: pointer;
     }
   }
   &-actions {
-    margin-top: 10px;
+    margin-top: 20px;
   }
 }
 .image-view-list {
   font-size: 0;
+  margin: 0 -10px;
   .image-view {
     width: 20%;
   }
@@ -158,7 +260,7 @@
   min-height: 40px;
 
   .carousel-none {
-    font-size: 14px;
+    font-size: @font-size-base;
     text-align: center;
     position: absolute;
     width: 100%;
@@ -180,11 +282,11 @@
     text-align: center;
     line-height: 40px;
     font-size: 36px;
-    color: @gray;
+    color: @dark-color-lighter;
     cursor: pointer;
 
     &:hover {
-      color: @mainColor;
+      color: @main-color;
     }
 
     &-left {

src/assets/styles/mark.less

@@ -20,7 +20,7 @@
   }
   .group-head {
     height: 40px;
-    border-bottom: 1px solid @borderGray;
+    border-bottom: 1px solid @border-color-base;
   }
   .group-name {
     padding: 10px;
@@ -36,7 +36,7 @@
     cursor: pointer;
 
     &:hover {
-      color: @hoverPink;
+      color: @error-color-light;
     }
   }
   .group-body {
@@ -82,13 +82,13 @@
   }
   .progress-rate {
     left: 0;
-    background-color: @green;
+    background-color: @success-color;
     border-top-left-radius: 5px;
     border-bottom-left-radius: 5px;
   }
   .progress-remain {
     right: 0;
-    background-color: @unactBtn;
+    background-color: @background-color;
     border-top-right-radius: 5px;
     border-bottom-right-radius: 5px;
   }
@@ -110,15 +110,15 @@
       padding: 8px 2px;
       cursor: pointer;
       &:hover {
-        color: @mainColor;
+        color: @main-color;
       }
       &.step-analysis {
         width: 60px;
         font-size: 30px;
       }
       &.step-act {
-        border-color: @mainColor;
-        background-color: @mainColor;
+        border-color: @main-color;
+        background-color: @main-color;
         color: #fff;
       }
     }
@@ -304,7 +304,7 @@
       font-size: 44px;
       line-height: 60px;
       text-align: center;
-      background-color: @mainColor;
+      background-color: @main-color;
       border-radius: 50%;
       color: #fff;
     }
@@ -356,7 +356,7 @@
         background-color: #e0e0e0;
         cursor: pointer;
         &:hover {
-          background-color: @mainColor;
+          background-color: @main-color;
           color: #fff;
         }
       }

src/assets/styles/variables.less

@@ -1,24 +1,19 @@
-@fontMain: #2c3e50;
-@background: #f0f0f0;
+@font-color-main: #353d57;
+@background-color: #eff0f5;
 
-@mainColor: #2d8cf0;
-@subColor: #5cadff;
-@tinyColor: #e3fdfc;
+@main-color: #4e7cff;
+@sub-color: #22c0ff;
+@tiny-color: #e3fdfc;
 
-@pink: #ed4014;
-@hoverPink: #ec9182;
-@green: #19be6b;
-@hoverGreen: #70b492;
+@error-color-light: fade(@error-color, 5%);
 
-@dark: #333;
-@midDark: #666;
-@gray: #999;
+@purple-color: #6d32f9;
+@brown-color: #dd7755;
 
-@tipsGray: #bfc1c4;
-@unactBtn: #d7d9df;
-@shadowGray: #e0e0e0;
-@borderGray: #e6e6e6;
-@boldBorderGray: #ddd;
+@dark-color: #353d57;
+@dark-color-light: #7c86a3;
+@dark-color-lighter: #8c94ac;
 
-// size
-@fontSize: 14px;
+@box-border-radius: 20px;
+@box-border-radius-large: 25px;
+@box-border-radius-small: 10px;

src/components/ViewFooter.vue

@@ -1,9 +1,9 @@
 <template>
   <div class="view-footer home-footer">
     <p>
-      Copyright © 2018-2020
-      <a href="http:\\www.qmth.com" target="_blank">启明泰和</a> , All Rights
-      Reserved.
+      Copyright ©
+      <a href="http:\\www.qmth.com.cn" target="_blank">www.qmth.com.cn</a>, All
+      Rights Reserved.
     </p>
   </div>
 </template>

src/components/ViewHeader.vue

@@ -1,26 +1,31 @@
 <template>
-  <div class="view-header">
-    <div class="head-logo">
-      <slot name="logo">
-        <h1>美术阅卷管理端</h1>
-      </slot>
+  <div :class="classes">
+    <div class="head-main">
+      <div class="head-logo">
+        <slot name="logo">
+          <h1>美术阅卷管理端</h1>
+        </slot>
+      </div>
+      <div class="head-user">
+        <span class="user-name"
+          ><Icon type="md-person" size="16" /> {{ username }}</span
+        >
+        <span class="user-name" @click="toResetPwd" v-if="showResetPwd"
+          >修改密码</span
+        >
+        <span class="user-logout" title="退出登录" @click="logout">
+          <Icon type="logout icon" size="20" />
+        </span>
+      </div>
+      <div class="head-nav">
+        <slot name="navTop"></slot>
+      </div>
     </div>
-    <div class="head-user">
-      <span class="user-name"
-        ><Icon type="md-person" size="16" /> {{ username }}</span
-      >
-      <span class="user-name" @click="toResetPwd" v-if="showResetPwd"
-        >修改密码</span
-      >
-      <span class="user-logout" title="退出登录" @click="logout">
-        <Icon type="md-power" size="20" />
-      </span>
-    </div>
-    <div class="head-info">
-      <slot name="info"></slot>
+    <div class="head-sub head-nav-sub" v-if="$slots.navSub">
+      <slot name="navSub"></slot>
     </div>
 
-    <reset-pwd ref="ResetPwd"></reset-pwd>
+    <reset-pwd ref="ResetPwd" v-if="showResetPwd"></reset-pwd>
   </div>
 </template>
 
@@ -37,11 +42,19 @@ export default {
       default: true
     }
   },
+  computed: {
+    classes() {
+      return ["view-header", { "view-header-sub": this.$slots.navSub }];
+    }
+  },
   data() {
     return {
       username: this.$ls.get("user", { name: "" }).name
     };
   },
+  created() {
+    console.log(this);
+  },
   methods: {
     toResetPwd() {
       this.$refs.ResetPwd.open();

src/constants/authority.js

@@ -1,39 +1,53 @@
 export const main = [
+  {
+    name: "WorkManage",
+    title: "工作文件夹",
+    icon: "ivu-icon-files"
+  },
   {
     name: "WorkOverview",
-    title: "总览"
+    title: "总览",
+    icon: "ivu-icon-overview"
   },
   {
     name: "PaperManage",
-    title: "试卷管理"
+    title: "试卷管理",
+    icon: "ivu-icon-paper"
   },
   {
     name: "ClientMonitor",
-    title: "设备监控"
+    title: "设备监控",
+    icon: "ivu-icon-monitor"
   },
   {
     name: "StudentManage",
-    title: "考生管理"
+    title: "考生管理",
+    icon: "ivu-icon-student"
   },
   {
     name: "ClientSet",
-    title: "采集设置"
+    title: "采集设置",
+    icon: "ivu-icon-recode"
   },
   {
     name: "GradingSet",
-    title: "分档设置"
+    title: "分档设置",
+    icon: "ivu-icon-grade-set"
   },
   {
     name: "MarkSet",
-    title: "打分设置"
+    title: "打分设置",
+    icon: "ivu-icon-score-set"
   },
   {
     name: "QualityAnalysis",
-    title: "质量分析"
+    title: "质量分析",
+    icon: "ivu-icon-analysis"
   },
   {
     name: "StudentScore",
-    title: "成绩查询"
+    title: "成绩查询",
+    icon: "ivu-icon-score"
   }
 ];
 

src/main.js

@@ -10,7 +10,7 @@ import globalVuePlugins from "./plugins/globalVuePlugins";
 // https://github.com/RobinCK/vue-ls
 import VueLocalStorage from "vue-ls";
 import ViewUI from "view-design";
-import "view-design/dist/styles/iview.css";
+// import "view-design/dist/styles/iview.css";
 import "./assets/styles/index.less";
 // regist v-chart
 import "./plugins/VueCharts";

src/modules-part/account/api.js

@@ -1,5 +0,0 @@
-import { $post } from "@/plugins/axios";
-
-export const login = datas => {
-  return $post("/backend/login", datas);
-};

src/modules-part/account/router.js

@@ -1,28 +0,0 @@
-// account
-import Account from "./views/Account.vue";
-import UserSet from "./views/UserSet.vue";
-import ResetPswd from "./views/ResetPswd.vue";
-import BindMobile from "./views/BindMobile.vue";
-
-export default [
-  {
-    path: "/account",
-    name: "Account",
-    component: Account
-  },
-  {
-    path: "/account/reset-pswd",
-    name: "ResetPswd",
-    component: ResetPswd
-  },
-  {
-    path: "/account/user-set",
-    name: "UserSet",
-    component: UserSet
-  },
-  {
-    path: "/account/bind-mobile",
-    name: "BindMobile",
-    component: BindMobile
-  }
-];

src/modules-part/account/views/Account.vue

@@ -1,11 +0,0 @@
-<template>
-  <div class="account">
-    account
-  </div>
-</template>
-
-<script>
-export default {
-  name: "account"
-};
-</script>

src/modules-part/account/views/BindMobile.vue

@@ -1,141 +0,0 @@
-<template>
-  <div class="bing-phone part-box">
-    <h3 class="reset-title">绑定手机</h3>
-    <div class="reset-form">
-      <Form ref="resetForm" :model="reset" :rules="resetRules">
-        <FormItem prop="password">
-          <Input
-            size="large"
-            type="password"
-            v-model="reset.password"
-            placeholder="请输入密码"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem prop="phone">
-          <Input
-            size="large"
-            v-model="reset.phone"
-            placeholder="请输入新手机号"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem prop="smscode">
-          <div class="vlcode">
-            <div class="vlcode-right">
-              <Button
-                size="large"
-                long
-                :type="isFetchingCode ? 'default' : 'primary'"
-                @click="getsmsCode"
-                :disabled="isFetchingCode"
-                >{{ codeContent }}</Button
-              >
-            </div>
-            <div class="vlcode-left">
-              <Input
-                size="large"
-                v-model="reset.smscode"
-                placeholder="请输入短信验证码"
-                clearable
-              ></Input>
-            </div>
-          </div>
-        </FormItem>
-        <FormItem>
-          <Button size="large" type="primary" @click="submit('resetForm')"
-            >确定</Button
-          >
-        </FormItem>
-      </Form>
-    </div>
-  </div>
-</template>
-
-<script>
-import { password, phone, smscode } from "@/plugins/formRules";
-
-const codeWaitingTime = 60; // 再次获取验证的等待时间
-const nameWaitTime = "bindphoneWaiting"; // 本地记录等待时间的标志名称
-
-export default {
-  name: "bind-phone",
-  data() {
-    return {
-      isFetchingCode: false,
-      codeContent: "获取验证码",
-      time: codeWaitingTime,
-      reset: {
-        password: "",
-        phone: "",
-        smscode: ""
-      },
-      resetRules: {
-        password,
-        phone,
-        smscode
-      }
-    };
-  },
-  mounted() {
-    this.setWaitingTime();
-  },
-  methods: {
-    submit(name) {
-      this.$refs[name].validate(valid => {
-        if (valid) {
-          console.log(111);
-          // TODO: bind phone api
-        } else {
-          this.$Message.error("Fail!");
-        }
-      });
-    },
-    setWaitingTime() {
-      let codetime = this.$ls.get(nameWaitTime);
-      if (codetime) {
-        let num = Math.floor((codetime.expire - new Date().getTime()) / 1000);
-        if (num > 0) {
-          this.time = num;
-          this.isFetchingCode = true;
-          this.changeContent();
-        }
-      }
-    },
-    getsmsCode() {
-      // TODO: get smscode api
-      this.isFetchingCode = true;
-      this.changeContent();
-    },
-    changeContent() {
-      let that = this;
-      if (!that.isFetchingCode) return;
-      that.codeContent = "倒计时" + that.time + "s";
-      let circleTime = time => {
-        let t = setInterval(() => {
-          if (time > 1) {
-            time--;
-            let expire = new Date().getTime() + time * 1000;
-            that.$ls.set(
-              nameWaitTime,
-              {
-                time,
-                expire
-              },
-              expire
-            );
-            that.codeContent = "倒计时" + time + "s";
-          } else {
-            that.time = codeWaitingTime;
-            that.$ls.remove(nameWaitTime);
-            that.codeContent = "获取验证码";
-            that.isFetchingCode = false;
-            clearInterval(t);
-          }
-        }, 1e3);
-      };
-      circleTime(that.time);
-    }
-  }
-};
-</script>

src/modules-part/account/views/ResetPswd.vue

@@ -1,89 +0,0 @@
-<template>
-  <div class="reset-pswd part-box">
-    <h3 class="reset-title">重置密码</h3>
-    <div class="reset-form">
-      <Form ref="resetForm" :model="reset" :rules="resetRules">
-        <FormItem prop="password">
-          <Input
-            size="large"
-            type="password"
-            v-model="reset.password"
-            placeholder="请输入旧密码"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem prop="newpswd">
-          <Input
-            size="large"
-            type="password"
-            v-model="reset.newpswd"
-            placeholder="请输入新密码"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem prop="renewpswd">
-          <Input
-            size="large"
-            type="password"
-            v-model="reset.renewpswd"
-            placeholder="请再次输入新密码"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem>
-          <Button size="large" type="primary" @click="submit('resetForm')"
-            >确定</Button
-          >
-        </FormItem>
-      </Form>
-    </div>
-  </div>
-</template>
-
-<script>
-import { password } from "@/plugins/formRules";
-
-export default {
-  name: "reset-pswd",
-  data() {
-    const equalToPswd = (rule, value, callback) => {
-      if (value !== this.reset.newpswd) {
-        callback(new Error("两次输入的密码不一致"));
-      } else {
-        callback();
-      }
-    };
-
-    return {
-      reset: {
-        password: "",
-        newpswd: "",
-        renewpswd: ""
-      },
-      resetRules: {
-        password,
-        newpswd: password,
-        renewpswd: [
-          ...password,
-          {
-            validator: equalToPswd,
-            trigger: "blur"
-          }
-        ]
-      }
-    };
-  },
-  methods: {
-    submit(name) {
-      this.$refs[name].validate(valid => {
-        if (valid) {
-          console.log(111);
-          // TODO: reset pswd api
-        } else {
-          this.$Message.error("Fail!");
-        }
-      });
-    }
-  }
-};
-</script>

src/modules-part/account/views/UserSet.vue

@@ -1,115 +0,0 @@
-<template>
-  <div class="user-set">
-    <div class="user-info part-box">
-      <div class="user-info-avatar">
-        <Icon type="ios-person"></Icon>
-        <!-- <img src="" alt=""> -->
-      </div>
-      <h4 class="user-info-name">{{ username }}</h4>
-      <h5 class="user-info-email">{{ email }}</h5>
-    </div>
-    <div class="user-setting part-box">
-      <h3>用户设置</h3>
-      <div class="user-table non-border">
-        <Table
-          :columns="columns"
-          :data="userSetInfos"
-          :show-header="false"
-          disabled-hover
-        ></Table>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-export default {
-  name: "user-set",
-  data() {
-    return {
-      username: "chuyiyi",
-      email: "chulin@163.com",
-      columns: [
-        {
-          title: "名称",
-          key: "title",
-          align: "right",
-          width: 100
-        },
-        {
-          title: "内容",
-          key: "content"
-        },
-        {
-          title: "是否设置",
-          align: "center",
-          key: "isSet",
-          render: (h, params) => {
-            return h("div", [
-              h("Icon", {
-                props: {
-                  type: "ios-checkmark-circle",
-                  color: "#19be6b"
-                }
-              }),
-              params.row.isSet
-            ]);
-          }
-        },
-        {
-          title: "操作",
-          key: "action",
-          width: 150,
-          align: "center",
-          render: (h, params) => {
-            return h(
-              "a",
-              {
-                on: {
-                  click: () => {
-                    this.toEdit(params.row);
-                  }
-                }
-              },
-              [
-                h("Icon", {
-                  props: {
-                    size: 18,
-                    type: "ios-create"
-                  }
-                })
-              ]
-            );
-          }
-        }
-      ],
-      userSetInfos: [
-        {
-          title: "密码",
-          router: "ResetPswd",
-          content: "使用数字、英文混合的密码更安全",
-          isSet: "已设置"
-        },
-        {
-          title: "手机绑定",
-          router: "BindMobile",
-          content: "185****1423",
-          isSet: "已绑定"
-        },
-        {
-          title: "邮箱绑定",
-          router: "email",
-          content: "chulin@163.com",
-          isSet: "已绑定"
-        }
-      ]
-    };
-  },
-  methods: {
-    toEdit(row) {
-      this.$router.push({ name: row.router });
-      console.log(row);
-    }
-  }
-};
-</script>

src/modules-part/admin/api.js

@@ -1,32 +0,0 @@
-import { $get, $post, $patch, $put, $del } from "@/plugins/axios";
-
-// work-manage
-export const workList = () => {
-  return $get("/api/admin/works");
-};
-export const updateWork = datas => {
-  if (datas.id) {
-    return $post("/api/admin/works", datas);
-  } else {
-    return $put(`/api/admin/works/${datas.id}`, datas);
-  }
-};
-export const deleteWork = id => {
-  return $del(`/api/admin/works/${id}`);
-};
-export const activeWork = id => {
-  return $patch(`/api/admin/works/${id}`);
-};
-export const workDetail = id => {
-  return $get(`/api/admin/works/${id}`);
-};
-
-// subject
-export const subjectList = workId => {
-  return $get(`/api/marksubjects/getAllSubjectStage/${workId}`);
-};
-
-// collect-user
-export const collectUserList = () => {
-  return $get("/api/admin/users/collect");
-};

src/modules-part/admin/router.js

@@ -1,104 +0,0 @@
-import Home from "./views/Home.vue";
-import Work from "./views/Work.vue";
-import Overview from "./views/Overview.vue";
-import Levels from "./views/Levels.vue";
-import Students from "./views/Students.vue";
-import Papers from "./views/Papers.vue";
-import PaperReview from "./views/PaperReview.vue";
-import ClientUser from "./views/ClientUser.vue";
-import Tasks from "./views/Tasks.vue";
-import Analyze from "./views/Analyze.vue";
-
-const workRouter = {
-  path: "/admin/work",
-  name: "Work",
-  component: Work,
-  meta: {
-    title: "工作"
-  }
-};
-
-const routes = [
-  {
-    path: "overview",
-    name: "Overview",
-    component: Overview,
-    meta: {
-      title: "总览"
-    }
-  },
-  {
-    path: "levels",
-    name: "Levels",
-    component: Levels,
-    meta: {
-      title: "档位设定"
-    }
-  },
-  {
-    path: "students",
-    name: "Students",
-    component: Students,
-    meta: {
-      title: "考生管理"
-    }
-  },
-  {
-    path: "papers",
-    name: "Papers",
-    component: Papers,
-    meta: {
-      title: "试卷管理"
-    }
-  },
-  {
-    path: "paper-review",
-    name: "PaperReview",
-    component: PaperReview,
-    meta: {
-      title: "试卷复核"
-    }
-  },
-  {
-    path: "client-user",
-    name: "ClientUser",
-    component: ClientUser,
-    meta: {
-      title: "采集账号管理"
-    }
-  },
-  {
-    path: "tasks",
-    name: "Tasks",
-    component: Tasks,
-    meta: {
-      title: "任务管理"
-    }
-  },
-  {
-    path: "analyze",
-    name: "Analyze",
-    component: Analyze,
-    meta: {
-      title: "质量分析"
-    }
-  }
-];
-
-export const navs = routes.map(item => {
-  return {
-    name: item.name,
-    title: item.meta.title
-  };
-});
-
-export default [
-  { ...workRouter },
-  {
-    path: "/admin/:workId(\\d+)",
-    name: "AdminHome",
-    component: Home,
-    redirect: { name: "Overview" },
-    children: routes
-  }
-];

src/modules-part/admin/views/Analyze.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="analyze">
-    analyze
-  </div>
-</template>
-
-<script>
-export default {
-  name: "analyze",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/admin/views/ClientUser.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="client-user">
-    client-user
-  </div>
-</template>
-
-<script>
-export default {
-  name: "client-user",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/admin/views/Home.vue

@@ -1,61 +0,0 @@
-<template>
-  <div class="home admin-home">
-    <div class="home-header">
-      <view-header>
-        <div class="home-navs" slot="info">
-          <ul>
-            <li
-              :class="{ act: curNav.name === nav.name }"
-              v-for="(nav, index) in navs"
-              :key="index"
-              @click="switchNav(nav)"
-            >
-              <span class="nav-item-cont">{{ nav.title }}</span>
-            </li>
-          </ul>
-        </div>
-      </view-header>
-    </div>
-
-    <div class="home-body">
-      <div class="home-main">
-        <router-view />
-
-        <view-footer></view-footer>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { navs } from "../router";
-
-export default {
-  name: "admin-home",
-  data() {
-    return {
-      navs,
-      curNav: {}
-    };
-  },
-  mounted() {
-    this.actCurNav(this.$route);
-  },
-  methods: {
-    switchNav(item) {
-      if (item.name === this.curNav.name) return;
-
-      this.curNav = item;
-      this.$router.push({
-        name: item.name,
-        params: {
-          workId: this.$route.params.workId
-        }
-      });
-    },
-    actCurNav(router) {
-      this.curNav = this.navs.find(item => item.name === router.name);
-    }
-  }
-};
-</script>

src/modules-part/admin/views/Levels.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="levels">
-    levels
-  </div>
-</template>
-
-<script>
-export default {
-  name: "levels",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/admin/views/PaperReview.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="paper-review">
-    paper-review
-  </div>
-</template>
-
-<script>
-export default {
-  name: "paper-review",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/admin/views/Papers.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="papers">
-    papers
-  </div>
-</template>
-
-<script>
-export default {
-  name: "papers",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/admin/views/Tasks.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="tasks">
-    tasks
-  </div>
-</template>
-
-<script>
-export default {
-  name: "tasks",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/com/router.js

@@ -1,39 +0,0 @@
-import TransferTreeInstance from "./views/TransferTreeInstance";
-import ImportFileInstance from "./views/ImportFileInstance";
-import CalendarMenoInstance from "./views/CalendarMenoInstance";
-import ImagePreviewInstance from "./views/ImagePreviewInstance";
-import StepsProgressInstance from "./views/StepsProgressInstance";
-import VueEchartsInstance from "./views/VueEchartsInstance";
-
-export default [
-  {
-    path: "/com/transfer-tree-instance",
-    name: "TransferTreeInstance",
-    component: TransferTreeInstance
-  },
-  {
-    path: "/com/import-file-instance",
-    name: "ImportFileInstance",
-    component: ImportFileInstance
-  },
-  {
-    path: "/com/calendar-memo-instance",
-    name: "CalendarMenoInstance",
-    component: CalendarMenoInstance
-  },
-  {
-    path: "/com/image-preview-instance",
-    name: "ImagePreviewInstance",
-    component: ImagePreviewInstance
-  },
-  {
-    path: "/com/steps-progress-instance",
-    name: "StepsProgressInstance",
-    component: StepsProgressInstance
-  },
-  {
-    path: "/com/vue-echarts-instance",
-    name: "VueEchartsInstance",
-    component: VueEchartsInstance
-  }
-];

src/modules-part/com/views/CalendarMenoInstance.vue

@@ -1,53 +0,0 @@
-<template>
-  <div class="calendar-memo-instance">
-    <calendar-memo
-      :memo-dates="memoInfos"
-      :disabled-dates="disabledDates"
-      :on-date-click="onDateClick"
-    ></calendar-memo>
-  </div>
-</template>
-
-<script>
-import jsCalendar from "js-calendar";
-import CalendarMemo from "@/components/common/CalendarMemo";
-
-export default {
-  name: "calendar-memo-instance",
-  components: {
-    CalendarMemo
-  },
-  data() {
-    return {
-      calendar: [],
-      memoInfos: ["2018-08-15", "2018-08-31"],
-      disabledDates: ["2018-08-16"]
-    };
-  },
-  mounted() {
-    // this.getCalendar();
-  },
-  methods: {
-    getCalendar() {
-      let jsCal = new jsCalendar.Generator({ onlyDays: true, weekStart: 1 });
-      let januaryDays = jsCal(2018, 7);
-      let totalDays = januaryDays.daysInMonth;
-      let days = januaryDays.cells;
-      console.log(januaryDays);
-      console.log(totalDays);
-      console.log(days);
-    },
-    onDateClick(date) {
-      console.log(date);
-    }
-  }
-};
-</script>
-
-<style>
-.calendar-memo-instance {
-  min-height: 600px;
-  padding: 15px;
-  background: #fff;
-}
-</style>

src/modules-part/com/views/ImagePreviewInstance.vue

@@ -1,72 +0,0 @@
-<template>
-  <div class="image-review-instance part-box">
-    <ul>
-      <li
-        v-for="(item, index) in imageList"
-        :key="index"
-        @click="toReview(index)"
-      >
-        <img
-          style="width: 200px; height: 200px;object-fit:contain;"
-          :src="item.url"
-          :alt="item.name"
-        />
-      </li>
-    </ul>
-
-    <image-preview
-      :image-list="imageList"
-      :init-index="curImageIndex"
-      header-hide
-      ref="ImagePreview"
-    ></image-preview>
-  </div>
-</template>
-
-<script>
-import ImagePreview from "../../../components/common/ImagePreview";
-
-export default {
-  name: "image-review-instance",
-  components: { ImagePreview },
-  data() {
-    return {
-      imageList: [],
-      curImageIndex: 0
-    };
-  },
-  created() {
-    this.imageList = "#"
-      .repeat(8)
-      .split("")
-      .map((item, index) => {
-        return {
-          name: `image-${index + 1}`,
-          url: `/img-review/00${index + 1}.jpg`
-        };
-      });
-  },
-  mounted() {},
-  methods: {
-    toReview(index) {
-      this.curImageIndex = index;
-      this.$refs.ImagePreview.open();
-    }
-  }
-};
-</script>
-
-<style lang="css">
-.image-review-instance ul {
-  overflow: hidden;
-}
-.image-review-instance li {
-  float: left;
-  margin: 10px;
-  box-shadow: 0 0 1px #c0c0c0;
-  cursor: pointer;
-}
-.image-review-instance li:hover {
-  box-shadow: 0 0 1px #409eff;
-}
-</style>

src/modules-part/com/views/ImportFileInstance.vue

@@ -1,46 +0,0 @@
-<template>
-  <div class="import-file-instance part-box">
-    <Button type="primary" @click="open">to upload</Button>
-
-    <import-file
-      :title="title"
-      :upload-url="uploadUrl"
-      :download-url="downloadUrl"
-      :download-filename="downloadFilename"
-      :headers="headers"
-      :format="['xls', 'xlsx']"
-      @upload-success="fileUploaded"
-      ref="ImportFile"
-    >
-    </import-file>
-  </div>
-</template>
-
-<script>
-import ImportFile from "@/components/common/ImportFile";
-
-export default {
-  name: "import-file-instance",
-  components: {
-    ImportFile
-  },
-  data() {
-    return {
-      title: "导入文件",
-      uploadUrl: this.GLOBAL.domain + "yourUploadPath",
-      uploadData: {},
-      downloadFilename: "要下载的文件.xls",
-      downloadUrl: "/path/要下载的文件.xls",
-      headers: {
-        Authorization: "token"
-      }
-    };
-  },
-  methods: {
-    open() {
-      this.$refs.ImportFile.modalIsShow = true;
-    },
-    fileUploaded() {}
-  }
-};
-</script>

src/modules-part/com/views/StepsProgressInstance.vue

@@ -1,18 +0,0 @@
-<template>
-  <div class="steps-progress-instance part-box">
-    <steps-progress></steps-progress>
-  </div>
-</template>
-
-<script>
-import StepsProgress from "../../../components/common/StepsProgress/StepsProgress";
-
-export default {
-  name: "steps-progress-instance",
-  components: { StepsProgress },
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/com/views/TransferTreeInstance.vue

@@ -1,55 +0,0 @@
-<template>
-  <div class="transfer-tree-instance part-box">
-    <transfer-tree
-      :data="list"
-      :targetKeys="targetKeys"
-      @on-change="changeKeys"
-    ></transfer-tree>
-  </div>
-</template>
-
-<script>
-import TransferTree from "@/components/common/TransferTree";
-
-const list = [];
-for (let i = 0; i < 3; i++) {
-  let parent = {
-    title: "parent " + i,
-    key: "p-" + i,
-    expand: true,
-    selected: false,
-    children: []
-  };
-
-  for (let j = 0; j < 5; j++) {
-    let child = {
-      title: "child-" + i + "-" + j,
-      key: "child-" + i + "-" + j
-      // disabled: Math.random() > 0.5
-    };
-    parent.children.push(child);
-  }
-  list.push(parent);
-}
-const targetKeys = ["child-0-2", "child-0-3", "child-1-0", "child-1-1"];
-
-export default {
-  name: "transfer-tree-instance",
-  components: {
-    TransferTree
-  },
-  data() {
-    return {
-      list,
-      targetKeys
-    };
-  },
-  methods: {
-    changeKeys({ selectedKeys, direction, moveKeys, selectedTitles }) {
-      console.log(selectedKeys, direction, moveKeys, selectedTitles);
-    }
-  }
-};
-</script>
-
-<style></style>

src/modules-part/com/views/VueEchartsInstance.vue

@@ -1,129 +0,0 @@
-<template>
-  <div class="vue-echarts-instance part-box">
-    <v-chart
-      :options="barOption"
-      v-if="barOption"
-      @click="chartClick"
-      autoresize
-    ></v-chart>
-  </div>
-</template>
-
-<script>
-// package-url: https://github.com/ecomfe/vue-echarts
-export default {
-  name: "vue-echarts-instance",
-  data() {
-    return {
-      barOption: "",
-      dataList: []
-    };
-  },
-  mounted() {
-    this.dataList = "#"
-      .repeat(8)
-      .split("")
-      .map((item, index) => {
-        return {
-          userId: `id${index}`,
-          userName: `name${index}`,
-          count: Math.floor(Math.random() * 100)
-        };
-      });
-    this.barOption = this.getOptions(this.dataList);
-  },
-  methods: {
-    getOptions(datas) {
-      if (!datas || !datas.length) return;
-      const xAxisData = datas.map(item => item.userName);
-      const seriesData = datas.map(item => item.count);
-      const areaColors =
-        xAxisData.length % 2
-          ? ["rgba(237,242,250,1)", "rgba(245,247,251,1)"]
-          : ["rgba(245,247,251,1)", "rgba(237,242,250,1)"];
-
-      return {
-        grid: {
-          left: "5%",
-          right: "5%",
-          top: "5%",
-          borderColor: "rgba(230,234,242,1)"
-        },
-        xAxis: {
-          type: "category",
-          data: xAxisData,
-          inverse: true,
-          axisLine: {
-            show: true,
-            lineStyle: {
-              color: "rgba(230,234,242,1)"
-            }
-          },
-          axisTick: {
-            show: false
-          },
-          splitArea: {
-            show: true,
-            interval: function(index) {
-              return !!index;
-            },
-            areaStyle: {
-              color: areaColors
-            }
-          },
-          splitLine: {
-            show: true,
-            lineStyle: {
-              color: "rgba(230,234,242,1)"
-            }
-          },
-          axisLabel: {
-            interval: 0,
-            margin: 12,
-            color: "#4F535C",
-            fontWeight: 500,
-            fontSize: 14
-          }
-        },
-        yAxis: {
-          type: "value",
-          axisLine: {
-            show: false
-          },
-          axisTick: {
-            show: false
-          },
-          splitLine: {
-            show: false
-          },
-          axisLabel: {
-            show: false
-          }
-        },
-        series: [
-          {
-            type: "bar",
-            barWidth: 30,
-            data: seriesData,
-            itemStyle: {
-              color: "#5C9EEE"
-            },
-            label: {
-              show: true,
-              position: "top",
-              color: "#777D8A",
-              fontSize: 13,
-              fontWeight: 600
-            }
-          }
-        ]
-      };
-    },
-    chartClick(option) {
-      if (option.componentType !== "series") return;
-      const item = this.dataList.find(item => item.userName === option.name);
-      this.$message(item.userName);
-    }
-  }
-};
-</script>

src/modules-part/example/api.js

@@ -1,19 +0,0 @@
-import { $get, $post } from "@/plugins/axios";
-
-// course-manage
-export const courseList = datas => {
-  return $get("/backend/course/listCoursePage", datas);
-};
-export const updateCourse = datas => {
-  if (datas.id) {
-    return $post("/backend/course/updateCourse", datas);
-  } else {
-    return $post("/backend/course/addCourse", datas);
-  }
-};
-export const deleteCourse = id => {
-  return $post("/backend/course/deleteCourse", { id });
-};
-export const updateCourseStatus = ({ id, status }) => {
-  return $post("/backend/course/updateCourseStatus", { id, status });
-};

src/modules-part/example/components/ModifyData.vue

@@ -1,111 +0,0 @@
-<template>
-  <Modal
-    class="modify-data"
-    v-model="modalIsShow"
-    :title="title"
-    :mask-closable="false"
-    @on-visible-change="visibleChange"
-  >
-    <Form
-      ref="modalFormComp"
-      :model="modalForm"
-      :rules="rules"
-      :key="modalForm.id"
-      :label-width="100"
-    >
-      <FormItem prop="name" label="年级名称">
-        <Input
-          v-model.trim="modalForm.name"
-          placeholder="请输入年级名称"
-          clearable
-        ></Input>
-      </FormItem>
-    </Form>
-    <div slot="footer">
-      <Button type="text" @click="cancel">取消</Button>
-      <Button type="primary" :disabled="isSubmit" @click="submit">确认</Button>
-    </div>
-  </Modal>
-</template>
-
-<script>
-import { updateCourse } from "../api";
-
-const initModalForm = {
-  id: "",
-  name: ""
-};
-
-export default {
-  name: "modify-data",
-  props: {
-    instance: {
-      type: Object,
-      default() {
-        return {};
-      }
-    }
-  },
-  computed: {
-    isEdit() {
-      return !!this.instance.id;
-    },
-    title() {
-      return (this.isEdit ? "编辑" : "新增") + "年级";
-    }
-  },
-  data() {
-    return {
-      modalIsShow: false,
-      isSubmit: false,
-      modalForm: { ...initModalForm },
-      rules: {
-        name: [
-          {
-            required: true,
-            message: "请输入年级名称",
-            trigger: "change"
-          }
-        ]
-      }
-    };
-  },
-  methods: {
-    initData(val) {
-      if (val.id) {
-        this.modalForm = this.$objAssign(initModalForm, val);
-      } else {
-        this.modalForm = { ...initModalForm };
-      }
-    },
-    visibleChange(visible) {
-      if (visible) {
-        this.initData(this.instance);
-      }
-    },
-    cancel() {
-      this.modalIsShow = false;
-    },
-    open() {
-      this.modalIsShow = true;
-    },
-    async submit() {
-      const valid = await this.$refs.modalFormComp.validate();
-      if (!valid) return;
-
-      if (this.isSubmit) return;
-      this.isSubmit = true;
-      const data = await updateCourse(this.modalForm).catch(() => {
-        this.isSubmit = false;
-      });
-
-      if (!data) return;
-
-      this.isSubmit = false;
-      this.$Message.success(this.title + "成功！");
-      this.$emit("modified");
-      this.cancel();
-    }
-  }
-};
-</script>

src/modules-part/example/router.js

@@ -1,9 +0,0 @@
-import DataManage from "./views/DataManage.vue";
-
-export default [
-  {
-    path: "/example/data-manage",
-    name: "DataManage",
-    component: DataManage
-  }
-];

src/modules-part/example/views/DataManage.vue

@@ -1,218 +0,0 @@
-<template>
-  <div class="data-manage">
-    <div class="part-box">
-      <Form ref="FilterForm" label-position="left" :label-width="80" inline>
-        <FormItem label="工作">
-          <WorkSelect
-            v-model.trim="filter.workId"
-            placeholder="请选择工作"
-            style="width:200px;"
-          ></WorkSelect>
-        </FormItem>
-        <FormItem label="科目">
-          <SubjectSelect
-            v-model.trim="filter.subjectId"
-            :work-id="filter.workId"
-            placeholder="请选择科目"
-            style="width:200px;"
-          ></SubjectSelect>
-        </FormItem>
-        <FormItem label="用户">
-          <CollectUserSelect
-            v-model.trim="filter.userId"
-            placeholder="请选择用户"
-            style="width:200px;"
-          ></CollectUserSelect>
-        </FormItem>
-        <FormItem label="年级名称">
-          <Input
-            v-model.trim="filter.name"
-            placeholder="年级名称模糊查询"
-            clearable
-          ></Input>
-        </FormItem>
-        <FormItem label="年级状态">
-          <Select v-model="filter.status" style="width: 150px;" clearable>
-            <Option v-for="(val, key) in ABLE_TYPE" :key="key" :value="key">{{
-              val
-            }}</Option>
-          </Select>
-        </FormItem>
-        <FormItem :label-width="0">
-          <Button type="primary" icon="ios-search" @click="toPage(1)"
-            >查询</Button
-          >
-        </FormItem>
-      </Form>
-    </div>
-
-    <div class="part-box">
-      <div class="part-title">
-        <div class="part-title-infos">
-          <Button type="primary" icon="md-add" @click="toAdd">新增</Button>
-        </div>
-      </div>
-      <Table
-        ref="TableList"
-        :columns="columns"
-        :data="levels"
-        disabled-hover
-        border
-      ></Table>
-      <div class="part-page">
-        <Page
-          size="small"
-          :current="current"
-          :total="total"
-          :page-size="size"
-          @on-change="toPage"
-        ></Page>
-      </div>
-    </div>
-
-    <!-- modify-data -->
-    <modify-data
-      :instance="curCourse"
-      @modified="getList"
-      ref="ModifyData"
-    ></modify-data>
-  </div>
-</template>
-
-<script>
-import { ABLE_TYPE } from "@/constants/enumerate";
-import { courseList, deleteCourse, updateCourseStatus } from "../api";
-import ModifyData from "../components/ModifyData";
-import WorkSelect from "@/components/WorkSelect";
-import SubjectSelect from "@/components/SubjectSelect";
-import CollectUserSelect from "@/components/CollectUserSelect";
-
-export default {
-  name: "data-manage",
-  components: { ModifyData, WorkSelect, SubjectSelect, CollectUserSelect },
-  data() {
-    return {
-      filter: {
-        name: "",
-        status: "",
-        userId: "",
-        workId: "",
-        subjectId: ""
-      },
-      current: 1,
-      size: this.GLOBAL.pageSize,
-      total: 0,
-      levels: [],
-      curCourse: {},
-      ABLE_TYPE,
-      columns: [
-        {
-          title: "序号",
-          type: "index",
-          width: 100,
-          align: "center"
-        },
-        {
-          title: "年级名称",
-          key: "name",
-          minWidth: 200
-        },
-        {
-          title: "状态",
-          key: "status",
-          minWidth: 200,
-          render: (h, param) => {
-            return h("span", ABLE_TYPE[param.row.status]);
-          }
-        },
-        {
-          title: "操作",
-          key: "action",
-          width: 160,
-          align: "center",
-          render: (h, param) => {
-            const actions = [
-              {
-                name: "编辑",
-                action: () => {
-                  this.toEdit(param.row);
-                }
-              },
-              {
-                name: "删除",
-                type: "error",
-                action: () => {
-                  this.toDelete(param.row);
-                }
-              },
-              {
-                name: param.row.status === "ENABLE" ? "禁用" : "启用",
-                type: param.row.status === "ENABLE" ? "error" : "primary",
-                action: () => {
-                  this.toAble(param.row);
-                }
-              }
-            ];
-            return h("div", this.$tableAction(h, actions));
-          }
-        }
-      ]
-    };
-  },
-  created() {
-    // this.getList();
-  },
-  methods: {
-    async getList() {
-      const datas = {
-        ...this.filter,
-        current: this.current,
-        size: this.size
-      };
-      const data = await courseList(datas);
-      this.levels = data.list.map(item => {
-        return {
-          id: item.id,
-          name: item.name,
-          status: item.status,
-          createTime: item.createTime
-        };
-      });
-      this.total = data.totalCount;
-    },
-    toPage(page) {
-      this.current = page;
-      this.getList();
-    },
-    toAdd() {
-      this.curCourse = {};
-      this.$refs.ModifyData.open();
-    },
-    toEdit(row) {
-      this.curCourse = row;
-      this.$refs.ModifyData.open();
-    },
-    async toAble(row) {
-      const status = row.status === "ENABLE" ? "DISABLE" : "ENABLE";
-      await updateCourseStatus({ id: row.id, status });
-      this.$Message.success("修改成功！");
-      row.status = status;
-    },
-    toDelete(row) {
-      this.$Modal.confirm({
-        title: "删除警告",
-        content: "确定要删除当前学校吗？",
-        onOk: () => {
-          this.toDel(row.id);
-        }
-      });
-    },
-    async toDel(id) {
-      await deleteCourse(id);
-      this.$Message.success("删除成功！");
-      // 解决最后一项删除后的问题
-      this.deletePageLastItem();
-    }
-  }
-};
-</script>

src/modules-part/login/router.js

@@ -1,30 +0,0 @@
-import LoginHome from "./views/LoginHome";
-import Login from "./views/Login";
-import ForgetPwd from "./views/ForgetPwd";
-
-export default [
-  {
-    path: "/login-home",
-    component: LoginHome,
-    children: [
-      {
-        path: "/login",
-        name: "Login",
-        component: Login,
-        meta: {
-          title: "登录",
-          noRequire: true
-        }
-      },
-      {
-        path: "/forgetPwd",
-        name: "ForgetPwd",
-        component: ForgetPwd,
-        meta: {
-          title: "忘记密码",
-          noRequire: true
-        }
-      }
-    ]
-  }
-];

src/modules-part/subject/router.js

@@ -1,48 +0,0 @@
-import Home from "./views/Home.vue";
-import Progress from "./views/Progress.vue";
-import Users from "./views/Users.vue";
-import Group from "./views/Group.vue";
-
-const routes = [
-  {
-    path: "progress",
-    name: "Progress",
-    component: Progress,
-    meta: {
-      title: "进度"
-    }
-  },
-  {
-    path: "users",
-    name: "Users",
-    component: Users,
-    meta: {
-      title: "用户管理"
-    }
-  },
-  {
-    path: "group",
-    name: "Group",
-    component: Group,
-    meta: {
-      title: "分档分组"
-    }
-  }
-];
-
-export const navs = routes.map(item => {
-  return {
-    name: item.name,
-    title: item.meta.title
-  };
-});
-
-export default [
-  {
-    path: "/admin/:workId(\\d+)/subject",
-    name: "SubjectHome",
-    component: Home,
-    redirect: { name: "Progress" },
-    children: routes
-  }
-];

src/modules-part/subject/views/Group.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="group">
-    group
-  </div>
-</template>
-
-<script>
-export default {
-  name: "group",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/subject/views/Home.vue

@@ -1,62 +0,0 @@
-<template>
-  <div class="home subject-home">
-    <div class="home-header">
-      <view-header>
-        <div class="home-navs" slot="info">
-          <ul>
-            <li
-              :class="{ act: curNav.name === nav.name }"
-              v-for="(nav, index) in navs"
-              :key="index"
-              @click="switchNav(nav)"
-            >
-              <span class="nav-item-cont">{{ nav.title }}</span>
-            </li>
-          </ul>
-        </div>
-      </view-header>
-    </div>
-
-    <div class="home-body">
-      <div class="home-main">
-        <router-view />
-
-        <view-footer></view-footer>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { navs } from "../router";
-
-export default {
-  name: "subject-home",
-  data() {
-    return {
-      navs: [],
-      curNav: {}
-    };
-  },
-  mounted() {
-    this.navs = [{ name: "Overview", title: "首页" }, ...navs];
-    this.actCurNav(this.$route);
-  },
-  methods: {
-    switchNav(item) {
-      if (item.name === this.curNav.name) return;
-
-      this.curNav = item;
-      this.$router.push({
-        name: item.name,
-        params: {
-          workId: this.$route.params.workId
-        }
-      });
-    },
-    actCurNav(router) {
-      this.curNav = this.navs.find(item => item.name === router.name);
-    }
-  }
-};
-</script>

src/modules-part/subject/views/Progress.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="progress">
-    progress
-  </div>
-</template>
-
-<script>
-export default {
-  name: "progress",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules-part/subject/views/Users.vue

@@ -1,15 +0,0 @@
-<template>
-  <div class="users">
-    users
-  </div>
-</template>
-
-<script>
-export default {
-  name: "users",
-  data() {
-    return {};
-  },
-  methods: {}
-};
-</script>

src/modules/login/ResetPwd.vue

@@ -4,38 +4,70 @@
     v-model="modalIsShow"
     title="修改密码"
     :mask-closable="false"
+    fullscreen
+    footer-hide
     @on-visible-change="visibleChange"
   >
-    <Form ref="resetForm" :model="reset" :rules="resetRules">
-      <!-- <FormItem prop="password">
-        <Input
-          type="password"
-          v-model="reset.password"
-          placeholder="请输入旧密码"
-          clearable
-        ></Input>
-      </FormItem> -->
-      <FormItem prop="newpswd">
-        <Input
-          type="password"
-          v-model="reset.newpswd"
-          placeholder="请输入新密码"
-          clearable
-        ></Input>
-      </FormItem>
-      <FormItem prop="renewpswd">
-        <Input
-          type="password"
-          v-model="reset.renewpswd"
-          placeholder="请再次输入新密码"
-          clearable
-        ></Input>
-      </FormItem>
-    </Form>
-    <div slot="footer">
-      <Button type="text" @click="cancel">取消</Button>
-      <Button type="primary" :disabled="isSubmit" @click="submit">确定</Button>
+    <div class="login-box">
+      <div class="login-title">
+        <h1>修改密码</h1>
+      </div>
+      <div class="login-form">
+        <Form ref="resetForm" :model="reset" :rules="resetRules">
+          <FormItem prop="password">
+            <Input
+              size="large"
+              type="password"
+              v-model="reset.password"
+              prefix="md-lock"
+              placeholder="请输入旧密码"
+              clearable
+            ></Input>
+          </FormItem>
+          <FormItem prop="newpswd">
+            <Input
+              size="large"
+              type="password"
+              prefix="md-lock"
+              v-model="reset.newpswd"
+              placeholder="请输入新密码"
+              clearable
+            ></Input>
+          </FormItem>
+          <FormItem prop="renewpswd">
+            <Input
+              size="large"
+              type="password"
+              prefix="md-lock"
+              v-model="reset.renewpswd"
+              placeholder="请再次输入新密码"
+              clearable
+            ></Input>
+          </FormItem>
+          <FormItem>
+            <Button
+              size="large"
+              type="primary"
+              :disabled="isSubmit"
+              @click="submit"
+              style="width: 130px;margin-right:10px;"
+              >确定</Button
+            >
+            <Button size="large" style="width: 130px;" @click="cancel"
+              >取消</Button
+            >
+          </FormItem>
+        </Form>
+      </div>
     </div>
+    <div class="login-footer">
+      <p>
+        Copyright ©
+        <a href="http:\\www.qmth.com" target="_blank">www.qmth.com.cn</a>, All
+        Rights Reserved.
+      </p>
+    </div>
+    <div slot="footer"></div>
   </Modal>
 </template>
 
@@ -44,7 +76,7 @@ import { resetPwd } from "@/api";
 import { password } from "@/plugins/formRules";
 
 const initModalForm = {
-  // password: "",
+  password: "",
   newpswd: "",
   renewpswd: ""
 };
@@ -67,7 +99,7 @@ export default {
         ...initModalForm
       },
       resetRules: {
-        // password,
+        password,
         newpswd: password,
         renewpswd: [
           ...password,

src/modules/login/login.vue

@@ -2,42 +2,50 @@
   <div class="login-home login">
     <div class="login login-box">
       <div class="login-title">
-        <h1>美术阅卷系统登录</h1>
+        <h1>美术阅卷管理端</h1>
       </div>
       <div class="login-form">
         <Form ref="loginForm" :model="loginModel" :rules="loginRules">
           <FormItem prop="loginName">
             <Input
+              size="large"
               v-model.trim="loginModel.loginName"
               prefix="md-person"
-              placeholder="请输入用户名"
+              placeholder="输入账号"
               clearable
             ></Input>
           </FormItem>
           <FormItem prop="password">
             <Input
+              size="large"
               type="password"
               v-model.trim="loginModel.password"
               prefix="md-lock"
-              placeholder="请输入密码"
+              placeholder="输入密码"
               clearable
             ></Input>
           </FormItem>
-          <FormItem>
+          <FormItem style="margin-top:70px;">
             <Button
               long
+              size="large"
+              shape="circle"
               type="primary"
               :disabled="isSubmit"
               @click="submit('loginForm')"
               >登录</Button
             >
-            <div class="login-link">
-              <!-- <router-link :to="{ name: 'ForgetPwd' }">忘记密码</router-link> -->
-            </div>
           </FormItem>
         </Form>
       </div>
     </div>
+    <div class="login-footer">
+      <p>
+        Copyright ©
+        <a href="http:\\www.qmth.com" target="_blank">www.qmth.com.cn</a>, All
+        Rights Reserved.
+      </p>
+    </div>
 
     <reset-pwd @confirm="resetSuccess" ref="ResetPwd"></reset-pwd>
   </div>

src/modules/main/ExamPaperView.vue

@@ -1,15 +1,54 @@
 <template>
   <div class="exam-paper-view">
-    exam-paper-view
+    <table class="table">
+      <tr>
+        <th>考区</th>
+        <th v-for="(subject, index) in subjects" :key="index">
+          {{ subject.name }}
+        </th>
+      </tr>
+      <tr v-for="(area, index) in papers" :key="index">
+        <td>{{ area.name }}</td>
+        <td v-for="(subject, index) in area.subjects" :key="index">
+          <div
+            :class="subject.paperUrl ? 'primary' : 'default'"
+            @click="downloadPaper(subject)"
+          >
+            {{ subject.name }}
+          </div>
+        </td>
+      </tr>
+    </table>
   </div>
 </template>
 
 <script>
+import { updatePaperDetail } from "@/api";
+
 export default {
   name: "exam-paper-view",
   data() {
-    return {};
+    return {
+      workId: this.$route.params.workId,
+      subjectId: this.$route.params.subjectId,
+      papers: [],
+      subjects: []
+    };
   },
-  methods: {}
+  methods: {
+    async getData() {
+      const data = await updatePaperDetail(this.workId);
+      this.papers = data.map(area => {
+        area.subjects = area.subjects.filter(
+          subject => subject.id === this.subjectId
+        );
+        return area;
+      });
+      this.subjects = this.papers[0].subjects;
+    },
+    downloadPaper(subject) {
+      if (subject.paperUrl) window.open(subject.paperUrl);
+    }
+  }
 };
 </script>