细节调整

src/assets/styles/adaptive.less

@@ -11,7 +11,7 @@
 
   // home
   .home-main > div {
-    padding: 15px 20px;
+    padding: 15px 10px;
   }
   .home-navs {
     li {
@@ -96,16 +96,17 @@
   }
   .grading-detail {
     .detail-papers {
-      padding: 0 15px;
+      padding: 0;
     }
     .detail-action {
-      padding: 15px;
-      width: 270px;
+      padding: 15px 10px;
+      width: 240px;
+      margin-left: 10px;
     }
     &-image-preview {
       .ivu-modal-mask,
       .ivu-modal-wrap {
-        right: 270px;
+        right: 240px;
       }
     }
   }
@@ -113,7 +114,7 @@
     &-image-preview {
       .ivu-modal-mask,
       .ivu-modal-wrap {
-        right: 270px;
+        right: 240px;
       }
     }
   }
@@ -223,6 +224,18 @@
       margin-bottom: 15px;
     }
   }
+  // marker
+  .marker-header {
+    .header-user {
+      width: 240px;
+    }
+  }
+  .marker-action {
+    width: 240px;
+  }
+  .marker-body {
+    right: 240px;
+  }
 
   // iview
   .ivu-form-inline {

src/assets/styles/base.less

@@ -124,6 +124,12 @@ body {
   flex-direction: column;
   justify-content: space-between;
 }
+// box-justify
+.box-justify {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
 /* part */
 .part-box {
   padding: 15px;
@@ -282,6 +288,10 @@ h2.part-box-head-left {
         padding-left: 0;
         padding-right: 0;
       }
+
+      .td-bl {
+        border-left: 2px solid @color-background;
+      }
     }
   }
 }
@@ -440,6 +450,31 @@ h3.account-title {
   }
 }
 
+.ml-1 {
+  margin-left: 5px;
+}
+.ml-2 {
+  margin-left: 10px;
+}
+.mr-1 {
+  margin-right: 5px;
+}
+.mr-2 {
+  margin-right: 10px;
+}
+.mr-4 {
+  margin-right: 20px;
+}
+.mb-0 {
+  margin-bottom: 0;
+}
+.mb-2 {
+  margin-bottom: 10px;
+}
+.mb-4 {
+  margin-bottom: 20px;
+}
+
 // border-randius
 .border-radius {
   &-small {

src/assets/styles/login.less

@@ -7,8 +7,10 @@
   right: 0;
   z-index: 8;
   padding: 20px 0;
-  background: @background-color;
   overflow: auto;
+  background-image: url(../images/home-back.png);
+  background-repeat: no-repeat;
+  background-size: 100% auto;
 
   &::before {
     content: "";
@@ -18,11 +20,9 @@
     left: 0;
     width: 100%;
     height: 100%;
-    z-index: 8;
-    opacity: 0.8;
-    background-image: url(../images/home-back.png);
-    background-repeat: no-repeat;
-    background-size: 100% auto;
+    z-index: 7;
+    opacity: 0.5;
+    background-color: @background-color;
   }
 }
 
@@ -32,7 +32,7 @@
   padding: 64px 80px;
   margin: 160px auto 0;
   z-index: 9;
-  background-color: @white;
+  background-color: #fff;
   border-radius: @box-border-radius;
 
   .login-title {
@@ -65,6 +65,42 @@
   position: relative;
   z-index: 9;
 }
+// .login-dark
+.login-dark {
+  &::before {
+    background-color: @color-background;
+    opacity: 0.8;
+  }
+
+  .login-box {
+    background-color: @color-background-light;
+
+    .login-title {
+      h1 {
+        color: @color-text-act;
+      }
+    }
+  }
+
+  .login-form {
+    .ivu-input {
+      background-color: @color-background!important;
+      border-color: @color-background;
+      color: @color-text;
+      box-shadow: none !important;
+    }
+  }
+  .login-submit {
+    color: @color-text-act;
+    background-color: @color-act1;
+    border-color: @color-act1;
+
+    &:hover {
+      background-color: shade(@color-act1, 10%);
+      border-color: shade(@color-act1, 10%);
+    }
+  }
+}
 
 // reset-pswd
 .reset-pswd {
@@ -74,7 +110,7 @@
     display: none;
   }
   .ivu-modal-body {
-    top: 0;
     .login-home;
+    .login-dark;
   }
 }

