import React, { useEffect, useMemo, useState } from 'react'
import Taro,{useRouter} from '@tarojs/taro'
import { useSelector, useDispatch } from 'react-redux'
import { View, ScrollView } from '@tarojs/components'
import Tab from '../../compents/tab/index'
import Customer from '../customer/index'
import Landlord from '../landlord/index'
import roleList from '../../util/userRole'
import './index.scss'
import request from '../../util/request'
import GetPhone from '@/compents/getPhone'
const index = (props) => {


  const router = useRouter()

  const { houseId ,orderId} = router.params
  const user = useSelector(state => state.user)

  const dispatch = useDispatch()

  const [userRole, setUserRole] = useState('1')
  const [pageState, SetPageState] = useState('1')
  const [list, setList] = useState([])
  const [visible, setVisible] = useState(false)

  useEffect(() => {
    console.log(user,houseId, 'indexuser')
    if (user.personId && !user.phone) {
      setVisible(true)
    }
    if (user.personId && user.phone) {
      setVisible(false)
    }
  }, [user.phone])


  const onOk = (res) => {

    dispatch({ type: 'LOGIN', user: res.data.data })
    setVisible(false)
  }

  const onCancel = (e) => {
    setVisible(false)
  }
  console.log(user.role == roleList.landlord, 'indexuser')

  return <View className='index'>

    {user.personId && <View>
      {visible && <GetPhone visible={true} onOk={onOk} onCancel={onCancel} ></GetPhone>}
      {!visible && user.role == roleList.customer && <Customer houseId={houseId} orderId={orderId}></Customer>}
      {!visible && user.role == roleList.landlord && <Landlord ></Landlord>}
    </View>}





    {/* {userRole == 1 ? <Register userRole={userRole} list={list} onChange={(e) => onRegisterChange(e)}></Register> :
          <View>userRole={userRole} list={list} onChange={(e) => onRegisterChange(e)}
            {(userRole == 'guide' || userRole == 2) && <Guide userRole={userRole}/>}
            {userRole == 'recommend' && <Recommend userRole={userRole}/>}
          </View>
        }
        {userRole == 2 ? <Register userRole={userRole} list={list} onChange={(e) => onRegisterChange(e)}></Register> :
          <View>
            {(userRole == 'guide' || userRole == 2) && <Guide userRole={userRole}/>}
            {userRole == 'recommend' && <Recommend userRole={userRole}/>}
          </View>
        }
     <HouseLIst userRole={userRole} list={list} onChange={(e) => onRegisterChange(e)}></HouseLIst>  */}



    {/* </View>
    </ScrollView>
    <Tab value={userRole} onClick={(e) => onTabClick(e)}></Tab> */}
  </View>
}

export default index