....

src/constants/constants.js

@@ -7,3 +7,12 @@ export const QUESTION_API = "/api/ecs_ques"; //题库API
 export const EXCHANGE_API = "/api/ecs_outlet"; //接口机
 export const PRINT_API = "/api/ecs_prt";
 export const TASK_API = "/api/ctr/task";
+
+//考试类型
+export const EXAM_TYPE = [
+  { label: "传统", value: "TRADITION" },
+  { label: "网考", value: "ONLINE" },
+  { label: "练习", value: "PRACTICE" },
+  { label: "离线", value: "OFFLINE" },
+  { label: "印刷", value: "PRINT_EXAM" }
+];

src/modules/examwork/view/examInfo.vue

@@ -1,14 +1,388 @@
 <template>
-  <div><section class="content"></section></div>
+  <div>
+    <section class="content" style="margin-top: -10px;">
+      <div class="box box-info">
+        <!-- 正文信息 -->
+        <div class="box-body">
+          <el-form
+            :inline="true"
+            :model="formSearch"
+            label-position="right"
+            label-width="70px"
+          >
+            <el-form-item label="考试名称" class="pull-left">
+              <el-input
+                v-model="formSearch.name"
+                auto-complete="off"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="类型" class="pull-left">
+              <el-select
+                v-model="formSearch.examType"
+                placeholder="请选择"
+                clearable
+              >
+                <el-option
+                  v-for="item in examTypeList"
+                  :label="item.label"
+                  :value="item.value"
+                  :key="item.value"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item class="pull-right buttonframe">
+              <el-button
+                v-if="rolePrivileges.search_exam"
+                size="small"
+                type="primary"
+                icon="search"
+                @click="searchForm"
+                >查询
+              </el-button>
+              <el-button
+                v-if="rolePrivileges.add_exam"
+                size="small"
+                type="primary"
+                icon="plus"
+                @click="addExamInfoDialog"
+                >新增
+              </el-button>
+            </el-form-item>
+          </el-form>
+
+          <!-- 弹出窗口 -->
+          <el-dialog
+            title="请选择考试类型："
+            size="small"
+            :visible.sync="examInfoDialog"
+          >
+            <el-button type="primary" @click="toTradition">传统考试</el-button>
+            <el-button type="primary" @click="toOnline">网络考试</el-button>
+            <el-button type="primary" @click="toPractice">练习考试</el-button>
+            <el-button type="primary" @click="toOffline">离线考试</el-button>
+            <el-button type="primary" @click="toPrint">
+              分布式印刷考试</el-button
+            >
+            <div slot="footer" class="dialog-footer">
+              <el-button @click="examInfoDialog = false;">取 消</el-button>
+            </div>
+          </el-dialog>
+
+          <!-- 页面列表 -->
+          <el-table
+            v-loading="loading"
+            element-loading-text="拼命加载中"
+            :data="tableData"
+            border
+            style="width: 100%;text-align:center;"
+            @selection-change="selectChange"
+          >
+            <el-table-column type="selection" width="50"></el-table-column>
+            <el-table-column prop="id" width="80" label="ID"> </el-table-column>
+            <el-table-column prop="name" width="180" label="考试名称">
+            </el-table-column>
+            <el-table-column width="100" label="考试类型">
+              <template slot-scope="scope">
+                <div>
+                  <span>{{ getExamType(scope.row.examType) }}</span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column prop="beginTime" width="170" label="开始时间">
+            </el-table-column>
+            <el-table-column prop="endTime" width="170" label="结束时间">
+            </el-table-column>
+            <el-table-column prop="updateTime" width="170" label="更新时间">
+            </el-table-column>
+            <el-table-column width="80" label="状态">
+              <template slot-scope="scope">
+                <div>
+                  <span>
+                    <el-tag :type="getTag(scope.row.enable)">
+                      {{ getEnable(scope.row.enable) }}
+                    </el-tag>
+                  </span>
+                </div>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作">
+              <template slot-scope="scope">
+                <div>
+                  <el-button
+                    v-if="rolePrivileges.update_exam"
+                    size="mini"
+                    type="info"
+                    @click="editExamInfoDialog(scope.row);"
+                  >
+                    修改
+                  </el-button>
+                  <el-button
+                    v-if="
+                      !scope.row.enable &&
+                        rolePrivileges.change_exam_availability
+                    "
+                    size="mini"
+                    type="success"
+                    @click="enableById(scope.row);"
+                  >
+                    <i class="fa fa-check" aria-hidden="true"></i>启用
+                  </el-button>
+                  <el-button
+                    v-else-if="rolePrivileges.change_exam_availability"
+                    size="mini"
+                    type="warning"
+                    @click="disableById(scope.row);"
+                  >
+                    <i class="fa fa-close" aria-hidden="true"></i>禁用
+                  </el-button>
+                </div>
+              </template>
+            </el-table-column>
+          </el-table>
+          <div class="page pull-right">
+            <el-pagination
+              @current-change="handleCurrentChange"
+              :current-page="currentPage"
+              :page-size="pageSize"
+              layout="total, prev, pager, next, jumper"
+              :total="total"
+            >
+            </el-pagination>
+          </div>
+        </div>
+      </div>
+    </section>
+  </div>
 </template>
+<style>
+.page {
+  margin-top: 10px;
+}
+
+.buttonframe {
+  margin-left: 20px;
+}
+
+.el-table th > .cell {
+  text-align: center;
+}
 
+.el-textarea__inner {
+  resize: none;
+}
+</style>
 <script>
