数据处理

src/assets/styles/pages.scss

@@ -1,388 +1,3 @@
-.task-apply-steps {
-  min-height: 90px;
-  margin-bottom: 20px;
-  margin-top: -32px;
-  .el-step__title {
-    font-size: 14px;
-    line-height: 30px;
-  }
-}
-.task-exam-room {
-  background-color: #fff;
-  border-radius: $--border-radius;
-  margin-bottom: 10px;
-}
-// task-detail
-.task-detail {
-  .table {
-    border-radius: $--border-radius;
-    color: $--color-text-dark-1;
-    border: 1px solid $--color-border;
-    border-bottom: 0;
-    border-right: 0;
-    border-collapse: separate;
-    overflow: hidden;
-
-    th {
-      border-left: 0;
-      border-top: 0;
-      color: $--color-text-gray-2;
-      padding: 15px;
-    }
-    td {
-      border-left: 0;
-      border-top: 0;
-      padding: 10px 15px;
-
-      i {
-        display: inline-block;
-        vertical-align: middle;
-      }
-    }
-  }
-  .icon {
-    margin-right: 8px;
-  }
-
-  .task-action {
-    margin-top: 50px;
-    text-align: center;
-  }
-  .task-audit {
-    padding-top: 15px;
-    border-top: 2px dashed $--color-border;
-    margin-top: 20px;
-  }
-  // .task-audit-history {
-  // }
-
-  .image-item {
-    display: inline-block;
-    vertical-align: top;
-    width: 80px;
-    height: 80px;
-    margin: 0 10px 10px 0;
-    border: 1px solid $--color-text-gray-4;
-    position: relative;
-    border-radius: 5px;
-    overflow: hidden;
-
-    img {
-      position: absolute;
-      margin: auto;
-      max-width: 100%;
-      max-height: 100%;
-      top: 0;
-      left: 0;
-      right: 0;
-      bottom: 0;
-      z-index: auto;
-      cursor: pointer;
-    }
-
-    .image-delete {
-      display: none;
-      position: absolute;
-      z-index: 99;
-      width: 100%;
-      height: 30px;
-      line-height: 30px;
-      text-align: center;
-      font-size: 20px;
-      bottom: 0;
-      left: 0;
-      background-color: rgba($color: #000000, $alpha: 0.3);
-      color: $--color-danger;
-      cursor: pointer;
-    }
-
-    &:hover {
-      .image-delete {
-        display: block;
-      }
-    }
-  }
-  .image-add {
-    font-size: 40px;
-    line-height: 1;
-    padding: 19px;
-    text-align: center;
-    border-radius: 5px;
-    border-style: dashed;
-    overflow: hidden;
-    cursor: pointer;
-    color: $--color-text-gray-5;
-
-    &:hover {
-      color: $--color-text-gray-3;
-    }
-  }
-  .image-list-none {
-    color: $--color-text-gray-2;
-    margin-bottom: 10px;
-  }
-}
-// apply-audit-history
-.apply-audit-history {
-  .audit-result {
-    margin: 10px 0;
-  }
-}
-// task-list
-.task-head {
-  font-size: 16px;
-
-  i {
-    cursor: pointer;
-
-    &:hover {
-      color: $--color-primary;
-    }
-  }
-}
-.task-list {
-  .task-item {
-    margin-bottom: 15px;
-    padding: 15px;
-    border-radius: $--border-radius;
-    background-color: $--color-background;
-
-    p {
-      line-height: 1.5;
-      margin-bottom: 5px;
-      > span:first-child {
-        color: $--color-text-dark-1;
-      }
-    }
-  }
-  .task-action {
-    cursor: pointer;
-    &:hover {
-      color: $--color-primary;
-    }
-  }
-}
-// create-exam-and-print-task
-.create-exam-and-print-task {
-  .apply-body {
-    width: 1000px;
-    margin: 0 auto 30px;
-  }
-  .apply-part {
-    padding: 20px 30px;
-    border-radius: 20px;
-    border: 1px solid $--color-text-gray-5;
-    margin-bottom: 20px;
-
-    &-title {
-      font-weight: 600;
-      font-size: 18px;
-      line-height: 1;
-      margin-bottom: 30px;
-    }
-  }
-}
-// flow-timeline
-.flow-timeline {
-  margin-top: 10px;
-  padding: 15px;
-  border: 1px solid $--color-text-gray-6;
-  border-radius: 10px;
-  background-color: $--color-text-gray-7;
-  .el-timeline {
-    padding: 0 10px;
-    &-item__tail {
-      border-color: #ddd;
-    }
-  }
-  .timeline-item-stop {
-    .el-timeline-item__tail {
-      border-left-style: dashed;
-    }
-  }
-
-  .el-timeline-item__node--success {
-    background-color: $--color-success;
-  }
-
-  .flow-item {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-
-    &-time {
-      color: #909399;
-      line-height: 1;
-      font-size: 13px;
-      margin-bottom: 8px;
-      padding-top: 4px;
-    }
-    &-title {
-      font-size: 16px;
-      line-height: 1;
-      margin-bottom: 5px;
-    }
-    &-desc {
-      color: $--color-text-gray;
-
-      > span:not(:first-child) {
-        margin-left: 10px;
-      }
-    }
-
-    &-attachment {
-      .btn-primary {
-        &:hover {
-          font-weight: normal;
-        }
-
-        & + .btn-primary {
-          position: relative;
-          margin-left: 20px;
-
-          &::before {
-            content: "";
-            display: block;
-            position: absolute;
-            width: 0;
-            height: 14px;
-            border-left: 1px solid $--color-text-gray-4;
-            left: -10px;
-            top: 50%;
-            margin-top: -7px;
-          }
-        }
-      }
-    }
-
-    &-action {
-      text-align: center;
-    }
-
-    // action
-    .user-select {
-      width: 40px;
-      height: 40px;
-      padding: 10px;
-      font-size: 18px;
-      line-height: 1;
-    }
-  }
-}
-
-// wait-task
-.wait-task {
-  .wait-module {
-    height: 100%;
-  }
-}
-// card-title-rule-edit
-.card-title-rule-edit {
-  .field-item {
-    display: inline-block;
-    vertical-align: top;
-    margin: 0 10px 10px 0;
-    padding: 8px 10px;
-    border-radius: 4px;
-    line-height: 1;
-    background-color: $--color-background;
-    cursor: pointer;
-
-    &:hover {
-      color: $--color-primary;
-    }
-    &-act {
-      background-color: $--color-primary;
-      color: #fff !important;
-    }
-    &-disabled {
-      cursor: not-allowed;
-
-      &:hover {
-        color: $--color-text-dark;
-      }
-    }
-  }
-  .field-textarea {
-    border-radius: $--border-radius;
-    border: 1px solid $--color-text-gray-4;
-    min-height: 60px;
-    padding: 2px;
-    overflow: hidden;
-
-    &:focus {
-      border-color: $--color-primary;
-    }
-
-    span.var-field {
-      display: inline-block;
-      vertical-align: middle;
-      padding: 3px 5px;
-      background-color: $--color-primary;
-      color: $--color-white;
-      line-height: 1;
-      border-radius: 3px;
-    }
-  }
-}
-
-// page-preview
-.preview-frame {
-  position: absolute;
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  z-index: 99;
-}
-// label-edit
-.label-edit {
-  min-height: 60px;
-  .label-item {
-    display: inline-block;
-    vertical-align: top;
-    border: 1px solid $--color-text-gray-6;
-    border-radius: $--border-radius;
-    padding: 5px 40px 5px 10px;
-    position: relative;
-    margin: 0 10px 10px 0;
-    line-height: 21px;
-  }
-  .label-item-content {
-    margin: 0;
-    line-height: 21px;
-    vertical-align: middle;
-  }
-  .label-item-delete {
-    position: absolute;
-    right: 10px;
-    top: 50%;
-    transform: translateY(-50%);
-    z-index: 99;
-    font-size: 16px;
-    color: $--color-text-gray-5;
-    cursor: pointer;
-    &:hover {
-      color: $--color-danger;
-    }
-  }
-  .label-add {
-    display: inline-block;
-    vertical-align: top;
-    border: 1px solid $--color-text-gray-6;
-    border-radius: $--border-radius;
-    padding: 0 10px;
-    color: $--color-text-gray-2;
-    cursor: pointer;
-    &:hover {
-      border-color: $--color-primary;
-      color: $--color-primary;
-    }
-  }
-}
-
-// rule-exam
-
 // select-orgs
 .select-orgs {
   position: relative;
@@ -459,253 +74,7 @@
     }
   }
 }
