refactor(字体缩放): 重构字体缩放功能并优化样式管理

将字体缩放功能从App.vue迁移至各页面组件，确保字体比例在页面显示时正确应用
添加text.scss样式文件集中管理字体大小变量
优化useHeight工具函数计算逻辑，增加对tabbar高度的考虑
统一将getmyareaApi重命名为getMyAreaApi以符合命名规范
移除多个组件中不再需要的uni.scss导入

App.vue

@@ -1,23 +1,16 @@
-<script>
-import useStore from "@/store";
+<script setup>
+import { onLaunch } from "@dcloudio/uni-app";
 
-export default {
-  onLaunch() {
-    // console.log("App Launch");
-    const store = useStore();
-    store.fontScale = uni.getStorageSync("fontScale") || 1;
-  },
-  onShow() {
-    // console.log("App Show");
-  },
-  onHide() {
-    const store = useStore();
-    uni.setStorageSync("fontScale", store.fontScale);
-  },
-};
+onLaunch(() => {
+  console.log("onLaunch!!!");
+});
 </script>
 
+<style lang="scss" scoped>
+  @import './uni.scss';
+</style>
+
 <style>
-	/*每个页面公共css */
+  /* @import '@/static/text.scss'; */
   @import "@/static/icon/iconfont.css";
 </style>

components/custom-tab-bar/my-tab-bar.vue