+import { CORE_API, EXAM_WORK_API, EXAM_TYPE } from "@/constants/constants.js";
+import { mapState } from "vuex";
+
 export default {
   data() {
-    return {};
+    return {
+      rolePrivileges: {
+        search_exam: false,
+        add_exam: false,
+        del_exam: false,
+        update_exam: false,
+        change_exam_availability: false,
+        exam_course_setting: false,
+        exam_org_setting: false
+      },
+      formSearch: {
+        name: "",
+        examType: ""
+      },
+      loading: false,
+      examTypeList: EXAM_TYPE,
+      tableData: [],
+      currentPage: 1,
+      pageSize: 10,
+      total: 10,
+      formLabelWidth: "120px",
+      examInfoDialog: false,
+      examId: "",
+      selectedExamIds: [],
+      button: {}
+    };
+  },
+  computed: {
+    ...mapState({ user: state => state.user }),
+    examIds() {
+      var examIds = "";
+      for (let examId of this.selectedExamIds) {
+        if (!examIds) {
+          examIds += examId;
+        } else {
+          examIds += "," + examId;
+        }
+      }
+      return examIds;
+    }
+  },
+
+  methods: {
+    selectChange(row) {
+      this.selectedExamIds = [];
+      row.forEach((element, index) => {
+        console.log(index);
+        this.selectedExamIds.push(element.id);
+      });
+      console.log(this.selectedExamIds);
+    },
+    getTag(status) {
+      if (status == true) {
+        return "success";
+      } else if (status == false) {
+        return "danger";
+      }
+      return status;
+    },
+    getEnable(enable) {
+      if (enable == true) {
+        return "启用";
+      } else if (enable == false) {
+        return "禁用";
+      }
+      return enable;
+    },
+    enableById(row) {
+      this.$confirm("是否启用该考试？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning"
+      }).then(() => {
+        var url = EXAM_WORK_API + "/exam/enable/" + row.id;
+        this.$http
+          .put(url, {})
+          .then(response => {
+            console.log(response);
+            this.$notify({
+              type: "success",
+              message: "开启成功！"
+            });
+            this.searchForm();
+          })
+          .catch(response => {
+            if (response.status == 500) {
+              this.$notify({
+                showClose: true,
+                message: response.body.desc,
+                type: "error"
+              });
+            }
+          });
+      });
+    },
+    disableById(row) {
+      this.$confirm("是否禁用该考试？", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "error"
+      }).then(() => {
+        var url = EXAM_WORK_API + "/exam/disable/" + row.id;
+        this.$http
+          .put(url, {})
+          .then(response => {
+            console.log(response);
+            this.$notify({
+              type: "success",
+              message: "禁用成功！"
+            });
+            this.searchForm();
+          })
+          .catch(response => {
+            if (response.status == 500) {
+              this.$notify({
+                showClose: true,
+                message: response.body.desc,
+                type: "error"
+              });
+            }
+          });
+      });
+    },
+    handleCurrentChange(val) {
+      this.currentPage = val;
+      this.searchForm();
+    },
+    //查询方法
+    searchForm() {
+      var param = new URLSearchParams(this.formSearch);
+      var url =
+        EXAM_WORK_API +
+        "/exam/queryPage/" +
+        (this.currentPage - 1) +
+        "/" +
+        this.pageSize +
+        "?" +
+        param;
+      this.loading = true;
+      this.$http.get(url).then(response => {
+        console.log(response);
+        this.tableData = response.data.list;
+        this.total = response.data.total;
+        this.loading = false;
+      });
+    },
+    addExamInfoDialog() {
+      this.examInfoDialog = true;
+      this.examId = "";
+    },
+    editExamInfoDialog(row) {
+      if (row.examType == "ONLINE") {
+        this.$router.push({ path: "/index/onlineExam/" + row.id });
+      } else if (row.examType == "TRADITION") {
+        this.$router.push({ path: "/index/traditionExam/" + row.id });
+      } else if (row.examType == "PRACTICE") {
+        this.$router.push({ path: "/index/practiceExam/" + row.id });
+      } else if (row.examType == "OFFLINE") {
+        this.$router.push({ path: "/index/offlineExam/" + row.id });
+      } else if (row.examType == "PRINT_EXAM") {
+        this.$router.push({ path: "/index/printExam/" + row.id });
+      }
+    },
+    showExamCourseSettingsDialog(row) {
+      this.$router.push({ path: "/index/examCourseSettings/" + row.id });
+    },
+    showExamOrgSettingsDialog(row) {
+      this.$router.push({ path: "/index/examOrgSettings/" + row.id });
+    },
+    toTradition() {
+      this.$router.push({ path: "/index/traditionExam/add" });
+    },
+    toOnline() {
+      this.$router.push({ path: "/index/onlineExam/add" });
+    },
+    toPractice() {
+      this.$router.push({ path: "/index/practiceExam/add" });
+    },
+    toOffline() {
+      this.$router.push({ path: "/index/offlineExam/add" });
+    },
+    toPrint() {
+      this.$router.push({ path: "/index/printExam/add" });
+    },
+    getExamType(examType) {
+      for (let tempExamType of this.examTypeList) {
+        if (tempExamType.value == examType) {
+          return tempExamType.label;
+        }
+      }
+    },
+    initPrivileges() {
+      let params = new URLSearchParams({
+        privilegeCodes: Object.keys(this.rolePrivileges).toString()
+      });
+      let url = CORE_API + "/rolePrivilege/checkPrivileges?" + params;
+      this.$http.post(url).then(response => {
+        this.rolePrivileges = response.data;
+      });
+    }
   },
-  methods: {},
-  created() {}
+  //初始化查询
+  created() {
+    this.initPrivileges();
+    this.searchForm();
+  }
 };
 </script>
-<style scoped></style>