import { View } from "@tarojs/components"
import style from './index.module.less'
import IconEditGray from "@/components/icon/icon-edit-gray"
import Taro from "@tarojs/taro";
import { useAgentStore } from "@/store/agentStore";
import ContactIcon from '@/components/ContactIcon'

export default () => {
  const agent = useAgentStore((state)=> state.agent)
  const handleEdit = ()=> {
    Taro.navigateTo({
      url: `/pages/editor-contact/index?agentId=${agent?.agentId}`,
    })
  }
  return(
    <View className={style.container}>
      <View className={style.header}>
        <View className={`${style.name} truncate`}>{agent?.name}</View>
        <View className={style.icons}>
          <ContactIcon type="phone" actived={!!agent?.mobile}></ContactIcon>
          <ContactIcon type="mail" actived={!!agent?.email}></ContactIcon>
          <ContactIcon type="location" actived={!!agent?.address}></ContactIcon>
          <ContactIcon type="qrcode" actived={!!agent?.qrCodeUrl}></ContactIcon>
        </View>
      </View>
      <View className={style.items}>
        <View className={style.item}>
        {agent?.entName}
        </View>
        <View className={style.item}>
        {agent?.position}
        </View>
      </View>
      <View className={style.editButton} onClick={handleEdit}>
        <View className="flex-center gap-4">
          <IconEditGray/>
          <View className={style.editButtonText}>编辑</View>
        </View>
      </View>
    </View>
  )
}