diff --git a/src/App.vue b/src/App.vue index 32a20f9..670e42c 100644 --- a/src/App.vue +++ b/src/App.vue @@ -192,5 +192,6 @@ button::after { justify-content: space-between; padding: 0 15px; padding-top: 20px; + position: relative; } diff --git a/src/components/BubbleTip.vue b/src/components/BubbleTip.vue new file mode 100644 index 0000000..a48c795 --- /dev/null +++ b/src/components/BubbleTip.vue @@ -0,0 +1,43 @@ + + + + + diff --git a/src/components/SButton.vue b/src/components/SButton.vue index b36eb85..3a55872 100644 --- a/src/components/SButton.vue +++ b/src/components/SButton.vue @@ -81,6 +81,7 @@ const onBtnClick = debounce(async () => { text-align: center; justify-content: center; align-items: center; + overflow: initial; } .loading { width: 25px; diff --git a/src/pages/first-try.vue b/src/pages/first-try.vue index 77ab83b..7f5fcf7 100644 --- a/src/pages/first-try.vue +++ b/src/pages/first-try.vue @@ -11,6 +11,7 @@ import Container from "@/components/Container.vue"; import Avatar from "@/components/Avatar.vue"; import BowPower from "@/components/BowPower.vue"; import TestDistance from "@/components/TestDistance.vue"; +import BubbleTip from "@/components/BubbleTip.vue"; import { createPractiseAPI } from "@/apis"; import { generateCanvasImage } from "@/util"; import { MESSAGETYPES } from "@/constants"; @@ -34,8 +35,26 @@ const title = ref("新手试炼场"); const start = ref(false); const practiseResult = ref({}); const power = ref(0); -// const btnDisabled = ref(false); +const btnDisabled = ref(false); const practiseId = ref(""); +const showGuide = ref(false); + +const guideImages = [ + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68bs7z5elwvw7.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68qmi7grgreen.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68hgrw1ip4wae.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x684x8zmfrmbla.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x67sding7fodnk.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68mpug7cac4yt.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68my783mlmgxv.png", + "https://api.shelingxingqiu.com/attachment/2025-07-09/db77x68p48ylzirtb0.png", +]; + +const onSwiperIndexChange = (index) => { + if (index + 1 === guideImages.length) { + showGuide.value = true; + } +}; const createPractise = async (arrows) => { const result = await createPractiseAPI(arrows); @@ -49,9 +68,9 @@ async function onReceiveMessage(messages = []) { scores.value.push(msg.target); } power.value = msg.target.battery; - // if (step.value === 2 && msg.target.dst / 100 > 5) { - // if (step.value === 2 && msg.target.dst > 5) { - // btnDisabled.value = false; + // if (step.value === 2 && msg.target.dst / 100 >= 5) { + btnDisabled.value = false; + showGuide.value = true; // } } if (msg.constructor === MESSAGETYPES.ShootSyncMePracticeID) { @@ -87,10 +106,12 @@ const nextStep = async () => { step.value = 1; title.value = "-凹造型"; } else if (step.value === 1) { - // btnDisabled.value = true; + showGuide.value = false; + btnDisabled.value = true; step.value = 2; title.value = "-感知距离"; } else if (step.value === 2) { + showGuide.value = false; step.value = 3; title.value = "-小试牛刀"; } else if (step.value === 3) { @@ -189,18 +210,7 @@ const onClose = () => { v-if="step === 5" /> - + { - {{ - stepButtonTexts[step] - }} + + + {{ + step === 1 ? "学会了,我摆得比教练还帅" : "我找到合适的点位了" + }} + + {{ stepButtonTexts[step] }} + diff --git a/src/pages/index.vue b/src/pages/index.vue index 7daa31d..d8e09d1 100644 --- a/src/pages/index.vue +++ b/src/pages/index.vue @@ -6,6 +6,7 @@ import AppBackground from "@/components/AppBackground.vue"; import UserHeader from "@/components/UserHeader.vue"; import SModal from "@/components/SModal.vue"; import Signin from "@/components/Signin.vue"; +import BubbleTip from "@/components/BubbleTip.vue"; import { getAppConfig, getHomeData, @@ -21,6 +22,7 @@ const { updateConfig, updateUser, updateDevice, updateRank } = store; const { user, device, rankData } = storeToRefs(store); const showModal = ref(false); const isIos = ref(true); +const showGuide = ref(false); const toPage = (path) => { if (!user.value.id) { @@ -67,6 +69,12 @@ onMounted(async () => { console.log("首页数据:", result); if (result.user) { updateUser(result.user); + if (result.user.trio <= 0) { + showGuide.value = true; + setTimeout(() => { + showGuide.value = false; + }, 3000); + } const devices = await getMyDevicesAPI(); if (devices.bindings && devices.bindings.length) { updateDevice( @@ -114,6 +122,13 @@ const comingSoon = () => { mode="widthFix" @click="() => toPage('/pages/first-try')" /> + + 新人必刷! + 快来报到吧~ + @@ -263,8 +278,8 @@ const comingSoon = () => { transform: scaleY(1.08) translateY(9px); } -.bow-card > image:last-child { - transform: translateY(12px); +.bow-card > image:nth-child(3) { + transform: translateY(11px); } .practice-card { diff --git a/src/pages/practise-one.vue b/src/pages/practise-one.vue index 2294b95..aa9da93 100644 --- a/src/pages/practise-one.vue +++ b/src/pages/practise-one.vue @@ -9,6 +9,7 @@ import SButton from "@/components/SButton.vue"; import Avatar from "@/components/Avatar.vue"; import BowPower from "@/components/BowPower.vue"; import TestDistance from "@/components/TestDistance.vue"; +import BubbleTip from "@/components/BubbleTip.vue"; import { createPractiseAPI, getHomeData } from "@/apis"; import { generateCanvasImage } from "@/util"; import { MESSAGETYPES, roundsName } from "@/constants"; @@ -17,13 +18,14 @@ import { storeToRefs } from "pinia"; const store = useStore(); const { user } = storeToRefs(store); const { updateUser } = store; -const start = ref(false); +const start = ref(true); const scores = ref([]); const total = 12; const currentRound = ref(0); const practiseResult = ref({}); const power = ref(0); const practiseId = ref(""); +const showGuide = ref(false); const onReady = async () => { const result = await createPractiseAPI(total); @@ -42,6 +44,12 @@ async function onReceiveMessage(messages = []) { if (currentRound.value === 4) { currentRound.value = 1; } + if (scores.value.length === total / 2) { + showGuide.value = true; + setTimeout(() => { + showGuide.value = false; + }, 3000); + } } power.value = msg.target.battery; } @@ -100,6 +108,13 @@ onUnmounted(() => { + + 还有两场,坚持 + 就是胜利!💪 + { const result = await createPractiseAPI(total); @@ -36,6 +38,12 @@ async function onReceiveMessage(messages = []) { if (msg.constructor === MESSAGETYPES.ShootSyncMeArrowID) { if (scores.value.length < total) { scores.value.push(msg.target); + if (scores.value.length === total / 2) { + showGuide.value = true; + setTimeout(() => { + showGuide.value = false; + }, 3000); + } } power.value = msg.target.battery; } @@ -94,6 +102,13 @@ onUnmounted(() => { + + 完成过半,胜利 + 在望!💪 +