样式适配

src/views/HomeView/Works.vue

@@ -10,7 +10,7 @@
 			<div v-show="!isScroll" class="modal_title_text_assistant gallery_btn white" :class="{active:'NewYear_2025' == worksSelect}" @click="setWorksSelect({value:'NewYear_2025'})">NewYear_2025</div>
 		</div> -->
         <div class="page_content" ref="autoscrollDom">
-			<Falls ref="fall" @loadend="isShowMark = false" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
+			<Falls ref="fall" @loadend="isShowMark = false" :itemWidth="failWidth" @setPortfolioLike="setPortfolioLike" :isScroll="isScroll" @getImgScale="getImgScale"></Falls>
 			<div class="page_loading_box" v-show="!isNoData">
 				<span class="page_loading" v-show="!isShowMark"></span>
 				<span v-show="isShowMark">
@@ -72,6 +72,7 @@ export default defineComponent({
 		let filter:any = reactive({
 			worksSelect: 'all',
 			isNull:true,
+			failWidth:300,
 			worksType: [
 				{
 					name: useI18n().t('works.all'),
@@ -163,16 +164,57 @@ export default defineComponent({
 		}
 		let getImgScale = (item:any)=>{
 			let newScaleModel = null
-			if(window.innerWidth < 768){
-				newScaleModel = newScaleImageMobile
-			}else{
+			if(getScreenOrientation() == 'landscape'){
 				newScaleModel = newScaleImage
 				newScaleModel.value.scaleImageMask = true
-
+			}else{
+				newScaleModel = newScaleImageMobile
 			}
 			newScaleModel.value.init(item)
 			
 		}
+		function getScreenOrientation() {
+			// 优先使用标准API
+			if (screen.orientation) {
+				return screen.orientation.type.includes('portrait') ? 'portrait' : 'landscape';
+			}
+			// 回退到宽高比检测
+			return window.innerWidth > window.innerHeight ? 'landscape' : 'portrait';
+			}
+
+			// 监听方向变化
+			function setupOrientationListener(callback) {
+			// 标准事件
+			const handleOrientationChange = () => {
+				callback(getScreenOrientation());
+			};
+
+			// 优先使用标准API
+			if (screen.orientation) {
+				screen.orientation.addEventListener('change', handleOrientationChange);
+			} 
+			// 回退到resize事件
+			else {
+				window.addEventListener('resize', handleOrientationChange);
+			}
+			// 返回清除监听的方法
+			return () => {
+				if (screen.orientation) {
+				screen.orientation.removeEventListener('change', handleOrientationChange);
+				} else {
+				window.removeEventListener('resize', handleOrientationChange);
+				}
+			};
+			}
+			const cleanup = setupOrientationListener((orientation) => {
+				if (orientation === 'portrait') {
+					// 竖屏逻辑
+					return 'portrait'
+				} else {
+					// 横屏逻辑
+					return 'landscape'
+				}
+		});
 		let getPorfolio = ()=>{
 			let data = filter.getListDate
 			if(filter.isShowMark && !filter.isNoData)return
@@ -253,6 +295,7 @@ export default defineComponent({
 			{ immediate: true } // 立即触发一次以处理初始参数
 			);
 		onMounted (()=>{
+			if(window.innerWidth < 1200)filter.failWidth = 120
 			nextTick(()=>{
 				setPorfolioDom()
 			})