访客模块待完成

src/components/Holder/index.vue

@@ -4,10 +4,8 @@
       <span>请选择</span>
       <el-icon><Search /></el-icon>
     </div>
-    <div v-else>
+    <div v-else class="overflow-auto overflow-hidden w-full text-ellipsis text-nowrap">
       <span>姓名：{{ multipleSelection[0] && multipleSelection[0].name }}</span>
-      <span class="ml-4 mr-4">电话：{{ multipleSelection[0] && multipleSelection[0].phone }}</span>
-      <span>住址：{{ multipleSelection[0] && multipleSelection[0].housePath }}</span>
     </div>
   </div>
 
@@ -87,14 +85,16 @@ interface tableType extends ResidentVO {
   housePath?: string;
 }
 const props = defineProps<{
-  isedit: boolean;
+  userid: string;
 }>();
+// 2. 转成 ref（更安全，可选，但推荐）
+const { userid } = toRefs(props);
 const emit = defineEmits<{
-  change: [value: tableType];
+  change: [value: string | number];
 }>();
 const dialog = ref({
   dialogVisible: false,
-  dialogTitle: '添加'
+  dialogTitle: '选择住户'
 });
 
 const queryParams = ref({
@@ -130,15 +130,26 @@ function gettreedata() {
   });
 }
 gettreedata();
+getlist();
+
+watch(
+  userid,
+  (newval) => {
+    if (newval !== null && newval !== undefined && newval.length > 0) {
+      const find = tableData.value.find((item) => item.id == newval);
+      if (find) {
+        multipleSelection.value = [find];
+      }
+    }
+  },
+  {
+    deep: true,
+    immediate: true
+  }
+);
 
 //
 function choiceResidentFun() {
-  if (props.isedit) {
-    dialog.value.dialogTitle = '编辑车位';
-  } else {
-    dialog.value.dialogTitle = '添加车位';
-  }
-  getlist();
   dialog.value.dialogVisible = true;
 }
 // 获取表格
@@ -181,7 +192,7 @@ function confim() {
   if (multipleSelection.value.length > 0) {
     const pop = multipleSelection.value.pop();
     multipleSelection.value = [pop];
-    emit('change', pop);
+    emit('change', pop.id);
   }
 }
 
@@ -203,12 +214,12 @@ function handleSelectionChange(val) {
 
 <style scoped lang="scss">
 .residentBox {
-  width: 500px;
+  width: 385px;
   height: 35px;
   line-height: 35px;
   border: 1px solid #ccc;
   border-radius: 5px;
-  padding: 0 20px;
+  padding: 0 10px;
   .defaultbox {
     display: flex;
     align-items: center;