From 026263009b4b3b4dba3c3602a14ee1bc30523891 Mon Sep 17 00:00:00 2001
From: no99 <17663930442@163.com>
Date: Tue, 28 Oct 2025 11:06:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E8=A1=8C=E6=83=85=E9=A1=B5?=
 =?UTF-8?q?=E9=9D=A2=E8=B7=B3=E8=BD=AC=E6=96=B9=E6=B3=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 components/IndexCard.vue       |    4 +-
 pages/home/globalIndex.vue     |  841 ++++++++++++-------------
 pages/home/marketCondition.vue |   54 +-
 pages/home/marketDetail.vue    |  684 ++++++++++-----------
 pages/home/marketSituation.vue | 1326 ++++++++++++++++++++--------------------
 5 files changed, 1492 insertions(+), 1417 deletions(-)

diff --git a/components/IndexCard.vue b/components/IndexCard.vue
index ea4c292..24d0e7e 100644
--- a/components/IndexCard.vue
+++ b/components/IndexCard.vue
@@ -4,7 +4,7 @@
 			<view class="flag-container">
 				<image :src="flagIcon" class="flag-icon" mode="aspectFit"></image>
 			</view>
-			<text class="index-name">{{ indexName }}</text>
+			<text class="index-name">{{ stockName }}</text>
 		</view>
 		
 		<view class="price-info">
