import { useState} from 'react'
import Taro from '@tarojs/taro'
import Popup from '@/components/Popup'
import CustomNav from '@/components/CustomNav'
import './income.less'
import eyes from '../../../assets/icons/shopKeeper/小眼睛.png'
import ceyes from '../../../assets/icons/shopKeeper/小眼睛-闭上.png'
import sImg from '../../../assets/icons/landlord/我的收入2.png'
import cutoverUser from '@/assets/icons/UserCenter/cutoverUser.png'
import touristON from '@/assets/icons/UserCenter/touristON.png'
import touristOFF from '@/assets/icons/UserCenter/touristOFF.png'
import hotelBossON from '@/assets/icons/UserCenter/hotelBossON.png'
import hotelBossOFF from '@/assets/icons/UserCenter/hotelBossOFF.png'
import shopBossON from '@/assets/icons/UserCenter/shopBossON.png'
import shopBossOFF from '@/assets/icons/UserCenter/shopBossOFF.png'


export default (props) => {
  const [showCutover, setShowCutover] = useState(false)
  const ShowMoldeOn = () => {
    setShowCutover(true)
  }
  const ok = () => {
    setShowCutover(false)
  }
  const gotoShop = () => {
    Taro.redirectTo({ url: '/shop/pages/spread/spreadIndex' })
  }
  const gotoPerson = () => {
    Taro.redirectTo({ url: '/pages/index/index' })
  }
  return (
    <view>
      <view>
        <CustomNav title='十公里' />
      </view>
      <Popup show={showCutover} maskClosable={false}>
          <view className='User-box-sths' >
            <view className='User-box-selectUser'>请选择身份：</view>
            <view className='User-box-tourist' onClick={gotoPerson}>
              <image className='Ubs-tourist-image' src={touristOFF} />
              <text className='Ubs-tourist-text'>游客</text>
            </view>
            <view className='User-box-hotelBoss' onClick={ok}>
              <image className='Ubs-hotelBoss-image' src={hotelBossON} />
              <text className='Ubs-hotelBoss-text'>民宿老板</text>

            </view>
            <view className='User-box-shopBoss' onClick={gotoShop}>
              <image className='Ubs-shopBoss-image' src={shopBossOFF} />
              <text className='Ubs-shopBoss-text'>店铺老板</text>
            </view>
          </view>
        </Popup>     
      <view style={{ padding: '30rpx', height: '100%' }}>
        <scroll-view scroll-y="true" scroll-view='true' bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll" style={{ height: 'calc(100vh - 120px)' }}>
          <view className='storexx'>
              <view className='storeName'>店名：<text>Yun咖 云里 咖啡店</text></view>
              <view onClick={ShowMoldeOn}  className='User-info-cutover'>
                <image className='User-info-cutover-image' src={cutoverUser} />
              </view>
              <view className='money'>
                <view className='sleft'>
                  <view className='lword'>全年收入（税前）</view>
                  <view className='yearMoney'>
                    <text>2800000</text>元
                    <image className='micon' src={eyes}></image>
                  </view>
                </view>
                <view className='line' />
                <view className='sright'>
                  <view className='rword'>当月收入（税前）</view>
                  <view className='monthMoney'>
                    <text>******</text>元
                    <image className='micon2' src={ceyes}></image>
                  </view></view>
              </view>
            </view>
          <view className='title'>推广收入记录</view>
          <view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
            <view className='spreadCard'>
              <view className='spreadDate'>日期：<text>2021-06-24</text></view>
              <view className='card'>
                <view className='spreadTime'>时&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;间：<text>2021-06-24  20:45</text></view>
                <view className='spreadMoney'>收入金额：<text>5.00</text>元</view> 
                <image className='spreadImg' src={sImg} />
              </view>
            </view>
          </view>
          <view className='botton'>已经到底了~</view>
        </scroll-view>        
      </view>
      
      </view>
  )
}