兑换token时，点击兑换规则弹出token规则。解决拥挤问题。

src/views/homePage.vue

@@ -342,10 +342,21 @@ const hasShownTokenRule = ref({
 const closeTokenRuleDialog = () => {
   tokenRuleDialogVisible.value = false;
 };
+// 打开Token规则提示框
+const openTokenRuleDialog = () => {
+  tokenRuleDialogVisible.value = true;
+};
 
 // 添加全局点击事件监听器，使任何点击动作都能关闭提示框
 // 定义处理函数，以便正确移除事件监听器
-const handleGlobalClick = () => {
+const handleGlobalClick = (event) => {
+  // 检查点击事件是否来自"兑换规则"按钮
+  const changeRuleElement = document.querySelector('.changeRule');
+  if (changeRuleElement && (changeRuleElement === event.target || changeRuleElement.contains(event.target))) {
+    // 如果点击的是"兑换规则"按钮，不关闭提示框
+    return;
+  }
+  
   if (tokenRuleDialogVisible.value) {
     tokenRuleDialogVisible.value = false;
   }
@@ -1549,7 +1560,7 @@ onUnmounted(() => {
             <div class="changeJwcode">精网号：{{ userInfo.jwcode }}</div>
           </div>
         </div>
-        <div class="changeRule">
+        <div class="changeRule" @click="openTokenRuleDialog">
           兑换规则：{{ changeRule.gold }}金币={{ changeRule.token }}Token
         </div>
       </div>
@@ -1608,7 +1619,7 @@ onUnmounted(() => {
       <div class="changeLevel">
         <div class="changeLevelTitle">
           兑换Token
-          <div class="changeRule">
+          <div class="changeRule" @click="openTokenRuleDialog">
             (兑换规则：{{ changeRule.gold }}金币={{ changeRule.token }}Token)
           </div>
         </div>
@@ -2741,6 +2752,7 @@ body {
   .changeLevelTitle {
     align-items: center;
     display: flex;
+    flex-direction: column;
   }
   .changeRule {
     margin-left: 10px;