@@ -35,7 +35,7 @@ const props = defineProps({
 		required: true
 	},
 	// 指数名称
-	indexName: {
+	stockName: {
 		type: String,
 		required: true
 	},
diff --git a/pages/home/globalIndex.vue b/pages/home/globalIndex.vue
index 287e36e..f624da9 100644
--- a/pages/home/globalIndex.vue
+++ b/pages/home/globalIndex.vue
@@ -1,574 +1,579 @@
+<!-- @format -->
+
 <template>
-    <view class="main">
-        <!-- 固定头部 -->
-        <view class="header_fixed" :style="{ top: iSMT + 'px' }">
-            <view class="header_content">
-                <view class="header_back" @click="goBack">
-                    <image src="/static/marketSituation-image/back.png" mode=""></image>
-                </view>
-                <view class="header_input_wrapper">
-                    <image class="search_icon" src="/static/marketSituation-image/search.png" mode=""
-                        @click="onSearchClick"></image>
-                    <input class="header_input" type="text" placeholder="搜索"
-                        placeholder-style="color: #A6A6A6; font-size: 22rpx;" v-model="searchValue"
-                        @input="onSearchInput" @confirm="onSearchConfirm" />
-                </view>
-                <view class="header_icons">
-                    <view class="header_icon" @click="selected">
-                        <image src="/static/marketSituation-image/mySeclected.png" mode=""></image>
-                    </view>
-                    <view class="header_icon" @click="history">
-                        <image src="/static/marketSituation-image/history.png" mode=""></image>
-                    </view>
-                </view>
-            </view>
-            <view class="warn">
-                <image src="/static/marketSituation-image/warn.png" mode="aspectFit"></image>
-                <view class="warn_text_container">
-                    <text :class="warnTextClass">{{ $t('marketSituation.warn') }}</text>
-                </view>
-            </view>
+  <view class="main">
+    <!-- 固定头部 -->
+    <view class="header_fixed" :style="{ top: iSMT + 'px' }">
+      <view class="header_content">
+        <view class="header_back" @click="goBack">
+          <image src="/static/marketSituation-image/back.png" mode=""></image>
         </view>
-
-        <!-- 内容区域 -->
-        <scroll-view class="content" :style="{ top: contentTopPosition + 'px' }" scroll-y="true">
-            <!-- 亚太-中华 -->
-            <view class="market-section">
-                <view class="market-header">
-                    <text class="market-title">亚太-中华</text>
-                    <view class="market-more" @click="viewMore('asia-china')">
-                        <text class="more-text">查看更多</text>
-                        <text class="more-arrow">></text>
-                    </view>
-                </view>
-                <view class="cards-grid-three">
-                    <view v-for="(item, index) in asiachinaIndexes" :key="index" class="card-item">
-                        <IndexCard :flagIcon="item.flagIcon" :indexName="item.indexName"
-                            :currentPrice="item.currentPrice" :changeAmount="item.changeAmount"
-                            :changePercent="item.changePercent" :isRising="item.isRising"
-                            @click="viewIndexDetail(item)" />
-                    </view>
-                </view>
-            </view>
-
-            <!-- 亚太 -->
-            <view class="market-section">
-                <view class="market-header">
-                    <text class="market-title">亚太</text>
-                    <view class="market-more" @click="viewMore('asia')">
-                        <text class="more-text">查看更多</text>
-                        <text class="more-arrow">></text>
-                    </view>
-                </view>
-                <view class="cards-grid-three">
-                    <view v-for="(item, index) in asiaIndexes" :key="index" class="card-item">
-                        <IndexCard :flagIcon="item.flagIcon" :indexName="item.indexName"
-                            :currentPrice="item.currentPrice" :changeAmount="item.changeAmount"
-                            :changePercent="item.changePercent" :isRising="item.isRising"
-                            @click="viewIndexDetail(item)" />
-                    </view>
-                </view>
-            </view>
-
-            <!-- 美洲 -->
-            <view class="market-section">
-                <view class="market-header">
-                    <text class="market-title">美洲</text>
-                    <view class="market-more" @click="viewMore('america')">
-                        <text class="more-text">查看更多</text>
-                        <text class="more-arrow">></text>
-                    </view>
-                </view>
-                <view class="cards-grid-three">
-                    <view v-for="(item, index) in americaIndexes" :key="index" class="card-item">
-                        <IndexCard :flagIcon="item.flagIcon" :indexName="item.indexName"
-                            :currentPrice="item.currentPrice" :changeAmount="item.changeAmount"
-                            :changePercent="item.changePercent" :isRising="item.isRising"
-                            @click="viewIndexDetail(item)" />
-                    </view>
-                </view>
-            </view>
-
-            <!-- 底部安全区域 -->
-            <view class="bottom-safe-area"></view>
-        </scroll-view>
+        <view class="header_input_wrapper">
+          <image class="search_icon" src="/static/marketSituation-image/search.png" mode="" @click="onSearchClick"></image>
+          <input class="header_input" type="text" placeholder="搜索" placeholder-style="color: #A6A6A6; font-size: 22rpx;" v-model="searchValue" @input="onSearchInput" @confirm="onSearchConfirm" />
+        </view>
+        <view class="header_icons">
+          <view class="header_icon" @click="selected">
+            <image src="/static/marketSituation-image/mySeclected.png" mode=""></image>
+          </view>
+          <view class="header_icon" @click="history">
+            <image src="/static/marketSituation-image/history.png" mode=""></image>
+          </view>
+        </view>
+      </view>
+      <view class="warn">
+        <image src="/static/marketSituation-image/warn.png" mode="aspectFit"></image>
+        <view class="warn_text_container">
+          <text :class="warnTextClass">{{ $t("marketSituation.warn") }}</text>
+        </view>
+      </view>
     </view>
 
-    <!-- 底部导航栏 -->
-    <footerBar class="static-footer" :type="'marketSituation'"></footerBar>
+    <!-- 内容区域 -->
+    <scroll-view class="content" :style="{ top: contentTopPosition + 'px' }" scroll-y="true">
+      <!-- 亚太-中华 -->
+      <view class="market-section">
+        <view class="market-header">
+          <text class="market-title">亚太-中华</text>
+          <view class="market-more" @click="viewMore('asia-china')">
+            <text class="more-text">查看更多</text>
+            <text class="more-arrow">></text>
+          </view>
+        </view>
+        <view class="cards-grid-three">
+          <view v-for="(item, index) in asiachinaIndexes" :key="index" class="card-item">
+            <IndexCard :flagIcon="item.flagIcon" :stockName="item.stockName" :currentPrice="item.currentPrice" :changeAmount="item.changeAmount" :changePercent="item.changePercent" :isRising="item.isRising" @click="viewIndexDetail(item)" />
+          </view>
+        </view>
+      </view>
+
+      <!-- 亚太 -->
+      <view class="market-section">
+        <view class="market-header">
+          <text class="market-title">亚太</text>
+          <view class="market-more" @click="viewMore('asia')">
+            <text class="more-text">查看更多</text>
+            <text class="more-arrow">></text>
+          </view>
+        </view>
+        <view class="cards-grid-three">
+          <view v-for="(item, index) in asiaIndexes" :key="index" class="card-item">
+            <IndexCard :flagIcon="item.flagIcon" :stockName="item.stockName" :currentPrice="item.currentPrice" :changeAmount="item.changeAmount" :changePercent="item.changePercent" :isRising="item.isRising" @click="viewIndexDetail(item)" />
+          </view>
+        </view>
+      </view>
+
+      <!-- 美洲 -->
+      <view class="market-section">
+        <view class="market-header">
+          <text class="market-title">美洲</text>
+          <view class="market-more" @click="viewMore('america')">
+            <text class="more-text">查看更多</text>
+            <text class="more-arrow">></text>
+          </view>
+        </view>
+        <view class="cards-grid-three">
+          <view v-for="(item, index) in americaIndexes" :key="index" class="card-item">
+            <IndexCard :flagIcon="item.flagIcon" :stockName="item.stockName" :currentPrice="item.currentPrice" :changeAmount="item.changeAmount" :changePercent="item.changePercent" :isRising="item.isRising" @click="viewIndexDetail(item)" />
+          </view>
+        </view>
+      </view>
+
+      <!-- 底部安全区域 -->
+      <view class="bottom-safe-area"></view>
+    </scroll-view>
+  </view>
+
+  <!-- 底部导航栏 -->
+  <footerBar class="static-footer" :type="'marketSituation'"></footerBar>
 </template>
 
 <script setup>
-import { ref, onMounted, computed, nextTick, watch } from 'vue'
-import footerBar from '../../components/footerBar.vue'
-import IndexCard from '../../components/IndexCard.vue'
+import { ref, onMounted, computed, nextTick, watch } from "vue";
+import footerBar from "../../components/footerBar.vue";
+import IndexCard from "../../components/IndexCard.vue";
 
 // 响应式数据
-const iSMT = ref(0) // 状态栏高度
-const contentHeight = ref(0)
-const headerHeight = ref(0) // 头部高度
-const searchValue = ref('') // 搜索值
-const isWarnTextOverflow = ref(false) // warn文字是否溢出
+const iSMT = ref(0); // 状态栏高度
+const contentHeight = ref(0);
+const headerHeight = ref(0); // 头部高度
+const searchValue = ref(""); // 搜索值
+const isWarnTextOverflow = ref(false); // warn文字是否溢出
 
 // warn文字的class计算属性
 const warnTextClass = computed(() => {
-    return isWarnTextOverflow.value ? 'warn_text scroll-active' : 'warn_text'
-})
+  return isWarnTextOverflow.value ? "warn_text scroll-active" : "warn_text";
+});
 
 // 检测warn文字是否溢出
 const checkWarnTextOverflow = () => {
-    nextTick(() => {
-        setTimeout(() => {
-            const query = uni.createSelectorQuery()
-
-            // 同时查询容器和文字元素
-            query.select('.warn_text_container').boundingClientRect()
-            query.select('.warn_text').boundingClientRect()
-            query.exec((res) => {
-                const containerRect = res[0]
-                const textRect = res[1]
-
-                if (!containerRect || !textRect) {
-                    return
-                }
-
-                // 判断文字是否超出容器（留一些余量）
-                const isOverflow = textRect.width > (containerRect.width - 10)
-
-                isWarnTextOverflow.value = isOverflow
-            })
-        }, 500)
-    })
-}
+  nextTick(() => {
+    setTimeout(() => {
+      const query = uni.createSelectorQuery();
+
+      // 同时查询容器和文字元素
+      query.select(".warn_text_container").boundingClientRect();
+      query.select(".warn_text").boundingClientRect();
+      query.exec((res) => {
+        const containerRect = res[0];
+        const textRect = res[1];
+
+        if (!containerRect || !textRect) {
+          return;
+        }
+
+        // 判断文字是否超出容器（留一些余量）
+        const isOverflow = textRect.width > containerRect.width - 10;
+
+        isWarnTextOverflow.value = isOverflow;
+      });
+    }, 500);
+  });
+};
 
 // 亚太-中华指数数据
 const asiachinaIndexes = ref([
-    {
-        flagIcon: '/static/c1.png',
-        indexName: '上证指数',
-        currentPrice: '3933.96',
-        changeAmount: '+24.32',
-        changePercent: '+0.62%',
-        isRising: true
-    },
-    {
-        flagIcon: '/static/c2.png',
-        indexName: '深证成指',
-        currentPrice: '45757.90',
-        changeAmount: '-123.45',
-        changePercent: '-0.27%',
-        isRising: false
-    },
-    {
-        flagIcon: '/static/c3.png',
-        indexName: '创业板指',
-        currentPrice: '6606.08',
-        changeAmount: '+89.76',
-        changePercent: '+1.38%',
-        isRising: true
-    },
-    {
-        flagIcon: '/static/c4.png',
-        indexName: 'HSI50',
-        currentPrice: '22333.96',
-        changeAmount: '+156.78',
-        changePercent: '+0.71%',
-        isRising: true
-    },
-    {
-        flagIcon: '/static/c5.png',
-        indexName: '沪深300',
-        currentPrice: '45757.90',
-        changeAmount: '-89.12',
-        changePercent: '-0.19%',
-        isRising: false
-    },
-    {
-        flagIcon: '/static/c6.png',
-        indexName: '上证50',
-        currentPrice: '45757.90',
-        changeAmount: '+234.56',
-        changePercent: '+0.52%',
-        isRising: true
-    }
-])
+  {
+    flagIcon: "/static/c1.png",
+    stockName: "上证指数",
+    stockCode: "1A0001",
+    currentPrice: "3933.96",
+    changeAmount: "+24.32",
+    changePercent: "+0.62%",
+    isRising: true,
+  },
+  {
+    flagIcon: "/static/c2.png",
+    stockName: "深证成指",
+    stockCode: "2A01",
+    currentPrice: "45757.90",
+    changeAmount: "-123.45",
+    changePercent: "-0.27%",
+    isRising: false,
+  },
+  {
+    flagIcon: "/static/c3.png",
+    stockName: "创业板指",
+    stockCode: "399006",
+    currentPrice: "6606.08",
+    changeAmount: "+89.76",
+    changePercent: "+1.38%",
+    isRising: true,
+  },
+  {
+    flagIcon: "/static/c4.png",
+    stockName: "沪深300",
+    stockCode: "1B0300",
+    currentPrice: "45757.90",
+    changeAmount: "-89.12",
+    changePercent: "-0.19%",
+    isRising: false,
+  },
+  {
+    flagIcon: "/static/c5.png",
+    stockName: "上证50",
+    stockCode: "1B0011",
+    currentPrice: "45757.90",
+    changeAmount: "+234.56",
+    changePercent: "+0.52%",
+    isRising: true,
+  },
+  {
+    flagIcon: "/static/c6.png",
+    stockName: "科创50",
+    stockCode: "1B0688",
+    currentPrice: "22333.96",
+    changeAmount: "+156.78",
+    changePercent: "+0.71%",
+    isRising: true,
+  },
+]);
 
 // 亚太指数数据
 const asiaIndexes = ref([
-    {
-        flagIcon: '/static/c7.png',
-        indexName: '日经225',
-        currentPrice: '28456.78',
-        changeAmount: '+234.56',
-        changePercent: '+0.83%',
-        isRising: true
-    },
-    {
-        flagIcon: '/static/c8.png',
-        indexName: '韩国KOSPI',
-        currentPrice: '2567.89',
-        changeAmount: '-12.34',
-        changePercent: '-0.48%',
-        isRising: false
-    },
-    {
-        flagIcon: '/static/c9.png',
-        indexName: '印度孟买',
-        currentPrice: '65432.10',
-        changeAmount: '+456.78',
-        changePercent: '+0.70%',
-        isRising: true
-    }
-])
+  {
+    flagIcon: "/static/c7.png",
+    stockName: "日经225",
+    stockCode: "noCode",
+    currentPrice: "28456.78",
+    changeAmount: "+234.56",
+    changePercent: "+0.83%",
+    isRising: true,
+  },
+  {
+    flagIcon: "/static/c8.png",
+    stockName: "韩国KOSPI",
+    stockCode: "noCode",
+    currentPrice: "2567.89",
+    changeAmount: "-12.34",
+    changePercent: "-0.48%",
+    isRising: false,
+  },
+  {
+    flagIcon: "/static/c9.png",
+    stockName: "印度孟买",
+    stockCode: "noCode",
+    currentPrice: "65432.10",
+    changeAmount: "+456.78",
+    changePercent: "+0.70%",
+    isRising: true,
+  },
+]);
 
 // 美洲指数数据
 const americaIndexes = ref([
-    {
-        flagIcon: '/static/c7.png',
-        indexName: '道琼斯指数',
-        currentPrice: '34567.89',
-        changeAmount: '+123.45',
-        changePercent: '+0.36%',
-        isRising: true
-    },
-    {
-        flagIcon: '/static/c8.png',
-        indexName: '纳斯达克',
-        currentPrice: '13456.78',
-        changeAmount: '-67.89',
-        changePercent: '-0.50%',
-        isRising: false
-    },
-    {
-        flagIcon: '/static/c9.png',
-        indexName: '标普500',
-        currentPrice: '4234.56',
-        changeAmount: '+23.45',
-        changePercent: '+0.56%',
-        isRising: true
-    }
-])
+  {
+    flagIcon: "/static/c7.png",
+    stockName: "道琼斯指数",
+    stockCode: "noCode",
+    currentPrice: "34567.89",
+    changeAmount: "+123.45",
+    changePercent: "+0.36%",
+    isRising: true,
+  },
+  {
+    flagIcon: "/static/c8.png",
+    stockName: "纳斯达克",
+    stockCode: "noCode",
+    currentPrice: "13456.78",
+    changeAmount: "-67.89",
+    changePercent: "-0.50%",
+    isRising: false,
+  },
+  {
+    flagIcon: "/static/c9.png",
+    stockName: "标普500",
+    stockCode: "noCode",
+    currentPrice: "4234.56",
+    changeAmount: "+23.45",
+    changePercent: "+0.56%",
+    isRising: true,
+  },
+]);
 
 // 计算属性：内容区域顶部位置
 const contentTopPosition = computed(() => {
-    const statusBarHeight = iSMT.value || 0
-    const currentHeaderHeight = headerHeight.value > 0 ? headerHeight.value : 100
-    return statusBarHeight + currentHeaderHeight
-})
+  const statusBarHeight = iSMT.value || 0;
+  const currentHeaderHeight = headerHeight.value > 0 ? headerHeight.value : 100;
+  return statusBarHeight + currentHeaderHeight;
+});
 
 // 方法：返回上一页
 const goBack = () => {
-    uni.navigateBack()
-}
+  uni.navigateBack();
+};
 
 // 方法：搜索输入
 const onSearchInput = (e) => {
-    searchValue.value = e.detail.value
-}
+  searchValue.value = e.detail.value;
+};
 
 // 方法：清除搜索
 const clearSearch = () => {
-    searchValue.value = ''
-}
+  searchValue.value = "";
+};
 
 // 方法：查看更多
 const viewMore = (market) => {
-	console.log('查看更多:', market)
-	uni.navigateTo({
-		url: `/pages/home/marketDetail?market=${market}`
-	})
-}
+  console.log("查看更多:", market);
+  uni.navigateTo({
+    url: `/pages/home/marketDetail?market=${market}`,
+  });
+};
 
 // 方法：查看指数详情
 const viewIndexDetail = (item) => {
-    console.log('查看指数详情:', item.indexName)
-    // uni.showToast({
-    //     title: `查看 ${item.indexName} 详情`,
-    //     icon: 'none',
-    //     duration: 2000
-    // })
-    // 这里可以跳转到具体的指数详情页面
-    uni.navigateTo({
-        url: `/pages/home/marketCondition`
-    })
-}
+  console.log("查看指数详情:", item.stockName);
+  // uni.showToast({
+  //     title: `查看 ${item.stockName} 详情`,
+  //     icon: 'none',
+  //     duration: 2000
+  // })
+  // 这里可以跳转到具体的指数详情页面
+  uni.navigateTo({
+    url: `/pages/home/marketCondition?stockInformation=${encodeURIComponent(JSON.stringify(item))}`,
+  });
+};
 
 // 生命周期：页面挂载
 onMounted(() => {
-    // 获取系统信息
-    const systemInfo = uni.getSystemInfoSync()
-    iSMT.value = systemInfo.statusBarHeight || 0
-
-    console.log('全球指数页面加载完成')
-    // 动态计算header实际高度
-    uni.createSelectorQuery().select('.header_fixed').boundingClientRect((rect) => {
-        if (rect) {
-            headerHeight.value = rect.height
-            console.log('Header实际高度:', headerHeight.value, 'px')
-        }
-    }).exec()
-    // 检测warn文字是否溢出
-    checkWarnTextOverflow()
-})
+  // 获取系统信息
+  const systemInfo = uni.getSystemInfoSync();
+  iSMT.value = systemInfo.statusBarHeight || 0;
+
+  console.log("全球指数页面加载完成");
+  // 动态计算header实际高度
+  uni
+    .createSelectorQuery()
+    .select(".header_fixed")
+    .boundingClientRect((rect) => {
+      if (rect) {
+        headerHeight.value = rect.height;
+        console.log("Header实际高度:", headerHeight.value, "px");
+      }
+    })
+    .exec();
+  // 检测warn文字是否溢出
+  checkWarnTextOverflow();
+});
 
 // 监听headerHeight变化，重新计算contentHeight
 watch(headerHeight, (newHeight) => {
-    if (newHeight > 0) {
-        const systemInfo = uni.getSystemInfoSync()
-        const windowHeight = systemInfo.windowHeight
-        const statusBarHeight = systemInfo.statusBarHeight || 0
-        const footerHeight = 100
-
-        contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight
-        console.log('重新计算contentHeight:', contentHeight.value)
-    }
-})
+  if (newHeight > 0) {
+    const systemInfo = uni.getSystemInfoSync();
+    const windowHeight = systemInfo.windowHeight;
+    const statusBarHeight = systemInfo.statusBarHeight || 0;
+    const footerHeight = 100;
+
+    contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight;
+    console.log("重新计算contentHeight:", contentHeight.value);
+  }
+});
 </script>
 
 <style lang="scss" scoped>
 .main {
-    position: relative;
-    height: 100vh;
-    overflow: hidden;
-    background-color: #f5f5f5;
+  position: relative;
+  height: 100vh;
+  overflow: hidden;
+  background-color: #f5f5f5;
 }
 
 /* 状态栏占位 */
 .top {
-    position: fixed;
-    top: 0;
-    left: 0;
-    right: 0;
-    z-index: 1001;
-    background-color: #ffffff;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1001;
+  background-color: #ffffff;
 }
 
 /* 固定头部样式 */
 .header_fixed {
-    position: fixed;
-    left: 0;
-    right: 0;
-    z-index: 1000;
-    background-color: #ffffff;
-    padding: 20rpx 0 0 0;
-    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+  position: fixed;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  background-color: #ffffff;
+  padding: 20rpx 0 0 0;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
 }
 
 .header_content {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    height: 80rpx;
-    padding: 0 20rpx;
-    margin-bottom: 10rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 80rpx;
+  padding: 0 20rpx;
+  margin-bottom: 10rpx;
 }
 
 .header_back {
-    margin-right: 20rpx;
-    width: 25rpx;
-    height: 30rpx;
+  margin-right: 20rpx;
+  width: 25rpx;
+  height: 30rpx;
 }
 
 .header_back image {
-    width: 25rpx;
-    height: 30rpx;
+  width: 25rpx;
+  height: 30rpx;
 }
 
 .header_input_wrapper {
-    display: flex;
-    align-items: center;
-    width: 100%;
-    margin: 0 20rpx 0 0;
-    height: 70rpx;
-    border-radius: 35rpx;
-    background-color: #ffffff;
-    border: 1rpx solid #e9ecef;
-    padding: 0 80rpx 0 30rpx;
-    font-size: 28rpx;
-    color: #5c5c5c;
-    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+  display: flex;
+  align-items: center;
+  width: 100%;
+  margin: 0 20rpx 0 0;
+  height: 70rpx;
+  border-radius: 35rpx;
+  background-color: #ffffff;
+  border: 1rpx solid #e9ecef;
+  padding: 0 80rpx 0 30rpx;
+  font-size: 28rpx;
+  color: #5c5c5c;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
 }
 
 .search_icon {
-    width: 40rpx;
-    height: 40rpx;
-    opacity: 0.6;
+  width: 40rpx;
+  height: 40rpx;
+  opacity: 0.6;
 }
 
 .header_input {
-    margin-left: 10rpx;
+  margin-left: 10rpx;
 }
 
 .header_icons {
-    display: flex;
-    align-items: center;
-    gap: 15rpx;
+  display: flex;
+  align-items: center;
+  gap: 15rpx;
 }
 
 .header_icon {
-    width: 40rpx;
-    height: 40rpx;
-    display: flex;
-    align-items: center;
-    justify-content: center;
+  width: 40rpx;
+  height: 40rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .header_icon image {
-    width: 40rpx;
-    height: 40rpx;
+  width: 40rpx;
+  height: 40rpx;
 }
 
-
 .warn {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    gap: 10rpx;
-    font-size: 28rpx;
-    color: #666666;
-    padding: 20rpx;
-    max-width: 100%;
-    overflow: hidden;
-    position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 10rpx;
+  font-size: 28rpx;
+  color: #666666;
+  padding: 20rpx;
+  max-width: 100%;
+  overflow: hidden;
+  position: relative;
 }
 
 .warn image {
-    width: 40rpx;
-    height: 40rpx;
-    flex-shrink: 0;
-    /* 防止图片被压缩 */
-    position: relative;
-    z-index: 2;
-    /* 确保图片在最上层 */
+  width: 40rpx;
+  height: 40rpx;
+  flex-shrink: 0;
+  /* 防止图片被压缩 */
+  position: relative;
+  z-index: 2;
+  /* 确保图片在最上层 */
 }
 
 .warn_text_container {
-    flex: 1;
-    overflow: hidden;
-    position: relative;
-    min-width: 0;
-    /* 允许容器收缩 */
+  flex: 1;
+  overflow: hidden;
+  position: relative;
+  min-width: 0;
+  /* 允许容器收缩 */
 }
 
 .warn_text {
-    display: block;
-    white-space: nowrap;
-    will-change: transform;
-    /* 优化动画性能 */
+  display: block;
+  white-space: nowrap;
+  will-change: transform;
+  /* 优化动画性能 */
 }
 
 /* 文字滚动动画 */
 @keyframes scrollText {
-    0% {
-        transform: translateX(0);
-    }
+  0% {
+    transform: translateX(0);
+  }
 
-    20% {
-        transform: translateX(0);
-    }
+  20% {
+    transform: translateX(0);
+  }
 
-    80% {
-        transform: translateX(-85%);
-    }
+  80% {
+    transform: translateX(-85%);
+  }
 
-    100% {
-        transform: translateX(-85%);
-    }
+  100% {
+    transform: translateX(-85%);
+  }
 }
 
 /* 当文字超长时启用滚动动画 */
 .warn_text.scroll-active {
-    animation: scrollText 12s linear infinite;
-    animation-delay: 2s;
-    /* 延迟2秒开始滚动，让用户先看到开头 */
+  animation: scrollText 12s linear infinite;
+  animation-delay: 2s;
+  /* 延迟2秒开始滚动，让用户先看到开头 */
 }
 
 /* 内容区域 */
 .content {
-    position: fixed;
-    left: 0;
-    right: 0;
-    bottom: 120rpx;
-    background-color: #f5f5f5;
-    padding: 0;
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 120rpx;
+  background-color: #f5f5f5;
+  padding: 0;
 }
 
 /* 市场分组 */
 .market-section {
-    background-color: white;
-    border-radius: 20rpx;
+  background-color: white;
+  border-radius: 20rpx;
 }
 
 .market-header {
-    margin: 20rpx 20rpx 0 20rpx;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    margin-bottom: 10rpx;
-    padding-bottom: 10rpx;
-    border-bottom: 2rpx solid #f0f0f0;
+  margin: 20rpx 20rpx 0 20rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 10rpx;
+  padding-bottom: 10rpx;
+  border-bottom: 2rpx solid #f0f0f0;
 }
 
 .market-title {
-    font-size: 32rpx;
-    font-weight: 600;
-    color: #333;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333;
 }
 
 .market-more {
-    display: flex;
-    align-items: center;
-    gap: 8rpx;
+  display: flex;
+  align-items: center;
+  gap: 8rpx;
 }
 
 .more-text {
-    font-size: 24rpx;
-    color: #666;
+  font-size: 24rpx;
+  color: #666;
 }
 
 .more-arrow {
-    font-size: 20rpx;
-    color: #666;
-    font-weight: bold;
+  font-size: 20rpx;
+  color: #666;
+  font-weight: bold;
 }
 
 /* 三列卡片网格 */
 .cards-grid-three {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
 }
 
 .card-item {
-    background-color: white;
-    border-radius: 16rpx;
-    overflow: hidden;
-    transition: transform 0.2s ease, box-shadow 0.2s ease;
+  background-color: white;
+  border-radius: 16rpx;
+  overflow: hidden;
+  transition: transform 0.2s ease, box-shadow 0.2s ease;
 }
 
 .card-item:active {
-    transform: scale(0.98);
-    box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.12);
+  transform: scale(0.98);
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.12);
 }
 
 /* 底部安全区域 */
 .bottom-safe-area {
-    height: 40rpx;
-    background-color: transparent;
+  height: 40rpx;
+  background-color: transparent;
 }
 
 /* 底部导航栏 */
 .static-footer {
-    position: fixed;
-    bottom: 0;
-    left: 0;
-    right: 0;
-    z-index: 1000;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
 }
 
 /* 响应式设计 */
 @media (max-width: 400rpx) {
-    .cards-grid-three {
-        grid-template-columns: repeat(2, 1fr);
-    }
+  .cards-grid-three {
+    grid-template-columns: repeat(2, 1fr);
+  }
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/home/marketCondition.vue b/pages/home/marketCondition.vue
index d61d17d..413d700 100644
--- a/pages/home/marketCondition.vue
+++ b/pages/home/marketCondition.vue
@@ -9,13 +9,11 @@
         <image class="back-homepage-btn" src="/static/marketSituation-image/back.png" mode="返回按钮" @click="backToHomepage()"> </image>
         <view class="mid-title">
           <view class="arrow-left"> </view>
-          <image class="left-page" src="/static/img/left-page.png" mode="向左翻页"></image>
           <view class="stock-id">
             <view class="stock-name"> {{ stockInformation.stockName }} </view>
             <view class="stock-code"> {{ stockInformation.stockCode }} </view>
           </view>
           <view class="arrow-right"> </view>
-          <image class="right-page" src="/static/img/right-page.png" mode="向右翻页"></image>
         </view>
         <image class="search" src="/static/marketSituation-image/search.png" mode="搜索" @click="startTcp()"> </image>
         <view class="more" @click="disconnect()">···</view>
@@ -227,6 +225,7 @@
 
 <script setup>
 import { ref, reactive, computed, onMounted, watch, nextTick, onUnmounted, getCurrentInstance } from "vue";
+import { onLoad } from "@dcloudio/uni-app";
 const instance = getCurrentInstance();
 import { prevClosePrice, timeData as testTimeData, klineData as testKlineData } from "@/common/stockTimeInformation.js";
 import { throttle } from "@/common/util.js";
@@ -1534,6 +1533,52 @@ const startAddDataTimer = () => {
   }, 2000); // 5000毫秒 = 5秒
 };
 
