From 4b3114128747ad65484f2d1497eda03df9e3b7c9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=88=98=E6=9D=B0?= Date: Tue, 30 Sep 2025 14:07:42 +0800 Subject: [PATCH] feat: test popup not done --- .../NTRPEvaluatePopup/index.module.scss | 4 +- src/components/NTRPEvaluatePopup/index.tsx | 49 +++++-- .../NTRPPopupGuide/index.module.scss | 0 src/components/NTRPPopupGuide/index.tsx | 23 +++ .../NTRPTestEntryCard/index.module.scss | 138 ++++++++++++++++++ src/components/NTRPTestEntryCard/index.tsx | 82 +++++++++++ src/game_pages/detail/index.tsx | 5 +- src/other_pages/ntrp-evaluate/index.tsx | 25 +++- src/static/ntrp/ntrp_arrow_right_color.svg | 4 + 9 files changed, 306 insertions(+), 24 deletions(-) create mode 100644 src/components/NTRPPopupGuide/index.module.scss create mode 100644 src/components/NTRPPopupGuide/index.tsx create mode 100644 src/components/NTRPTestEntryCard/index.module.scss create mode 100644 src/components/NTRPTestEntryCard/index.tsx create mode 100644 src/static/ntrp/ntrp_arrow_right_color.svg diff --git a/src/components/NTRPEvaluatePopup/index.module.scss b/src/components/NTRPEvaluatePopup/index.module.scss index 5b618c0..f03bdcd 100644 --- a/src/components/NTRPEvaluatePopup/index.module.scss +++ b/src/components/NTRPEvaluatePopup/index.module.scss @@ -1,8 +1,8 @@ @use "~@/scss/images.scss" as img; .container { - width: calc(100vw - 40px); - height: 400px; + width: 100%; + // height: 400px; display: flex; flex-direction: column; align-items: center; diff --git a/src/components/NTRPEvaluatePopup/index.tsx b/src/components/NTRPEvaluatePopup/index.tsx index c4331c5..0437181 100644 --- a/src/components/NTRPEvaluatePopup/index.tsx +++ b/src/components/NTRPEvaluatePopup/index.tsx @@ -3,12 +3,15 @@ import React, { useImperativeHandle, useEffect, forwardRef, + memo, } from "react"; import { Button, Input, View, Text } from "@tarojs/components"; import Taro from "@tarojs/taro"; import CommonPopup from "../CommonPopup"; import { getCurrentFullPath } from "@/utils"; -import { useUserInfo, useUserActions } from "@/store/userStore"; +import evaluateService from "@/services/evaluateService"; +import NTRPTestEntryCard from "../NTRPTestEntryCard"; +import NtrpPopupGuide from "../NTRPPopupGuide"; import style from "./index.module.scss"; export enum EvaluateType { @@ -32,6 +35,7 @@ interface NTRPEvaluatePopupProps { types: EvaluateType[]; displayCondition: DisplayConditionType; scene: SceneType; + showGuide: boolean; children: React.ReactNode; } @@ -40,7 +44,7 @@ function showCondition(scene, ntrp) { // TODO: 显示频率 return Math.random() < 0.1 && [0, undefined].includes(ntrp); } - return [0, undefined].includes(ntrp); + return ntrp === "0"; } const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => { @@ -48,10 +52,10 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => { types = ["edit", "evaluate"], displayCondition = "auto", scene = "list", + showGuide = false, } = props; - const [visible, setVisible] = useState(false); - const { ntrp } = useUserInfo(); - const { fetchUserInfo } = useUserActions(); + const [visible, setVisible] = useState(true); + const [ntrp, setNtrp] = useState(); useImperativeHandle(ref, () => ({ show: () => setVisible(true), @@ -61,14 +65,26 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => { setVisible(false); // TODO: 实现NTRP评估逻辑 Taro.navigateTo({ - url: `/other_pages/ntrp-evaluate/index?redirect=${encodeURIComponent(getCurrentFullPath())}`, + url: `/other_pages/ntrp-evaluate/index?redirect=${encodeURIComponent( + getCurrentFullPath() + )}`, }); } useEffect(() => { - // fetchUserInfo(); + getNtrp(); }, []); + async function getNtrp() { + const res = await evaluateService.getLastResult(); + if (res.code === 0 && res.data.has_ntrp_level) { + // setNtrp(res.data.user_ntrp_level) + setNtrp("0"); + } else { + setNtrp("0"); + } + } + const showEntry = displayCondition === "auto" ? showCondition(scene, ntrp) @@ -80,20 +96,21 @@ const NTRPEvaluatePopup = (props: NTRPEvaluatePopupProps, ref) => { title="NTRP评估" visible={visible} onClose={() => setVisible(false)} - position="center" + showHeader={false} hideFooter enableDragToClose={false} > - - {/* TODO: 直接修改NTRP水平 */} - 您还未测评。。。 - 请先进行NTRP评估 - - + {showGuide ? ( + + ) : ( + + + + )} - {showEntry ? props.children : ''} + {showEntry ? props.children : ""} ); }; -export default forwardRef(NTRPEvaluatePopup); +export default memo(forwardRef(NTRPEvaluatePopup)); diff --git a/src/components/NTRPPopupGuide/index.module.scss b/src/components/NTRPPopupGuide/index.module.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/components/NTRPPopupGuide/index.tsx b/src/components/NTRPPopupGuide/index.tsx new file mode 100644 index 0000000..ef3155d --- /dev/null +++ b/src/components/NTRPPopupGuide/index.tsx @@ -0,0 +1,23 @@ +import React from "react"; +import { View, Text } from "@tarojs/components"; +import styles from "./index.module.scss"; + +function NtrpPopupGuide() { + return ( + + + + + + + + + + 首次发布球局前，需完善 NTRP 水平信息 + + + + ); +} + +export default NtrpPopupGuide; diff --git a/src/components/NTRPTestEntryCard/index.module.scss b/src/components/NTRPTestEntryCard/index.module.scss new file mode 100644 index 0000000..fe70d63 --- /dev/null +++ b/src/components/NTRPTestEntryCard/index.module.scss @@ -0,0 +1,138 @@ +@mixin commonCardStyle { + width: 100%; + padding: 16px; + box-sizing: border-box; + border-radius: 20px; + border: 0.5px solid rgba(0, 0, 0, 0.08); + background: linear-gradient(180deg, #BFFFEF 0%, #F2FFFC 100%), var(--Backgrounds-Primary, #FFF); + display: flex; + align-items: center; + justify-content: space-between; +} + +.higher { + height: 100px; + @include commonCardStyle(); +} + +.lower { + height: 80px; + @include commonCardStyle(); + + +} + +.desc { + display: flex; + flex-direction: column; + align-items: flex-start; + justify-content: flex-start; + gap: 7px; + + .title { + color: #2A4D44; + font-family: "Noto Sans SC"; + font-size: 16px; + font-style: normal; + font-weight: 900; + line-height: 24px; + + .colorTip { + color: #00E5AD; + font-family: "Noto Sans SC"; + font-size: 16px; + font-style: normal; + font-weight: 900; + line-height: 24px; + } + + .strongTip { + color: #00E5AD; + font-family: "Noto Sans SC"; + font-size: 16px; + font-style: normal; + font-weight: 900; + line-height: 24px; + text-decoration-line: underline; + text-decoration-style: solid; + text-decoration-skip-ink: auto; + text-decoration-thickness: auto; + text-underline-offset: auto; + text-underline-position: from-font; + } + } +} + +.entry { + display: flex; + align-items: center; + justify-content: flex-start; + gap: 4px; + color: #5CA693; + font-feature-settings: 'liga' off, 'clig' off; + font-family: "PingFang SC"; + font-size: 12px; + font-style: normal; + font-weight: 600; + line-height: normal; + + .entryIcon { + width: 12px; + height: 12px; + } +} + +@mixin commonAvatarStyle($multiple: 1) { + .avatar { + flex: 0 0 auto; + width: calc(100px * $multiple); + height: calc(100px * $multiple); + display: flex; + align-items: center; + justify-content: center; + background-color: #fff; + border-radius: 50%; + border: 1px solid #efefef; + overflow: hidden; + box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.20), 0 8px 20px 0 rgba(0, 0, 0, 0.12); + + .avatarUrl { + width: calc(90px * $multiple); + height: calc(90px * $multiple); + border-radius: 50%; + border: 1px solid #efefef; + } + } + + .addonImage { + flex: 0 0 auto; + width: calc(88px * $multiple); + height: calc(88px * $multiple); + transform: rotate(8deg); + flex-shrink: 0; + aspect-ratio: 1/1; + border-radius: calc(20px * $multiple); + border: 4px solid #FFF; + background: linear-gradient(0deg, rgba(89, 255, 214, 0.20) 0%, rgba(89, 255, 214, 0.20) 100%), #FFF; + box-shadow: 0 4px 36px 0 rgba(0, 0, 0, 0.12); + display: flex; + align-items: center; + justify-content: center; + box-sizing: border-box; + margin-left: calc(-1 * 20px * $multiple); + + .docImage { + width: calc(48px * $multiple); + height: calc(48px * $multiple); + transform: rotate(-7deg); + flex-shrink: 0; + } + } +} + +.avatarWrap { + display: flex; + align-items: center; + justify-content: flex-start; + @include commonAvatarStyle(0.5); +} \ No newline at end of file diff --git a/src/components/NTRPTestEntryCard/index.tsx b/src/components/NTRPTestEntryCard/index.tsx new file mode 100644 index 0000000..a0ad075 --- /dev/null +++ b/src/components/NTRPTestEntryCard/index.tsx @@ -0,0 +1,82 @@ +import React, { useEffect } from "react"; +import { View, Image, Text } from "@tarojs/components"; +import { useUserInfo, useUserActions } from "@/store/userStore"; +import DocCopy from "@/static/ntrp/ntrp_doc_copy.svg"; +import ArrowRight from "@/static/ntrp/ntrp_arrow_right_color.svg"; +import styles from "./index.module.scss"; + +function NTRPTestEntryCard(props) { + const userInfo = useUserInfo(); + // const { fetchUserInfo } = useUserActions() + + // useEffect(() => { + // fetchUserInfo() + // }, []) + const { type } = props; + return type !== "list" ? ( + + + + + 快速测一测✏️ + + + 你的 + ( + NTRP + ) + 水平? + + + + 快速测试 + + + + + + + + {/* avatar side */} + + + + + + ) : ( + + + + 不知道自己的 + ( + NTRP + ) + 水平? + + + 快速测试 + + + + + + + + {/* avatar side */} + + + + + + ); +} + +export default NTRPTestEntryCard; diff --git a/src/game_pages/detail/index.tsx b/src/game_pages/detail/index.tsx index a27d604..60038f8 100644 --- a/src/game_pages/detail/index.tsx +++ b/src/game_pages/detail/index.tsx @@ -314,7 +314,8 @@ function StickyButton(props) { } const displayPrice = is_organizer ? 0 : price; // user_action_status.can_assess = true; - // user_action_status.can_join = true; + // user_action_status.can_join = false; + console.log(user_action_status, "user_action"); const { can_assess, can_join, @@ -390,6 +391,7 @@ function StickyButton(props) { types={[EvaluateType.EDIT, EvaluateType.EVALUATE]} scene={SceneType.DETAIL} displayCondition={DisplayConditionType.AUTO} + showGuide > ¥{displayPrice} 立即加入 @@ -400,7 +402,6 @@ function StickyButton(props) { return { text: "球局无法加入", available: false, - // action: () => {}, }; } diff --git a/src/other_pages/ntrp-evaluate/index.tsx b/src/other_pages/ntrp-evaluate/index.tsx index 42d4396..f323b09 100644 --- a/src/other_pages/ntrp-evaluate/index.tsx +++ b/src/other_pages/ntrp-evaluate/index.tsx @@ -28,6 +28,16 @@ enum StageType { RESULT = "result", } +enum SourceType { + DETAIL = 'detail', + PUBLISH = 'publish', +} + +const sourceTypeToTextMap = new Map([ + [SourceType.DETAIL, '继续加入球局'], + [SourceType.PUBLISH, '继续发布球局'], +]) + function adjustRadarLabels( source: [string, number][], topK: number = 4 // 默认挑前4个最长的标签保护 @@ -369,9 +379,8 @@ function Test(props) { } function Result(props) { - const { redirect } = props; const { params } = useRouter(); - const { id } = params; + const { id, type, redirect } = params; const userInfo = useUserInfo(); const { fetchUserInfo } = useUserActions(); const radarRef = useRef(); @@ -428,6 +437,14 @@ function Result(props) { }); } + function handleGoon () { + if (type) { + Taro.redirectTo({ url: redirect }) + } else { + handleViewGames() + } + } + async function genCardImage() { return new Promise(async (resolve, reject) => { const url = await radarRef.current.generateImage(); @@ -558,8 +575,8 @@ function Result(props) { )} - - + + diff --git a/src/static/ntrp/ntrp_arrow_right_color.svg b/src/static/ntrp/ntrp_arrow_right_color.svg new file mode 100644 index 0000000..1d733c1 --- /dev/null +++ b/src/static/ntrp/ntrp_arrow_right_color.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file