登录只有苹果设备才显示苹果登录

pages/start/login/login.vue

@@ -10,7 +10,7 @@
       </view> -->
       <view class="nav-right">
         <image
-        @click="goToService"
+          @click="goToService"
           class="icons"
           src="../../../static/icons/Headset.png"
           alt="联系客服"
@@ -209,7 +209,11 @@
 
     <!-- 第三方登录 -->
     <view class="third-party-login">
-      <view class="third-party-btn" @click="loginWithApple">
+      <view
+        v-if="isAppleDevice"
+        class="third-party-btn"
+        @click="loginWithApple"
+      >
         <image
           class="apple-icon"
           src="../../../static/icons/appleIcons.png"
@@ -253,7 +257,7 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { computed, ref } from "vue";
 // 导入完整的国家列表
 import countryList from "./list.js";
 import footerBar from "../../../components/footerBar";
@@ -285,6 +289,19 @@ const verifyCode = ref("");
 const account = ref("");
 const isLoading = ref(false);
 
+const deviceStore = useDeviceStore();
+
+const isAppleDevice = computed(() => {
+  if (deviceStore.deviceInfo.brand) {
+    return deviceStore.deviceInfo.brand.toLowerCase() === "apple";
+  }
+
+  if (deviceStore.deviceInfo.system) {
+    return deviceStore.deviceInfo.system.includes("ios");
+  }
+  return false;
+});
+
 // 使用从list.js导入的完整国家列表数据
 const countries = ref(
   countryList.list.map((item) => ({
@@ -355,8 +372,6 @@ async function Login() {
     return;
   }
 
-  const deviceStore = useDeviceStore();
-
   const account = changeAccount();
   const loginType = changeLoginType();
   isLoading.value = true;