feat: [步骤库] 步骤库管理

src/api/business/step/step.js

@@ -0,0 +1,65 @@
+import request from '@/utils/request'
+
+export function step_list(query) {
+  return request({
+    url: '/system/business/step/list',
+    method: 'get',
+    params: query
+  })
+}
+
+export function step_info(query) {
+  return request({
+    url: '/system/business/step/info',
+    method: 'get',
+    params: query
+  })
+}
+
+export function step_save(data) {
+  return request({
+    url: '/system/business/step/save',
+    method: 'post',
+    data: data
+  })
+}
+
+export function step_delete(data) {
+  return request({
+    url: '/system/business/step/delete',
+    method: 'post',
+    data: data
+  })
+}
+
+export function stepGroup_list(query) {
+  return request({
+    url: '/system/business/stepGroup/list',
+    method: 'get',
+    params: query
+  })
+}
+
+export function stepGroup_info(query) {
+  return request({
+    url: '/system/business/stepGroup/info',
+    method: 'get',
+    params: query
+  })
+}
+
+export function stepGroup_save(data) {
+  return request({
+    url: '/system/business/stepGroup/save',
+    method: 'post',
+    data: data
+  })
+}
+
+export function stepGroup_delete(data) {
+  return request({
+    url: '/system/business/stepGroup/delete',
+    method: 'post',
+    data: data
+  })
+}

