first commit

src/pages-bpm/oa/leave/detail/index.vue

@@ -0,0 +1,76 @@
+<template>
+  <view :class="embedded ? '' : 'yd-page-container'">
+    <!-- 顶部导航栏（仅路由访问时显示） -->
+    <wd-navbar
+      v-if="!embedded"
+      title="请假详情"
+      left-arrow placeholder safe-area-inset-top fixed
+      @click-left="handleBack"
+    />
+
+    <!-- 详情内容 -->
+    <view>
+      <wd-cell-group :border="!embedded">
+        <wd-cell title="请假类型">
+          <dict-tag :type="DICT_TYPE.BPM_OA_LEAVE_TYPE" :value="formData.type" />
+        </wd-cell>
+        <wd-cell title="开始时间" :value="formatDateTime(formData.startTime) || '-'" />
+        <wd-cell title="结束时间" :value="formatDateTime(formData.endTime) || '-'" />
+        <wd-cell title="请假原因" :value="formData.reason || '-'" />
+        <wd-cell title="审批状态">
+          <dict-tag :type="DICT_TYPE.BPM_PROCESS_INSTANCE_STATUS" :value="formData.status" />
+        </wd-cell>
+        <wd-cell title="创建时间" :value="formatDateTime(formData.createTime) || '-'" />
+      </wd-cell-group>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import type { Leave } from '@/api/bpm/oa/leave'
+import { onMounted, ref } from 'vue'
+import { useToast } from 'wot-design-uni'
+import { getLeave } from '@/api/bpm/oa/leave'
+import { navigateBackPlus } from '@/utils'
+import { DICT_TYPE } from '@/utils/constants'
+import { formatDateTime } from '@/utils/date'
+
+const props = defineProps<{
+  id?: number | string
+  embedded?: boolean // 是否作为嵌入组件使用（非路由访问）
+}>()
+
+definePage({
+  style: {
+    navigationBarTitleText: '',
+    navigationStyle: 'custom',
+  },
+})
+
+const toast = useToast()
+const formData = ref<Partial<Leave>>({})
+
+/** 返回上一页 */
+function handleBack() {
+  navigateBackPlus('/pages-bpm/oa/leave/index')
+}
+
+/** 获取详情数据 */
+async function getDetail() {
+  if (!props.id) {
+    toast.show('参数错误')
+    return
+  }
+  try {
+    toast.loading('加载中...')
+    formData.value = await getLeave(Number(props.id))
+  } finally {
+    toast.close()
+  }
+}
+
+/** 初始化 */
+onMounted(() => {
+  getDetail()
+})
+</script>