+onLoad((options) => {
+  console.log("页面接收到的参数：", options);
+  
+  // 处理通过data参数传递的复杂对象
+  if (options.data) {
+    try {
+      const stockData = JSON.parse(decodeURIComponent(options.data));
+      console.log("解析的股票数据：", stockData);
+      
+      // 更新stockInformation
+      if (stockData) {
+        stockInformation.value.stockName=stockData.stockName;
+        stockInformation.value.stockCode=stockData.stockCode;
+      }
+    } catch (error) {
+      console.error("解析股票数据失败：", error);
+    }
+  }
+  
+  // 处理通过stockInformation参数传递的数据（兼容globalIndex.vue的传参方式）
+  if (options.stockInformation) {
+    try {
+      const stockData = JSON.parse(decodeURIComponent(options.stockInformation));
+      console.log("解析的股票信息：", stockData);
+      
+      // 更新stockInformation
+      if (stockData) {
+        stockInformation.value = {
+          ...stockInformation.value,
+          ...stockData
+        };
+      }
+    } catch (error) {
+      console.error("解析股票信息失败：", error);
+    }
+  }
+  
+  // 处理简单参数
+  if (options.stockCode) {
+    stockInformation.value.stockCode = options.stockCode;
+  }
+  if (options.stockName) {
+    stockInformation.value.stockName = decodeURIComponent(options.stockName);
+  }
+});
+
 // 保存定时器，用于页面卸载时清理
 onUnmounted(() => {
   // disconnect();
@@ -1883,7 +1928,7 @@ onMounted(async () => {
   display: inline-block;
 }
 
-.arrow-left{
+.arrow-left {
   width: 0;
   height: 0;
   border-top: 10rpx solid transparent;
@@ -1893,7 +1938,7 @@ onMounted(async () => {
   display: inline-block;
 }
 
-.arrow-right{
+.arrow-right {
   width: 0;
   height: 0;
   border-top: 10rpx solid transparent;
@@ -1910,7 +1955,6 @@ onMounted(async () => {
   margin-bottom: 5rpx;
 }
 
-
 .moreTabItem {
   flex: 1;
   padding: 10rpx 20rpx;
diff --git a/pages/home/marketDetail.vue b/pages/home/marketDetail.vue
index a23162a..d3acf86 100644
--- a/pages/home/marketDetail.vue
+++ b/pages/home/marketDetail.vue
@@ -1,471 +1,475 @@
+<!-- @format -->
+
 <template>
-	<view class="main">
-		<!-- 自定义导航栏 -->
-		<view class="header_fixed" :style="{ top: iSMT + 'px' }">
-			<view class="header-content">
-				<view class="header-left" @click="goBack">
-					<text class="back-text">‹</text>
-				</view>
-				<view class="header-center">
-					<text class="header-title">{{ marketTitle }}</text>
-				</view>
-				<view class="header-right">
-					<image src="/static/marketSituation-image/search.png" class="header-icon" mode="aspectFit"></image>
-					<text class="more-text">···</text>
-				</view>
-			</view>
-			<!-- 表头 -->
-			<view class="table-header">
-				<view class="header-item name-column">
-					<text class="header-text">名称</text>
-				</view>
-				<view class="header-item price-column" @click="sortByPrice">
-					<text class="header-text">最新</text>
-					<text class="sort-icon">{{ sortType === 'price' ? (sortOrder === 'asc' ? '↑' : '↓') : '↕' }}</text>
-				</view>
-				<view class="header-item change-column" @click="sortByChange">
-					<text class="header-text">涨幅</text>
-					<text class="sort-icon">{{ sortType === 'change' ? (sortOrder === 'asc' ? '↑' : '↓') : '↕' }}</text>
-				</view>
-			</view>
-		</view>
-
-		<!-- 内容区域 -->
-		<scroll-view class="content" :style="{ top: contentTopPosition + 'px' }" scroll-y="true">
-			
-
-			<!-- 股票列表 -->
-			<view class="stock-list">
-				<view class="stock-row" v-for="(stock, index) in sortedStockList" :key="index"
-					@click="viewStockDetail(stock)">
-					<view class="stock-cell name-column">
-						<view class="stock-name">{{ stock.name }}</view>
-						<view class="stock-code">{{ stock.code }}</view>
-					</view>
-					<view class="stock-cell price-column">
-						<text class="stock-price"
-							:class="stock.isRising ? 'rising' : 'falling'">
-							{{ typeof stock.price === 'number' ? stock.price.toFixed(2) : stock.price }}
-						</text>
-					</view>
-					<view class="stock-cell change-column">
-						<text class="stock-change"
-							:class="stock.isRising ? 'rising' : 'falling'">
-							{{ stock.change || stock.changePercent }}
-						</text>
-					</view>
-				</view>
-			</view>
-
-			<!-- 底部安全区域 -->
-			<!-- <view class="bottom-safe-area"></view> -->
-		</scroll-view>
-	</view>
-
-	<!-- 底部导航栏 -->
-	<!-- <footerBar class="static-footer" :type="'marketSituation'"></footerBar> -->
+  <view class="main">
+    <!-- 自定义导航栏 -->
+    <view class="header_fixed" :style="{ top: iSMT + 'px' }">
+      <view class="header-content">
+        <view class="header-left" @click="goBack">
+          <text class="back-text">‹</text>
+        </view>
+        <view class="header-center">
+          <text class="header-title">{{ marketTitle }}</text>
+        </view>
+        <view class="header-right">
+          <image src="/static/marketSituation-image/search.png" class="header-icon" mode="aspectFit"></image>
+          <text class="more-text">···</text>
+        </view>
+      </view>
+      <!-- 表头 -->
+      <view class="table-header">
+        <view class="header-item name-column">
+          <text class="header-text">名称</text>
+        </view>
+        <view class="header-item price-column" @click="sortByPrice">
+          <text class="header-text">最新</text>
+          <text class="sort-icon">{{ sortType === "price" ? (sortOrder === "asc" ? "↑" : "↓") : "↕" }}</text>
+        </view>
+        <view class="header-item change-column" @click="sortByChange">
+          <text class="header-text">涨幅</text>
+          <text class="sort-icon">{{ sortType === "change" ? (sortOrder === "asc" ? "↑" : "↓") : "↕" }}</text>
+        </view>
+      </view>
+    </view>
+
+    <!-- 内容区域 -->
+    <scroll-view class="content" :style="{ top: contentTopPosition + 'px' }" scroll-y="true">
+      <!-- 股票列表 -->
+      <view class="stock-list">
+        <view class="stock-row" v-for="(stock, index) in sortedStockList" :key="index" @click="viewStockDetail(stock)">
+          <view class="stock-cell name-column">
+            <view class="stock-name">{{ stock.stockName }}</view>
+            <view class="stock-code">{{ stock.stockCode }}</view>
+          </view>
+          <view class="stock-cell price-column">
+            <text class="stock-price" :class="stock.isRising ? 'rising' : 'falling'">
+              {{ typeof stock.price === "number" ? stock.price.toFixed(2) : stock.price }}
+            </text>
+          </view>
+          <view class="stock-cell change-column">
+            <text class="stock-change" :class="stock.isRising ? 'rising' : 'falling'">
+              {{ stock.change || stock.changePercent }}
+            </text>
+          </view>
+        </view>
+      </view>
+
+      <!-- 底部安全区域 -->
+      <!-- <view class="bottom-safe-area"></view> -->
+    </scroll-view>
+  </view>
+
+  <!-- 底部导航栏 -->
+  <!-- <footerBar class="static-footer" :type="'marketSituation'"></footerBar> -->
 </template>
 
 <script setup>
-import { ref, computed, onMounted, watch } from 'vue'
-import { onLoad } from '@dcloudio/uni-app'
-import footerBar from '@/components/footerBar.vue'
+import { ref, computed, onMounted, watch } from "vue";
+import { onLoad } from "@dcloudio/uni-app";
+import footerBar from "@/components/footerBar.vue";
 
 // 响应式数据
-const iSMT = ref(0)
-const headerHeight = ref(80)
-const marketType = ref('america')
-const marketTitle = ref('美洲')
-const sortType = ref('') // 排序类型：'price' 或 'change'
-const sortOrder = ref('desc') // 排序顺序：'asc' 或 'desc'
+const iSMT = ref(0);
+const headerHeight = ref(80);
+const marketType = ref("america");
+const marketTitle = ref("美洲");
+const sortType = ref(""); // 排序类型：'price' 或 'change'
+const sortOrder = ref("desc"); // 排序顺序：'asc' 或 'desc'
 
 // 股票数据
 const stockList = ref([
-	{
-		name: 'Telecommunication',
-		code: '888607',
-		price: 1349.47,
-		change: '+7.67%',
-		isRising: true
-	},
-	{
-		name: 'Other',
-		code: '888607',
-		price: 1349.47,
-		change: '+6.67%',
-		isRising: true
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1349.47,
-		change: '+5.67%',
-		isRising: true
-	},
-	{
-		name: 'Telecommunication',
-		code: '888607',
-		price: 1349.47,
-		change: '+4.67%',
-		isRising: true
-	},
-	{
-		name: 'Other',
-		code: '888611',
-		price: 1359.47,
-		change: '+3.67%',
-		isRising: true
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1349.47,
-		change: '+2.67%',
-		isRising: true
-	},
-	{
-		name: 'Telecommunication',
-		code: '888607',
-		price: 1349.47,
-		change: '+1.67%',
-		isRising: true
-	},
-	{
-		name: 'Other',
-		code: '888611',
-		price: 1009.98,
-		change: '-1.67%',
-		isRising: false
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1009.98,
-		change: '-0.67%',
-		isRising: false
-	},
-	{
-		name: 'Telecommunication',
-		code: '888607',
-		price: 1009.98,
-		change: '-0.67%',
-		isRising: false
-	},
-	{
-		name: 'Other',
-		code: '888611',
-		price: 1009.98,
-		change: '-1.67%',
-		isRising: false
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1009.98,
-		change: '-4.67%',
-		isRising: false
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1009.98,
-		change: '-3.67%',
-		isRising: false
-	},
-	{
-		name: 'Consumer Discretio...',
-		code: '888610',
-		price: 1009.98,
-		change: '-3.67%',
-		isRising: false
-	}
-])
+  {
+    stockName: "Telecommunication",
+    stockCode: "888607",
+    price: 1349.47,
+    change: "+7.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Other",
+    stockCode: "888607",
+    price: 1349.47,
+    change: "+6.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1349.47,
+    change: "+5.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Telecommunication",
+    stockCode: "888607",
+    price: 1349.47,
+    change: "+4.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Other",
+    stockCode: "888611",
+    price: 1359.47,
+    change: "+3.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1349.47,
+    change: "+2.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Telecommunication",
+    stockCode: "888607",
+    price: 1349.47,
+    change: "+1.67%",
+    isRising: true,
+  },
+  {
+    stockName: "Other",
+    stockCode: "888611",
+    price: 1009.98,
+    change: "-1.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1009.98,
+    change: "-0.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Telecommunication",
+    stockCode: "888607",
+    price: 1009.98,
+    change: "-0.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Other",
+    stockCode: "888611",
+    price: 1009.98,
+    change: "-1.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1009.98,
+    change: "-4.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1009.98,
+    change: "-3.67%",
+    isRising: false,
+  },
+  {
+    stockName: "Consumer Discretio...",
+    stockCode: "888610",
+    price: 1009.98,
+    change: "-3.67%",
+    isRising: false,
+  },
+]);
 
 // 计算属性
 const contentTopPosition = computed(() => {
-	return iSMT.value + headerHeight.value
-})
+  return iSMT.value + headerHeight.value;
+});
 
 const sortedStockList = computed(() => {
-	console.log('计算sortedStockList，原始数据长度:', stockList.value.length);
-	let list = [...stockList.value]
-	
-	if (sortType.value === 'price') {
-		list.sort((a, b) => {
-			return sortOrder.value === 'asc' ? a.price - b.price : b.price - a.price
-		})
-	} else if (sortType.value === 'change') {
-		list.sort((a, b) => {
-			const aChange = parseFloat(a.change.replace(/[+%-]/g, ''))
-			const bChange = parseFloat(b.change.replace(/[+%-]/g, ''))
-			return sortOrder.value === 'asc' ? aChange - bChange : bChange - aChange
-		})
-	}
-	
-	console.log('排序后数据长度:', list.length);
-	return list
-})
+  console.log("计算sortedStockList，原始数据长度:", stockList.value.length);
+  let list = [...stockList.value];
+
+  if (sortType.value === "price") {
+    list.sort((a, b) => {
+      return sortOrder.value === "asc" ? a.price - b.price : b.price - a.price;
+    });
+  } else if (sortType.value === "change") {
+    list.sort((a, b) => {
+      const aChange = parseFloat(a.change.replace(/[+%-]/g, ""));
+      const bChange = parseFloat(b.change.replace(/[+%-]/g, ""));
+      return sortOrder.value === "asc" ? aChange - bChange : bChange - aChange;
+    });
+  }
+
+  console.log("排序后数据长度:", list.length);
+  return list;
+});
 
 // 页面加载时接收参数
 onLoad((options) => {
-	if (options && options.market) {
-		marketType.value = options.market
-		switch (options.market) {
-			case 'america':
-				marketTitle.value = '美洲'
-				break
-			case 'asia':
-				marketTitle.value = '亚太'
-				break
-			case 'asia-china':
-				marketTitle.value = '亚太-中华'
-				break
-			default:
-				marketTitle.value = '全球指数'
-		}
-	}
-})
+  if (options && options.market) {
+    marketType.value = options.market;
+    switch (options.market) {
+      case "america":
+        marketTitle.value = "美洲";
+        break;
+      case "asia":
+        marketTitle.value = "亚太";
+        break;
+      case "asia-china":
+        marketTitle.value = "亚太-中华";
+        break;
+      default:
+        marketTitle.value = "全球指数";
+    }
+  }
+});
 
 // 方法
 const goBack = () => {
-	uni.navigateBack()
-}
+  uni.navigateBack();
+};
 
 const sortByPrice = () => {
-	if (sortType.value === 'price') {
-		sortOrder.value = sortOrder.value === 'asc' ? 'desc' : 'asc'
-	} else {
-		sortType.value = 'price'
-		sortOrder.value = 'desc'
-	}
-}
+  if (sortType.value === "price") {
+    sortOrder.value = sortOrder.value === "asc" ? "desc" : "asc";
+  } else {
+    sortType.value = "price";
+    sortOrder.value = "desc";
+  }
+};
 
 const sortByChange = () => {
-	if (sortType.value === 'change') {
-		sortOrder.value = sortOrder.value === 'asc' ? 'desc' : 'asc'
-	} else {
-		sortType.value = 'change'
-		sortOrder.value = 'desc'
-	}
-}
+  if (sortType.value === "change") {
+    sortOrder.value = sortOrder.value === "asc" ? "desc" : "asc";
+  } else {
+    sortType.value = "change";
+    sortOrder.value = "desc";
+  }
+};
 
 const viewStockDetail = (stock) => {
-	console.log('查看股票详情:', stock)
-	// 这里可以跳转到股票详情页面
-}
+  console.log("查看股票详情:", stock);
+  // 这里可以跳转到股票详情页面
+  uni.navigateTo({
+    url: `/pages/home/marketCondition?stockInformation=${encodeURIComponent(JSON.stringify(stock))}`,
+  });
+};
 
 onMounted(() => {
-	// 获取状态栏高度
-	iSMT.value = uni.getSystemInfoSync().statusBarHeight;
-	// 动态计算header实际高度
-    uni.createSelectorQuery().select('.header_fixed').boundingClientRect((rect) => {
-        if (rect) {
-            headerHeight.value = rect.height
-            console.log('Header实际高度:', headerHeight.value, 'px')
-        }
-    }).exec()
-})
+  // 获取状态栏高度
+  iSMT.value = uni.getSystemInfoSync().statusBarHeight;
+  // 动态计算header实际高度
+  uni
+    .createSelectorQuery()
+    .select(".header_fixed")
+    .boundingClientRect((rect) => {
+      if (rect) {
+        headerHeight.value = rect.height;
+        console.log("Header实际高度:", headerHeight.value, "px");
+      }
+    })
+    .exec();
+});
 
 // 监听headerHeight变化，重新计算contentHeight
 watch(headerHeight, (newHeight) => {
-    if (newHeight > 0) {
-        const systemInfo = uni.getSystemInfoSync()
-        const windowHeight = systemInfo.windowHeight
-        const statusBarHeight = systemInfo.statusBarHeight || 0
-        const footerHeight = 100
-
-        contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight
-        console.log('重新计算contentHeight:', contentHeight.value)
-    }
-})
+  if (newHeight > 0) {
+    const systemInfo = uni.getSystemInfoSync();
+    const windowHeight = systemInfo.windowHeight;
+    const statusBarHeight = systemInfo.statusBarHeight || 0;
+    const footerHeight = 100;
+
+    contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight;
+    console.log("重新计算contentHeight:", contentHeight.value);
+  }
+});
 </script>
 
 <style scoped>
 .main {
-	width: 100%;
-	height: 100vh;
-	background-color: #f5f5f5;
-	position: relative;
+  width: 100%;
+  height: 100vh;
+  background-color: #f5f5f5;
+  position: relative;
 }
 
 /* 自定义导航栏 */
 .header_fixed {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	z-index: 1000;
-	background-color: #ffffff;
-	border-bottom: 1px solid #f0f0f0;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  background-color: #ffffff;
+  border-bottom: 1px solid #f0f0f0;
 }
 
 .header-content {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	height: 44px;
-	padding: 0 15px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 44px;
+  padding: 0 15px;
 }
 
 .header-left,
 .header-right {
-	width: 60px;
-	display: flex;
-	align-items: center;
+  width: 60px;
+  display: flex;
+  align-items: center;
 }
 
 .header-left {
-	justify-content: flex-start;
+  justify-content: flex-start;
 }
 
 .header-right {
-	justify-content: flex-end;
-	gap: 10px;
+  justify-content: flex-end;
+  gap: 10px;
 }
 
 .back-text {
-	font-size: 24px;
-	color: #333333;
-	font-weight: 500;
-	line-height: 1;
+  font-size: 24px;
+  color: #333333;
+  font-weight: 500;
+  line-height: 1;
 }
 
 .header-center {
-	flex: 1;
-	display: flex;
-	align-items: center;
-	justify-content: center;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .header-title {
-	font-size: 18px;
-	font-weight: 600;
-	color: #333333;
+  font-size: 18px;
+  font-weight: 600;
+  color: #333333;
 }
 
 .header-icon {
-	width: 20px;
-	height: 20px;
+  width: 20px;
+  height: 20px;
 }
 
 .more-text {
-	font-size: 20px;
-	color: #666666;
-	font-weight: bold;
+  font-size: 20px;
+  color: #666666;
+  font-weight: bold;
 }
 
 /* 内容区域 */
 .content {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background-color: #ffffff;
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: #ffffff;
 }
 
 /* 表头样式 */
 .table-header {
-	display: flex;
-	padding: 12px 15px;
-	background-color: #f8f9fa;
-	border-bottom: 1px solid #e9ecef;
+  display: flex;
+  padding: 12px 15px;
+  background-color: #f8f9fa;
+  border-bottom: 1px solid #e9ecef;
 }
 
 .header-item {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	cursor: pointer;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
 }
 
 .header-item.name-column {
-	flex: 2;
-	justify-content: flex-start;
+  flex: 2;
+  justify-content: flex-start;
 }
 
 .header-item.price-column,
 .header-item.change-column {
-	flex: 1;
-	justify-content: center;
+  flex: 1;
+  justify-content: center;
 }
 
 .header-text {
-	font-size: 14px;
-	color: #666666;
-	font-weight: 500;
+  font-size: 14px;
+  color: #666666;
+  font-weight: 500;
 }
 
 .sort-icon {
-	margin-left: 4px;
-	font-size: 12px;
-	color: #999999;
+  margin-left: 4px;
+  font-size: 12px;
+  color: #999999;
 }
 
 /* 股票列表 */
 .stock-list {
-	background-color: #ffffff;
+  background-color: #ffffff;
 }
 
 .stock-row {
-	display: flex;
-	align-items: center;
-	padding: 12px 15px;
-	border-bottom: 1px solid #f5f5f5;
+  display: flex;
+  align-items: center;
+  padding: 12px 15px;
+  border-bottom: 1px solid #f5f5f5;
 }
 
 .stock-row:active {
-	background-color: #f8f8f8;
+  background-color: #f8f8f8;
 }
 
 .stock-cell {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 
 .stock-cell.name-column {
-	flex: 2;
-	align-items: flex-start;
+  flex: 2;
+  align-items: flex-start;
 }
 
 .stock-cell.price-column,
 .stock-cell.change-column {
-	flex: 1;
-	align-items: center;
+  flex: 1;
+  align-items: center;
 }
 
 .stock-name {
-	font-size: 15px;
-	color: #333333;
-	font-weight: 500;
-	line-height: 1.2;
-	margin-bottom: 2px;
+  font-size: 15px;
+  color: #333333;
+  font-weight: 500;
+  line-height: 1.2;
+  margin-bottom: 2px;
 }
 
 .stock-code {
-	font-size: 11px;
-	color: #999999;
-	line-height: 1.2;
+  font-size: 11px;
+  color: #999999;
+  line-height: 1.2;
 }
 
 .stock-price {
-	font-size: 15px;
-	font-weight: 600;
-	line-height: 1.2;
+  font-size: 15px;
+  font-weight: 600;
+  line-height: 1.2;
 }
 
 .stock-change {
-	font-size: 13px;
-	font-weight: 500;
-	line-height: 1.2;
+  font-size: 13px;
+  font-weight: 500;
+  line-height: 1.2;
 }
 
 .rising {
-	color: #00C851;
+  color: #00c851;
 }
 
 .falling {
-	color: #FF4444;
+  color: #ff4444;
 }
 
 /* 底部安全区域 */
@@ -481,4 +485,4 @@ watch(headerHeight, (newHeight) => {
 	right: 0;
 	z-index: 1000;
 } */
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/home/marketSituation.vue b/pages/home/marketSituation.vue
index 0fe28ee..14f8b75 100644
--- a/pages/home/marketSituation.vue
+++ b/pages/home/marketSituation.vue
@@ -1,898 +1,920 @@
+<!-- @format -->
+
 <template>
-	<view class="main">
-		<!-- 固定头部 -->
-		<view class="header_fixed" :style="{ top: iSMT + 'px' }">
-			<view class="header_content">
-				<view class="header_input_wrapper">
-					<image class="search_icon" src="/static/marketSituation-image/search.png" mode=""
-						@click="onSearchClick"></image>
-					<input class="header_input" type="text" placeholder="搜索"
-						placeholder-style="color: #A6A6A6; font-size: 22rpx;" v-model="searchValue"
-						@input="onSearchInput" @confirm="onSearchConfirm" />
-				</view>
-				<view class="header_icons">
-					<view class="header_icon" @click="selected">
-						<image src="/static/marketSituation-image/mySeclected.png" mode=""></image>
-					</view>
-					<view class="header_icon" @click="history">
-						<image src="/static/marketSituation-image/history.png" mode=""></image>
-					</view>
-				</view>
-			</view>
-			<view class="channel_li" v-if="channelData.length > 0">
-				<scroll-view class="channel_wrap" scroll-x="true" :scroll-into-view="scrollToView"
-					:scroll-with-animation="true" show-scrollbar="false">
-					<view class="channel_innerWrap">
-						<view v-for="(item, index) in channelData" :key="item.id" :id="'nav' + item.id"
-							:class="['channel_item', index === pageIndex ? 'active' : '']" @click="navClick(index)">
-							<text class="channel_text">{{ item.title }}</text>
-							<view v-if="index === pageIndex" class="active_indicator"></view>
-						</view>
-					</view>
-				</scroll-view>
-				<view class="scroll_indicator" @click="channel_more">
-					<image src="/static/marketSituation-image/menu.png" mode="aspectFit"></image>
-				</view>
-			</view>
-		</view>
-
-		<!-- 可滚动内容区域 -->
-		<scroll-view class="content_scroll" scroll-y="true" :style="{ top: contentTopPosition + 'px' }">
-			<view class="content">
-				<view class="map">
-					<image src="/static/marketSituation-image/map.png" mode="widthFix"></image>
-				</view>
-				<view class="global_index">
-					<view class="global_index_title">
-						{{ $t('marketSituation.globalIndex') }}
-					</view>
-					<view class="global_index_more" @click="goToGlobalIndex">
-						<text>{{ $t('marketSituation.globalIndexMore') }}</text>
-						<image src="/static/marketSituation-image/more.png" mode="aspectFit"></image>
-					</view>
-				</view>
-
-				<!-- 卡片网格 -->
-				<view class="cards_grid">
-					<view v-for="(card, index) in cardData" :key="index" class="card_item">
-						<IndexCard :flagIcon="card.flagIcon" :indexName="card.indexName"
-							:currentPrice="card.currentPrice" :changeAmount="card.changeAmount"
-							:changePercent="card.changePercent" :isRising="card.isRising" />
-					</view>
-				</view>
-				<view class="warn">
-					<image src="/static/marketSituation-image/warn.png" mode="aspectFit"></image>
-					<view class="warn_text_container">
-						<text :class="warnTextClass">{{ $t('marketSituation.warn') }}</text>
-					</view>
-				</view>
-				<!-- 底部安全区域，防止被导航栏遮挡 -->
-				<view class="bottom_safe_area"></view>
-			</view>
-		</scroll-view>
-	</view>
-
-	<footerBar class="static-footer" :type="type"></footerBar>
-
-	<!-- 更多tab弹窗 -->
-	<view v-if="showCountryModal" class="modal_overlay" @click="closeModal">
-		<view class="modal_content" @click.stop>
-			<view class="modal_header">
-				<text class="modal_title">全部栏目</text>
-				<view class="modal_close" @click="closeModal">
-					<text>×</text>
-				</view>
-			</view>
-			<view class="modal_body">
-				<view class="country_grid">
-					<view v-for="(country, index) in countryList" :key="index"
-						:class="['country_item', selectedCountry === country ? 'selected' : '']"
-						@click="selectCountry(country)">
-						<text class="country_text">{{ country }}</text>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view class="main">
+    <!-- 固定头部 -->
+    <view class="header_fixed" :style="{ top: iSMT + 'px' }">
+      <view class="header_content">
+        <view class="header_input_wrapper">
+          <image class="search_icon" src="/static/marketSituation-image/search.png" mode="" @click="onSearchClick"></image>
+          <input class="header_input" type="text" placeholder="搜索" placeholder-style="color: #A6A6A6; font-size: 22rpx;" v-model="searchValue" @input="onSearchInput" @confirm="onSearchConfirm" />
+        </view>
+        <view class="header_icons">
+          <view class="header_icon" @click="selected">
+            <image src="/static/marketSituation-image/mySeclected.png" mode=""></image>
+          </view>
+          <view class="header_icon" @click="history">
+            <image src="/static/marketSituation-image/history.png" mode=""></image>
+          </view>
+        </view>
+      </view>
+      <view class="channel_li" v-if="channelData.length > 0">
+        <scroll-view class="channel_wrap" scroll-x="true" :scroll-into-view="scrollToView" :scroll-with-animation="true" show-scrollbar="false">
+          <view class="channel_innerWrap">
+            <view v-for="(item, index) in channelData" :key="item.id" :id="'nav' + item.id" :class="['channel_item', index === pageIndex ? 'active' : '']" @click="navClick(index)">
+              <text class="channel_text">{{ item.title }}</text>
+              <view v-if="index === pageIndex" class="active_indicator"></view>
+            </view>
+          </view>
+        </scroll-view>
+        <view class="scroll_indicator" @click="channel_more">
+          <image src="/static/marketSituation-image/menu.png" mode="aspectFit"></image>
+        </view>
+      </view>
+    </view>
+
+    <!-- 可滚动内容区域 -->
+    <scroll-view class="content_scroll" scroll-y="true" :style="{ top: contentTopPosition + 'px' }">
+      <view class="content">
+        <view class="map">
+          <image src="/static/marketSituation-image/map.png" mode="widthFix"></image>
+        </view>
+        <view class="global_index">
+          <view class="global_index_title">
+            {{ $t("marketSituation.globalIndex") }}
+          </view>
+          <view class="global_index_more" @click="goToGlobalIndex">
+            <text>{{ $t("marketSituation.globalIndexMore") }}</text>
+            <image src="/static/marketSituation-image/more.png" mode="aspectFit"></image>
+          </view>
+        </view>
+
+        <!-- 卡片网格 -->
+        <view class="cards_grid">
+          <view v-for="(card, index) in cardData" :key="index" class="card_item">
+            <IndexCard :flagIcon="card.flagIcon" :stockName="card.stockName" :currentPrice="card.currentPrice" :changeAmount="card.changeAmount" :changePercent="card.changePercent" :isRising="card.isRising" @click="viewIndexDetail(card)" />
+          </view>
+        </view>
+        <view class="warn">
+          <image src="/static/marketSituation-image/warn.png" mode="aspectFit"></image>
+          <view class="warn_text_container">
+            <text :class="warnTextClass">{{ $t("marketSituation.warn") }}</text>
+          </view>
+        </view>
+        <!-- 底部安全区域，防止被导航栏遮挡 -->
+        <view class="bottom_safe_area"></view>
+      </view>
+    </scroll-view>
+  </view>
+
+  <footerBar class="static-footer" :type="type"></footerBar>
+
+  <!-- 更多tab弹窗 -->
+  <view v-if="showCountryModal" class="modal_overlay" @click="closeModal">
+    <view class="modal_content" @click.stop>
+      <view class="modal_header">
+        <text class="modal_title">全部栏目</text>
+        <view class="modal_close" @click="closeModal">
+          <text>×</text>
+        </view>
+      </view>
+      <view class="modal_body">
+        <view class="country_grid">
+          <view v-for="(country, index) in countryList" :key="index" :class="['country_item', selectedCountry === country ? 'selected' : '']" @click="selectCountry(country)">
+            <text class="country_text">{{ country }}</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script setup>
-import { ref, onMounted, watch, nextTick, computed } from 'vue'
-import util from '../../common/util.js'
-import footerBar from '../../components/footerBar.vue'
-import IndexCard from '../../components/IndexCard.vue'
-
-const type = ref('marketSituation')
-const iSMT = ref(0)
-const searchValue = ref('')
-const contentHeight = ref(0)
-const headerHeight = ref(0) // 动态计算的header高度
-const isWarnTextOverflow = ref(false) // warn文字是否溢出
+import { ref, onMounted, watch, nextTick, computed } from "vue";
+import util from "../../common/util.js";
+import footerBar from "../../components/footerBar.vue";
+import IndexCard from "../../components/IndexCard.vue";
+
+const type = ref("marketSituation");
+const iSMT = ref(0);
+const searchValue = ref("");
+const contentHeight = ref(0);
+const headerHeight = ref(0); // 动态计算的header高度
+const isWarnTextOverflow = ref(false); // warn文字是否溢出
 
 // Tab 栏相关数据
 const channelData = ref([
-	{ id: 1, title: '概况' },
-	{ id: 2, title: '新加坡' },
-	{ id: 3, title: '马来西亚' },
-	{ id: 4, title: '印度尼西亚' },
-	{ id: 5, title: '美国' },
-	{ id: 6, title: '中国香港' },
-	{ id: 7, title: '泰国' },
-	{ id: 8, title: '中国' },
-	{ id: 9, title: '加拿大' },
-	{ id: 10, title: '越南' },
-	{ id: 11, title: '外汇' },
-	{ id: 12, title: '贵金属' },
-])
-const pageIndex = ref(0)
-const scrollToView = ref('')
+  { id: 1, title: "概况" },
+  { id: 2, title: "新加坡" },
+  { id: 3, title: "马来西亚" },
+  { id: 4, title: "印度尼西亚" },
+  { id: 5, title: "美国" },
+  { id: 6, title: "中国香港" },
+  { id: 7, title: "泰国" },
+  { id: 8, title: "中国" },
+  { id: 9, title: "加拿大" },
+  { id: 10, title: "越南" },
+  { id: 11, title: "外汇" },
+  { id: 12, title: "贵金属" },
+]);
+const pageIndex = ref(0);
+const scrollToView = ref("");
 
 // 计算属性：精准计算content区域的top值
 const contentTopPosition = computed(() => {
-	const statusBarHeight = iSMT.value || 0
-	const currentHeaderHeight = headerHeight.value > 0 ? headerHeight.value : 140
-	return statusBarHeight + currentHeaderHeight
-})
+  const statusBarHeight = iSMT.value || 0;
+  const currentHeaderHeight = headerHeight.value > 0 ? headerHeight.value : 140;
+  return statusBarHeight + currentHeaderHeight;
+});
 
 // warn文字的class计算属性
 const warnTextClass = computed(() => {
-	return isWarnTextOverflow.value ? 'warn_text scroll-active' : 'warn_text'
-})
+  return isWarnTextOverflow.value ? "warn_text scroll-active" : "warn_text";
+});
 
 // 弹窗相关数据
