增强办公，新增审批，缺少电子签章功能

2026-04-20 15:56:29 +08:00
parent a026ef7a54
commit cd71a3a457
18 changed files with 1791 additions and 537 deletions
--- a/pages/hrm/approve/approve.vue
+++ b/pages/hrm/approve/approve.vue
@@ -4,6 +4,7 @@
 		<view class="page-nav">
 			<view class="nav-tabs nav-tabs--top">
 				<view class="nav-tab" :class="{ active: activeTopTab === 'approval' }" @click="switchTopTab('approval')">我的审批</view>
+				<view class="nav-tab" :class="{ active: activeTopTab === 'myApply' }" @click="switchTopTab('myApply')">我的申请</view>
 				<view class="nav-tab" :class="{ active: activeTopTab === 'apply' }" @click="switchTopTab('apply')">发起申请</view>
 			</view>
 		</view>
@@ -60,6 +61,52 @@
 			</scroll-view>
 		</view>

+		<view v-else-if="activeTopTab === 'myApply'" class="tab-panel lower-panel my-apply-panel">
+			<view class="sub-tabs sub-tabs--underline">
+				<view class="sub-tab" :class="{ active: myApplyStatusTab === 'all' }" @click="switchMyApplyStatusTab('all')">全部</view>
+				<view class="sub-tab" :class="{ active: myApplyStatusTab === 'running' }" @click="switchMyApplyStatusTab('running')">审批中</view>
+				<view class="sub-tab" :class="{ active: myApplyStatusTab === 'approved' }" @click="switchMyApplyStatusTab('approved')">已通过</view>
+				<view class="sub-tab" :class="{ active: myApplyStatusTab === 'rejected' }" @click="switchMyApplyStatusTab('rejected')">已驳回</view>
+			</view>
+
+			<view class="type-row">
+				<scroll-view class="type-scroll" scroll-x show-scrollbar="false">
+					<view class="type-tabs">
+						<view class="type-tab" :class="{ active: myApplyBizTypeIndex === 0 }" @click="setMyApplyBizType(0)">全部</view>
+						<view class="type-tab" v-for="(item, index) in bizTypeList.slice(1)" :key="item.value" :class="{ active: myApplyBizTypeIndex === index + 1 }" @click="setMyApplyBizType(index + 1)">{{ item.label }}</view>
+					</view>
+				</scroll-view>
+				<view class="refresh-row" @click="refreshCurrentList">
+					<uni-icons type="refreshempty" size="18" color="#1677ff"></uni-icons>
+				</view>
+			</view>
+
+			<scroll-view class="approval-list" scroll-y>
+				<view v-if="loading" class="loading-container">
+					<uni-load-more type="loading" color="#409EFF"></uni-load-more>
+				</view>
+				<view v-else-if="myApplyList.length === 0" class="empty-container">
+					<uni-icons type="empty" size="60" color="#909399"></uni-icons>
+					<view class="empty-text">暂无我的申请</view>
+				</view>
+				<view v-else class="list-item" v-for="(item, index) in myApplyList" :key="item.instId || item.id || index" @click="goDetail(item)">
+					<view class="item-tag" :class="getBizTypeTagType(item.bizType)">{{ getBizTypeText(item.bizType) }}</view>
+					<view class="item-main">
+						<view class="applicant">
+							<uni-icons type="paperplane" size="14" color="#8a8f99"></uni-icons>
+							{{ formatMyApplyTitle(item) }}
+						</view>
+						<view class="request-info">{{ formatMyApplyInfo(item) }}</view>
+						<view class="time-info">{{ formatDate(item.createTime || item.applyTime || item.startTime) }}</view>
+					</view>
+					<view class="right-section">
+						<view class="status-tag" :class="statusType(item.status)">{{ myApplyStatusText(item) }}</view>
+						<view v-if="item.bizType === 'travel' && (item.status === 'approved' || item.status === 'finished') && !item.actualEndTime && !item.endTime && !item.realEndTime" class="early-end-btn" @click.stop="goTravelEarlyEnd(item)">提前结束</view>
+					</view>
+				</view>
+			</scroll-view>
+		</view>
+
 		<view v-else class="tab-panel apply-panel lower-panel">

 			<view class="apply-list">
@@ -78,6 +125,7 @@
 <script>
 import { getUserProfile } from '@/api/oa/user.js';
 import { approveFlowTask, listMyFlowInstance, listTodoFlowTask, listDoneFlowTask, rejectFlowTask } from '@/api/hrm/flow';
