证书档案-证书类型

src/api/archives/certificate.js

@@ -0,0 +1,64 @@
+import request from '@/utils/request'
+
+const api = {
+    list: '/sys/dictionary/item/list',
+    findMaxValue: '/sys/dictionary/item/findMaxValue',
+    get: '/sys/dictionary/item/get',
+    add: '/sys/dictionary/item/add',
+    del: '/sys/dictionary/item/del',
+    edit: '/sys/dictionary/item/edit'
+}
+
+// 证书类型 列表
+export function getCertificateTypeList(params) {
+    return request({
+        url: api.list,
+        method: 'get',
+        params: params
+    })
+}
+
+// 查询最大词典项值 列表
+export function getCertificateTypeMaxValue(params) {
+    return request({
+        url: api.findMaxValue,
+        method: 'get',
+        params: params
+    })
+}
+
+// 根据ID查询证书类型 列表
+export function getCertificateType(params) {
+    return request({
+        url: api.get,
+        method: 'post',
+        params: params
+    })
+}
+
+// 证书类型 新增
+export function addCertificateType(params) {
+    return request({
+        url: api.add,
+        method: 'post',
+        data: params
+    })
+}
+
+// 证书类型 删除
+export function delCertificateType(params) {
+    return request({
+        url: api.del,
+        method: 'post',
+        params: params
+    })
+}
+
+// 证书类型 修改
+export function editCertificateType(params) {
+    return request({
+        url: api.edit,
+        method: 'post',
+        data: params
+    })
+}

src/views/archives/certificate/CertificateType.vue

