From e1434c7b2dac2bd7447b9b4c5b612c5594874b0b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E5=AD=90=E5=A4=9C?= <278898052@qq.com>
Date: Sat, 24 May 2025 16:29:38 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E3=80=90BPM=20=E5=B7=A5=E4=BD=9C?=
 =?UTF-8?q?=E6=B5=81=E3=80=91=E6=96=B0=E5=A2=9EOA=E8=AF=B7=E5=81=87?=
 =?UTF-8?q?=E7=A4=BA=E4=BE=8B=E8=AF=A6=E6=83=85=E9=A1=B5=E9=9D=A2=EF=BC=8C?=
 =?UTF-8?q?=E5=AE=8C=E5=96=84=E8=AF=B7=E5=81=87=E4=BF=A1=E6=81=AF=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=E5=92=8C=E6=95=B0=E6=8D=AE=E8=8E=B7=E5=8F=96=E9=80=BB?=
 =?UTF-8?q?=E8=BE=91?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 apps/web-antd/src/views/bpm/oa/leave/data.ts  | 35 ++++++++++++
 .../src/views/bpm/oa/leave/detail.vue         | 57 ++++++++++++++++---
 2 files changed, 85 insertions(+), 7 deletions(-)

diff --git a/apps/web-antd/src/views/bpm/oa/leave/data.ts b/apps/web-antd/src/views/bpm/oa/leave/data.ts
index 69442dbb..0c404491 100644
--- a/apps/web-antd/src/views/bpm/oa/leave/data.ts
+++ b/apps/web-antd/src/views/bpm/oa/leave/data.ts
@@ -1,9 +1,15 @@
 import type { VbenFormSchema } from '#/adapter/form';
 import type { OnActionClickFn, VxeTableGridOptions } from '#/adapter/vxe-table';
 import type { BpmCategoryApi } from '#/api/bpm/category';
+import type { DescriptionItemSchema } from '#/components/description';
+
+import { h } from 'vue';
 
 import { useAccess } from '@vben/access';
 
+import dayjs from 'dayjs';
+
+import { DictTag } from '#/components/dict-tag';
 import { DICT_TYPE, getDictOptions, getRangePickerDefaultProps } from '#/utils';
 
 const { hasAccessByCodes } = useAccess();
@@ -198,3 +204,32 @@ export function useGridColumns<T = BpmCategoryApi.CategoryVO>(
     },
   ];
 }
+
+/** 详情 */
+export function useDetailFormSchema(): DescriptionItemSchema[] {
+  return [
+    {
+      label: '请假类型',
+      field: 'type',
+      content: (data) =>
+        h(DictTag, {
+          type: DICT_TYPE.BPM_OA_LEAVE_TYPE,
+          value: data?.type,
+        }),
+    },
+    {
+      label: '开始时间',
+      field: 'startTime',
+      content: (data) => dayjs(data?.startTime).format('YYYY-MM-DD HH:mm:ss'),
+    },
+    {
+      label: '结束时间',
+      field: 'endTime',
+      content: (data) => dayjs(data?.endTime).format('YYYY-MM-DD HH:mm:ss'),
+    },
+    {
+      label: '原因',
+      field: 'reason',
+    },
+  ];
+}
diff --git a/apps/web-antd/src/views/bpm/oa/leave/detail.vue b/apps/web-antd/src/views/bpm/oa/leave/detail.vue
index be1701db..38a77298 100644
--- a/apps/web-antd/src/views/bpm/oa/leave/detail.vue
+++ b/apps/web-antd/src/views/bpm/oa/leave/detail.vue
@@ -1,11 +1,54 @@
-<script lang="ts" setup>
-import { Page } from '@vben/common-ui';
+<script setup lang="ts">
+import type { BpmOALeaveApi } from '#/api/bpm/oa/leave';
+
+import { computed, onMounted, ref } from 'vue';
+import { useRoute } from 'vue-router';
+
+import { getLeave } from '#/api/bpm/oa/leave';
+import { ContentWrap } from '#/components/content-wrap';
+import { Description } from '#/components/description';
+
+import { useDetailFormSchema } from './data';
+
+const props = defineProps<{
+  id: string;
+}>();
+const datailLoading = ref(false);
+const detailData = ref<BpmOALeaveApi.LeaveVO>();
+
+const { query } = useRoute();
+const queryId = computed(() => query.id as string);
+
+const getDetailData = async () => {
+  try {
+    datailLoading.value = true;
+    detailData.value = await getLeave(Number(props.id || queryId.value));
+  } finally {
+    datailLoading.value = false;
+  }
+};
+
+onMounted(() => {
+  getDetailData();
+});
 </script>
 
 <template>
-  <Page>
-    <div>
-      <h1>请假详情</h1>
-    </div>
-  </Page>
+  <ContentWrap class="m-2">
+    <Description
+      :data="detailData"
+      :schema="useDetailFormSchema()"
+      :component-props="{
+        column: 1,
+        bordered: true,
+        size: 'small',
+      }"
+    />
+  </ContentWrap>
 </template>
+
+<style lang="scss" scoped>
+:deep(.ant-descriptions-item-label) {
+  width: 150px;
+}
+</style>