检修人员选择

ygtx-ui/src/components/gxtOrder/finalize.vue

@@ -154,16 +154,19 @@
             <el-input v-model="formData.teamLeaderName" disabled />
           </el-form-item>
         </el-col>
-      </el-row>
-      <el-row>
-        <el-col :span="24">
+<!--      </el-row>-->
+<!--      <el-row>-->
+        <el-col :span="12">
           <el-form-item label="检修人员" prop="workGroupMemberName">
             <el-input
-              v-model="formData.workGroupMemberName"
-              maxlength="200"
-              show-word-limit
-              :readonly="formData.infoEntry == '1'"
-            />
+                v-model="formData.workGroupMemberName"
+                placeholder="请选择检修人员"
+                :readonly="formData.infoEntry == '1'"
+            >
+              <template #append v-if="formData.infoEntry == '2'">
+                <el-button @click="userSelectVisible = true" icon="User"></el-button>
+              </template>
+            </el-input>
           </el-form-item>
         </el-col>
       </el-row>
@@ -182,11 +185,18 @@
       </div>
     </template>
   </el-dialog>
+
+  <!-- 人员选择组件 -->
+  <UserSelectMulti
+      v-model="userSelectVisible"
+      @onSelected="onUserSelected"
+  />
 </template>
 
 <script setup>
 import { ref, defineProps, defineEmits, getCurrentInstance, watch } from 'vue'
 import preview from '@/components/FileUpload/preview.vue'
+import UserSelectMulti from "@/components/userSelect/multi.vue";
 
 // 获取当前实例
 const { proxy } = getCurrentInstance()
@@ -222,6 +232,7 @@ const visible = ref(false)
 const formData = ref({})
 const finishRef = ref()
 const submitLoading = ref(false)
+const userSelectVisible = ref(false) // 添加人员选择组件可见性
 
 // 表单验证规则
 const finishRules = ref({
@@ -391,6 +402,27 @@ const handleCancel = () => {
   visible.value = false
 }
 
+// 用户选择回调函数
+const onUserSelected = (users) => {
+  if (users && users.length > 0) {
+    // 构建用户姓名列表
+    const userNames = users.map(user => user.nickName).join(',');
+    formData.value.workGroupMemberName = userNames;
+
+    // 构建用户对象列表用于保存到数据库
+    formData.value.repairOrderPersonList = users.map(user => ({
+      userId: user.userId,
+      nickName: user.nickName,
+      orderId: formData.value.id,
+      orderCode: formData.value.workOrderProjectNo,
+      status: 1
+    }));
+  } else {
+    formData.value.workGroupMemberName = '';
+    formData.value.repairOrderPersonList = [];
+  }
+};
+
 // 提交操作
 const handleSubmit = async () => {
   if (!finishRef.value) return

ygtx-ui/src/components/repairOrder/finalize.vue

@@ -168,11 +168,13 @@
           <el-form-item label="检修人员" prop="workGroupMemberName">
             <el-input
                 v-model="formData.workGroupMemberName"
-                placeholder="请输入检修人员"
-                maxlength="200"
-                show-word-limit
-                :readonly="formData.infoEntry == 1"
-            />
+                placeholder="请选择检修人员"
+                :readonly="formData.infoEntry == '1'"
+            >
+              <template #append v-if="formData.infoEntry == '2'">
+                <el-button @click="userSelectVisible = true" icon="User"></el-button>
+              </template>
+            </el-input>
           </el-form-item>
         </el-col>
         <el-col :span="12">
@@ -227,11 +229,18 @@
       </div>
     </template>
   </el-dialog>
+
+  <!-- 人员选择组件 -->
+  <UserSelectMulti
+    v-model="userSelectVisible"
+    @onSelected="onUserSelected"
+  />
 </template>
 
 <script setup>
 import { ref, defineProps, defineEmits, getCurrentInstance, computed, watch } from 'vue'
 import preview from '@/components/FileUpload/preview.vue'
+import UserSelectMulti from '@/components/userSelect/multi.vue'
 
 // 获取当前实例
 const { proxy } = getCurrentInstance()
@@ -290,6 +299,7 @@ const finalizeFormRef = ref()
 const showMisNoQuickSelect = ref(false)
 const quickMisNoList = ref([])
 const misNoSearchTimer = ref(null)
+const userSelectVisible = ref(false) // 添加人员选择组件可见性
 
 // 计算属性
 const workPermitNumProxy = computed({
@@ -607,6 +617,27 @@ const searchMisNoList = async (keyword) => {
   }
 }
 
+// 用户选择回调函数
+const onUserSelected = (users) => {
+  if (users && users.length > 0) {
+    // 构建用户姓名列表
+    const userNames = users.map(user => user.nickName).join(',');
+    formData.value.workGroupMemberName = userNames;
+
+    // 构建用户对象列表用于保存到数据库
+    formData.value.repairOrderPersonList = users.map(user => ({
+      userId: user.userId,
+      nickName: user.nickName,
+      orderId: formData.value.id,
+      orderCode: formData.value.workOrderProjectNo,
+      status: 1
+    }));
+  } else {
+    formData.value.workGroupMemberName = '';
+    formData.value.repairOrderPersonList = [];
+  }
+};
+
 // 提交操作
 const handleSubmit = async () => {
   if (!finalizeFormRef.value) return