+import { earlyEndTravelReq } from '@/api/hrm/travel';

 export default {
 	name: 'HrmApproval',
@@ -89,14 +137,19 @@ export default {
 			todoList: [],
 			doneList: [],
 			ccList: [],
+			myApplyList: [],
 			summary: {
 				todo: 0,
 				done: 0,
-				cc: 0
+				cc: 0,
+				myApply: 0
 			},
 			query: {
 				bizType: ''
 			},
+			myApplyQuery: {
+				bizType: ''
+			},
 			bizTypeList: [
 				{ label: '全部', value: '' },
 				{ label: '请假', value: 'leave' },
@@ -106,6 +159,8 @@ export default {
 				{ label: '拨款', value: 'appropriation' }
 			],
 			bizTypeIndex: 0,
+			myApplyBizTypeIndex: 0,
+			myApplyStatusTab: 'all',
 			currentOaUserId: '',
 			roleGroup: [],
 			applyTypes: [
@@ -124,11 +179,13 @@ export default {
 	},
 	computed: {
 		currentList() {
+			if (this.activeTopTab === 'myApply') return this.myApplyList;
 			if (this.activeApprovalTab === 'todo') return this.todoList;
 			if (this.activeApprovalTab === 'done') return this.doneList;
 			return this.ccList;
 		},
 		emptyText() {
+			if (this.activeTopTab === 'myApply') return '暂无我的申请';
 			const map = {
 				todo: '暂无待处理审批',
 				done: '暂无已处理记录',
@@ -149,6 +206,7 @@ export default {
 				this.$store.commit('oa/SET_STATE', user);
 				this.currentOaUserId = user.userId || '';
 				this.roleGroup = roles;
+				this.myApplyBizTypeIndex = 0;
 				return user;
 			} catch (error) {
 				console.error('获取用户个人信息失败:', error);
@@ -160,6 +218,10 @@ export default {
 			this.activeTopTab = tab;
 			if (tab === 'approval') {
 				this.refreshCurrentList();
+				return;
+			}
+			if (tab === 'myApply') {
+				this.refreshCurrentList();
 			}
 		},
 		switchApprovalTab(tab) {
@@ -167,6 +229,10 @@ export default {
 			this.refreshCurrentList();
 		},
 		refreshCurrentList() {
+			if (this.activeTopTab === 'myApply') {
+				this.loadMyApplyList();
+				return;
+			}
 			if (this.activeTopTab !== 'approval') return;
 			if (this.activeApprovalTab === 'todo') {
 				this.loadTodoList();
@@ -234,6 +300,35 @@ export default {
 				this.loading = false;
 			}
 		},
+		async loadMyApplyList() {
+			this.loading = true;
+			try {
+				const res = await listMyFlowInstance({ pageNum: 1, pageSize: 200 });
+				let list = res.rows || res.data || [];
+				if (this.myApplyQuery.bizType) list = list.filter(item => item.bizType === this.myApplyQuery.bizType);
+				if (this.myApplyStatusTab !== 'all') {
+					list = list.filter(item => this.matchMyApplyStatus(item.status));
+				}
+				this.myApplyList = list;
+				this.summary.myApply = list.length;
+			} catch (err) {
+				console.error('加载我的申请失败:', err);
+				this.myApplyList = [];
+				this.summary.myApply = 0;
+				uni.showToast({ title: '加载我的申请失败', icon: 'none' });
+			} finally {
+				this.loading = false;
+			}
+		},
+		switchMyApplyStatusTab(tab) {
+			this.myApplyStatusTab = tab;
+			this.refreshCurrentList();
+		},
+		setMyApplyBizType(index) {
+			this.myApplyQuery.bizType = this.bizTypeList[index].value;
+			this.myApplyBizTypeIndex = index;
+			this.refreshCurrentList();
+		},
 		getBizTypeText(type) {
 			const map = { leave: '请假', travel: '出差', seal: '用印', reimburse: '报销', appropriation: '拨款' };
 			return map[type] || type || '-';
@@ -242,10 +337,36 @@ export default {
 			const map = { leave: 'primary', travel: 'success', seal: 'warning', reimburse: 'danger', appropriation: 'danger' };
 			return map[type] || 'info';
 		},
+		formatMyApplyTitle(item) {
+			return item?.bizTitle || item?.title || this.getBizTypeText(item?.bizType) || '我的申请';
+		},
+		formatMyApplyInfo(item) {
+			if (!item) return '-';
+			if (item.bizType === 'leave') return item.subTitle || item.leaveType || '请假申请';
+			if (item.bizType === 'travel') return item.subTitle || item.destination || '出差申请';
+			if (item.bizType === 'seal') return item.subTitle || '用印申请';
+			if (item.bizType === 'reimburse') return item.subTitle || '报销申请';
+			if (item.bizType === 'appropriation') return item.subTitle || '拨款申请';
+			return item.subTitle || item.bizTitle || '-';
+		},
+		matchMyApplyStatus(status) {
+			const s = String(status || '').toLowerCase();
+			if (this.myApplyStatusTab === 'running') return ['pending', 'running'].includes(s);
+			if (this.myApplyStatusTab === 'approved') return ['approved', 'finished'].includes(s);
+			if (this.myApplyStatusTab === 'rejected') return ['rejected', 'reject'].includes(s);
+			return true;
+		},
 		statusText(status) {
 			const map = { pending: '待审批', draft: '草稿', approved: '已通过', rejected: '已驳回', running: '审批中', finished: '已完成', revoked: '已撤销' };
 			return map[status] || status || '-';
 		},
+		myApplyStatusText(item) {
+			if (item.bizType === 'travel' && (item.status === 'approved' || item.status === 'finished')) {
+				const endTime = item.actualEndTime || item.endTime || item.realEndTime;
+				return endTime ? '已结束' : '出差中';
+			}
+			return this.statusText(item.status);
+		},
 		statusType(status) {
 			const map = { pending: 'warning', running: 'warning', draft: 'info', approved: 'success', rejected: 'danger', finished: 'success', revoked: 'danger' };
 			return map[status] || 'info';
@@ -332,11 +453,40 @@ export default {
 								this.refreshCurrentList();
 							});
 							break;
-						
+						case 3:
+							this.goTravelEarlyEnd(task);
+							break;
 					}
 				}
 			});
 		},
+		goTravelEarlyEnd(task) {
+			if (!task || task.bizType !== 'travel') {
+				uni.showToast({ title: '仅出差申请支持提前结束', icon: 'none' });
+				return;
+			}
+			const bizId = task.bizId || task.instId;
+			if (!bizId) {
+				uni.showToast({ title: '缺少出差单编号', icon: 'none' });
+				return;
+			}
+			uni.showModal({
+				title: '提前结束出差',
+				content: '确定要提前结束该出差吗？',
+				success: (res) => {
+					if (!res.confirm) return;
+					earlyEndTravelReq(bizId)
+						.then(() => {
+							uni.showToast({ title: '提前结束成功', icon: 'none' });
+							this.refreshCurrentList();
+						})
+						.catch((err) => {
+							console.error('提前结束失败:', err);
+							uni.showToast({ title: '提前结束失败', icon: 'none' });
+						});
+				}
+			});
+		},
 	}
 }
 </script>
@@ -582,6 +732,25 @@ export default {
 .request-info { font-size: 26rpx; color: #6b7280; }
 .time-info { font-size: 24rpx; color: #9ca3af; }

+.early-end-btn {
+	flex: 0 0 auto;
+	padding: 6rpx 16rpx;
+	font-size: 22rpx;
+	color: #1677ff;
+	background: #eef4ff;
+	border-radius: 6rpx;
+	border: 1rpx solid #1677ff;
+}
+
+.right-section {
+	display: flex;
+	flex-direction: column;
+	align-items: flex-end;
+	justify-content: center;
+	gap: 8rpx;
+	padding-right: 8rpx;
+}
+
 .apply-panel {
 	padding-top: 16rpx;
 }
--- a/pages/workbench/hrm/apply/apply.vue
+++ b/pages/workbench/hrm/apply/apply.vue
@@ -1,43 +1,145 @@
 <template>
-	<request-form
-		title="拨款申请"
-		subtitle="填写拨款信息，支持手机端快速提交"
-		biz-type="appropriation"
-		:request-api="submitApply"
-		:initial-form="initialForm"
-		:sections="sections"
-		:flow-fields="flowFields"
-	/>
+	<view class="page">
+		<view class="card">
+			<view class="card-title">基础信息</view>
+
+			<view class="field">
+				<text class="label">拨款类型<text class="req">*</text></text>
+				<picker mode="selector" :range="appropriationTypes" @change="onAppropriationTypeChange">
+					<view class="input-like clickable">{{ appropriationType || '请选择拨款类型' }}</view>
+				</picker>
+			</view>
+
+			<view class="field">
+				<text class="label">拨款金额<text class="req">*</text></text>
+				<input class="input" type="text" :value="amount" placeholder="请输入金额" @input="onAmountInput" />
+			</view>
+
+			<view class="field">
+				<text class="label">附件</text>
+				<view class="input-like clickable" @tap="openFilePicker">点击上传附件</view>
+				<view v-if="uploadedFiles.length" class="file-list">
+					<view v-for="(file, idx) in uploadedFiles" :key="file.ossId || file.url || idx" class="file-item">
+						<text class="file-name">{{ file.originalName || file.fileName || file.name || file.url }}</text>
+						<text class="remove" @tap.stop="removeFile(idx)">删除</text>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="card">
+			<view class="card-title">说明</view>
+			<view class="field">
+				<text class="label">用途说明<text class="req">*</text></text>
+				<textarea v-model="reason" class="textarea" placeholder="请说明拨款用途与依据" />
+			</view>
+			<view class="field">
+				<text class="label">备注</text>
+				<textarea v-model="remark" class="textarea" placeholder="可选" />
+			</view>
+		</view>
+
+		<view class="card">
+			<button class="btn primary" :loading="submitting" @tap="submit">提交申请</button>
+		</view>
+
+		<x-file-picker ref="globalFilePicker" @select="onGlobalFileSelect" />
+	</view>
 </template>

 <script>
-import RequestForm from '@/components/hrm/RequestForm.vue'
 import { addAppropriationReq } from '@/api/hrm/appropriation'
+import { uploadFile } from '@/api/common/upload'
+import XFilePicker from '@/components/x-native-uploader/x-file-picker.vue'

 export default {
-	components: { RequestForm },
+	components: { XFilePicker },
 	data() {
 		return {
-			initialForm: { appropriationType: '', amount: '', reason: '', remark: '' },
-			sections: [
-				{ key: 'basic', title: '基础信息', fields: [
-					{ key: 'appropriationType', label: '拨款类型', type: 'select', required: true, placeholder: '请选择拨款类型', options: ['项目拨款', '部门拨款', '专项拨款', '备用金拨款', '其他'] },
-					{ key: 'amount', label: '拨款金额', type: 'input', inputType: 'digit', required: true, placeholder: '请输入金额' }
-				]},
-				{ key: 'desc', title: '说明', fields: [
-					{ key: 'reason', label: '用途说明', type: 'textarea', required: true, placeholder: '请说明拨款用途与依据' },
-					{ key: 'remark', label: '备注', type: 'textarea', required: false, placeholder: '可选' }
-				]}
-			],
-			flowFields: [
-				{ key: 'appropriationType', label: '拨款类型', required: true },
-				{ key: 'amount', label: '拨款金额', required: true },
-				{ key: 'reason', label: '用途说明', required: true }
-			]
+			appropriationTypes: ['项目拨款', '部门拨款', '专项拨款', '备用金拨款', '其他'],
+			appropriationType: '',
+			amount: '',
+			reason: '',
+			remark: '',
+			accessoryApplyIds: '',
+			uploadedFiles: [],
+			submitting: false
 		}
 	},
-	methods: { submitApply(payload) { return addAppropriationReq(payload) } }
+	methods: {
+		onAppropriationTypeChange(e) {
+			var idx = Number(e.detail.value)
+			this.appropriationType = this.appropriationTypes[idx] || ''
+		},
+		onAmountInput(e) {
+			this.amount = e.detail.value
+		},
+		openFilePicker() {
+			var picker = this.$refs.globalFilePicker
+			if (picker && picker.open) picker.open()
+		},
+		async onGlobalFileSelect(payload) {
+			var files = Array.isArray(payload) ? payload : [payload]
+			for (var i = 0; i < files.length; i++) {
+				var f = files[i]
+				if (!f) continue
+				try {
+					var uploaded = await uploadFile({
+						path: f.path || f.url || '',
+						name: f.name || f.fileName || 'file',
+						size: f.size || 0,
+						type: f.type || ''
+					})
+					this.uploadedFiles.push({
+						name: uploaded.fileName || f.name || f.fileName || 'file',
+						fileName: uploaded.fileName || f.fileName || f.name || '',
+						originalName: f.name || f.fileName || uploaded.fileName || '',
+						url: uploaded.url || f.path || f.url || '',
+						ossId: uploaded.ossId || uploaded.url || f.path || f.url || ''
+					})
+				} catch (e) {
+					uni.showToast({ title: e.message || '上传失败', icon: 'none' })
+				}
+			}
+			this.syncFileIds()
+		},
+		removeFile(idx) {
+			this.uploadedFiles.splice(idx, 1)
+			this.syncFileIds()
+		},
+		syncFileIds() {
+			this.accessoryApplyIds = this.uploadedFiles.map(function (f) { return f.ossId }).join(',')
+		},
+		async submit() {
+			if (!this.appropriationType) return uni.showToast({ title: '请选择拨款类型', icon: 'none' })
+			if (!this.amount) return uni.showToast({ title: '请输入拨款金额', icon: 'none' })
+			if (!this.reason) return uni.showToast({ title: '请填写用途说明', icon: 'none' })
+			this.submitting = true
+			try {
+				await addAppropriationReq({
+					appropriationType: this.appropriationType,
+					amount: this.amount,
+					accessoryApplyIds: this.accessoryApplyIds,
+					reason: this.reason,
+					remark: this.remark,
+					status: 'pending',
+					bizType: 'appropriation'
+				})
+				uni.showToast({ title: '提交成功', icon: 'success' })
+				setTimeout(() => uni.navigateBack({ delta: 1 }), 500)
+			} catch (e) {
+				uni.showToast({ title: e.message || '提交失败', icon: 'none' })
+			} finally {
+				this.submitting = false
+			}
+		}
+	}
 }
 </script>

-<style scoped></style>
+<style scoped>
+.page{min-height:100vh;background:#f5f7fb;padding:24rpx;box-sizing:border-box}
+.card{background:#fff;border-radius:20rpx;padding:24rpx;margin-bottom:20rpx}
+.card-title{font-size:30rpx;font-weight:700;color:#111827;margin-bottom:16rpx}
+.field{margin-bottom:18rpx}.label{display:block;margin-bottom:8rpx;font-size:24rpx;color:#6b7280}.req{color:#ef4444;margin-left:4rpx}.input-like,.input,.textarea{width:100%;box-sizing:border-box;border:1rpx solid #e5e7eb;border-radius:16rpx;background:#f9fafb;padding:20rpx;font-size:28rpx;color:#111827}.input{min-height:88rpx}.clickable{color:#111827}.textarea{min-height:160rpx}.file-list{margin-top:16rpx;display:flex;flex-direction:column;gap:12rpx}.file-item{display:flex;align-items:center;justify-content:space-between;padding:18rpx 18rpx;border-radius:16rpx;background:#f8fafc;border:1rpx solid #e5eefc}.file-name{flex:1;font-size:26rpx;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:16rpx}.remove{font-size:24rpx;color:#ef4444;flex-shrink:0}.btn.primary{width:100%;background:#1677ff;color:#fff;border-radius:16rpx}
+</style>
--- a/pages/workbench/hrm/approve/approve.vue
+++ b/pages/workbench/hrm/approve/approve.vue
@@ -2,10 +2,6 @@
 	<view class="hrm-page">
 		<!-- 顶部统计栏 -->
 		<view class="summary-bar">
-			<view class="summary-left">
-				<view class="page-title">审批中心</view>
-				<view class="page-desc">集中查看与处理待办审批</view>
-			</view>
 			<view class="summary-right">
 				<view class="metric">
 					<view class="metric-value">{{ todoCount }}</view>
--- a/pages/workbench/hrm/detail/detail.vue
+++ b/pages/workbench/hrm/detail/detail.vue
@@ -1,13 +1,58 @@
 <template>
 	<view class="approval-detail-page">
-		<!-- 动态渲染不同类型的审批详情组件 -->
+		<view class="flow-summary-card" v-if="detailData">
+			<view class="summary-head">
+				<text class="summary-title">审批信息</text>
+				<text class="status-tag" :class="statusClass(detailData.flowStatus)">{{ statusText(detailData.flowStatus) }}</text>
+			</view>
+			<view class="summary-grid">
+				<view class="summary-item">
+					<text class="label">是否通过</text>
+					<text class="value">{{ detailData.approved ? '已通过' : (detailData.flowStatus === 'rejected' ? '已驳回' : '待审批') }}</text>
+				</view>
+				<view class="summary-item">
+					<text class="label">当前状态</text>
+					<text class="value">{{ statusText(detailData.flowStatus) }}</text>
+				</view>
+				<view class="summary-item">
+					<text class="label">当前节点</text>
+					<text class="value">{{ detailData.currentNodeName || detailData.currentNodeId || '-' }}</text>
+				</view>
+				<view class="summary-item">
+					<text class="label">当前审批人</text>
+					<text class="value">{{ assigneeText }}</text>
+				</view>
+			</view>
+		</view>
+
+		<view class="flow-history-card" v-if="detailData && detailData.actionTimeline && detailData.actionTimeline.length">
+			<view class="card-title">审批流程</view>
+			<view class="timeline-item" v-for="(item, index) in detailData.actionTimeline" :key="item.actionId || index">
+				<view class="timeline-dot" :class="item.action"></view>
+				<view class="timeline-line" v-if="index !== detailData.actionTimeline.length - 1"></view>
+				<view class="timeline-content">
+					<view class="timeline-header">
+						<text class="timeline-name">{{ item.actionUserName || '未知审批人' }}</text>
+						<text class="timeline-time">{{ formatTime(item.createTime) }}</text>
+					</view>
+					<view class="timeline-meta">
+						<text>节点：{{ item.nodeName || item.nodeId || '-' }}</text>
+						<text>动作：{{ item.actionText || item.action || '-' }}</text>
+					</view>
+					<view class="timeline-meta">
+						<text>任务状态：{{ statusText(item.taskStatus) }}</text>
+					</view>
+					<view class="timeline-remark" v-if="item.remark">意见：{{ item.remark }}</view>
+				</view>
+			</view>
+		</view>
+		
 		<component 
 			:is="currentDetailComponent" 
 			:bizId="bizId" 
 			v-if="bizId && bizType"
 		></component>
 		
-		<!-- 底部固定的审批操作按钮栏 -->
 		<view class="approval-btn-bar" v-if="canApprove">
 			<button class="btn reject-btn" @click="handleReject">驳回</button>
 			<button class="btn approve-btn" @click="handleApprove">通过</button>
@@ -21,17 +66,14 @@
 	import HRMSealDetail from '@/components/hrm/detailPanels/seal.vue'
 	import HRMTravelDetail from '@/components/hrm/detailPanels/travel.vue'
 	import HRMAppropriationDetail from '@/components/hrm/detailPanels/appropriation.vue'
-	
 	import {
 		approveFlowTask,
-		listTodoFlowTask,
 		rejectFlowTask,
-		getTodoTaskByBiz,
+		getFlowTaskDetailByBiz,
 	} from '@/api/hrm/flow';
 	
 	export default {
 		components: {
-			// 注册所有详情组件，供动态组件使用
 			HRMLeaveDetail,
 			HRMReimburseDetail,
 			HRMSealDetail,
@@ -42,73 +84,82 @@
 			return {
 				bizId: undefined,
 				bizType: undefined,
-				currentTask: undefined,
-				// 映射bizType到对应的组件名（需和你的bizType实际值匹配，可自行调整）
+				detailData: null,
 				bizTypeComponentMap: {
-					leave: 'HRMLeaveDetail',       // 请假
-					reimburse: 'HRMReimburseDetail', // 报销
-					seal: 'HRMSealDetail',         // 用章
-					travel: 'HRMTravelDetail'      ,// 差旅
+					leave: 'HRMLeaveDetail',
+					reimburse: 'HRMReimburseDetail',
+					seal: 'HRMSealDetail',
+					travel: 'HRMTravelDetail',
 					appropriation: 'HRMAppropriationDetail'
 				}
 			}
 		},
 		computed: {
-			// 计算属性：根据bizType获取当前要渲染的组件名
 			currentDetailComponent() {
 				return this.bizTypeComponentMap[this.bizType] || '';
 			},
-			canApprove() {
-				console.log(this.currentTask, this.$store.getters.storeOaName, this.$store.getters.storeOaId)
-			  return this.currentTask && this.currentTask.status === 'pending' && 
-				(this.currentTask?.assigneeUserName === this.$store.getters.storeOaName 
-				|| this.currentTask?.assigneeUserId === this.$store.getters.storeOaId)
+			currentTask() {
+				return this.detailData?.currentTask || null;
 			},
+			canApprove() {
+				return this.currentTask && this.currentTask.status === 'pending' && 
+					(this.currentTask?.assigneeUserName === this.$store.getters.storeOaName 
+					|| this.currentTask?.assigneeUserId === this.$store.getters.storeOaId)
+			},
+			assigneeText() {
+				return this.currentTask?.assigneeNickName || this.currentTask?.assigneeUserName || this.currentTask?.assigneeUserId || '-';
+			}
 		},
 		watch: {
 			bizId: {
-				immediate: true, // 页面加载时立即执行（原代码缺失，导致首次赋值不触发）
+				immediate: true,
 				handler(newVal) {
 					if (!newVal || !this.bizType) return;
-					// 获取当前审批任务信息
-					getTodoTaskByBiz(this.bizType, newVal)
+					getFlowTaskDetailByBiz(this.bizType, newVal)
 						.then(res => {
-							this.currentTask = res.data;
+							this.detailData = res.data || null;
 						})
 						.catch(err => {
-							uni.showToast({
-								title: '获取审批信息失败',
-								icon: 'none'
-							});
-							console.error('获取审批任务失败：', err);
+							console.error('获取审批详情失败：', err);
 						});
 				}
 			}
 		},
 		methods: {
-			/**
-			 * 审批通过
-			 */
+			statusText(status) {
+				const map = {
+					pending: '审批中',
+					running: '流转中',
+					approved: '已通过',
+					rejected: '已驳回',
+					reject: '已驳回',
+					withdraw: '已撤回',
+					withdrawn: '已撤回'
+				};
+				return map[status] || status || '-';
+			},
+			statusClass(status) {
+				return status || 'default';
+			},
+			formatTime(time) {
+				if (!time) return '-';
+				const d = new Date(time);
+				return Number.isNaN(d.getTime()) ? time : `${d.getFullYear()}-${String(d.getMonth()+1).padStart(2,'0')}-${String(d.getDate()).padStart(2,'0')} ${String(d.getHours()).padStart(2,'0')}:${String(d.getMinutes()).padStart(2,'0')}`;
+			},
 			handleApprove() {
 				if (!this.currentTask?.taskId) {
 					uni.showToast({ title: '暂无审批任务', icon: 'none' });
 					return;
 				}
-				
-				// 二次确认
 				uni.showModal({
 					title: '确认通过',
 					content: '是否确定通过该审批？',
-					// 箭头函数保留this指向
 					success: (res) => {
 						if (res.confirm) {
 							approveFlowTask(this.currentTask.taskId)
 								.then(() => {
 									uni.showToast({ title: '审批通过成功' });
-									// 成功后返回上一页（可根据需求调整）
-									setTimeout(() => {
-										uni.navigateBack();
-									}, 1500);
+									setTimeout(() => uni.navigateBack(), 1500);
 								})
 								.catch(err => {
 									uni.showToast({ title: '审批通过失败', icon: 'none' });
@@ -118,17 +169,11 @@
 					}
 				});
 			},
-			
-			/**
-			 * 审批驳回
-			 */
 			handleReject() {
 				if (!this.currentTask?.taskId) {
 					uni.showToast({ title: '暂无审批任务', icon: 'none' });
 					return;
 				}
-				
-				// 二次确认（可扩展：添加驳回理由输入框）
 				uni.showModal({
 					title: '确认驳回',
 					content: '是否确定驳回该审批？',
@@ -137,10 +182,7 @@
 							rejectFlowTask(this.currentTask.taskId)
 								.then(() => {
 									uni.showToast({ title: '审批驳回成功' });
-									// 成功后返回上一页（可根据需求调整）
-									setTimeout(() => {
-										uni.navigateBack();
-									}, 1500);
+									setTimeout(() => uni.navigateBack(), 1500);
 								})
 								.catch(err => {
 									uni.showToast({ title: '审批驳回失败', icon: 'none' });
@@ -151,14 +193,9 @@
 				});
 			}
 		},
-		
 		onLoad(options) {
-			console.log('页面入参：', options);
-			// 校验入参，避免undefined
 			this.bizId = options.bizId || '';
 			this.bizType = options.bizType || '';
-			
-			// 入参缺失提示
 			if (!this.bizId || !this.bizType) {
 				uni.showToast({ title: '参数缺失，无法加载详情', icon: 'none' });
 			}
@@ -167,46 +204,60 @@
 </script>

 <style scoped>
-/* 页面容器 */
 .approval-detail-page {
 	min-height: 100vh;
-	padding-bottom: 120rpx; /* 给底部按钮栏留空间 */
+	padding: 24rpx 24rpx 140rpx;
+	background: #f7f8fa;
 }
-
-/* 底部审批按钮栏 */
-.approval-btn-bar {
-	position: fixed;
-	bottom: 0;
-	left: 0;
-	right: 0;
+.flow-summary-card, .flow-history-card {
+	background: #fff;
+	border-radius: 24rpx;
+	padding: 24rpx;
+	margin-bottom: 24rpx;
+	box-shadow: 0 8rpx 30rpx rgba(0,0,0,0.04);
+}
+.summary-head {
 	display: flex;
-	padding: 20rpx;
-	background-color: #fff;
-	border-top: 1px solid #eee;
-	z-index: 99;
+	justify-content: space-between;
+	align-items: center;
+	margin-bottom: 20rpx;
 }
-
-/* 按钮通用样式 */
-.btn {
-	flex: 1;
-	height: 88rpx;
-	line-height: 88rpx;
-	border-radius: 44rpx;
+.summary-title, .card-title {
 	font-size: 32rpx;
-	border: none;
-	margin: 0 10rpx;
+	font-weight: 600;
+	color: #1f2937;
 }
-
-/* 驳回按钮样式 */
-.reject-btn {
-	background-color: #fff;
-	color: #ff4757;
-	border: 1px solid #ff4757;
+.status-tag {
+	padding: 8rpx 16rpx;
+	border-radius: 999rpx;
+	font-size: 24rpx;
+	background: #eef2ff;
+	color: #4f46e5;
 }
-
-/* 通过按钮样式 */
-.approve-btn {
-	background-color: #007aff;
-	color: #fff;
+.summary-grid {
+	display: flex;
+	flex-wrap: wrap;
+	gap: 16rpx;
 }
-</style>
+.summary-item {
+	width: calc(50% - 8rpx);
+	background: #f8fafc;
+	border-radius: 16rpx;
+	padding: 20rpx;
+}
+.label { display:block; color:#6b7280; font-size:24rpx; margin-bottom: 8rpx; }
+.value { display:block; color:#111827; font-size:28rpx; font-weight:500; }
+.timeline-item { position: relative; display:flex; padding-top: 24rpx; }
+.timeline-dot { width: 18rpx; height:18rpx; border-radius:50%; background:#cbd5e1; margin-right: 16rpx; margin-top: 8rpx; flex-shrink:0; }
+.timeline-dot.approve, .timeline-dot.approved, .timeline-dot.running { background:#22c55e; }
+.timeline-dot.reject, .timeline-dot.rejected { background:#ef4444; }
+.timeline-line { position:absolute; left: 8rpx; top: 36rpx; bottom:-4rpx; width:2rpx; background:#e5e7eb; }
+.timeline-content { flex:1; padding-bottom: 8rpx; }
+.timeline-header, .timeline-meta { display:flex; justify-content:space-between; gap: 16rpx; font-size:24rpx; color:#6b7280; }
+.timeline-name { color:#111827; font-weight:600; }
+.timeline-remark { margin-top: 8rpx; color:#374151; font-size:26rpx; }
+.approval-btn-bar { position: fixed; bottom: 0; left: 0; right: 0; display: flex; padding: 20rpx; background-color: #fff; border-top: 1px solid #eee; z-index: 99; }
+.btn { flex: 1; height: 88rpx; line-height: 88rpx; border-radius: 44rpx; font-size: 32rpx; border: none; margin: 0 10rpx; }
+.reject-btn { background-color: #fff; color: #ff4757; border: 1px solid #ff4757; }
+.approve-btn { background-color: #007aff; color: #fff; }
+</style>
--- a/pages/workbench/hrm/leave/leave.vue
+++ b/pages/workbench/hrm/leave/leave.vue
@@ -42,7 +42,7 @@ export default {
 		}
 	},
 	methods: {
-		submitLeave(payload) { return addLeaveReq(payload) }
+		submitLeave(payload) { return addLeaveReq({ ...payload, status: 'pending', bizType: 'leave' }) }
 	}
 }
 </script>
--- a/pages/workbench/hrm/reimburse/reimburse.vue
+++ b/pages/workbench/hrm/reimburse/reimburse.vue
@@ -1,44 +1,142 @@
 <template>
-	<request-form
-		title="报销申请"
-		subtitle="填写报销信息，支持手机端快速提交"
-		biz-type="reimburse"
-		:request-api="submitReimburse"
-		:initial-form="initialForm"
-		:sections="sections"
-		:flow-fields="flowFields"
-	/>
+	<view class="page">
+		<view class="card">
+			<view class="card-title">基础信息</view>
+
+			<view class="field">
+				<text class="label">报销类型<text class="req">*</text></text>
+				<picker mode="selector" :range="reimburseTypes" @change="onReimburseTypeChange">
+					<view class="input-like clickable">{{ reimburseType || '请选择报销类型' }}</view>
+				</picker>
+			</view>
+
+			<view class="field">
+				<text class="label">报销金额<text class="req">*</text></text>
+				<input class="input" type="text" :value="totalAmount" placeholder="请输入金额" @input="onAmountInput" />
+			</view>
+
+			<view class="field">
+				<text class="label">附件</text>
+				<view class="input-like clickable" @tap="openFilePicker">点击上传附件</view>
+				<view v-if="uploadedFiles.length" class="file-list">
+					<view v-for="(file, idx) in uploadedFiles" :key="file.ossId || file.url || idx" class="file-item">
+						<text class="file-name">{{ file.originalName || file.fileName || file.name || file.url }}</text>
+						<text class="remove" @tap.stop="removeFile(idx)">删除</text>
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view class="card">
+			<view class="card-title">说明</view>
+			<view class="field">
+				<text class="label">事由<text class="req">*</text></text>
+				<textarea v-model="reason" class="textarea" placeholder="请说明报销用途" />
+			</view>
+			<view class="field">
+				<text class="label">备注</text>
+				<textarea v-model="remark" class="textarea" placeholder="可选" />
+			</view>
+		</view>
+
+		<view class="card">
+			<button class="btn primary" :loading="submitting" @tap="submit">提交申请</button>
+		</view>
+
+		<x-file-picker ref="globalFilePicker" @select="onGlobalFileSelect" />
+	</view>
 </template>

 <script>
-import RequestForm from '@/components/hrm/RequestForm.vue'
 import { addReimburseReq } from '@/api/hrm/reimburse'
+import { uploadFile } from '@/api/common/upload'
+import XFilePicker from '@/components/x-native-uploader/x-file-picker.vue'

 export default {
-	components: { RequestForm },
+	components: { XFilePicker },
 	data() {
 		return {
-			initialForm: { reimburseType: '', totalAmount: '', applyFileIds: '', reason: '', remark: '' },
-			sections: [
-				{ key: 'basic', title: '基础信息', fields: [
-					{ key: 'reimburseType', label: '报销类型', type: 'select', required: true, placeholder: '请选择报销类型', options: ['差旅报销', '招待报销', '采购报销', '办公报销', '其他'] },
-					{ key: 'totalAmount', label: '报销金额', type: 'input', inputType: 'digit', required: true, placeholder: '请输入金额' },
-					{ key: 'applyFileIds', label: '附件', type: 'file', required: false, placeholder: '上传附件文件' }
-				]},
-				{ key: 'desc', title: '说明', fields: [
-					{ key: 'reason', label: '事由', type: 'textarea', required: true, placeholder: '请说明报销用途' },
-					{ key: 'remark', label: '备注', type: 'textarea', required: false, placeholder: '可选' }
-				]}
-			],
-			flowFields: [
-				{ key: 'reimburseType', label: '报销类型', required: true },
-				{ key: 'totalAmount', label: '报销金额', required: true },
-				{ key: 'reason', label: '事由', required: true }
-			]
+			reimburseTypes: ['差旅报销', '招待报销', '采购报销', '办公报销', '其他'],
+			reimburseType: '',
+			totalAmount: '',
+			reason: '',
+			remark: '',
+			applyFileIds: '',
+			uploadedFiles: [],
+			submitting: false
 		}
 	},
-	methods: { submitReimburse(payload) { return addReimburseReq(payload) } }
+	methods: {
+		onReimburseTypeChange(e) {
+			var idx = Number(e.detail.value)
+			this.reimburseType = this.reimburseTypes[idx] || ''
+		},
+		onAmountInput(e) {
+			this.totalAmount = e.detail.value
+		},
+		openFilePicker() {
+			var picker = this.$refs.globalFilePicker
+			if (picker && picker.open) picker.open()
+		},
+		async onGlobalFileSelect(payload) {
+			var files = Array.isArray(payload) ? payload : [payload]
+			for (var i = 0; i < files.length; i++) {
+				var f = files[i]
+				if (!f) continue
+				try {
+					var uploaded = await uploadFile({
+						path: f.path || f.url || '',
+						name: f.name || f.fileName || 'file',
+						size: f.size || 0,
+						type: f.type || ''
+					})
+					this.uploadedFiles.push({
+						name: uploaded.fileName || f.name || f.fileName || 'file',
+						fileName: uploaded.fileName || f.fileName || f.name || '',
+						originalName: f.name || f.fileName || uploaded.fileName || '',
+						url: uploaded.url || f.path || f.url || '',
+						ossId: uploaded.ossId || uploaded.url || f.path || f.url || ''
+					})
+				} catch (e) {
+					uni.showToast({ title: e.message || '上传失败', icon: 'none' })
+				}
+			}
+			this.syncFileIds()
+		},
+		removeFile(idx) {
+			this.uploadedFiles.splice(idx, 1)
+			this.syncFileIds()
+		},
+		syncFileIds() {
+			this.applyFileIds = this.uploadedFiles.map(function (f) { return f.ossId }).join(',')
+		},
+		async submit() {
+			if (!this.reimburseType) return uni.showToast({ title: '请选择报销类型', icon: 'none' })
+			if (!this.totalAmount) return uni.showToast({ title: '请输入报销金额', icon: 'none' })
+			if (!this.reason) return uni.showToast({ title: '请填写事由', icon: 'none' })
+			this.submitting = true
+			try {
+				await addReimburseReq({
+					reimburseType: this.reimburseType,
+					totalAmount: this.totalAmount,
+					applyFileIds: this.applyFileIds,
+					reason: this.reason,
+					remark: this.remark,
+					status: 'pending',
+					bizType: 'reimburse'
+				})
+				uni.showToast({ title: '提交成功', icon: 'success' })
+				setTimeout(() => uni.navigateBack({ delta: 1 }), 500)
+			} catch (e) {
+				uni.showToast({ title: e.message || '提交失败', icon: 'none' })
+			} finally {
+				this.submitting = false
+			}
+		}
+	}
 }
 </script>

-<style scoped></style>
+<style scoped>
+.page{min-height:100vh;background:#f5f7fb;padding:24rpx;box-sizing:border-box}.card{background:#fff;border-radius:20rpx;padding:24rpx;margin-bottom:20rpx}.field{margin-bottom:18rpx}.label{display:block;margin-bottom:8rpx;font-size:24rpx;color:#6b7280}.req{color:#ef4444;margin-left:4rpx}.input-like,.input,.textarea{width:100%;box-sizing:border-box;border:1rpx solid #e5e7eb;border-radius:16rpx;background:#f9fafb;padding:20rpx;font-size:28rpx;color:#111827}.input{min-height:88rpx}.clickable{color:#111827}.textarea{min-height:160rpx}.file-list{margin-top:16rpx;display:flex;flex-direction:column;gap:12rpx}.file-item{display:flex;align-items:center;justify-content:space-between;padding:18rpx 18rpx;border-radius:16rpx;background:#f8fafc;border:1rpx solid #e5eefc}.file-name{flex:1;font-size:26rpx;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:16rpx}.remove{font-size:24rpx;color:#ef4444;flex-shrink:0}.btn.primary{width:100%;background:#1677ff;color:#fff;border-radius:16rpx}
+</style>
--- a/pages/workbench/hrm/seal/seal.vue
+++ b/pages/workbench/hrm/seal/seal.vue
@@ -22,7 +22,7 @@ export default {
 			sections: [
 				{ key: 'basic', title: '基础信息', fields: [
 					{ key: 'sealType', label: '用印类型', type: 'select', required: true, placeholder: '请选择用印类型', options: ['合同用印', '公章', '财务章', '法人章', '其他'] },
-					{ key: 'applyFileIds', label: '附件', type: 'file', required: true, placeholder: '上传盖章文件' }
+					{ key: 'applyFileIds', label: '附件', type: 'file', required: true, placeholder: '上传盖章文件', accept: '.pdf' }
 				]},
 				{ key: 'desc', title: '说明', fields: [
 					{ key: 'reason', label: '用途说明', type: 'textarea', required: true, placeholder: '请说明盖章用途与背景' },
@@ -36,7 +36,7 @@ export default {
 			]
 		}
 	},
-	methods: { submitSeal(payload) { return addSealReq(payload) } }
+	methods: { submitSeal(payload) { return addSealReq({ ...payload, status: 'pending', bizType: 'seal' }) } }
 }
 </script>

--- a/pages/workbench/hrm/travel/travel.vue
+++ b/pages/workbench/hrm/travel/travel.vue
@@ -1,48 +1,301 @@
 <template>
-	<request-form
-		title="出差申请"
-		subtitle="填写出差信息，支持手机端快速提交"
-		biz-type="travel"
-		:request-api="submitTravel"
-		:initial-form="initialForm"
-		:sections="sections"
-		:flow-fields="flowFields"
-	/>
+	<view class="page">
+		<view class="card">
+			<view class="card-title">基础信息</view>
+
+			<view class="field">
+				<text class="label">出差类型<text class="req">*</text></text>
+				<picker mode="selector" :range="travelTypes" @change="onTravelTypeChange">
+					<view class="input-like clickable">{{ travelType || '请选择出差类型' }}</view>
+				</picker>
+			</view>
+
+			<view class="field">
+				<text class="label">开始时间<text class="req">*</text></text>
+				<view class="input-like clickable" @tap="openDateTime('startTime')">{{ formatDateTime(startTime) || '请选择开始时间' }}</view>
+			</view>
+
+			<view class="field">
+				<text class="label">结束时间<text class="req">*</text></text>
+				<view class="input-like clickable" @tap="openDateTime('endTime')">{{ formatDateTime(endTime) || '请选择结束时间' }}</view>
+			</view>
+
+			<view class="field">
+				<text class="label">目的地<text class="req">*</text></text>
+				<view class="input-like clickable" @tap="openCityPicker">{{ destination || '请选择城市' }}</view>
+			</view>
+
+			<view class="field">
+				<text class="label">预估费用</text>
+				<input class="input" type="text" :value="estimatedCost" placeholder="请输入预估费用" @input="onEstimatedCostInput" />
+			</view>
+		</view>
+
+		<view class="card">
+			<view class="card-title">审批信息</view>
+
+			<view class="field">
+				<text class="label">审批人<text class="req">*</text></text>
+				<view class="input-like clickable" @tap="openEmployeePicker('assignee')">{{ employeeLoading ? '审批人加载中...' : (assigneeLabel || '请选择审批人') }}</view>
+			</view>
+
+			<view class="field">
+				<text class="label">抄送人</text>
+				<view class="input-like clickable" @tap="openEmployeePicker('cc')">{{ employeeLoading ? '抄送人加载中...' : ccLabel }}</view>
+			</view>
+		</view>
+
+		<view class="card">
+			<view class="card-title">说明</view>
+			<view class="field">
+				<text class="label">事由<text class="req">*</text></text>
+				<textarea v-model="reason" class="textarea" placeholder="请说明出差目的与任务" />
+			</view>
+			<view class="field">
+				<text class="label">附件</text>
+				<view class="input-like clickable" @tap="openFilePicker">点击上传附件文件</view>
+				<view v-if="uploadedFiles.length" class="file-list">
+					<view v-for="(file, idx) in uploadedFiles" :key="file.ossId || file.url || idx" class="file-item">
+						<text class="file-name">{{ file.originalName || file.fileName || file.name || file.url }}</text>
+						<text class="remove" @tap.stop="removeFile(idx)">删除</text>
+					</view>
+				</view>
+			</view>
+			<view class="field">
+				<text class="label">备注</text>
+				<textarea v-model="remark" class="textarea" placeholder="可选" />
+			</view>
+		</view>
+
+		<view class="card">
+			<button class="btn primary" :loading="submitting" @tap="submit">提交申请</button>
+		</view>
+
+		<x-file-picker ref="globalFilePicker" @select="onGlobalFileSelect" />
+		<employee-picker
+			:visible.sync="employeeSheetVisible"
+			:title="employeeMode === 'assignee' ? '选择审批人' : '选择抄送人'"
+			:list="employees"
+			:multiple="employeeMode === 'cc'"
+			:value="employeeMode === 'assignee' ? assignee : ccUsers"
+			@change="onEmployeeChange"
+		/>
+		<date-time-picker :visible.sync="dateTimeSheetVisible" :value="dateValue" @change="onDateChange" />
+		<city-picker :visible.sync="citySheetVisible" :value="destination" @change="onCityChange" />
+	</view>
 </template>

 <script>
-import RequestForm from '@/components/hrm/RequestForm.vue'
 import { addTravelReq } from '@/api/hrm/travel'
+import { listUser } from '@/api/oa/user'
+import { getEmployeeByUserId } from '@/api/hrm/employee'
+import { uploadFile } from '@/api/common/upload'
+import EmployeePicker from '@/components/hrm/EmployeePicker.vue'
+import DateTimePicker from '@/components/hrm/DateTimePicker.vue'
+import CityPicker from '@/components/hrm/CityPicker.vue'
+import XFilePicker from '@/components/x-native-uploader/x-file-picker.vue'

 export default {
-	components: { RequestForm },
+	components: { EmployeePicker, DateTimePicker, CityPicker, XFilePicker },
 	data() {
 		return {
-			initialForm: { travelType: '', startTime: '', endTime: '', destination: '', reason: '', applyFileIds: '', remark: '' },
-			sections: [
-				{ key: 'basic', title: '基础信息', fields: [
-					{ key: 'travelType', label: '出差类型', type: 'select', required: true, placeholder: '请选择出差类型', options: ['客户拜访', '项目支持', '培训学习', '会议会展', '验收交付', '其他'] },
-					{ key: 'startTime', label: '开始时间', type: 'datetime', required: true, placeholder: '请选择开始时间' },
-					{ key: 'endTime', label: '结束时间', type: 'datetime', required: true, placeholder: '请选择结束时间' },
-					{ key: 'destination', label: '目的地', type: 'city', required: true, placeholder: '请选择全球城市' }
-				]},
-				{ key: 'desc', title: '说明', fields: [
-					{ key: 'reason', label: '事由', type: 'textarea', required: true, placeholder: '请说明出差目的与任务' },
-					{ key: 'applyFileIds', label: '附件', type: 'file', required: false, placeholder: '上传附件文件' },
-					{ key: 'remark', label: '备注', type: 'textarea', required: false, placeholder: '可选' }
-				]}
-			],
-			flowFields: [
-				{ key: 'travelType', label: '出差类型', required: true },
-				{ key: 'startTime', label: '开始时间', required: true },
-				{ key: 'endTime', label: '结束时间', required: true },
-				{ key: 'destination', label: '目的地', required: true },
-				{ key: 'reason', label: '事由', required: true }
-			]
+			travelTypes: ['客户拜访', '项目支持', '培训学习', '会议会展', '验收交付', '其他'],
+			travelType: '',
+			startTime: '',
+			endTime: '',
+			destination: '',
+			estimatedCost: '',
+			reason: '',
+			remark: '',
+			accessoryApplyIds: '',
+			uploadedFiles: [],
+			submitting: false,
+			employees: [],
+			employeeLoading: true,
+			employeeSheetVisible: false,
+			employeeMode: 'assignee',
+			assignee: null,
+			ccUsers: [],
+			dateTimeSheetVisible: false,
+			dateFieldKey: '',
+			dateValue: '',
+			citySheetVisible: false,
+			cachedAssigneeKey: '',
+			currentEmpId: null
 		}
 	},
-	methods: { submitTravel(payload) { return addTravelReq(payload) } }
+	computed: {
+		assigneeLabel() {
+			return this.assignee ? this.employeeName(this.assignee) : ''
+		},
+		ccLabel() {
+			return this.ccUsers.length ? '已选择 ' + this.ccUsers.length + ' 人' : '点击选择抄送人'
+		}
+	},
+	async created() {
+		this.cachedAssigneeKey = 'hrm_manual_assignee_' + 'travel'
+		await this.loadEmployees()
+		await this.loadCurrentEmpId()
+		this.restoreAssignee()
+	},
+	methods: {
+		employeeName(emp) {
+			return emp && (emp.empName || emp.nickName || emp.userName || emp.realName) || ('员工' + ((emp && (emp.userId || emp.id)) || ''))
+		},
+		employeeDept(emp) {
+			return (emp && emp.dept && emp.dept.deptName) || (emp && emp.deptName) || '未分配部门'
+		},
+		async loadEmployees() {
+			this.employeeLoading = true
+			try {
+				var res = await listUser({ pageNum: 1, pageSize: 500 })
+				this.employees = res.rows || res.data || []
+			} catch (e) {
+				this.employees = []
+			} finally {
+				this.employeeLoading = false
+			}
+		},
+		async loadCurrentEmpId() {
+			try {
+				var oaId = uni.getStorageSync('oaId')
+				if (!oaId) return
+				var emp = await getEmployeeByUserId(oaId)
+				if (emp && emp.data && emp.data.empId) {
+					this.currentEmpId = emp.data.empId
+				}
+			} catch (e) {}
+		},
+		restoreAssignee() {
+			try {
+				var raw = uni.getStorageSync(this.cachedAssigneeKey)
+				if (!raw) return
+				var cached = typeof raw === 'string' ? JSON.parse(raw) : raw
+				var id = String(cached.userId || cached.empId || '')
+				var hit = this.employees.find(function (e) { return String(e.userId || e.id) === id })
+				if (hit) this.assignee = hit
+			} catch (e) {}
+		},
+		openEmployeePicker(mode) {
+			if (this.employeeLoading) {
+				uni.showToast({ title: '人员加载中，请稍候', icon: 'none' })
+				return
+			}
+			this.employeeMode = mode
+			this.employeeSheetVisible = true
+		},
+		onEmployeeChange(val) {
+			if (this.employeeMode === 'assignee') {
+				this.assignee = val
+				try {
+					uni.setStorageSync(this.cachedAssigneeKey, JSON.stringify({
+						userId: val && (val.userId || val.id),
+						empId: val && val.empId || '',
+						empName: this.employeeName(val),
+						deptName: this.employeeDept(val)
+					}))
+				} catch (e) {}
+			} else {
+				this.ccUsers = val || []
+			}
+		},
+		onTravelTypeChange(e) {
+			var idx = Number(e.detail.value)
+			this.travelType = this.travelTypes[idx] || ''
+		},
+		openDateTime(fieldKey) {
+			this.dateFieldKey = fieldKey
+			this.dateValue = this[fieldKey] || ''
+			this.dateTimeSheetVisible = true
+		},
+		onDateChange(val) {
+			if (!this.dateFieldKey) return
+			this[this.dateFieldKey] = val
+		},
+		formatDateTime(v) {
+			if (!v) return ''
+			return String(v).replace('T', ' ').substring(0, 16)
+		},
+		openCityPicker() {
+			this.citySheetVisible = true
+		},
+		onCityChange(val) {
+			this.destination = val || ''
+		},
+		onEstimatedCostInput(e) {
+			this.estimatedCost = e.detail.value
+		},
+		openFilePicker() {
+			var picker = this.$refs.globalFilePicker
+			if (picker && picker.open) picker.open()
+		},
+		async onGlobalFileSelect(payload) {
+			var files = Array.isArray(payload) ? payload : [payload]
+			for (var i = 0; i < files.length; i++) {
+				var f = files[i]
+				if (!f) continue
+				try {
+					var uploaded = await uploadFile({ path: f.path || f.url || '', name: f.name || f.fileName || 'file', size: f.size || 0, type: f.type || '' })
+					this.uploadedFiles.push({
+						name: uploaded.fileName || f.name || f.fileName || 'file',
+						fileName: uploaded.fileName || f.fileName || f.name || '',
+						originalName: f.name || f.fileName || uploaded.fileName || '',
+						url: uploaded.url || f.path || f.url || '',
+						ossId: uploaded.ossId || uploaded.url || f.path || f.url || ''
+					})
+				} catch (e) {
+					uni.showToast({ title: e.message || '上传失败', icon: 'none' })
+				}
+			}
+			this.syncFileIds()
+		},
+		removeFile(idx) {
+			this.uploadedFiles.splice(idx, 1)
+			this.syncFileIds()
+		},
+		syncFileIds() {
+			this.accessoryApplyIds = this.uploadedFiles.map(function (f) { return f.ossId }).join(',')
+		},
+		validate() {
+			if (!this.assignee) return uni.showToast({ title: '请选择审批人', icon: 'none' }), false
+			if (!this.travelType) return uni.showToast({ title: '请选择出差类型', icon: 'none' }), false
+			if (!this.startTime) return uni.showToast({ title: '请选择开始时间', icon: 'none' }), false
+			if (!this.endTime) return uni.showToast({ title: '请选择结束时间', icon: 'none' }), false
+			if (!this.destination) return uni.showToast({ title: '请选择目的地', icon: 'none' }), false
+			if (!this.reason) return uni.showToast({ title: '请填写事由', icon: 'none' }), false
+			return true
+		},
+		async submit() {
+			if (!this.validate()) return
+			this.submitting = true
+			try {
+				await addTravelReq({
+					empId: this.currentEmpId,
+					travelType: this.travelType,
+					startTime: this.startTime,
+					endTime: this.endTime,
+					destination: this.destination,
+					estimatedCost: this.estimatedCost,
+					reason: this.reason,
+					accessoryApplyIds: this.accessoryApplyIds,
+					remark: this.remark,
+					status: 'pending',
+					bizType: 'travel',
+					manualAssigneeUserId: this.assignee && (this.assignee.userId || this.assignee.id),
+					ccUserIds: this.ccUsers.map(function (u) { return u.userId || u.id }).join(',')
+				})
+				uni.showToast({ title: '提交成功', icon: 'success' })
+				setTimeout(() => uni.navigateBack({ delta: 1 }), 500)
+			} catch (e) {
+				uni.showToast({ title: e.message || '提交失败', icon: 'none' })
+			} finally {
+				this.submitting = false
+			}
+		}
+	}
 }
 </script>

-<style scoped></style>
+<style scoped>
+.page{min-height:100vh;background:#f5f7fb;padding:24rpx;box-sizing:border-box}.card{background:#fff;border-radius:20rpx;padding:24rpx;margin-bottom:20rpx}.card-title{font-size:30rpx;font-weight:700;color:#111827;margin-bottom:16rpx}.field{margin-bottom:18rpx}.label{display:block;margin-bottom:8rpx;font-size:24rpx;color:#6b7280}.req{color:#ef4444;margin-left:4rpx}.input-like,.input,.textarea{width:100%;box-sizing:border-box;border:1rpx solid #e5e7eb;border-radius:16rpx;background:#f9fafb;padding:20rpx;font-size:28rpx;color:#111827}.input{min-height:88rpx}.clickable{color:#111827}.textarea{min-height:160rpx}.file-list{margin-top:16rpx;display:flex;flex-direction:column;gap:12rpx}.file-item{display:flex;align-items:center;justify-content:space-between;padding:18rpx 18rpx;border-radius:16rpx;background:#f8fafc;border:1rpx solid #e5eefc}.file-name{flex:1;font-size:26rpx;color:#334155;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-right:16rpx}.remove{font-size:24rpx;color:#ef4444;flex-shrink:0}.btn.primary{width:100%;background:#1677ff;color:#fff;border-radius:16rpx}
+</style>