2

project/xiushan/apps/processManagement/examinationApproval/AppExaminationApproval.vue

@@ -0,0 +1,204 @@
+<template>
+  <section class="examination-approval">
+    <ai-list v-if="!showList">
+      <template #title>
+        <ai-title title="审批分类" :isShowBottomBorder="true" :instance="instance"></ai-title>
+      </template>
+      <template #content>
+        <ai-search-bar>
+          <template #left>
+            <el-button type="primary" icon="iconfont iconAdd" @click="showList = true">添加分类</el-button>
+          </template>
+          <template #right>
+            <el-input
+              v-model="search.name"
+              size="small"
+              placeholder="分类名称/创建人"
+              @keyup.enter.native="search.current = 1, getList()"
+              @clear="reset"
+              clearable
+              suffix-icon="iconfont iconSearch"/>
+          </template>
+        </ai-search-bar>
+        <ai-table
+          :tableData="tableData"
+          :col-configs="colConfigs"
+          :total="total"
+          :header-cell-style="{fontWeight:'bold',color:'#333'}"
+          :current.sync="search.current"
+          :size.sync="search.size"
+          @getList="getList">
+
+          <el-table-column label="是否启用" slot="status" align="center" width="150">
+            <template v-slot="{row}">
+              <el-switch
+                v-model="row.status"
+                @change="onChange(row)" active-value="1" inactive-value="0"
+                active-color="#5088FF"
+                inactive-color="#D0D4DC">
+              </el-switch>
+            </template>
+          </el-table-column>
+          
+          <el-table-column label="操作" slot="options" align="center" width="150">
+            <template v-slot="{row}">
+              <el-button type="text" title="修改" @click="editInfo(row)">修改</el-button>
+              <el-button type="text" title="删除" @click="deleteInfo(row)">删除</el-button>
+            </template>
+          </el-table-column>
+        </ai-table>
+      </template>
+    </ai-list>
+    <addClassification v-else @back="showList=false;row={},getList()" :instance="instance"
+                       :row="row"></addClassification>
+  </section>
+</template>
+
+<script>
+
+  import addClassification from "./components/addClassification";
+  import day from 'dayjs'
+
+  export default {
+    name: "AppExaminationApproval",
+    label: "审批分类",
+    components: {addClassification},
+    props: {
+      instance: Function,
+      dict: Object,
+      permissions: Function
+    },
+    data() {
+      return {
+        search: {
+          current: 1,
+          size: 10,
+          name: "",
+        },
+        total: 0,
+        tableData: [],
+        row: {},
+        showList: false
+      }
+    },
+    computed: {
+      colConfigs() {
+        return [
+          {
+            prop: 'name',
+            align: 'left',
+            label: '分类名称',
+          },
+          {
+            prop: 'desc',
+            align: 'left',
+            label: '分类描述',
+          },
+          {
+            prop: 'createUserName',
+            align: 'center',
+            label: '创建人',
+          },
+          {
+            prop: 'createTime',
+            align: 'center',
+            label: '创建日期',
+          },
+          {
+            prop: 'showIndex',
+            align: 'center',
+            label: '排序',
+          },
+          {
+            slot: 'status',
+            align: 'center',
+            label: '是否启用',
+          },
+          {
+            slot: 'options',
+            align: 'center',
+            label: '操作',
+          },
+        ]
+      },
+    },
+    methods: {
+      /**
+       * 编辑
+       * */
+      editInfo(row) {
+        this.row = row
+        this.showList = true
+      },
+
+      /**
+       * 启用、停用
+       */
+      onChange(row) {
+        this.instance.post(`/app/zwspapprovalclassification/enable?id=${row.id}`).then(res => {
+          if (res?.code == 0) {
+            this.$message.success(+row.status ? "已启用" : '不启用')
+            this.getList()
+          }
+        })
+      },
+
+      reset() {
+        this.search.name = ""
+        this.getList()
+      },
+
+      getList() {
+        this.instance.post(`/app/zwspapprovalclassification/list`, null, {
+          params: {
+            ...this.search,
+          },
+        }).then(res => {
+          if (res && res.data) {
+            this.tableData = res.data.records.map(e => ({
+              ...e,
+              createTime: day(e.createTime).format("YYYY-MM-DD"),
+            }));
+            this.total = res.data.total;
+          }
+        })
+      },
+
+      /**
+       * 删除
+       */
+      deleteInfo({id}) {
+        this.$confirm("是否删除？").then(() => {
+          this.instance.post(`/app/zwspapprovalclassification/delete?ids=${id}`).then(res => {
+            if (res.code == 0) {
+              this.$message.success("删除成功")
+              this.getList()
+            }
+          })
+        })
+      },
+    },
+
+    mounted() {
+      this.getList()
+    }
+  }
+</script>
+
+<style lang="scss" scoped>
+  .examination-approval {
+    height: 100%;
+    background: #f3f6f9;
+    overflow: auto;
+
+    .iconfont {
+      user-select: none;
+      cursor: pointer;
+    }
+
+    ::v-deep .ai-table {
+      margin-top: 16px;
+    }
+
+  }
+</style>