From 02f3c991015d07e0401d568084b49a1a9f6892df Mon Sep 17 00:00:00 2001
From: j10c <blyb1739@gmail.com>
Date: Sun, 13 Oct 2024 10:40:03 +0800
Subject: [PATCH] fix(style): use css env as bottom-padding

Deprecate `isNewIPhone` function and related.
---
 src/components/BottomPanel/index.scss         |  7 ++---
 src/components/BottomPanel/index.vue          |  6 +----
 src/components/PopView/index.vue              |  5 +---
 .../lostfound/ContactMe/index.module.scss     |  8 ++----
 src/pages/lostfound/ContactMe/index.vue       |  3 +--
 src/pages/suit/ContactMe/index.module.scss    |  8 ++----
 src/pages/suit/ContactMe/index.vue            |  3 +--
 src/utils/effects.ts                          | 27 -------------------
 src/utils/index.ts                            |  4 +--
 9 files changed, 11 insertions(+), 60 deletions(-)

diff --git a/src/components/BottomPanel/index.scss b/src/components/BottomPanel/index.scss
index 9a76e7b5..8f02c17c 100644
--- a/src/components/BottomPanel/index.scss
+++ b/src/components/BottomPanel/index.scss
@@ -14,8 +14,5 @@
   border-top-left-radius: 1rem;
   z-index: 3000;
   background: var(--wjh-color-background-frame);
-}
-
-.bottom-bar-ios {
-  padding-bottom: 2rem;
-}
+  padding-bottom: env(safe-area-inset-bottom);
+}
\ No newline at end of file
diff --git a/src/components/BottomPanel/index.vue b/src/components/BottomPanel/index.vue
index cafa8fcd..a48c9233 100644
--- a/src/components/BottomPanel/index.vue
+++ b/src/components/BottomPanel/index.vue
@@ -1,14 +1,10 @@
 <template>
-  <view
-    class="bottom-panel"
-    :class="{ 'bottom-bar-ios': isNewIPhone() }"
-  >
+  <view class="bottom-panel">
     <slot />
   </view>
 </template>
 
 <script setup lang="ts">
-import { isNewIPhone } from "@/utils";
 import "./index.scss";
 
 </script>
diff --git a/src/components/PopView/index.vue b/src/components/PopView/index.vue
index 3f47b24e..831872dc 100644
--- a/src/components/PopView/index.vue
+++ b/src/components/PopView/index.vue
@@ -4,9 +4,7 @@
     <view
       class="wjh-pop-view-body"
       :class="positionClass"
-      :style="isNewIPhone()
-        && positionClass === 'bottom'
-        ? 'padding-bottom: 2rem' : '' "
+      :style="positionClass === 'bottom' && 'padding-bottom: env(safe-area-inset-bottom)'"
     >
       <slot />
     </view>
@@ -14,7 +12,6 @@
 </template>
 
 <script setup lang="ts">
-import { isNewIPhone } from "@/utils";
 import "./index.scss";
 import { computed, toRefs } from "vue";
 
diff --git a/src/pages/lostfound/ContactMe/index.module.scss b/src/pages/lostfound/ContactMe/index.module.scss
index 30e4fb96..e43ec401 100644
--- a/src/pages/lostfound/ContactMe/index.module.scss
+++ b/src/pages/lostfound/ContactMe/index.module.scss
@@ -11,6 +11,7 @@
   gap: 8Px;
   align-items: center;
   z-index: 1000;
+  padding-bottom: env(safe-area-inset-bottom);
   @include shadow;
 
   .arrow {
@@ -26,9 +27,4 @@
     color: var(--wjh-color-primary-dark);
     line-height: 150%;
   }
-}
-
-.ios {
-  padding-bottom: 2rem;
-}
-
+}
\ No newline at end of file
diff --git a/src/pages/lostfound/ContactMe/index.vue b/src/pages/lostfound/ContactMe/index.vue
index 8302b692..1316c27c 100644
--- a/src/pages/lostfound/ContactMe/index.vue
+++ b/src/pages/lostfound/ContactMe/index.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import styles from "./index.module.scss";
-import { isNewIPhone } from "@/utils";
 import Taro from "@tarojs/taro";
 
 const emit = defineEmits(["showHelp"]);
