添加平板适配

miniprogram/app.ts

@@ -8,7 +8,8 @@ App<IAppOption>({
     appId: '',
     deviceNum: '', // 设备信息
     isLogin: false, // 是否登录
-    userInfo: {} as any
+    userInfo: {} as any,
+    isTablet: false, // 是否为平板
   },
   onLaunch() {
     // 展示本地存储能力
@@ -24,6 +25,9 @@ App<IAppOption>({
         this.onLogin(res.code)
       },
     })
+
+    console.log("是否为平板设备:", this.isTablet());
+    this.globalData.isTablet = this.isTablet() as any;
   },
   setAppId() {
     //获取当前小程序appId
@@ -34,7 +38,7 @@ App<IAppOption>({
     // require("./utils/request/api.js");
     // 获取设备信息
     const deviceInfo = wx.getDeviceInfo()
-      // 品牌 设备型号 操作系统及版本 客户端平台
+    // 品牌 设备型号 操作系统及版本 客户端平台
     const deviceNum = deviceInfo.brand + '-' + deviceInfo.model + '-' + deviceInfo.platform + '-' + deviceInfo.system
     this.globalData.deviceNum = deviceNum
   },
@@ -62,12 +66,12 @@ App<IAppOption>({
         password: code
       })
 
-      if(data.code === 200) {
+      if (data.code === 200) {
         const userToken = data.data.token_type + " " + data.data.access_token;
         wx.setStorageSync("token", userToken);
         this.globalData.isLogin = true;
         const users = await api_queryUserInfo({ wxAppId: this.globalData.appId })
-        if(users.data.code === 200) {
+        if (users.data.code === 200) {
           this.globalData.userInfo = users.data.data
         } else {
           wx.removeStorageSync("token");
@@ -77,7 +81,41 @@ App<IAppOption>({
       } else {
         this.globalData.isLogin = false;
       }
-    } catch {}
+    } catch { }
     wx.hideLoading()
+  },
+
+  // 判断逻辑
+  isTablet() {
+    const systemInfo = wx.getDeviceInfo();
+    const { model, platform } = systemInfo;
+    // console.log(systemInfo, 'systemInfo')
+    const wxWindowInfo = wx.getWindowInfo()
+    const { screenHeight, screenWidth } = wxWindowInfo
+    // console.log({
+    //   model,
+    //   platform,
+    //   screenHeight,
+    //   screenWidth
+    // }, wxWindowInfo)
+
+    // 1. 通过设备型号判断（iPad 或 Android 平板）
+    if (
+      model.includes("iPad") || // iPad
+      model.toLowerCase().includes("pad") || // 华为平板、小米平板等
+      (platform === "android" && Math.max(screenWidth, screenHeight) >= 900) // 大屏 Android 设备
+    ) {
+      return true;
+    }
+
+    const isIPad = /^iPad/.test(model) && platform === 'ios';
+    const isAndroidPad = screenWidth >= 768 && /pad|tablet/i.test(model);
+    const isPad = isIPad || isAndroidPad;
+
+    // 2. 通过屏幕宽高比判断（平板通常宽高比接近 4:3 或 3:4）
+    // const aspectRatio = screenWidth / screenHeight;
+    // const isTabletRatio = aspectRatio <= 0.75 || aspectRatio >= 1.33;
+
+    return isPad;
   }
 })

miniprogram/pages/index/index.less

@@ -13,7 +13,9 @@
   }
 
   .fistSwiperSection {
-    height: 1142rpx;
+    // height: 1142rpx;
+
+    height: 85vh;
     // height: 750rpx;
     padding-top: 48rpx;
 
@@ -21,6 +23,7 @@
       display: flex;
       align-items: center;
       justify-content: center;
+      // height: 85vh !important;
     }
   }
 
@@ -33,8 +36,11 @@
     /* 适当增大最大宽度，让缩放效果更明显 */
     max-height: 90%;
     /* 适当增大最大高度，让缩放效果更明显 */
-    width: 592rpx;
-    height: 1142rpx;
+    // width: 592rpx;
+    // height: 1142rpx;
+    // height: 100%;
+    width: 100%;
+    height: 85vh;
 
     &.current {
       transition: all 0.35s ease;
@@ -42,11 +48,18 @@
       max-height: 100%;
     }
 
+    &.tablet-item {
+      image {
+        height: 100% !important;
+        width: initial;
+      }
+    }
+
     image {
       display: block;
       margin: 0 auto;
-      height: 100% !important;
-      width: 100% !important;
+      // height: 100% !important;
+      width: 100%;
       // background: #FFFFFF;
       // border-radius: 32rpx;
     }
