import React from 'react'
import { View, Text, Image } from '@tarojs/components'
import Page from '@/layouts/index';
import { useModel } from '@/store';
import MenuIcon from '@/components/MenuIcon';
import { ROLE_CITIZEN, ROLE_INSPECTOR, ROLE_MANAGER, ROLE_ORG_USER, ROLE_QUERY_PERSON } from '@/utils/user';
import Head from './components/Head';
import Banner from './components/Banner';
import StatCard from './components/StatCard';
import './index.less';

const menus = {
  // 督察员
  [ROLE_INSPECTOR]: [
    { icon: 'icon9', text: '我的上报', link: '/pages/issue/list/index' },
    { icon: 'icon11', text: '消息通知', link: '/pages/message/list/index' },
    { icon: 'icon10', text: '模拟测评', link: '/pages/check/list/index' },
  ],

  // 平台管理员
  [ROLE_MANAGER]: [
    { icon: 'icon1', text: '待 交 办', link: '/pages/issue/list2/index?title=待交办&bizStatus=start' },
    { icon: 'icon2', text: '已 交 办', link: '/pages/issue/list2/index?title=已交办&bizStatus=assigned' },
    { icon: 'icon3', text: '已 办 结', link: '/pages/issue/list2/index?title=已办结&bizStatus=end' },
    { icon: 'icon4', text: '消单申请', link: '/pages/apply/list/index?title=消单申请&applyType=end' },
    { icon: 'icon5', text: '逾期警告', link: '/pages/issue/list2/index?title=逾期警告&bizStatus=expired' },
    { icon: 'icon6', text: '延期申请', link: '/pages/apply/list/index?title=延期申请&applyType=delay' },
    { icon: 'icon7', text: '统计查询', link: '' },
    { icon: 'icon9', text: '我的上报', link: '/pages/issue/list2/index?title=我的上报&mine=true' },
    { icon: 'icon11', text: '消息通知', link: '/pages/message/list/index' },
  ],

  // 责任单位用户
  [ROLE_ORG_USER]: [
    { icon: 'icon2', text: '处 理 中', link: '/pages/org/issue/list/index?title=处理中&bizStatus=assigned' },
    { icon: 'icon3', text: '已 办 结', link: '/pages/org/issue/list/index?title=已办结&bizStatus=end' },
    { icon: 'icon5', text: '已 逾 期', link: '' },
    { icon: 'icon7', text: '统计查询', link: '' },
    { icon: 'icon11', text: '消息通知', link: '/pages/message/list/index' },
  ],

  // 查询人员
  [ROLE_QUERY_PERSON]: [
    { icon: 'icon1', text: '未 处 理', link: '/pages/issue/list2/index?title=未处理&bizStatus=start' },
    { icon: 'icon2', text: '处 理 中', link: '/pages/issue/list2/index?title=处理中&bizStatus=assigned' },
    { icon: 'icon3', text: '已 办 结', link: '/pages/issue/list2/index?title=已办结&bizStatus=end' },
    { icon: 'icon7', text: '统计查询', link: '' },
  ],
  
  // 市民
  [ROLE_CITIZEN]: [
    { icon: 'icon1', text: '未处理', link: '/pages/issue/list2/index?title=未处理&bizStatus=start&from=citizen' },
    { icon: 'icon2', text: '已处理', link: '/pages/issue/list2/index?title=已处理&bizStatus=assigned&from=citizen' },
    { icon: 'icon12', text: '已打回', link: '/pages/issue/list2/index?title=已打回&bizStatus=reject&from=citizen' },
  ],
}

export default (props) => {

  const { user, person, duty, updateDuty } = useModel('user');

  const menuArr = React.useMemo(() => {
    if (!duty) return [];

    return menus[duty];
  }, [duty])

  return (
    <Page tabBar="home" className="home-page">
      <Head user={user} person={person} duty={duty} onDutyChange={updateDuty} />
      <Banner  duty={duty} />
      <StatCard duty={duty} />

      <View className="menu-icons">
        {
          menuArr.map(x => (
            <MenuIcon key={x.text} {...x} />
          ))
        }
      </View>
    </Page>
  );
}
