| | |
| | | <div v-show="showSearch" class="mb-[10px]"> |
| | | <el-card shadow="hover"> |
| | | <el-form v-show="showSearch" ref="queryFormRef" :model="queryParams" :inline="true"> |
| | | <el-form-item label="任务名称" prop="name"> |
| | | <el-input v-model="queryParams.name" placeholder="请输入任务名称" @keyup.enter="handleQuery" /> |
| | | <el-form-item> |
| | | <el-badge :value="userSelectCount" :max="10" class="item"> |
| | | <el-button type="primary" @click="openUserSelect">选择申请人</el-button> |
| | | </el-badge> |
| | | </el-form-item> |
| | | <el-form-item label="流程定义名称" label-width="100" prop="processDefinitionName"> |
| | | <el-input v-model="queryParams.processDefinitionName" placeholder="请输入流程定义名称" @keyup.enter="handleQuery" /> |
| | | <el-form-item label="任务名称" prop="nodeName"> |
| | | <el-input v-model="queryParams.nodeName" placeholder="请输入任务名称" @keyup.enter="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="流程定义KEY" label-width="100" prop="processDefinitionKey"> |
| | | <el-input v-model="queryParams.processDefinitionKey" placeholder="请输入流程定义KEY" @keyup.enter="handleQuery" /> |
| | | <el-form-item label="流程定义名称" label-width="100" prop="flowName"> |
| | | <el-input v-model="queryParams.flowName" placeholder="请输入流程定义名称" @keyup.enter="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item label="流程定义编码" label-width="100" prop="flowCode"> |
| | | <el-input v-model="queryParams.flowCode" placeholder="请输入流程定义编码" @keyup.enter="handleQuery" /> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button> |
| | |
| | | <el-card shadow="hover"> |
| | | <template #header> |
| | | <el-row :gutter="10" class="mb8"> |
| | | <right-toolbar v-model:showSearch="showSearch" @query-table="handleQuery"></right-toolbar> |
| | | <right-toolbar v-model:show-search="showSearch" @query-table="handleQuery"></right-toolbar> |
| | | </el-row> |
| | | </template> |
| | | |
| | | <el-table v-loading="loading" border :data="taskList" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column align="center" type="index" label="序号" width="60"></el-table-column> |
| | | <el-table-column :show-overflow-tooltip="true" align="center" label="流程定义名称"> |
| | | <el-table-column :show-overflow-tooltip="true" prop="flowName" align="center" label="流程定义名称"></el-table-column> |
| | | <el-table-column align="center" prop="flowCode" label="流程定义编码"></el-table-column> |
| | | <el-table-column align="center" prop="nodeName" label="任务名称"></el-table-column> |
| | | <el-table-column align="center" prop="createByName" label="申请人"></el-table-column> |
| | | <el-table-column align="center" label="办理人"> |
| | | <template #default="scope"> |
| | | <span>{{ scope.row.processDefinitionName }}v{{ scope.row.processDefinitionVersion }}.0</span> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" prop="processDefinitionKey" label="流程定义KEY"></el-table-column> |
| | | <el-table-column align="center" prop="name" label="任务名称"></el-table-column> |
| | | <el-table-column align="center" prop="assigneeName" label="办理人"> |
| | | <template #default="scope"> |
| | | <template v-if="scope.row.participantVo && scope.row.assignee === null"> |
| | | <el-tag v-for="(item, index) in scope.row.participantVo.candidateName" :key="index" type="success"> |
| | | {{ item }} |
| | | <template v-if="scope.row.assigneeNames"> |
| | | <el-tag v-for="(name, index) in scope.row.assigneeNames.split(',')" :key="index" type="success"> |
| | | {{ name }} |
| | | </el-tag> |
| | | </template> |
| | | <template v-else> |
| | | <el-tag type="success"> |
| | | {{ scope.row.assigneeName || '无' }} |
| | | </el-tag> |
| | | <el-tag type="success"> 无</el-tag> |
| | | </template> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" label="流程状态" min-width="70"> |
| | | <el-table-column align="center" label="流程状态" prop="flowStatusName" min-width="70"> |
| | | <template #default="scope"> |
| | | <dict-tag :options="wf_business_status" :value="scope.row.businessStatus"></dict-tag> |
| | | <dict-tag :options="wf_business_status" :value="scope.row.flowStatus"></dict-tag> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column align="center" prop="createTime" label="创建时间" width="160"></el-table-column> |
| | |
| | | @pagination="handleQuery" |
| | | /> |
| | | </el-card> |
| | | <!-- 申请人 --> |
| | | <UserSelect ref="userSelectRef" :multiple="true" :data="selectUserIds" @confirm-call-back="userSelectCallBack"></UserSelect> |
| | | </div> |
| | | </template> |
| | | |
| | | <script lang="ts" setup> |
| | | import { getPageByTaskWait } from '@/api/workflow/task'; |
| | | import { TaskQuery, TaskVO } from '@/api/workflow/task/types'; |
| | | import { pageByTaskWait } from '@/api/workflow/task'; |
| | | import { TaskQuery, FlowTaskVO } from '@/api/workflow/task/types'; |
| | | import workflowCommon from '@/api/workflow/workflowCommon'; |
| | | import { RouterJumpVo } from '@/api/workflow/workflowCommon/types'; |
| | | |
| | | const { proxy } = getCurrentInstance() as ComponentInternalInstance; |
| | | const { wf_business_status } = toRefs<any>(proxy?.useDict('wf_business_status')); |
| | | import UserSelect from '@/components/UserSelect'; |
| | | import { ref } from 'vue'; |
| | | import { UserVO } from '@/api/system/user/types'; |
| | | |
| | | const userSelectRef = ref<InstanceType<typeof UserSelect>>(); |
| | | //提交组件 |
| | | const queryFormRef = ref<ElFormInstance>(); |
| | | // 遮罩层 |
| | |
| | | const total = ref(0); |
| | | // 模型定义表格数据 |
| | | const taskList = ref([]); |
| | | |
| | | //申请人id |
| | | const selectUserIds = ref<Array<number | string>>([]); |
| | | //申请人选择数量 |
| | | const userSelectCount = ref(0); |
| | | // 查询参数 |
| | | const queryParams = ref<TaskQuery>({ |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | name: undefined, |
| | | processDefinitionName: undefined, |
| | | processDefinitionKey: undefined |
| | | nodeName: undefined, |
| | | flowName: undefined, |
| | | flowCode: undefined, |
| | | createByIds: [] |
| | | }); |
| | | onMounted(() => { |
| | | getWaitingList(); |
| | |
| | | queryFormRef.value?.resetFields(); |
| | | queryParams.value.pageNum = 1; |
| | | queryParams.value.pageSize = 10; |
| | | queryParams.value.createByIds = []; |
| | | userSelectCount.value = 0; |
| | | handleQuery(); |
| | | }; |
| | | // 多选框选中数据 |
| | |
| | | //分页 |
| | | const getWaitingList = () => { |
| | | loading.value = true; |
| | | getPageByTaskWait(queryParams.value).then((resp) => { |
| | | pageByTaskWait(queryParams.value).then((resp) => { |
| | | taskList.value = resp.rows; |
| | | total.value = resp.total; |
| | | loading.value = false; |
| | | }); |
| | | }; |
| | | //办理 |
| | | const handleOpen = async (row: TaskVO) => { |
| | | const handleOpen = async (row: FlowTaskVO) => { |
| | | const routerJumpVo = reactive<RouterJumpVo>({ |
| | | wfDefinitionConfigVo: row.wfDefinitionConfigVo, |
| | | wfNodeConfigVo: row.wfNodeConfigVo, |
| | | businessKey: row.businessKey, |
| | | businessId: row.businessId, |
| | | taskId: row.id, |
| | | type: 'approval' |
| | | type: 'approval', |
| | | formCustom: row.formCustom, |
| | | formPath: row.formPath |
| | | }); |
| | | workflowCommon.routerJump(routerJumpVo, proxy); |
| | | }; |
| | | //打开申请人选择 |
| | | const openUserSelect = () => { |
| | | userSelectRef.value.open(); |
| | | }; |
| | | //确认选择申请人 |
| | | const userSelectCallBack = (data: UserVO[]) => { |
| | | userSelectCount.value = 0; |
| | | if (data && data.length > 0) { |
| | | userSelectCount.value = data.length; |
| | | selectUserIds.value = data.map((item) => item.userId); |
| | | queryParams.value.createByIds = selectUserIds.value; |
| | | } |
| | | }; |
| | | </script> |