@@ -117,7 +117,7 @@ onReady(() => {
 </template>
 
 <style lang="scss">
-@import '../../uni.scss';
+// @import '../../uni.scss';
 
 .tab-bar {
   position: fixed;

components/nav/nav.vue

@@ -14,9 +14,8 @@ const safeHeight = ref({
   bottom: 0,
 });
 
-// const fontScale = computed(() => uni.getStorageSync("fontScale") || 1);
-
 onLoad(() => {
+  store.fontScale = uni.getStorageSync("fontScale") || 1;
   const height = useHeight();
   // console.log(height);
 
@@ -40,6 +39,7 @@ onLoad(() => {
       :screen="safeHeight.screen"
       :bottom="safeHeight.bottom"
       :tabbar="safeHeight.tabbar"
+      :content="safeHeight.content"
       :fix-style=" {
         height: safeHeight.menu ? `${safeHeight.menu}px` : '45px',
         paddingTop: `${safeHeight.status}px`,

libs/api/index.js

@@ -84,7 +84,7 @@ export function getProductsApi(params = {}) {
  * 获取用户仓库
  * @param {{warehouseid: unknow}} params
  */
-export function getmyareaApi(params = {}) {
+export function getMyAreaApi(params = {}) {
   // ajax('get', '/area/getMyArea.do?warehouseid='+warehouseid, '', success)
   return request({
     params,

libs/utils/index.js

@@ -53,6 +53,7 @@ export function useHeight() {
   const safeHeight = {};
 
   const info = uni.getWindowInfo();
+  const store = useStore();
 
   safeHeight.status = info.statusBarHeight || 0;
   // #ifdef APP
@@ -62,19 +63,23 @@ export function useHeight() {
   // #ifdef MP-WEIXIN
   const menuButton = uni.getMenuButtonBoundingClientRect();
   // menuHeight.value = menuButton.height;
-  safeHeight.menu = menuButton.height;
-  safeHeight.status = menuButton.top;
+  safeHeight.menu = menuButton.height; // 小程序胶囊高度
+  safeHeight.status = menuButton.top; // 小程序胶囊距离手机顶部的高度
   // #endif
 
   // #ifdef APP-PlUS
-  safeHeight.status = info.statusBarHeight || 45;
+  safeHeight.status = info.statusBarHeight || 45; // 手机状态栏高度
   // #endif
 
-  safeHeight.screen = info.screenHeight;
-  safeHeight.content = info.screenHeight - info.safeArea.bottom;
-  safeHeight.menu = safeHeight.menu || 0;
-  safeHeight.bottom = info.safeArea.bottom || 0;
-  safeHeight.statusMenu = safeHeight.status + safeHeight.menu;
+  safeHeight.screen = info.screenHeight; // 屏幕高度
+  safeHeight.menu = safeHeight.menu || 0; // 小程序胶囊高度
+  safeHeight.bottom = info.safeAreaInsets.bottom || 0; // 手机屏幕底部安全高度
+  safeHeight.statusMenu = safeHeight.status + safeHeight.menu; // 手机状态栏+小程序胶囊的高度
+
+  safeHeight.content = info.screenHeight
+    // - info.safeAreaInsets.bottom
+    - store.tabbarBottomHeight
+    - safeHeight.statusMenu; // 减去手机状态栏 + 小程序胶囊 + tabbar + 底部安全高度
 
   return safeHeight;
 }
@@ -160,7 +165,10 @@ export function validates(validators, toastConfig = { icon: "none", returnBoolea
   for (const validator of validatorsFlat) {
     const msg = validator();
     if (msg) {
-      console.log(msg, "校验失败");
+      uni.showToast({
+        ...toastConfig,
+        title: msg,
+      });
       return toastConfig.returnBoolean ? false : msg;
     }
   }
@@ -189,4 +197,5 @@ export function increaseFontScale(incScale = 0.1) {
   const store = useStore();
   store.fontScale += incScale;
   uni.setStorageSync("fontScale", store.fontScale);
+  validates(() => true && `${store.fontScale} 倍数`);
 }

pages/allDish/allDish.vue

@@ -785,8 +785,8 @@ onShow(() => {
 
   nextTick(async () => {
     const boxHeight = (await useRect(".first-box"))?.height || 0;
-    const { screen, status, menu, content } = useHeight();
-    pageContainerHeight.value = screen - status - menu - content - boxHeight - 60;
+    const { content } = useHeight();
+    pageContainerHeight.value = content - boxHeight - 5;
   });
 });
 

pages/home/home.vue

@@ -7,7 +7,7 @@ import {
   // editDefaultAddressApi,
   // getBroadcastApi,
   getCarouselsApi,
-  getmyareaApi,
+  getMyAreaApi,
   getNoticesApi,
   getProductsApi,
   getProductTypesApi,
@@ -196,7 +196,7 @@ function getDFKDataLength() {
  * 获取仓库列表数据
  * 随后获取特价新品
  */
-async function getmyarea() {
+async function getMyArea() {
   const postData = {
     warehouseid: "",
     isEnabled: 1,
@@ -205,7 +205,7 @@ async function getmyarea() {
     title: "加载中",
     mask: true,
   });
-  const res = await getmyareaApi(postData);
+  const res = await getMyAreaApi(postData);
   if (res.code !== "0") {
     uni.hideLoading();
     return;
@@ -408,11 +408,12 @@ onLoad(() => {
 });
 
 onShow(() => {
+  store.fontScale = uni.getStorageSync("fontScale") || 1;
   // uni.hideTabBar();
   getBanner();
   getProductCategory();
   getNoticesApiList();
-  getmyarea();
+  getMyArea();
   statusBarHeight.value = uni.getWindowInfo().statusBarHeight;
 
   nextTick(() => {
@@ -718,7 +719,7 @@ onShow(() => {
 </template>
 
 <style lang="scss" scoped>
-@import '../../uni.scss';
+// @import '../../uni.scss';
 
 .header-box {
   // position: fixed;

pages/index/index.vue

@@ -1,7 +1,8 @@
 <script setup>
-import { onLoad } from "@dcloudio/uni-app";
+import { onLoad, onShow } from "@dcloudio/uni-app";
 import { ref } from "vue";
 import { getGuideImgsApi } from "@/libs/api";
+import useStore from "@/store";
 
 /**
  * 当前轮播图下标

pages/login/login.vue

@@ -2,7 +2,7 @@
 import { onLoad } from "@dcloudio/uni-app";
 import { ref } from "vue";
 import {
-  getmyareaApi,
+  getMyAreaApi,
   getUserByXcxAPPOpenIdApi,
   getUserTreatyApi,
   loginApi,
@@ -138,7 +138,7 @@ async function getUserByXcxAPPOpenId(data) {
     // appData.header.session = res.header.session;
     // appData.header["X-Header-Token"] = res.header.session;
     // uni.setStorageSync("session", res.header.session);
-    getmyarea();
+    getMyArea();
   }
   else {
     uni.hideLoading();
@@ -146,11 +146,12 @@ async function getUserByXcxAPPOpenId(data) {
   }
 }
 
-async function getmyarea() {
-  const res = await getmyareaApi({ warehouseid: "", isEnabled: 1 });
+async function getMyArea() {
+  const res = await getMyAreaApi({ warehouseid: "", isEnabled: 1 });
   if (res.code === "0") {
     // const list = res.data.list.sort((pre, cur) => Number(cur) - Number(pre));
-    // each 就是找到有isLastDefaultAddr，没有就那第一个值
+    // each 就是找到有isLastDefaultAddr，没有就那第一个 isDefault 最大值
+    res.data.list = res.data.list.sort((a, b) => Number(b.isDefault) - Number(a.isDefault));
     const each = res.data.list.find(each => each.isLastDefaultAddr) || res.data.list[0];
     uni.setStorageSync("warehousId", each.warehousId);
     uni.setStorageSync("addressId", each.addrId);

pages/personalInformation/personalInformation.vue

@@ -559,6 +559,6 @@ onLoad(() => {
 </template>
 
 <style lang="scss" scoped>
-@import '../../uni.scss';
+// @import '../../uni.scss';
 @import './personallInformation.scss';
 </style>

pages/shoppingCart/shoppingCart.vue

@@ -1,9 +1,117 @@
 <script setup>
-import { onLoad } from "@dcloudio/uni-app";
+import { onLoad, onShow } from "@dcloudio/uni-app";
+import { ref } from "vue";
 import customTabBar from "@/components/custom-tab-bar/my-tab-bar.vue";
 import navv from "@/components/nav/nav.vue";
-
 import topTitle from "@/components/topTitle/topTitle.vue";
+import { getMyAreaApi, getUserInfoApi } from "@/libs/api";
+
+/**
+ * 选择收货地址
+ */
+const selectAddress = ref({});
+/**
+ * 购物车是否完成
+ */
+const finished = ref(false);
+/**
+ * 购物车列表
+ */
+const cartLists = ref([]);
+
+/**
+ * 点击选择收货地址
+ */
+function onGoSelectAddress() { }
+
+/**
+ * 点击管理购物车
+ */
+function onManageCart() { }
+
+/**
+ * 获取仓库列表数据
+ */
+async function getMyArea() {
+  const res = await getMyAreaApi({
+    warehouseid: "",
+    isEnabled: 1,
+  });
+  if (res.code !== "0")
+    return;
+  if (!res.data.login) {
+    uni.navigateTo({
+      url: "/pages/login/login",
+    });
+    return;
+  }
+  if (!res.data.list.length) {
+    uni.showModal({
+      // title: '提示',
+      content: "请先添加收货地址",
+      confirmColor: "#3aa24b",
+      confirmText: "去添加",
+      success(res) {
+        if (res.confirm) {
+          uni.navigateTo({
+            // url: "../../address/pages/addressLists/addressLists",
+          });
+        }
+      },
+    });
+    return;
+  }
+  // each 就是找到有 isLastDefaultAddr，没有就那第一个 isDefault 最大值
+  res.data.list = res.data.list.sort((a, b) => Number(b.isDefault) - Number(a.isDefault));
+  selectAddress.value = res.data.list.find(each => each.isLastDefaultAddr) || res.data.list[0];
+  uni.setStorageSync("warehousId", selectAddress.value.warehousId);
+  uni.setStorageSync("addressId", selectAddress.value.addrId);
+}
+
+/**
+ * 获取用户信息
+ */
+async function getUserInfo() {
+  const res = await getUserInfoApi();
+  if (res.code === "0") {
+    if (!res.data.company) {
+      uni.showModal({
+        title: "提示",
+        content: "请先添加企业",
+        complete: (res) => {
+          if (res.confirm) {
+            //       uni.navigateTo({
+            //         url: "../../enterprise/pages/joinEnterprise/joinEnterprise",
+            //       });
+          }
+        },
+      });
+    }
+    getMyArea();
+  }
+  else if (res.code === "4") {
+    cartLists.value = [];
+    uni.showModal({
+      title: "提示",
+      content: "请先登录",
+      complete: (res) => {
+        if (res.confirm) {
+          uni.navigateTo({
+            url: "/pages/login/login",
+          });
+        }
+      },
+    });
+  }
+}
+
+onShow(() => {
+  finished.value = true;
+  // isOne.value = true;
+  // cartList.value = [];
+  // inShow.value = true;
+  getUserInfo();
+});
 
 onLoad(() => {
   // #ifdef APP
@@ -14,17 +122,29 @@ onLoad(() => {
 
 <template>
   <navv>
-    <template #default="{ fixStyle, padStyle }">
-      <topTitle title="购物车" :style="{ ...fixStyle, backgroundColor: '#fff' }" />
-
-      <view :style="padStyle">
-        <view
-          v-for="(item, index) in 1000" :key="index"
-        >
-          {{ item }}
+    <template #default="{ content, fixStyle }">
+      <topTitle
+        title="购物车"
+        :style="{ ...fixStyle, backgroundColor: '#fff', position: 'static' }"
+      />
+
+      <!-- 收获地址 -->
+      <view class="address">
+        <view class="left" @click="onGoSelectAddress">
+          <text class="iconfont icon-positioning" />
+          <text class="name">
+            {{ selectAddress.street }}
+          </text>
+          <text class="iconfont icon-right" />
+        </view>
+        <view class="right" @click="onManageCart">
+          {{ finished ? '编辑' : '完成' }}
         </view>
       </view>
 
+      <!-- 列表 -->
+      <view :style="{ 'height': `${content}px`, 'overflow-y': 'auto' }" />
+
       <customTabBar tab-index="3" />
     </template>
   </navv>
@@ -34,4 +154,24 @@ onLoad(() => {
 :deep(.left .icon-back) {
   display: none;
 }
+.address {
+  padding: 17rpx 0 33rpx 0;
+  margin: 0 29rpx 0 33rpx;
+  background: #FFFFFF;
+  display: flex;
+  align-items: center;
+
+  .left {
+    display: flex;
+    align-items: center;
+    flex: 1;
+    margin-right: 15rpx;
+    .name {
+      margin-left: 15rpx;
+      font-weight: bold;
+      font-size: $text-lg;
+      color: #333333;
+    }
+  }
+}
 </style>

static/text.scss

@@ -0,0 +1,57 @@
+$text-ss: calc(var(--font-scale, 1) * 12rpx);
+$text-xs: calc(var(--font-scale, 1) * 20rpx);
+$text-sm: calc(var(--font-scale, 1) * 22rpx);
+$text-base: calc(var(--font-scale, 1) * 24rpx);
+$text-lg: calc(var(--font-scale, 1) * 26rpx);
+$text-xl: calc(var(--font-scale, 1) * 28rpx);
+$text-2xl: calc(var(--font-scale, 1) * 30rpx);
+$text-3xl: calc(var(--font-scale, 1) * 32rpx);
+$text-4xl: calc(var(--font-scale, 1) * 34rpx);
+$text-5xl: calc(var(--font-scale, 1) * 36rpx);
+$text-6xl: calc(var(--font-scale, 1) * 38rpx);
+$text-7xl: calc(var(--font-scale, 1) * 40rpx);
+$text-8xl: calc(var(--font-scale, 1) * 42rpx);
+$text-9xl: calc(var(--font-scale, 1) * 44rpx);
+
+.text-ss {
+  font-size: $text-ss;
+}
+.text-xs {
+  font-size: $text-xs;
+}
+.text-sm {
+  font-size: $text-sm;
+}
+.text-base {
+  font-size: $text-base;
+}
+.text-lg {
+  font-size: $text-lg;
+}
+.text-xl {
+  font-size: $text-xl;
+}
+.text-2xl {
+  font-size: $text-2xl;
+}
+.text-3xl {
+  font-size: $text-3xl;
+}
+.text-4xl {
+  font-size: $text-4xl;
+}
+.text-5xl {
+  font-size: $text-5xl;
+}
+.text-6xl {
+  font-size: $text-6xl;
+}
+.text-7xl {
+  font-size: $text-7xl;
+}
+.text-8xl {
+  font-size: $text-8xl;
+}
+.text-9xl {
+  font-size: $text-9xl;
+}

uni.scss

@@ -37,19 +37,11 @@ $uni-bg-color-mask:rgba(0, 0, 0, 0.4);//遮罩颜色
 /* 边框颜色 */
 $uni-border-color:#c8c7cc;
 
-// /* 尺寸变量 */
-// :root {
-//   --font-scale: 1
-// }
-
-* {
-  font-size: $text-xs; // 设置小字体时刻提醒要写标准字体
-}
-
 /* 文字尺寸 */
 $uni-font-size-sm:  calc(var(--font-scale, 1) * 12px);
 $uni-font-size-base: calc(var(--font-scale, 1) * 14px);
 $uni-font-size-lg:  calc(var(--font-scale, 1) * 16px);
+$text-ss: calc(var(--font-scale, 1) * 12rpx);
 $text-xs: calc(var(--font-scale, 1) * 20rpx);
 $text-sm: calc(var(--font-scale, 1) * 22rpx);
 $text-base: calc(var(--font-scale, 1) * 24rpx);
@@ -80,6 +72,7 @@ $text-9xl: calc(var(--font-scale, 1) * 44rpx);
 // $text-4xl: 48rpx;
 // $text-5xl: 52rpx;
 
+
 /* 图片尺寸 */
 $uni-img-size-sm:20px;
 $uni-img-size-base:26px;
@@ -139,3 +132,51 @@ $uni-font-size-paragraph:15px;
   justify-content: center;
 }
 
+
+/* 设置小字体时刻提醒要写标准字体 */
+// view, text {
+//   font-size: $text-ss; 
+// }
+
+.text-ss {
+  font-size: $text-ss;
+}
+.text-xs {
+  font-size: $text-xs;
+}
+.text-sm {
+  font-size: $text-sm;
+}
+.text-base {
+  font-size: $text-base;
+}
+.text-lg {
+  font-size: $text-lg;
+}
+.text-xl {
+  font-size: $text-xl;
+}
+.text-2xl {
+  font-size: $text-2xl;
+}
+.text-3xl {
+  font-size: $text-3xl;
+}
+.text-4xl {
+  font-size: $text-4xl;
+}
+.text-5xl {
+  font-size: $text-5xl;
+}
+.text-6xl {
+  font-size: $text-6xl;
+}
+.text-7xl {
+  font-size: $text-7xl;
+}
+.text-8xl {
+  font-size: $text-8xl;
+}
+.text-9xl {
+  font-size: $text-9xl;
+}