消息窗口

src/assets/styles/iview-custom.less

@@ -1,257 +1,255 @@
-/* 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-item-label {
-    font-weight: 600;
-    color: @dark-color;
-  }
-}
-.ivu-form-inline {
-  .ivu-form-item {
-    margin-bottom: 10px;
-    margin-right: 20px;
-  }
-  .ivu-form-item-label,
-  .ivu-form-item-content {
-    display: inline-block;
-    vertical-align: middle;
-  }
-}
-.modal-form {
-  .ivu-form-item-label {
-    font-size: 16px;
-    padding-top: 12px;
-    padding-bottom: 12px;
-  }
-}
-// ivu-select
-.ivu-select {
-  min-width: 140px;
-  &-disabled {
-    .ivu-select-selection {
-      color: @btn-disable-color;
-      background-color: @btn-disable-bg;
-    }
-  }
-}
-
-// input
-.ivu-input {
-  &-wrapper {
-    min-width: 140px;
-  }
-}
-.input-huge {
-  > .ivu-icon {
-    line-height: 50px;
-    right: 5px;
-  }
-  .ivu-input {
-    height: 50px;
-    border-radius: @box-border-radius-large;
-
-    &-with-prefix {
-      padding-left: 40px;
-      padding-right: 20px;
-    }
-    &-prefix {
-      width: 40px;
-      padding-left: 10px;
-      i {
-        line-height: 50px;
-      }
-    }
-  }
-}
-// ivu-input-number
-.ivu-input-number {
-  min-width: 140px;
-}
-
-// 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;
-}
-
-.table-action {
-  .ivu-icon {
-    color: @dark-color-light;
-    margin: 0 6px;
-    transition: transform 0.1s linear;
-    cursor: pointer;
-
-    &:hover {
-      color: @primary-color;
-      transform: scale(1.3, 1.3);
-    }
-  }
-  .icon-act {
-    color: @info-color;
-  }
-  .icon-danger {
-    &:hover {
-      color: @error-color;
-    }
-  }
-}
-// ivu-page
-.ivu-page {
-  &-item {
-    border-radius: @box-border-radius-small;
-    height: 32px;
-    width: 32px;
-    line-height: 30px;
-    min-width: 32px;
-    a {
-      color: @dark-color-lighter;
-    }
-
-    &-active {
-      background-color: @primary-color;
-      a {
-        color: @white;
-        &:hover {
-          color: @white;
-        }
-      }
-    }
-  }
-
-  &-prev,
-  &-next {
-    border-radius: @box-border-radius-small;
-    height: 32px;
-    width: 32px;
-    line-height: 30px;
-    min-width: 32px;
-  }
-
-  &-options-sizer {
-    width: 80px;
-    .ivu-select {
-      min-width: auto;
-      width: 100%;
-    }
-  }
-}
-
-/* button */
-.ivu-btn + .ivu-btn {
-  margin-left: 10px;
-}
-.ivu-btn-default {
-  .ivu-icon {
-    font-size: 16px;
-    color: @primary-color;
-  }
-}
-
-// ivu-modal
-.ivu-modal {
-  &-content {
-    border-radius: @box-border-radius;
-  }
-  &-header {
-    padding: 15px;
-    &-inner {
-      font-weight: 600;
-      font-size: 18px;
-      line-height: 25px;
-      text-align: center;
-    }
-  }
-  &-body {
-    padding: 32px 20px 0;
-  }
-  &-mask {
-    background: rgba(53, 61, 87, 0.65);
-  }
-  &-footer {
-    border: none;
-    text-align: center;
-    .ivu-btn {
-      min-width: 80px;
-      &:not(:first-child) {
-        margin-left: 20px;
-      }
-    }
-  }
-  // $Modal.confirm
-  &-confirm {
-    padding: 16px 0 48px 0;
-    text-align: center;
-    &-body {
-      padding: 0 0 40px;
-      font-size: 18px;
-      color: @dark-color;
-      font-weight: 600;
-    }
-    &-footer {
-      text-align: center;
-
-      .ivu-btn {
-        border-radius: @box-border-radius;
-        margin: 0 10px;
-        width: 80px;
-      }
-    }
-  }
-}
+/* 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-item-label {
+    font-weight: 600;
+    color: @dark-color;
+  }
+}
+.ivu-form-inline {
+  .ivu-form-item {
+    margin-bottom: 10px;
+    margin-right: 20px;
+  }
+  .ivu-form-item-label,
+  .ivu-form-item-content {
+    display: inline-block;
+    vertical-align: middle;
+  }
+}
+.modal-form {
+  .ivu-form-item-label {
+    font-size: 16px;
+    padding-top: 12px;
+    padding-bottom: 12px;
+  }
+}
+// ivu-select
+.ivu-select {
+  min-width: 140px;
+  &-disabled {
+    .ivu-select-selection {
+      color: @btn-disable-color;
+      background-color: @btn-disable-bg;
+    }
+  }
+}
+
+// input
+.ivu-input {
+  &-wrapper {
+    min-width: 140px;
+  }
+}
+.input-huge {
+  > .ivu-icon {
+    line-height: 50px;
+    right: 5px;
+  }
+  .ivu-input {
+    height: 50px;
+    border-radius: @box-border-radius-large;
+
+    &-with-prefix {
+      padding-left: 40px;
+      padding-right: 20px;
+    }
+    &-prefix {
+      width: 40px;
+      padding-left: 10px;
+      i {
+        line-height: 50px;
+      }
+    }
+  }
+}
+// ivu-input-number
+.ivu-input-number {
+  min-width: 140px;
+}
+
+// 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;
+}
+
+.table-action {
+  .ivu-icon {
+    color: @dark-color-light;
+    margin: 0 6px;
+    transition: transform 0.1s linear;
+    cursor: pointer;
+
+    &:hover {
+      color: @primary-color;
+      transform: scale(1.3, 1.3);
+    }
+  }
+  .icon-act {
+    color: @info-color;
+  }
+  .icon-danger {
+    &:hover {
+      color: @error-color;
+    }
+  }
+}
+// ivu-page
+.ivu-page {
+  &-item {
+    border-radius: @box-border-radius-small;
+    height: 32px;
+    width: 32px;
+    line-height: 30px;
+    min-width: 32px;
+    a {
+      color: @dark-color-lighter;
+    }
+
+    &-active {
+      background-color: @primary-color;
+      a {
+        color: @white;
+        &:hover {
+          color: @white;
+        }
+      }
+    }
+  }
+
+  &-prev,
+  &-next {
+    border-radius: @box-border-radius-small;
+    height: 32px;
+    width: 32px;
+    line-height: 30px;
+    min-width: 32px;
+  }
+
+  &-options-sizer {
+    width: 80px;
+    .ivu-select {
+      min-width: auto;
+      width: 100%;
+    }
+  }
+}
+
+/* button */
+.ivu-btn + .ivu-btn {
+  margin-left: 10px;
+}
+.ivu-btn-default {
+  .ivu-icon {
+    font-size: 16px;
+    color: @primary-color;
+  }
+}
+
+// ivu-modal
+.ivu-modal {
+  &-content {
+    border-radius: @box-border-radius;
+  }
+  &-header {
+    &-inner {
+      font-weight: 600;
+      font-size: 18px;
+      text-align: center;
+    }
+  }
+  &-body {
+    padding: 32px 20px 0;
+  }
+  &-mask {
+    background: rgba(53, 61, 87, 0.65);
+  }
+  &-footer {
+    border: none;
+    text-align: center;
+    .ivu-btn {
+      min-width: 80px;
+      &:not(:first-child) {
+        margin-left: 20px;
+      }
+    }
+  }
+  // $Modal.confirm
+  &-confirm {
+    padding: 16px 0 48px 0;
+    text-align: center;
+    &-body {
+      padding: 0 0 40px;
+      font-size: 18px;
+      color: @dark-color;
+      font-weight: 600;
+    }
+    &-footer {
+      text-align: center;
+
+      .ivu-btn {
+        border-radius: @box-border-radius;
+        margin: 0 10px;
+        width: 80px;
+      }
+    }
+  }
+}

