import { View, Text } from "react-native";
import React, { useState, useEffect } from "react";
import { useTailwind } from "tailwind-rn";
import { useSafeAreaInsets } from "react-native-safe-area-context";
import { Icon } from "@rneui/themed";
import baseRequest from "../../../utils/baseRequest";
import Toast from "react-native-toast-message";
import { generateSignature } from "../../../utils/crypto";

export default function AfterSubmitStreamerVerification({ navigation, route }) {
  const tailwind = useTailwind();
  const insets = useSafeAreaInsets();

  //获取运营微信
  const [wechatList, setWechatList] = useState([]);
  useEffect(() => {
    const getWechat = async () => {
      const apiUrl = process.env.EXPO_PUBLIC_API_URL;
      try {
        const base = await baseRequest();
        const signature = await generateSignature({
          ...base,
        });
        const response = await fetch(
          `${apiUrl}/api/support_wx_id/list?signature=${signature}`,
          {
            method: "POST",
            headers: {
              "Content-Type": "application/json",
            },
            body: JSON.stringify({
              ...base,
            }),
          }
        );
        const data = await response.json();
        if (data.ret === -1) {
          Toast.show({
            type: "error",
            text1: data.msg,
            topOffset: 60,
          });
          return;
        }
        const temWechat = Object.entries(data.data);
        const temWechatList = temWechat.map((item) => item[1]);
        setWechatList(temWechatList);
      } catch (error) {
        console.error(error);
      }
    };
    getWechat();
  }, []);

  return (
    <View
      style={{
        paddingBottom: insets.bottom,
        paddingLeft: insets.left,
        paddingRight: insets.right,
        ...tailwind("flex-1 py-4 items-center"),
      }}
    >
      <Icon name="checkmark-circle" type="ionicon" color="#27F5B7" size={100} />
      <Text style={tailwind("text-2xl text-white font-medium mb-2")}>
        提交成功
      </Text>
      <Text
        style={tailwind("text-base text-white font-medium text-center w-2/3")}
      >
        请添加工作人员
        <Text style={tailwind("text-[#F53030]")}>微信：{wechatList[0]}</Text>
        直接商讨合作事宜，如未添加可能影响审核进度，请及时添加。
      </Text>
      <View style={tailwind("mt-4")}>
        {wechatList.map((item, index) => {
          if (index === 0) return;
          return (
            <Text key={index} style={tailwind("text-base text-[#F53030]")}>
              备用微信{index}：{item}
            </Text>
          );
        })}
      </View>
    </View>
  );
}