import { Component, PropsWithChildren, useEffect, useRef, useState } from 'react'
import { View, Text, Button, Input, Picker } from '@tarojs/components'
import './index/index.scss'
import './Clock.scss'
import Taro, { useDidShow, useReady, useRouter } from '@tarojs/taro'
// import ComponentA from './component'
import Rings from '@components/Rings';

import { useDispatch, useSelector } from 'react-redux';
import { getInfoSuccess, logoutSuccess } from '@/store/user';
import { wxPubFollow } from '@/services/permission';
import { gobalConfigs, staticResources, uploadSessionKey } from '@/services/common';
import { use } from 'i18next';
import Clocks from '@/features/trackTimeDuration/components/Clock';
import Console from '@/features/trackTimeDuration/components/Console';
import More from '@/features/trackTimeDuration/components/More';
import Schedule from '@/features/trackTimeDuration/components/Schedule';
import TitleBar from '@/features/trackTimeDuration/components/TitleBar';
import { getChecks, getClocks } from '@/services/trackTimeDuration';
import { setScenario } from '@/store/scenario';

import { setSpecifiedStatus, setSpecifiedState, machine } from '@/store/trackTimeMachine';
import trackTimeService from '@/store/trackTimeMachine';
import { setWXFollow } from '@/store/permission';
import Tooltip from '@/components/Tooltip'
import RequestType, { thirdPartRequest } from '@/services/thirdPartRequest'
import { setConfigs } from '@/store/common'
// import TabBar from '../../components/Tabbar';

