init

src/views/workflow/approve/index.vue

@@ -0,0 +1,169 @@
+<template>
+  <div>
+    <el-form :model="queryParams" inline class="query-form" ref="queryForm" @submit.prevent="getList">
+      <el-form-item label="部署名称" prop="deploymentName">
+        <el-input v-model="queryParams.deploymentName" placeholder="请输入部署名称" clearable></el-input>
+      </el-form-item>
+      <!--    <el-form-item label="状态" prop="enable">-->
+      <!--      <el-select v-model="queryParams.enable" placeholder="请选择状态" clearable  filterable>-->
+      <!--        <el-option-->
+      <!--            v-for="dict in cacheStore.getDict('regular_enable')"-->
+      <!--            :key="dict.value"-->
+      <!--            :label="dict.label"-->
+      <!--            :value="dict.value"-->
+      <!--        />-->
+      <!--      </el-select>-->
+      <!--    </el-form-item>-->
+      <el-form-item>
+        <el-button type="primary" @click="getList" :icon="Search">搜索</el-button>
+        <el-button type="primary" @click="handleReset" :icon="Refresh" plain>重置</el-button>
+      </el-form-item>
+    </el-form>
+    <div class="table">
+      <el-table
+          :data="list"
+          row-key="id"
+          :lazy="true"
+          ref="singleTable"
+          v-loading="loading"
+          v-tabh
+      >
+        <el-table-column type="selection" width="30"/>
+        <el-table-column label="序号" type="index" width="60" align="center"/>
+        <el-table-column prop="deploymentName" label="部署名称" align="center"/>
+        <el-table-column prop="version" label="版本" align="center">
+          <template #default="scope">
+            <el-tag type="success">{{ scope.row.version }}</el-tag>
+          </template>
+        </el-table-column>
+        <el-table-column prop="remark" label="备注说明" align="center"/>
+        <el-table-column prop="updateTime" label="更新时间" align="center"/>
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <el-button type="primary" size="mini" v-perm="['rapid:regular:edit']"
+                       @click="handleApprove(scope.row)"  link>发起流程
+            </el-button>
+            <popover-delete :name="scope.row.deploymentName" :type="'流程'" :perm="['rapid:regular:del']"
+                            @delete="handleDelete(scope.row.id)"/>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+    <paging :current-page="pageInfo.pageNum" :page-size="pageInfo.pageSize" :page-sizes="[10, 20, 30, 40,50]"
+            :total="total" @changeSize="handleSizeChange" @goPage="handleCurrentChange"/>
+    <el-dialog title="发起审批" v-model="openItemDl" :close-on-click-modal="true" width="1200px">
+      <initiate-process ref="processInstance" :code="selectItem.processDefinitionKey"
+                        v-if="openItemDl"></initiate-process>
+      <span slot="footer" class="dialog-footer">
+				<el-button size="mini" @click="openItemDl = false">取 消</el-button>
+				<el-button size="mini" type="primary" @click="submitForm">提 交</el-button>
+			</span>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import {getProcessDefinitionList} from "@/api/workflow/process-definition.js";
+import {startProcessInstance} from "@/api/workflow/process-instance.js";
+import InitiateProcess from './InitiateProcess.vue'
+import {Search, Refresh, Delete, Plus, Edit, Download} from '@element-plus/icons-vue'
+import {ElMessage} from "element-plus";
+import Paging from "@/components/pagination/index.vue";
+
+//查询参数
+const queryParams = reactive({
+  deploymentName: '',
+  // startTime: null,
+  // endTime: null,
+  // state: 1,
+})
+
+//页面信息
+const pageInfo = reactive({
+  pageNum: 1,
+  pageSize: 10,
+})
+const openItemDl = ref(false)
+const selectItem = ref({})
+const loading = ref(true)
+const list = ref([])
+const queryForm = ref()
+const total = ref()
+const singleTable = ref()
+const processInstance = ref()
+
+
+
+//重置搜索
+const handleReset = () => {
+  queryForm.value.resetFields()
+  getList()
+}
+
+const submitForm = () => {
+  let formData = processInstance.value.formData
+  let paramsData = {
+    processDefinitionId: selectItem.value.processDefinitionId,
+    formData: JSON.stringify(formData),
+    optionalUser: {}
+  }
+  // let valid = processInstance.value.validate(() => {
+  // })
+  console.log(paramsData)
+  if (true) {
+    startProcessInstance(paramsData).then(res => {
+      if (res.code === 1000) {
+        openItemDl.value = false
+        ElMessage.success(res.msg)
+      } else {
+        ElMessage.error(res.msg)
+      }
+    })
+  } else {
+    ElMessage.error("请完善表单😥")
+  }
+}
+
+
+//获取数据
+const handleApprove = async (node) => {
+  selectItem.value = node
+  openItemDl.value = true
+}
+const getList = async () => {
+  let params = {
+    ...queryParams,
+    ...pageInfo
+  }
+  loading.value = true
+  getProcessDefinitionList(params).then(res => {
+    if (res.code === 1000) {
+      list.value = res.data.rows
+      total.value = res.data.total
+      loading.value = false
+    } else {
+      ElMessage.error(res.msg)
+    }
+
+  })
+}
+//切换每页显示条数
+const handleSizeChange = async (val) => {
+  pageInfo.value.pageSize = val
+  await getList()
+}
+
+//点击页码进行分页功能
+const handleCurrentChange = async (val) => {
+  pageInfo.value.pageNum = val
+  await getList()
+}
+
+getList()
+
+
+</script>
+
+<style scoped>
+
+</style>