import Taro from '@tarojs/taro'
import see from '@/assets/icons/landlord/查看入住人.png'
import share from '@/assets/icons/landlord/分享链接.png'
import del from '@/assets/icons/landlord/删除.png'
import addImg from '@/assets/icons/landlord/添加.png'
import iconsearch from '@/assets/icons/housemantj/search.png'
import './houseManage.less'
import {useState, useEffect,useRef } from 'react'
import {useDidShow } from '@tarojs/taro'
import {getRoomList} from '@/services/landlord'


export default (props) => {
  const {hotel}=props
  const [detail, setDetail] = useState([])
  // 判断是否首次加载
  const mounted = useRef(false)

  const handelClick=()=>{
    Taro.navigateTo({ url: `/hotel/pages/landlord/addRoom/addRoom?hotelId=${hotel.hotelId}&hotelName=${hotel.hotelName}` });
  }
  useEffect(()=>{
    //首次加载页面时
    if (!mounted.current && hotel.hotelId) {
      getRoomList({hotelId:hotel.hotelId}).then((res)=>{
        setDetail(res.records||[])
        mounted.current = true
      })
    }
  },[hotel?.hotelId])

  //当前页面切换到前台时
  useDidShow(() => {
    if (mounted.current) {
      getRoomList({hotelId:hotel.hotelId}).then((res)=>{
        setDetail(res.records||[])
      })
    }
  })

  return (
    <view>
      <view style={{ padding: '0 30rpx', height: '100%' }}>
          <view className='search'>
            <input className='searchInput' disabled />
            <image className='searchicon' src={iconsearch} />
            <view className="searchword">请输入关键字搜索</view>
          </view>
        <scroll-view scroll-y="true" scroll-view='true' bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll" style={{ height: 'calc(100vh - 255px)' }}>

          <view>
            {
              detail?.map((item)=>
              <view className='houseCard'>
              <view className='houseName'>{item.roomName}</view>
              <view className='operation'>
                <view><image src={see} /><text>查看入住人</text></view>
                <view><image src={share} /><text>分享链接</text></view>
                <view><image src={del} /><text>删除房源</text></view>
              </view>
            </view>
              )
            }
            
           
          </view>
        </scroll-view>        
      </view>
      <view className='addHouse' onClick={handelClick}>
        <image className='addImg' src={addImg} />添加房源
      </view>
    
      </view>
  )
}