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 | const { t } = useI18n() // 国际化 | 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 | <template> | 1 | <template> |
| 28 | - <!-- 搜索工作区 --> | ||
| 29 | <ContentWrap> | 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 | </template> | 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 | </template> | 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 | </ContentWrap> | 13 | </ContentWrap> |
| 65 | </template> | 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> |