export default function IndexPage() {
  const dispatch = useDispatch();
  const array: any[] = []
  const [checkData, setCheckData] = useState(null)
  const user = useSelector((state: any) => state.user);
  const permission = useSelector((state: any) => state.permission);
  const common = useSelector((state: any) => state.common);
  const [counter, setCounter] = useState(0)
  const [timerId, setTimerId] = useState(null)
  const [needShowAddTip, setNeedShowAddTip] = useState(false)
  array.push(<Text>ffff</Text>)
  // array.push(<Rings radius={50}/>)
  global.dispatch = dispatch;
  useEffect(() => {
    dispatch(staticResources() as any);
    // dispatch(gobalConfigs() as any);
    trackTimeService.onTransition(state => {
      if ((state.value as any).FAST_SLEEP == 'COMPLETED' ||
        (state.value as any).FAST == 'ONGOING' ||
        (state.value as any).SLEEP == 'ONGOING' ||
        (state.value as any).FAST_SLEEP == 'ONGOING1' ||
        (state.value as any).FAST_SLEEP == 'ONGOING2' ||
        (state.value as any).FAST_SLEEP == 'ONGOING3' ||
        (state.value as any).FAST == 'COMPLETED' ||
        (state.value as any).SLEEP == 'COMPLETED') {
        getCheckData()
      }
    })


  }, [])

  useEffect(() => {
    if (user.isLogin) {
      //检查用户是否添加过小程序
      checkAddToMini();
      //检查session是否过期
      checkSession()
    }
  }, [user.isLogin])

  function checkSession() {
    // Taro.login().then(res => {
    //   // code = res.code;
    //   uploadSessionKey({ type: 'WX_MP', code: res.code });
    // })
    // return
    if (process.env.TARO_ENV === 'weapp') {
      console.log('session request')
      thirdPartRequest(RequestType.RequestTypeCheckSession).then(res => {
        console.log('session_key 未过期，并且在本生命周期一直有效')
      }).catch(err => {
        console.log('session_key 已经失效，需要更新登录code')
        thirdPartRequest(RequestType.RequestTypeWXLogin).then(result => {
          uploadSessionKey({ type: 'WX_MP', code: (result as any).code });
        })
      })
    }
  }

  function checkAddToMini() {
    process.env.TARO_ENV == 'weapp' &&
      wx.checkIsAddedToMyMiniProgram({
        success: (res) => {
          if (!res.added) {
            setNeedShowAddTip(true)
          }
        },
        fail: (e) => {
          console.log(e)
        }
      });
  }

  useEffect(() => {
    startTimer();
    return () => {
      // 在组件卸载时清除定时器
      if (timerId) {
        clearInterval(timerId);
      }
    };
  }, [timerId]);

  const startTimer = () => {
    // 避免重复启动定时器
    if (timerId) {
      return;
    }

    const id = setInterval(() => {
      setCounter((prevCounter) => prevCounter + 1);
    }, 1000);

    setTimerId(id as any);
  };


  useReady(async () => {
    // console.log('wwwwwwww')
    const userData = await getStorage('userData');
    if (userData) {
      dispatch(getInfoSuccess(JSON.parse(userData as string)) as any);
      // return JSON.parse(userData as string) as UserState;
      setTimeout(() => {
        checkWXPubFollow()
        getCheckData()

      }, 200)

    }
  })

  function clearTempScenarioCache() {
    global.schedule_fast = null
    global.schedule_sleep = null
    Taro.removeStorage({
      key: 'tempScenario',
      success: function (res) {
      }
    })
  }

  useDidShow(() => {
    if (user.isLogin) {
      checkWXPubFollow()
      getCheckData();
    }
    clearTempScenarioCache()
  })

  function getCheckData() {
    getClocks().then(res => {
      dispatch(setConfigs((res as any).time_input_schema));
      dispatch(setScenario((res as any).scenario));
      machine.context.checkData = res as any;

      global.scenario = (res as any).current_record.scenario;
      // trackTimeService.send({ type: 'RESET' });
      // trackTimeService.send({ type: (res as any).current_record.scenario });
      const currentState = trackTimeService.getSnapshot();
      let json = {};
      var key = (res as any).current_record.scenario
      var status = (res as any).current_record.status
      json[key] = status
      currentState.value = json;
      // debugger
      machine.context.currentStatus = `${key}.${status}`;//'mixed.ON_GOING2'
      setCheckData(res as any)
    })
    return
    getChecks().then(res => {
      if ((res as any).scenario) {
        dispatch(setScenario((res as any).scenario));
        global.scenario = (res as any).scenario;
        // global.checkData = res;
        // console.log((res as any).scenario.name + ' ' + (res as any).status);
        // trackTimeService.send({type:(res as any).scenario.name});
        // setSpecifiedStatus('FAST_SLEEP', 'ON_GOING');

        // 初始化状态机
        // const initialState = machine.initialState;

        // 设置指定状态为 C->3
        // const nextState = machine.transition(initialState, 'SET_SPECIFIED_STATE');
        // const specifiedState = setSpecifiedState(nextState, 'FAST_SLEEP');
        // setSpecifiedState();
        // console.log('name:'+(res as any).scenario.name)
        // machine.reset();
        trackTimeService.send({ type: 'RESET' });

        trackTimeService.send({ type: (res as any).scenario.name });

        const currentState = trackTimeService.getSnapshot();
        let json = {};
        var key = (res as any).scenario.name
        json[key] = (res as any).status
        currentState.value = json;
        // debugger
        machine.context.currentStatus = `${key}.${(res as any).status}`;//'mixed.ON_GOING2'
        machine.context.checkData = res as any;
        // debugger
        // trackTimeService.send('APPLE');
        // machine.transition(`${key}.${(res as any).status}`,'' as any);

        // trackTimeService.send({type:'START_FAST'});
        // trackTimeService.send({type:'START_SLEEP'});
        // trackTimeService.send({type:'END_SLEEP'});
        // trackTimeService.send({type:'END_SLEEP'});
        // trackTimeService.send({type:'START_FAST'});
        // trackTimeService.send({type:'END_FAST'});
        // trackTimeService.send({type:'START_SLEEP'});

        // console.log(currentState.value);
        // debugger
        // trackTimeService.send('setCurrentStatus', {status:(res as any).status});
        // setCurrentStatus((res as any).status);
        // trackTimeService.send({type:'START_FAST'});
      }
    })
  }

  function checkWXPubFollow() {
    wxPubFollow().then(res => {
      dispatch(setWXFollow((res as any).wx_pub_followed));
    })
  }

  function followWxPub() {
    const resource = common.resources.filter((item: any) => {
      return item.code == 'follow_wx_pub'
    })

    Taro.showModal({
      title: '提示',
      content: '关注公众号后可接收提醒\n点击确定，前往关注',
      showCancel: true,
      success(result) {
        if (result.confirm) {
          Taro.navigateTo({
            url: '/pages/H5?title=fast16cc 关注服务号&url=' + resource[0].url,
          })
        }
      },
    })
  }


  async function getStorage(key: string) {
    try {
      const res = await Taro.getStorage({ key });
      return res.data;
    } catch {
      return '';
    }
  }

  function schedule() {
    if (!user.isLogin) {
      return <View />
    }

    // if ((checkData as any).current_record.scenario == 'FAST_SLEEP') {
    return <Schedule />
    // }
    // return <View />
  }

  return (
    <View style={{ flex: 1, flexDirection: 'column', display: 'flex', backgroundColor: '#000', color: '#fff' }}>
      {
        needShowAddTip && <Tooltip title="添加到我的小程序" closeTip={() => { setNeedShowAddTip(false) }} />
      }

      <TitleBar />
      <Clocks />
      <View className='console_box'>
        <Console />
      </View>

      <More ref={global.moreRef} />
      {
        !permission.wxPubFollow && user.isLogin && <Text style={{ textAlign: 'center', width: '100%' }} onClick={() => followWxPub()}>去关注公众号</Text>
      }
      {
        user.isLogin && <Text onClick={() => {
          Taro.navigateTo({
            url: '/pages/RecordsHistory?type=time'
          })
        }}>查看全部记录</Text>
      }
      {
        checkData && schedule()
      }


      {
        checkData && (checkData as any).latest_record && <Schedule type='latest' />
      }
      {/* <Picker mode="time" start="07:00" end="20:00">
        <Text style="color: #fff;">test picker</Text>
      </Picker> */}
      <View style={{ height: 100 }} />
      {/* <View className='popDemo' catchMove/> */}
    </View>
  )
}