import { View, Text, Image } from "@tarojs/components";
import { TVisitorAgent } from "@/types/visitor";
import Taro from "@tarojs/taro";
import IconPhone from '@/images/svgs/dashboard/IconPhone.svg'
import IconCopy from '@/images/svgs/dashboard/IconCopy.svg'
import IconTime from '@/images/svgs/dashboard/IconTime.svg'
import IconMark from '@/images/svgs/dashboard/IconMark.svg'
import AgentCard from "@/components/AgentCard/index";
export interface IndexProps {
  data: TVisitorAgent;
}

const VisitorSummary = ({ data }: IndexProps) => {
  const handleCopy = (value: string)=> {
    // 手动复制并 toast 提示
    Taro.setClipboardData({
      data: value,
      success(){
        Taro.showToast({
          title: '复制成功',
          icon: 'none'
        })
      },fail(res) {
        console.log(res)
        Taro.showToast({
          title: '复制失败',
          icon: 'none'
        })
      },
    })
  }
  return (
    <View className="w-full p-16">
      <AgentCard
        className="bg-opacity-0 p-0 rounded-none mb-16"
        key={data.agentId}
        data={data}
        truncate={false}
        onClick={() => {
          Taro.navigateTo({
            url: `/pages/profile/index?agentId=${data.agentId}`,
          })
        }}
      >
      </AgentCard>
      <View className="flex flex-col w-full gap-8">
        <View className="flex gap-8 items-center text-12 leading-20">
          <Image src={IconPhone} className="w-16 h-16 shrink-0 self-start"></Image>
          <Text>{data.mobile}</Text>
          <Image src={IconCopy} className="w-16 h-16 shrink-0" onClick={()=> handleCopy(data.mobile ?? '')}></Image>
        </View>
        <View className="flex gap-8 items-center text-12 leading-20">
          <Image src={IconMark} className="w-16 h-16 shrink-0 self-start"></Image>
          <View>
            第<Text className="text-primary text-12 font-medium px-6">{data.visitTimes}</Text>
          次访问了你的智能体「<Text className="text-primary text-12 font-medium px-6">{data.myAgentName}</Text>」
          </View>
        </View>
        <View className="flex gap-8 items-center text-12 leading-20">
          <Image src={IconTime} className="w-16 h-16 shrink-0 self-start"></Image>
          {data.lastChatTime}
        </View>
      </View>
    </View>
  );
};

export default VisitorSummary;