@@ -0,0 +1,155 @@
+<template>
+  <a-card :bordered="false" title="证书类型">
+    <template slot="extra">
+      <a-button size="small" @click="close">返回</a-button>
+    </template>
+
+    <div class="table-page-search-wrapper">
+      <div style="width: 100%; height: 32px; margin-bottom: 8px;">
+        <a-button type="primary" @click="addCertificateType()">新增证书类型</a-button>
+      </div>
+    </div>
+
+    <s-table ref="table" size="small" rowKey="id" :columns="columns" :data="loadData" :showPagination="false">
+      <template slot="action" slot-scope="text, record">
+        <a href="javascript:;" @click="edit(record)">编辑</a>
+        &nbsp;&nbsp;&nbsp;&nbsp;
+        <a-popconfirm title="确定要删除该证书类型?" ok-text="确认" cancel-text="取消" @confirm="del(record)">
+          <a href="javascript:;">删除</a>
+        </a-popconfirm>
+      </template>
+    </s-table>
+
+    <a-modal v-model="isAdd" :width="700" title="新增证书类型" ok-text="确认" cancel-text="取消" @ok="addCertificateTypeQR">
+      <a-form-model :model="addForm" :label-col="{span: 5}" :wrapper-col="{span: 19}">
+        <a-form-model-item label="证书类型名称" :rules="{ required: true, message: '请输入证书类型名称！' }">
+          <a-input v-model="addForm.name" />
+        </a-form-model-item>
+      </a-form-model>
+    </a-modal>
+  </a-card>
+</template>
+
+<script>
+import { STable } from '@/components'
+import { getCertificateTypeList, getCertificateType, getCertificateTypeMaxValue, addCertificateType, delCertificateType, editCertificateType } from '@/api/archives/certificate'
+
+export default {
+  // import引入的组件需要注入到对象中才能使用
+  components: { STable },
+  props: {},
+  data() {
+    // 这里存放数据
+    return {
+      isAdd: false,
+      addForm: {
+        name: ''
+      },
+      editForm: {},
+      queryParam: { dictionaryCode: '0001' },
+      columns: [
+        { title: '证书类型', width: 'auto', align: 'center', dataIndex: 'name', key: 'name' },
+        { title: '操作', width: '170px', key: 'operation', align: 'center', scopedSlots: { customRender: 'action' } }
+      ],
+      loadData: parameter => { return getCertificateTypeList(Object.assign(parameter, this.queryParam)).then((res) => { return res.data; }); },
+    };
+  },
+  // 计算属性 类似于data概念
+  computed: {},
+  // 监控data中的数据变化
+  watch: {},
+  // 方法集合
+  methods: {
+    // 返回 按钮
+    close() {
+      this.$router.push({
+        path: '/archives/certificate/Index', query: {
+
+        }
+      });
+    },
+
+    // 新增证书类型
+    addCertificateType() {
+      this.addForm.name = "";
+      this.isAdd = true;
+    },
+    addCertificateTypeQR() {
+      if (!this.addForm.name || this.addForm.name === '') {
+        this.$message.error("请输入证书类型名称!");
+        return;
+      }
+
+      // 如果修改form内有值 则走修改
+      if (this.editForm.id) {
+        if (this.editForm.name === this.addForm.name) {
+          this.$message.success("证书类型名称与之前一致，不需要发起修改");
+          this.isAdd = false;
+          return;
+        }
+
+        this.editForm.name = this.addForm.name;
+        editCertificateType(this.editForm).then(res => {
+          this.$message.success("修改成功!");
+          this.editForm = {};
+          this.isAdd = false;
+          this.$refs.table.refresh(true);
+        });
+        return;
+      }
+
+      let certificateType = {};
+      certificateType.dictionaryCode = '0001';
+      certificateType.name = this.addForm.name;
+      certificateType.parentid = 0;
+
+      // 先获取该词典项下最大value
+      getCertificateTypeMaxValue(certificateType).then(res => {
+        certificateType.value = res.data;
+
+        // 再发起新增
+        addCertificateType(certificateType).then(res => {
+          this.$message.success("新增成功!");
+          this.isAdd = false;
+          this.$refs.table.refresh(true);
+        });
+      });
+    },
+
+    // 编辑词典项
+    edit(record) {
+      getCertificateType({ id: record.id }).then(res => {
+        this.isAdd = true;
+        this.addForm.name = res.data.name;
+        this.editForm = res.data;
+      });
+    },
+
+    // 删除证书类型
+    del(record) {
+      delCertificateType({ ids: record.id, deleteReason: '' }).then(res => { this.$refs.table.refresh(true); });
+    }
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() { },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() { },
+  // 生命周期 - 创建之前
+  beforeCreate() { },
+  // 生命周期 - 挂载之前
+  beforeMount() { },
+  // 生命周期 - 更新之前
+  beforeUpdate() { },
+  // 生命周期 - 更新之后
+  updated() { },
+  // 生命周期 - 销毁之前
+  beforeDestroy() { },
+  // 生命周期 - 销毁完成
+  destroyed() { },
+  // 如果页面有keep-alive缓存功能，这个函数会触发
+  activated() { }
+};
+
+</script>
+<style scoped>
+</style>

src/views/archives/certificate/Index.vue

@@ -0,0 +1,81 @@
+<template>
+  <a-card :bordered="false" title="证书档案">
+    <div class="table-page-search-wrapper">
+      <SearchCom :form="queryParam" :list="queryOptions" @search="handleRefresh" @reset="() => {queryParam = {}, handleRefresh()}"></SearchCom>
+      <div style="width: 100%; height: 32px; margin-bottom: 8px;">
+        <a-button type="primary" @click="editCertificateType()">编辑证书类型</a-button>
+      </div>
+    </div>
+  </a-card>
+</template>
+
+<script>
+import { STable, SearchCom } from '@/components'
+import { getCertificateTypeList } from '@/api/archives/certificate'
+
+export default {
+  // import引入的组件需要注入到对象中才能使用
+  components: { STable, SearchCom },
+  props: {},
+  data() {
+    // 这里存放数据
+    return {
+      queryParam: { orgId: '', name: '', type: '' },
+      type: []
+    };
+  },
+  // 计算属性 类似于data概念
+  computed: {
+    queryOptions: function () {
+      return [
+        { type: 'input', placeholder: '证书名称', key: 'name' },
+        { type: 'select', placeholder: '培训种类', key: 'type', options: [{ id: '', name: '全部' }, ...this.type] },
+      ]
+    },
+  },
+  // 监控data中的数据变化
+  watch: {},
+  // 方法集合
+  methods: {
+    // 编辑证书类型
+    editCertificateType() {
+      this.$router.push({
+        path: '/archives/certificate/CertificateType', query: {
+
+        }
+      });
+    }
+  },
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    // 获取所有证书类型
+    getCertificateTypeList({ dictionaryCode: '0001' }).then(res => {
+      for (let index in res.data) {
+        let item = {};
+        item.id = res.data[index].value;
+        item.name = res.data[index].name;
+        this.type.push(item)
+      }
+    });
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() { },
+  // 生命周期 - 创建之前
+  beforeCreate() { },
+  // 生命周期 - 挂载之前
+  beforeMount() { },
+  // 生命周期 - 更新之前
+  beforeUpdate() { },
+  // 生命周期 - 更新之后
+  updated() { },
+  // 生命周期 - 销毁之前
+  beforeDestroy() { },
+  // 生命周期 - 销毁完成
+  destroyed() { },
+  // 如果页面有keep-alive缓存功能，这个函数会触发
+  activated() { }
+};
+
+</script>
+<style scoped>
+</style>