src/assets/styles/mark.less

@@ -662,6 +662,7 @@
       bottom: -22px;
       width: 100%;
       height: 20px;
+      font-size: 12px;
       text-align: center;
     }
   }

src/assets/styles/marker.less

@@ -1,11 +1,3 @@
-@color-background: #2c2e3e;
-@color-background-light: #3d3f55;
-@color-act1: #155b92;
-@color-act2: #cc4635;
-@color-act3: #f9dbc4;
-@color-text: #9d9c9c;
-@color-text-act: #e1dfe0;
-
 .marker-grading {
   position: absolute;
   width: 100%;
@@ -13,6 +5,7 @@
   z-index: auto;
   color: @color-text;
 }
+// marker-header
 .marker-header {
   position: fixed;
   height: 40px;
@@ -25,7 +18,63 @@
   display: flex;
   justify-content: space-between;
   line-height: 30px;
+
+  .header-part {
+    display: inline-block;
+    vertical-align: top;
+    padding: 0 15px;
+    margin-left: 10px;
+    background: @color-background;
+    border-radius: 5px;
+    cursor: pointer;
+    &:hover {
+      background-color: shade(@color-background, 20%);
+      color: @color-text-act;
+    }
+  }
+  .header-step {
+    color: @color-text-act;
+  }
+  .header-history {
+    margin-right: 10px;
+  }
+  .header-user {
+    display: inline-block;
+    vertical-align: top;
+    width: 280px;
+    border-left: 1px solid @color-background;
+    margin: -5px 0;
+    padding: 5px 10px;
+
+    .ivu-dropdown {
+      display: block;
+    }
+
+    .user-name {
+      background: @color-background;
+      border-radius: 15px;
+      padding: 0 15px;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      white-space: nowrap;
+      cursor: pointer;
+      > i {
+        color: #bec3d1;
+        &:last-child {
+          display: block;
+          float: right;
+          margin-top: 8px;
+        }
+      }
+      &:hover {
+        background-color: shade(@color-background, 20%);
+        color: @color-text-act;
+      }
+    }
+  }
 }
+
+// .marker-body
 .marker-body {
   position: absolute;
   left: 0;
@@ -37,58 +86,6 @@
   background: @color-background;
   z-index: 7;
 }
-.header-part {
-  display: inline-block;
-  vertical-align: top;
-  padding: 0 15px;
-  margin-left: 10px;
-  background: @color-background;
-  border-radius: 5px;
-  cursor: pointer;
-  &:hover {
-    background-color: shade(@color-background, 20%);
-    color: @color-text-act;
-  }
-}
-.header-history {
-  margin-right: 10px;
-}
-.header-user {
-  display: inline-block;
-  vertical-align: top;
-  width: 280px;
-  border-left: 1px solid @color-background;
-  margin: -5px 0;
-  padding: 5px 10px;
-
-  .ivu-dropdown {
-    display: block;
-  }
-
-  .user-name {
-    background: @color-background;
-    border-radius: 15px;
-    padding: 0 15px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    cursor: pointer;
-    > i {
-      color: #bec3d1;
-      &:last-child {
-        display: block;
-        float: right;
-        margin-top: 8px;
-      }
-    }
-    &:hover {
-      background-color: shade(@color-background, 20%);
-      color: @color-text-act;
-    }
-  }
-}
-
-// .marker-body
 .marker-image-list {
   height: 100%;
 
@@ -231,9 +228,13 @@
     display: flex;
     justify-content: space-between;
   }