src/assets/styles/marker.less

@@ -883,3 +883,138 @@
     background-color: @color-act1;
   }
 }
+
+// notice-dialog
+.notice-dialog {
+  color: @color-text-act;
+  .ivu-modal-body {
+    padding: 0;
+  }
+
+  .notice-container {
+    height: 100%;
+    display: flex;
+    justify-content: space-between;
+    align-items: stretch;
+  }
+  .notice-users {
+    width: 260px;
+    flex-grow: 0;
+    flex-shrink: 0;
+    overflow: auto;
+    padding: 0 10px;
+    border-right: 1px solid @color-background-light;
+  }
+  .notice-body {
+    flex-grow: 2;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+  }
+  .user-all {
+    padding: 5px 10px;
+    text-align: right;
+    border-bottom: 1px solid @color-background-light;
+
+    .user-selection {
+      display: inline-block;
+      height: 26px;
+      cursor: pointer;
+    }
+  }
+  .user-item {
+    padding: 5px 10px;
+    line-height: 30px;
+    display: flex;
+    justify-content: space-between;
+    align-items: stretch;
+    cursor: pointer;
+
+    &:hover {
+      background-color: @color-background-light;
+    }
+  }
+  .user-name {
+    flex-grow: 2;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .user-avatar {
+    flex-grow: 0;
+    flex-shrink: 0;
+    width: 30px;
+    font-size: 24px;
+  }
+  .user-selection {
+    flex-grow: 0;
+    flex-shrink: 0;
+    width: 30px;
+    font-size: 26px;
+    text-align: right;
+    color: @color-text;
+
+    &.is-active {
+      color: @color-act3;
+    }
+  }
+
+  .notice-content {
+    flex-grow: 2;
+  }
+  .notice-send {
+    flex-grow: 0;
+    flex-shrink: 0;
+    height: 220px;
+    border-top: 1px solid @color-background-light;
+  }
+  .notice-send {
+    textarea {
+      outline: none;
+      border: none;
+      resize: none;
+      background-color: transparent;
+      width: 100%;
+      height: 150px;
+      padding: 10px;
+      font-size: 16px;
+      color: @color-text-act;
+    }
+  }
+  .notice-send-footer {
+    padding: 0 15px;
+    text-align: right;
+  }
+
+  .notice-content {
+    padding: 15px;
+    overflow: auto;
+  }
+  .notice-item {
+    margin-bottom: 30px;
+  }
+  .notice-item-head {
+    margin-bottom: 5px;
+
+    > span {
+      display: inline-block;
+      vertical-align: middle;
+      font-size: 14px;
+      color: @color-text;
+    }
+  }
+  .notice-head-time {
+    display: inline-block;
+    vertical-align: middle;
+    margin-left: 10px;
+  }
+  .notice-item-content {
+    padding: 10px;
+    color: #f0f0f0;
+    line-height: 24px;
+    background-color: @color-background-light;
+    border-radius: 5px;
+    display: inline-block;
+    max-width: 80%;
+  }
+}

src/main.js

@@ -14,6 +14,7 @@ import ViewUI from "view-design";
 import "./assets/styles/index.less";
 // regist v-chart
 import "./plugins/VueCharts";
+import "./plugins/filters";
 
 import { checkRouterValid } from "./constants/authority";
 

src/modules/grading/components/GradeAction.vue

@@ -279,13 +279,13 @@ export default {
         },
         MARK_LEADER: {
           undo: ["gradeList", "gradePass", "gradeInfo"],
-          done: ["gradeList", "gradePass", "gradeHis", "gradeInfo"],
+          done: ["gradeList", "gradeHis", "gradeInfo"],
           reject: ["gradeList", "gradePass", "gradeInfo", "gradeHis"],
           arbitrate: ["gradeList", "gradePass", "gradeHis"],
           batch: ["gradeList"]
         },
         MARKER: {
-          done: ["gradeList", "gradePass", "gradeInfo"],
+          done: ["gradeList", "gradeInfo"],
           undo: ["gradeList", "gradePass"],
           reject: ["gradeList", "gradePass", "gradeInfo"],
           batch: ["gradeList"]

src/modules/grading/components/GradeRibbon.vue

@@ -11,22 +11,28 @@
 
     <!-- RibbonSetDialog -->
     <ribbon-set-dialog ref="RibbonSetDialog"></ribbon-set-dialog>
+    <!-- NoticeDialog -->
+    <notice-dialog ref="NoticeDialog"></notice-dialog>
   </div>
 </template>
 
 <script>
 import RibbonSetDialog from "./RibbonSetDialog";
+import NoticeDialog from "./NoticeDialog";
 
 export default {
   name: "grade-ribbon",
   components: {
-    RibbonSetDialog
+    RibbonSetDialog,
+    NoticeDialog
   },
   data() {
     return {};
   },
   methods: {
-    toNotice() {},
+    toNotice() {
+      this.$refs.NoticeDialog.open();
+    },
     toSet() {
       this.$refs.RibbonSetDialog.open();
     }

src/modules/grading/components/NoticeDialog.vue

@@ -0,0 +1,112 @@
+<template>
+  <Modal
+    class="notice-dialog marker-modal"
+    v-model="modalIsShow"
+    title="消息"
+    :mask-closable="false"
+    footer-hide
+    fullscreen
+    @on-visible-change="visibleChange"
+  >
+    <div class="notice-container">
+      <div v-if="IS_MARK_LEADER" class="notice-users">
+        <div class="user-all">
+          <div
+            :class="['user-selection', { 'is-active': userSelectAll }]"
+            @click="selectAll"
+          >
+            <Icon v-if="userSelectAll" type="ios-checkmark-circle" />
+            <Icon v-else type="md-radio-button-off" />
+          </div>
+        </div>
+        <div
+          v-for="user in users"
+          :key="user.id"
+          class="user-item"
+          @click="selectUser(user)"
+        >
+          <div class="user-avatar"><Icon type="md-contact" /></div>
+          <div class="user-name" :title="user.name">{{ user.name }}</div>
+          <div :class="['user-selection', { 'is-active': user.selected }]">
+            <Icon v-if="user.selected" type="ios-checkmark-circle" />
+            <Icon v-else type="md-radio-button-off" />
+          </div>
+        </div>
+      </div>
+      <div class="notice-body">
+        <div class="notice-content">
+          <div v-for="notice in notices" :key="notice.id" class="notice-item">
+            <div class="notice-item-head">
+              <span class="notice-head-users">
+                {{ notice.sendUsers.map(item => item.name).join("，") }}
+              </span>
+              <span class="notice-head-time">
+                {{ notice.createTime | timestampFilter }}
+              </span>
+            </div>
+            <div class="notice-item-content" v-html="notice.content"></div>
+          </div>
+        </div>
+        <div v-if="IS_MARK_LEADER" class="notice-send">
+          <textarea placeholder="请输入"></textarea>
+          <div class="notice-send-footer">
+            <Button type="primary">发送</Button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </Modal>
+</template>
+
+<script>
+import { noticeList, userList } from "./data";
+
+export default {
+  name: "ribbon-set-dialog",
+  data() {
+    return {
+      modalIsShow: false,
+      curUserRoleType: this.$ls.get("user", { role: "" }).role,
+      userSelectAll: false,
+      users: userList,
+      notices: noticeList
+    };
+  },
+  computed: {
+    IS_MARKER() {
+      return this.curUserRoleType === "MARKER";
+    },
+    IS_MARK_LEADER() {
+      return this.curUserRoleType === "MARK_LEADER";
+    }
+  },
+  mounted() {},
+  methods: {
+    initData() {},
+    visibleChange(visible) {
+      if (visible) {
+        this.initData();
+      }
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    selectChange() {
+      this.userSelectAll = !this.users.some(item => !item.selected);
+    },
+    selectUser(user) {
+      user.selected = !user.selected;
+      this.selectChange();
+    },
+    selectAll() {
+      this.userSelectAll = !this.userSelectAll;
+      this.users.forEach(user => {
+        user.selected = this.userSelectAll;
+      });
+    }
+  }
+};
+</script>

src/modules/grading/components/data.js

@@ -0,0 +1,250 @@
+export const noticeList = [
+  {
+    id: 1,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 3,
+        name: "王五"
+      },
+      {
+        id: 4,
+        name: "赵六"
+      },
+      {
+        id: 5,
+        name: "孙七"
+      }
+    ]
+  },
+  {
+    id: 2,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 3,
+        name: "王五"
+      }
+    ]
+  },
+  {
+    id: 3,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      }
+    ]
+  },
+  {
+    id: 4,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 4,
+        name: "赵六"
+      },
+      {
+        id: 5,
+        name: "孙七"
+      }
+    ]
+  },
+  {
+    id: 5,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 3,
+        name: "王五"
+      },
+      {
+        id: 4,
+        name: "赵六"
+      },
+      {
+        id: 5,
+        name: "孙七"
+      }
+    ]
+  },
+  {
+    id: 6,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 5,
+        name: "孙七"
+      }
+    ]
+  },
+  {
+    id: 7,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      }
+    ]
+  },
+  {
+    id: 8,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      }
+    ]
+  },
+  {
+    id: 9,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      }
+    ]
+  },
+  {
+    id: 10,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      }
+    ]
+  },
+  {
+    id: 11,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      },
+      {
+        id: 2,
+        name: "李四"
+      },
+      {
+        id: 3,
+        name: "王五"
+      }
+    ]
+  },
+  {
+    id: 12,
+    content:
+      "这是一条长暗示法卡几十块，按数据库的这是一条长暗示法卡几十块，按数据库的叫法发卡上，发卡拉时间带了看。发升科技暗示发放。叫法发卡上，发卡拉时间带了看。发升科技暗示发放。",
+    createTime: Date.now(),
+    sendUsers: [
+      {
+        id: 1,
+        name: "张三"
+      }
+    ]
+  }
+];
+
+export const userList = [
+  {
+    id: 1,
+    name: "张三",
+    selected: false
+  },
+  {
+    id: 2,
+    name: "李四",
+    selected: false
+  },
+  {
+    id: 3,
+    name: "王五",
+    selected: false
+  },
+  {
+    id: 4,
+    name: "赵六",
+    selected: false
+  },
+  {
+    id: 5,
+    name: "孙七",
+    selected: false
+  }
+];

