兼容ipad样式

components/search/search.vue

@@ -114,7 +114,7 @@
 		padding: 0 15rpx;
 		.searchInput{
 			margin-left: 20rpx;
-			width: 85%;
+			width: 100%;
 			padding: 15rpx;
 			color: #fff;
 			font-size: 26rpx;

pages/courselist/courselist.vue

@@ -24,7 +24,7 @@
 			</view>
 		</view>
 		<view class="productBox">
-			<view class="productList">
+			<view class="productList" :style="{marginTop}">
 				<view class="productItem" v-for="item in cffpCourseInfos" :key="item.fileId" >
 					<view class="top" @click="goDetail(item)">
 						<view class="left">
@@ -82,31 +82,7 @@
 				</view>
 			</view>
 		</view>
-		<!--搜索组件-->
-		<!-- <search   
-			:isSearch="1" 
-			:userId = "userId" 
-			@send="getCourseList" 
-			:initialQuery="queryName"
-		></search> -->
-		<!--轮播组件-->
-		<!-- <view class="banner">
-			<view class="uni-margin-wrap">
-				<carousel :carouselList="fileUploadItemCFFPList"></carousel>
-			</view>
-		</view> -->
-		<!-- <h4 v-if="cffpCourseInfos.length<=0" class="noListTip">暂无产品列表</h4>
-		<view class="ulBox" v-if="cffpCourseInfos.length>0">
-			<view class="liBox" v-for="item in cffpCourseInfos" :key="item.fileId" @click="goDetail(item)">
-				<course-item 
-					:thumbnailPath="item.displayImage" 
-					:title="item.fileTitle" 
-					:summaryBox="item.fileSynopsis" 
-					:dataList="{coursePrice:item.coursePrice,salesNumber:item.salesNumber}" 
 		
-				></course-item>
-			</view>
-		</view> -->
 	</view>
 	<!-- <tabBar :currentPage="currentPage" v-if="onlyShowList!=0"></tabBar> -->
 </template>
@@ -136,7 +112,8 @@
 				userId: uni.getStorageSync('cffp_userId'),
 				runEnv:dataHandling.getRuntimeEnv(), //运行的环境  browser、app、h5
 				shareTipsFlag:false,
-				sourceType:'1',//根据来源展示二维码 默认是cffp
+				sourceType:'1',//根据来源展示二维码 默认是cffp,
+				env:dataHandling.getRuntimeEnv2()
 			}
 		},
 		name:'courselist',
@@ -156,6 +133,15 @@
 		    this.courseList();
 			this.sourceType = uni.getStorageSync('addSystemType') || '1';
 		  },
+		  computed:{
+			  marginTop(){
+				  if(this.env.device.isMobile){
+					  return '-5%'
+				  }else {
+					  return '-1.5%'
+				  }
+			  }
+		  },
 		methods:{
 			gotoShare(item){
 				if(this.runEnv == 'browser'){
@@ -362,7 +348,7 @@
 			.productList{
 				width: 100%;
 				box-sizing: border-box;
-				margin-top: -7%;
+				// margin-top: -2%;
 				background-color: #fff;
 				padding: 20rpx;
 				border-radius: 10rpx;
@@ -431,8 +417,9 @@
 							}
 							.right{
 								
-								// display: flex;
-								// align-items: center;
+								display: flex;
+								align-items: center;
+								justify-content: center;
 								padding: 15rpx  10rpx 15rpx 15rpx;
 								background: rgba(36, 37, 137, 1);
 								width: 20%;

util/dataHandling.ts

@@ -205,5 +205,72 @@ export default{
 	    console.warn('环境判断失败:', e);
 	    return 'unknown';
 	  }
+	},
+	/**
+	 * 判断当前运行环境
+	 * @returns {Object} 包含环境信息的对象
+	 */
+	 getRuntimeEnv2() {
+	  // 获取uni-app系统信息
+	  const systemInfo = uni.getSystemInfoSync()
+	  
+	  // 判断平台类型
+	  const isH5 = systemInfo.platform === 'h5'
+	  const isApp = systemInfo.platform === 'android' || systemInfo.platform === 'ios'
+	  const isMP = systemInfo.platform === 'mp-weixin' // 微信小程序
+	  
+	  // 判断设备类型
+	  let isMobile = false
+	  let isTablet = false
+	  let isDesktop = false
+	  
+	  // 在H5环境下需要额外判断
+	  if (isH5) {
+	    // 通过userAgent判断
+	    const userAgent = navigator.userAgent.toLowerCase()
+	    const isMobileUserAgent = /mobile|android|iphone|ipad|ipod/.test(userAgent)
+	    
+	    // 通过屏幕尺寸判断
+	    const isSmallScreen = window.innerWidth < 768
+	    
+	    // 在开发环境下，如果浏览器开启了手机模拟器模式，也认为是手机
+	    isMobile = isMobileUserAgent || isSmallScreen
+	    
+	    // 平板判断
+	    isTablet = !isMobile && (systemInfo.windowWidth >= 768 && systemInfo.windowWidth < 992)
+	    
+	    // 桌面判断
+	    isDesktop = !isMobile && !isTablet
+		return
+	  } else {
+	    // 非H5环境使用uni-app提供的信息
+	    isMobile = systemInfo.deviceType === 'phone'
+	    isTablet = systemInfo.deviceType === 'pad'
+	    isDesktop = false // 非H5环境下不会有桌面端
+	  }
+	  
+	  return {
+	    // 平台类型
+	    platform: {
+	      isH5,
+	      isApp,
+	      isMP,
+	      isWeixin: isMP, // 微信小程序别名
+	      isAndroid: systemInfo.platform === 'android',
+	      isIOS: systemInfo.platform === 'ios',
+	    },
+	    
+	    // 设备类型
+	    device: {
+	      isMobile,
+	      isTablet,
+	      isDesktop,
+	      isIPhone: systemInfo.model && systemInfo.model.includes('iPhone'),
+	      isIPad: systemInfo.model && systemInfo.model.includes('iPad'),
+	    },
+	    
+	    // 原始系统信息
+	    systemInfo,
+	  }
 	}
 }
\ No newline at end of file