import { View, Text, Image } from "@tarojs/components";
import DigitalCardBasic from "@/components/DigitalCard/DigitalCardBasic";
import Taro from "@tarojs/taro";
import { TVisitorAgent } from "@/types/visitor";
import { AvatarMedia } from "@/components/AvatarMedia";

import dayjs from "dayjs";

export interface IndexProps {
  data:TVisitorAgent;
}

const Index = ({ data }: IndexProps) => {
  const handleClick = ()=> {
    Taro.navigateTo({
      url: `/pages/visiteor-detail/index?visitorId=${data.visitorId}`
    })
  }
  return (
    <View className="bg-white rounded-12 p-12" onClick={handleClick}>
      <View className="flex items-start gap-12">
        <View className="flex items-star rounded-full overflow-hidden">
          <View className="w-44 h-44 bg-gray-3 rounded-full shrink-0">
            <AvatarMedia source={data.avatarUrl || ''} mode="aspectFill" className="w-44 h-44 bg-gray-3 rounded-full"></AvatarMedia>
          </View>
        </View>
        <View className="flex flex-col flex-1 gap-4">
          <DigitalCardBasic
            name={data.name}
            position={data.position ?? ""}
            entName={data.entName}
            certificated={data.isEnt}
          />
          <View className="text-12 leading-22">
            第<Text className="text-primary text-14 font-medium px-6">{data.visitTimes}</Text>
            次访问了你的智能体【{data.myAgentName}】
          </View>
          <View className="flex-center text-12 leading-20 pt-8">
            <View className="flex-1">
              <Text className="text-primary text-12 font-medium leading-20">{data.chatRound}</Text> 轮对话
              {data.dislikeCnt > 0 ? <><Text className="text-[#FF4747] font-medium"><Text className="text-gray-4 px-8">|</Text>{data.dislikeCnt}</Text><Text>差评</Text></> : <></>}
            </View>
            <View className="text-gray-4 leading-20">{dayjs(data.lastChatTime).fromNow()}</View>
          </View>
        </View>
      </View>
    </View>
  );
};

export default Index;