-  .image-info > div {
-    display: inline-block;
-    vertical-align: top;
+  .image-info {
+    white-space: nowrap;
+    overflow: hidden;
+    > div {
+      display: inline-block;
+      vertical-align: top;
+    }
   }
   .image-sample {
     height: 26px;
@@ -273,7 +274,7 @@
   }
   .image-title {
     height: 26px;
-    padding-left: 10px;
+    padding-left: 5px;
     cursor: pointer;
     &:hover {
       color: @color-text-act;
@@ -282,6 +283,7 @@
   .image-rotate {
     height: 26px;
     font-size: 26px;
+    margin-right: -5px;
     cursor: pointer;
     &:hover {
       color: @color-text-act;
@@ -306,6 +308,8 @@
   padding: 60px 10px 20px;
   background-color: @color-background-light;
   color: @color-text;
+  overflow-y: auto;
+  overflow-x: hidden;
 
   &-fullscreen {
     z-index: 10000;
@@ -377,16 +381,15 @@
     }
   }
 
-  // element-ui
+  // iview-ui
   .ivu-btn-primary {
-    color: @color-text;
+    color: @color-text-act;
     background-color: @color-act1;
     border-color: @color-act1;
 
     &:hover {
       background-color: shade(@color-act1, 10%);
       border-color: shade(@color-act1, 10%);
-      color: @color-text-act;
     }
   }
   .ivu-input {
@@ -601,13 +604,38 @@
     }
   }
 }
+// modify-leader-grading
+.marker-modal {
+  .leader-grading {
+    color: @color-text;
+    .leader-level {
+      h3 {
+        background-color: @color-background-light;
+        color: @color-text-act;
+      }
+    }
+    .leader-aciton {
+      color: @color-text;
+    }
+    .leader-markers {
+      background-color: @color-background-light;
+    }
+  }
+  .ivu-btn-primary {
+    .marker-btn-primary;
+  }
+  .ivu-radio-inner:after,
+  .ivu-checkbox-checked .ivu-checkbox-inner {
+    background-color: @color-act1;
+  }
+}
 
-// custom element ui ----------------->
+// custom iview ui ----------------->
 // marker-modal
 .marker-modal {
   color: @color-text;
   .ivu-modal-mask {
-    background-color: rgba(55, 55, 55, 0.6);
+    background-color: rgba(55, 55, 55, 0.9);
   }
 
   .ivu-modal-content {
@@ -658,13 +686,12 @@
 }
 // btn
 .marker-btn-primary {
-  color: @color-text;
+  color: @color-text-act;
   background-color: @color-act1;
   border-color: @color-act1;
 
   &:hover {
     background-color: shade(@color-act1, 10%);
     border-color: shade(@color-act1, 10%);
-    color: @color-text-act;
   }
 }

src/assets/styles/variables.less

@@ -22,3 +22,12 @@
 @box-border-radius: 20px;
 @box-border-radius-large: 25px;
 @box-border-radius-small: 10px;
+
+// marker
+@color-background: #2c2e3e;
+@color-background-light: #3d3f55;
+@color-act1: #155b92;
+@color-act2: #cc4635;
+@color-act3: #f9dbc4;
+@color-text: #9d9c9c;
+@color-text-act: #e1dfe0;

src/modules/grading/leader/LeaderGrading.vue

@@ -112,6 +112,7 @@
     ></marker-standard>
     <!-- modify-leader-grading -->
     <modify-leader-grading
+      class="marker-modal"
       :level-info="levelInfo"
       :markers="markers"
       @modified="leaderGradingSuccess"

src/modules/grading/leader/LeaderStatistics.vue

@@ -7,10 +7,14 @@
     fullscreen
     @on-visible-change="visibleChange"
   >
-    <div class="part-box-head">
-      <div class="part-box-head-right">
+    <div class="box-justify mb-2">
+      <div>
+        <p>{{ curArea.areaName }}：{{ curSubject.name }}</p>
+      </div>
+      <div>
         <Button
           class="marker-btn-primary"
+          size="small"
           type="primary"
           @click="toExport"
           :load="isDownload"
@@ -21,21 +25,20 @@
     <div class="marker-statistics-table">
       <table class="table table-dark">
         <tr>
-          <th>科目</th>
           <th>档位</th>
-          <th>范围</th>
-          <th>数量</th>
-          <th>占比</th>
-          <th>预设占比</th>
+          <th>考区试卷数量</th>
+          <th>考区试卷占比</th>
+          <th>考区阈值</th>
           <th>差值</th>
           <th>累计数量</th>
           <th>累计占比</th>
           <th>调整</th>
+          <th class="td-bl">全部试卷数量</th>
+          <th>全部试卷占比</th>
+          <th>占比阈值</th>
         </tr>
         <tr v-for="(level, sindex) in levelData" :key="sindex">
-          <td>{{ level.subjectName }}</td>
           <td>{{ level.code }}</td>
-          <td>{{ level.minScore }}~{{ level.maxScore }}</td>
           <td>{{ level.levelCount }}</td>
           <td>{{ level.levelProp }}%</td>
           <td>{{ level.examLevelProp }}%</td>
@@ -43,11 +46,14 @@
           <td>{{ level.cumulateCount }}</td>
           <td>{{ level.cumulateProp }}%</td>
           <td>{{ level.adjustmentCount }}</td>
+          <td class="td-bl">{{ level.gcount }}</td>
+          <td>{{ level.gpercent }}%</td>
+          <td>{{ level.pt }}%</td>
         </tr>
       </table>
     </div>
     <div class="marker-statistics-chart">
-      <h3>数量统计</h3>
+      <h3>考区试卷数量分布图</h3>
       <echart-render
         :chart-data="lineChartData"
         chart-type="darkLine"
@@ -94,7 +100,7 @@ export default {
     };
   },
   computed: {
-    ...mapState("marker", ["paramsSet", "curSubject", "curArea"]),
+    ...mapState("marker", ["paramsSet", "curSubject", "curArea", "steps"]),
     showPaperRelateCount() {
       return !!this.paramsSet["showPaperCount"];
     }
@@ -108,6 +114,10 @@ export default {
       }
     },
     async initData() {
+      let levelSteps = {};
+      this.steps.levelStep.forEach(element => {
+        levelSteps[element.name] = element;
+      });
       const subs = this.$route.params.subjectId.split("-");
       this.levelData = await gradingStatData({
         questionId: this.questionId,
@@ -122,6 +132,10 @@ export default {
         item.adjustmentCount = this.showPaperRelateCount
           ? item.adjustmentCount
           : "";
+        const levelStep = levelSteps[item.code];
+        item.gcount = levelStep.gcount;
+        item.gpercent = levelStep.gpercent.toFixed(2);
+        item.pt = levelStep.pt;
         return item;
       });
 

src/modules/grading/marker/MarkerHeader.vue

@@ -92,7 +92,7 @@
       </div>
     </div>
     <div class="header-group">
-      <div class="header-part">
+      <div class="header-part header-step">
         <Dropdown
           placement="bottom"
           transfer

src/modules/grading/marker/MarkerImageView.vue

@@ -22,9 +22,9 @@
           >
             <Icon v-if="image.selected" type="md-checkmark" />
           </div>
-          <div class="image-title" @click="toSelect">
+          <!-- <div class="image-title" @click="toSelect">
             {{ image.title }}
-          </div>
+          </div> -->
         </div>
         <div class="image-rotate" @click="toRotate">
           <Icon type="md-refresh-circle" />

src/modules/grading/marker/MarkerStatistics.vue

@@ -32,7 +32,8 @@
       </table>
     </div>
     <div class="marker-statistics-chart">
-      <h3>数量统计</h3>
+      <h3>分档数量分布图</h3>
+      <!-- TODO:考区与个人曲线图 -->
       <echart-render
         :chart-data="lineChartData"
         chart-type="darkLine"

src/modules/login/LoginHome.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="login-home login">
+  <div :class="['login', 'login-home', { 'login-dark': isDark }]">
     <div class="login login-box">
       <div class="login-title">
         <h1>美术阅卷系统</h1>
@@ -29,6 +29,7 @@
           </FormItem>
           <FormItem style="margin-top:70px;">
             <Button
+              class="login-submit"
               long
               size="large"
               shape="circle"
@@ -108,6 +109,11 @@ export default {
       isSubmit: false
     };
   },
+  computed: {
+    isDark() {
+      return !this.$route.name.includes("Admin");
+    }
+  },
   mounted() {
     this.$ls.clear();
   },

src/modules/login/ResetPwd.vue

@@ -49,6 +49,7 @@
           </FormItem>
           <FormItem>
             <Button
+              class="marker-btn-primary"
               size="large"
               shape="circle"
               type="primary"

src/routers/index.js

@@ -27,6 +27,14 @@ export default new Router({
         noRequire: true
       }
     },
+    {
+      path: "/login-admin",
+      name: "LoginAdmin",
+      component: Login,
+      meta: {
+        noRequire: true
+      }
+    },
     ...main,
     ...grading,
     ...mark,