浏览代码

fix:不同端跳转不同域名

jianghaili 6 天之前
父节点
当前提交
e0388f4d64
共有 5 个文件被更改,包括 44 次插入12 次删除
  1. 1 1
      index.html
  2. 2 0
      public/witour-logo.svg
  3. 14 6
      src/App.vue
  4. 12 5
      src/components/TopNavbar/index.vue
  5. 15 0
      src/utils/utils.js

+ 1 - 1
index.html

@@ -6,7 +6,7 @@
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
   <meta name="renderer" content="webkit">
   <meta name="renderer" content="webkit">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-  <link rel="icon" href="/favicon.ico">
+  <link rel="icon" href="/witour.ico" type="image/x-icon">
   <title>Witour</title>
   <title>Witour</title>
   <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
   <!--[if lt IE 11]><script>window.location.href='/html/ie.html';</script><![endif]-->
   <style>
   <style>

文件差异内容过多而无法显示
+ 2 - 0
public/witour-logo.svg


+ 14 - 6
src/App.vue

@@ -3,13 +3,21 @@
 </template>
 </template>
 
 
 <script setup>
 <script setup>
-import useSettingsStore from '@/store/modules/settings'
-import { handleThemeStyle } from '@/utils/theme'
-
+import useSettingsStore from "@/store/modules/settings";
+import { handleThemeStyle } from "@/utils/theme";
+import { onMounted, nextTick } from "vue";
+import { isMobile } from "@/utils/utils";
 onMounted(() => {
 onMounted(() => {
+  if (isMobile()) {
+    console.log("当前设备是移动设备");
+    window.location.href = "https://wap.wi-tour.com";
+  } else {
+    console.log("当前设备是电脑");
+    window.location.href = "https://www.wi-tour.com";
+  }
   nextTick(() => {
   nextTick(() => {
     // 初始化主题样式
     // 初始化主题样式
-    handleThemeStyle(useSettingsStore().theme)
-  })
-})
+    handleThemeStyle(useSettingsStore().theme);
+  });
+});
 </script>
 </script>

+ 12 - 5
src/components/TopNavbar/index.vue

@@ -46,11 +46,16 @@ const navs = [
 </script>
 </script>
 
 
 <style scoped lang="scss">
 <style scoped lang="scss">
-.top-navbar {
-  width: 100%;
-  height: 102px;
+.top-box{
   box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.08);
   box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.08);
   background: rgba(255, 255, 255, 0.05);
   background: rgba(255, 255, 255, 0.05);
+}
+.top-navbar {
+  width: 1480px;
+  height: 102px;
+  margin: auto;
+  // box-shadow: 0px 2px 7px 0px rgba(0, 0, 0, 0.08);
+  // background: rgba(255, 255, 255, 0.05);
   padding: 30px 80px;
   padding: 30px 80px;
   display: flex;
   display: flex;
   align-items: center;
   align-items: center;
@@ -83,14 +88,16 @@ const navs = [
   }
   }
 
 
   .navbar-center {
   .navbar-center {
+    width: 100%;
     display: flex;
     display: flex;
     align-items: center;
     align-items: center;
+    justify-content: center;
     gap: 24px;
     gap: 24px;
     .nav-item {
     .nav-item {
       color: #111;
       color: #111;
       font-size: 18px;
       font-size: 18px;
       cursor: pointer;
       cursor: pointer;
-      padding: 6px 20px;
+      // padding: 6px 20px;
       border-radius: 6px;
       border-radius: 6px;
       font-weight: 500;
       font-weight: 500;
       transition: background 0.2s, color 0.2s;
       transition: background 0.2s, color 0.2s;
@@ -115,7 +122,7 @@ const navs = [
     display: flex;
     display: flex;
     align-items: center;
     align-items: center;
     gap: 18px;
     gap: 18px;
-    margin-left: 32px;
+    // margin-left: 32px;
     .lang {
     .lang {
       font-size: 18px;
       font-size: 18px;
       font-weight: 700;
       font-weight: 700;

+ 15 - 0
src/utils/utils.js

@@ -0,0 +1,15 @@
+// 判断当前设备是电脑还是手机
+export function isMobile() {
+  const userAgent = navigator.userAgent || navigator.vendor || window.opera;
+
+  // 根据userAgent判断是否是移动设备
+  if (/android/i.test(userAgent)) {
+    return true;
+  }
+
+  if (/iPad|iPhone|iPod/.test(userAgent) && !window.MSStream) {
+    return true;
+  }
+
+  return false;
+}

部分文件因为文件数量过多而无法显示