feat 工作流相关页面

src/views/modules/bpm/task/DoneTaskList.vue

@@ -1,10 +1,91 @@
 <template>
-
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query :query-params="model.queryParam" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom zoom :refresh="{ query: queryPage }" />
+      <vxe-table ref="xTable" row-id="id" :loading="loading" :data="pagination.records">
+        <vxe-column type="seq" title="序号" width="60" />
+        <vxe-column field="instanceName" title="业务标题" />
+        <vxe-column field="defName" title="流程名称" />
+        <vxe-column field="nodeName" title="环节" />
+        <vxe-column field="taskId" title="任务id" />
+        <vxe-column field="instanceId" title="流程id" />
+        <vxe-column field="startUserName" title="发起人" />
+        <vxe-column field="startTime" title="任务开始时间" />
+        <vxe-column fixed="right" width="120" :showOverflow="false" title="操作">
+          <template #default="{ row }">
+            <a-link @click="show(row)">查看</a-link>
+            <a-divider type="vertical" />
+            <a-link disabled @click="retrieveTask(row)">取回</a-link>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        border
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+    </div>
+  </div>
 </template>
 
 <script lang="ts" setup>
+  import ALink from '/@/components/Link/Link.vue'
+  import useTablePage from '/@/hooks/bootx/useTablePage'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { $ref } from 'vue/macros'
+  import { QueryField, STRING } from '/@/components/Bootx/Query/Query'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { onMounted } from 'vue'
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import { pageByDoneAdmin } from '/@/views/modules/bpm/task/Task.api'
+
+  const { handleTableChange, resetQueryParams, pageQueryResHandel, pagination, pages, model, loading } = useTablePage(queryPage)
+  const { createMessage, createConfirm } = useMessage()
+
+  // 查询条件
+  const fields = [
+    { field: 'code', type: STRING, name: '流程编号', placeholder: '请输入流程编号' },
+    { field: 'code', type: STRING, name: '流程名称', placeholder: '请输入流程名称' },
+  ] as QueryField[]
+  let xTable = $ref<VxeTableInstance>()
+  let xToolbar = $ref<VxeToolbarInstance>()
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.connect(xToolbar)
+  }
+
+  function queryPage() {
+    loading.value = true
+    pageByDoneAdmin({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+  }
+
+  function retrieveTask(record) {
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: '确实要取回当前任务!',
+      onOk: () => {
+        loading.value = true
+        createMessage.success('取回成功')
+        queryPage()
+      },
+    })
+  }
 </script>
 
-<style scoped>
-
-</style>
+<style scoped></style>

src/views/modules/bpm/task/Task.api.ts

