home md

src/assets/styles/home.scss

@@ -9,7 +9,7 @@
 .home-body {
   position: absolute;
   left: 0;
-  top: 61px;
+  top: 60px;
   right: 0;
   bottom: 0;
   overflow: auto;
@@ -18,47 +18,23 @@
 }
 .home-main {
   position: relative;
-  padding: 20px 20px 60px 260px;
+  padding: 0 0 60px 240px;
   min-height: 100%;
   transition: padding-left 0.2s ease;
   min-width: 1366px;
 }
-.home-body-big .home-main {
-  padding-left: 80px;
-}
-
-/* view-footer */
-.home-footer {
-  position: absolute;
-  width: 100%;
-  height: 60px;
-  bottom: 0;
-  left: 0;
-  z-index: auto;
-  padding: 20px 0;
-  line-height: 20px;
-  color: $--color-text-secondary;
-  text-align: center;
-  font-size: 13px;
-}
-.home-footer a {
-  color: $--color-text-secondary;
-}
-.home-footer a:hover {
-  color: $--color-text-primary;
-}
 
 /* navs */
 .home-navs {
   position: absolute;
-  width: 288px;
-  top: 72px;
+  width: 240px;
+  top: 60px;
   left: 0;
   bottom: 0;
   z-index: 99;
   overflow: auto;
   background: #fff;
-  text-align: left;
+  font-size: 16px;
   background: linear-gradient(
     90deg,
     rgba(247, 247, 247, 1) 0%,
@@ -77,101 +53,73 @@
     background: rgba(229, 229, 229, 1);
   }
 
-  .nav-top {
-    padding: 30px;
+  .nav-head {
+    padding: 20px 30px;
     color: $--color-text-secondary;
-    font-size: 22px;
+    font-size: 18px;
+    line-height: 40px;
     font-weight: bold;
     border-bottom: 1px solid #e9e9e9;
     > i {
-      margin-right: 11px;
+      margin-right: 12px;
     }
     > span {
       display: inline-block;
       vertical-align: middle;
     }
   }
-}
 
-.nav-item {
-  overflow: hidden;
-}
-.nav-item-main {
-  padding: 15px 35px 15px 45px;
-  line-height: 20px;
-  min-height: 50px;
-  position: relative;
-  cursor: pointer;
-  font-weight: 600;
-}
-.nav-item-main-act,
-.nav-item-main-act .nav-item-icon-right {
-  color: $--color-primary;
-}
-.nav-item-main:hover {
-  color: $--color-primary;
-}
-.nav-item-icon {
-  display: block;
-  position: absolute;
-  width: 20px;
-  height: 20px;
-  top: 14px;
-  text-align: center;
-}
-.nav-item-icon-left {
-  left: 15px;
-  font-size: 18px;
-  transition: all 0.2s ease;
-}
-.nav-item-icon-right {
-  right: 10px;
-  color: $--color-text-secondary;
-}
+  .nav-list {
+    padding: 0 30px;
+  }
+  .nav-item {
+    overflow: hidden;
 
-.nav-item-sublist {
-  overflow: hidden;
-  transition: height 0.2s linear;
-}
-.nav-sublist-hide {
-  height: 0 !important;
-}
-.nav-item-sub {
-  line-height: 20px;
-  padding: 10px 5px 10px 45px;
-  border-right: 2px solid transparent;
-  cursor: pointer;
-  position: relative;
-}
-.nav-item-sub:hover {
-  color: $--color-primary;
-}
-.nav-item-sub-act {
-  background-color: mix(#ffffff, $--color-primary, 90%);
-  color: $--color-primary !important;
-  border-color: $--color-primary;
+    border-bottom: 1px solid $--color-border;
+    &-main {
+      padding: 15px 0;
+      line-height: 30px;
+      position: relative;
+      cursor: pointer;
+      font-weight: bold;
+      &-act,
+      &:hover {
+        color: $--color-primary;
+      }
+    }
+    &-icon {
+      display: block;
+      position: absolute;
+      width: 20px;
+      height: 20px;
+      top: 20px;
+      text-align: center;
+      line-height: 20px;
+    }
+    &-icon-right {
+      right: 10px;
+    }
+  }
 }
 
 /* head */
 .home-header {
   position: absolute;
   width: 100%;
-  height: 72px;
+  height: 60px;
   top: 0;
   left: 0;
   z-index: 100;
   color: #fff;
   background-color: $--color-blue;
-
   overflow: hidden;
 
   .head-logo {
-    width: 288px;
+    width: 240px;
     float: left;
-    padding: 16px 20px;
-    font-size: 24px;
-    padding: 16px 20px;
-    line-height: 40px;
+    padding: 15px 20px;
+    font-size: 20px;
+    line-height: 30px;
   }
   .head-menu {
     float: left;
@@ -189,10 +137,10 @@
       display: inline-block;
       vertical-align: top;
       width: 190px;
-      padding: 16px 0;
-      line-height: 40px;
+      padding: 15px 0;
+      line-height: 30px;
       opacity: 0.5;
-      font-size: 19px;
+      font-size: 16px;
       position: relative;
       text-align: center;
       cursor: pointer;
@@ -211,8 +159,8 @@
         position: absolute;
         left: 0;
         top: 50%;
-        margin-top: -12px;
-        height: 24px;
+        margin-top: -10px;
+        height: 20px;
         border-left: 1px solid rgba(255, 255, 255, 0.1);
       }
 
@@ -225,15 +173,70 @@
   }
 }
 
+// home-breadcrumb
+.home-breadcrumb {
+  padding: 25px 30px;
+  .el-breadcrumb {
+    line-height: 30px;
+    font-weight: bold;
+
+    .el-breadcrumb__item {
+      .el-breadcrumb__inner {
+        color: #aaaaaa;
+      }
+
+      &:last-child {
+        .el-breadcrumb__inner {
+          color: $--color-text-regular;
+          font-weight: bold;
+        }
+      }
+
+      &:first-child {
+        margin-right: 12px;
+        .el-breadcrumb__separator {
+          display: none;
+        }
+      }
+    }
+  }
+}
+
+// home-view
+.home-view {
+  padding: 0 30px;
+}
+
+/* view-footer */
+.home-footer {
+  position: absolute;
+  width: 100%;
+  height: 60px;
+  bottom: 0;
+  left: 0;
+  z-index: auto;
+  padding: 20px 0;
+  line-height: 20px;
+  color: $--color-text-secondary;
+  text-align: center;
+  font-size: 13px;
+  a {
+    color: $--color-text-secondary;
+  }
+  a:hover {
+    color: $--color-text-primary;
+  }
+}
+
 /* part */
 .part-box {
-  box-shadow: 0 0 2px 1px #e9e9e9;
-  padding: 20px 30px;
-  margin-bottom: 15px;
+  border: 1px solid $--color-border;
+  margin-bottom: 20px;
   background-color: #fff;
+  border-radius: $--border-radius;
 
-  .ivu-form-item-label {
-    text-align: right;
+  &.part-pad {
+    padding: 20px;
   }
 }
 .part-title {

src/assets/styles/icons.scss

@@ -38,9 +38,19 @@
   &-score-paper {
     background-image: url(../images/icon-score-paper.png);
   }
+  &-score-paper-gray {
+    background-image: url(../images/icon-score-paper-gray.png);
+    width: 24px;
+    height: 24px;
+  }
   &-analyze {
     background-image: url(../images/icon-analyze.png);
   }
+  &-analyze-gray {
+    background-image: url(../images/icon-analyze-gray.png);
+    width: 24px;
+    height: 24px;
+  }
   &-base {
     background-image: url(../images/icon-base.png);
   }

src/constants/navs.js

@@ -5,27 +5,27 @@ const navs = [
     children: [
       {
         title: "待办任务",
-        router: "DataManage"
+        router: "WaitTask"
       },
       {
         title: "已办任务",
-        router: "DataManage"
+        router: "DoneTask"
       },
       {
         title: "考试管理",
-        router: "DataManage"
+        router: "ExamManage"
       },
       {
         title: "题卡管理",
-        router: "DataManage"
+        router: "CardManage"
       },
       {
         title: "印刷管理",
-        router: "DataManage"
+        router: "PrintManage"
       },
       {
         title: "题卡审核",
-        router: "DataManage"
+        router: "CardCheck"
       }
     ]
   },
@@ -34,8 +34,8 @@ const navs = [
     type: "score-paper",
     children: [
       {
-        title: "通用数据管理模板",
-        router: "DataManage"
+        title: "班级报表",
+        router: "ClassPaper"
       }
     ]
   },
@@ -44,8 +44,8 @@ const navs = [
     type: "analyze",
     children: [
       {
-        title: "通用数据管理模板",
-        router: "DataManage"
+        title: "分数分析",
+        router: "ScoreAnalyze"
       }
     ]
   },
@@ -55,15 +55,15 @@ const navs = [
     children: [
       {
         title: "用户管理",
-        router: "DataManage"
+        router: "UserManage"
       },
       {
         title: "密码管理",
-        router: "DataManage"
+        router: "PswdManage"
       },
       {
         title: "规则管理",
-        router: "DataManage"
+        router: "CardSettingManage"
       }
     ]
   }

src/modules/analyze/api.js

@@ -0,0 +1,19 @@
+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/analyze/components/ModifyData.vue

@@ -0,0 +1,114 @@
+<template>
+  <el-dialog
+    class="modify-data"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @open="visibleChange"
+  >
+    <el-form
+      ref="modalFormComp"
+      :model="modalForm"
+      :rules="rules"
+      :key="modalForm.id"
+      label-width="100px"
+    >
+      <el-form-item prop="name" label="年级名称">
+        <el-input
+          v-model.trim="modalForm.name"
+          placeholder="请输入年级名称"
+          clearable
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+    </div>
+  </el-dialog>
+</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() {
+      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/analyze/router.js

@@ -0,0 +1,9 @@
+import ScoreAnalyze from "./views/ScoreAnalyze.vue";
+
+export default [
+  {
+    path: "/analyze/score-analyze",
+    name: "ScoreAnalyze",
+    component: ScoreAnalyze
+  }
+];

src/modules/analyze/views/ScoreAnalyze.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/base/api.js

@@ -0,0 +1,19 @@
+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/base/components/ModifyData.vue

@@ -0,0 +1,114 @@
+<template>
+  <el-dialog
+    class="modify-data"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @open="visibleChange"
+  >
+    <el-form
+      ref="modalFormComp"
+      :model="modalForm"
+      :rules="rules"
+      :key="modalForm.id"
+      label-width="100px"
+    >
+      <el-form-item prop="name" label="年级名称">
+        <el-input
+          v-model.trim="modalForm.name"
+          placeholder="请输入年级名称"
+          clearable
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+    </div>
+  </el-dialog>
+</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() {
+      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/base/router.js

@@ -0,0 +1,21 @@
+import CardSettingManage from "./views/CardSettingManage.vue";
+import UserManage from "./views/UserManage.vue";
+import PswdManage from "./views/PswdManage.vue";
+
+export default [
+  {
+    path: "/base/user-manage",
+    name: "UserManage",
+    component: UserManage
+  },
+  {
+    path: "/base/pswd-manage",
+    name: "PswdManage",
+    component: PswdManage
+  },
+  {
+    path: "/base/card-setting-manage",
+    name: "CardSettingManage",
+    component: CardSettingManage
+  }
+];

src/modules/base/views/CardSettingManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/base/views/PswdManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="pswd-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "pswd-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/base/views/UserManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/api.js

@@ -0,0 +1,19 @@
+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/exam-center/components/ModifyData.vue

@@ -0,0 +1,114 @@
+<template>
+  <el-dialog
+    class="modify-data"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @open="visibleChange"
+  >
+    <el-form
+      ref="modalFormComp"
+      :model="modalForm"
+      :rules="rules"
+      :key="modalForm.id"
+      label-width="100px"
+    >
+      <el-form-item prop="name" label="年级名称">
+        <el-input
+          v-model.trim="modalForm.name"
+          placeholder="请输入年级名称"
+          clearable
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+    </div>
+  </el-dialog>
+</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() {
+      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/exam-center/router.js

@@ -0,0 +1,39 @@
+import WaitTask from "./views/WaitTask.vue";
+import CardCheck from "./views/CardCheck.vue";
+import PrintManage from "./views/PrintManage.vue";
+import DoneTask from "./views/DoneTask.vue";
+import ExamManage from "./views/ExamManage.vue";
+import CardManage from "./views/CardManage.vue";
+
+export default [
+  {
+    path: "/exam-center/done-task",
+    name: "DoneTask",
+    component: DoneTask
+  },
+  {
+    path: "/exam-center/print-task",
+    name: "PrintManage",
+    component: PrintManage
+  },
+  {
+    path: "/exam-center/exam-manage",
+    name: "ExamManage",
+    component: ExamManage
+  },
+  {
+    path: "/exam-center/card-manage",
+    name: "CardManage",
+    component: CardManage
+  },
+  {
+    path: "/exam-center/card-check",
+    name: "CardCheck",
+    component: CardCheck
+  },
+  {
+    path: "/exam-center/wait-manage",
+    name: "WaitTask",
+    component: WaitTask
+  }
+];

src/modules/exam-center/views/CardCheck.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/views/CardManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/views/DoneTask.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/views/ExamManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/views/PrintManage.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/exam-center/views/WaitTask.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/modules/score-paper/api.js

@@ -0,0 +1,19 @@
+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/score-paper/components/ModifyData.vue

@@ -0,0 +1,114 @@
+<template>
+  <el-dialog
+    class="modify-data"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    :close-on-click-modal="false"
+    :close-on-press-escape="false"
+    append-to-body
+    @open="visibleChange"
+  >
+    <el-form
+      ref="modalFormComp"
+      :model="modalForm"
+      :rules="rules"
+      :key="modalForm.id"
+      label-width="100px"
+    >
+      <el-form-item prop="name" label="年级名称">
+        <el-input
+          v-model.trim="modalForm.name"
+          placeholder="请输入年级名称"
+          clearable
+        ></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button type="danger" @click="cancel" plain>取消</el-button>
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+    </div>
+  </el-dialog>
+</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() {
+      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/score-paper/router.js

@@ -0,0 +1,9 @@
+import ClassPaper from "./views/ClassPaper.vue";
+
+export default [
+  {
+    path: "/score-paper/class-paper",
+    name: "ClassPaper",
+    component: ClassPaper
+  }
+];

src/modules/score-paper/views/ClassPaper.vue

@@ -0,0 +1,183 @@
+<template>
+  <div class="data-manage">
+    <div class="part-box">
+      <el-form ref="FilterForm" label-position="left" label-width="80px" inline>
+        <el-form-item label="年级名称">
+          <el-input
+            v-model.trim="filter.name"
+            placeholder="年级名称模糊查询"
+            clearable
+          ></el-input>
+        </el-form-item>
+        <el-form-item label="年级状态">
+          <el-select v-model="filter.status" style="width: 150px;" clearable>
+            <el-option
+              v-for="(val, key) in ABLE_TYPE"
+              :key="key"
+              :value="key"
+              :label="val"
+            ></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label-width="0px">
+          <el-button type="primary" icon="ios-search" @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+    </div>
+
+    <div class="part-box">
+      <div class="part-title">
+        <div class="part-title-infos">
+          <el-button type="primary" icon="md-add" @click="toAdd"
+            >新增</el-button
+          >
+        </div>
+      </div>
+      <el-table ref="TableList" :data="grades" border>
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          align="center"
+          :index="indexMethod"
+        >
+        </el-table-column>
+        <el-table-column prop="name" label="年级名称" min-width="200">
+        </el-table-column>
+        <el-table-column prop="status" label="状态" min-width="200">
+          <template slot-scope="scope">
+            <span>{{ ABLE_TYPE[scope.row.status] }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column min-width="200" align="center">
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-edit"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              size="mini"
+              type="danger"
+              icon="el-icon-delete"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="prev, pager, next"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+        >
+        </el-pagination>
+      </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 } from "../api";
+import ModifyData from "../components/ModifyData";
+
+export default {
+  name: "data-manage",
+  components: { ModifyData },
+  data() {
+    return {
+      filter: {
+        name: "",
+        status: ""
+      },
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      visible: false,
+      grades: [
+        {
+          id: "11",
+          name: "名称1",
+          status: "ENABLE"
+        },
+        {
+          id: "22",
+          name: "名称2",
+          status: "ENABLE"
+        },
+        {
+          id: "33",
+          name: "名称3",
+          status: "ENABLE"
+        }
+      ],
+      curCourse: {},
+      ABLE_TYPE
+    };
+  },
+  created() {
+    // this.getList();
+  },
+  methods: {
+    indexMethod(index) {
+      return (this.current - 1) * this.size + index + 1;
+    },
+    async getList() {
+      const datas = {
+        ...this.filter,
+        current: this.current,
+        size: this.size
+      };
+      const data = await courseList(datas);
+      this.grades = 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();
+    },
+    toDelete(row) {
+      this.$confirm("确定要删除当前学校吗？", "删除警告", {
+        callback: async action => {
+          if (action !== "confirm") return;
+          await deleteCourse(row.id);
+          this.$message.success("删除成功！");
+          // 解决最后一项删除后的问题
+          this.deletePageLastItem();
+        }
+      });
+    }
+  }
+};
+</script>

src/router.js

@@ -5,7 +5,10 @@ import Home from "./views/Home.vue";
 import login from "./modules/login/router";
 import account from "./modules/account/router";
 // module-example
-import example from "./modules/example/router";
+import base from "./modules/base/router";
+import examCenter from "./modules/exam-center/router";
+import scorePaper from "./modules/score-paper/router";
+import analyze from "./modules/analyze/router";
 
 Vue.use(Router);
 
@@ -20,7 +23,7 @@ export default new Router({
       path: "/home",
       name: "Home",
       component: Home,
-      children: [...account, ...example]
+      children: [...account, ...base, ...examCenter, ...scorePaper, ...analyze]
     },
     { ...login }
     // [lazy-loaded] route level code-splitting

src/views/Home.vue

@@ -10,7 +10,7 @@
             v-for="(nav, index) in navs"
             :key="index"
             @click="toPage(index, 0)"
-            :class="{ 'menu-item-act': curNav.title === nav.title }"
+            :class="{ 'menu-item-act': curMainIndex === index }"
           >
             <div class="menu-item">
               <i :class="['icon', `icon-${nav.type}`]"></i>
@@ -37,35 +37,32 @@
       </div>
     </div>
 
-    <div class="home-navs" :class="{ 'home-navs-tiny': isCollapsed }">
-      <div class="nav-top">
+    <div class="home-navs">
+      <div class="nav-head">
         <i :class="['icon', `icon-${curNav.type}-gray`]"></i>
         <span>{{ curNav.title }}</span>
       </div>
-      <ul>
+      <ul class="nav-list">
         <li
           class="nav-item"
-          v-for="(nav, index) in curNav.children"
-          :key="index"
+          v-for="(nav, subNo) in curNav.children"
+          :key="subNo"
         >
           <div
             :class="[
               'nav-item-main',
-              { 'nav-item-main-act': curMain === index }
+              { 'nav-item-main-act': curSubIndex === subNo }
             ]"
-            @click="switchNav(nav, index)"
+            @click="switchNav(subNo)"
           >
-            <span class="nav-item-icon nav-item-icon-left">
-              <i :class="nav.icon"></i>
-            </span>
             <p class="nav-item-cont">{{ nav.title }}</p>
-            <span
-              class="nav-item-icon nav-item-icon-right"
-              v-if="nav.children && nav.children.length"
-            >
+            <span class="nav-item-icon nav-item-icon-right">
               <i
                 :class="[
-                  nav.showList ? 'el-icon-caret-bottom' : 'el-icon-caret-right'
+                  'icon',
+                  curSubIndex === subNo
+                    ? 'icon-arrow-right-act'
+                    : 'icon-arrow-right'
                 ]"
               ></i>
             </span>
@@ -77,9 +74,9 @@
     <div class="home-body" :class="{ 'home-body-big': isCollapsed }">
       <div class="home-main">
         <div class="home-breadcrumb">
-          <el-breadcrumb>
+          <el-breadcrumb separator=">">
             <el-breadcrumb-item :to="{ name: 'Home' }">
-              <i class="el-icon-s-home" style="margin-top: -4px;"></i>
+              <i class="icon icon-home" style="margin-top: -2px;"></i>
             </el-breadcrumb-item>
             <el-breadcrumb-item
               v-for="(bread, index) in breadcrumbs"
@@ -89,8 +86,10 @@
           </el-breadcrumb>
         </div>
 
-        <!-- page-detail -->
-        <router-view />
+        <!-- home-view: page detail -->
+        <div class="home-view">
+          <router-view />
+        </div>
       </div>
     </div>
   </div>
@@ -105,9 +104,8 @@ export default {
     return {
       isCollapsed: false,
       navs,
-      curNav: navs[0],
-      curMain: 0,
-      curSub: "",
+      curMainIndex: 0,
+      curSubIndex: 0,
       breadcrumbs: []
     };
   },
@@ -116,19 +114,18 @@ export default {
       this.actCurNav();
     }
   },
+  computed: {
+    curNav() {
+      return this.navs[this.curMainIndex];
+    }
+  },
   mounted() {
     this.actCurNav();
   },
   methods: {
-    switchNav(item, mainIndex) {
-      if (item.children) {
-        item.showList = !item.showList;
-      } else {
-        this.breadcrumbs = [{ title: item.title, router: item.router }];
-        this.curMain = mainIndex;
-        this.curSub = "";
-        this.$router.push({ name: item.router });
-      }
+    switchNav(subNo) {
+      const curSubItem = this.curNav.children[subNo];
+      this.$router.push({ name: curSubItem.router });
     },
     actCurNav() {
       let router = this.$route.name;
@@ -136,8 +133,8 @@ export default {
         if (item.children && item.children.length) {
           item.children.forEach((elem, pindex) => {
             if (elem.router === router) {
-              this.curSub = index + "-" + pindex;
-              this.curMain = index;
+              this.curSubIndex = pindex;
+              this.curMainIndex = index;
               this.breadcrumbs = [
                 { title: item.title, router: item.router },
                 { title: elem.title, router: elem.router }
@@ -146,24 +143,14 @@ export default {
           });
         } else {
           if (item.router === router) {
-            this.curMain = index;
+            this.curMainIndex = index;
             this.breadcrumbs = [{ title: item.title, router: item.router }];
           }
         }
       });
-      this.navs[this.curMain].showList = true;
     },
     toPage(mainIndex, subIndex) {
-      const item = this.navs[mainIndex];
-      const elem = item.children[subIndex];
-      this.breadcrumbs = [
-        { title: item.title, router: item.router },
-        { title: elem.title, router: elem.router }
-      ];
-      this.curNav = this.navs[mainIndex];
-      this.curMain = mainIndex;
-      this.curSub = mainIndex + "-" + subIndex;
-
+      const elem = this.navs[mainIndex].children[subIndex];
       this.$router.push({
         name: elem.router
       });