Commit 2f46e230af957e42df23868a590cbfb64f80e536
1 parent
98bf4235
bpm：增加已办任务
Showing
2 changed files
with
79 additions
and
147 deletions
yudao-ui-admin-vue3/src/views/bpm/task/done/done.data.ts
| 1 | -import { CrudSchema, useCrudSchemas } from '@/hooks/web/useCrudSchemas' | |
| 1 | +import { VxeCrudSchema, useVxeCrudSchemas } from '@/hooks/web/useVxeCrudSchemas' | |
| 2 | + | |
| 2 | 3 | const { t } = useI18n() // 国际化 |
| 3 | 4 | |
| 4 | -// CrudSchema | |
| 5 | -const crudSchemas = reactive<CrudSchema[]>([ | |
| 6 | - { | |
| 7 | - label: t('common.index'), | |
| 8 | - field: 'id', | |
| 9 | - type: 'index' | |
| 10 | - }, | |
| 11 | - { | |
| 12 | - label: '任务名称', | |
| 13 | - field: 'name', | |
| 14 | - search: { | |
| 15 | - show: true | |
| 16 | - } | |
| 17 | - }, | |
| 18 | - { | |
| 19 | - label: '所属流程', | |
| 20 | - field: 'processInstance.name' | |
| 21 | - }, | |
| 22 | - { | |
| 23 | - label: '流程发起人', | |
| 24 | - field: 'processInstance.startUserNickname' | |
| 25 | - }, | |
| 26 | - { | |
| 27 | - label: '结果', | |
| 28 | - field: 'result', | |
| 29 | - dictType: DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT, | |
| 30 | - dictClass: 'number' | |
| 31 | - }, | |
| 32 | - { | |
| 33 | - label: '审批意见', | |
| 34 | - field: 'reason' | |
| 35 | - }, | |
| 36 | - { | |
| 37 | - label: t('common.createTime'), | |
| 38 | - field: 'createTime', | |
| 39 | - search: { | |
| 40 | - show: true, | |
| 41 | - component: 'DatePicker', | |
| 42 | - componentProps: { | |
| 43 | - type: 'datetimerange', | |
| 44 | - valueFormat: 'YYYY-MM-DD HH:mm:ss', | |
| 45 | - defaultTime: [new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 2, 1, 23, 59, 59)], | |
| 46 | - shortcuts: [ | |
| 47 | - { | |
| 48 | - text: '近一周', | |
| 49 | - value: () => { | |
| 50 | - const end = new Date() | |
| 51 | - const start = new Date() | |
| 52 | - start.setTime(start.getTime() - 3600 * 1000 * 24 * 7) | |
| 53 | - return [start, end] | |
| 54 | - } | |
| 55 | - }, | |
| 56 | - { | |
| 57 | - text: '近一个月', | |
| 58 | - value: () => { | |
| 59 | - const end = new Date() | |
| 60 | - const start = new Date() | |
| 61 | - start.setTime(start.getTime() - 3600 * 1000 * 24 * 30) | |
| 62 | - return [start, end] | |
| 63 | - } | |
| 64 | - }, | |
| 65 | - { | |
| 66 | - text: '近三个月', | |
| 67 | - value: () => { | |
| 68 | - const end = new Date() | |
| 69 | - const start = new Date() | |
| 70 | - start.setTime(start.getTime() - 3600 * 1000 * 24 * 90) | |
| 71 | - return [start, end] | |
| 72 | - } | |
| 73 | - } | |
| 74 | - ] | |
| 5 | +// crudSchemas | |
| 6 | +const crudSchemas = reactive<VxeCrudSchema>({ | |
| 7 | + primaryKey: 'id', | |
| 8 | + primaryType: null, | |
| 9 | + action: true, | |
| 10 | + columns: [ | |
| 11 | + { | |
| 12 | + title: '任务编号', | |
| 13 | + field: 'id', | |
| 14 | + table: { | |
| 15 | + width: 320 | |
| 16 | + } | |
| 17 | + }, | |
| 18 | + { | |
| 19 | + title: '任务名称', | |
| 20 | + field: 'name', | |
| 21 | + isSearch: true | |
| 22 | + }, | |
| 23 | + { | |
| 24 | + title: '所属流程', | |
| 25 | + field: 'processInstance.name' | |
| 26 | + }, | |
| 27 | + { | |
| 28 | + title: '流程发起人', | |
| 29 | + field: 'processInstance.startUserNickname' | |
| 30 | + }, | |
| 31 | + { | |
| 32 | + title: t('common.status'), | |
| 33 | + field: 'result', | |
| 34 | + dictType: DICT_TYPE.BPM_PROCESS_INSTANCE_RESULT, | |
| 35 | + dictClass: 'number', | |
| 36 | + isSearch: true | |
| 37 | + }, | |
| 38 | + { | |
| 39 | + title: '原因', | |
| 40 | + field: 'reason' | |
| 41 | + }, | |
| 42 | + { | |
| 43 | + title: t('common.createTime'), | |
| 44 | + field: 'createTime', | |
| 45 | + formatter: 'formatDate', | |
| 46 | + table: { | |
| 47 | + width: 180 | |
| 75 | 48 | } |
| 76 | 49 | } |
| 77 | - }, | |
| 78 | - { | |
| 79 | - label: '审批时间', | |
| 80 | - field: 'endTime' | |
| 81 | - }, | |
| 82 | - { | |
| 83 | - label: '耗时', | |
| 84 | - field: 'durationInMillis' | |
| 85 | - }, | |
| 86 | - { | |
| 87 | - label: t('table.action'), | |
| 88 | - field: 'action', | |
| 89 | - width: '100px' | |
| 90 | - } | |
| 91 | -]) | |
| 92 | -export const { allSchemas } = useCrudSchemas(crudSchemas) | |
| 50 | + ] | |
| 51 | +}) | |
| 52 | +export const { allSchemas } = useVxeCrudSchemas(crudSchemas) | ... | ... |
yudao-ui-admin-vue3/src/views/bpm/task/done/index.vue
| 1 | -<script setup lang="ts" name="Done"> | |
| 2 | -import dayjs from 'dayjs' | |
| 3 | -import duration from 'dayjs/plugin/duration' | |
| 4 | -import { DICT_TYPE } from '@/utils/dict' | |
| 5 | -import type { TaskDoneVO } from '@/api/bpm/task/types' | |
| 6 | -import { allSchemas } from './done.data' | |
| 7 | -import * as TaskDoneApi from '@/api/bpm/task' | |
| 8 | -import { useTable } from '@/hooks/web/useTable' | |
| 9 | -dayjs.extend(duration) | |
| 10 | -const { t } = useI18n() // 国际化 | |
| 11 | -const { push } = useRouter() | |
| 12 | -// ========== 列表相关 ========== | |
| 13 | -const { register, tableObject, methods } = useTable<TaskDoneVO>({ | |
| 14 | - getListApi: TaskDoneApi.getDoneTaskPage | |
| 15 | -}) | |
| 16 | -const { getList, setSearchParams } = methods | |
| 17 | - | |
| 18 | -// 审批操作 | |
| 19 | -const handleAudit = async (row: TaskDoneVO) => { | |
| 20 | - push('/bpm/process-instance/detail?id=' + row.processInstance.id) | |
| 21 | -} | |
| 22 | - | |
| 23 | -// ========== 初始化 ========== | |
| 24 | -getList() | |
| 25 | -</script> | |
| 26 | - | |
| 27 | 1 | <template> |
| 28 | - <!-- 搜索工作区 --> | |
| 29 | 2 | <ContentWrap> |
| 30 | - <Search :schema="allSchemas.searchSchema" @search="setSearchParams" @reset="setSearchParams" /> | |
| 31 | - </ContentWrap> | |
| 32 | - <ContentWrap> | |
| 33 | - <!-- 列表 --> | |
| 34 | - <Table | |
| 35 | - :columns="allSchemas.tableColumns" | |
| 36 | - :selection="false" | |
| 37 | - :data="tableObject.tableList" | |
| 38 | - :loading="tableObject.loading" | |
| 39 | - :pagination="{ | |
| 40 | - total: tableObject.total | |
| 41 | - }" | |
| 42 | - v-model:pageSize="tableObject.pageSize" | |
| 43 | - v-model:currentPage="tableObject.currentPage" | |
| 44 | - @register="register" | |
| 45 | - > | |
| 46 | - <template #status="{ row }"> | |
| 47 | - <DictTag :type="DICT_TYPE.COMMON_STATUS" :value="row.status" /> | |
| 48 | - </template> | |
| 49 | - <template #createTime="{ row }"> | |
| 50 | - <span>{{ dayjs(row.createTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | |
| 3 | + <XTable @register="registerTable"> | |
| 4 | + <template #suspensionState_default="{ row }"> | |
| 5 | + <el-tag type="success" v-if="row.suspensionState === 1">激活</el-tag> | |
| 6 | + <el-tag type="warning" v-if="row.suspensionState === 2">挂起</el-tag> | |
| 51 | 7 | </template> |
| 52 | - <template #endTime="{ row }"> | |
| 53 | - <span>{{ dayjs(row.endTime).format('YYYY-MM-DD HH:mm:ss') }}</span> | |
| 8 | + <template #actionbtns_default="{ row }"> | |
| 9 | + <!-- 操作: 审批进度 --> | |
| 10 | + <XTextButton preIcon="ep:view" title="详情" @click="handleAudit(row)" /> | |
| 54 | 11 | </template> |
| 55 | - <template #durationInMillis="{ row }"> | |
| 56 | - <span>{{ dayjs.duration(row.durationInMillis).asMilliseconds() }}</span> | |
| 57 | - </template> | |
| 58 | - <template #action="{ row }"> | |
| 59 | - <el-button link type="primary" v-hasPermi="['bpm:task:query']" @click="handleAudit(row)"> | |
| 60 | - <Icon icon="ep:view" class="mr-1px" /> {{ t('action.detail') }} | |
| 61 | - </el-button> | |
| 62 | - </template> | |
| 63 | - </Table> | |
| 12 | + </XTable> | |
| 64 | 13 | </ContentWrap> |
| 65 | 14 | </template> |
| 15 | + | |
| 16 | +<script setup lang="ts"> | |
| 17 | +// 业务相关的 import | |
| 18 | +import { allSchemas } from './done.data' | |
| 19 | +import * as TaskApi from '@/api/bpm/task' | |
| 20 | + | |
| 21 | +const router = useRouter() // 路由 | |
| 22 | + | |
| 23 | +const [registerTable] = useXTable({ | |
| 24 | + allSchemas: allSchemas, | |
| 25 | + getListApi: TaskApi.getDoneTaskPage | |
| 26 | +}) | |
| 27 | + | |
| 28 | +// 处理审批按钮 | |
| 29 | +const handleAudit = (row) => { | |
| 30 | + router.push({ | |
| 31 | + name: 'BpmProcessInstanceDetail', | |
| 32 | + query: { | |
| 33 | + id: row.processInstanceId | |
| 34 | + } | |
| 35 | + }) | |
| 36 | +} | |
| 37 | +</script> | ... | ... |