Compare commits
1 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
d3de35f587 |
@@ -1,121 +1,54 @@
|
||||
// @ts-nocheck
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } from "@tarojs/components";
|
||||
import { View, Image } from "@tarojs/components";
|
||||
import React from "react";
|
||||
import "./index.scss";
|
||||
import { AtButton, AtInput, 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 Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtTag } from "taro-ui";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import { AtForm, AtMessage } from "taro-ui";
|
||||
import { marked } from "marked";
|
||||
import markdownText from "./text.md";
|
||||
// import Nav from "@/pages/components/Nav/index.tsx";
|
||||
// import Nav from "../componments/Nav/index";
|
||||
// import Nav from "@/pages/componments/Nav/index";
|
||||
// import elevenImage from "@/images/book/11.jpg";
|
||||
// import elevenImage2 from "@/images/book/22.jpg";
|
||||
// import vps from "@/images/book/vpsbook.png";
|
||||
// import ro from "@/images/book/robook.png";
|
||||
// import yt from "@/images/book/ytbook.png";
|
||||
// import company from "@/images/book/company.png";
|
||||
// import ytGpt from "@/images/book/ytGpt.png";
|
||||
// import nomadro from "@/images/book/nomadro.png";
|
||||
|
||||
const BOOK_LIST = [
|
||||
{
|
||||
text: "数字游民",
|
||||
title: "从零开始,做数字游民",
|
||||
content: "如何成为数字游民，远程工作与生活的完整指南",
|
||||
url: "https://nomadro.com",
|
||||
},
|
||||
{
|
||||
text: "youtube运营笔记",
|
||||
title: "youtube运营笔记",
|
||||
content: "YouTube频道运营从入门到精通的实战笔记",
|
||||
url: "https://nomadyt.com",
|
||||
},
|
||||
{
|
||||
text: "一人公司",
|
||||
title: "一人公司",
|
||||
content: "一个人也能创业，打造可持续的个人商业模式",
|
||||
url: "https://nomadvps.com",
|
||||
},
|
||||
];
|
||||
|
||||
const Book = () => {
|
||||
const [markText, setmarkText] = useState();
|
||||
|
||||
useEffect(() => {}, []);
|
||||
|
||||
const handleClick = (value) => {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<View className="Book">
|
||||
{/* 导航 */}
|
||||
<Nav></Nav>
|
||||
<View className="BookItems">
|
||||
{[
|
||||
{
|
||||
imagePath: nomadro,
|
||||
text: "数字游民",
|
||||
title: "从零开始,做数字游民",
|
||||
content:
|
||||
"创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行",
|
||||
url: "https://nomadro.com",
|
||||
},
|
||||
{
|
||||
imagePath: ytGpt,
|
||||
text: "youtube运营笔记",
|
||||
title: "youtube运营笔记",
|
||||
content:
|
||||
"创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行",
|
||||
url: "https://nomadyt.com",
|
||||
},
|
||||
{
|
||||
imagePath: company,
|
||||
text: "一人公司",
|
||||
title: "一人公司",
|
||||
content:
|
||||
"创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行",
|
||||
url: "https://nomadvps.com",
|
||||
},
|
||||
{
|
||||
imagePath: elevenImage,
|
||||
text: "作者",
|
||||
title: "认知跃迁",
|
||||
content:
|
||||
"认知跃迁认知跃迁认知跃迁认知跃迁认知认知跃迁认知跃迁认知跃知跃迁认知认知跃迁知跃迁认知认知跃迁知跃迁认知认知跃迁知跃迁认知认知跃迁迁认知跃迁认知跃迁跃迁认知跃迁认知跃迁认知跃迁",
|
||||
url: "https://weread.qq.com/web/reader/b8b321d0811e4eaffg011598",
|
||||
},
|
||||
{
|
||||
imagePath: elevenImage2,
|
||||
text: "创业行",
|
||||
title: "创业行",
|
||||
content:
|
||||
"创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行创业行",
|
||||
url: "https://weread.qq.com/web/reader/b8b321d0811e4eaffg011598",
|
||||
},
|
||||
].map((item, index) => {
|
||||
return (
|
||||
<View
|
||||
className="BookItem"
|
||||
key={index}
|
||||
onClick={() => {
|
||||
// window.open(item?.url, '_blank');
|
||||
setTimeout(() => {
|
||||
window.location.href = item?.url;
|
||||
}, 0); // ⏱️ 解耦浏览器的调试器
|
||||
}}
|
||||
>
|
||||
<View className="BookItem_img">
|
||||
<Image
|
||||
src={item?.imagePath}
|
||||
style={{ width: "100%", height: "100%", objectFit: "cover" }}
|
||||
/>
|
||||
</View>
|
||||
<View className="BookItem_right">
|
||||
<View className="BookItem_right_title">{item.title}</View>
|
||||
<View className="BookItem_right_content">
|
||||
{item.content.length > 5
|
||||
? `${item.content.slice(0, 50)}...`
|
||||
: item.content}
|
||||
</View>
|
||||
{/* <View className="BookItem_right_text">{item?.text}</View> */}
|
||||
<View className="BookItem_right_text"></View>
|
||||
{BOOK_LIST.map((item, index) => (
|
||||
<View
|
||||
className="BookItem"
|
||||
key={index}
|
||||
onClick={() => {
|
||||
setTimeout(() => {
|
||||
window.location.href = item.url;
|
||||
}, 0);
|
||||
}}
|
||||
>
|
||||
<View className="BookItem_right">
|
||||
<View className="BookItem_right_title">{item.title}</View>
|
||||
<View className="BookItem_right_content">
|
||||
{item.content.length > 50
|
||||
? `${item.content.slice(0, 50)}...`
|
||||
: item.content}
|
||||
</View>
|
||||
<View className="BookItem_right_text" />
|
||||
</View>
|
||||
);
|
||||
})}
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
</View>
|
||||
);
|
||||
|
||||
@@ -1,75 +1,44 @@
|
||||
// @ts-nocheck
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } from "@tarojs/components";
|
||||
import "./index.scss";
|
||||
import { AtButton, AtInput, 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 { View } from "@tarojs/components";
|
||||
import { AtButton, AtInput, AtForm, AtMessage } from "taro-ui";
|
||||
import React, { useState } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtTag } from "taro-ui";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import { AtForm, AtMessage } from "taro-ui";
|
||||
import "./index.scss";
|
||||
|
||||
const PHONE_REGEX = /^[0-9]{11}$/;
|
||||
|
||||
// export default class Index extends Component {
|
||||
const Group = () => {
|
||||
const [current, setcurrent] = useState(2);
|
||||
const [wxid, setwxid] = useState(null);
|
||||
const [phoneNum, setphoneNum] = useState(null);
|
||||
const [vCode, setvCode] = useState(null);
|
||||
const [waitTime, setWaitTime] = useState(0); // 等待秒数
|
||||
const [isButtonDisabled, setIsButtonDisabled] = useState(false); // 按钮是否禁用
|
||||
|
||||
useEffect(() => {}, []);
|
||||
|
||||
const handleClick = (value) => {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
};
|
||||
const [waitTime, setWaitTime] = useState(0);
|
||||
const [isButtonDisabled, setIsButtonDisabled] = useState(false);
|
||||
|
||||
const startTimer = () => {
|
||||
setIsButtonDisabled(true);
|
||||
let localWaitTime = 60; // 使用局部变量
|
||||
let remaining = 60;
|
||||
|
||||
// 更新状态的函数
|
||||
const updateTime = () => {
|
||||
if (localWaitTime <= 0) {
|
||||
const timer = setInterval(() => {
|
||||
if (remaining <= 0) {
|
||||
clearInterval(timer);
|
||||
setIsButtonDisabled(false);
|
||||
setWaitTime(0);
|
||||
} else {
|
||||
setWaitTime(localWaitTime);
|
||||
localWaitTime -= 1;
|
||||
setWaitTime(remaining);
|
||||
remaining -= 1;
|
||||
}
|
||||
};
|
||||
}, 1000);
|
||||
|
||||
// 设定计时器
|
||||
const timer = setInterval(updateTime, 1000);
|
||||
// 初始调用
|
||||
updateTime();
|
||||
setWaitTime(remaining);
|
||||
remaining -= 1;
|
||||
};
|
||||
|
||||
const validatePhoneNumber=(phoneNum) =>{
|
||||
// 检查是否为11位数字
|
||||
const phoneRegex = /^[0-9]{11}$/;
|
||||
return phoneRegex.test(phoneNum);
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<View className="group">
|
||||
<AtForm
|
||||
onSubmit={(event) => {
|
||||
console.log("onSubmit-event--", event[0]?.detail?.value);
|
||||
}}
|
||||
onReset={(event) => {
|
||||
// 重置数据
|
||||
}}
|
||||
onReset={() => {}}
|
||||
>
|
||||
<AtInput
|
||||
name="phoneNum"
|
||||
@@ -79,10 +48,7 @@ const Group = () => {
|
||||
placeholder="请输入"
|
||||
value={phoneNum}
|
||||
disabled={isButtonDisabled}
|
||||
onChange={(value) => {
|
||||
console.log("value", value);
|
||||
setphoneNum(value);
|
||||
}}
|
||||
onChange={(value) => setphoneNum(value)}
|
||||
/>
|
||||
<View className="formCode">
|
||||
<AtInput
|
||||
@@ -90,27 +56,22 @@ const Group = () => {
|
||||
title="验证码"
|
||||
type="number"
|
||||
placeholder="请输入4位数字"
|
||||
|
||||
value={vCode}
|
||||
onChange={(value) => {
|
||||
setvCode(value);
|
||||
}}
|
||||
onChange={(value) => setvCode(value)}
|
||||
/>
|
||||
<AtButton
|
||||
className="codeBtn"
|
||||
onClick={() => {
|
||||
if (!!phoneNum & !!validatePhoneNumber(phoneNum)) {
|
||||
// 提交手机数据
|
||||
if (phoneNum && PHONE_REGEX.test(phoneNum)) {
|
||||
setIsButtonDisabled(true);
|
||||
startTimer(); // 开始防抖计时
|
||||
startTimer();
|
||||
} else {
|
||||
Taro.atMessage({
|
||||
message: "请检查手机号",
|
||||
type: `warning`,
|
||||
type: "warning",
|
||||
});
|
||||
}
|
||||
}}
|
||||
// type="primary"
|
||||
disabled={isButtonDisabled}
|
||||
>
|
||||
{isButtonDisabled ? `${waitTime} 秒` : "获取"}
|
||||
@@ -118,7 +79,7 @@ const Group = () => {
|
||||
</View>
|
||||
|
||||
<AtButton formType="submit" type="primary">
|
||||
{"提交"}
|
||||
提交
|
||||
</AtButton>
|
||||
</AtForm>
|
||||
|
||||
|
||||
@@ -1,40 +1,16 @@
|
||||
// @ts-nocheck
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } from "@tarojs/components";
|
||||
import { View } from "@tarojs/components";
|
||||
import { AtModal, AtModalContent } from "taro-ui";
|
||||
import React from "react";
|
||||
import "./index.scss";
|
||||
import { AtButton, AtInput, 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 Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtTag } from "taro-ui";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import { AtForm, AtMessage } from "taro-ui";
|
||||
import { AtModal, AtModalHeader, AtModalContent, AtModalAction } from "taro-ui";
|
||||
|
||||
// export default class Index extends Component {
|
||||
const IndexDetail = () => {
|
||||
useEffect(() => {}, []);
|
||||
|
||||
const handleClick = (value) => {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
};
|
||||
|
||||
const cusomContent = () => {
|
||||
return <View className="cusomContent">111</View>;
|
||||
};
|
||||
return (
|
||||
<View className="IndexDetail">
|
||||
<AtModal isOpened={false}>
|
||||
{/* <AtModalHeader>标题</AtModalHeader> */}
|
||||
<AtModalContent>{cusomContent()}</AtModalContent>
|
||||
{/* <AtModalAction> <Button>取消</Button> <Button>确定</Button> </AtModalAction> */}
|
||||
<AtModalContent>
|
||||
<View className="cusomContent">111</View>
|
||||
</AtModalContent>
|
||||
</AtModal>
|
||||
</View>
|
||||
);
|
||||
|
||||
@@ -1,30 +1,13 @@
|
||||
import { Component } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { View, Text, Image, Button, Video } 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 { View, Image, Video } from "@tarojs/components";
|
||||
import { AtButton, AtModal, AtModalContent } from "taro-ui";
|
||||
import React, { useEffect, useState, useMemo } from "react";
|
||||
import { LazyLoadImage } from "react-lazy-load-image-component";
|
||||
import "react-lazy-load-image-component/src/effects/blur.css";
|
||||
import "animate.css";
|
||||
import _ from "lodash";
|
||||
|
||||
import "./index.scss";
|
||||
import IndexDetail from "./componments/IndexDetail/index";
|
||||
|
||||
import beijing from "../../images/beijing.jpg";
|
||||
import shanghai from "../../images/shanghai.jpg";
|
||||
@@ -34,7 +17,6 @@ import wuhan from "../../images/wuhan.jpg";
|
||||
import hangzhou from "../../images/hangzhou.jpg";
|
||||
import dali from "../../images/dali.jpg";
|
||||
import chongqing from "../../images/chongqing.jpg";
|
||||
|
||||
import changsha from "../../images/changsha.jpg";
|
||||
import jingzhou from "../../images/jingzhou.jpg";
|
||||
import chengdu from "../../images/chengdu.jpg";
|
||||
@@ -46,19 +28,10 @@ import zhengzhou from "../../images/zhengzhou.jpg";
|
||||
import haikou from "../../images/haikou.jpg";
|
||||
import hegang from "../../images/hegang.jpg";
|
||||
|
||||
// 视频封面图
|
||||
import nomadPoster from "../../images/nomadPoster.jpg";
|
||||
// 公众号二维码
|
||||
import qrcodeoffice from "../../images/qrcodeoffice.jpg";
|
||||
import qrcode_planet from "../../images/qrcode_planet.jpg";
|
||||
|
||||
import yintian from "../../images/cloud/yintian.png";
|
||||
import taiyang from "../../images/cloud/taiyang.png";
|
||||
import xiayu from "../../images/cloud/xiayu.png";
|
||||
import wifi from "../../images/cloud/wifi.png";
|
||||
// import nomadcna from "../../images/cloud/nomadcna.jpg";
|
||||
import nomadcna from "../../images/cloud/nomadcna.png";
|
||||
import nomadcna192 from "../../images/cloud/nomadcna192.png";
|
||||
import meetupsalon from "../../images/meetupsalon.png";
|
||||
import wechat from "../../images/wechat.png";
|
||||
import nomad from "../../images/nomad.mp4";
|
||||
|
||||
import avatar from "../../images/Avatar/avatar.jpg";
|
||||
import cat from "../../images/Avatar/cat.jpg";
|
||||
@@ -70,237 +43,86 @@ import girlc from "../../images/Avatar/girlc.jpg";
|
||||
import boya from "../../images/Avatar/boya.jpg";
|
||||
import boyb from "../../images/Avatar/boyb.jpg";
|
||||
|
||||
import nomadBook from "../../images/nomadBook.jpg";
|
||||
import qrsalon from "../../images/qrsalon.png";
|
||||
import meetupsalon from "../../images/meetupsalon.png";
|
||||
import wechat from "../../images/wechat.png";
|
||||
const AVATAR_LIST = [
|
||||
{ image: girla, key: "girla" },
|
||||
{ image: avatar, key: "avatar" },
|
||||
{ image: girlb, key: "girlb" },
|
||||
{ image: cat, key: "cat" },
|
||||
{ image: girl, key: "girl" },
|
||||
{ image: boya, key: "boya" },
|
||||
{ image: touxiang, key: "touxiang" },
|
||||
{ image: girlc, key: "girlc" },
|
||||
{ image: boyb, key: "boyb" },
|
||||
];
|
||||
|
||||
import wechatGroup from "../../images/wechatGroup.jpg";
|
||||
import nomad from "../../images/nomad.mp4";
|
||||
const CITY_LIST = [
|
||||
{ cityName: "大理", img: dali },
|
||||
{ cityName: "鹤岗", img: hegang },
|
||||
{ cityName: "北京", img: beijing },
|
||||
{ cityName: "上海", img: shanghai },
|
||||
{ cityName: "深圳", img: shenzhen },
|
||||
{ cityName: "广州", img: guangzhou },
|
||||
{ cityName: "武汉", img: wuhan },
|
||||
{ cityName: "杭州", img: hangzhou },
|
||||
{ cityName: "成都", img: chengdu },
|
||||
{ cityName: "南京", img: nanjing },
|
||||
{ cityName: "西安", img: xian },
|
||||
{ cityName: "重庆", img: chongqing },
|
||||
{ cityName: "长沙", img: changsha },
|
||||
{ cityName: "昆明", img: kunming },
|
||||
{ cityName: "福州", img: fuzhou },
|
||||
{ cityName: "郑州", img: zhengzhou },
|
||||
{ cityName: "海口", img: haikou },
|
||||
{ cityName: "荆州", img: jingzhou },
|
||||
];
|
||||
|
||||
import IndexDetail from "./componments/IndexDetail/index";
|
||||
const MEETUP_AVATAR_LIST = AVATAR_LIST.slice(0, 7);
|
||||
|
||||
import { LazyLoadImage } from "react-lazy-load-image-component";
|
||||
import "react-lazy-load-image-component/src/effects/blur.css";
|
||||
// import Nav from './componments/Nav/index'
|
||||
// import Nav from '@/pages/componments/Nav/index'
|
||||
const isWeChatBrowser = () => {
|
||||
return navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1;
|
||||
};
|
||||
|
||||
const isMobileDevice = () => {
|
||||
const ua = navigator.userAgent || navigator.vendor || window.opera;
|
||||
return /android/i.test(ua) || (/iPad|iPhone|iPod/.test(ua) && !window.MSStream);
|
||||
};
|
||||
|
||||
// export default class Index extends Component {
|
||||
const Index = () => {
|
||||
const [current, setcurrent] = useState(0);
|
||||
const [qrOpen, setqrOpen] = useState(false);
|
||||
const [isWeChat, setisWeChat] = useState(false);
|
||||
|
||||
// 是否在微信客户端
|
||||
const isWeChatFun = () => {
|
||||
var ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf("micromessenger") != -1) {
|
||||
setisWeChat(true);
|
||||
return true;
|
||||
} else {
|
||||
setisWeChat(false);
|
||||
return false;
|
||||
}
|
||||
};
|
||||
const [mobile, setMobile] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
isWeChatFun();
|
||||
}, []);
|
||||
// 自定义组件模版
|
||||
const custDom = () => {
|
||||
return <View className="custDom">custDom</View>;
|
||||
};
|
||||
|
||||
// 微信群
|
||||
const weGroup = () => {
|
||||
return (
|
||||
<View className="weGroup">
|
||||
{/* <Image
|
||||
style="width: 100%;height: 100%;"
|
||||
// mode="heightFix"
|
||||
src={wechatGroup}
|
||||
/> */}
|
||||
<LazyLoadImage
|
||||
alt="Sample"
|
||||
src={wechatGroup}
|
||||
effect="blur"
|
||||
width="100%"
|
||||
height="100%"
|
||||
style={{ borderRadius: "15px" }} // 设置圆角
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
// 微信读书
|
||||
const weBook = () => {
|
||||
return (
|
||||
<View className="weBook">
|
||||
{/* <Image
|
||||
style="width: 100%;height: 100%;"
|
||||
// mode="heightFix"
|
||||
src={nomadBook}
|
||||
/> */}
|
||||
<LazyLoadImage
|
||||
alt="Sample"
|
||||
src={nomadBook}
|
||||
effect="blur"
|
||||
width="100%"
|
||||
height="100%"
|
||||
style={{ borderRadius: "15px" }} // 设置圆角
|
||||
/>
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
// 定义初始数据数组
|
||||
const [cityList, setCityList] = useState([
|
||||
{ cityName: "大理", img: dali, type: "item", dom: "" },
|
||||
{ cityName: "鹤岗", img: hegang, type: "item", dom: "" },
|
||||
{ cityName: "北京", img: beijing, type: "item", dom: "" },
|
||||
{ cityName: "上海", img: shanghai, type: "item", dom: "" },
|
||||
// {
|
||||
// cityName: "custDom",
|
||||
// img: shenzhen,
|
||||
// type: "custom",
|
||||
// dom: weGroup(),
|
||||
// },
|
||||
|
||||
{ cityName: "深圳", img: shenzhen, type: "item", dom: "" },
|
||||
|
||||
{ cityName: "广州", img: guangzhou, type: "item", dom: "" },
|
||||
{ cityName: "武汉", img: wuhan, type: "item", dom: "" },
|
||||
{ cityName: "杭州", img: hangzhou, type: "item", dom: "" },
|
||||
// {
|
||||
// cityName: "custDom",
|
||||
// img: shenzhen,
|
||||
// type: "custom",
|
||||
// dom: weBook(),
|
||||
// },
|
||||
{ cityName: "成都", img: chengdu, type: "item", dom: "" },
|
||||
{ cityName: "南京", img: nanjing, type: "item", dom: "" },
|
||||
{ cityName: "西安", img: xian, type: "item", dom: "" },
|
||||
|
||||
{ cityName: "重庆", img: chongqing, type: "item", dom: "" },
|
||||
{ cityName: "长沙", img: changsha, type: "item", dom: "" },
|
||||
|
||||
{ cityName: "昆明", img: kunming, type: "item", dom: "" },
|
||||
{ cityName: "福州", img: fuzhou, type: "item", dom: "" },
|
||||
{ cityName: "郑州", img: zhengzhou, type: "item", dom: "" },
|
||||
{ cityName: "海口", img: haikou, type: "item", dom: "" },
|
||||
|
||||
{ cityName: "荆州", img: jingzhou, type: "item", dom: "" },
|
||||
]);
|
||||
const isMobile = () => {
|
||||
const userAgent = navigator.userAgent || navigator.vendor || window.opera;
|
||||
|
||||
// 检查常见移动设备的 userAgent
|
||||
if (/android/i.test(userAgent)) {
|
||||
return true;
|
||||
}
|
||||
if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
|
||||
return true;
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
const [oldcityList, setoldCityList] = useState(cityList);
|
||||
const [mobile, setMobile] = useState(false); //是否移动端
|
||||
useEffect(() => {
|
||||
setMobile(isMobile());
|
||||
setisWeChat(isWeChatBrowser());
|
||||
setMobile(isMobileDevice());
|
||||
}, []);
|
||||
|
||||
// 定义屏幕宽度
|
||||
const [windowWidth, setWindowWidth] = useState(window.innerWidth);
|
||||
// 监听屏幕宽度变化
|
||||
useEffect(() => {
|
||||
const handleResize = () => {
|
||||
setWindowWidth(window.innerWidth);
|
||||
};
|
||||
window.addEventListener("resize", handleResize);
|
||||
|
||||
// 清除监听器
|
||||
const handleJoinClick = useMemo(() => {
|
||||
return () => {
|
||||
window.removeEventListener("resize", handleResize);
|
||||
};
|
||||
}, []);
|
||||
|
||||
// 当屏幕宽度小于某个值时，改变 custDom 的位置
|
||||
useEffect(() => {
|
||||
if (windowWidth < 768) {
|
||||
// 比如，宽度小于768时，将 custDom 移到第一位
|
||||
// const newCityList = [...cityList];
|
||||
const newCityList = _.cloneDeep(cityList);
|
||||
|
||||
const custDomIndex = newCityList.findIndex(
|
||||
(item) => item.cityName === "custDom",
|
||||
);
|
||||
|
||||
if (custDomIndex !== -1) {
|
||||
const [custDomItem] = newCityList.splice(custDomIndex, 1);
|
||||
newCityList.unshift(custDomItem); // 将 custDomItem 移动到数组开头
|
||||
if (isWeChat) {
|
||||
Taro.navigateTo({ url: "/pages/salon/index" });
|
||||
} else {
|
||||
setqrOpen(true);
|
||||
}
|
||||
setCityList(newCityList);
|
||||
} else {
|
||||
// 屏幕宽度大于 768 时，恢复默认顺序
|
||||
setCityList(oldcityList);
|
||||
}
|
||||
}, [windowWidth]);
|
||||
|
||||
const closeModal = () => {
|
||||
setqrOpen(false); // 关闭模态框
|
||||
};
|
||||
};
|
||||
}, [isWeChat]);
|
||||
|
||||
return (
|
||||
<View className="Index">
|
||||
{/* <Nav></Nav> */}
|
||||
|
||||
{/* <View className="header">
|
||||
<View className="headerTag">
|
||||
{["首页","导航", "图书", "好物", "活动", "工具箱", "关于我们"].map(
|
||||
(item, index) => {
|
||||
return (
|
||||
<AtTag
|
||||
className="AtTag"
|
||||
name={item}
|
||||
type="primary"
|
||||
circle
|
||||
size="small"
|
||||
active={true}
|
||||
onClick={() => {}}
|
||||
>
|
||||
{item}
|
||||
</AtTag>
|
||||
);
|
||||
}
|
||||
)}
|
||||
</View>
|
||||
</View> */}
|
||||
|
||||
{/* {!mobile ? ( */}
|
||||
<View className="up">
|
||||
<View className="upText">
|
||||
<span className="title">📣成为数字游民,并旅居在任何地方</span>
|
||||
<br />
|
||||
{/* <span className="nomadcna">nomadcna.com</span> */}
|
||||
{/* ，代表着目前 */}
|
||||
中国各地远程生活和工作的数字游民，不局限于某一处
|
||||
<View className="AvatarView">
|
||||
{[
|
||||
{ image: girla },
|
||||
{ image: avatar },
|
||||
{ image: girlb },
|
||||
{ image: cat },
|
||||
{ image: girl },
|
||||
{ image: boya },
|
||||
{ image: touxiang },
|
||||
{ image: girlc },
|
||||
{ image: boyb },
|
||||
].map((item, index) => {
|
||||
return (
|
||||
<Image className="Avatar" mode="heightFix" src={item?.image} />
|
||||
);
|
||||
})}
|
||||
{AVATAR_LIST.map((item) => (
|
||||
<Image
|
||||
key={item.key}
|
||||
className="Avatar"
|
||||
mode="heightFix"
|
||||
src={item.image}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
🍹每年在 30 多个城市 参加聚会
|
||||
<br />
|
||||
@@ -311,24 +133,16 @@ const Index = () => {
|
||||
🌎追踪你的旅行，记录你去过的地方
|
||||
<br />
|
||||
💬加入社群，在旅途中找到你的归属
|
||||
{!!mobile ? (
|
||||
{mobile && (
|
||||
<View className="upjonNomad">
|
||||
<AtButton
|
||||
className="upjonNomadBtn"
|
||||
type="primary"
|
||||
size="small"
|
||||
onClick={() => {
|
||||
// setqrOpen(true);
|
||||
// 在手机/微信
|
||||
isWeChat
|
||||
? Taro.navigateTo({
|
||||
url: "/pages/salon/index",
|
||||
})
|
||||
: setqrOpen(true);
|
||||
}}
|
||||
onClick={handleJoinClick}
|
||||
>{`加入社群💬`}</AtButton>
|
||||
</View>
|
||||
) : null}
|
||||
)}
|
||||
</View>
|
||||
|
||||
<View className="nomadvideo">
|
||||
@@ -338,48 +152,26 @@ const Index = () => {
|
||||
src={nomad}
|
||||
poster={nomadPoster}
|
||||
initialTime={0}
|
||||
controls={true}
|
||||
controls
|
||||
autoplay={false}
|
||||
loop={false}
|
||||
muted={false}
|
||||
floatingMode={"page"}
|
||||
objectFit={"contain"}
|
||||
floatingMode="page"
|
||||
objectFit="contain"
|
||||
/>
|
||||
<View className="jonNomad">
|
||||
<AtButton
|
||||
className="jonNomadBtn"
|
||||
type="primary"
|
||||
size="small"
|
||||
onClick={() => {
|
||||
// 如果在PC浏览器
|
||||
setqrOpen(true);
|
||||
// 在手机/微信
|
||||
// Taro.navigateTo({
|
||||
// url: "/pages/salon/index",
|
||||
// });
|
||||
}}
|
||||
onClick={() => setqrOpen(true)}
|
||||
>{`加入社群💬`}</AtButton>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
{/* ) : null} */}
|
||||
|
||||
{/* <View className="items"> */}
|
||||
{/* <View className="itemsLeft"> */}
|
||||
<View className="items">
|
||||
{/* 右侧固定内容，放前面 */}
|
||||
|
||||
<View
|
||||
className="rightItem"
|
||||
onClick={() => {
|
||||
// 在手机/微信
|
||||
isWeChat
|
||||
? Taro.navigateTo({
|
||||
url: "/pages/salon/index",
|
||||
})
|
||||
: setqrOpen(true);
|
||||
}}
|
||||
>
|
||||
<View className="rightItem" onClick={handleJoinClick}>
|
||||
<View className="rightItemcontent">
|
||||
<View className="rightItemtitle">加入聊天</View>
|
||||
<View className="chat">
|
||||
@@ -392,131 +184,78 @@ const Index = () => {
|
||||
<View className="rightItemcontent">
|
||||
<View className="rightItemtitle">新成员</View>
|
||||
<View className="AvatarView">
|
||||
{[
|
||||
{ image: girla },
|
||||
{ image: avatar },
|
||||
{ image: girlb },
|
||||
{ image: cat },
|
||||
{ image: girl },
|
||||
{ image: boya },
|
||||
{ image: touxiang },
|
||||
{ image: girlc },
|
||||
{ image: boyb },
|
||||
].map((item, index) => {
|
||||
return (
|
||||
<Image
|
||||
className="Avatar"
|
||||
mode="heightFix"
|
||||
src={item?.image}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
{AVATAR_LIST.map((item) => (
|
||||
<Image
|
||||
key={item.key}
|
||||
className="Avatar"
|
||||
mode="heightFix"
|
||||
src={item.image}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
|
||||
<View
|
||||
className="rightItem"
|
||||
onClick={() => {
|
||||
// 在手机/微信
|
||||
isWeChat
|
||||
? Taro.navigateTo({
|
||||
url: "/pages/salon/index",
|
||||
})
|
||||
: setqrOpen(true);
|
||||
}}
|
||||
>
|
||||
<View className="rightItem" onClick={handleJoinClick}>
|
||||
<View className="rightItemcontent">
|
||||
<View className="rightItemtitle">最新活动</View>
|
||||
<View className="meetup">
|
||||
<View className="meetupDate">活动时间: 2026年3月1日</View>
|
||||
<View className="meetupGps">活动地点: 深圳市</View>{" "}
|
||||
<View className="meetupNum">活动人数: 8人</View>{" "}
|
||||
{/* <View className="meetupDate">活动时间: 2026年3月1日</View> */}
|
||||
<View className="meetupGps">活动地点: 深圳市</View>
|
||||
<View className="meetupNum">活动人数: 8人</View>
|
||||
<View className="meetupAvatarView">
|
||||
{[
|
||||
{ image: girla },
|
||||
{ image: avatar },
|
||||
{ image: girlb },
|
||||
{ image: cat },
|
||||
{ image: girl },
|
||||
{ image: boya },
|
||||
{ image: touxiang },
|
||||
].map((item, index) => {
|
||||
return (
|
||||
<Image
|
||||
className="Avatar"
|
||||
mode="heightFix"
|
||||
src={item?.image}
|
||||
/>
|
||||
);
|
||||
})}
|
||||
{MEETUP_AVATAR_LIST.map((item) => (
|
||||
<Image
|
||||
key={item.key}
|
||||
className="Avatar"
|
||||
mode="heightFix"
|
||||
src={item.image}
|
||||
/>
|
||||
))}
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
</View>
|
||||
{/* <View className="rightItem">22</View> */}
|
||||
{/* <View className="rightItem">33</View> */}
|
||||
|
||||
{/* 数组尽量是4的倍数 */}
|
||||
{/* 随着屏幕变化,改变自定义数组的索引/顺序 */}
|
||||
{cityList.map((item, index) => {
|
||||
if (item.type === "custom") {
|
||||
// 根据屏幕变化,添加自定义组件
|
||||
// return <View className="item"> {item.dom}</View>;
|
||||
} else {
|
||||
return (
|
||||
<View className="item">
|
||||
<View className="itemUp">
|
||||
{/* 序列号 */}
|
||||
<View className="itemUpleft">
|
||||
<View>{index + 1}</View>
|
||||
</View>
|
||||
</View>
|
||||
{/* 城市名 */}
|
||||
<View className="itemiddle"> {item.cityName}</View>
|
||||
<View className="itemDown"></View>
|
||||
<LazyLoadImage
|
||||
alt="Sample"
|
||||
src={item.img}
|
||||
effect="blur"
|
||||
width="100%"
|
||||
height="100%"
|
||||
style={{ borderRadius: "15px" }} // 设置圆角
|
||||
/>
|
||||
{CITY_LIST.map((item, index) => (
|
||||
<View className="item" key={item.cityName}>
|
||||
<View className="itemUp">
|
||||
<View className="itemUpleft">
|
||||
<View>{index + 1}</View>
|
||||
</View>
|
||||
);
|
||||
}
|
||||
})}
|
||||
</View>
|
||||
<View className="itemiddle">{item.cityName}</View>
|
||||
<View className="itemDown" />
|
||||
<LazyLoadImage
|
||||
alt={item.cityName}
|
||||
src={item.img}
|
||||
effect="blur"
|
||||
width="100%"
|
||||
height="100%"
|
||||
style={{ borderRadius: "15px" }}
|
||||
/>
|
||||
</View>
|
||||
))}
|
||||
</View>
|
||||
{/* <View className="itemsRight"><View className="rightItem">11</View><View className="rightItem">22</View><View className="rightItem">33</View></View> */}
|
||||
{/* </View> */}
|
||||
|
||||
<AtModal
|
||||
isOpened={qrOpen}
|
||||
closeOnClickOverlay={true}
|
||||
onClose={closeModal}
|
||||
closeOnClickOverlay
|
||||
onClose={() => setqrOpen(false)}
|
||||
>
|
||||
{/* <AtModalHeader>标题</AtModalHeader> */}
|
||||
<AtModalContent>
|
||||
<View className="qrcode">
|
||||
{/* ,加入💬微信群 */}
|
||||
<View>立即报名</View>
|
||||
<Image
|
||||
style="width: 200px;height: 200px;"
|
||||
mode="heightFix"
|
||||
// src={qrcode_planet}
|
||||
// src={qrsalon}
|
||||
src={meetupsalon}
|
||||
/>
|
||||
</View>
|
||||
</AtModalContent>
|
||||
{/* <AtModalAction>
|
||||
<Button>取消</Button> <Button>确定</Button>{" "}
|
||||
</AtModalAction> */}
|
||||
</AtModal>
|
||||
|
||||
<IndexDetail></IndexDetail>
|
||||
{/* <View className="right">22</View> */}
|
||||
<IndexDetail />
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -360,12 +360,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.custDom {
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
background-color: red;
|
||||
color: aqua;
|
||||
}
|
||||
// custDom 已移除
|
||||
|
||||
.qrcode {
|
||||
font-size: 24px;
|
||||
|
||||
@@ -1,151 +1,73 @@
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } 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 { View, Image } from "@tarojs/components";
|
||||
import { AtButton, AtList, AtListItem } from "taro-ui";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtButton } from "taro-ui";
|
||||
// import Taro from "@tarojs/taro";
|
||||
import "./index.scss";
|
||||
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
|
||||
// export default class Index extends Component {
|
||||
const Detail = () => {
|
||||
const [current, setcurrent] = useState(2);
|
||||
const [id, setid] = useState(null);
|
||||
const [openid, setopenid] = useState(null);
|
||||
const [joinMeetup, setjoinMeetup] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
let newparams = Taro.getCurrentInstance().router.params;
|
||||
let newId = newparams.id;
|
||||
if (newId) {
|
||||
setid(newId);
|
||||
}
|
||||
let newjoinMeetup = window.localStorage.getItem('joinMeetup')
|
||||
setjoinMeetup(newjoinMeetup)
|
||||
}, []);
|
||||
const params = Taro.getCurrentInstance().router.params;
|
||||
console.log(params);
|
||||
|
||||
// const handleClick = (value) => {
|
||||
// console.log("value", value);
|
||||
// setcurrent(value);
|
||||
// if (value == 2) {
|
||||
// // 跳转到目的页面，在当前页面打开
|
||||
// Taro.navigateTo({
|
||||
// url: "/pages/my/index",
|
||||
// });
|
||||
// } else if (value == 0) {
|
||||
// Taro.navigateTo({
|
||||
// url: "/pages/index/index",
|
||||
// });
|
||||
// } else {
|
||||
// Taro.navigateTo({
|
||||
// url: "/pages/meetup/index",
|
||||
// });
|
||||
// }
|
||||
// };
|
||||
|
||||
const onBridgeReady = () => {
|
||||
WeixinJSBridge.call("hideOptionMenu");
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
let $instance = Taro.getCurrentInstance();
|
||||
// console.log("11");
|
||||
console.log($instance.router.params);
|
||||
// if (typeof WeixinJSBridge == "undefined") {
|
||||
// if (document.addEventListener) {
|
||||
// document.addEventListener("WeixinJSBridgeReady", onBridgeReady, false);
|
||||
// } else if (document.attachEvent) {
|
||||
// document.attachEvent("WeixinJSBridgeReady", onBridgeReady);
|
||||
// document.attachEvent("onWeixinJSBridgeReady", onBridgeReady);
|
||||
// }
|
||||
// }
|
||||
const saved = window.localStorage.getItem("joinMeetup");
|
||||
setjoinMeetup(saved);
|
||||
}, []);
|
||||
|
||||
const joinmeet = () => {
|
||||
// console.log("111");
|
||||
Taro.request({
|
||||
method: 'POST',
|
||||
url: "/api/payh5", //仅为示例，并非真实的接口地址
|
||||
// url: "https://pay.hackrobot.cn/api/payh5", //仅为示例，并非真实的接口地址
|
||||
|
||||
method: "POST",
|
||||
url: "/api/payh5",
|
||||
data: {
|
||||
callback_url: window.location.href,
|
||||
openid: window.localStorage.getItem('openid')
|
||||
openid: window.localStorage.getItem("openid"),
|
||||
},
|
||||
header: {
|
||||
"content-type": "application/json", // 默认值
|
||||
},
|
||||
success: function (res) {
|
||||
console.log(res.data);
|
||||
// window.alert(res.data.jsapi);
|
||||
header: { "content-type": "application/json" },
|
||||
success: (res) => {
|
||||
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") {
|
||||
setjoinMeetup(true)
|
||||
window.localStorage.setItem('joinMeetup', true)
|
||||
{ ...(res?.data?.jsapi ?? {}) },
|
||||
(payRes) => {
|
||||
if (payRes.err_msg === "get_brand_wcpay_request:ok") {
|
||||
setjoinMeetup(true);
|
||||
window.localStorage.setItem("joinMeetup", true);
|
||||
WeixinJSBridge.call("closeWindow");
|
||||
}
|
||||
}
|
||||
},
|
||||
);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
<View className="Detail">
|
||||
{/* <Text>Hello world!</Text> */}
|
||||
{/* <AtAvatar image='https://cdn.huodongxing.com/logo/202312/8732019012100/promoteMini.png'></AtAvatar> */}
|
||||
<View>
|
||||
<Image
|
||||
style="width:100%;height: 200px;background: #fff;"
|
||||
src={
|
||||
"https://7084298024874.huodongxing.com/file/ue/20211008/115427740E13BBD5BD7B56940467DC03B4/30435083489707317.jpeg"
|
||||
}
|
||||
src="https://7084298024874.huodongxing.com/file/ue/20211008/115427740E13BBD5BD7B56940467DC03B4/30435083489707317.jpeg"
|
||||
/>
|
||||
</View>
|
||||
<AtList>
|
||||
<AtListItem title="[副业交流] 沙龙茶话会" onClick={() => { }} />
|
||||
<AtListItem title="日期" extraText="2023/12/06" arrow="" />
|
||||
<AtListItem title="报名人数" extraText="4/10" arrow="" />
|
||||
<AtListItem title="[副业交流] 沙龙茶话会" />
|
||||
<AtListItem title="日期" extraText="2023/12/06" />
|
||||
<AtListItem title="报名人数" extraText="4/10" />
|
||||
<AtListItem
|
||||
title="地点"
|
||||
note="广东省深圳市福田区石厦地铁站C口"
|
||||
extraText=""
|
||||
/>
|
||||
{/* <AtListItem title='禁用状态' disabled extraText='详细信息' /> */}
|
||||
</AtList>
|
||||
|
||||
|
||||
|
||||
<View>
|
||||
<AtButton
|
||||
className="bottomBtn"
|
||||
type="primary"
|
||||
onClick={() => joinmeet()}
|
||||
onClick={joinmeet}
|
||||
disabled={joinMeetup}
|
||||
>
|
||||
{!!joinMeetup ? '已报名' : '立即报名'}
|
||||
{joinMeetup ? "已报名" : "立即报名"}
|
||||
</AtButton>
|
||||
</View>
|
||||
|
||||
|
||||
</View>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,101 +1,31 @@
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } 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 { View, Image } from "@tarojs/components";
|
||||
import { AtTabBar, AtCard, AtButton } from "taro-ui";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { AtButton } from "taro-ui";
|
||||
import "./index.scss";
|
||||
|
||||
import { Picker } from "@tarojs/components";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import { AtNavBar } from "taro-ui";
|
||||
|
||||
// export default class Index extends Component {
|
||||
const Meetup = () => {
|
||||
const [current, setcurrent] = useState(1);
|
||||
const [joinMeetup, setjoinMeetup] = useState(false);
|
||||
|
||||
const [pickData, setpickData] = useState({
|
||||
selector: ["美国", "中国", "巴西", "日本"],
|
||||
selectorChecked: "美国",
|
||||
timeSel: "12:01",
|
||||
dateSel: "2018-04-22",
|
||||
});
|
||||
const handleClick = (value) => {
|
||||
console.log("value", value);
|
||||
setcurrent(value);
|
||||
if (value == 2) {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/my/index",
|
||||
});
|
||||
} else if (value == 0) {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
if (value === 2) {
|
||||
Taro.navigateTo({ url: "/pages/my/index" });
|
||||
} else if (value === 0) {
|
||||
Taro.navigateTo({ url: "/pages/index/index" });
|
||||
} else {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/meetup/index",
|
||||
});
|
||||
Taro.navigateTo({ url: "/pages/meetup/index" });
|
||||
}
|
||||
};
|
||||
const goBack = () => {
|
||||
// window.history.back();
|
||||
Taro.navigateBack({
|
||||
// delta: 2
|
||||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
let newjoinMeetup = window.localStorage.getItem("joinMeetup");
|
||||
setjoinMeetup(newjoinMeetup);
|
||||
|
||||
// window.localStorage.removeItem("joinMeetup");
|
||||
// setjoinMeetup(false)
|
||||
const saved = window.localStorage.getItem("joinMeetup");
|
||||
setjoinMeetup(saved);
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<View className="my">
|
||||
{/* <AtNavBar
|
||||
// onClickRgIconSt={handleClick}
|
||||
// onClickRgIconNd={handleClick}
|
||||
// onClickLeftIcon={goBack}
|
||||
// leftIconType="chevron-left"
|
||||
color="#000"
|
||||
title="活动列表"
|
||||
// leftText='返回'
|
||||
// rightFirstIconType='bullet-list'
|
||||
// rightSecondIconType='user'
|
||||
/> */}
|
||||
{/* <Text>Hello world!</Text> */}
|
||||
|
||||
{/* <View className="page-section">
|
||||
<View>
|
||||
<Picker mode="selector" range={pickData.selector} onChange={() => {}}>
|
||||
<AtList>
|
||||
<AtListItem
|
||||
title="国家地区"
|
||||
extraText={pickData.selectorChecked}
|
||||
/>
|
||||
</AtList>
|
||||
</Picker>
|
||||
</View>
|
||||
<View>
|
||||
<Picker mode="selector" range={pickData.selector} onChange={() => {}}>
|
||||
<AtList>
|
||||
<AtListItem
|
||||
title="国家地区"
|
||||
extraText={pickData.selectorChecked}
|
||||
/>
|
||||
</AtList>
|
||||
</Picker>
|
||||
</View>
|
||||
</View> */}
|
||||
|
||||
<AtCard
|
||||
note=""
|
||||
extra=""
|
||||
@@ -103,14 +33,10 @@ const Meetup = () => {
|
||||
thumb="http://www.logoquan.com/upload/list/20180421/logoquan15259400209.PNG"
|
||||
>
|
||||
<View className="meetupCard">
|
||||
{" "}
|
||||
<View className="left">
|
||||
{" "}
|
||||
<Image
|
||||
style="width: 150px;height: 100px;background: #fff;"
|
||||
src={
|
||||
"https://7084298024874.huodongxing.com/file/ue/20211008/115427740E13BBD5BD7B56940467DC03B4/30435083489707317.jpeg"
|
||||
}
|
||||
src="https://7084298024874.huodongxing.com/file/ue/20211008/115427740E13BBD5BD7B56940467DC03B4/30435083489707317.jpeg"
|
||||
/>
|
||||
</View>
|
||||
<View className="right">
|
||||
@@ -125,12 +51,10 @@ const Meetup = () => {
|
||||
className="submitBtn"
|
||||
disabled={joinMeetup}
|
||||
onClick={() => {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/meetup/Detail/index",
|
||||
});
|
||||
Taro.navigateTo({ url: "/pages/meetup/Detail/index" });
|
||||
}}
|
||||
>
|
||||
{!!joinMeetup ? "已报名" : "立即报名"}
|
||||
{joinMeetup ? "已报名" : "立即报名"}
|
||||
</AtButton>
|
||||
</View>
|
||||
</View>
|
||||
@@ -144,7 +68,7 @@ const Meetup = () => {
|
||||
{ title: "活动" },
|
||||
{ title: "我的" },
|
||||
]}
|
||||
onClick={(value) => handleClick(value)}
|
||||
onClick={handleClick}
|
||||
current={current}
|
||||
/>
|
||||
</View>
|
||||
|
||||
@@ -1,30 +1,9 @@
|
||||
// @ts-nocheck
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } from "@tarojs/components";
|
||||
import { View } from "@tarojs/components";
|
||||
import React from "react";
|
||||
import "./index.scss";
|
||||
import { AtButton, AtInput, 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 Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtTag } from "taro-ui";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import { AtForm, AtMessage } from "taro-ui";
|
||||
|
||||
// export default class Index extends Component {
|
||||
const Model = () => {
|
||||
useEffect(() => {}, []);
|
||||
|
||||
const handleClick = (value) => {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
};
|
||||
|
||||
return <View className="Model">模版</View>;
|
||||
};
|
||||
|
||||
|
||||
@@ -1,58 +1,29 @@
|
||||
import { Component } from "react";
|
||||
import { View, Text, Image } 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 { View } from "@tarojs/components";
|
||||
import { AtTabBar, AtAvatar, AtTag, AtList, AtListItem } from "taro-ui";
|
||||
import React, { useEffect, useState } from "react";
|
||||
import Taro from "@tarojs/taro";
|
||||
import { AtAvatar } from "taro-ui";
|
||||
import { AtTag } from "taro-ui";
|
||||
import { AtList, AtListItem } from "taro-ui";
|
||||
import avatar from "../../images/avatar.jpg";
|
||||
import "./index.scss";
|
||||
|
||||
import avatar from "../../images/Avatar/avatar.jpg";
|
||||
|
||||
// export default class Index extends Component {
|
||||
const My = () => {
|
||||
const [current, setcurrent] = useState(2);
|
||||
const [wxid, setwxid] = useState(null);
|
||||
|
||||
useEffect(()=>{
|
||||
getWxid()
|
||||
},[])
|
||||
|
||||
const getWxid = () => {
|
||||
let newWxid = window.localStorage.getItem("wxid");
|
||||
if (!!newWxid) {
|
||||
setwxid(newWxid);
|
||||
}
|
||||
};
|
||||
|
||||
const handleClick = (value) => {
|
||||
console.log("value", value);
|
||||
setcurrent(value);
|
||||
if (value == 2) {
|
||||
// 跳转到目的页面，在当前页面打开
|
||||
Taro.navigateTo({
|
||||
url: "/pages/my/index",
|
||||
});
|
||||
} else if (value == 0) {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/index/index",
|
||||
});
|
||||
if (value === 2) {
|
||||
Taro.navigateTo({ url: "/pages/my/index" });
|
||||
} else if (value === 0) {
|
||||
Taro.navigateTo({ url: "/pages/index/index" });
|
||||
} else {
|
||||
Taro.navigateTo({
|
||||
url: "/pages/meetup/index",
|
||||
});
|
||||
Taro.navigateTo({ url: "/pages/meetup/index" });
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<View className="my">
|
||||
{/* <Text>Hello world!</Text> */}
|
||||
|
||||
<View className="myAtAvatar">
|
||||
<AtAvatar className="AtAvatar" image={avatar}></AtAvatar>
|
||||
<AtAvatar className="AtAvatar" image={avatar} />
|
||||
<AtTag type="primary" circle>
|
||||
新注册用户
|
||||
</AtTag>
|
||||
@@ -61,14 +32,11 @@ const My = () => {
|
||||
<AtList>
|
||||
<AtListItem
|
||||
title="联系我们"
|
||||
note=""
|
||||
arrow="right"
|
||||
iconInfo={{ size: 25, color: "#78A4FA", value: "calendar" }}
|
||||
/>
|
||||
<AtListItem
|
||||
title="版本日志"
|
||||
note=""
|
||||
extraText=""
|
||||
arrow="right"
|
||||
iconInfo={{ size: 25, color: "#FF4949", value: "bookmark" }}
|
||||
/>
|
||||
@@ -81,7 +49,7 @@ const My = () => {
|
||||
{ title: "活动" },
|
||||
{ title: "我的" },
|
||||
]}
|
||||
onClick={(value) => handleClick(value)}
|
||||
onClick={handleClick}
|
||||
current={current}
|
||||
/>
|
||||
</View>
|
||||
|
||||
@@ -22,14 +22,63 @@ const PAY_API_URL = "https://api.hackrobot.cn/payh5";
|
||||
const SUBMIT_APPLICATION_URL =
|
||||
"https://api.hackrobot.cn/submit_meetup_application";
|
||||
|
||||
const GENDER_OPTIONS = ["男", "女"];
|
||||
const EDUCATION_OPTIONS = ["高中及以下", "大专", "本科", "硕士"];
|
||||
|
||||
const GRAD_AGE_MAP = {
|
||||
"高中及以下": 18,
|
||||
"大专": 21,
|
||||
"本科": 22,
|
||||
"硕士": 25,
|
||||
};
|
||||
|
||||
const PHONE_REGEX = /^1[3-9]\d{9}$/;
|
||||
|
||||
const currentYear = new Date().getFullYear();
|
||||
const YEAR_OPTIONS = Array.from({ length: 61 }, (_, i) =>
|
||||
(currentYear - i).toString(),
|
||||
);
|
||||
|
||||
const isWeChatBrowser = () => {
|
||||
return navigator.userAgent.toLowerCase().indexOf("micromessenger") !== -1;
|
||||
};
|
||||
|
||||
const getOrCreateUserId = () => {
|
||||
let userId = Taro.getStorageSync("userId");
|
||||
if (!userId) {
|
||||
userId = `user${Date.now()}`;
|
||||
Taro.setStorageSync("userId", userId);
|
||||
}
|
||||
return userId;
|
||||
};
|
||||
|
||||
const checkIfFullyPaid = (userId) => {
|
||||
return new Promise((resolve) => {
|
||||
Taro.request({
|
||||
url: `${PB_URL}/api/collections/${COLLECTION}/records`,
|
||||
method: "GET",
|
||||
data: {
|
||||
filter: `(user_id="${userId}" && amount > 0 && type="meetup")`,
|
||||
perPage: 1,
|
||||
},
|
||||
success: (res) => resolve(res.data?.items?.length > 0),
|
||||
fail: () => resolve(false),
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const Salon = () => {
|
||||
const [meetupQR, setmeetupQR] = useState(false);
|
||||
const [isWeChat, setisWeChat] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
const init = async () => {
|
||||
isWeChatFun();
|
||||
checkIfJoined();
|
||||
setisWeChat(isWeChatBrowser());
|
||||
|
||||
if (Taro.getStorageSync("salonJoined")) {
|
||||
setmeetupQR(true);
|
||||
return;
|
||||
}
|
||||
|
||||
const userId = getOrCreateUserId();
|
||||
const fullyPaid = await checkIfFullyPaid(userId);
|
||||
@@ -42,90 +91,6 @@ const Salon = () => {
|
||||
init();
|
||||
}, []);
|
||||
|
||||
const checkIfJoined = () => {
|
||||
if (Taro.getStorageSync("salonJoined")) {
|
||||
setmeetupQR(true);
|
||||
}
|
||||
};
|
||||
|
||||
const isWeChatFun = () => {
|
||||
const ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.indexOf("micromessenger") !== -1) {
|
||||
setisWeChat(true);
|
||||
return true;
|
||||
} else {
|
||||
setisWeChat(false);
|
||||
return false;
|
||||
}
|
||||
};
|
||||
|
||||
const getOrCreateUserId = () => {
|
||||
let userId = Taro.getStorageSync("userId");
|
||||
if (!userId) {
|
||||
userId = `user${Date.now()}`;
|
||||
Taro.setStorageSync("userId", userId);
|
||||
}
|
||||
return userId;
|
||||
};
|
||||
|
||||
const checkIfFullyPaid = (userId) => {
|
||||
return new Promise((resolve) => {
|
||||
Taro.request({
|
||||
url: `${PB_URL}/api/collections/${COLLECTION}/records`,
|
||||
method: "GET",
|
||||
data: {
|
||||
filter: `(user_id="${userId}" && amount > 0 && type="meetup")`,
|
||||
perPage: 1,
|
||||
},
|
||||
success: (res) => {
|
||||
resolve(res.data?.items?.length > 0);
|
||||
},
|
||||
fail: () => resolve(false),
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const payh5 = (type, total_fee = 8800) => {
|
||||
const userId = getOrCreateUserId();
|
||||
Taro.request({
|
||||
url: PAY_API_URL,
|
||||
method: "POST",
|
||||
data: {
|
||||
total_fee,
|
||||
type,
|
||||
user_id: userId,
|
||||
},
|
||||
header: {
|
||||
"content-type": "application/json",
|
||||
},
|
||||
success: (res) => {
|
||||
if (res.data?.status === "ok" && res.data?.xorpay_params) {
|
||||
const params = res.data.xorpay_params;
|
||||
const form = document.createElement("form");
|
||||
form.method = "POST";
|
||||
form.action = res.data.xorpay_url;
|
||||
form.style.display = "none";
|
||||
|
||||
for (const key in params) {
|
||||
const input = document.createElement("input");
|
||||
input.type = "hidden";
|
||||
input.name = key;
|
||||
input.value = params[key];
|
||||
form.appendChild(input);
|
||||
}
|
||||
|
||||
document.body.appendChild(form);
|
||||
form.submit();
|
||||
} else {
|
||||
Taro.showToast({ title: "支付发起失败", icon: "none" });
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
Taro.showToast({ title: "网络错误", icon: "none" });
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const [form, setForm] = useState({
|
||||
nickname: "",
|
||||
occupation: "",
|
||||
@@ -137,17 +102,8 @@ const Salon = () => {
|
||||
phone: "",
|
||||
});
|
||||
|
||||
const genderOptions = ["男", "女"];
|
||||
const [genderIndex, setGenderIndex] = useState(null);
|
||||
|
||||
const educationOptions = ["高中及以下", "大专", "本科", "硕士"];
|
||||
const [educationIndex, setEducationIndex] = useState(null);
|
||||
|
||||
const currentYear = new Date().getFullYear();
|
||||
const yearOptions = [];
|
||||
for (let i = 0; i <= 60; i++) {
|
||||
yearOptions.push((currentYear - i).toString());
|
||||
}
|
||||
const [gradYearIndex, setGradYearIndex] = useState(null);
|
||||
|
||||
const updateField = (field) => (value) => {
|
||||
@@ -157,22 +113,57 @@ const Salon = () => {
|
||||
const handleGenderChange = (e) => {
|
||||
const idx = e.detail.value;
|
||||
setGenderIndex(idx);
|
||||
updateField("gender")(genderOptions[idx]);
|
||||
updateField("gender")(GENDER_OPTIONS[idx]);
|
||||
};
|
||||
|
||||
const handleEducationChange = (e) => {
|
||||
const idx = e.detail.value;
|
||||
setEducationIndex(idx);
|
||||
updateField("education")(educationOptions[idx]);
|
||||
updateField("education")(EDUCATION_OPTIONS[idx]);
|
||||
};
|
||||
|
||||
const handleGradYearChange = (e) => {
|
||||
const idx = e.detail.value;
|
||||
setGradYearIndex(idx);
|
||||
updateField("gradYear")(yearOptions[idx]);
|
||||
updateField("gradYear")(YEAR_OPTIONS[idx]);
|
||||
};
|
||||
|
||||
const submitApplicationFirst = (submitData) => {
|
||||
const payh5 = (type, total_fee = 8800) => {
|
||||
const userId = getOrCreateUserId();
|
||||
Taro.request({
|
||||
url: PAY_API_URL,
|
||||
method: "POST",
|
||||
data: { total_fee, type, user_id: userId },
|
||||
header: { "content-type": "application/json" },
|
||||
success: (res) => {
|
||||
if (res.data?.status === "ok" && res.data?.xorpay_params) {
|
||||
const params = res.data.xorpay_params;
|
||||
const formEl = document.createElement("form");
|
||||
formEl.method = "POST";
|
||||
formEl.action = res.data.xorpay_url;
|
||||
formEl.style.display = "none";
|
||||
|
||||
for (const key in params) {
|
||||
const input = document.createElement("input");
|
||||
input.type = "hidden";
|
||||
input.name = key;
|
||||
input.value = params[key];
|
||||
formEl.appendChild(input);
|
||||
}
|
||||
|
||||
document.body.appendChild(formEl);
|
||||
formEl.submit();
|
||||
} else {
|
||||
Taro.showToast({ title: "支付发起失败", icon: "none" });
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
Taro.showToast({ title: "网络错误", icon: "none" });
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const submitApplication = (submitData) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
Taro.request({
|
||||
url: SUBMIT_APPLICATION_URL,
|
||||
@@ -196,16 +187,20 @@ const Salon = () => {
|
||||
};
|
||||
|
||||
const handleSubmit = async () => {
|
||||
let missing = [];
|
||||
const requiredFields = [
|
||||
["nickname", "昵称"],
|
||||
["occupation", "职业/专业"],
|
||||
["reason", "自我介绍"],
|
||||
["wechatId", "微信号"],
|
||||
["gender", "性别"],
|
||||
["education", "学历"],
|
||||
["gradYear", "毕业时间"],
|
||||
["phone", "手机号"],
|
||||
];
|
||||
|
||||
if (!form.nickname) missing.push("昵称");
|
||||
if (!form.occupation) missing.push("职业/专业");
|
||||
if (!form.reason) missing.push("自我介绍");
|
||||
if (!form.wechatId) missing.push("微信号");
|
||||
if (!form.gender) missing.push("性别");
|
||||
if (!form.education) missing.push("学历");
|
||||
if (!form.gradYear) missing.push("毕业时间");
|
||||
if (!form.phone) missing.push("手机号"); // 手机号必填
|
||||
const missing = requiredFields
|
||||
.filter(([key]) => !form[key])
|
||||
.map(([, label]) => label);
|
||||
|
||||
if (missing.length > 0) {
|
||||
Taro.atMessage({
|
||||
@@ -215,8 +210,7 @@ const Salon = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
// 手机号正则校验（必填，必须11位有效手机号）
|
||||
if (!/^1[3-9]\d{9}$/.test(form.phone)) {
|
||||
if (!PHONE_REGEX.test(form.phone)) {
|
||||
Taro.atMessage({
|
||||
message: "手机号格式错误，请填写11位有效手机号",
|
||||
type: "warning",
|
||||
@@ -224,42 +218,23 @@ const Salon = () => {
|
||||
return;
|
||||
}
|
||||
|
||||
const gradAgeMap = {
|
||||
高中及以下: 18,
|
||||
大专: 21,
|
||||
本科: 22,
|
||||
硕士: 25,
|
||||
};
|
||||
const baseAge = gradAgeMap[form.education] || 22;
|
||||
const baseAge = GRAD_AGE_MAP[form.education] || 22;
|
||||
const gradYearNum = parseInt(form.gradYear, 10);
|
||||
|
||||
if (isNaN(gradYearNum)) {
|
||||
Taro.atMessage({
|
||||
message: "毕业年份格式错误",
|
||||
type: "warning",
|
||||
});
|
||||
Taro.atMessage({ message: "毕业年份格式错误", type: "warning" });
|
||||
return;
|
||||
}
|
||||
|
||||
const calculatedAge = currentYear - gradYearNum + baseAge;
|
||||
|
||||
const userId = getOrCreateUserId();
|
||||
|
||||
const submitData = {
|
||||
...form,
|
||||
calculated_age: calculatedAge,
|
||||
user_id: userId,
|
||||
};
|
||||
|
||||
try {
|
||||
await submitApplicationFirst(submitData);
|
||||
|
||||
// Taro.showToast({
|
||||
// title: "申请已提交，正在跳转支付（88元场地管理费）",
|
||||
// icon: "loading",
|
||||
// duration: 3000,
|
||||
// });
|
||||
|
||||
await submitApplication({
|
||||
...form,
|
||||
calculated_age: calculatedAge,
|
||||
user_id: userId,
|
||||
});
|
||||
payh5("meetup", 28800);
|
||||
} catch {
|
||||
// 提交失败已提示
|
||||
@@ -371,7 +346,7 @@ const Salon = () => {
|
||||
|
||||
<Picker
|
||||
mode="selector"
|
||||
range={genderOptions}
|
||||
range={GENDER_OPTIONS}
|
||||
value={genderIndex ?? 0}
|
||||
onChange={handleGenderChange}
|
||||
>
|
||||
@@ -424,7 +399,7 @@ const Salon = () => {
|
||||
|
||||
<Picker
|
||||
mode="selector"
|
||||
range={educationOptions}
|
||||
range={EDUCATION_OPTIONS}
|
||||
value={educationIndex ?? 0}
|
||||
onChange={handleEducationChange}
|
||||
>
|
||||
@@ -439,7 +414,7 @@ const Salon = () => {
|
||||
|
||||
<Picker
|
||||
mode="selector"
|
||||
range={yearOptions}
|
||||
range={YEAR_OPTIONS}
|
||||
value={gradYearIndex ?? 0}
|
||||
onChange={handleGradYearChange}
|
||||
>
|
||||
|
||||
Reference in New Issue
Block a user