@@ -42,7 +41,7 @@ function handleTapHelp() {
 </script>
 
 <template>
-  <view :class="[styles.container, isNewIPhone() ? styles.ios : undefined]">
+  <view :class="[styles.container]">
     <view :class="styles.arrow" @tap="handleClick" />
     <text @tap="handleClick">
       点击查看相关业务服务组织的联系方式
diff --git a/src/pages/suit/ContactMe/index.module.scss b/src/pages/suit/ContactMe/index.module.scss
index 30e4fb96..e43ec401 100644
--- a/src/pages/suit/ContactMe/index.module.scss
+++ b/src/pages/suit/ContactMe/index.module.scss
@@ -11,6 +11,7 @@
   gap: 8Px;
   align-items: center;
   z-index: 1000;
+  padding-bottom: env(safe-area-inset-bottom);
   @include shadow;
 
   .arrow {
@@ -26,9 +27,4 @@
     color: var(--wjh-color-primary-dark);
     line-height: 150%;
   }
-}
-
-.ios {
-  padding-bottom: 2rem;
-}
-
+}
\ No newline at end of file
diff --git a/src/pages/suit/ContactMe/index.vue b/src/pages/suit/ContactMe/index.vue
index ca463190..a31ac049 100644
--- a/src/pages/suit/ContactMe/index.vue
+++ b/src/pages/suit/ContactMe/index.vue
@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import styles from "./index.module.scss";
-import { isNewIPhone } from "@/utils";
 import Taro from "@tarojs/taro";
 
 const emit = defineEmits(["showHelp"]);
@@ -39,7 +38,7 @@ function handleTapHelp() {
 </script>
 
 <template>
-  <view :class="[styles.container, isNewIPhone() ? styles.ios : undefined]">
+  <view :class="styles.container">
     <view :class="styles.arrow" @tap="handleClick" />
     <text @tap="handleClick">
       点击查看学生事务大厅的联系方式
diff --git a/src/utils/effects.ts b/src/utils/effects.ts
index 6a2e9f2d..8c9b1e98 100644
--- a/src/utils/effects.ts
+++ b/src/utils/effects.ts
@@ -1,33 +1,6 @@
-import Taro from "@tarojs/taro";
-
-/**
- * 适配苹果手机的大小
- * @returns
- */
-
-export function isNewIPhone(): boolean {
-  const info = Taro.getSystemInfoSync();
-  if (!info.model) return false;
-  const isNewIphone = info.model.match(
-    "(iPhone X|iPhone XS|iPhone 11|iPhone 12|iPhone 13|iPhone 14|iPhone 15)"
-  )?.length;
-  return isNewIphone !== undefined && isNewIphone > 0;
-}
-
-export function scrollViewHeight(top = true, bottom = true) {
-  let topHeight = "0px";
-  let bottomHeight = "0px";
-  if (top) topHeight = isNewIPhone() ? "87px" : "60px";
-  if (bottom) bottomHeight = isNewIPhone() ? "88px" : "64px";
-  return {
-    height: `calc(100vh - ${topHeight} - ${bottomHeight})`
-  };
-}
-
 /**
  * 实验室页面 精弘网络copyright
 */
-
 export function getCopyRight() {
   const currentYear = new Date().getFullYear();
   return `精弘网络@${currentYear}`;
diff --git a/src/utils/index.ts b/src/utils/index.ts
index 4e43e806..71d0786a 100644
--- a/src/utils/index.ts
+++ b/src/utils/index.ts
@@ -1,5 +1,5 @@
 import { cookiesToString, ejectCookies } from "./cookie";
-import { getCopyRight, isNewIPhone, scrollViewHeight } from "./effects";
+import { getCopyRight } from "./effects";
 import { fetch } from "./fetch";
 import { checkBind } from "./checkBind";
 import { checkNotification } from "./checkNotification";
@@ -13,8 +13,6 @@ export {
   FetchResult,
   ejectCookies,
   cookiesToString,
-  isNewIPhone,
-  scrollViewHeight,
   getCopyRight,
   fetch,
   checkBind,