miniapp-v2/src/hotel/components/shareRoom/ShareRoom.jsx

import React from 'react'
import Popup from '@/components/Popup'
import Taro from '@tarojs/taro'
import { Input, Button, View, Picker, Label } from '@tarojs/components'
import { shareRoom } from '@/services/landlord'
import './ShareRoom.less'
import { useState } from 'react'


export default (props) => {
  const { showCutover, onClose, room, onFinish } = props
  const [startDate, setStartDate] = useState('')
  const [endDate, setEndDate] = useState('')
  const [roomNum, setRoomNum] = useState('')
  const handelStartDate = (e) => {
    setStartDate(e.detail.value)
  }
  const handelEndDate = (e) => {
    setEndDate(e.detail.value)
  }
  const handelShare = () => {
    if (roomNum != '' && startDate != '' && endDate != '') {
      shareRoom({ hotelId: room.hotelId, personNum: roomNum, roomId: room.roomId, startDate: startDate, endDate: endDate }).then((res) => {
        onFinish(res)
        setStartDate('')
        setEndDate('')
        setRoomNum()
      })
    }
  }
  return (
    <Popup show={showCutover} onClose={onClose}>
      <View className='from-room'>
        <Label style={{ color: 'black' }}>请输入入住人信息</Label>
        <View className='flex'>
          <Label>入住人数：</Label><Input focus dataField='nm' onInput={(e) => setRoomNum(e.detail.value)} value={roomNum} type='number' placeholder='请输入入住人数' /></View>
        <View className='flex'>
          <Label>入住开始时间：</Label>
          <Picker mode='date' className='picker' onChange={handelStartDate}>
            {startDate == '' ? '请选择入住开始时间' : startDate}
          </Picker>
        </View>
        <View className='flex'>
          <Label>入住结束时间：</Label>
          <Picker className='picker' mode='date' onChange={handelEndDate}>
            {endDate == '' ? '请选择入住结束时间' : endDate}
          </Picker>
        </View>
        <View><Button className='cancel' onClick={onClose}>取消</Button><Button className='btn' onClick={handelShare}>分享</Button></View>
      </View>
    </Popup>
  )
}