From 7972dae3988a27c60324c3baea1016aa3e230ddb Mon Sep 17 00:00:00 2001
From: kron <kai_hong@126.com>
Date: Thu, 10 Jul 2025 15:34:00 +0800
Subject: [PATCH] =?UTF-8?q?=E7=BB=86=E8=8A=82=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/BowTarget.vue     |   3 +-
 src/components/Header.vue        |   2 +-
 src/components/ShootProgress.vue |  10 ++-
 src/components/Swiper.vue        |   3 +-
 src/components/UserHeader.vue    |   9 ++-
 src/pages/first-try.vue          |  13 ++--
 src/pages/index.vue              |  33 +++++----
 src/pages/my-device.vue          |  10 +--
 src/pages/rank-list.vue          |  49 +++++++++----
 src/pages/ranking.vue            |   6 ++
 src/store.js                     | 116 ++++++++++++++-----------------
 src/util.js                      |   2 +-
 12 files changed, 144 insertions(+), 112 deletions(-)

diff --git a/src/components/BowTarget.vue b/src/components/BowTarget.vue
index 772ceb1..dc7f49c 100644
--- a/src/components/BowTarget.vue
+++ b/src/components/BowTarget.vue
@@ -274,7 +274,7 @@ const simulShoot2 = async () => {
   color: #fff;
   font-size: 8px;
   text-align: center;
-  line-height: 12px;
+  line-height: 10px;
   transition: all 0.3s ease;
   box-sizing: border-box;
 }