@@ -6,7 +6,7 @@ import { PageResult, Result } from '/#/axios'
  * 分页 待处理任务
  */
 export function pageByTodoAdmin(params) {
-  return defHttp.get<Result<PageResult>>({
+  return defHttp.get<Result<PageResult<Task[]>>>({
     url: '/bpm/admin/task/pageByTodo',
     params: params,
   })
@@ -15,12 +15,73 @@ export function pageByTodoAdmin(params) {
  * 分页 已处理任务
  */
 export function pageByDoneAdmin(params) {
-  return defHttp.get<Result<PageResult>>({
+  return defHttp.get<Result<PageResult<Task[]>>>({
     url: '/bpm/admin/task/pageByDone',
     params: params,
   })
 }
 
+/**
+ * 分页 我的待办
+ */
+export function pageMyTodo(params) {
+  return defHttp.get<Result<PageResult<Task[]>>>({
+    url: '/bpm/task/pageMyTodo',
+    params: params,
+  })
+}
+
+/**
+ * 分页 我的已办
+ */
+export function pageMyDone(params) {
+  return defHttp.get<Result<PageResult<Task[]>>>({
+    url: '/bpm/task/pageMyDone',
+    params: params,
+  })
+}
+
+/**
+ * 根据任务实例ID查询任务列表
+ */
+export function findAllByInstanceId(instanceId) {
+  return defHttp.get<Result<Task[]>>({
+    url: '/bpm/task/findAllByInstanceId',
+    params: { instanceId },
+  })
+}
+
+/**
+ * 获取流程节点的分组任务信息
+ */
+export function getNodeTasks(instanceId) {
+  return defHttp.get<Result<Record<string, Task[]>>>({
+    url: '/bpm/task/getNodeTasks',
+    method: 'GET',
+    params: { instanceId },
+  })
+}
+
+/**
+ * 任务处理
+ */
+export function approve(obj) {
+  return defHttp.post({
+    url: '/bpm/task/approve',
+    data: obj,
+  })
+}
+
+/**
+ * 任务回退
+ */
+export function flowReturn(obj) {
+  return defHttp.post({
+    url: '/bpm/task/flowReturn',
+    data: obj,
+  })
+}
+
 /**
  * 重新分配人员
  */
@@ -30,3 +91,45 @@ export function assignee(taskId, userId) {
     params: { taskId, userId },
   })
 }
+
+/**
+ * 流程任务扩展
+ */
+export interface Task extends BaseEntity {
+  // 任务ID
+  taskId?: string
+  // 任务执行 ID
+  executionId?: string
+  // 多实例关联id
+  multiId?: string
+  // 流程实例的id
+  instanceId?: string
+  // 流程名称(业务标题)
+  instanceName?: string
+  // 流程定义名称
+  defName?: string
+  // 任务节点id
+  nodeId?: string
+  // 任务节点名称
+  nodeName?: string
+  // 处理状态
+  state?: string
+  // 处理结果
+  result?: string
+  // 处理意见
+  reason?: string
+  // 开始时间
+  startTime?: string
+  // 结束时间
+  endTime?: string
+  // 当前处理人
+  userId?: string
+  // 当前处理人
+  userName?: string
+  // 发起人
+  startUserId?: string
+  // 发起人名称
+  startUserName?: string
+  // 提交的表单值
+  formVariables?: string
+}

src/views/modules/bpm/task/TodoTaskList.vue

@@ -24,6 +24,15 @@
           </template>
         </vxe-column>
       </vxe-table>
+      <vxe-pager
+        border
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
     </div>
     <b-user-select-modal ref="userSelectModal" @ok="assigneeCallback" title="选择委派的用户" :multiple="false" />
   </div>

src/views/modules/office/myapply/MyApplyList.vue

@@ -0,0 +1,89 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query :query-params="model.queryParam" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom zoom :refresh="{ query: queryPage }">
+        <template #buttons>
+          <a-button type="primary" pre-icon="ant-design:plus-outlined" @click="modelShow">发起流程</a-button>
+        </template>
+      </vxe-toolbar>
+      <vxe-table ref="xTable" row-id="id" :loading="loading" :data="pagination.records">
+        <vxe-column type="seq" title="序号" width="60" />
+        <vxe-column field="name" title="标题" />
+        <vxe-column field="defMame" title="流程名称" />
+        <vxe-column field="instanceId" title="实例ID" />
+        <vxe-column field="startUserName" title="发起人" />
+        <vxe-column field="state" title="状态">
+          <template #default="{ row }">
+            {{ dictConvert('BpmInstanceState', row.state) }}
+          </template>
+        </vxe-column>
+        <vxe-column field="startTime" title="开始时间" />
+        <vxe-column field="endTime" title="结束时间" />
+        <vxe-column fixed="right" width="120" :showOverflow="false" title="操作">
+          <template #default="{ row }">
+            <a href="javascript:" @click="show(row)">查看</a>
+            <a-divider type="vertical" />
+            <a href="javascript:" :disabled="row.state !== 'running'" @click="close(row)">取消</a>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        border
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import useTablePage from '/@/hooks/bootx/useTablePage'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { QueryField, STRING } from '/@/components/Bootx/Query/Query'
+  import { $ref } from 'vue/macros'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { onMounted } from 'vue'
+  import { useDict } from '/@/hooks/bootx/useDict'
+  import { pageMyApply } from '/@/views/modules/bpm/instance/Instance.api'
+
+  const { handleTableChange, resetQueryParams, pageQueryResHandel, pagination, pages, model, loading } = useTablePage(queryPage)
+  const { createMessage, createConfirm } = useMessage()
+  const { dictConvert } = useDict()
+
+  // 查询条件
+  const fields = [
+    { field: 'code', type: STRING, name: '流程编号', placeholder: '请输入流程编号' },
+    { field: 'code', type: STRING, name: '流程名称', placeholder: '请输入流程名称' },
+  ] as QueryField[]
+  let xTable = $ref<VxeTableInstance>()
+  let xToolbar = $ref<VxeToolbarInstance>()
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.connect(xToolbar)
+  }
+
+  function queryPage() {
+    loading.value = true
+    pageMyApply({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+  }
+  // 创建流程时的弹窗
+  function modelShow() {}
+</script>
+
+<style scoped></style>

src/views/modules/office/mydone/MyDoneList.vue

@@ -0,0 +1,91 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query :query-params="model.queryParam" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom zoom :refresh="{ query: queryPage }" />
+      <vxe-table ref="xTable" row-id="id" :loading="loading" :data="pagination.records">
+        <vxe-column type="seq" title="序号" width="60" />
+        <vxe-column field="instanceName" title="业务标题" />
+        <vxe-column field="defName" title="流程名称" />
+        <vxe-column field="nodeName" title="环节" />
+        <vxe-column field="taskId" title="任务id" />
+        <vxe-column field="instanceId" title="流程id" />
+        <vxe-column field="startUserName" title="发起人" />
+        <vxe-column field="startTime" title="任务开始时间" />
+        <vxe-column fixed="right" width="120" :showOverflow="false" title="操作">
+          <template #default="{ row }">
+            <a-link @click="show(row)">查看</a-link>
+            <a-divider type="vertical" />
+            <a-link disabled @click="retrieveTask(row)">取回</a-link>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        border
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import ALink from '/@/components/Link/Link.vue'
+  import useTablePage from '/@/hooks/bootx/useTablePage'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { $ref } from 'vue/macros'
+  import { QueryField, STRING } from '/@/components/Bootx/Query/Query'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { onMounted } from 'vue'
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import { pageMyDone } from '/@/views/modules/bpm/task/Task.api'
+
+  const { handleTableChange, resetQueryParams, pageQueryResHandel, pagination, pages, model, loading } = useTablePage(queryPage)
+  const { createMessage, createConfirm } = useMessage()
+
+  // 查询条件
+  const fields = [
+    { field: 'code', type: STRING, name: '流程编号', placeholder: '请输入流程编号' },
+    { field: 'code', type: STRING, name: '流程名称', placeholder: '请输入流程名称' },
+  ] as QueryField[]
+  let xTable = $ref<VxeTableInstance>()
+  let xToolbar = $ref<VxeToolbarInstance>()
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.connect(xToolbar)
+  }
+
+  function queryPage() {
+    loading.value = true
+    pageMyDone({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+  }
+
+  function retrieveTask(record) {
+    createConfirm({
+      iconType: 'warning',
+      title: '警告',
+      content: '确实要取回当前任务!',
+      onOk: () => {
+        loading.value = true
+        createMessage.success('取回成功')
+        queryPage()
+      },
+    })
+  }
+</script>
+
+<style scoped></style>

src/views/modules/office/mytodo/MyTodoList.vue

@@ -0,0 +1,79 @@
+<template>
+  <div>
+    <div class="m-3 p-3 pt-5 bg-white">
+      <b-query :query-params="model.queryParam" :fields="fields" @query="queryPage" @reset="resetQueryParams" />
+    </div>
+    <div class="m-3 p-3 bg-white">
+      <vxe-toolbar ref="xToolbar" custom zoom :refresh="{ query: queryPage }" />
+      <vxe-table ref="xTable" row-id="id" :loading="loading" :data="pagination.records">
+        <vxe-column type="seq" title="序号" width="60" />
+        <vxe-column field="instanceName" title="业务标题" />
+        <vxe-column field="defName" title="流程名称" />
+        <vxe-column field="nodeName" title="环节" />
+        <vxe-column field="taskId" title="任务id" />
+        <vxe-column field="instanceId" title="流程id" />
+        <vxe-column field="startUserName" title="发起人" />
+        <vxe-column field="startTime" title="任务开始时间" />
+        <vxe-column fixed="right" width="150" :showOverflow="false" title="操作">
+          <template #default="{ row }">
+            <a href="javascript:" @click="handle(row)">办理</a>
+            <!--          <a-divider type="vertical"/>-->
+            <!--          <a href="javascript:" @click="reject(row)">驳回</a>-->
+            <a-divider type="vertical" />
+            <a href="javascript:" @click="assignee(row)">委派</a>
+          </template>
+        </vxe-column>
+      </vxe-table>
+      <vxe-pager
+        border
+        size="medium"
+        :loading="loading"
+        :current-page="pagination.current"
+        :page-size="pagination.size"
+        :total="pagination.total"
+        @page-change="handleTableChange"
+      />
+    </div>
+  </div>
+</template>
+
+<script lang="ts" setup>
+  import BQuery from '/@/components/Bootx/Query/BQuery.vue'
+  import useTablePage from '/@/hooks/bootx/useTablePage'
+  import { useMessage } from '/@/hooks/web/useMessage'
+  import { QueryField, STRING } from '/@/components/Bootx/Query/Query'
+  import { $ref } from 'vue/macros'
+  import { VxeTableInstance, VxeToolbarInstance } from 'vxe-table'
+  import { onMounted } from 'vue'
+  import { pageMyTodo } from "/@/views/modules/bpm/task/Task.api";
+
+  const { handleTableChange, resetQueryParams, pageQueryResHandel, pagination, pages, model, loading } = useTablePage(queryPage)
+  const { createMessage, createConfirm } = useMessage()
+
+  // 查询条件
+  const fields = [
+    { field: 'code', type: STRING, name: '流程编号', placeholder: '请输入流程编号' },
+    { field: 'code', type: STRING, name: '流程名称', placeholder: '请输入流程名称' },
+  ] as QueryField[]
+  let xTable = $ref<VxeTableInstance>()
+  let xToolbar = $ref<VxeToolbarInstance>()
+  onMounted(() => {
+    vxeBind()
+    queryPage()
+  })
+  function vxeBind() {
+    xTable.connect(xToolbar)
+  }
+
+  function queryPage() {
+    loading.value = true
+    pageMyTodo({
+      ...model.queryParam,
+      ...pages,
+    }).then(({ data }) => {
+      pageQueryResHandel(data)
+    })
+  }
+</script>
+
+<style scoped></style>