import { Component } from "react";
import Taro from "@tarojs/taro";
import { View, Text, Image, Button } from "@tarojs/components";
import "./index.scss";
import { AtTabBar } from "taro-ui";
import React, { useCallback, useEffect, useState } from "react";
import { AtGrid } from "taro-ui";
import { Swiper, SwiperItem } from "@tarojs/components";
import { AtCard } from "taro-ui";
import { AtImagePicker } from "taro-ui";
import { AtButton } from "taro-ui";
import { AtSearchBar } from "taro-ui";
import { Picker } from "@tarojs/components";
import { AtList, AtListItem, AtNavBar, AtTag } from "taro-ui";
import {
  AtModal,
  AtModalHeader,
  AtModalContent,
  AtModalAction,
  AtAvatar,
  AtAccordion,
} from "taro-ui";
import { AtToast } from "taro-ui";
import { AtIcon } from "taro-ui";
import { VIEW } from "@tarojs/runtime";
import "animate.css";
import touxiang from "../../images/touxiang.png";

// export default class Index extends Component {
const Index = () => {
  const [current, setcurrent] = useState(0);
  const [openId, setopenId] = useState(null);
  const [wxid, setwxid] = useState(null);

  const [open, setopen] = useState(false);
  const [referer, setreferer] = useState(window.document.referrer);

  const [isOpened, setisOpened] = useState(false);
  const [joinMeetup, setjoinMeetup] = useState(false);

  // 获取openid
  const getOpenid = () => {
    // let newparams = Taro.getCurrentInstance().router.params;
    // let urlopenid = newparams.openid;

    // hash模式
    // http://192.168.31.245:10086/?openid=o7LFAwR32hWGq9XOpd7ZxK1wZxq8#/pages/index/index
    let hashopenid = null;
    if (window.location.href.includes("openid")) {
      hashopenid = window.location.href
        .split("#")[0]
        .split("?")[1]
        .split("=")[1];
    } else {
      hashopenid = window.localStorage.getItem("openid");
    }

    let newOpenid = window.localStorage.getItem("openid");

    if (
      (!!newOpenid && newOpenid != "undefined" && newOpenid != "null") ||
      (!!hashopenid && hashopenid != "undefined" && hashopenid != "null")
    ) {
      // 获取到openid
      window.localStorage.setItem("openid", hashopenid);
      setopenId(hashopenid);
    } else {
      let nowUrl = window.location.href;
      let payUrl = `https://payjs.cn/api/openid?mchid=1561724891&callback_url=${nowUrl}`;
      window.location.href = payUrl;
    }
  };

  const getWxidFromUrl=()=>{
    const urlParams = new URLSearchParams(window.location.search);
    const wxid = urlParams.get('wxid');
    setwxid(wxid)
    // window.alert(wxid)
    return wxid;
}
  
  // 网页查看通知
  // 入群申请

  useEffect(() => {
    // 获取openId
    getOpenid();
    // window.alert(window.location.href)
    // o7LFAwR32hWGq9XOpd7ZxK1wZxq8
    // window.alert(window.localStorage.getItem('openid'))
    // 获取wxid参数
    getWxidFromUrl()
  }, []);

  const goBack = () => {
    Taro.navigateBack({});
  };

  const handleClick = (value) => {
    // window.alert(value)
    setopen(value);
  };
  return (
    <View className="index">
      {/* 公众号 */}
      <View
        className="index-title"
        onClick={() => {
          // window.location.href=""
        }}
      >
        <AtAvatar
          size="small"
          circle
          // image="https://www.hackrobot.cn/wp-content/uploads/2023/05/cropped-cropped-Screenshot-2023-05-22-at-17.26.38.png"
          image={touxiang}
        ></AtAvatar>
        <View className="yidooplanet">异度世界</View>
      </View>

      {/* 标签 */}
      <View className="index-tags animate__animated animate__pulse">
        <AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
          独立开发者
        </AtTag>
        <AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
          跨境电商
        </AtTag>
        <AtTag className="index-AtTag" type="primary" AtNavBar={true} circle>
          树莓派
        </AtTag>
      </View>

      <View className="index-article">
        {/* className="at-article__p" */}
        <View>
          普通的独立开发者,平时喜欢折腾<span className="spanText">树莓派</span>
          <br />
          副业是做跨境电商
          <br />
          努力成为一个数字游民ing😎
        </View>
      </View>

      <View className="index-card">
        <View>独立博客</View>
        <View>独立博客</View>


      </View>

      {/* <View className="payBtn">
        <AtButton type="primary">立即购买 -- 29.8元</AtButton>
      </View> */}
    </View>
  );
};

export default Index;
