import NavBarNormal from "@/components/NavBarNormal/index";
import { View } from "@tarojs/components";
import PageCustom from "@/components/page-custom/index";

import CardList from "@/components/list/card-list";
import ListWrapper from "@/components/list/ListWrapper";
import ListRow from "@/components/list/ListRow";
import TagCertificated from "@/components/tag-certificated";
import CardListItem from "@/components/list/card-list-item";
import Taro, { useRouter } from "@tarojs/taro";
import { useAgentStore } from "@/store/agentStore";
import { TAgentDetail } from "@/types/agent";
const RenderEntCard = (
  agent: TAgentDetail | null,
  navToUrl: (url: string) => void
) => {
  if (!agent?.entName) {
    return <></>;
  }
  return (
    <View className="px-16 w-full pt-12">
      <CardList>
        <View className="py-16 px-20 flex flex-col gap-20">
          <CardListItem
            underline
            arrow
            onClick={() => navToUrl("/pages/editor-pages/editor-company/index")}
          >
            <View className="flex items-center font-normal pb-16">
              <View className="flex-1 font-normal">企业</View>
              <View className="text-gray-65 truncate max-w-[188px]">
                {agent?.entName}
              </View>
            </View>
          </CardListItem>
          <CardListItem underline>
            <View className="flex items-center font-normal pb-16">
              <View className="flex-1 font-normal">企业认证</View>
              <TagCertificated />
            </View>
          </CardListItem>
          <CardListItem
            arrow
            onClick={() =>
              navToUrl("/pages/editor-pages/editor-position/index")
            }
          >
            <View className="flex items-center font-normal pb-16">
              <View className="flex-1 font-normal">职位</View>
              <View className="text-gray-65 mr-8">{agent?.position}</View>
            </View>
          </CardListItem>
        </View>
      </CardList>
    </View>
  );
};

export default function Index() {
  const router = useRouter();
  const { agentId } = router.params;
  const agent = useAgentStore((state) => state.agent);

  const navToUrl = (url: string) => {
    Taro.navigateTo({ url });
  };

  return (
    <PageCustom>
      <NavBarNormal backText="数字名片"></NavBarNormal>
      <View className="px-16 w-full pt-4">
        <ListWrapper>
          <ListRow
            underline
            arrow
            rightRenderer={() => (
              <View className="text-gray-65 truncate max-w-160">
                {agent?.name}
              </View>
            )}
            onClick={() =>
              navToUrl(
                `/pages/editor-pages/editor-name/index?agentId=${agentId}`
              )
            }
          >
            姓名
          </ListRow>
          <ListRow
            rightRenderer={() => (
              <View className="text-gray-65 truncate max-w-160">
                {agent?.mobile}
              </View>
            )}
            underline
            arrow
            onClick={() =>
              navToUrl(
                `/pages/editor-pages/editor-phone/index?agentId=${agentId}`
              )
            }
          >
            手机号码
          </ListRow>
          <ListRow
            rightRenderer={() => (
              <View className="text-gray-65 truncate max-w-160">
                {agent?.email}
              </View>
            )}
            underline
            arrow
            onClick={() =>
              navToUrl(
                `/pages/editor-pages/editor-email/index?agentId=${agentId}`
              )
            }
          >
            联系邮箱
          </ListRow>
          <ListRow
            rightRenderer={() => (
              <View className="text-gray-65 truncate max-w-160">
                {agent?.address}
              </View>
            )}
            underline
            arrow
            onClick={() =>
              navToUrl(
                `/pages/editor-pages/editor-address/index?agentId=${agentId}`
              )
            }
          >
            联系地址
          </ListRow>
          <ListRow
            rightRenderer={() => {
              return !!agent?.qrCodeUrl?.length ? (
                <View className="text-gray-65 text-primary font-normal">已上传</View>
              ) : (
                <></>
              );
            }}
            arrow
            onClick={() => navToUrl("/pages/editor-pages/editor-qrcode/index")}
          >
            我的二维码
          </ListRow>
        </ListWrapper>
      </View>

      {RenderEntCard(agent, navToUrl)}
    </PageCustom>
  );
}
