515fceeb
 “wangming”
框架初始化
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
|
<script setup lang="ts">
import type { Flow } from '#/api/workflow/instance/model';
import { onMounted, ref } from 'vue';
import { VbenAvatar } from '@vben/common-ui';
import { DictEnum } from '@vben/constants';
import { TimelineItem } from 'ant-design-vue';
import { ossInfo } from '#/api/system/oss';
import { renderDict } from '#/utils/render';
defineOptions({
name: 'ApprovalTimelineItem',
});
const props = defineProps<{ item: Flow }>();
interface AttachmentInfo {
ossId: string;
url: string;
name: string;
}
/**
* 处理附件信息
*/
const attachmentInfo = ref<AttachmentInfo[]>([]);
onMounted(async () => {
if (!props.item.ext) {
return null;
}
const resp = await ossInfo(props.item.ext.split(','));
attachmentInfo.value = resp.map((item) => ({
ossId: item.ossId,
url: item.url,
name: item.originalName,
}));
});
</script>
<template>
<TimelineItem>
<template #dot>
<div class="relative rounded-full border">
<VbenAvatar
:alt="item.approveName"
class="bg-primary size-[36px] rounded-full text-white"
src=""
/>
</div>
</template>
<div class="ml-2 flex flex-col gap-0.5">
<div class="flex items-center gap-1">
<div class="font-bold">{{ item.nodeName }}</div>
<component :is="renderDict(item.flowStatus, DictEnum.WF_TASK_STATUS)" />
</div>
<div>{{ item.approveName }}</div>
<div>{{ item.updateTime }}</div>
<div v-if="item.message" class="rounded-lg border p-1">
<div class="break-all opacity-70">{{ item.message }}</div>
</div>
<div v-if="attachmentInfo.length > 0" class="flex flex-wrap gap-2">
<!-- 这里下载的文件名不是原始文件名 -->
<a
v-for="attachment in attachmentInfo"
:key="attachment.ossId"
:href="attachment.url"
class="text-primary"
target="_blank"
>
<div class="flex items-center gap-1">
<span class="icon-[mingcute--attachment-line] size-[18px]"></span>
<span>{{ attachment.name }}</span>
</div>
</a>
</div>
</div>
</TimelineItem>
</template>
|
