493 lines
16 KiB
JavaScript
493 lines
16 KiB
JavaScript
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, AtMessage } 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 youtubesvg from "../../images/youtube.svg";
|
|
import ytGpt from "../../images/ytGpt.png";
|
|
|
|
|
|
import ssh from "../../images/ssh.svg";
|
|
import robot from "../../images/robot.svg";
|
|
import host from "../../images/host.svg";
|
|
import man from "../../images/man.svg";
|
|
import woman from "../../images/woman.svg";
|
|
import live from "../../images/live.svg";
|
|
import income from "../../images/income.svg";
|
|
import code from "../../images/code.svg";
|
|
import dgnomad from "../../images/dgnomad.png";
|
|
import company from "../../images/company.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 [userInfo, setuserInfo] = useState({});
|
|
|
|
const [open, setopen] = useState(false);
|
|
const [referer, setreferer] = useState(window.document.referrer);
|
|
|
|
const [isOpened, setisOpened] = useState(false);
|
|
const [meetupQR, setmeetupQR] = useState(false);
|
|
|
|
const [bookToast, setbookToast] = useState(false);
|
|
const [meetupToast, setmeetupToast] = useState(false);
|
|
|
|
const [joinMeetup, setjoinMeetup] = useState(false);
|
|
const [bookpay, setbookpay] = useState(0);
|
|
|
|
const [isWeChat, setisWeChat] = useState(false);
|
|
|
|
const getOpenidFromUrl = (url) => {
|
|
const pattern = /[?&]openid=([^&#]+)/;
|
|
const match = url.match(pattern);
|
|
if (match) {
|
|
return match[1];
|
|
}
|
|
return null;
|
|
};
|
|
|
|
// 是否在微信客户端
|
|
const isWeChatFun = () => {
|
|
var ua = navigator.userAgent.toLowerCase();
|
|
if (ua.indexOf("micromessenger") != -1) {
|
|
setisWeChat(true);
|
|
return true;
|
|
} else {
|
|
setisWeChat(false);
|
|
return false;
|
|
}
|
|
};
|
|
|
|
// pwa安装弹窗
|
|
// useEffect(() => {
|
|
// window.addEventListener("beforeinstallprompt", (event) => {
|
|
// event.preventDefault();
|
|
// let installPrompt = event;
|
|
// // 显示安装按钮
|
|
// document.getElementById("install-btn").addEventListener("click", () => {
|
|
// installPrompt.prompt();
|
|
// });
|
|
// });
|
|
// }, []);
|
|
|
|
// 获取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 = getOpenidFromUrl(window.location.href);
|
|
} else {
|
|
// hashopenid = window.localStorage.getItem("openid");
|
|
}
|
|
if (!!hashopenid && hashopenid != "undefined" && hashopenid != "null") {
|
|
// 获取到openid
|
|
window.localStorage.setItem("openid", hashopenid);
|
|
setopenId(hashopenid);
|
|
|
|
// window.alert(hashopenid);
|
|
// 查询数据库是否存在openid
|
|
Taro.request({
|
|
method: "GET",
|
|
url: `${process.env.TARO_API_API}/user/${hashopenid}`, //仅为示例，并非真实的接口地址
|
|
// url: `${process.env.TARO_API_API}/user/${window.localStorage.getItem("openid")}`, //仅为示例，并非真实的接口地址
|
|
success: function (res) {
|
|
if (res?.data?.userInfo) {
|
|
// 有完整的用户信息userInfo
|
|
setuserInfo(res?.data?.userInfo);
|
|
window.localStorage.setItem("userInfo", userInfo);
|
|
}
|
|
},
|
|
complete: function (finy) {
|
|
// 获取wxid参数
|
|
getWxidFromUrl();
|
|
},
|
|
});
|
|
} else {
|
|
let nowUrl = window.location.href;
|
|
window.localStorage.removeItem("openid");
|
|
let payUrl = `https://payjs.cn/api/openid?mchid=1561724891&callback_url=${nowUrl}`;
|
|
window.location.href = payUrl;
|
|
}
|
|
};
|
|
|
|
// 获取更新用户信息
|
|
const getUserinfo = (wxid) => {
|
|
Taro.request({
|
|
method: "GET",
|
|
url: `${process.env.TARO_API_API}/user/${wxid}`, //仅为示例，并非真实的接口地址
|
|
// url: `${process.env.TARO_API_API}/user/${window.localStorage.getItem("openid")}`, //仅为示例，并非真实的接口地址
|
|
success: function (res) {
|
|
if (res?.data?.userInfo) {
|
|
//判断wxid是否存在
|
|
if (res?.data?.userInfo?.openid) {
|
|
// 有完整的用户信息userInfo
|
|
setuserInfo(res?.data?.userInfo);
|
|
window.localStorage.setItem("userInfo", userInfo);
|
|
}
|
|
}
|
|
},
|
|
complete: function (finy) {},
|
|
});
|
|
};
|
|
|
|
// 获取url中的wxid
|
|
const getWxidFromUrl = () => {
|
|
const urlParams = new URLSearchParams(window.location.search);
|
|
const urlwxid = urlParams.get("wxid");
|
|
if (!!urlwxid) {
|
|
setwxid(urlwxid);
|
|
window.localStorage.setItem("wxid", wxid);
|
|
// 优先查询openid是否存在数据库
|
|
Taro.request({
|
|
method: "GET",
|
|
url: `${process.env.TARO_API_API}/user/${urlwxid}`, //仅为示例，并非真实的接口地址
|
|
// url: `${process.env.TARO_API_API}/user/${window.localStorage.getItem("openid")}`, //仅为示例，并非真实的接口地址
|
|
success: function (res) {
|
|
if (res?.data?.userInfo) {
|
|
//判断wxid是否存在
|
|
if (res?.data?.userInfo?.openid) {
|
|
// window.alert(res?.data?.userInfo?.openid);
|
|
// window.alert(window.localStorage.getItem("openid"));
|
|
|
|
if (
|
|
res?.data?.userInfo?.openid !==
|
|
window.localStorage.getItem("openid")
|
|
) {
|
|
// 删除其他用户的wxid
|
|
window.localStorage.removeItem("userInfo");
|
|
window.localStorage.removeItem("openid");
|
|
window.localStorage.removeItem("wxid");
|
|
window.location.href = "http://nomad.hackrobot.cn";
|
|
} else {
|
|
// 有完整的用户信息userInfo
|
|
setuserInfo(res?.data?.userInfo);
|
|
window.localStorage.setItem("userInfo", userInfo);
|
|
}
|
|
} else {
|
|
// 绑定wxid与openid到数据库
|
|
wxidTapopenid(urlwxid);
|
|
}
|
|
} else {
|
|
// 新增wxid用户
|
|
}
|
|
},
|
|
complete: function (finy) {
|
|
// tg消息通知
|
|
tgMessage();
|
|
},
|
|
});
|
|
} else {
|
|
// tg消息通知
|
|
tgMessage();
|
|
}
|
|
return wxid;
|
|
};
|
|
|
|
// 绑定wxid与openid
|
|
const wxidTapopenid = (newWxid) => {
|
|
const userUpdateData = {
|
|
openid: window.localStorage.getItem("openid"), // 只更新 openid 字段
|
|
};
|
|
Taro.request({
|
|
method: "PUT",
|
|
// url: `${process.env.TARO_API_API}/user/${urlwxid}`, //仅为示例，并非真实的接口地址
|
|
url: `${process.env.TARO_API_API}/user/${newWxid}`, //仅为示例，并非真实的接口地址
|
|
data: userUpdateData,
|
|
header: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
success: function (res) {},
|
|
fail: function (err) {},
|
|
complete: function (finy) {},
|
|
});
|
|
};
|
|
|
|
// 新增openid用户
|
|
const addopenidUser = () => {
|
|
const userUpdateData = {
|
|
openid: window.localStorage.getItem("openid"), // 只更新 openid 字段
|
|
};
|
|
Taro.request({
|
|
method: "GET",
|
|
// url: `${process.env.TARO_API_API}/user/${urlwxid}`, //仅为示例，并非真实的接口地址
|
|
url: `${process.env.TARO_API_API}/user/${window.localStorage.getItem(
|
|
"openid"
|
|
)}`, //仅为示例，并非真实的接口地址
|
|
data: userUpdateData,
|
|
header: {
|
|
"Content-Type": "application/json",
|
|
},
|
|
success: function (res) {},
|
|
fail: function (err) {},
|
|
complete: function (finy) {},
|
|
});
|
|
};
|
|
|
|
// 网页查看通知
|
|
const tgMessage = () => {
|
|
Taro.request({
|
|
method: "GET",
|
|
url: `${
|
|
process.env.TARO_API_API
|
|
}/tgMessage?openid=${window.localStorage.getItem("openid")}`, //仅为示例，并非真实的接口地址
|
|
// url: "https://pay.hackrobot.cn${process.env.TARO_API_API}/payh5", //仅为示例，并非真实的接口地址
|
|
success: function (res) {
|
|
// console.log("访问提醒发送成功");
|
|
},
|
|
});
|
|
};
|
|
|
|
const sendNtfy = () => {
|
|
// fetch("https://ntfy.nomadcna.com/awE5vPZI1LoRvsN1", {
|
|
// method: "POST", // PUT works too
|
|
// body: "Backup successful 😀",
|
|
// });
|
|
|
|
Taro.request({
|
|
method: "POST",
|
|
url: `${`https://ntfy.nomadcna.com/awE5vPZI1LoRvsN1`}`,
|
|
success: function (res) {
|
|
console.log("访问提醒发送成功");
|
|
},
|
|
});
|
|
};
|
|
useEffect(() => {
|
|
let inwechat = isWeChatFun();
|
|
if (inwechat) {
|
|
// 获取openId
|
|
getOpenid();
|
|
} else {
|
|
// window.alert('不在微信')
|
|
}
|
|
}, []);
|
|
|
|
useEffect(() => {
|
|
// alert(window.localStorage.getItem("bookpay"))
|
|
setbookpay(window.localStorage.getItem("bookpay"));
|
|
}, []);
|
|
|
|
const goBack = () => {
|
|
Taro.navigateBack({});
|
|
};
|
|
|
|
const handleClick = (value) => {
|
|
// window.alert(value)
|
|
setopen(value);
|
|
};
|
|
|
|
const payh5 = (type, total_fee = 1000) => {
|
|
// console.log("111");
|
|
Taro.request({
|
|
method: "POST",
|
|
url: `${process.env.TARO_API_API}/payh5`,
|
|
// url: "${process.env.TARO_API_API}/payh5",
|
|
|
|
// url: "https://pay.hackrobot.cn${process.env.TARO_API_API}/payh5", //仅为示例，并非真实的接口地址
|
|
|
|
data: {
|
|
callback_url: window.location.href,
|
|
openid: window.localStorage.getItem("openid"),
|
|
total_fee: total_fee, // 金额,单位:分
|
|
type: type, //订单类型 book/meetup/video/vip
|
|
},
|
|
header: {
|
|
"content-type": "application/json", // 默认值
|
|
},
|
|
success: function (res) {
|
|
console.log(res.data);
|
|
// window.alert(res.data.jsapi);
|
|
WeixinJSBridge.invoke(
|
|
"getBrandWCPayRequest",
|
|
{
|
|
// 以下6个支付参数通过payjs的jsapi接口获取
|
|
// appId: "wxc5205a653b0259bf",
|
|
// timeStamp: "1701401644",
|
|
// nonceStr: "KhOYB0wFV6j9qyQK",
|
|
// package: "prepay_id=wx01113404850024729b35f4d69b73500000",
|
|
// signType: "MD5",
|
|
// paySign: "2A823C8D47CCF871C6C65A56DC228CF8",
|
|
...(res?.data?.jsapi ?? {}),
|
|
},
|
|
function (res) {
|
|
// 支付成功
|
|
if (res.err_msg == "get_brand_wcpay_request:ok") {
|
|
window.localStorage.setItem(type, 1); //订单类型 book/meetup/video/vip
|
|
WeixinJSBridge.call("closeWindow");
|
|
}
|
|
}
|
|
);
|
|
},
|
|
});
|
|
};
|
|
|
|
const goRead = () => {
|
|
Taro.navigateTo({
|
|
url: "/pages/book/index",
|
|
});
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<View className="index">
|
|
{/* 在线图书 */}
|
|
|
|
{/* 参考资料https://readmake.com/ */}
|
|
<View className="index_book animate__animated animate__pulse">
|
|
<View className="index_book_left">
|
|
<View className="left_title">《一人公司》</View>
|
|
<View className="left_text">数字游民-手册2</View>
|
|
|
|
{/* 卡片 */}
|
|
<View className="card">
|
|
<View className="cardItem">
|
|
<View className="cardItem_left">
|
|
<Image
|
|
className="cardItem_left_img youtubeSvg"
|
|
src={income}
|
|
></Image>
|
|
</View>
|
|
<View className="cardItem_right">
|
|
<View className="cardItem_rightUp">创业方法论</View>
|
|
<View className="cardItem_rightDown">
|
|
随时随地,跟踪业务
|
|
</View>
|
|
</View>
|
|
</View>
|
|
|
|
<View className="cardItem">
|
|
<View className="cardItem_left">
|
|
<Image className="cardItem_left_img" src={live}></Image>
|
|
</View>
|
|
<View className="cardItem_right">
|
|
<View className="cardItem_rightUp">自媒体</View>
|
|
<View className="cardItem_rightDown">
|
|
公域流量,私域运营
|
|
</View>
|
|
</View>
|
|
</View>
|
|
<View className="cardItem">
|
|
<View className="cardItem_left">
|
|
<Image className="cardItem_left_img code" src={dgnomad}></Image>
|
|
</View>
|
|
<View className="cardItem_right">
|
|
<View className="cardItem_rightUp">独立开发</View>
|
|
<View className="cardItem_rightDown">sass产品,迭代更新</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
|
|
<View className="left_btn ">
|
|
<AtButton
|
|
onClick={() => {
|
|
try {
|
|
sendNtfy();
|
|
} catch (err) {
|
|
console.error("Error sending notification:", err);
|
|
}
|
|
goRead();
|
|
}}
|
|
className="startRead"
|
|
type="primary"
|
|
size="small"
|
|
circle
|
|
>
|
|
开始阅读
|
|
</AtButton>
|
|
</View>
|
|
</View>
|
|
<View className="index_book_img">
|
|
<Image
|
|
className="back_img"
|
|
// style="width: 40%px;height:100%;background: #fff;"
|
|
src={company}
|
|
/>
|
|
</View>
|
|
</View>
|
|
|
|
{/* <View className="group">
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
<View className="groupItem"></View>
|
|
</View> */}
|
|
|
|
<View className="svgItems">
|
|
<View className="svgItem">
|
|
{" "}
|
|
<View className="bookImg">
|
|
<Image
|
|
// style="width: 40%px;height:100%;background: #fff;"
|
|
// src={book}
|
|
src={ssh}
|
|
/>
|
|
<View className="bookImg_text">SSH远程</View>
|
|
</View>
|
|
<View className="bookImg">
|
|
<Image
|
|
// style="width: 40%px;height:100%;background: #fff;"
|
|
// src={book}
|
|
src={robot}
|
|
/>
|
|
<View className="bookImg_text">RPA自动化</View>
|
|
</View>
|
|
<View className="bookImg">
|
|
<Image
|
|
// style="width: 40%px;height:100%;background: #fff;"
|
|
// src={book}
|
|
src={host}
|
|
/>
|
|
<View className="bookImg_text">虚拟化</View>
|
|
</View>
|
|
</View>
|
|
</View>
|
|
{/* <View className="footer_div"></View> */}
|
|
{/* <View className="footer">
|
|
<View>Copyright © 2025 </View>
|
|
</View> */}
|
|
</View>
|
|
</>
|
|
);
|
|
};
|
|
|
|
export default Index;
|