import { Card, Cell, Col, Row, Tabbar, TabbarItem } from "@antmjs/vantui";
import { View } from "@tarojs/components";
import react, { useEffect } 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";

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

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

  const CardCom = () => {
    return (
      <View>
        {[1, 2, 3, 4].splice(0, 2).map((item: any) => {
          return <ActiveCard />;
        })}
      </View>
    );
  };
  return (
    <View className="myContent">
      {/* <View className={styles?.myContent}>  */}

      {/* 头像 */}
      <View className={`myImage`}>
        <Image
          round
          width="100px"
          height="100px"
          src="cloud://cloud1-5g5xrgza12a0dd6d.636c-cloud1-5g5xrgza12a0dd6d-1253665791/images/images-2.jpg"
        />
      </View>

      <View>
        <Tabs sticky={true}>
          <Tab title="待审核">{CardCom()}</Tab>
          <Tab title="已报名">{CardCom()}</Tab>
          <Tab title="待参加">{CardCom()}</Tab>
          <Tab title="已结束">{CardCom()}</Tab>
        </Tabs>
      </View>

      <View className="cellArr">
        <Cell icon="manager" title="打卡记录" isLink />
        {/* <Cell icon="manager" title="个人资料" isLink /> */}

        <Cell
          title="微信客服"
          icon="wechat"
          isLink
          value=""
          onClick={() => {
            Taro.openCustomerServiceChat({
              corpId: "wwb04af9a97514271c", //企业id
              extInfo: {
                url: "https://work.weixin.qq.com/kfid/kfc70f3f112c97a54c5",
              },
              success: function (res) {},
            });
          }}
        />
        <Cell icon="friends" title="关于我们" isLink />
        <Cell
          icon="setting"
          title="版本日志"
          isLink
          onClick={() => {
            // 跳转到目的页面，打开新页面
            Taro.navigateTo({
              url: "/pages/my/components/Version/index",
            });
          }}
        />
      </View>

      <TabbarCom active={2} />
    </View>
  );
};

export default my;