diff --git a/config/index.js b/config/index.js index 677a22a..b46ec21 100644 --- a/config/index.js +++ b/config/index.js @@ -96,7 +96,9 @@ const config = { // '/pages/detail/index': ['/detail'], // 可以通过数组为页面配置多个自定义路由 "pages/my/index": "/my", "pages/meetup/index": "/meetup", + "pages/salon/index": "/salon", "pages/meetup/Detail/index": "/detail", + }, }, // defineConstants: { diff --git a/src/pages/index/index.jsx b/src/pages/index/index.jsx index 40d740a..1c48fd5 100644 --- a/src/pages/index/index.jsx +++ b/src/pages/index/index.jsx @@ -306,7 +306,15 @@ const Index = () => { type="primary" size="small" onClick={() => { - setqrOpen(true); + // setqrOpen(true); + // 在手机/微信 + Taro.navigateTo({ + url: "/pages/salon/index", + // url: "/pages/meetup/index", + // url: "pages/meetup/Detail/index", + // url: "/pages/my/index", + + }); }} >{`加入社群💬`} @@ -333,7 +341,12 @@ const Index = () => { type="primary" size="small" onClick={() => { - setqrOpen(true); + // 如果在PC浏览器 + // setqrOpen(true); + // 在手机/微信 + Taro.navigateTo({ + url: "/pages/salon/index", + }); }} >{`加入社群💬`} @@ -410,7 +423,7 @@ const Index = () => { {/* 标题 */} - {/* ,加入💬微信群 */} + {/* ,加入💬微信群 */} 扫码关注公众号 { if (newId) { setid(newId); } - let newjoinMeetup=window.localStorage.getItem('joinMeetup') + let newjoinMeetup = window.localStorage.getItem('joinMeetup') setjoinMeetup(newjoinMeetup) }, []); @@ -71,13 +71,13 @@ const Detail = () => { const joinmeet = () => { // console.log("111"); Taro.request({ - method:'POST', + method: 'POST', url: "/api/payh5", //仅为示例，并非真实的接口地址 // url: "https://pay.hackrobot.cn/api/payh5", //仅为示例，并非真实的接口地址 data: { - callback_url:window.location.href, - openid:window.localStorage.getItem('openid') + callback_url: window.location.href, + openid: window.localStorage.getItem('openid') }, header: { "content-type": "application/json", // 默认值 @@ -95,12 +95,12 @@ const Detail = () => { // package: "prepay_id=wx01113404850024729b35f4d69b73500000", // signType: "MD5", // paySign: "2A823C8D47CCF871C6C65A56DC228CF8", - ...res?.data?.jsapi??{}, + ...res?.data?.jsapi ?? {}, }, function (res) { if (res.err_msg == "get_brand_wcpay_request:ok") { setjoinMeetup(true) - window.localStorage.setItem('joinMeetup',true) + window.localStorage.setItem('joinMeetup', true) WeixinJSBridge.call("closeWindow"); } } @@ -121,7 +121,7 @@ const Detail = () => { /> - {}} /> + { }} /> { {/* */} - {/* - - - */} + { onClick={() => joinmeet()} disabled={joinMeetup} > - {!!joinMeetup?'已报名':'立即报名'} + {!!joinMeetup ? '已报名' : '立即报名'} - {/* - handleClick(value)} - current={current} - /> - */} + ); }; diff --git a/src/pages/salon/backup b/src/pages/salon/backup new file mode 100644 index 0000000..9d0a1cc --- /dev/null +++ b/src/pages/salon/backup @@ -0,0 +1,108 @@ + + 技术交流群 + + {/* 2017-05-07    */} + 异度星球 + + + + 群简介 + | 📣技术爱好者 + + 社群是一个交流技术的平台,不限软件/硬件 + +
+ | 📋入群须知 + + 社群只是一个沟通平台,与其他伙伴搭桥 +
+ 可以讨论但不限于: +
+ 1️⃣云手机 +
+ 2️⃣机器人 +
+ 3️⃣AIGC /边缘计算 + +
+ | ❌禁止以下行为 + + 🚫营销推广 +
+ 🚫恶意捣乱 +
+
+ ❗群主没有解答义务,勿随意@ + {/*
+ 💰价格29元/人 (场地成本) */} + +
+ {meetup == 1 ? ( + | ☕入群口令:3399 + ) : null} + {meetup == 1 ? ( + + {`ID:${window.localStorage.getItem("openid")}`} + + ) : null} + {/* 已报名 */} + {meetup == 1 ? ( + + + + ) : null} + + + + + + {/* 立即加入按钮 */} + + {/* 判断有没有wxid,是否女性 */} + { + if (meetup == 1) { + return false; + } else { + if (!!isWeChat) { + payh5("meetup", 2900); + } else { + setmeetupQR(true); + } + } + }} + > + {meetup == 1 ? "入群口令: 3399" : `立即加入`} + + + + + {/* 软件下载模态窗 */} + + 咨询沙龙 + + + + + + + + + + \ No newline at end of file diff --git a/src/pages/salon/index.tsx b/src/pages/salon/index.tsx index 7d83755..6e9f161 100644 --- a/src/pages/salon/index.tsx +++ b/src/pages/salon/index.tsx @@ -1,17 +1,23 @@ // @ts-nocheck import { Component } from "react"; -import { View, Text, Image, Button } from "@tarojs/components"; +import { View, Text, Image, Button, Picker } from "@tarojs/components"; import "./index.scss"; -import { AtButton, AtInput, AtTabBar } from "taro-ui"; +import { + AtButton, + AtInput, + AtTabBar, + AtForm, + AtMessage, + AtList, + AtListItem, + AtTag, + AtTextarea, +} 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 { AtTag } from "taro-ui"; -import { AtList, AtListItem } from "taro-ui"; -import { AtForm, AtMessage } from "taro-ui"; import loft from "../../images/loft.png"; import nomadvloglife from "../../images/nomadvloglife.png"; @@ -27,24 +33,33 @@ import { import qrcode from "../../images/qrcode.png"; import joinGroup from "../../images/joinGroup.png"; -// export default class Index extends Component { +const PB_URL = 'https://pocketbase.hackrobot.cn'; +const COLLECTION = 'solan'; // 你建立的表名 +const PAY_API_URL = 'https://api.hackrobot.cn/payh5'; // 你的支付接口地址（根据实际调整） + const Salon = () => { const [meetupQR, setmeetupQR] = useState(false); const [isWeChat, setisWeChat] = useState(false); - const [meetup, setmeetup] = useState(window.localStorage.getItem("meetup")); useEffect(() => { isWeChatFun(); + checkIfJoined(); + checkPendingAndPaid(); }, []); + // 检查是否已加入（本地标记） + const checkIfJoined = () => { + if (Taro.getStorageSync('salonJoined')) { + setmeetupQR(true); + } + }; + const handleClick = (value) => { - // 跳转到目的页面，在当前页面打开 Taro.navigateTo({ url: "/pages/index/index", }); }; - // 是否在微信客户端 const isWeChatFun = () => { var ua = navigator.userAgent.toLowerCase(); if (ua.indexOf("micromessenger") != -1) { @@ -56,162 +71,388 @@ const Salon = () => { } }; - const payh5 = (type, total_fee = 1000) => { - // console.log("111"); - Taro.request({ - method: "POST", - url: "/api/payh5", //仅为示例，并非真实的接口地址 - // url: "https://pay.hackrobot.cn/api/payh5", //仅为示例，并非真实的接口地址 + // 生成或获取 userId（无下划线，干净格式） + const getOrCreateUserId = () => { + let userId = Taro.getStorageSync('userId'); + if (!userId) { + userId = `user${Date.now()}`; + Taro.setStorageSync('userId', userId); + } + return userId; + }; + // 检查是否已支付（查询 payments 表） + const checkIfPaid = async (userId) => { + return new Promise((resolve) => { + Taro.request({ + url: `${PB_URL}/api/collections/payments/records`, + method: 'GET', + data: { + filter: `(user_id="${userId}" && type="meetup")`, + sort: '-created', + perPage: 1, + }, + success: (res) => { + resolve(res.data?.items?.length > 0); + }, + fail: () => resolve(false), + }); + }); + }; + + // 支付函数（XorPay H5） + const payh5 = (type, total_fee = 9900) => { // 99元 + const userId = getOrCreateUserId(); + Taro.request({ + url: PAY_API_URL, + method: 'POST', data: { - callback_url: window.location.href, - openid: window.localStorage.getItem("openid"), - total_fee: total_fee, // 金额,单位:分 - type: type, //订单类型 book/meetup/video/vip + total_fee, + type, + user_id: userId, + // return_url: window.location.href, // 如果后端支持，取消注释并在后端加上, 支付成功自动返回 }, header: { - "content-type": "application/json", // 默认值 + '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"); - } + 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); } - ); + + // 如果你希望支付成功自动返回，取消注释以下（需后端支持 return_url） + // const returnInput = document.createElement('input'); + // returnInput.type = 'hidden'; + // returnInput.name = 'return_url'; + // returnInput.value = window.location.href; + // form.appendChild(returnInput); + + document.body.appendChild(form); + form.submit(); + } else { + Taro.showToast({ title: '支付发起失败', icon: 'none' }); + } + }, + fail: () => { + Taro.showToast({ title: '网络错误', icon: 'none' }); }, }); }; + // 表单状态统一管理 + const [form, setForm] = useState({ + nickname: '', + occupation: '', + reason: '', + wechatId: '', + gender: '', + education: '', + gradYear: '', + 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(0); + + // 通用字段更新函数 + const updateField = (field) => (value) => { + setForm((prev) => ({ ...prev, [field]: value })); + }; + + // 性别选择变更（保持原逻辑，实现隐形性别限制） + const handleGenderChange = (e) => { + const idx = e.detail.value; + setGenderIndex(idx); + updateField('gender')(idx === 0 ? '' : genderOptions[idx]); + }; + + // 学历选择变更 + const handleEducationChange = (e) => { + const idx = e.detail.value; + setEducationIndex(idx); + updateField('education')(idx === 0 ? '' : educationOptions[idx]); + }; + + // 毕业年份选择变更 + const handleGradYearChange = (e) => { + + const idx = e.detail.value; + setGradYearIndex(idx); + updateField('gradYear')(idx === 0 ? '' : yearOptions[idx]); + }; + + // 提交申请到 PocketBase + const submitApplication = (submitData) => { + const uploadUrl = `${PB_URL}/api/collections/${COLLECTION}/records`; + + Taro.request({ + url: uploadUrl, + method: 'POST', + header: { 'Content-Type': 'application/json' }, + data: { + nickname: submitData.nickname, + occupation: submitData.occupation, + reason: submitData.reason, + wechatId: submitData.wechatId, + gender: submitData.gender, + education: submitData.education, + gradYear: submitData.gradYear, + phone: submitData.phone, + calculated_age: submitData.calculatedAge, + user_id: submitData.userId || getOrCreateUserId(), + }, + success: (res) => { + if (res.statusCode === 200 || res.statusCode === 201) { + Taro.showToast({ title: '申请提交成功，欢迎加入！', icon: 'success' }); + Taro.setStorageSync('salonJoined', true); + setmeetupQR(true); + localStorage.removeItem('pendingSalonApplication'); + } else { + Taro.showToast({ title: '提交失败', icon: 'none' }); + } + }, + fail: () => { + Taro.showToast({ title: '提交失败，请检查网络', icon: 'none' }); + }, + }); + }; + + // 检查本地是否有 pending 申请且已支付 → 自动提交 + const checkPendingAndPaid = async () => { + const pending = localStorage.getItem('pendingSalonApplication'); + if (!pending) return; + + const pendingData = JSON.parse(pending); + const userId = getOrCreateUserId(); + + if (pendingData.userId !== userId) return; + + const paid = await checkIfPaid(userId); + if (paid) { + submitApplication({ + ...pendingData.form, + calculatedAge: pendingData.calculatedAge, + userId, + }); + } + }; + + const handleSubmit = async () => { + // 原有必填校验（包含性别隐形限制） + if ( + !form.nickname || + !form.occupation || + !form.reason || + !form.wechatId || + !form.gender + ) { + Taro.atMessage({ + message: '请填写所有必填项', + type: 'warning', + }); + return; + } + + // 隐形校验学历和毕业年份（必须有效） + if ( + !form.education || + !form.gradYear || + form.gradYear === '请选择毕业年份' + ) { + Taro.atMessage({ + message: '请填写所有必填项', + type: 'warning', + }); + return; + } + + // 计算估算年龄 + const gradAgeMap = { + '高中及以下': 18, + '大专': 21, + '本科': 22, + '硕士': 25, + }; + const baseAge = gradAgeMap[form.education] || 22; + const gradYearNum = parseInt(form.gradYear, 10); + + if (isNaN(gradYearNum)) { + Taro.atMessage({ + message: '请填写所有必填项', + type: 'warning', + }); + return; + } + + const calculatedAge = currentYear - gradYearNum + baseAge; + + const userId = getOrCreateUserId(); + + // 保存 pending 申请（用于支付后自动提交） + localStorage.setItem('pendingSalonApplication', JSON.stringify({ + form, + calculatedAge, + userId, + })); + + // 检查是否已支付 + const paid = await checkIfPaid(userId); + if (paid) { + // 已支付，直接提交 + submitApplication({ ...form, calculatedAge, userId }); + } else { + // 未支付，发起支付（99元，类型 meetup） + payh5('meetup', 9900); + Taro.showToast({ title: '正在跳转支付，请完成支付后返回', icon: 'loading', duration: 3000 }); + } + }; + + // 如果已加入（支付+提交成功），显示成功页面 + if (meetupQR) { + return ( + + + + 欢迎加入数字游民社区！ + + + {isWeChat ? ( + + ) : ( + + 请在微信中打开本页面以查看社群二维码 + + + )} + + + ); + } + + // 默认显示表单 return ( - - 技术交流群 - - {/* 2017-05-07    */} - 异度星球 - - - - 群简介 - | 📣技术爱好者 - - 社群是一个交流技术的平台,不限软件/硬件 - -
- | 📋入群须知 - - 社群只是一个沟通平台,与其他伙伴搭桥 -
- 可以讨论但不限于: -
- 1️⃣云手机 -
- 2️⃣机器人 -
- 3️⃣AIGC /边缘计算 - -
- | ❌禁止以下行为 - - 🚫营销推广 -
- 🚫恶意捣乱 -
-
- ❗群主没有解答义务,勿随意@ - {/*
- 💰价格29元/人 (场地成本) */} - -
- {meetup == 1 ? ( - | ☕入群口令:3399 - ) : null} - {meetup == 1 ? ( - - {`ID:${window.localStorage.getItem("openid")}`} - - ) : null} - {/* 已报名 */} - {meetup == 1 ? ( - - - - ) : null} - - - + + - - {/* 判断有没有wxid,是否女性 */} - { - if (meetup == 1) { - return false; - } else { - if (!!isWeChat) { - payh5("meetup", 2900); - } else { - setmeetupQR(true); - } - } - }} - > - {meetup == 1 ? "入群口令: 3399" : `立即加入`} - + + - - {/* 软件下载模态窗 */} - - 咨询沙龙 - - - + + - - - - - + + + + + + + 自我介绍 + + + + + + + {/* 学历下拉 */} + + + + + + + {/* 毕业年份下拉 */} + + + + + + + + + + 提交申请 + + + + + {/* 支付后申请将自动提交，支付成功请返回本页面（或刷新） */} + ); }; -export default Salon; +export default Salon; \ No newline at end of file