-const showCountryModal = ref(false)
-const selectedCountry = ref('概况')
-const countryList = ref([
-	'概况', '新加坡', '马来西亚', '印度尼西亚', '美国', '中国香港',
-	'泰国', '中国', '加拿大', '越南', '外汇', '贵金属'
-])
+const showCountryModal = ref(false);
+const selectedCountry = ref("概况");
+const countryList = ref(["概况", "新加坡", "马来西亚", "印度尼西亚", "美国", "中国香港", "泰国", "中国", "加拿大", "越南", "外汇", "贵金属"]);
 
 // 卡片数据
 const cardData = ref([
-	{
-		flagIcon: '🇺🇸',
-		indexName: '道琼斯',
-		currentPrice: '45757.90',
-		changeAmount: '-125.22',
-		changePercent: '-0.27%',
-		isRising: false
-	},
-	{
-		flagIcon: '🇺🇸',
-		indexName: '纳斯达克',
-		currentPrice: '22333.96',
-		changeAmount: '+125.22',
-		changePercent: '+0.47%',
-		isRising: true
-	},
-	{
-		flagIcon: '🇺🇸',
-		indexName: '标普500',
-		currentPrice: '6606.08',
-		changeAmount: '+125.22',
-		changePercent: '+0.27%',
-		isRising: true
-	},
-	{
-		flagIcon: '🇨🇳',
-		indexName: '上证指数',
-		currentPrice: '3333.96',
-		changeAmount: '+125.22',
-		changePercent: '+0.27%',
-		isRising: true
-	},
-	{
-		flagIcon: '🇨🇳',
-		indexName: '科创50',
-		currentPrice: '757.90',
-		changeAmount: '-25.22',
-		changePercent: '-0.27%',
-		isRising: false
-	},
-	{
-		flagIcon: '🇭🇰',
-		indexName: '恒生指数',
-		currentPrice: '19757.90',
-		changeAmount: '-125.22',
-		changePercent: '-0.63%',
-		isRising: false
-	},
-	{
-		flagIcon: '🇸🇬',
-		indexName: '道琼斯',
-		currentPrice: '3757.90',
-		changeAmount: '+85.22',
-		changePercent: '+2.31%',
-		isRising: true
-	},
-	{
-		flagIcon: '🇲🇾',
-		indexName: '纳斯达克',
-		currentPrice: '1657.90',
-		changeAmount: '-15.22',
-		changePercent: '-0.91%',
-		isRising: false
-	},
-	{
-		flagIcon: '🇹🇭',
-		indexName: '标普500',
-		currentPrice: '1457.90',
-		changeAmount: '+35.22',
-		changePercent: '+2.48%',
-		isRising: true
-	}
-])
+  {
+    flagIcon: "🇺🇸",
+    stockName: "道琼斯",
+    stockCode: "DJIA",
+    currentPrice: "45757.90",
+    changeAmount: "-125.22",
+    changePercent: "-0.27%",
+    isRising: false,
+  },
+  {
+    flagIcon: "🇺🇸",
+    stockName: "纳斯达克",
+    stockCode: "NDX",
+    currentPrice: "22333.96",
+    changeAmount: "+125.22",
+    changePercent: "+0.47%",
+    isRising: true,
+  },
+  {
+    flagIcon: "🇺🇸",
+    stockName: "标普500",
+    stockCode: "SPX",
+    currentPrice: "6606.08",
+    changeAmount: "+125.22",
+    changePercent: "+0.27%",
+    isRising: true,
+  },
+  {
+    flagIcon: "🇨🇳",
+    stockName: "上证指数",
+    stockCode: "1A0001",
+    currentPrice: "3333.96",
+    changeAmount: "+125.22",
+    changePercent: "+0.27%",
+    isRising: true,
+  },
+  {
+    flagIcon: "🇨🇳",
+    stockName: "科创50",
+    stockCode: "1B0688",
+    currentPrice: "757.90",
+    changeAmount: "-25.22",
+    changePercent: "-0.27%",
+    isRising: false,
+  },
+  {
+    flagIcon: "🇭🇰",
+    stockName: "恒生指数",
+    stockCode: "HSI",
+    currentPrice: "19757.90",
+    changeAmount: "-125.22",
+    changePercent: "-0.63%",
+    isRising: false,
+  },
+  {
+    flagIcon: "🇸🇬",
+    stockName: "道琼斯",
+    stockCode: "DJIA",
+    currentPrice: "3757.90",
+    changeAmount: "+85.22",
+    changePercent: "+2.31%",
+    isRising: true,
+  },
+  {
+    flagIcon: "🇲🇾",
+    stockName: "纳斯达克",
+    stockCode: "NDX",
+    currentPrice: "1657.90",
+    changeAmount: "-15.22",
+    changePercent: "-0.91%",
+    isRising: false,
+  },
+  {
+    flagIcon: "🇹🇭",
+    stockName: "标普500",
+    stockCode: "SPX",
+    currentPrice: "1457.90",
+    changeAmount: "+35.22",
+    changePercent: "+2.48%",
+    isRising: true,
+  },
+]);
 
 // 搜索输入事件
 const onSearchInput = (e) => {
-	searchValue.value = e.detail.value
-}
+  searchValue.value = e.detail.value;
+};
 
 // 搜索确认事件
 const onSearchConfirm = (e) => {
-	console.log('搜索内容:', e.detail.value)
-	// 这里可以添加搜索逻辑
-	performSearch(e.detail.value)
-}
+  console.log("搜索内容:", e.detail.value);
+  // 这里可以添加搜索逻辑
+  performSearch(e.detail.value);
+};
 
 // 搜索图标点击事件
 const onSearchClick = () => {
-	if (searchValue.value.trim()) {
-		performSearch(searchValue.value)
-	}
-}
+  if (searchValue.value.trim()) {
+    performSearch(searchValue.value);
+  }
+};
 
 // 执行搜索
 const performSearch = (keyword) => {
-	if (!keyword.trim()) {
-		uni.showToast({
-			title: '请输入搜索内容',
-			icon: 'none'
-		})
-		return
-	}
-
-	uni.showToast({
-		title: `搜索: ${keyword}`,
-		icon: 'none'
-	})
-	// 这里添加实际的搜索逻辑
-}
+  if (!keyword.trim()) {
+    uni.showToast({
+      title: "请输入搜索内容",
+      icon: "none",
+    });
+    return;
+  }
+
+  uni.showToast({
+    title: `搜索: ${keyword}`,
+    icon: "none",
+  });
+  // 这里添加实际的搜索逻辑
+};
 
 // 我的收藏点击事件
 const selected = () => {
-	uni.showToast({
-		title: '我的收藏',
-		icon: 'none'
-	})
-	// 这里可以跳转到收藏页面
-}
+  uni.showToast({
+    title: "我的收藏",
+    icon: "none",
+  });
+  // 这里可以跳转到收藏页面
+};
 
 // 历史记录点击事件
 const history = () => {
-	uni.showToast({
-		title: '历史记录',
-		icon: 'none'
-	})
-	// 这里可以跳转到历史页面
-}
+  uni.showToast({
+    title: "历史记录",
+    icon: "none",
+  });
+  // 这里可以跳转到历史页面
+};
 
 // Tab 栏点击事件
 const navClick = (index) => {
-	pageIndex.value = index
-	const currentItem = channelData.value[index]
-	scrollToView.value = 'nav' + currentItem.id
+  pageIndex.value = index;
+  const currentItem = channelData.value[index];
+  scrollToView.value = "nav" + currentItem.id;
 
-	// 同步更新弹窗中的选中状态
-	selectedCountry.value = currentItem.title
+  // 同步更新弹窗中的选中状态
+  selectedCountry.value = currentItem.title;
 
-	uni.showToast({
-		title: `切换到: ${currentItem.title}`,
-		icon: 'none'
-	})
+  uni.showToast({
+    title: `切换到: ${currentItem.title}`,
+    icon: "none",
+  });
 
-	// 这里可以添加切换 tab 后的数据加载逻辑
-	console.log('当前选中的 tab:', currentItem)
-}
+  // 这里可以添加切换 tab 后的数据加载逻辑
+  console.log("当前选中的 tab:", currentItem);
+};
 
 // 更多选项点击事件
 const channel_more = () => {
-	showCountryModal.value = true
-}
+  showCountryModal.value = true;
+};
 
 // 选择国家
 const selectCountry = (country) => {
-	selectedCountry.value = country
-
-	// 查找对应的tab索引
-	const targetIndex = channelData.value.findIndex(item => item.title === country)
-
-	if (targetIndex !== -1) {
-		// 同步更新页面tab
-		pageIndex.value = targetIndex
-		const currentItem = channelData.value[targetIndex]
-		scrollToView.value = 'nav' + currentItem.id
-
-		console.log('选中了：' + country + '，同步到tab索引：' + targetIndex)
-		uni.showToast({
-			title: '已切换到：' + country,
-			icon: 'none',
-			duration: 2000
-		})
-	} else {
-		// 如果是"概况"或其他特殊选项，默认切换到第一个tab
-		if (country === '概况' || country === '全部') {
-			pageIndex.value = 0
-			scrollToView.value = 'nav' + channelData.value[0].id
-		}
-
-		console.log('选中了：' + country)
-		uni.showToast({
-			title: '已选择：' + country,
-			icon: 'none',
-			duration: 2000
-		})
-	}
-
-	// 这里可以添加切换到对应国家/地区数据的逻辑
-	// 例如：loadMarketData(country)
-	closeModal()
-}
+  selectedCountry.value = country;
+
+  // 查找对应的tab索引
+  const targetIndex = channelData.value.findIndex((item) => item.title === country);
+
+  if (targetIndex !== -1) {
+    // 同步更新页面tab
+    pageIndex.value = targetIndex;
+    const currentItem = channelData.value[targetIndex];
+    scrollToView.value = "nav" + currentItem.id;
+
+    console.log("选中了：" + country + "，同步到tab索引：" + targetIndex);
+    uni.showToast({
+      title: "已切换到：" + country,
+      icon: "none",
+      duration: 2000,
+    });
+  } else {
+    // 如果是"概况"或其他特殊选项，默认切换到第一个tab
+    if (country === "概况" || country === "全部") {
+      pageIndex.value = 0;
+      scrollToView.value = "nav" + channelData.value[0].id;
+    }
+
+    console.log("选中了：" + country);
+    uni.showToast({
+      title: "已选择：" + country,
+      icon: "none",
+      duration: 2000,
+    });
+  }
+
+  // 这里可以添加切换到对应国家/地区数据的逻辑
+  // 例如：loadMarketData(country)
+  closeModal();
+};
 
 // 关闭弹窗
 const closeModal = () => {
-	showCountryModal.value = false
-}
+  showCountryModal.value = false;
+};
 
 // 检测warn文字是否溢出
 const checkWarnTextOverflow = () => {
-	nextTick(() => {
-		setTimeout(() => {
-			const query = uni.createSelectorQuery()
-
-			// 同时查询容器和文字元素
-			query.select('.warn_text_container').boundingClientRect()
-			query.select('.warn_text').boundingClientRect()
-			query.exec((res) => {
-				const containerRect = res[0]
-				const textRect = res[1]
-
-				if (!containerRect || !textRect) {
-					return
-				}
-
-				// 判断文字是否超出容器（留一些余量）
-				const isOverflow = textRect.width > (containerRect.width - 10)
-
-				isWarnTextOverflow.value = isOverflow
-			})
-		}, 500)
-	})
-}
+  nextTick(() => {
+    setTimeout(() => {
+      const query = uni.createSelectorQuery();
+
+      // 同时查询容器和文字元素
+      query.select(".warn_text_container").boundingClientRect();
+      query.select(".warn_text").boundingClientRect();
+      query.exec((res) => {
+        const containerRect = res[0];
+        const textRect = res[1];
+
+        if (!containerRect || !textRect) {
+          return;
+        }
+
+        // 判断文字是否超出容器（留一些余量）
+        const isOverflow = textRect.width > containerRect.width - 10;
+
+        isWarnTextOverflow.value = isOverflow;
+      });
+    }, 500);
+  });
+};
 
 // 跳转到全球指数页面
 const goToGlobalIndex = () => {
-	uni.navigateTo({
-		url: '/pages/home/globalIndex'
-	})
-}
+  uni.navigateTo({
+    url: "/pages/home/globalIndex",
+  });
+};
+
+// 方法：查看指数详情
+const viewIndexDetail = (item) => {
+  console.log("查看指数详情:", item.stockName);
+  // uni.showToast({
+  //     title: `查看 ${item.stockName} 详情`,
+  //     icon: 'none',
+  //     duration: 2000
+  // })
+  // 这里可以跳转到具体的指数详情页面
+  uni.navigateTo({
+    url: `/pages/home/marketCondition?stockInformation=${encodeURIComponent(JSON.stringify(item))}`,
+  });
+};
 
 onMounted(() => {
-	// 状态栏高度
-	iSMT.value = uni.getSystemInfoSync().statusBarHeight;
-
-	// 初始化 tab 栏
-	if (channelData.value.length > 0) {
-		pageIndex.value = 0
-		scrollToView.value = 'nav' + channelData.value[0].id
-	}
-
-	util.request('link/api/brain/privilege', (res) => {
-			console.log(res)
-	},{
-		'token': '9ior41AF0xTIbIG2pRnnbZi0+fEeMx8pywnIlrmTwo5FbqJ9lWrSWOxp9MkpKiNtedtUafqvzIwpFKrwuMs'
-	}, (err) => {
-		console.log(err)
-	})
-
-	// 确保DOM渲染完成后再查询高度
-	nextTick(() => {
-		// 动态计算header实际高度
-		uni.createSelectorQuery().select('.header_fixed').boundingClientRect((rect) => {
-			if (rect) {
-				headerHeight.value = rect.height
-				console.log('Header实际高度:', headerHeight.value, 'px')
-			}
-		}).exec()
-
-		// 检测warn文字是否溢出
-		checkWarnTextOverflow()
-	})
-})
+  // 状态栏高度
+  iSMT.value = uni.getSystemInfoSync().statusBarHeight;
+
+  // 初始化 tab 栏
+  if (channelData.value.length > 0) {
+    pageIndex.value = 0;
+    scrollToView.value = "nav" + channelData.value[0].id;
+  }
+
+  util.request(
+    "link/api/brain/privilege",
+    (res) => {
+      console.log(res);
+    },
+    {
+      token: "9ior41AF0xTIbIG2pRnnbZi0+fEeMx8pywnIlrmTwo5FbqJ9lWrSWOxp9MkpKiNtedtUafqvzIwpFKrwuMs",
+    },
+    (err) => {
+      console.log(err);
+    }
+  );
+
+  // 确保DOM渲染完成后再查询高度
+  nextTick(() => {
+    // 动态计算header实际高度
+    uni
+      .createSelectorQuery()
+      .select(".header_fixed")
+      .boundingClientRect((rect) => {
+        if (rect) {
+          headerHeight.value = rect.height;
+          console.log("Header实际高度:", headerHeight.value, "px");
+        }
+      })
+      .exec();
+
+    // 检测warn文字是否溢出
+    checkWarnTextOverflow();
+  });
+});
 
 // 监听headerHeight变化，重新计算contentHeight
 watch(headerHeight, (newHeight) => {
-	if (newHeight > 0) {
-		const systemInfo = uni.getSystemInfoSync()
-		const windowHeight = systemInfo.windowHeight
-		const statusBarHeight = systemInfo.statusBarHeight || 0
-		const footerHeight = 100
-
-		contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight
-		console.log('重新计算contentHeight:', contentHeight.value)
-	}
-})
+  if (newHeight > 0) {
+    const systemInfo = uni.getSystemInfoSync();
+    const windowHeight = systemInfo.windowHeight;
+    const statusBarHeight = systemInfo.statusBarHeight || 0;
+    const footerHeight = 100;
+
+    contentHeight.value = windowHeight - statusBarHeight - newHeight - footerHeight;
+    console.log("重新计算contentHeight:", contentHeight.value);
+  }
+});
 </script>
 
 <style scoped>
 /* 状态栏占位 */
 .top {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	z-index: 1001;
-	background-color: #ffffff;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1001;
+  background-color: #ffffff;
 }
 
 /* 固定头部样式 */
 .header_fixed {
-	position: fixed;
-	left: 0;
-	right: 0;
-	z-index: 1000;
-	background-color: #ffffff;
-	padding: 20rpx 0 0 0;
-	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+  position: fixed;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  background-color: #ffffff;
+  padding: 20rpx 0 0 0;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
 }
 
 /* 可滚动内容区域 */
 .content_scroll {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 100rpx;
-	/* 底部导航栏高度 */
-	overflow-y: auto;
+  position: fixed;
+  left: 0;
+  right: 0;
+  bottom: 100rpx;
+  /* 底部导航栏高度 */
+  overflow-y: auto;
 }
 
 .header_content {
-	display: flex;
-	align-items: center;
-	justify-content: space-between;
-	height: 80rpx;
-	padding: 0 20rpx;
-	margin-bottom: 10rpx;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  height: 80rpx;
+  padding: 0 20rpx;
+  margin-bottom: 10rpx;
 }
 
 .header_input_wrapper {
-	display: flex;
-	align-items: center;
-	width: 100%;
-	margin: 0 20rpx 0 0;
-	height: 70rpx;
-	border-radius: 35rpx;
-	background-color: #ffffff;
-	border: 1rpx solid #e9ecef;
-	padding: 0 80rpx 0 30rpx;
-	font-size: 28rpx;
-	color: #5c5c5c;
-	box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
+  display: flex;
+  align-items: center;
+  width: 100%;
+  margin: 0 20rpx 0 0;
+  height: 70rpx;
+  border-radius: 35rpx;
+  background-color: #ffffff;
+  border: 1rpx solid #e9ecef;
+  padding: 0 80rpx 0 30rpx;
+  font-size: 28rpx;
+  color: #5c5c5c;
+  box-shadow: 0 2rpx 8rpx rgba(0, 0, 0, 0.1);
 }
 
 .search_icon {
-	width: 40rpx;
-	height: 40rpx;
-	opacity: 0.6;
+  width: 40rpx;
+  height: 40rpx;
+  opacity: 0.6;
 }
 
 .header_input {
-	margin-left: 10rpx;
+  margin-left: 10rpx;
 }
 
 .header_icons {
-	display: flex;
-	align-items: center;
-	gap: 15rpx;
+  display: flex;
+  align-items: center;
+  gap: 15rpx;
 }
 
 .header_icon {
-	width: 40rpx;
-	height: 40rpx;
-	display: flex;
-	align-items: center;
-	justify-content: center;
+  width: 40rpx;
+  height: 40rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .header_icon image {
-	width: 40rpx;
-	height: 40rpx;
+  width: 40rpx;
+  height: 40rpx;
 }
 
 /* Tab 栏样式 */
 .channel_li {
-	display: flex;
-	align-items: center;
-	height: 80rpx;
-	background-color: #ffffff;
-	border-bottom: 1rpx solid #f0f0f0;
+  display: flex;
+  align-items: center;
+  height: 80rpx;
+  background-color: #ffffff;
+  border-bottom: 1rpx solid #f0f0f0;
 }
 
 .channel_wrap {
-	width: calc(100% - 60rpx);
-	height: 100%;
-	overflow: hidden;
-	flex-shrink: 0;
+  width: calc(100% - 60rpx);
+  height: 100%;
+  overflow: hidden;
+  flex-shrink: 0;
 }
 
 .channel_innerWrap {
-	display: flex;
-	align-items: center;
-	height: 100%;
-	padding: 0 20rpx;
-	white-space: nowrap;
+  display: flex;
+  align-items: center;
+  height: 100%;
+  padding: 0 20rpx;
+  white-space: nowrap;
 }
 
 .channel_item {
-	position: relative;
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	justify-content: center;
-	height: 60rpx;
-	padding: 0 20rpx;
-	border-radius: 30rpx;
-	transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-	cursor: pointer;
-	white-space: nowrap;
-	flex-shrink: 0;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  height: 60rpx;
+  padding: 0 20rpx;
+  border-radius: 30rpx;
+  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+  cursor: pointer;
+  white-space: nowrap;
+  flex-shrink: 0;
 }
 
 .channel_item:active {
-	transform: scale(0.98);
+  transform: scale(0.98);
 }
 
 .channel_item.active {
-	color: #333;
-	font-weight: bold;
+  color: #333;
+  font-weight: bold;
 }
 
 .channel_text {
-	font-size: 28rpx;
-	font-weight: 500;
-	color: #666666;
-	transition: color 0.3s ease;
-	white-space: nowrap;
+  font-size: 28rpx;
+  font-weight: 500;
+  color: #666666;
+  transition: color 0.3s ease;
+  white-space: nowrap;
 }
 
 .channel_item.active .channel_text {
-	color: #333333;
-	font-weight: 400;
-	z-index: 2;
+  color: #333333;
+  font-weight: 400;
+  z-index: 2;
 }
 
 .active_indicator {
-	position: absolute;
-	left: 50%;
-	top: 60%;
-	transform: translateX(-45%);
-	width: calc(100% - 20rpx);
-	min-width: 40rpx;
-	max-width: 120rpx;
-	height: 8rpx;
-	background-image: url('/static/marketSituation-image/bg.png');
-	background-size: cover;
-	background-position: center;
-	background-repeat: no-repeat;
-	animation: slideIn 0.1s ease;
-	border-radius: 8rpx;
-	z-index: 1;
+  position: absolute;
+  left: 50%;
+  top: 60%;
+  transform: translateX(-45%);
+  width: calc(100% - 20rpx);
+  min-width: 40rpx;
+  max-width: 120rpx;
+  height: 8rpx;
+  background-image: url("/static/marketSituation-image/bg.png");
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat;
+  animation: slideIn 0.1s ease;
+  border-radius: 8rpx;
+  z-index: 1;
 }
 
 @keyframes slideIn {
-	from {
-		width: 0;
-		opacity: 0;
-	}
+  from {
+    width: 0;
+    opacity: 0;
+  }
 
-	to {
-		width: 40rpx;
-		opacity: 1;
-	}
+  to {
+    width: 40rpx;
+    opacity: 1;
+  }
 }
 
 .scroll_indicator {
-	border-left: 1rpx solid #b6b6b6;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	width: 60rpx;
-	height: 30rpx;
-	background-color: #ffffff;
-	flex-shrink: 0;
+  border-left: 1rpx solid #b6b6b6;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 60rpx;
+  height: 30rpx;
+  background-color: #ffffff;
+  flex-shrink: 0;
 }
 
 .scroll_indicator image {
-	width: 20rpx;
-	height: 20rpx;
-	opacity: 0.5;
+  width: 20rpx;
+  height: 20rpx;
+  opacity: 0.5;
 }
 
 .content {
-	margin-top: 20rpx;
-	background-color: white;
+  margin-top: 20rpx;
+  background-color: white;
 }
 
 .map {
-	width: calc(100% - 60rpx);
-	margin: 0 30rpx;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	background-color: #F3F3F3;
-	border-radius: 30rpx;
-	border: 1rpx solid #E0E0E0;
-	padding: 30rpx 20rpx;
-	box-sizing: border-box;
-	/* 设置最小高度保护，但允许内容撑开 */
-	min-height: 200rpx;
+  width: calc(100% - 60rpx);
+  margin: 0 30rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #f3f3f3;
+  border-radius: 30rpx;
+  border: 1rpx solid #e0e0e0;
+  padding: 30rpx 20rpx;
+  box-sizing: border-box;
+  /* 设置最小高度保护，但允许内容撑开 */
+  min-height: 200rpx;
 }
 
 .map image {
-	width: 100%;
-	height: auto;
-	max-width: 100%;
-	display: block;
-	/* widthFix模式下，高度会自动按比例调整 */
-	/* 设置最大高度避免图片过大 */
-	max-height: 60vh;
-	/* 添加平滑过渡效果 */
-	transition: all 0.3s ease;
-	max-height: 60vh;
+  width: 100%;
+  height: auto;
+  max-width: 100%;
+  display: block;
+  /* widthFix模式下，高度会自动按比例调整 */
+  /* 设置最大高度避免图片过大 */
+  max-height: 60vh;
+  /* 添加平滑过渡效果 */
+  transition: all 0.3s ease;
+  max-height: 60vh;
 }
 
 /* 响应式优化 */
 @media screen and (max-width: 750rpx) {
-	.map {
-		margin: 0 20rpx;
-		width: calc(100% - 40rpx);
-		padding: 20rpx 15rpx;
-	}
+  .map {
+    margin: 0 20rpx;
+    width: calc(100% - 40rpx);
+    padding: 20rpx 15rpx;
+  }
 }
 
 @media screen and (max-width: 480rpx) {
-	.map {
-		margin: 0 15rpx;
-		width: calc(100% - 30rpx);
-		padding: 15rpx 10rpx;
-	}
+  .map {
+    margin: 0 15rpx;
+    width: calc(100% - 30rpx);
+    padding: 15rpx 10rpx;
+  }
 }
 
 .static-footer {
-	position: fixed;
-	bottom: 0;
+  position: fixed;
+  bottom: 0;
 }
 
 /* 弹窗样式 */
 .modal_overlay {
-	position: fixed;
-	top: 0;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	background-color: rgba(0, 0, 0, 0.5);
-	display: flex;
-	align-items: flex-end;
-	z-index: 1000;
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+  display: flex;
+  align-items: flex-end;
+  z-index: 1000;
 }
 
 .modal_content {
-	width: 100%;
-	background-color: #fff;
-	border-radius: 20rpx 20rpx 0 0;
-	max-height: 80vh;
-	overflow: hidden;
+  width: 100%;
+  background-color: #fff;
+  border-radius: 20rpx 20rpx 0 0;
+  max-height: 80vh;
+  overflow: hidden;
 }
 
 .modal_header {
-	position: relative;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	padding: 30rpx 40rpx;
-	border-bottom: 1rpx solid #f0f0f0;
+  position: relative;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding: 30rpx 40rpx;
+  border-bottom: 1rpx solid #f0f0f0;
 }
 
 .modal_title {
-	font-size: 32rpx;
-	font-weight: bold;
-	color: #333333;
-	text-align: center;
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333333;
+  text-align: center;
 }
 
 .modal_close {
-	position: absolute;
-	right: 40rpx;
-	top: 50%;
-	transform: translateY(-50%);
-	width: 60rpx;
-	height: 60rpx;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	font-size: 40rpx;
-	color: #999;
+  position: absolute;
+  right: 40rpx;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 60rpx;
+  height: 60rpx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 40rpx;
+  color: #999;
 }
 
 .modal_body {
-	padding: 40rpx;
+  padding: 40rpx;
 }
 
 .country_grid {
-	display: grid;
-	grid-template-columns: 1fr 1fr;
-	gap: 20rpx;
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  gap: 20rpx;
 }
 
 .country_item {
-	padding: 24rpx 30rpx;
-	border-radius: 12rpx;
-	background-color: #f8f8f8;
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	transition: all 0.3s ease;
+  padding: 24rpx 30rpx;
+  border-radius: 12rpx;
+  background-color: #f8f8f8;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  transition: all 0.3s ease;
 }
 
 .country_item.selected {
-	background-color: #ff4444;
-	color: #fff;
+  background-color: #ff4444;
+  color: #fff;
 }
 
 .country_text {
-	font-size: 28rpx;
-	color: #333;
+  font-size: 28rpx;
+  color: #333;
 }
 
 .country_item.selected .country_text {
-	color: #fff;
+  color: #fff;
 }
 
 .global_index {
-	margin: 30rpx 20rpx 0 20rpx;
-	display: flex;
-	justify-content: space-between;
+  margin: 30rpx 20rpx 0 20rpx;
+  display: flex;
+  justify-content: space-between;
 }
 
 .global_index_title {
-	margin-left: 20rpx;
-	font-size: 40rpx;
-	font-weight: 100;
-	color: #333333;
-	align-items: center;
+  margin-left: 20rpx;
+  font-size: 40rpx;
+  font-weight: 100;
+  color: #333333;
+  align-items: center;
 }
 
 .global_index_more {
-	display: flex;
-	gap: 10rpx;
-	font-size: 28rpx;
-	color: #333333;
-	align-items: center;
+  display: flex;
+  gap: 10rpx;
+  font-size: 28rpx;
+  color: #333333;
+  align-items: center;
 }
 
 .global_index_more image {
-	width: 40rpx;
-	height: 40rpx;
-	align-items: center;
+  width: 40rpx;
+  height: 40rpx;
+  align-items: center;
 }
 
 /* 卡片网格样式 */
 .cards_grid {
-	display: grid;
-	grid-template-columns: repeat(3, 1fr);
-	margin: 0;
-	box-sizing: border-box;
-	width: 100%;
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  margin: 0;
+  box-sizing: border-box;
+  width: 100%;
 }
 
 .card_item {
-	width: 100%;
-	box-sizing: border-box;
-	min-width: 0;
-	/* 防止内容溢出 */
+  width: 100%;
+  box-sizing: border-box;
+  min-width: 0;
+  /* 防止内容溢出 */
 }
 
 /* 响应式布局 - 小屏幕时改为两列 */
 @media (max-width: 600rpx) {
-	.cards_grid {
-		grid-template-columns: repeat(2, 1fr);
-		padding: 30rpx 20rpx;
-	}
+  .cards_grid {
+    grid-template-columns: repeat(2, 1fr);
+    padding: 30rpx 20rpx;
+  }
 }
 
 /* 超小屏幕时改为单列 */
 @media (max-width: 400rpx) {
-	.cards_grid {
-		grid-template-columns: 1fr;
-		padding: 30rpx 20rpx;
-	}
+  .cards_grid {
+    grid-template-columns: 1fr;
+    padding: 30rpx 20rpx;
+  }
 }
 
 .warn {
-	display: flex;
-	align-items: center;
-	justify-content: flex-start;
-	gap: 10rpx;
-	font-size: 28rpx;
-	color: #666666;
-	padding: 20rpx;
-	max-width: 100%;
-	overflow: hidden;
-	position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  gap: 10rpx;
+  font-size: 28rpx;
+  color: #666666;
+  padding: 20rpx;
+  max-width: 100%;
+  overflow: hidden;
+  position: relative;
 }
 
 .warn image {
-	width: 40rpx;
-	height: 40rpx;
-	flex-shrink: 0;
-	/* 防止图片被压缩 */
-	position: relative;
-	z-index: 2;
-	/* 确保图片在最上层 */
+  width: 40rpx;
+  height: 40rpx;
+  flex-shrink: 0;
+  /* 防止图片被压缩 */
+  position: relative;
+  z-index: 2;
+  /* 确保图片在最上层 */
 }
 
 .warn_text_container {
-	flex: 1;
-	overflow: hidden;
-	position: relative;
-	min-width: 0;
-	/* 允许容器收缩 */
+  flex: 1;
+  overflow: hidden;
+  position: relative;
+  min-width: 0;
+  /* 允许容器收缩 */
 }
 
 .warn_text {
-	display: block;
-	white-space: nowrap;
-	will-change: transform;
-	/* 优化动画性能 */
+  display: block;
+  white-space: nowrap;
+  will-change: transform;
+  /* 优化动画性能 */
 }
 
 /* 文字滚动动画 */
 @keyframes scrollText {
-	0% {
-		transform: translateX(0);
-	}
+  0% {
+    transform: translateX(0);
+  }
 
-	20% {
-		transform: translateX(0);
-	}
+  20% {
+    transform: translateX(0);
+  }
 
-	80% {
-		transform: translateX(-85%);
-	}
+  80% {
+    transform: translateX(-85%);
+  }
 
-	100% {
-		transform: translateX(-85%);
-	}
+  100% {
+    transform: translateX(-85%);
+  }
 }
 
 /* 当文字超长时启用滚动动画 */
 .warn_text.scroll-active {
-	animation: scrollText 12s linear infinite;
-	animation-delay: 2s;
-	/* 延迟2秒开始滚动，让用户先看到开头 */
+  animation: scrollText 12s linear infinite;
+  animation-delay: 2s;
+  /* 延迟2秒开始滚动，让用户先看到开头 */
 }
 
 /* 底部安全区域 */
 .bottom_safe_area {
-	height: 40rpx;
-	background-color: transparent;
+  height: 40rpx;
+  background-color: transparent;
 }
 
 /* 主容器样式调整 */
 .main {
-	position: relative;
-	height: 100vh;
-	overflow: hidden;
-	background-color: white;
+  position: relative;
+  height: 100vh;
+  overflow: hidden;
+  background-color: white;
 }
-</style>
\ No newline at end of file
+</style>