import Taro, { useReachBottom,} from "@tarojs/taro";
import { View, ScrollView } from "@tarojs/components";
import style from "./index.module.less";
import { useEffect, useState } from "react";
import { getContactList } from "@/service/contact";
import { useLoadMore } from "@/utils/loadMore";
import { TContactItem } from "@/types/contact";
import AgentCard from "@/components/AgentCard/index";
import WemetaRadio from "@/components/WemetaRadio/index";
import { useAgentStore } from "@/store/agentStore";
import { TAgent } from "@/types/agent";
import EmptyData from "@/components/EmptyData";

export interface IProps {
  selected: any[]
  setSelected: (values) => void
}


export default function Index({selected, setSelected}: IProps) {

  const agents = useAgentStore((state) => state.agents);
  const myAgents = agents.filter(item => !item.isEnt)


  const handleClick = (item: TAgent) => {
    console.log(item)
    const exist = selected.find(_item =>  _item.agentId === item.agentId)
    console.log(exist)
    if(exist){
      const filtered = selected.filter(_item => _item.agentId !== item.agentId)
      setSelected(filtered)
    }else{
      setSelected([...selected, item])
    }
  };

  const renderContent = () => {
    if (myAgents?.length) {
      return myAgents.map((item) => (
        <View className='bg-white'>
          <AgentCard
              className="border-bottom1-gray py-16"
              key={item.agentId}
              data={item}
              onClick={()=> handleClick(item)}
              renderRight={() => {
                return (
                  <View className="flex items-center">
                    <WemetaRadio
                      checkbox
                      checked={!!selected.find(_item =>  _item.agentId === item.agentId)}
                    ></WemetaRadio>
                  </View>
                );
              }}
            ></AgentCard>
        </View>
      ));
    }
    return <EmptyData type='search'></EmptyData>
  };

  return (
    <ScrollView
      scrollY
      style={{
        flex: 1,
        height: "100%", // 高度自适应
      }}
    >
      {renderContent()}
    </ScrollView>
  );
}
