import {
  Button,
  Card,
  Cell,
  Col,
  Empty,
  Icon,
  Row,
  Tabbar,
  TabbarItem,
  Toast,
} from "@antmjs/vantui";
import { OpenData, View, Text, OfficialAccount } from "@tarojs/components";
import react, { useEffect, useState } from "react";
import TabbarCom from "../components/TabbarCom";
import { Image } from "@antmjs/vantui";
// import styles from './index.module.scss'
import "./index.module.scss";
import { Tab, Tabs } from "@antmjs/vantui";
import Taro from "@tarojs/taro";
import ActiveCard from "../components/ActiveCard";
import {
  addTable,
  cloudcall,
  getOpenid,
  getTable,
  getTableid,
  isLogin,
  phoneLogin,
  updateTableid,
} from "@/utils/index";
import { type } from "../../../config";
import { Divider } from "@antmjs/vantui";
import meetup from "../../images/meetup.jpg";
import python from "../../images/python.jpg";

const mylife = (props: any) => {
  //   const [active, setActive] = react.useState(props?.active ?? 0);

  const [userInfo, setuserInfo] = useState({}); //用户信息
  const [openId, setopenId] = useState(""); //用户信息
  const [activeidArr, setactiveidArr] = useState<any>([]); //用户参与的活动

  const [detailsData, setdetailsData] = useState<any>([]); //活动详情
  const [currentIndex, setcurrentIndex] = useState(0);
  const [isin, setisin] = useState(false); //0初始 1未登录 2有手机号
  const [initOK, setinitOK] = useState(false); //是否加载完成

  useEffect(() => {
    getLogin();
  }, []);

  const getLogin = async () => {
    let isLogin: any = await phoneLogin();
    console.log("isLogin", isLogin);
    setisin(isLogin);
    setinitOK(true);
  };

  useEffect(() => {
    if (isin) {
      // 获取当前用户信息
      getUserInfo();
    }
  }, [isin]);

  // 获取用户
  const getUserInfo = () => {
    Taro.cloud.callFunction({
      name: "getOpenid",
      complete: async (res: any) => {
        console.log("callFunction test result: ", res);
        let openid = res?.result?.event?.userInfo?.openId;
        setopenId(openid);
        let objParams = {
          tableName: "userInfo",
          // id: "80516fb66370bcf300b8f43c5f4dd52b",
          keyValue: { openId: openid },
          okFun: (res) => {
            console.log("userinfo--", res);
            setuserInfo(res?.data?.[0] ?? {});
            setactiveidArr(res?.data?.activeidArr ?? []);

            // 获取当前用户参与的活动
            getDetails(openid, "1");
          },
        };
        getTable(objParams);
      },
    });
  };

  // 获取该用户所有活动详情
  const getDetails = (openid: any, status?: string) => {
    const db: any = Taro.cloud.database({});
    const _: any = db.command;
    let newKey: any = status
      ? {
          peopleArr: _.elemMatch({
            openid: _.eq(openid),
            status: _.eq(status), //审核通过的数据
          }),
        }
      : {
          peopleArr: _.elemMatch({
            openid: _.eq(openid),
          }),
        };
    let objParams: any = {
      tableName: "details",
      // id: "80516fb66370bcf300b8f43c5f4dd52b",
      keyValue: {
        ...newKey,
      },
      okFun: (res) => {
        console.log("detailsData/usero--", res);
        setdetailsData(res?.data ?? []);
      },
    };
    getTable(objParams);
  };

  useEffect(() => {
    // 设置标题
    definePageConfig({
      navigationBarTitleText: "我的",
    });
  }, []);

  const CardCom = () => {
    return (
      <View>
        {detailsData?.length > 0 ? (
          <View>
            {detailsData.splice(0, 2).map((item: any, index: any) => {
              return (
                <View
                  onClick={() => {
                    console.log("Card");
                    Taro.navigateTo({
                      url: `/pages/activityList/components/details/index?id=${item?._id}`,
                    });
                  }}
                >
                  {/* 活动卡片 */}
                  <ActiveCard dataSource={item} />
                </View>
              );
            })}
          </View>
        ) : (
          <View>
            <Empty
              className="customImage"
              image="https://img.yzcdn.cn/vant/custom-empty-image.png"
              // description="描述文字"
            />
          </View>
        )}
      </View>
    );
  };

  const updateAuth = async (userRes: any) => {
    let newobj = {
      tableName: "userInfo",
      id: userRes?.data?.[0]?._id,
      objData: {
        authInfo: [...(userRes?.data?.[0]?.authInfo ?? []), ...userRes],
      },
      okFun: async (okFunres: any) => {
        console.log("添加用户认证信息", okFunres);
        setisin(true);
        //
      },
    };
    await updateTableid({ ...newobj });
  };

  return (
    <View className="myContent">
      <View className="wechatCode">
        <Image
          showMenuByLongpress={true}
          width={300}
          height={300}
          src={python}
          // src='cloud://citynew-0givkbre03955d8c.6369-citynew-0givkbre03955d8c-1253655588/images/touxiang/download-1.jpg'
        ></Image>
      </View>
      <Card
        // num="2"
        price=""
        desc="<让繁琐的工作自动化>,这本书介绍了python语法实现操作系统,和业务的自动化处理方式,比如自动数据处理excel并发送邮件"
        title="读书笔记"
        // thumb={"../../images/python.jpg"}
      />

      <Card
        // num="2"
        price=""
        desc="在深圳的莲花山参加了一场线下的同城活动,交流自由职业的感想,感觉不太理想,没有直接切主题,一直在探讨身心灵的冥想内容"
        title="自由职业线下交流"
        thumb={"../../images/meetup.jpg"}
      />

      {/* <Card
        // num="2"
        price=""
        desc="<让繁琐的工作自动化>,这本书介绍了python语法实现操作系统,和业务的自动化处理方式,比如自动数据处理excel并发送邮件"
        title="读书笔记"
        thumb="https://img.yzcdn.cn/upload_files/2017/07/02/af5b9f44deaeb68000d7e4a711160c53.jpg"
      />

      <Card
        // num="2"
        price=""
        desc="<让繁琐的工作自动化>,这本书介绍了python语法实现操作系统,和业务的自动化处理方式,比如自动数据处理excel并发送邮件"
        title="读书笔记"
        thumb="https://img.yzcdn.cn/upload_files/2017/07/02/af5b9f44deaeb68000d7e4a711160c53.jpg"
      /> */}
    </View>
  );
};

export default mylife;