@@ -293,6 +293,7 @@ const simulShoot2 = async () => {
   font-size: 20px;
   color: #fed847;
   top: 75px;
+  font-weight: bold;
 }
 .footer {
   width: calc(100% - 20px);
diff --git a/src/components/Header.vue b/src/components/Header.vue
index 5bf3923..0e27d75 100644
--- a/src/components/Header.vue
+++ b/src/components/Header.vue
@@ -33,7 +33,7 @@ onMounted(() => {
       <block v-if="'凹造型，感知距离，小试牛刀'.indexOf(title) === -1">
         <text>{{ title }}</text>
       </block>
-      <block v-else>
+      <block v-if="title && '凹造型，感知距离，小试牛刀'.indexOf(title) !== -1">
         <view class="first-try-steps">
           <text :class="title === '凹造型' ? 'current-step' : ''">凹造型</text>
           <text>-</text>
diff --git a/src/components/ShootProgress.vue b/src/components/ShootProgress.vue
index d3e71f5..3e0a428 100644
--- a/src/components/ShootProgress.vue
+++ b/src/components/ShootProgress.vue
@@ -128,7 +128,6 @@ onUnmounted(() => {
   align-items: center;
   justify-content: space-between;
   padding: 0 15px;
-  color: #fed847;
   z-index: 1;
   transform: translateX(-10px);
 }
@@ -136,9 +135,14 @@ onUnmounted(() => {
   width: 80px;
   transform: translateX(10px);
 }
+.container > view:first-child > text {
+  color: #fed847;
+  font-size: 18px;
+  transform: translateY(-10px);
+}
 .container > view:first-child > button:last-child > image {
-  width: 50px;
-  transform: translateX(10px);
+  width: 40px;
+  transform: translateX(10px) translateY(-10px);
 }
 .container > view:last-child {
   z-index: -1;
diff --git a/src/components/Swiper.vue b/src/components/Swiper.vue
index 97e1b14..1df5d4e 100644
--- a/src/components/Swiper.vue
+++ b/src/components/Swiper.vue
@@ -64,7 +64,8 @@ const handleChange = (e) => {
 
 .swiper-container image {
   width: calc(100% - 20px);
-  margin: 10px;
+  margin: 0 10px;
+  border-radius: 10px;
 }
 
 .dots {
diff --git a/src/components/UserHeader.vue b/src/components/UserHeader.vue
index 54d8cb1..9e9e0cd 100644
--- a/src/components/UserHeader.vue
+++ b/src/components/UserHeader.vue
@@ -29,6 +29,11 @@ const toUserPage = () => {
     });
   }
 };
+const toRankListPage = () => {
+  uni.navigateTo({
+    url: "/pages/rank-list",
+  });
+};
 watch(
   () => [config.value, user.value],
   ([n_config, n_user]) => {
@@ -58,7 +63,7 @@ watch(
         :onClick="toUserPage"
         :size="42"
       />
-      <view class="user-details">
+      <view class="user-details" :onClick="toUserPage">
         <view class="user-name">
           <text>{{ user.nickName }}</text>
           <image
@@ -83,7 +88,7 @@ watch(
           </view>
         </view>
       </view>
-      <view v-if="showRank === true" class="rank-info">
+      <view v-if="showRank === true" class="rank-info" @click="toRankListPage">
         <image
           class="rank-info-image"
           src="../static/global-rank.png"
diff --git a/src/pages/first-try.vue b/src/pages/first-try.vue
index 2645f65..f06d6aa 100644
--- a/src/pages/first-try.vue
+++ b/src/pages/first-try.vue
@@ -189,9 +189,14 @@ const onClose = () => {
       <view style="height: 570px" v-if="step === 1">
         <Swiper
           :data="[
-            'https://api.shelingxingqiu.com/attachment/2025-07-01/db0ehhek5yutxsetyi.png',
-            'https://api.shelingxingqiu.com/attachment/2025-07-01/db0ehhek5yutxsetyi.png',
-            'https://api.shelingxingqiu.com/attachment/2025-07-01/db0ehhek5yutxsetyi.png',
+            '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',
           ]"
         />
       </view>
@@ -249,7 +254,7 @@ const onClose = () => {
 }
 .try-tip {
   width: calc(100% - 20px);
-  margin: 10px 10px;
+  margin: 0 10px;
 }
 .infos {
   display: flex;
diff --git a/src/pages/index.vue b/src/pages/index.vue
index 79f07c9..3d91cff 100644
--- a/src/pages/index.vue
+++ b/src/pages/index.vue
@@ -36,6 +36,12 @@ const toPage = (path) => {
         icon: "none",
       });
     }
+    if (!user.value.trio) {
+      return uni.showToast({
+        title: "请先完成新手试炼",
+        icon: "none",
+      });
+    }
   }
   uni.navigateTo({
     url: path,
@@ -52,26 +58,23 @@ onMounted(async () => {
   try {
     const deviceInfo = uni.getDeviceInfo();
     isIos.value = deviceInfo.osName === "ios";
-    const token = uni.getStorageSync("token");
-    if (token) {
-      const result = await getHomeData();
-      console.log("首页数据：", result);
-      if (result.user) {
-        updateUser(result.user);
-        const devices = await getMyDevicesAPI();
-        if (devices.bindings && devices.bindings.length) {
-          updateDevice(
-            devices.bindings[0].deviceId,
-            devices.bindings[0].deviceName
-          );
-        }
-      }
-    }
     const config = await getAppConfig();
     updateConfig(config);
     console.log("全局配置：", config);
     const rankList = await getRankListAPI();
     updateRank(rankList);
+    const result = await getHomeData();
+    console.log("首页数据：", result);
+    if (result.user) {
+      updateUser(result.user);
+      const devices = await getMyDevicesAPI();
+      if (devices.bindings && devices.bindings.length) {
+        updateDevice(
+          devices.bindings[0].deviceId,
+          devices.bindings[0].deviceName
+        );
+      }
+    }
   } catch (error) {
     console.error("获取配置失败：", error);
   }
diff --git a/src/pages/my-device.vue b/src/pages/my-device.vue
index 3a6e593..2ef881d 100644
--- a/src/pages/my-device.vue
+++ b/src/pages/my-device.vue
@@ -97,12 +97,12 @@ const backToHome = () => {
         :onClose="() => (showTip = false)"
       >
         <view class="scan-tips">
-          <text>不知道如何连接弓箭</text>
-          <text>1. 先确认弓箭是智能弓箭</text>
-          <text>2.确认开启手机的摄像头权限；</text>
-          <text>3. 开启进入绑定弓箭功能，扫弓箭二维码</text>
+          <text>找不到我的弓箭 </text>
+          <text>1.确认弓箭是智能弓箭 </text>
+          <text>2.确认弓箭有电且电源已开启 </text>
+          <text>3.进入弓箭绑定功能，扫描弓箭上的二维码 </text>
           <image src="../static/scan-tip.png" mode="widthFix" />
-          <text>4. 连接成功后</text>
+          <text>4.连接成功后</text>
           <view>联系在线客服</view>
         </view>
       </ScreenHint>
diff --git a/src/pages/rank-list.vue b/src/pages/rank-list.vue
index 4ce4912..b6cfd31 100644
--- a/src/pages/rank-list.vue
+++ b/src/pages/rank-list.vue
@@ -11,6 +11,7 @@ const isIos = ref(true);
 const selectedIndex = ref(0);
 const currentList = ref([]);
 const myData = ref(null);
+const headerColor = ref("");
 
 onMounted(async () => {
   const deviceInfo = uni.getDeviceInfo();
@@ -36,18 +37,28 @@ const handleSelect = (index) => {
   );
 };
 
+const onScrollView = (e) => {
+  headerColor.value = e.detail.scrollTop > 100 ? "orange" : "";
+  console.log(1111, e.detail);
+};
+
 const subTitles = ["排位赛积分", "本周MVP次数", "本周十环次数"];
 </script>
 
 <template>
-  <view class="container">
-    <navigator
-      open-type="navigateBack"
-      class="back-btn"
-      :style="{ top: `${isIos ? 55 : 45}px` }"
+  <scroll-view class="container" scroll-y @scroll="onScrollView">
+    <view
+      class="header"
+      :style="{
+        paddingTop: isIos ? '38px' : '25px',
+        backgroundColor: headerColor,
+      }"
     >
-      <image src="../static/back.png" mode="widthFix" />
-    </navigator>
+      <navigator open-type="navigateBack">
+        <image src="../static/back.png" mode="widthFix" />
+      </navigator>
+      <text :style="{ opacity: headerColor ? 1 : 0 }">本赛季排行榜</text>
+    </view>
     <image src="../static/rankbg.png" mode="widthFix" class="header-bg" />
     <view class="rank-tabs">
       <view
@@ -144,26 +155,36 @@ const subTitles = ["排位赛积分", "本周MVP次数", "本周十环次数"];
         >分</text
       >
     </view>
-  </view>
+  </scroll-view>
 </template>
 
 <style scoped>
 .container {
-  position: relative;
+  width: 100%;
+  height: 100vh;
   padding-bottom: 100px;
 }
 .header-bg {
   width: 100%;
 }
-.back-btn {
+.header {
+  width: 100%;
+  height: 60px;
   display: flex;
-  align-items: center;
-  position: absolute;
+  align-items: flex-center;
+  position: fixed;
+  top: 0;
+  transition: all 0.3s ease;
+  z-index: 10;
 }
-.back-btn > image {
+.header image {
   width: 22px;
   height: 22px;
-  margin: 0 10px;
+  margin: 20px 15px;
+}
+.header text {
+  transition: all 0.3s ease;
+  line-height: 60px;
 }
 .rank-tabs {
   width: calc(100% - 20px);
diff --git a/src/pages/ranking.vue b/src/pages/ranking.vue
index 0958e69..b870731 100644
--- a/src/pages/ranking.vue
+++ b/src/pages/ranking.vue
@@ -90,6 +90,12 @@ const toMeleeMatchPage = async (gameType, teamSize) => {
       icon: "none",
     });
   }
+  if (!user.value.trio) {
+    return uni.showToast({
+      title: "请先完成新手试炼",
+      icon: "none",
+    });
+  }
   const isGaming = await isGamingAPI();
   if (isGaming) {
     uni.$showHint(1);
diff --git a/src/store.js b/src/store.js
index a8c5319..92512da 100644
--- a/src/store.js
+++ b/src/store.js
@@ -8,6 +8,37 @@ const defaultUser = {
   lvlName: "砖石1级",
 };
 
+const getLvlName = (score, rankList = []) => {
+  let lvlName = "";
+  rankList.some((r, index) => {
+    lvlName = rankList[index].name;
+    if (r.upgrade_scores > score) {
+      if (rankList[index - 1]) {
+        lvlName = rankList[index - 1].name;
+      }
+      return true;
+    }
+    return false;
+  });
+  return lvlName;
+};
+
+const getLvlImage = (score, rankList = []) => {
+  // 先保存到本地，分享只能用本地图片
+  let lvlImage = "";
+  rankList.some((r, index) => {
+    lvlImage = rankList[index].icoin;
+    if (r.upgrade_scores > score) {
+      if (rankList[index - 1]) {
+        lvlImage = rankList[index - 1].icoin;
+      }
+      return true;
+    }
+    return false;
+  });
+  return lvlImage;
+};
+
 // 定义游戏相关的 store
 export default defineStore("store", {
   // 状态
@@ -33,35 +64,11 @@ export default defineStore("store", {
 
   // 方法
   actions: {
-    getLvlImage(score) {
-      let lvlImage = "";
-      const rankInfos = this.config.randInfos || [];
-      rankInfos.some((r, index) => {
-        lvlImage = rankInfos[index].icoin;
-        if (r.upgrade_scores > score) {
-          if (rankInfos[index - 1]) {
-            lvlImage = rankInfos[index - 1].icoin;
-          }
-          return true;
-        }
-        return false;
-      });
-      return lvlImage;
-    },
     getLvlName(score) {
-      let lvlName = "";
-      const rankInfos = this.config.randInfos || [];
-      rankInfos.some((r, index) => {
-        lvlName = rankInfos[index].name;
-        if (r.upgrade_scores > score) {
-          if (rankInfos[index - 1]) {
-            lvlName = rankInfos[index - 1].name;
-          }
-          return true;
-        }
-        return false;
-      });
-      return lvlName;
+      return getLvlName(score, this.config.randInfos);
+    },
+    getLvlImage(score) {
+      return getLvlImage(score, this.config.randInfos);
     },
     updateRank(data = {}) {
       this.rankData = { rank: data.rank || [], ringRank: data.ringRank || [] };
@@ -69,53 +76,32 @@ export default defineStore("store", {
     async updateUser(user = {}) {
       this.user = { ...defaultUser, ...user };
       if (user.avatar) {
-        const avatarInfo = await uni.getImageInfo({ src: user.avatar });
-        this.user.avatar = avatarInfo.path;
+        // 先保存到本地，分享只能用本地图片
+        const imageInfo = await uni.getImageInfo({ src: user.avatar });
+        this.user.avatar = imageInfo.path;
       }
-      const rankInfos = this.config.randInfos || [];
-      let lvlName = "";
-      let lvlImage = "";
       if (this.user.scores) {
-        rankInfos.some((r, index) => {
-          lvlName = rankInfos[index].name;
-          lvlImage = rankInfos[index].icoin;
-          if (r.upgrade_scores > this.user.scores) {
-            if (rankInfos[index - 1]) {
-              lvlName = rankInfos[index - 1].name;
-              lvlImage = rankInfos[index - 1].icoin;
-            }
-            return true;
-          }
-          return false;
-        });
-        this.user.lvlName = lvlName;
-        this.user.lvlImage = lvlImage;
+        this.user.lvlName = getLvlName(this.user.scores, this.config.randInfos);
+        const lvlImage = getLvlImage(this.user.scores, this.config.randInfos);
+        if (lvlImage) {
+          const imageInfo = await uni.getImageInfo({ src: lvlImage });
+          this.user.lvlImage = imageInfo.path;
+        }
       }
     },
     updateDevice(deviceId, deviceName) {
       this.device.deviceId = deviceId;
       this.device.deviceName = deviceName;
     },
-    updateConfig(config) {
+    async updateConfig(config) {
       this.config = config;
-      const rankInfos = config.randInfos || [];
-      let lvlName = "";
-      let lvlImage = "";
       if (this.user.scores) {
-        rankInfos.some((r, index) => {
-          lvlName = rankInfos[index].name;
-          lvlImage = rankInfos[index].icoin;
-          if (r.upgrade_scores > this.user.scores) {
-            if (rankInfos[index - 1]) {
-              lvlName = rankInfos[index - 1].name;
-              lvlImage = rankInfos[index - 1].icoin;
-            }
-            return true;
-          }
-          return false;
-        });
-        this.user.lvlName = lvlName;
-        this.user.lvlImage = lvlImage;
+        this.user.lvlName = getLvlName(this.user.scores, this.config.randInfos);
+        const lvlImage = getLvlImage(this.user.scores, this.config.randInfos);
+        if (lvlImage) {
+          const imageInfo = await uni.getImageInfo({ src: lvlImage });
+          this.user.lvlImage = imageInfo.path;
+        }
       }
     },
   },
diff --git a/src/util.js b/src/util.js
index 7126c18..da0d3bb 100644
--- a/src/util.js
+++ b/src/util.js
@@ -185,7 +185,7 @@ export async function generateCanvasImage(canvasId, type, user, data) {
   const height = 534;
   ctx.drawImage("../static/share-bg.png", 0, 0, width, height);
   drawRoundImage(ctx, user.avatar, 17, 20, 32, 32, 20);
-  ctx.drawImage("../static/avatar-frame.png", 12, 15, 42, 42);
+  ctx.drawImage(user.lvlImage, 12, 15, 42, 42);
   renderText(ctx, user.nickName, 13, "#fff", 58, 34);
   renderRankTitle(ctx, user.lvlName);