feat: 快速预定交互调整

src/pages-booking/components/UserSection/index.vue

@@ -5,20 +5,21 @@
         >入住信息</view
       >
       <view class="right">
-        <Stepper v-model="quantity" unit="间" />
+        <Stepper v-model="count" unit="间" />
       </view>
     </view>
 
     <view class="border-box pl-12 pr-12">
       <view
         class="border-box border-bottom pt-12 pb-12 flex flex-items-center"
-        v-for="item in quantity"
+        v-for="item in count"
         :key="item"
       >
         <view class="font-size-14 font-500 color-525866 mr-12"> 住客姓名 </view>
         <view class="right">
           <input
             class="border-box rounded-8 px-4 py-2 font-size-15 color-000 line-height-20"
+            v-model="userFormList.visitorName"
             placeholder="请输入姓名"
             maxlength="11"
           />
@@ -30,6 +31,7 @@
         <view class="right">
           <input
             class="border-box rounded-8 px-4 py-2 font-size-15 color-000 line-height-20"
+            v-model="userFormList[0].contactPhone"
             placeholder="请输入联系手机"
             maxlength="11"
           />
@@ -40,10 +42,30 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { computed, defineProps, defineEmits } from "vue";
 import Stepper from "@/components/Stepper/index.vue";
 
-const quantity = ref(1);
+const props = defineProps({
+  modelValue: {
+    type: Number,
+    default: 1,
+  },
+  userFormList: {
+    type: Object,
+    default: () => ({
+      visitorName: "",
+      contactPhone: "",
+    }),
+  },
+});
+
+const emit = defineEmits(["update:modelValue"]);
+const count = computed({
+  get: () => props.modelValue,
+  set: (val) => {
+    emit("update:modelValue", val);
+  },
+});
 </script>
 
 <style></style>