课程目标模板管理

src/components/UploadFetchFile.vue

@@ -26,7 +26,7 @@
 import { fileMD5 } from "@/plugins/md5";
 
 export default {
-  name: "upload-file-view",
+  name: "upload-fetch-file",
   props: {
     inputWidth: {
       type: String,

src/modules/base/api.js

@@ -232,6 +232,24 @@ export const downloadCardFile = (id) => {
     }
   );
 };
+// course-target-template-manage
+export const courseTargetTemplateListPage = (datas) => {
+  return $postParam("/api/admin/basic/course-target-template/list", datas);
+};
+export const deleteCourseTargetTemplate = (id) => {
+  return $postParam("/api/admin/basic/course-target-template/delete_batch", {
+    id,
+  });
+};
+export const updateCourseTargetTemplate = (datas, config = {}) => {
+  return $post("/api/admin/basic/course-target-template/save", datas, config);
+};
+export const ableCourseTargetTemplate = ({ id, enable }) => {
+  return $postParam("/api/admin/basic/course-target-template/enable", {
+    id,
+    enable,
+  });
+};
 // course-manage
 export const courseListPage = (datas) => {
   return $postParam("/api/admin/basic/course/list", datas);

src/modules/base/components/ModifyCourseTargetTemplate.vue

@@ -0,0 +1,169 @@
+<template>
+  <el-dialog
+    class="modify-course-target-template"
+    :visible.sync="modalIsShow"
+    :title="title"
+    top="10vh"
+    width="600px"
+    :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-item prop="uploadData" label="模板文件：">
+        <upload-fetch-file
+          input-width="320px"
+          :format="format"
+          @valid-change="validChange"
+          @file-change="fileChange"
+          ref="UploadFetchFile"
+        ></upload-fetch-file>
+        <p class="tips-info">
+          上传的文件只支持{{ format.join(",") }}，大小不超过2M
+        </p>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button type="primary" :disabled="isSubmit" @click="submit"
+        >确认</el-button
+      >
+      <el-button @click="cancel">取消</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { updateCourseTargetTemplate } from "../api";
+import UploadFetchFile from "@/components/UploadFetchFile";
+
+const initModalForm = {
+  id: null,
+  name: "",
+};
+
+export default {
+  name: "modify-course-target-template",
+  components: { UploadFetchFile },
+  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",
+          },
+          {
+            message: "模板名称不能超过100个字符",
+            max: 100,
+            trigger: "change",
+          },
+        ],
+        uploadData: [
+          {
+            required: true,
+            validator: (rule, value, callback) => {
+              if (this.uploadData) {
+                callback();
+              } else {
+                return callback(new Error(`请选择合适的文件`));
+              }
+            },
+            trigger: "change",
+          },
+        ],
+      },
+      // upload
+      format: ["doc", "docx"],
+      maxSize: 2 * 1024 * 1024,
+      uploadData: null,
+    };
+  },
+  methods: {
+    initData(val) {
+      if (val.id) {
+        this.modalForm = this.$objAssign(initModalForm, val);
+      } else {
+        this.modalForm = { ...initModalForm };
+      }
+      this.uploadData = null;
+    },
+    visibleChange() {
+      this.initData(this.instance);
+    },
+    cancel() {
+      this.modalIsShow = false;
+    },
+    open() {
+      this.modalIsShow = true;
+    },
+    validChange(result) {
+      if (!result.success) {
+        this.uploadData = null;
+        this.$notify.error({ title: "错误提示", message: result.message });
+        this.$refs.modalFormComp.validateField("uploadData");
+      }
+    },
+    fileChange(data) {
+      this.uploadData = data;
+      this.$refs.modalFormComp.validateField("uploadData");
+    },
+    async submit() {
+      const valid = await this.$refs.modalFormComp.validate().catch(() => {});
+      if (!valid) return;
+
+      if (this.isSubmit) return;
+      this.isSubmit = true;
+
+      const formData = new FormData();
+      Object.entries(this.modalForm).forEach(([k, v]) => {
+        formData.append(k, v);
+      });
+      formData.append("file", this.uploadData.file);
+
+      const data = await updateCourseTargetTemplate(formData, {
+        md5: this.uploadData.md5,
+      }).catch(() => {});
+      this.isSubmit = false;
+      if (!data) return;
+
+      this.$message.success(this.title + "成功！");
+      this.$emit("modified");
+      this.cancel();
+    },
+  },
+};
+</script>

