From 7880cb10514d9957f1f123069668453e231eff7e Mon Sep 17 00:00:00 2001
From: liangbin <15536829364@163.com>
Date: Fri, 16 Jan 2026 16:12:39 +0800
Subject: [PATCH] =?UTF-8?q?feat(WorkOrderEdit):=20=E5=AE=9E=E7=8E=B0?=
=?UTF-8?q?=E5=B7=A5=E5=8D=95=E7=BC=96=E8=BE=91=E5=A4=9A=E6=AD=A5=E9=AA=A4?=
=?UTF-8?q?=E8=A1=A8=E5=8D=95=E5=8A=9F=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
添加工单编辑的多步骤表单功能，包括基础信息和出入证申请两个步骤：
1. 在基础信息步骤中添加作业负责人和作业班成员选择功能
2. 创建新的出入证申请组件，处理车辆信息和有效日期选择
3. 实现步骤间数据共享和导航功能
---
.../WorkOrderEdit/compoents/BasicsInfo.vue | 152 +++++++++-
.../WorkOrderEdit/compoents/GatePassInfo.vue | 269 ++++++++++++++++++
src/pages/WorkOrderEdit/index.vue | 21 +-
3 files changed, 430 insertions(+), 12 deletions(-)
create mode 100644 src/pages/WorkOrderEdit/compoents/GatePassInfo.vue
diff --git a/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue b/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
index 9433b79..bf78b37 100644
--- a/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
+++ b/src/pages/WorkOrderEdit/compoents/BasicsInfo.vue
@@ -22,7 +22,8 @@
- 选择日期
+ 选择日期
- 选择日期
+ 选择日期
+
+ 作业负责人
+
+
+
+
+
+
+ 作业班成员
+ 添加
+
+
+
+
+ {{ member.name }}
+
+
+
+
+
@@ -71,12 +95,31 @@ const endDateMinTimestamp = computed(() => {
return minTimestamp.value;
});
+const showMemberPicker = ref(false); // 是否显示成员选择器
+//成员列表信息
+const MemberArr = ref([
+ {
+ id: "123456", // 成员ID
+ name: "张三", // 成员姓名
+ phone: "13800000000", // 成员手机号
+ },
+ {
+ id: "654321", // 成员ID
+ name: "李四", // 成员姓名
+ phone: "13900000000", // 成员手机号
+ }
+]); // 作业班成员列表
+
+
+
// 表单信息
const formData = ref({
ProjectName: "", // 项目名称
Location: "", // 作业地点（经纬度）
SpecificAddress: "", // 具体楼层或区域
period: [], // 作业周期 [开始日期, 结束日期]
+ ResponsiblePerson: "", // 作业负责人
+ MemberList: [], // 作业班成员列表
});
// 暴露方法给父组件调用
@@ -84,18 +127,20 @@ defineExpose({
getFormData: () => formData.value,
});
-// 初始化地图
+// 生命周期钩子函数
onMounted(() => {
initTiandituMap();
});
+
+
// 处理开始日期确认事件
const HandleStartDateConfirm = (e) => {
console.log('选中的开始日期：', e);
-
+
// 如果没有选择日期，使用默认值
const selectedDate = (e.value && dayjs(e.value).isValid()) ? e.value : minTimestamp.value;
-
+
startDateText.value = dayjs(selectedDate).format('YYYY-MM-DD');
startDate.value = selectedDate;
endDateText.value = '';
@@ -107,10 +152,10 @@ const HandleStartDateConfirm = (e) => {
// 处理结束日期确认事件
const HandleEndDateConfirm = (e) => {
console.log('选中的结束日期：', e);
-
+
// 如果没有选择日期，使用默认值
const selectedDate = (e.value && dayjs(e.value).isValid()) ? e.value : minTimestamp.value;
-
+
// 检查是否选择了开始日期
if (startDate.value && dayjs(selectedDate).isBefore(dayjs(startDate.value))) {
uni.showToast({
@@ -120,7 +165,7 @@ const HandleEndDateConfirm = (e) => {
});
return;
}
-
+
endDateText.value = dayjs(selectedDate).format('YYYY-MM-DD');
endDate.value = selectedDate;
showEndDatePicker.value = false;
@@ -141,6 +186,66 @@ const UpdatePeriod = () => {
console.log('作业周期：', formData.value.period);
};
+// 处理成员选择确认事件
+const HandleMemberConfirm = (e) => {
+ console.log('选中的成员完整信息：', e);
+ console.log('e.value:', e.value);
+ console.log('e.value[0]:', e.value ? e.value[0] : 'undefined');
+ console.log('MemberArr:', MemberArr.value);
+
+ if (e.value && e.value.length > 0) {
+ const selectedMember = e.value[0];
+ console.log('选中的成员：', selectedMember);
+ console.log('selectedMember 的类型:', typeof selectedMember);
+
+ let memberInfo;
+
+ // 判断返回的是对象还是字符串
+ if (typeof selectedMember === 'object' && selectedMember !== null) {
+ // 如果是对象，直接使用
+ memberInfo = selectedMember;
+ console.log('返回的是对象，直接使用：', memberInfo);
+ } else {
+ // 如果是字符串，从 MemberArr 中根据id查找
+ memberInfo = MemberArr.value.find(item => item.id === selectedMember);
+ console.log('返回的是字符串，从 MemberArr 根据id查找：', memberInfo);
+ }
+
+ if (memberInfo && memberInfo.id) {
+ // 根据id检查成员是否已存在
+ const isExist = formData.value.MemberList.some(item => item.id === memberInfo.id);
+ console.log('成员是否已存在：', isExist);
+ console.log('当前成员列表：', formData.value.MemberList);
+
+ if (!isExist) {
+ formData.value.MemberList.push({
+ id: memberInfo.id,
+ name: memberInfo.name
+ });
+ console.log('添加成员成功：', memberInfo);
+ console.log('添加后的成员列表：', formData.value.MemberList);
+ } else {
+ uni.showToast({
+ title: '该成员已存在',
+ icon: 'none',
+ duration: 2000
+ });
+ }
+ } else {
+ console.log('未找到成员信息或成员信息无效');
+ }
+ } else {
+ console.log('e.value 为空或长度为0');
+ }
+ showMemberPicker.value = false;
+};
+
+// 删除成员
+const RemoveMember = (index) => {
+ formData.value.MemberList.splice(index, 1);
+ console.log('删除成员成功');
+};
+
// 初始化天地图
const initTiandituMap = () => {
try {
@@ -195,6 +300,21 @@ const initTiandituMap = () => {
diff --git a/src/pages/WorkOrderEdit/index.vue b/src/pages/WorkOrderEdit/index.vue
index 6c39978..fd0acac 100644
--- a/src/pages/WorkOrderEdit/index.vue
+++ b/src/pages/WorkOrderEdit/index.vue
@@ -4,18 +4,19 @@
-
+
- 工单编辑
+ {{stepList[currentStep - 1].Title}}
-
+
+