chore: 我的待办 & 请假

apps/web-antd/src/views/workflow/components/approval-timeline.vue

@@ -1,21 +1,15 @@
 <script setup lang="ts">
+import type { Flow } from '#/api/workflow/instance/model';
+
 import { Timeline, TimelineItem } from 'ant-design-vue';
 
 /**
  * TODO: 仅为demo 后期会替换
  */
-import { VbenAvatar } from '../../../../../../packages/@core/ui-kit/shadcn-ui/src/components';
-
-interface ApprovalItem {
-  id: string;
-  name: string;
-  status: string;
-  remark?: string;
-  time: string;
-}
+import { VbenAvatar } from '@vben/common-ui';
 
 const props = defineProps<{
-  list: ApprovalItem[];
+  list: Flow[];
 }>();
 </script>
 
@@ -24,10 +18,7 @@ const props = defineProps<{
     <TimelineItem v-for="item in props.list" :key="item.id">
       <template #dot>
         <div class="relative rounded-full border">
-          <VbenAvatar
-            class="size-[36px]"
-            src="https://plus.dapdap.top/minio-server/plus/2024/11/21/925ed278e2d441beb7f695b41e13c4dd.jpg"
-          />
+          <VbenAvatar :alt="item.approveName" class="size-[36px]" src="" />
           <div
             class="border-background absolute bottom-0 right-0 size-[16px] rounded-full border-2 bg-green-500 content-['']"
           >
@@ -37,12 +28,12 @@ const props = defineProps<{
           </div>
         </div>
       </template>
-      <div class="ml-2 flex flex-col">
-        <div>发起人</div>
-        <div>疯狂的牛子Li</div>
-        <div>2022-01-01 12:00:00</div>
-        <div class="rounded-lg border p-1">
-          <span class="opacity-70">这里是备注信息</span>
+      <div class="ml-2 flex flex-col gap-0.5">
+        <div class="font-bold">{{ item.nodeName }}</div>
+        <div>{{ item.approveName }}</div>
+        <div>{{ item.updateTime }}</div>
+        <div v-if="item.message" class="rounded-lg border p-1">
+          <span class="opacity-70">{{ item.message }}</span>
         </div>
       </div>
     </TimelineItem>