init

src/views/workflow/about/index.vue

@@ -0,0 +1,154 @@
+<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"
+          @cell-click="showDetails"
+          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="initiator" label="发起人" align="center"/>
+        <el-table-column prop="submitTime" label="提交时间" align="center"/>
+        <el-table-column prop="taskName" label="当前节点" align="center"/>
+        <el-table-column prop="state" label="状态" align="center">
+          <template #default="scope">
+            <point-tag dict-type="process_state" :value="scope.row.state"/>
+          </template>
+        </el-table-column>
+        <el-table-column label="处理耗时" align="center">
+          <template #default="scope">
+
+          </template>
+        </el-table-column>
+        <el-table-column label="操作" align="center">
+          <template #default="scope">
+            <template v-if="scope.row.state === '4'">
+              <el-button size="min" type="primary" @click="resubmitHander(scope.row.taskId)" link>再次提交</el-button>
+            </template>
+            <template v-if="scope.row.state === '2' || scope.row.state === '3'">
+              <el-button size="min" type="primary" @click="resubmitHander(scope.row.taskId)" link>重新提交
+              </el-button>
+            </template>
+          </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"/>
+    <instance-details ref="instanceDetails" :instance="selectProcessInstance"/>
+  </div>
+</template>
+<script setup>
+import {getAboutInstanceList} from "@/api/workflow/process-instance.js";
+import {Search, Refresh, Delete, Edit} from '@element-plus/icons-vue'
+import InstanceDetails from '@/views/workflow/common/InstanceDetails.vue'
+import {useProcessStore} from '@/stores/processStore.js'
+import {useCacheStore} from '@/stores/cache.js'
+import Paging from "@/components/pagination/index.vue";
+import PointTag from "@/components/PointTag.vue";
+import {ElMessage} from "element-plus";
+
+const dictStore = useCacheStore()
+dictStore.setCacheKey(['process_state'])
+const processStore = useProcessStore()
+//查询参数
+const queryParams = reactive({
+  deploymentName: '',
+  // state: 1
+})
+
+//页面信息
+const pageInfo = reactive({
+  pageNum: 1,
+  pageSize: 10,
+})
+const list = ref([])
+const selectProcessInstance = ref()
+const total = ref()
+const loading = ref()
+const instanceDetails = ref()
+const queryForm = ref()
+
+const showDetails = (row, column) => {
+  if (column.label !== '操作') {
+    selectProcessInstance.value = row
+    nextTick(() => {
+      instanceDetails.value.init()
+    })
+  }
+}
+
+//重置搜索
+const handleReset = () => {
+  queryForm.value.resetFields()
+  getList()
+}
+const getList = async () => {
+  let params = {
+    ...queryParams,
+    ...pageInfo
+  }
+  loading.value = true
+  getAboutInstanceList(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()
+}
+
+const getTimeConsuming = async (instance) => {
+  if (instance.state != 1) {
+    //dateFormat(开始时间,结束时间)
+    // return timeLength(instance.submitTime, instance.endTime);
+  }
+}
+
+getList()
+
+</script>
+
+<style scoped>
+
+</style>