src/modules/base/router.js

@@ -11,6 +11,7 @@ import FlowManage from "./views/FlowManage.vue";
 import ApproveRecordManage from "./views/ApproveRecordManage.vue";
 import SmsManage from "./views/SmsManage.vue";
 import CardManage from "./views/CardManage.vue";
+import CourseTargetTemplateManage from "./views/CourseTargetTemplateManage.vue";
 // dict
 import StudentManage from "./views/StudentManage.vue";
 import CourseManage from "./views/CourseManage.vue";
@@ -53,6 +54,11 @@ export default [
     name: "PrintTemplateManage",
     component: PrintTemplateManage,
   },
+  {
+    path: "/base/course-target-template-manage",
+    name: "CourseTargetTemplateManage",
+    component: CourseTargetTemplateManage,
+  },
   {
     path: "/base/param-print-template",
     name: "ParamPrintTemplate",

src/modules/base/views/CourseTargetTemplateManage.vue

@@ -0,0 +1,220 @@
+<template>
+  <div class="exam-manage">
+    <div class="part-box part-box-filter part-box-flex">
+      <el-form ref="FilterForm" label-position="left" label-width="85px" inline>
+        <template v-if="checkPrivilege('condition', 'condition')">
+          <el-form-item label="模板名称：">
+            <el-input
+              v-model.trim="filter.name"
+              placeholder="模板名称"
+              clearable
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="启用/禁用：" label-width="90px">
+            <el-select
+              v-model="filter.enable"
+              style="width: 120px"
+              placeholder="状态"
+              clearable
+            >
+              <el-option
+                v-for="(val, key) in ABLE_TYPE"
+                :key="key"
+                :value="key * 1"
+                :label="val"
+              ></el-option>
+            </el-select>
+          </el-form-item>
+        </template>
+        <el-form-item>
+          <el-button
+            v-if="checkPrivilege('button', 'select')"
+            type="primary"
+            @click="toPage(1)"
+            >查询</el-button
+          >
+        </el-form-item>
+      </el-form>
+      <div class="part-box-action">
+        <el-button
+          v-if="checkPrivilege('button', 'add')"
+          type="primary"
+          icon="el-icon-circle-plus-outline"
+          @click="toAdd"
+          >新增</el-button
+        >
+      </div>
+    </div>
+    <div class="part-box part-box-pad">
+      <el-table ref="TableList" :data="dataList">
+        <el-table-column
+          type="index"
+          label="序号"
+          width="70"
+          :index="indexMethod"
+        ></el-table-column>
+        <el-table-column prop="name" label="模板名称"></el-table-column>
+        <el-table-column prop="createTime" label="创建时间" width="170">
+          <span slot-scope="scope">{{
+            scope.row.createTime | timestampFilter
+          }}</span>
+        </el-table-column>
+        <el-table-column prop="enable" label="启用/禁用" width="100">
+          <template slot-scope="scope">
+            {{ scope.row.enable | enableFilter }}
+          </template>
+        </el-table-column>
+        <el-table-column
+          class-name="action-column"
+          label="操作"
+          width="180px"
+          fixed="right"
+        >
+          <template slot-scope="scope">
+            <el-button
+              v-if="checkPrivilege('link', 'preview')"
+              class="btn-primary"
+              type="text"
+              @click="toView(scope.row)"
+              >查看</el-button
+            >
+            <el-button
+              v-if="checkPrivilege('link', 'edit')"
+              class="btn-primary"
+              type="text"
+              @click="toEdit(scope.row)"
+              >编辑</el-button
+            >
+            <el-button
+              v-if="checkPrivilege('link', 'Enable')"
+              :class="scope.row.enable ? 'btn-danger' : 'btn-primary'"
+              type="text"
+              @click="toEnable(scope.row)"
+              >{{ scope.row.enable ? "禁用" : "启用" }}</el-button
+            >
+            <el-button
+              v-if="checkPrivilege('link', 'Delete')"
+              class="btn-danger"
+              type="text"
+              @click="toDelete(scope.row)"
+              >删除</el-button
+            >
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="part-page">
+        <el-pagination
+          background
+          layout="total, sizes, prev, pager, next, jumper"
+          :pager-count="5"
+          :current-page="current"
+          :total="total"
+          :page-size="size"
+          @current-change="toPage"
+          @size-change="pageSizeChange"
+        >
+        </el-pagination>
+      </div>
+    </div>
+
+    <!-- ModifyCourseTargetTemplate -->
+    <modify-course-target-template
+      ref="ModifyCourseTargetTemplate"
+      v-if="checkPrivilege('link', 'edit')"
+      :instance="curRow"
+      @modified="getList"
+    ></modify-course-target-template>
+  </div>
+</template>
+
+<script>
+import {
+  courseTargetTemplateListPage,
+  deleteCourseTargetTemplate,
+  ableCourseTargetTemplate,
+} from "../api";
+import { ABLE_TYPE } from "@/constants/enumerate";
+import ModifyCourseTargetTemplate from "../components/ModifyCourseTargetTemplate.vue";
+
+export default {
+  name: "course-target-template-manage",
+  components: { ModifyCourseTargetTemplate },
+  data() {
+    return {
+      filter: {
+        name: "",
+        enable: "",
+      },
+      ABLE_TYPE,
+      current: 1,
+      size: this.GLOBAL.pageSize,
+      total: 0,
+      dataList: [],
+      curRow: {},
+    };
+  },
+  mounted() {
+    // this.getList();
+  },
+  methods: {
+    async getList() {
+      if (!this.checkPrivilege("list", "list")) return;
+
+      const datas = {
+        ...this.filter,
+        pageNumber: this.current,
+        pageSize: this.size,
+      };
+      if (datas.enable !== null && datas.enable !== "")
+        datas.enable = !!datas.enable;
+
+      const data = await courseTargetTemplateListPage(datas);
+      this.dataList = data.records;
+      this.total = data.total;
+    },
+    toPage(page) {
+      this.current = page;
+      this.getList();
+    },
+    toAdd() {
+      this.curRow = {};
+      this.$refs.ModifyCourseTargetTemplate.open();
+    },
+    toEdit(row) {
+      this.curRow = row;
+      this.$refs.ModifyCourseTargetTemplate.open();
+    },
+    toView(row) {
+      this.curRow = row;
+      // TODO:
+    },
+    toDelete(row) {
+      this.$confirm(`确定要删除模板【${row.name}】吗?`, "提示", {
+        type: "warning",
+      })
+        .then(async () => {
+          await deleteCourseTargetTemplate(row.id);
+          this.$message.success("删除成功！");
+          this.deletePageLastItem();
+        })
+        .catch(() => {});
+    },
+    toEnable(row) {
+      const action = row.enable ? "禁用" : "启用";
+      this.$confirm(`确定要${action}模板【${row.name}】吗?`, "提示", {
+        type: "warning",
+      })
+        .then(async () => {
+          const enable = !row.enable;
+          await ableCourseTargetTemplate({
+            id: row.id,
+            enable,
+          });
+          row.enable = enable;
+          this.$message.success("操作成功！");
+        })
+        .catch(() => {});
+    },
+  },
+};
+</script>

src/views/Home.vue

@@ -187,15 +187,16 @@ export default {
     },
   },
   created() {
-    // this.initData1();
-    this.initData();
+    this.initData1();
+    // this.initData();
   },
   methods: {
     ...mapActions("exam", ["updateWaitTaskCount"]),
     initData1() {
       // 开发阶段专用
-      this.initPrivilegeMap(localMenus);
-      this.privileges = this.transformMenu(localMenus);
+      const privileges = [...staticMenu, ...localMenus];
+      this.initPrivilegeMap(privileges);
+      this.privileges = this.transformMenu(privileges);
       this.menus = this.getMenu();
 
       if (this.IS_HOME_PAGE) return;