@@ -202,6 +215,8 @@ page {
     font-weight: bold;
     color: #FE2451;
     font-family: DINAlternate, DINAlternate;
+    display: flex;
+    align-items: flex-end;
 
     .stuff {
       padding-right: 2rpx;
@@ -804,9 +819,9 @@ page {
 
 .van-picker__toolbar,
 .toolbar-top {
-  margin: 0 40rpx !important;
-  padding: 0 14rpx !important;
-  border-bottom: 2rpx solid #F2F2F2;
+  margin: 0 20px !important;
+  padding: 0 7px !important;
+  border-bottom: 1px solid #F2F2F2;
   height: auto !important;
   line-height: normal !important;
 }
@@ -815,8 +830,8 @@ page {
 .van-picker__confirm,
 .toolbar-cancel,
 .toolbar-confirm {
-  font-size: 32rpx !important;
-  padding: 28rpx 0 !important;
+  font-size: 16px !important;
+  padding: 14px 0 !important;
   color: #777777 !important;
 }
 
@@ -833,9 +848,9 @@ page {
 
 .select-school {
   .van-cell {
-    padding: 32rpx 40rpx;
-    font-size: 32rpx;
-    --cell-line-height: 42rpx!important;
+    padding: 16px 20px;
+    font-size: 16px;
+    --cell-line-height: 21px!important;
 
     .van-icon-arrow {
       color: #BBBBBB;
@@ -846,19 +861,19 @@ page {
 
 .searchList {
   .icon-search {
-    width: 32rpx;
-    height: 32rpx;
-    margin: auto 10rpx auto auto;
+    width: 16px;
+    height: 16px;
+    margin: auto 5px auto auto;
   }
 
   .van-search {
-    margin: 0 26rpx 0 !important;
+    margin: 0 13px 0 !important;
     padding: 0 !important;
-    height: 70rpx !important;
+    height: 32px !important;
     background: #F6F6F6 !important;
-    border-radius: 35rpx !important;
-    border: 1rpx solid #FFFFFF !important;
-    --cell-line-height: 48rpx!important;
+    border-radius: 18px !important;
+    border: 1px solid #FFFFFF !important;
+    --cell-line-height: 24px!important;
   }
 
   .van-search__content {
@@ -867,46 +882,45 @@ page {
   }
 
   .van-cell {
-    font-size: 26rpx !important;
+    font-size: 13px !important;
   }
 
   .searchBtn {
-    width: 112rpx;
-    line-height: 54rpx !important;
+    width: 56px;
+    line-height: 27px !important;
     padding: 0 !important;
     text-align: center;
     background: linear-gradient(270deg, #FF204B 0%, #FE5B71 100%);
     font-weight: 500;
-    font-size: 28rpx;
+    font-size: 14px;
     color: #FFFFFF;
-    line-height: 40rpx;
-    border-radius: 40rpx;
-    margin-right: 6rpx;
+    line-height: 20px;
+    border-radius: 20px;
+    margin-right: 3px;
   }
 }
 
 .van-action-sheet__description {
-  font-size: 32rpx !important;
+  font-size: 16px !important;
   color: #777777 !important;
-  line-height: 44rpx !important;
-  padding: 28 0rpx !important;
-  margin: 0 26rpx !important;
+  line-height: 22px !important;
+  padding: 28px 0 !important;
+  margin: 0 13px !important;
 }
 .van-action-sheet__cancel {
-  font-size: 32rpx!important;
-  line-height: 44rpx!important;
+  font-size: 16px!important;
+  line-height: 22px!important;
 }
 
-
 .one-gender,
 .two-gender {
   font-weight: 600;
-  padding: 24rpx 0 !important;
-  font-size: 32rpx !important;
-  margin: 0 40rpx 16rpx !important;
-  width: calc(100% - 80rpx) !important;
+  padding: 12px 0 !important;
+  font-size: 16px !important;
+  margin: 0 20px 8px !important;
+  width: calc(100% - 40px) !important;
   color: #000000 !important;
-  line-height: 44rpx !important;
+  line-height: 22px !important;
 }
 
 .one-gender {

miniprogram/pages/index/index.ts

@@ -48,6 +48,7 @@ Page({
    * 页面的初始数据
    */
   data: {
+    isTablet: false,
     firstImgList: [
       'https://oss.dayaedu.com/ktyq/1739181226082.png',
       'https://oss.dayaedu.com/ktyq/1739181253580.png',
@@ -164,6 +165,11 @@ Page({
    * 生命周期函数--监听页面加载
    */
   onLoad() {
+    this.setData({
+      isTablet: app.globalData.isTablet
+    }, () => {
+      console.log(app.globalData, this.data)
+    })
     this.onControllTabBar(false)
   },
   /**

miniprogram/pages/index/index.wxml

@@ -5,8 +5,8 @@
       <navigation-bar title="器乐数字AI工具" back="{{false}}"></navigation-bar>
       <swiper indicator-dots="{{false}}" class="fistSwiperSection" previous-margin="78rpx" next-margin="78rpx" bindchange="onFirstChange">
         <swiper-item wx:for="{{firstImgList}}" wx:key="index">
-          <view class="swiper-item {{ firstCurrent == index ? 'current' : '' }}">
-            <image data-src="{{ item }}" mode="heightFix" src="{{ item }}"></image>
+          <view class="swiper-item {{ firstCurrent == index ? 'current' : '' }} {{ isTablet ? 'tablet-item' : '' }}">
+            <image mode="{{ isTablet ? 'heightFix' : 'widthFix' }}" data-src="{{ item }}"  src="{{ item }}"></image>
           </view>
         </swiper-item>
       </swiper>

typings/index.d.ts

@@ -7,8 +7,10 @@ interface IAppOption {
     appId: string,
     deviceNum: string,
     isLogin: boolean,
+    isTablet: boolean
   }
   userInfoReadyCallback?: WechatMiniprogram.GetUserInfoSuccessCallback,
   setAppId(): void,
-  onLogin(code: string): void
+  onLogin(code: string): void,
+  isTablet(): void
 }