import {useEffect, useState} from "react";
import {Image, View} from "@tarojs/components";
import Taro from "@tarojs/taro";
import {Profile} from '@/store/profile'
import styles from '../../my.module.scss'
import dep from '@/static/img/dep.png'
import buy from '@/static/img/buy.png'

interface List {
  title: string;
  src: string;
  router: string;
}

const Service = () => {
  const [list, setList] = useState<List[]>([
    {title: '设置', src: dep, router: '/pages/business/userInfo/userInfo'}
  ])

  const {user} = Profile.useContainer()

  useEffect(() => {
    const oldList: List[] = JSON.parse(JSON.stringify(list))
    if ([1, 2].includes(user?.role_type || 0)) {
      oldList.unshift(...[
        {title: '部门管理', src: dep, router: '/pages/manage/depAdmin/depAdmin'},
        {title: '课程购买', src: buy, router: '/pages/manage/curriculum/curriculum'},
      ])
      setList(oldList)
    }
  }, [])

  function jump(url: string) {
    Taro.navigateTo({url})
  }

  return (
    <View className={'mt-3 ' + styles.tool}>
      <View className='font-weight font-32'>工具服务</View>
      <View className={'mt-4 ' + styles.service}>
        {
          list.map(d => {
            return (
              <View onClick={() => jump(d.router)}>
                <Image src={d.src} mode='aspectFit' className={styles.serviceImage}/>
                <View>{d.title}</View>
              </View>
            )
          })
        }
      </View>
    </View>
  )
}

export default Service