src/views/business/step/list.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="app-container template-page">
+    <el-form :model="searchForm" ref="searchForm" :inline="true">
+      <el-form-item label="编号：" prop="sn">
+        <el-input v-model="searchForm.sn" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px"
+          @keyup.enter.native="search" />
+      </el-form-item>
+      <el-form-item label="名称：" prop="name">
+        <el-input v-model="searchForm.name" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px"
+          @keyup.enter.native="search" />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('form.search') }}</el-button>
+        <el-button icon="el-icon-refresh" @click="reset">{{ $t('form.reset') }}</el-button>
+
+        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)">新增</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="id" align="center" prop="id" />
+      <el-table-column label="编号" align="center" prop="sn" />
+      <el-table-column label="名称" align="center" prop="name" />
+      <el-table-column label="创建时间" align="center" prop="createTime" />
+      <el-table-column :label="$t('form.operate')" fixed="right" align="center" width="100">
+        <template slot-scope="scope">
+          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
+          <el-button type="text" @click="del(scope.row)">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination v-show="total > 0" :total="total" :page.sync="searchForm.pageNum" :limit.sync="searchForm.pageSize"
+      @pagination="getList" />
+
+    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="infoDialog.title" :visible.sync="infoDialog.visible" width="800px"
+      append-to-body>
+      <el-form ref="infoDialogForm" :model="infoDialog.formData" :rules="infoDialog.rules" label-width="180px">
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="编号：" prop="sn">
+              <el-input v-model="infoDialog.formData.sn" />
+            </el-form-item>
+          </el-col>
+          <el-col :span="24">
+            <el-form-item label="名称：" prop="name">
+              <el-input v-model="infoDialog.formData.name" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="save">确 定</el-button>
+        <el-button @click="infoDialog.visible = false">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { step_list, step_info, step_save, step_delete } from "@/api/business/step/step";
+const EmptyDialogData = {
+  id: '',
+  name: '',
+  sn: '',
+}
+export default {
+  name: "StepPage",
+  props: {
+  },
+  components: {
+  },
+  computed: {
+  },
+  filters: {
+  },
+  data() {
+    return {
+      searchForm: {
+        pageNum: 1,
+        pageSize: 10,
+        sn: '',
+        name: '',
+      },
+
+      loading: true,
+      total: 0,
+      list: [],
+
+      infoDialog: {
+        title: '',
+        visible: false,
+        formData: {},
+
+        rules: {
+          sn: [
+            { required: true, message:'请输入', trigger: "blur" }
+          ],
+          name: [
+            { required: true, message:'请输入', trigger: "blur" }
+          ],
+        },
+      },
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.loading = true;
+      step_list(this.searchForm).then(response => {
+        this.list = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    search() {
+      this.searchForm.pageNum = 1;
+      this.getList();
+    },
+    reset() {
+      this.searchForm = {
+        pageNum: 1,
+        pageSize: 10,
+        sn: '',
+        name: '',
+      }
+      this.search()
+    },
+    edit(row) {
+      this.$refs['infoDialogForm'] && this.$refs['infoDialogForm'].resetFields()
+      this.infoDialog.title = '新增'
+      this.infoDialog.formData = _.merge({}, EmptyDialogData)
+      if (row && row.id) {
+        this.infoDialog.title = '编辑'
+        this.$modal.loading()
+        step_info({ id: row.id }).then(({ data }) => {
+          this.infoDialog.formData = data
+        }).finally(() => {
+          this.$modal.closeLoading()
+        })
+      }
+      this.infoDialog.visible = true
+    },
+    save() {
+      this.$refs['infoDialogForm'].validate(valid => {
+        if (valid) {
+          this.$modal.loading()
+          step_save(this.infoDialog.formData).then(() => {
+            this.infoDialog.visible = false
+            this.getList()
+          }).finally(() => {
+            this.$modal.closeLoading()
+          })
+        }
+      })
+    },
+    del(row) {
+      this.$confirm('确定要删除吗', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.$modal.loading()
+          step_delete({ id: row.id }).then(() => {
+            this.getList()
+          })
+            .finally(() => {
+              this.$modal.closeLoading()
+            })
+        })
+        .catch(() => { })
+    },
+  }
+};
+</script>
+<style lang="scss"></style>

src/views/business/stepGroup/list.vue

@@ -0,0 +1,224 @@
+<template>
+  <div class="app-container template-page">
+    <el-form :model="searchForm" ref="searchForm" :inline="true">
+      <el-form-item label="名称：" prop="name">
+        <el-input v-model="searchForm.name" :placeholder="$t('form.placeholderInput')" clearable style="width: 150px"
+          @keyup.enter.native="search" />
+      </el-form-item>
+
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('form.search') }}</el-button>
+        <el-button icon="el-icon-refresh" @click="reset">{{ $t('form.reset') }}</el-button>
+
+        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)">新增</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table v-loading="loading" :data="list">
+      <el-table-column label="id" align="center" prop="id" />
+      <el-table-column label="名称" align="center" prop="name" />
+      <el-table-column label="创建时间" align="center" prop="createTime" />
+      <el-table-column :label="$t('form.operate')" fixed="right" align="center" width="200">
+        <template slot-scope="scope">
+          <el-button type="text" @click="edit(scope.row)">编辑</el-button>
+          <el-button type="text" @click="del(scope.row)">删除</el-button>
+          <el-button type="text" @click="selectStep(scope.row)">设置步骤</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <pagination v-show="total > 0" :total="total" :page.sync="searchForm.pageNum" :limit.sync="searchForm.pageSize"
+      @pagination="getList" />
+
+    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="infoDialog.title" :visible.sync="infoDialog.visible" width="800px"
+      append-to-body>
+      <el-form ref="infoDialogForm" :model="infoDialog.formData" :rules="infoDialog.rules" label-width="180px">
+        <el-row>
+          <el-col :span="24">
+            <el-form-item label="名称：" prop="name">
+              <el-input v-model="infoDialog.formData.name" />
+            </el-form-item>
+          </el-col>
+        </el-row>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="save">确 定</el-button>
+        <el-button @click="infoDialog.visible = false">取 消</el-button>
+      </div>
+    </el-dialog>
+
+    <el-dialog :close-on-click-modal="false" :close-on-press-escape="false" :title="stepDialog.title" :visible.sync="stepDialog.visible" width="800px"
+      append-to-body>
+
+      <el-table v-loading="stepDialog.loading" :data="stepDialog.stepList" ref="multipleTable" @selection-change="handleSelectionChange" height="400px">
+        <el-table-column type="selection" width="55" />
+        <el-table-column label="id" align="center" prop="id" />
+        <el-table-column label="编号" align="center" prop="sn" />
+        <el-table-column label="名称" align="center" prop="name" />
+        <el-table-column label="创建时间" align="center" prop="createTime" />
+      </el-table>
+        
+      <div slot="footer" class="dialog-footer">
+        <el-button type="primary" @click="saveStep">确 定</el-button>
+        <el-button @click="stepDialog.visible = false">取 消</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { step_list, stepGroup_list, stepGroup_info, stepGroup_save, stepGroup_delete } from "@/api/business/step/step";
+const EmptyDialogData = {
+  id: '',
+  name: '',
+}
+export default {
+  name: "StepGroupPage",
+  props: {
+  },
+  components: {
+  },
+  computed: {
+  },
+  filters: {
+  },
+  data() {
+    return {
+      searchForm: {
+        pageNum: 1,
+        pageSize: 10,
+        name: '',
+      },
+
+      loading: true,
+      total: 0,
+      list: [],
+
+      infoDialog: {
+        title: '',
+        visible: false,
+        formData: {},
+
+        rules: {
+          name: [
+            { required: true, message:'请输入', trigger: "blur" }
+          ],
+        },
+      },
+
+      stepDialog:{
+        title: '设置步骤',
+        visible: false,
+        loading:false,
+        
+        stepList:[],
+        data:{id:'',stepIds:''},
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    getList() {
+      this.loading = true;
+      stepGroup_list(this.searchForm).then(response => {
+        this.list = response.rows;
+        this.total = response.total;
+        this.loading = false;
+      });
+    },
+    search() {
+      this.searchForm.pageNum = 1;
+      this.getList();
+    },
+    reset() {
+      this.searchForm = {
+        pageNum: 1,
+        pageSize: 10,
+        sn: '',
+        name: '',
+      }
+      this.search()
+    },
+    edit(row) {
+      this.$refs['infoDialogForm'] && this.$refs['infoDialogForm'].resetFields()
+      this.infoDialog.title = '新增'
+      this.infoDialog.formData = _.merge({}, EmptyDialogData)
+      if (row && row.id) {
+        this.infoDialog.title = '编辑'
+        this.$modal.loading()
+        stepGroup_info({ id: row.id }).then(({ data }) => {
+          this.infoDialog.formData = data
+        }).finally(() => {
+          this.$modal.closeLoading()
+        })
+      }
+      this.infoDialog.visible = true
+    },
+    save() {
+      this.$refs['infoDialogForm'].validate(valid => {
+        if (valid) {
+          this.$modal.loading()
+          stepGroup_save(this.infoDialog.formData).then(() => {
+            this.infoDialog.visible = false
+            this.getList()
+          }).finally(() => {
+            this.$modal.closeLoading()
+          })
+        }
+      })
+    },
+    del(row) {
+      this.$confirm('确定要删除吗', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(() => {
+          this.$modal.loading()
+          stepGroup_delete({ id: row.id }).then(() => {
+            this.getList()
+          })
+            .finally(() => {
+              this.$modal.closeLoading()
+            })
+        })
+        .catch(() => { })
+    },
+
+    selectStep(row){
+      this.stepDialog.visible = true
+      this.stepDialog.data = _.clone(row)
+      this.stepDialog.loading = true
+      step_list({ pageNum: 1, pageSize:9999}).then(response => {
+        this.stepDialog.stepList = response.rows
+        setTimeout(() => {
+          let cuurStepIdList = this.stepDialog.data.stepIds ? this.stepDialog.data.stepIds.split(',') : []
+          this.stepDialog.stepList.forEach(item => {
+            this.$refs.multipleTable.toggleRowSelection(item,cuurStepIdList.indexOf(item.id+'')>-1)
+          });
+          this.stepDialog.loading = false
+        }, 1000);
+      }).catch(() => {
+        this.stepDialog.loading = false
+      })
+    },
+    handleSelectionChange(val){
+      if(!this.stepDialog.loading){
+        this.stepDialog.data.stepIds = _.map(val, 'id').join(',')
+      }
+    },
+    saveStep(){
+      this.$modal.loading()
+      stepGroup_save(this.stepDialog.data).then(() => {
+        this.stepDialog.visible = false
+        this.getList()
+      }).finally(() => {
+        this.$modal.closeLoading()
+      })
+    },
+  }
+};
+</script>
+<style lang="scss"></style>

src/views/business/template/list.vue

@@ -24,8 +24,7 @@
         <el-button type="primary" icon="el-icon-search" @click="search">{{ $t('form.search') }}</el-button>
         <el-button icon="el-icon-refresh" @click="reset">{{ $t('form.reset') }}</el-button>
 
-        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)"
-          v-hasPermi="['system:user:add']">新增-后期不需要</el-button>
+        <el-button type="primary" plain icon="el-icon-plus" @click="edit(null)">新增-后期不需要</el-button>
       </el-form-item>
     </el-form>