页面“更多”国际化

package-lock.json

@@ -25,7 +25,9 @@
         "@dcloudio/uni-mp-xhs": "3.0.0-4070520250711001",
         "@dcloudio/uni-quickapp-webview": "3.0.0-4070520250711001",
         "@dcloudio/uni-ui": "^1.5.10",
+        "@qiun/ucharts": "^2.5.0-20230101",
         "echarts": "^6.0.0",
+        "mpvue-echarts": "^1.0.0",
         "vue": "^3.4.21",
         "vue-i18n": "^9.14.5"
       },
@@ -3877,7 +3879,6 @@
       "version": "2.5.1",
       "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.1.tgz",
       "integrity": "sha512-dfUnCxiN9H4ap84DvD2ubjw+3vUNpstxa0TneY/Paat8a3R4uQZDLSvWjmznAY/DoahqTHl9V46HF/Zs3F29pg==",
-      "dev": true,
       "hasInstallScript": true,
       "license": "MIT",
       "optional": true,
@@ -3917,7 +3918,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3938,7 +3938,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3959,7 +3958,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -3980,7 +3978,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4001,7 +3998,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4022,7 +4018,6 @@
       "cpu": [
         "arm"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4043,7 +4038,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4064,7 +4058,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4085,7 +4078,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4106,7 +4098,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4127,7 +4118,6 @@
       "cpu": [
         "arm64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4148,7 +4138,6 @@
       "cpu": [
         "ia32"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4169,7 +4158,6 @@
       "cpu": [
         "x64"
       ],
-      "dev": true,
       "license": "MIT",
       "optional": true,
       "os": [
@@ -4183,6 +4171,12 @@
         "url": "https://opencollective.com/parcel"
       }
     },
+    "node_modules/@qiun/ucharts": {
+      "version": "2.5.0-20230101",
+      "resolved": "https://registry.npmjs.org/@qiun/ucharts/-/ucharts-2.5.0-20230101.tgz",
+      "integrity": "sha512-C7ccBgfPuGF6dxTRuMW0NPPMSCf1k/kh3I9zkRVBc5PaivudX/rPL+jd2Wty6gn5ya5L3Ob+YmYe09V5xw66Cw==",
+      "license": "Apache"
+    },
     "node_modules/@rollup/pluginutils": {
       "version": "5.2.0",
       "resolved": "https://registry.npmjs.org/@rollup/pluginutils/-/pluginutils-5.2.0.tgz",
@@ -6446,7 +6440,6 @@
       "version": "1.0.3",
       "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz",
       "integrity": "sha512-pGjwhsmsp4kL2RTz08wcOlGN83otlqHeD/Z5T8GXZB+/YcpQ/dgo+lbU8ZsGxV0HIvqqxo9l7mqYwyYMD9bKDg==",
-      "dev": true,
       "license": "Apache-2.0",
       "optional": true,
       "bin": {
@@ -9619,6 +9612,12 @@
       "integrity": "sha512-23g5BFj4zdQL/b6tor7Ji+QY4pEfNH784BMslY9Qb0UnJWRAt+lQGLYmRaM0KDBwIG23ffEBELhZDP2rhi9f/Q==",
       "license": "MIT"
     },
+    "node_modules/mpvue-echarts": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/mpvue-echarts/-/mpvue-echarts-1.0.0.tgz",
+      "integrity": "sha512-tY73yPqfB3KvU5o5vMxOjqknJI+Z+s/dk2l6Uw/yo3Hz0NgDPqa8t2z6H+6e4AWqLu2TODjjOys2IUMq5/YOGQ==",
+      "license": "MIT"
+    },
     "node_modules/ms": {
       "version": "2.1.3",
       "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
@@ -9679,7 +9678,6 @@
       "version": "7.1.1",
       "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
       "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
-      "dev": true,
       "license": "MIT",
       "optional": true
     },

package.json

@@ -53,7 +53,9 @@
     "@dcloudio/uni-mp-xhs": "3.0.0-4070520250711001",
     "@dcloudio/uni-quickapp-webview": "3.0.0-4070520250711001",
     "@dcloudio/uni-ui": "^1.5.10",
+    "@qiun/ucharts": "^2.5.0-20230101",
     "echarts": "^6.0.0",
+    "mpvue-echarts": "^1.0.0",
     "vue": "^3.4.21",
     "vue-i18n": "^9.14.5"
   },

src/pages.json

@@ -1,4 +1,9 @@
 {
+
+  
+  "easycom": {
+    "^qiun-(.*)": "@qiun/ucharts/components/$1/$1.vue"
+  },
 	"pages": [ 
 		{
 			"path": "pages/login/login",

src/pages/home/index.vue

@@ -65,9 +65,7 @@
       <swiper class="indices-swiper" :indicator-dots="true" :autoplay="true" :interval="5000" :duration="1000" @change="handleSwiperChange">
         <swiper-item v-for="(index, i) in marketIndices" :key="i">
           <view class="index-item">
-            <!-- 左右布局容器 -->
             <view class="index-content">
-              <!-- 左侧数据区域 -->
               <view class="index-data">
                 <text class="index-name">{{index.name}}</text>
                 <text class="index-value">{{index.value}}</text>
@@ -76,13 +74,15 @@
                 </text>
               </view>
               
-              <!-- 右侧图表区域 -->
               <view class="chart-container">
                 <canvas 
                   type="2d" 
+                  :id="'index-chart-' + i" 
                   :canvas-id="'index-chart-' + i" 
                   class="index-chart"
-                  @init="onCanvasInit(i)"
+                  @touchstart="touchStart"
+                  @touchmove="touchMove"
+                  @touchend="touchEnd"
                 ></canvas>
               </view>
             </view>
@@ -171,13 +171,23 @@ export default {
           time: "2023-06-15T07:15:00Z"
         }
       ],
-      charts: [], // 存储图表实例
+      charts: [],
-      canvasElements: [] // 存储canvas元素
+      systemInfo: null,
+      dpr: 1
     }
   },
+  onLoad() {
+    uni.getSystemInfo({
+      success: (res) => {
+        this.systemInfo = res;
+        this.dpr = res.pixelRatio;
+      }
+    });
+  },
   onReady() {
-    // 页面初次渲染完成后初始化可见的图表
+    setTimeout(() => {
-    this.initVisibleCharts();
+      this.initCharts();
+    }, 500);
   },
   methods: {
     formatNumber(num) {
@@ -209,37 +219,50 @@ export default {
         url: `/pages/news/detail?title=${encodeURIComponent(news.title)}`
       });
     },
-    // 保存canvas初始化信息
+    initCharts() {
-    onCanvasInit(index) {
+      this.marketIndices.forEach((_, index) => {
-      return (canvas, width, height) => {
+        this.initChart(index);
-        this.canvasElements[index] = { canvas, width, height };
-        // 如果是当前显示的图表，立即初始化
-        if (index === 0) { // 默认显示第一个
-          this.initChart(index);
-        }
-      };
-    },
-    // 初始化指定索引的图表
-    initChart(index) {
-      if (!this.canvasElements[index]) return;
-      
-      const { canvas, width, height } = this.canvasElements[index];
-      const chart = echarts.init(canvas, null, {
-        width: width,
-        height: height
       });
-      canvas.setChart(chart);
+    },
-      
+    initChart(index) {
-      // 获取当前指数的历史数据
+      const query = uni.createSelectorQuery().in(this);
+      query.select(`#index-chart-${index}`)
+        .fields({ node: true, size: true })
+        .exec((res) => {
+          if (!res[0] || !res[0].node) {
+            setTimeout(() => this.initChart(index), 100);
+            return;
+          }
+          
+          const canvas = res[0].node;
+          const width = res[0].width;
+          const height = res[0].height;
+          
+          canvas.width = width * this.dpr;
+          canvas.height = height * this.dpr;
+          canvas.style.width = `${width}px`;
+          canvas.style.height = `${height}px`;
+          
+          const chart = echarts.init(canvas, null, {
+            width: width,
+            height: height,
+            devicePixelRatio: this.dpr
+          });
+          
+          const option = this.getChartOption(index);
+          chart.setOption(option);
+          
+          this.charts[index] = chart;
+          canvas.setChart(chart);
+        });
+    },
+    getChartOption(index) {
       const indexData = this.marketIndices[index];
-      
+      return {
-      // 设置图表配置
+        animation: false,
-      const option = {
         tooltip: {
           trigger: 'axis',
-          axisPointer: {
+          axisPointer: { type: 'line' }
-            type: 'line'
-          }
         },
         grid: {
           left: '0%',
@@ -280,39 +303,44 @@ export default {
           symbol: 'none'
         }]
       };
-      
-      chart.setOption(option);
-      this.charts[index] = chart;
-      
-      return chart;
     },
-    // 初始化可见的图表
+    touchStart(e) {
-    initVisibleCharts() {
+      const chart = this.getChartFromEvent(e);
-      // 初始化第一个图表（默认显示的）
+      chart && chart.dispatchAction({
-      this.initChart(0);
+        type: 'showTip',
+        seriesIndex: 0,
+        dataIndex: 0
+      });
+    },
+    touchMove(e) {
+      const chart = this.getChartFromEvent(e);
+      chart && chart.dispatchAction({
+        type: 'hideTip'
+      });
+    },
+    touchEnd(e) {
+      const chart = this.getChartFromEvent(e);
+      chart && chart.dispatchAction({
+        type: 'hideTip'
+      });
+    },
+    getChartFromEvent(e) {
+      const canvasId = e.currentTarget.id;
+      const index = parseInt(canvasId.split('-')[2]);
+      return this.charts[index];
     },
-    // 轮播图切换时处理
     handleSwiperChange(e) {
       const current = e.detail.current;
-      // 确保图表在切换时已初始化并重新绘制
+      if (this.charts[current]) {
-      if (!this.charts[current]) {
-        // 如果图表尚未初始化，则初始化它
-        this.initChart(current);
-      } else {
-        // 否则重新调整大小
         this.charts[current].resize();
       }
     }
   },
   onUnload() {
-    // 页面卸载时销毁图表实例，释放资源
     this.charts.forEach(chart => {
-      if (chart) {
+      chart && chart.dispose();
-        chart.dispose();
-      }
     });
     this.charts = [];
-    this.canvasElements = [];
   }
 }
 </script>
@@ -322,7 +350,7 @@ export default {
   padding: 20rpx;
   background-color: #f5f5f5;
   min-height: 100vh;
-  padding-bottom: 120rpx; /* 给底部导航留空间 */
+  padding-bottom: 120rpx;
 }
 
 .user-header {
@@ -361,8 +389,8 @@ export default {
   flex-direction: column;
 }
 
-.label{
+.label {
-    margin-top: 20rpx;
+  margin-top: 20rpx;
 }
 
 .total-assets {
@@ -462,10 +490,9 @@ export default {
   display: block;
 }
 
-/* 市场指数左右布局样式 */
 .indices-swiper {
   width: 100%;
-  height: 300rpx; /* 调整高度适应左右布局 */
+  height: 300rpx;
   margin-bottom: 20rpx;
 }
 
@@ -477,19 +504,18 @@ export default {
   height: 100%;
 }
 
-/* 左右布局容器 */
 .index-content {
   display: flex;
   height: 100%;
+  width: 100%;
 }
 
-/* 左侧数据区域 - 占30%宽度 */
 .index-data {
-  flex: 0 0 30%;
+  flex: 0 0 28%; /* 减少左侧数据区域宽度 */
   display: flex;
   flex-direction: column;
   justify-content: center;
-  padding-right: 20rpx;
+  padding-right: 15rpx; /* 减少右侧内边距 */
   border-right: 1px solid #f0f0f0;
 }
 
@@ -509,16 +535,17 @@ export default {
   font-size: 30rpx;
 }
 
-/* 右侧图表区域 - 占70%宽度 */
 .chart-container {
-  flex: 0 0 70%;
+  flex: 1; /* 使用flex:1而不是固定百分比，让图表占满剩余空间 */
-  padding-left: 20rpx;
+  padding-left: 15rpx; /* 减少左侧内边距 */
   position: relative;
+  height: 100%; /* 确保高度充满容器 */
 }
 
 .index-chart {
   width: 100%;
   height: 100%;
+  display: block;
 }
 
 .news-list {

src/pages/more/index.vue

@@ -2,33 +2,33 @@
   <view class="container">
     <!-- 顶部标题栏 -->
     <view class="header">
-      <text class="title">设置</text>
+      <text class="title">{{ $t('more.setting.title') }}</text>
     </view>
     
-    <!-- 顶部用户信息 -->
+    <!-- 用户信息区域 -->
     <view class="user-info" @click="navigateTo('/pages/user/profile')">
       <view class="avatar">
         <image :src="userInfo.avatar || '/static/default-avatar.png'" mode="aspectFill"></image>
       </view>
       <view class="info">
-        <text class="name">{{userInfo.nickname || '未登录'}}</text>
+        <text class="name">{{ userInfo.nickname || $t('more.nologin') }}</text>
-        <text class="phone">{{userInfo.phone ? hidePhone(userInfo.phone) : '点击登录'}}</text>
+        <text class="phone">{{userInfo.phone ? hidePhone(userInfo.phone) : $t('more.clicklogin') }}</text>
       </view>
       <view class="arrow">
         <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
       </view>
     </view>
     
-    <!-- 功能列表 -->
+    <!-- 功能菜单列表 -->
     <view class="menu-list">
       <!-- 银行卡 -->
       <view class="menu-item" @click="navigateTo('/pages/user/bankCard')">
         <view class="item-left">
           <uni-icons type="wallet" size="20" color="#4a7dff"></uni-icons>
-          <text class="text">我的银行卡</text>
+          <text class="text">{{ $t('more.bankcard') }}</text>
         </view>
         <view class="item-right">
-          <text class="tips" v-if="userInfo.bankCardCount > 0">{{userInfo.bankCardCount}}张</text>
+          <text class="tips" v-if="userInfo.bankCardCount > 0">{{userInfo.bankCardCount}}</text>
           <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
         </view>
       </view>
@@ -37,44 +37,84 @@
       <view class="menu-item" @click="navigateTo('/pages/user/realAuth')">
         <view class="item-left">
           <uni-icons type="person" size="20" color="#4a7dff"></uni-icons>
-          <text class="text">实名认证</text>
+          <text class="text">{{ $t('more.authentication') }}</text>
         </view>
         <view class="item-right">
           <text class="tips" :style="{color: userInfo.authStatus === 1 ? '#4a7dff' : '#ff5a5f'}">
-            {{authStatusText[userInfo.authStatus] || '未认证'}}
+            {{authStatusText[userInfo.authStatus] || $t('more.not_authenticated')}}
           </text>
           <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
         </view>
       </view>
       
-      <!-- 语言选择 -->
+      <!-- 修改密码 -->
-      <view class="menu-item" @click="navigateTo('/pages/user/language')">
+      <view class="menu-item" @click="navigateTo('/pages/user/changePassword')">
         <view class="item-left">
-          <uni-icons type="compose" size="20" color="#4a7dff"></uni-icons>
+          <uni-icons type="locked" size="20" color="#4a7dff"></uni-icons>
-          <text class="text">语言设置</text>
+          <text class="text">{{ $t('more.changePassword') }}</text>
         </view>
         <view class="item-right">
-          <text class="tips">{{languageText[userInfo.language] || '简体中文'}}</text>
           <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
         </view>
       </view>
       
-      <!-- 设置 -->
+      <!-- 在线客服 -->
-      <view class="menu-item" @click="navigateTo('/pages/user/settings')">
+      <view class="menu-item" @click="contactCustomerService">
         <view class="item-left">
-          <uni-icons type="gear" size="20" color="#4a7dff"></uni-icons>
+          <uni-icons type="chat" size="20" color="#4a7dff"></uni-icons>
-          <text class="text">系统设置</text>
+          <text class="text">{{ $t('more.customerService') }}</text>
         </view>
         <view class="item-right">
           <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
         </view>
       </view>
+      
+      <!-- 语言设置 -->
+      <view class="menu-item" @click="showLanguageModal = true">
+        <view class="item-left">
+          <uni-icons type="compose" size="20" color="#4a7dff"></uni-icons>
+          <text class="text">{{ $t('more.languagesettings') }}</text>
+        </view>
+        <view class="item-right">
+          <text class="tips">{{currentLanguageText}}</text>
+          <uni-icons type="arrowright" size="16" color="#999"></uni-icons>
+        </view>
+      </view>
     </view>
     
     <!-- 退出登录按钮 -->
     <view class="logout-btn" @click="handleLogout" v-if="userInfo.isLogin">
-      <text>退出登录</text>
+      <text>{{ $t('more.logout')}}</text>
     </view>
+    
+    <!-- 语言选择弹窗 -->
+    <view class="lang-modal" v-if="showLanguageModal">
+      <view class="modal-mask" @click="showLanguageModal = false"></view>
+      <view class="modal-content">
+        <view class="modal-title">{{$t('more.selectlanguage')}}</view>
+        <view class="lang-list">
+          <view 
+            class="lang-item" 
+            v-for="(text, key) in languageOptions" 
+            :key="key"
+            @click="handleLanguageChange(key)"
+            :class="{ 'active': userInfo.language === key }"
+          >
+            <text>{{ text }}</text>
+            <uni-icons 
+              type="checkmark" 
+              size="18" 
+              color="#4a7dff" 
+              v-if="userInfo.language === key"
+            ></uni-icons>
+          </view>
+        </view>
+        <button class="modal-close" @click="showLanguageModal = false">
+          {{ $t('more.close') }}
+        </button>
+      </view>
+    </view>
+    
   </view>
 </template>
 
@@ -82,29 +122,65 @@
 export default {
   data() {
     return {
+      showLanguageModal: false,
       userInfo: {
         avatar: '/static/avatar.jpg',
         nickname: '张三',
         phone: '13800138000',
         bankCardCount: 2,
         authStatus: 1, // 0-未认证 1-已认证 2-认证中 3-认证失败
-        language: 'zh-CN',
+        language: 'zh',
         isLogin: true
       },
       authStatusText: {
-        0: '未认证',
+        0: this.$t('more.not_authenticated'),
-        1: '已认证',
+        1: this.$t('more.authenticated'),
-        2: '认证中',
+        2: this.$t('more.authenticating'),
-        3: '认证失败'
+        3: this.$t('more.auth_failed')
       },
-      languageText: {
+      languageOptions: {
-        'zh-CN': '简体中文',
+        'zh': 'Chinese',
-        'en-US': 'English',
+        'en': 'English',
-        'zh-TW': '繁體中文'
       }
     }
+  },onShow() {
+    this.setTabBarI18n();
+  },
+  computed: {
+    currentLanguageText() {
+      return this.languageOptions[this.userInfo.language] || $t('more.language')
+    }
   },
   methods: {
+
+    setTabBarI18n() {
+    const locale = this.$i18n.locale;
+    const tabBarTexts = {
+      zh: ['首页', '基金', '股票', '资产', '更多'],
+      en: ['Home', 'Market', 'Trade', 'Assets', 'More']
+    };
+    
+    uni.setTabBarItem({
+      index: 0,
+      text: this.$t('tabBar.index')
+    });
+    uni.setTabBarItem({
+      index: 1,
+      text: this.$t('tabBar.market')
+    });
+    uni.setTabBarItem({
+      index: 2,
+      text: this.$t('tabBar.trade')
+    });
+    uni.setTabBarItem({
+      index: 3,
+      text: this.$t('tabBar.assets')
+    });
+    uni.setTabBarItem({
+      index: 4,
+      text: this.$t('tabBar.more')
+    });
+  },
     // 隐藏手机号中间四位
     hidePhone(phone) {
       return phone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
@@ -117,16 +193,23 @@ export default {
       })
     },
     
+    // 联系客服
+    contactCustomerService() {
+      //跳转客服页面
+      // uni.navigateTo({
+      //   url: '/pages/customerService/index'
+      // });
+    },
+    
     // 退出登录
     handleLogout() {
       uni.showModal({
-        title: '提示',
+        title: this.$t('common.tip'),
-        content: '确定要退出登录吗？',
+        content: this.$t('more.confirmLogout'),
         success: (res) => {
           if (res.confirm) {
-            // 这里调用退出登录接口
             uni.showLoading({
-              title: '正在退出...'
+              title: this.$t('common.loggingOut')
             })
             
             // 模拟退出登录
@@ -136,11 +219,11 @@ export default {
               this.userInfo.nickname = ''
               this.userInfo.phone = ''
               uni.showToast({
-                title: '退出成功',
+                title: this.$t('common.logoutSuccess'),
                 icon: 'success'
               })
               
-              // 跳转到登录页或其他页面
+              // 跳转到登录页
               uni.reLaunch({
                 url: '/pages/login/login'
               })
@@ -148,6 +231,26 @@ export default {
           }
         }
       })
+    },
+    
+    // 更改语言
+    handleLanguageChange(lang) {
+      this.userInfo.language = lang
+      this.$i18n.locale = lang;
+      this.showLanguageModal = false
+      
+      this.setTabBarI18n();
+
+      uni.showToast({
+        title: `${this.$t('more.languageChanged')}${this.languageOptions[lang]}`,
+        icon: 'none'
+      })
+      
+      // 实际项目中这里可以调用API保存语言偏好
+      // this.saveLanguagePreference(lang);
+      
+      // 如果需要国际化，可以在这里触发语言更新
+       this.$i18n.locale = lang;
     }
   }
 }
@@ -156,7 +259,7 @@ export default {
 <style lang="scss" scoped>
 .container {
   padding: 20rpx 30rpx;
-  background-color: #f5f5f5;
+  background-color: #f8f8f8;
   min-height: 100vh;
   box-sizing: border-box;
 }
@@ -166,7 +269,7 @@ export default {
   text-align: center;
   
   .title {
-    font-size: 36rpx;
+    font-size: 38rpx;
     font-weight: bold;
     color: #333;
   }
@@ -179,6 +282,7 @@ export default {
   background-color: #fff;
   border-radius: 16rpx;
   margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
   
   .avatar {
     width: 120rpx;
@@ -186,6 +290,7 @@ export default {
     border-radius: 50%;
     overflow: hidden;
     margin-right: 30rpx;
+    background-color: #f5f5f5;
     
     image {
       width: 100%;
@@ -221,6 +326,7 @@ export default {
   border-radius: 16rpx;
   padding: 0 30rpx;
   margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
   
   .menu-item {
     display: flex;
@@ -254,6 +360,10 @@ export default {
         margin-right: 10rpx;
       }
     }
+    
+    &:active {
+      background-color: #f9f9f9;
+    }
   }
 }
 
@@ -266,5 +376,118 @@ export default {
   color: #ff5a5f;
   font-size: 32rpx;
   margin-top: 40rpx;
+  box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);
+  
+  &:active {
+    background-color: #f9f9f9;
+  }
+}
+
+/* 语言选择弹窗样式 */
+.lang-modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  z-index: 999;
+  display: flex;
+  align-items: flex-end;
+  justify-content: center;
+}
+
+.modal-mask {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  background-color: rgba(0, 0, 0, 0.5);
+}
+
+.modal-content {
+  width: 100%;
+  background-color: #fff;
+  border-radius: 24rpx 24rpx 0 0;
+  padding-bottom: constant(safe-area-inset-bottom);
+  padding-bottom: env(safe-area-inset-bottom);
+  position: relative;
+  z-index: 1;
+  animation: slide-up 0.3s ease;
+}
+
+@keyframes slide-up {
+  from {
+    transform: translateY(100%);
+  }
+  to {
+    transform: translateY(0);
+  }
+}
+
+.modal-title {
+  padding: 40rpx 30rpx 30rpx;
+  font-size: 32rpx;
+  font-weight: bold;
+  text-align: center;
+  color: #333;
+  border-bottom: 1rpx solid #f5f5f5;
+}
+
+.lang-list {
+  padding: 0 30rpx;
+  max-height: 60vh;
+  overflow-y: auto;
+}
+
+.lang-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 30rpx 0;
+  border-bottom: 1rpx solid #f5f5f5;
+  
+  &:last-child {
+    border-bottom: none;
+  }
+  
+  text {
+    font-size: 30rpx;
+    color: #333;
+  }
+  
+  &.active {
+    text {
+      color: #4a7dff;
+      font-weight: bold;
+    }
+  }
+  
+  &:active {
+    background-color: #f9f9f9;
+  }
+}
+
+.modal-close {
+  width: 100%;
+  height: 100rpx;
+  line-height: 100rpx;
+  text-align: center;
+  font-size: 32rpx;
+  color: #333;
+  background-color: transparent;
+  border: none;
+  border-top: 1rpx solid #f5f5f5;
+  margin-top: 20rpx;
+  border-radius: 0;
+  padding: 0;
+  
+  &::after {
+    border: none;
+  }
+  
+  &:active {
+    background-color: #f9f9f9;
+  }
 }
 </style>

src/static/lang/enUS.json

@@ -1,4 +1,7 @@
 {
+  // Login
+  "index.Loading": "Loading...",
+  "index.errMsg": "Failed to load",
   "login.loginButton": "Login",
   "login.usernamePlaceholder": "Please enter username",
   "login.idCardLabel": "Last 6 digits of ID card",
@@ -7,7 +10,7 @@
   "login.appTitle": "European Stock Software",
   "login.rememberPassword": "Remember password",
   "login.forgotPassword": "Forgot password",
-  "login.agreeTermsPrefix": "I have read and agree to",
+  "login.agreeTermsPrefix": "I have read and agree to the",
   "login.agreeTermsSuffix": "User Agreement",
   "login.userAgreement": "User Agreement",
   "login.and": "and",
@@ -17,27 +20,79 @@
   "login.languagechangeclose": "Done",
   "login.chooseLanguage": "Select Language",
   "login.changelanguage": "Change Language",
+  "login.errors.agreeTermsFirst": "Please agree to the User Agreement and Privacy Policy first",
+  "login.errors.emptyUsername": "Please enter username",
+  "login.errors.invalidIdCard": "Please enter the last 6 digits of your ID card correctly",
+  "login.errors.emptyPassword": "Please enter password",
 
+  // Registration
   "register.chooseLanguage": "Select Language",
   "register.languagechangeclose": "Done",
   "register.appTitle": "European Stock Software",
   "register.registerDesc": "Create an account to continue",
   "register.idCardLabel": "Last 6 digits of ID card",
-  "register.idCardPlaceholder": "Please enter last 6 digits of ID card",
+  "register.idCardPlaceholder": "Please enter the last 6 digits of ID card",
+  "register.errors.emptyIdCard": "Please enter ID card number",
   "register.passwordLabel": "Password",
+  "register.passwordTip": "Password must be at least 6 characters",
   "register.passwordPlaceholder": "Please enter password",
   "register.confirmPasswordLabel": "Confirm Password",
-  "register.confirmPasswordPlaceholder": "Please confirm password again",
+  "register.confirmPasswordPlaceholder": "Please enter password again",
   "register.inviteCodeLabel": "Invitation Code",
   "register.inviteCodePlaceholder": "Please enter invitation code",
   "register.emailLabel": "Email",
   "register.emailPlaceholder": "Please enter email",
-  "register.agreeTermsPrefix": "I have read and agree to",
+  "register.errors.emailRequired": "Email cannot be empty",
+  "register.idCardLast6Error": "Please enter correct ID card number",
+  "register.errors.invalidPassword": "Password must be at least 8 characters with both letters and numbers",
+  "register.errors.emptyPassword": "Password cannot be empty",
+  "register.errors.confirmPasswordRequired": "Please enter password again",
+  "register.errors.invalidEmail": "Please enter a valid email",
+  "register.errors.passwordMismatch": "Passwords do not match",
+  "register.errors.invalidIdCard": "Please enter correct ID card number",
+  "register.errors.agreeTermsFirst": "Please read and agree to the User Agreement and Privacy Policy first",
+  "register.registerProcessing": "Registering...",
+  "register.agreeTermsPrefix": "I have read and agree to the",
   "register.userAgreement": "User Agreement",
   "register.and": "and",
   "register.privacyPolicy": "Privacy Policy",
   "register.registerButton": "Register",
   "register.hasAccount": "Already have an account?",
   "register.loginNow": "Login now",
-  "register.registerSuccess": "Registration successful"
+  "register.registerSuccess": "Registration successful",
-}
+
+  // Home
+  "home.welcome": "Welcome",
+  "home.totalAssets": "Total Assets",
+
+  // Settings
+  "more.setting.title": "Settings",
+  "more.nologin": "Not logged in",
+  "more.clicklogin": "Click to login",
+  "more.bankcard": "Bank Cards",
+  "more.authentication": "Real-name Authentication",
+  "more.not_authenticated": "Not authenticated",
+  "more.authenticated": "Authenticated",
+  "more.authenticating": "Authenticating",
+  "more.auth_failed": "Authentication failed",
+  "more.changePassword": "Change Password",
+  "more.customerService": "Customer Service",
+  "more.languagesettings": "Language Settings",
+  "more.logout": "Logout",
+  "more.selectlanguage": "Select Language",
+  "more.languageChanged": "Language changed to",
+  "more.close": "Close",
+  "more.confirmLogout": "Are you sure you want to logout?",
+
+  // Common
+  "common.tip": "Tip",
+  "common.loggingOut": "Logging out...",
+  "common.logoutSuccess": "Logout successful",
+
+  // TabBar
+  "tabBar.index": "Home",
+  "tabBar.market": "Funds",
+  "tabBar.trade": "Stocks",
+  "tabBar.assets": "Assets",
+  "tabBar.more": "More"
+}

src/static/lang/zh_CN.json

@@ -67,7 +67,40 @@
 
   //首页
   "home.welcome":"欢迎",
-  "home.totalAssets":"总资产"
+  "home.totalAssets":"总资产",
+
+
+
+  //设置
+  "more.setting.title":"设置",
+  "more.nologin":"未登录",
+  "more.clicklogin":"点击登录",
+  "more.bankcard":"银行卡",
+  "more.authentication":"实名认证",
+  "more.not_authenticated":"未认证",
+  "more.authenticated":"已认证",
+  "more.authenticating":"认证中",
+  "more.auth_failed":"认证失败",
+  "more.changePassword":"修改密码",
+  "more.customerService":"在线客服",
+  "more.languagesettings":"语言设置",
+  "more.logout":"退出登录",
+  "more.selectlanguage":"选择语言",
+  "more.languageChanged":"语言已切换成",
+  "more.close":"关闭",
+  "more.confirmLogout":"确定要退出登录吗？",
+
+  "common.tip":"提示",
+  "common.loggingOut":"正在退出登录...",
+  "common.logoutSuccess":"退出登录成功",
+
+  "tabBar.index":"首页",
+  "tabBar.market":"基金",
+  "tabBar.trade":"股票",
+  "tabBar.assets":"资产" ,
+  "tabBar.more":"更多"
+
+  
 
   
 }