增加字体大小设置

pages/testpages/bleconfig.vue

@@ -157,14 +157,16 @@ export default {
 };
 </script>
 
-<style>
+<style lang="scss">
+@import '@/styles/variables.scss';
+
 .device-item, .service-item, .char-item {
   padding: 10px;
   border-bottom: 1px solid #ddd;
   margin: 5px 0;
 }
 .mac {
-  font-size: 12px;
+  font-size: $font-size-sm;
   color: gray;
   margin-left: 10px;
 }

pages/testpages/font-test.vue

@@ -0,0 +1,164 @@
+<template>
+  <view class="page-container">
+    <view class="test-section">
+      <view class="test-title">字体缩放测试页面</view>
+      <view class="test-info">
+        <text class="info-item">当前缩放比例: {{ scale }}</text>
+        <text class="info-item">根字体大小: {{ rootFontSize }}</text>
+      </view>
+      
+      <view class="test-group">
+        <view class="group-title">使用 class 的字体大小</view>
+        <view class="test-item">
+          <text class="text-xs">超小字体 (xs: 10px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-sm">小字体 (sm: 11px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-base">基础字体 (base: 13px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-md">中等字体 (md: 14px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-lg">大字体 (lg: 16px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-xl">超大字体 (xl: 20px)</text>
+        </view>
+        <view class="test-item">
+          <text class="text-xxl">特大字体 (xxl: 24px)</text>
+        </view>
+      </view>
+      
+      <view class="test-group">
+        <view class="group-title">对比测试（固定 px  vs  rem）</view>
+        <view class="test-item">
+          <text class="fixed-size">固定大小 (14px，不应缩放)</text>
+        </view>
+        <view class="test-item">
+          <text class="rem-size">rem 大小 (0.875rem，应该缩放)</text>
+        </view>
+      </view>
+      
+      <view class="test-actions">
+        <button class="btn btn-primary" @click="goToSettings">去设置页面调整字体</button>
+        <button class="btn btn-outline" @click="refreshTest">刷新测试</button>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      scale: 1.0,
+      rootFontSize: '16px'
+    }
+  },
+  onShow() {
+    this.refreshTest()
+  },
+  methods: {
+    refreshTest() {
+      // 从 Vuex 读取当前缩放比例
+      this.scale = this.$store.state.font.fontScale || 1.0
+      
+      // 读取根字体大小
+      try {
+        if (typeof document !== 'undefined' && document.documentElement) {
+          this.rootFontSize = getComputedStyle(document.documentElement).fontSize
+        }
+      } catch (e) {
+        this.rootFontSize = '无法获取'
+      }
+    },
+    
+    goToSettings() {
+      uni.navigateTo({
+        url: '/pages/settings/index'
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+@import '@/styles/variables.scss';
+
+.page-container {
+  padding: $spacing-md;
+}
+
+.test-section {
+  background: $bg-card;
+  border-radius: $border-radius-md;
+  padding: $spacing-md;
+}
+
+.test-title {
+  font-size: $font-size-xl;
+  font-weight: 600;
+  color: $text-primary;
+  margin-bottom: $spacing-md;
+  text-align: center;
+}
+
+.test-info {
+  background: $bg-primary;
+  padding: $spacing-sm;
+  border-radius: $border-radius-sm;
+  margin-bottom: $spacing-md;
+  
+  .info-item {
+    display: block;
+    font-size: $font-size-sm;
+    color: $text-secondary;
+    margin-bottom: $spacing-xs;
+  }
+}
+
+.test-group {
+  margin-bottom: $spacing-lg;
+  
+  .group-title {
+    font-size: $font-size-md;
+    font-weight: 600;
+    color: $text-primary;
+    margin-bottom: $spacing-sm;
+    padding-bottom: $spacing-xs;
+    border-bottom: 1px solid $border-color;
+  }
+}
+
+.test-item {
+  padding: $spacing-sm;
+  margin-bottom: $spacing-sm;
+  background: #f9f9f9;
+  border-radius: $border-radius-sm;
+  border-left: 3px solid $primary-color;
+}
+
+/* 字体大小 class */
+.text-xs { font-size: $font-size-xs; }
+.text-sm { font-size: $font-size-sm; }
+.text-base { font-size: $font-size-base; }
+.text-md { font-size: $font-size-md; }
+.text-lg { font-size: $font-size-lg; }
+.text-xl { font-size: $font-size-xl; }
+.text-xxl { font-size: $font-size-xxl; }
+
+/* 对比测试 */
+.fixed-size { font-size: 14px; }
+.rem-size { font-size: 0.875rem; }
+
+.test-actions {
+  margin-top: $spacing-lg;
+  
+  .btn {
+    margin-bottom: $spacing-sm;
+  }
+}
+</style>