src/modules/mark/components/MarkAction.vue

@@ -103,7 +103,7 @@
         </div>
       </div>
     </div>
-    <div class="action-grade-pass" v-if="rights.levelList" @click="toPass">
+    <div class="action-grade-pass" v-if="rights.levelPass" @click="toPass">
       跳过
     </div>
     <!-- mark confirm grade change -->
@@ -251,6 +251,7 @@ const initRights = {
   markInfo: false,
   gradeList: false,
   levelList: false,
+  levelPass: false,
   markHis: false
 };
 
@@ -288,9 +289,9 @@ export default {
         },
         MARKER: {
           done: ["levelList", "gradeInfo", "markInfo"],
-          undo: ["levelList", "gradeInfo"],
+          undo: ["levelList", "levelPass", "gradeInfo"],
           shift: ["gradeChange"],
-          shiftScore: ["levelList", "gradeInfo"]
+          shiftScore: ["levelList", "levelPass", "gradeInfo"]
         }
       },
       filter: {

src/plugins/filters.js

@@ -0,0 +1,6 @@
+import Vue from "vue";
+import { formatDate } from "./utils";
+
+Vue.filter("timestampFilter", function(val) {
+  return val ? formatDate("YYYY-MM-DD HH:mm:ss", new Date(val * 1)) : "";
+});