-// modify-print-plan
-.modify-print-plan {
-  .part-box {
-    margin-bottom: 40px;
-  }
-}
-
-// paper-track-preview-dialog
-.paper-track-preview-dialog {
-  .paper-preview {
-    overflow: auto;
-    canvas {
-      display: block;
-      margin: 0 auto;
-    }
-  }
-  .preview-loading {
-    position: absolute;
-    top: 100px;
-    width: 100%;
-    z-index: auto;
-    font-size: 100px;
-    text-align: center;
-    color: #aaa;
-  }
-  .el-dialog__body {
-    padding: 70px 20px 80px !important;
-  }
-  .el-dialog__footer {
-    position: fixed;
-    width: 100%;
-    left: 0;
-    bottom: 0;
-    z-index: 9;
-    padding: 15px 20px;
-    border-top: 1px solid #eff0f5;
-    background-color: #fff;
-    .el-button {
-      float: none;
-    }
-  }
-}
-
-// marker-login
-.marker-login {
-  .part-box {
-    padding: 100px 50px;
-    text-align: center;
-  }
-  .auth-item {
-    padding: 80px;
-    margin: 0 20px;
-    font-size: 40px;
-  }
-}
-
-// modify-exam
-.modify-exam {
-  .tips-info {
-    font-size: 14px;
-  }
-  .el-radio-v {
-    display: block;
-    margin-bottom: 8px;
-  }
-}
-// modify-exam-config
-
-// modify-flow-detail
-.modify-flow-detail {
-  .flow-box {
-    display: flex;
-    justify-content: space-between;
-    align-items: stretch;
-  }
-  .flow-property {
-    width: 300px;
-    min-height: 400px;
-    flex-grow: 0;
-    flex-shrink: 0;
-    border: 1px solid $--color-text-gray-5;
-    border-radius: 10px;
-    padding: 15px;
-    background-color: #fff;
-
-    &-title {
-      font-size: 16px;
-      line-height: 1;
-      padding-bottom: 10px;
-      margin-bottom: 10px;
-      border-bottom: 1px solid $--color-text-gray-5;
-    }
-  }
-  .property-part {
-    margin-bottom: 15px;
-    padding-bottom: 15px;
-    border-bottom: 1px solid $--color-text-gray-5;
-
-    &-title {
-      font-size: 14px;
-      line-height: 1;
-      margin-bottom: 10px;
-    }
-  }
-  .property-desc {
-    margin-bottom: 10px;
-  }
-  .flow-radio-v {
-    .el-radio {
-      display: block;
-      margin-bottom: 8px;
-    }
-  }
-  .flow-users {
-    margin-top: 10px;
-  }
-  .user-list {
-    margin-top: 10px;
-
-    .el-tag {
-      margin: 3px;
-    }
-  }
-  .user-clear {
-    padding: 5px 10px;
-    width: 68px;
-    margin: 3px;
-  }
-
-  .flow-content {
-    margin-right: 20px;
-    flex-grow: 1;
-    border: 1px solid $--color-text-gray-5;
-    border-radius: 10px;
-    padding: 10px;
-    position: relative;
-    background-color: #fff;
-  }
-  .flow-main {
-    width: 200px;
-    margin: 30px auto 0;
-  }
-  .flow-node {
-    position: relative;
-    box-shadow: 0 0 0 1px #ccc;
-    border-radius: 10px;
-    margin-bottom: 60px;
-    cursor: pointer;
-
-    &:hover {
-      opacity: 0.9;
-    }
-    &.is-active {
-      opacity: 1;
-      box-shadow: 0 0 0 2px $--color-blue;
-    }
-
-    &-title {
-      padding: 8px 10px;
-      border-bottom: 1px solid #ccc;
-      background-color: $--color-blue;
-      color: #fff;
-      border-top-left-radius: 10px;
-      border-top-right-radius: 10px;
-    }
-    &-content {
-      padding: 10px;
-      min-height: 40px;
-    }
-  }
-  .node-start {
-    cursor: default;
-    .flow-node-content {
-      background-color: mix(#fff, $--color-success, 20%);
-      text-align: center;
-      font-size: 18px;
-      border-radius: 10px;
-      color: #fff;
-    }
-  }
-  .node-end {
-    cursor: default;
-
-    .flow-node-content {
-      background-color: mix(#fff, $--color-danger, 20%);
-      text-align: center;
-      font-size: 18px;
-      border-radius: 10px;
-      color: #fff;
-    }
-  }
-  .flow-link {
-    position: absolute;
-    width: 30px;
-    left: 50%;
-    margin-left: -15px;
-    height: 52px;
-    bottom: -56px;
-
-    &::before {
-      content: "";
-      display: block;
-      position: absolute;
-      border-left: 2px solid $--color-text-gray-2;
-      top: 0;
-      bottom: 2px;
-      left: 50%;
-      margin-left: -1px;
-      z-index: 8;
-    }
-    &::after {
-      content: "";
-      display: block;
-      position: absolute;
-      width: 0;
-      height: 0;
-      border-width: 8px;
-      border-style: solid;
-      border-color: $--color-text-gray-2 transparent transparent transparent;
-      left: 50%;
-      margin-left: -8px;
-      bottom: -8px;
-      z-index: 9;
-    }
-
-    .node-add {
-      position: absolute;
-      width: 24px;
-      height: 24px;
-      top: 50%;
-      left: 50%;
-      transform: translate(-50%, -50%);
-      border-radius: 50%;
-      z-index: 99;
-      background-color: $--color-primary;
-      color: #fff;
-      font-size: 16px;
-      line-height: 25px;
-      text-align: center;
-      cursor: pointer;
-
-      &:hover {
-        background-color: mix(#000, $--color-primary, 10%);
-      }
-    }
-  }
-}
+// elect-user-dialog
 .select-user-dialog {
   .user-search {
     margin-bottom: 5px;
@@ -779,361 +148,56 @@
   }
 }
 
-// card-manage
-.card-create-type {
-  .card-types {
-    font-size: 0;
-    text-align: center;
-  }
-  .card-type {
-    display: inline-block;
-    vertical-align: top;
-    font-size: 20px;
-    margin: 0 5px;
-    height: 70px;
-    width: 150px;
-    line-height: 1;
-    padding: 25px 0;
-    border-radius: $--border-radius;
-    color: #fff;
-    cursor: pointer;
-
-    &:hover {
-      opacity: 0.8;
-    }
-
-    &:nth-of-type(1) {
-      background-color: $--color-primary;
-    }
-    &:nth-of-type(2) {
-      background-color: $--color-success;
-    }
-    &:nth-of-type(3) {
-      background-color: $--color-cyan;
-    }
-  }
-}
-// modify-card
-.modify-card {
-  .el-dialog.is-fullscreen {
-    border: none;
-    .el-dialog__body {
-      border: none;
-      padding: 0;
-    }
-  }
-}
-// modify-mark-params
-.modify-mark-params {
-  .mark-body {
-    margin: 40px 0;
-  }
-  .structure-desc {
-    margin-bottom: 10px;
-  }
-  .expand-btn {
-    display: inline-block;
-    width: 20px;
-    height: 20px;
-    line-height: 19px;
-    font-size: 13px;
-    border: 1px solid #6f7482;
-    border-radius: 3px;
-    text-align: center;
-    cursor: pointer;
-
-    &:hover {
-      color: $--color-primary;
-      border-color: $--color-primary;
-    }
-
-    &-unexpand {
-      background-color: #ebeffc;
-    }
-  }
-  .total-info {
-    text-align: right;
-    padding-top: 10px;
-    padding-right: 210px;
-    > span {
-      color: $--color-danger;
-      font-weight: 600;
-      margin: 0 2px;
-    }
-  }
-  .row-unexpand-sub {
-    display: none;
-  }
-  .marker-header {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 10px;
-  }
-}
-// modify-marker-question
-.modify-marker-question {
-  .el-dialog {
-    width: 900px;
-    margin: 0 auto;
-
-    &__header,
-    &__footer {
-      display: none;
-    }
-    &__body {
-      padding: 20px;
-    }
-  }
-
-  .marker-box {
-    height: 600px;
-    background-color: $--color-background;
-    border-radius: $--border-radius;
-    padding: 15px;
-    display: flex;
-    flex-direction: column;
-
-    &-uq {
-      display: block;
-      height: 100%;
-      overflow: auto;
-      background-color: #fff;
-      border: 1px solid $--color-background;
-
-      .el-tag {
-        margin: 3px;
-      }
-    }
-  }
-  .user-title {
-    margin-bottom: 10px;
-    flex-grow: 0;
-  }
-  .user-search {
-    margin-bottom: 10px;
-    flex-grow: 0;
-  }
-  .user-tree {
-    padding: 10px;
-    border-radius: 4px;
-    background-color: #fff;
-    overflow: auto;
-    flex-grow: 2;
-  }
-
-  .marker-footer {
-    margin-top: 15px;
-    text-align: center;
-  }
-}
-// modify-student-simple
-.modify-student-simple {
-  .tab-body {
-    min-height: 300px;
-  }
-}
-// modify-mark-area
-.modify-mark-area {
+// data-check-dialog
+.data-check-dialog {
   .el-dialog__body {
-    background-color: $--color-background;
-    position: relative;
-    z-index: 3;
-  }
-  .el-dialog__footer {
-    display: none;
-  }
-}
-.area-cropper {
-  position: relative;
-  border: 1px solid #e0e0e0;
-  background-color: #fff;
-  margin: 10px 0;
-
-  .cropper-img img {
-    display: block;
-    width: 100%;
-    height: auto;
-  }
-  .cropper-areas {
-    position: absolute;
-    top: 0;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    z-index: 9;
-  }
-
-  .area-selection {
-    position: absolute;
-    z-index: 999;
-    border: 1px solid $--color-blue;
-    background-color: rgba($color: #000000, $alpha: 0.2);
-  }
-
-  .element-item-body {
-    position: absolute;
-    background-color: rgba($color: #000000, $alpha: 0.2);
-  }
-  .element-delete {
-    position: absolute;
-    height: 20px;
-    width: 20px;
-    top: 0;
-    right: -20px;
-    line-height: 20px;
-    text-align: center;
-    font-size: 18px;
-    display: none;
-    z-index: 9;
-    color: $--color-danger;
-    cursor: pointer;
-    &:hover {
-      color: mix(#fff, $--color-danger, 20%);
-    }
+    height: 100%;
   }
 
-  .element-resize {
-    background-color: transparent;
-    > .resize-control {
-      > .control-point,
-      > .control-line {
-        display: none;
-      }
-    }
-
-    &:hover {
-      > .resize-control {
-        > .control-line {
-          display: block;
-        }
-      }
-    }
-
-    &-act {
-      > .resize-control {
-        > .control-point,
-        > .control-line {
-          display: block;
-        }
-      }
-      .element-delete {
-        display: block;
-      }
+  .data-check {
+    &-body {
+      height: 100%;
+      display: flex;
+      justify-content: space-between;
+      align-items: stretch;
     }
-  }
-  .element-resize-compact {
-    > .resize-control {
-      > .control-line {
-        display: block;
+    &-action {
+      width: 300px;
+      margin: 0;
+      flex-grow: 0;
+      flex-shrink: 0;
+      padding: 20px 15px;
+      display: flex;
+      justify-content: space-between;
+      flex-direction: column;
+
+      &-form {
+        flex-grow: 0;
+        flex-shrink: 0;
+      }
+
+      &-footer {
+        flex-grow: 0;
+        flex-shrink: 0;
+        margin-top: 10px;
+        text-align: right;
       }
-    }
 
-    &:hover {
-      > .resize-control {
-        > .control-line {
-          border-color: $--color-primary;
+      &-student {
+        flex-grow: 2;
+        overflow: auto;
+        .el-button--mini {
+          padding: 5px 8px;
         }
-      }
-    }
-
-    &.element-resize-act {
-      > .resize-control {
-        > .control-line {
-          border-color: $--color-primary;
-          &-left,
-          &-right {
-            border-left-style: solid;
-          }
-          &-top,
-          &-bottom {
-            border-top-style: solid;
-          }
+        .cell {
+          padding-left: 3px;
+          padding-right: 3px;
         }
       }
     }
-  }
-}
-// answer-popover
-.answer-popover {
-  line-height: 24px;
-  padding: 15px;
-
-  .answer-divider {
-    margin: 10px 0;
-    height: 1px;
-    border-bottom: 1px dashed $--color-text-gray-5;
-  }
-  .el-checkbox__label,
-  .el-radio__label {
-    width: 24px;
-    text-align: center;
-  }
-  .el-radio__label {
-    display: inline-block;
-  }
-}
-
-// modify-base-config
-.modify-base-config {
-  &.el-dialog {
-    background-color: $--color-background;
-
-    .el-dialog__body {
-      padding-top: 70px;
-    }
-  }
-  .config-footer {
-    margin-top: 40px;
-    text-align: center;
-  }
-  .step-title {
-    color: $--color-text-gray-3;
-    border: none;
-    outline: none;
-
-    &:not(.is-disabled):hover,
-    &:not(.is-disabled).is-active {
-      color: $--color-success;
-    }
-  }
-}
-.proficiency-edit {
-  .el-form-item__content {
-    margin-bottom: 5px;
-  }
-}
-.rate-input {
-  .el-input-number {
-    width: 60px;
-    margin: 0 10px;
-
-    .el-input__inner {
-      padding-left: 10px;
-      padding-right: 20px;
-    }
-
-    .el-input::after {
-      content: "%";
-      display: block;
-      position: absolute;
-      right: 10px;
-      top: 50%;
-      margin-top: -8px;
-      font-size: 14px;
-      line-height: 1;
-      z-index: 9;
+    &-content {
+      flex-grow: 2;
+      margin: 0 0 0 20px;
     }
   }
-  &-offset-left {
-    padding-left: 87px;
-  }
-}
-
-.analysis-report-view {
-  .auth-item {
-    padding: 80px;
-    margin: 0 20px;
-    font-size: 40px;
-  }
 }

src/assets/styles/paper-approve.css

@@ -1,82 +0,0 @@
-body,
-div,
-h1,
-p,
-tr,
-th,
-td,
-span {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
-}
-
-body {
-  font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB",
-    "Microsoft YaHei", Arial, sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-  font-size: 14px;
-  color: #1f2230;
-}
-
-.paper-main {
-  width: 210mm;
-  margin: 0 auto;
-  color: #1f2230;
-}
-.paper-a4 {
-  width: 210mm;
-  height: 297mm;
-  padding: 40px;
-  overflow: hidden;
-  page-break-after: always;
-}
-.paper-h1 {
-  font-size: 24px;
-  text-align: center;
-  line-height: 1;
-  padding-top: 20px;
-  padding-bottom: 30px;
-}
-.paper-base {
-  margin-bottom: 30px;
-}
-.paper-row {
-  margin: 0 -5px 10px;
-}
-.paper-item {
-  display: inline-block;
-  vertical-align: top;
-  width: 50%;
-  padding: 0 5px;
-}
-.paper-item > span:first-child {
-  float: left;
-  width: 96px;
-  text-align: right;
-}
-.paper-item > span:last-child {
-  display: block;
-  margin-left: 96px;
-}
-
-.paper-table {
-  width: 100%;
-  border-spacing: 0;
-  border-collapse: collapse;
-  margin-bottom: 40px;
-  text-align: center;
-}
-.paper-table th {
-  padding: 8px;
-  line-height: 20px;
-  letter-spacing: 1px;
-  border: 1px solid #1f2230;
-}
-.paper-table td {
-  padding: 8px;
-  line-height: 20px;
-  border: 1px solid #1f2230;
-}

src/components/ImageListPreview.vue

@@ -52,6 +52,7 @@ export default {
   },
   data() {
     return {
+      modalIsShow: false,
       curImage: {},
       curImageIndex: null
     };
@@ -61,6 +62,12 @@ export default {
       this.curImage = {};
       this.curImageIndex = null;
     },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
     toPreview(index) {
       this.curImageIndex = index;
       this.selectImage(index);

src/components/ImageViewContain.vue

@@ -0,0 +1,110 @@
+<template>
+  <div :class="['image-view-contain', { 'image-view-none': !image.url }]">
+    <div class="image-view-image" :style="styles">
+      <img
+        v-if="image.url"
+        :src="image.url"
+        :alt="image.title"
+        @load="resizeImage"
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "image-view-contain",
+  props: {
+    image: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      styles: { width: "", height: "", top: "", left: "", transform: "" },
+      deg: 0
+    };
+  },
+  mounted() {
+    this.registWinResize();
+  },
+  beforeDestroy() {
+    window.removeEventListener("resize", () => {
+      this.resizeImage(this.deg);
+    });
+  },
+  methods: {
+    toReview() {
+      this.$emit("to-review");
+    },
+    registWinResize() {
+      window.addEventListener("resize", () => {
+        this.resizeImage(this.deg);
+      });
+    },
+    resizeImage(deg = 0) {
+      this.deg = deg;
+      const box = this.$el;
+      const imgDom = box.firstChild.firstChild;
+      const { naturalWidth, naturalHeight } = imgDom;
+      const imageSize = this.getImageSizePos({
+        win: {
+          width: box.clientWidth,
+          height: box.clientHeight
+        },
+        img: {
+          width: naturalWidth,
+          height: naturalHeight
+        },
+        rotate: deg
+      });
+      this.styles = Object.assign(this.styles, {
+        width: imageSize.width + "px",
+        height: imageSize.height + "px",
+        top: imageSize.top + "px",
+        left: imageSize.left + "px",
+        transform: `rotate(${deg}deg)`
+      });
+    },
+    getImageSizePos({ win, img, rotate }) {
+      const imageSize = {
+        width: 0,
+        height: 0,
+        top: 0,
+        left: 0
+      };
+      const isHorizontal = !!(rotate % 180);
+
+      const rateWin = isHorizontal
+        ? win.height / win.width
+        : win.width / win.height;
+      const hwin = isHorizontal
+        ? {
+            width: win.height,
+            height: win.width
+          }
+        : win;
+
+      const rateImg = img.width / img.height;
+
+      if (rateImg <= rateWin) {
+        imageSize.height = Math.min(hwin.height, img.height);
+        imageSize.width = Math.floor(
+          (imageSize.height * img.width) / img.height
+        );
+      } else {
+        imageSize.width = Math.min(hwin.width, img.width);
+        imageSize.height = Math.floor(
+          (imageSize.width * img.height) / img.width
+        );
+      }
+      imageSize.left = (win.width - imageSize.width) / 2;
+      imageSize.top = (win.height - imageSize.height) / 2;
+      return imageSize;
+    }
+  }
+};
+</script>

src/modules/base/api.js

@@ -109,62 +109,7 @@ export const teachCollegeList = examId => {
     examId
   });
 };
-// setting --------------------------------->
-// common-rule
-export const examRuleDetail = schoolId => {
-  return $postParam("/api/admin/basic/exam_rule/list", { schoolId });
-};
-export const saveExamRule = datas => {
-  return $post("/api/admin/basic/exam_rule/save", datas);
-};
-// card-rule
-export const cardRuleListPage = datas => {
-  return $postParam("/api/admin/basic/card_rule/list", datas);
-};
-export const cardRuleQuery = param => {
-  return $postParam("/api/admin/basic/card_rule/query", { param });
-};
-export const cardRuleDetail = id => {
-  return $postParam("/api/admin/basic/card_rule/get_one", { id });
-};
-export const saveCardRule = datas => {
-  return $post("/api/admin/basic/card_rule/save", datas);
-};
-export const ableCardRule = ({ id, enable }) => {
-  return $post("/api/admin/basic/card_rule/enable", { id, enable });
-};
-export const deleteCardRule = id => {
-  return $post("/api/admin/basic/card_rule/delete", { id });
-};
-// common-card-template / common-print-template / param-print-template
-export const templateListPage = datas => {
-  return $postParam("/api/admin/basic/template/list", datas);
-};
-export const templateDetail = id => {
-  return $postParam("/api/admin/basic/template/get_one", { id });
-};
-export const updateTemplate = datas => {
-  return $post("/api/admin/basic/template/save", datas);
-};
-export const ableTemplate = ({ id, enable }) => {
-  return $post("/api/admin/basic/template/enable", { id, enable });
-};
-export const templateCategoryList = type => {
-  return $postParam("/api/admin/basic/template/list", type);
-};
-export const templateContentView = id => {
-  return $postParam("/api/admin/basic/template/read_content", { id });
-};
-// card-manage
-export const cardListPage = datas => {
-  return $postParam("/api/admin/exam/card/page", datas);
-};
-export const updateCard = datas => {
-  return $post("/api/admin/exam/card/save_generic", datas);
-};
-export const deleteCard = id => {
-  return $postParam("/api/admin/exam/card/delete_generic", { id });
-};
+
 // course-manage
 export const courseListPage = datas => {
   return $postParam("/api/admin/basic/course/list", datas);
@@ -187,70 +132,6 @@ export const ableCourse = ({ idList, enable }) => {
 export const batchEnableCourse = datas => {
   return $postParam("/api/admin/basic/course/enable_by_query", datas);
 };
-// course-simple-manage
-export const courseSimpleListPage = datas => {
-  return $postParam("/api/admin/teach/course/page", datas);
-};
-export const courseSimpleQuery = datas => {
-  return $postParam("/api/admin/teach/course/find_basic_course", datas);
-};
-export const deleteCourseSimple = idList => {
-  return $postParam("/api/admin/teach/course/delete", { idList });
-};
-export const updateCourseSimple = datas => {
-  return $post("/api/admin/teach/course/create", datas);
-};
-// flow-manage
-export const flowListPage = datas => {
-  return $postParam("/api/admin/custom/flow/list", datas);
-};
-export const flowEnd = flowId => {
-  return $post("/api/admin/custom/flow/end", { flowId });
-};
-export const flowDelete = ({ id, enable }) => {
-  return $post("/api/admin/custom/flow/enable", { id, enable });
-};
-export const updateFlowName = datas => {
-  return $post("/api/admin/custom/flow/rename", datas);
-};
-export const updateFlowDetail = datas => {
-  return $post("/api/admin/custom/flow/save", datas);
-};
-export const flowDetail = id => {
-  return $postParam("/api/admin/custom/flow/edit", { id });
-};
-export const flowDetailByType = (type = "ELECTRON_FLOW") => {
-  return $postParam("/api/admin/custom/flow/get_flow_info_by_type", {
-    type
-  });
-};
-export const flowDetailByFlowId = flowId => {
-  return $postParam("/api/admin/custom/flow/get_flow_info_by_type", {
-    flowId
-  });
-};
-export const taskFlowDetail = flowId => {
-  return $postParam("/api/admin/custom/flow/view", { flowId });
-};
-export const taskFlowNodeInfo = taskId => {
-  return $postParam("/api/admin/custom/flow/task/info", { taskId });
-};
-export const taskFlowApproverExchange = ({ taskId, userId }) => {
-  return $postParam("/api/admin/custom/flow/task/approver/exchange", {
-    taskId,
-    userId
-  });
-};
-export const taskFlowApprover = datas => {
-  return $post("/api/admin/custom/flow/task/approve", datas);
-};
-// approve-record
-export const approveRecordListPage = datas => {
-  return $postParam("/api/admin/custom/flow/approve/list", datas);
-};
-export const deleteApproveRecord = datas => {
-  return $post("/api/admin/custom/flow/approve/enable", datas);
-};
 
 // dict --------------------------------->
 // student-manage

src/modules/record/api.js

@@ -46,3 +46,6 @@ export const dataCheckUndoListPage = datas => {
 export const dataCheckDoneListPage = datas => {
   return $postParam("/api/admin/sys/role/list", datas);
 };
+export const paperBindUser = datas => {
+  return $post("/api/admin/sys/user/save", datas);
+};

src/modules/record/components/DataCheckDialog.vue

@@ -0,0 +1,204 @@
+<template>
+  <el-dialog
+    class="data-check-dialog page-dialog"
+    :visible.sync="modalIsShow"
+    title="数据处理"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    fullscreen
+    @open="visibleChange"
+  >
+    <div class="data-check-body">
+      <div class="data-check-action part-box">
+        <el-form
+          class="data-check-action-form"
+          ref="modalFormComp"
+          :model="modalForm"
+          :rules="rules"
+          label-position="top"
+        >
+          <el-form-item prop="semesterId" label-width="0">
+            <semester-select
+              v-model="modalForm.semesterId"
+              class="width-full"
+              placeholder="学期"
+            ></semester-select>
+          </el-form-item>
+          <el-form-item prop="courseCode">
+            <el-select
+              class="width-full"
+              v-model="modalForm.courseCode"
+              placeholder="课程"
+              filterable
+            >
+              <el-option
+                v-for="item in courseList"
+                :key="item.id"
+                :value="item.id"
+                :label="item.name"
+              >
+              </el-option>
+            </el-select>
+          </el-form-item>
+          <el-divider></el-divider>
+          <el-form-item prop="studentId" label="绑定学生">
+            <el-input
+              v-model="studentNameOrNo"
+              class="width-full"
+              placeholder="请输入学号/姓名"
+              clearable
+              @input="nameOrNoInput"
+            ></el-input>
+          </el-form-item>
+        </el-form>
+        <div class="data-check-action-student">
+          <el-table ref="TableList" :data="studentList">
+            <el-table-column
+              prop="studentName"
+              label="姓名"
+              width="80"
+            ></el-table-column>
+            <el-table-column prop="studentNo" label="学号"></el-table-column>
+            <el-table-column label="操作" width="55">
+              <template slot-scope="scope">
+                <el-button
+                  size="mini"
+                  type="primary"
+                  :disabled="loading"
+                  @click="toBind(scope.row)"
+                  >绑定</el-button
+                >
+              </template>
+            </el-table-column>
+          </el-table>
+        </div>
+        <div class="data-check-action-footer">
+          <el-button type="primary" size="small" @click="toNextPaper"
+            >下一张</el-button
+          >
+        </div>
+      </div>
+      <div class="data-check-content part-box">
+        <div class="data-check-content-page">
+          <el-button
+            :type="curPaperIndex === 0 ? 'primary' : 'default'"
+            @click="curPaperIndex = 0"
+            >正面</el-button
+          >
+          <el-button
+            :type="curPaperIndex === 1 ? 'primary' : 'default'"
+            @click="curPaperIndex = 1"
+            >反面</el-button
+          >
+        </div>
+      </div>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import timeMixin from "../../../mixins/timeMixin";
+import { studentListQuery } from "../../../modules/base/api";
+import { paperBindUser } from "../api";
+
+const initModalForm = {
+  semesterId: "",
+  courseCode: "",
+  studentId: ""
+};
+
+export default {
+  name: "data-check-dialog",
+  mixins: [timeMixin],
+  data() {
+    return {
+      modalIsShow: true,
+      studentNameOrNo: "",
+      modalForm: { ...initModalForm },
+      rules: {
+        semesterId: [
+          {
+            required: true,
+            message: "请选择学期",
+            trigger: "change"
+          }
+        ],
+        courseCode: [
+          {
+            required: true,
+            message: "请选择课程",
+            trigger: "change"
+          }
+        ],
+        studentId: [
+          {
+            required: true,
+            message: "请选择学生",
+            trigger: "change"
+          }
+        ]
+      },
+      inputSearchDelay: 200,
+      studentList: [],
+      courseList: [],
+      loading: false,
+      curPaperIndex: 0,
+      curPages: []
+    };
+  },
+  computed: {
+    curPaperUrl() {
+      return this.curPages[this.curPaperIndex];
+    }
+  },
+  methods: {
+    visibleChange() {
+      this.modalForm = { ...initModalForm };
+      this.studentNameOrNo = "";
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    nameOrNoInput() {
+      this.clearSetTs();
+
+      this.addSetTime(() => {
+        this.getStudentList();
+      }, this.inputSearchDelay);
+    },
+    async getStudentList() {
+      const datas = {
+        queryParams: this.studentNameOrNo,
+        pageNumber: 1,
+        pageSize: 30
+      };
+      const data = await studentListQuery(datas);
+      this.studentList = data.records;
+    },
+    toNextPaper() {},
+    toBind(row) {
+      this.modalForm.studentId = row.id;
+      this.confirm();
+    },
+    async confirm() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+
+      if (this.loading) return;
+      this.loading = true;
+
+      const res = await paperBindUser(this.modalForm).catch(() => {});
+      this.loading = false;
+
+      if (!res) return;
+
+      this.$message.success("绑定成功！");
+      this.toNextPaper();
+    }
+  }
+};
+</script>

src/modules/record/views/DataCheckManage.vue

@@ -138,16 +138,19 @@
       ref="ImageListPreview"
       :image-list="curImageList"
     ></image-list-preview>
+    <!-- DataCheckDialog -->
+    <data-check-dialog ref="DataCheckDialog"></data-check-dialog>
   </div>
 </template>
 
 <script>
 import { dataCheckUndoListPage, dataCheckDoneListPage } from "../api";
 import ImageListPreview from "../../../components/ImageListPreview.vue";
+import DataCheckDialog from "../components/DataCheckDialog.vue";
 
 export default {
   name: "data-check-manage",
-  components: { ImageListPreview },
+  components: { ImageListPreview, DataCheckDialog },
   data() {
     return {
       filter: {