<template>
	<view class="page" :style="{'height':(h-th)+'px','padding-top':mt+'px'}">
		<c-nav-bar title="新增订单" :showIcon="false"></c-nav-bar>
		<view class="box">
			<view class="tit">预订信息</view>

			<u-cell-group :border="false"
				customStyle="background-color: #fff;border-radius: 16rpx;width: 94%;margin:0 auto;">
				<u-cell>
					<text slot="icon" style="font-size: 30rpx">姓名</text>
					<view slot="title" class="title">
						<u--input border="none" class="input" inputAlign="right" placeholderStyle="font-size:26rpx"
							placeholder="请输入姓名" v-model="dataForm.guestName"></u--input>
					</view>
				</u-cell>
				<u-cell>
					<text slot="icon" style="font-size: 30rpx">手机号码</text>
					<view slot="title" class="title">
						<u--input border="none" class="input" inputAlign="right" placeholderStyle="font-size:26rpx"
							placeholder="请输入手机号码" v-model="dataForm.guestPhone"></u--input>
					</view>
				</u-cell>
				<u-cell isLink="true" @click="showLaiyuan=true">
					<text slot="icon" style="font-size: 30rpx">订单来源</text>
					<view slot="title" class="title">
						{{dataForm.guestSourceName}}
					</view>
				</u-cell>
			</u-cell-group>
		</view>
		<u-picker :itemHeight="88" :immediateChange="true" :show="showLaiyuan" :columns="laiyuan" title="来源选择"
			keyName="guestSource" :defaultIndex="passengerDefault" @cancel="areaShow=false;"
			@confirm="passengerConfirm"></u-picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				showLaiyuan: false,
				passengerDefault: [0],
				dataForm: {
					arriveDate: "",
					detailFormList: [{
						breakfastAmount: 0,
						checkInPersonList: [],
						checkInType: 0,
						id: 0,
						otherAmount: 0,
						roomAmount: 0,
						roomIds: "",
						roomNumber: "",
					}, ],
					guestName: "",
					guestPhone: "",
					guestSourceId: null,
					guestSourceName: null,
					homestayId: '1711268640588517378',
					houseBaseId: 0,
					leaveDate: "",
					num: 0,
					orderStatus: null,
					remarks: "",
				},
				roomId: '',
				laiyuan: [[]]
			}
		},
		onLoad(opt) {
			this.roomId = opt.roomId.split(',');
			this.getInfo();
			this.getLaiyuan();
		},
		methods: {
			getLaiyuan() {
				this.$api.get("/merchant/hotel/room/state/getSourceDownBox", {
						homestayId: '1711268640588517378',
					})
					.then((res) => {
						if (res.data.code == 0) {
							this.laiyuan = [res.data.data];
						}
					});
			},
			getInfo() {
				this.$api.post('/merchant/hotel/order/getRoomInfoList', this.roomId).then(res => {
					console.log(res)
				})
			}
		}
	}
</script>

<style lang="scss">
	.page {
		background: #F3F4F4;
		padding-bottom: 260rpx;
		box-sizing: border-box;
		overflow-y: auto;
		overflow-x: auto;
	}
	.box{
		background-color: #fff;
		margin: 0 auto 20rpx;
		border-radius: 10rpx;
		width: 96%;
		padding: 0 30rpx;
	}
	.tit {
		font-size: 32rpx;
		font-weight: bold;
		color: #333;
	}
</style>