59 lines
1.8 KiB
Vue
59 lines
1.8 KiB
Vue
<template>
|
|
<view class="bg-white rounded-12 overflow-hidden mb-12">
|
|
<view class="flex flex-items-center border-box p-12 border-bottom">
|
|
<view class="font-size-16 font-500 color-000 line-height-24 flex-full">入住信息</view>
|
|
<view class="right">
|
|
<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, index) in userFormList"
|
|
:key="index">
|
|
<view class="font-size-14 font-500 color-525866 mr-12"> 住客姓名 </view>
|
|
<view class="right">
|
|
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20" v-model.trim="item.visitorName"
|
|
placeholder="请输入姓名" maxlength="11" />
|
|
</view>
|
|
</view>
|
|
|
|
<view class="flex flex-items-center border-box pt-12 pb-12">
|
|
<view class="font-size-14 font-500 color-525866 mr-12"> 联系手机 </view>
|
|
<view class="right">
|
|
<input class="border-box px-4 py-2 font-size-15 color-000 line-height-20"
|
|
v-model.trim="userFormList[0].contactPhone" placeholder="请输入联系手机" maxlength="11" />
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { computed, defineProps, defineEmits } from "vue";
|
|
import Stepper from "@/components/Stepper/index.vue";
|
|
|
|
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>
|