From 7b4f1e1e8cf90f6e357639b696fdb7fa32348ff0 Mon Sep 17 00:00:00 2001
From: Phoenix <64720302+Concur-max@users.noreply.github.com>
Date: Thu, 1 Feb 2024 19:24:22 +0800
Subject: [PATCH] s

---
 src/assets/images/zu1236@2x.png | Bin 0 -> 3399 bytes
 src/views/aboutpage.vue         | 185 ++++++++++++++++++-----------
 src/views/homepage.vue          | 201 ++++++++++++++++++++------------
 3 files changed, 245 insertions(+), 141 deletions(-)
 create mode 100644 src/assets/images/zu1236@2x.png

diff --git a/src/assets/images/zu1236@2x.png b/src/assets/images/zu1236@2x.png
new file mode 100644
index 0000000000000000000000000000000000000000..13af5ed2bc9d40440dd778da6924e01b7c9eea97
GIT binary patch
literal 3399
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

literal 0
HcmV?d00001

diff --git a/src/views/aboutpage.vue b/src/views/aboutpage.vue
index 1bd9ac9..055570b 100644
--- a/src/views/aboutpage.vue
+++ b/src/views/aboutpage.vue
@@ -3,66 +3,72 @@
        class="100vw">
     <div style="height: 80px; background: #000"
          class="color-white row items-center">
-      <div class="col-3 col-md-4 row items-center justify-center">
-        <img src="../assets/images/icon-title.png"
-             style="width: 40px; height: 40px" /><span class="fl-ml-sm">延庆博物馆</span>
-      </div>
-
-      <div class="col-9 col-md-6 row justify-around items-center">
-        <div class="cursor header-title relative"
-             @click="handleLink('/home/navigation')">
-          首页
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          导航
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          展览
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          典藏
+      <template v-if="currentDevice==='pc'">
+        <div class="col-3 col-md-4 row items-center justify-center">
+          <img src="../assets/images/icon-title.png"
+               style="width: 40px; height: 40px" /><span class="fl-ml-sm">延庆博物馆</span>
         </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          资讯
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          文创
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          数字文脉
-        </div>
-        <div class="cursor header-title hover-dom relative">
-          关于
-          <div class="hidden-dom row justify-center"
-               style="position: absolute; top: 20px; left: -38px; z-index: 9999">
-            <div class="row justify-center secmenu fl-mt-lg"
-                 style="padding: 4px 8px">
-              <div class="cursor"
-                   style="padding: 8px; border-bottom: 1px solid #fff"
-                   @click="handleLink('/about/statutes')">
-                制度公开
-              </div>
 
-              <div class="cursor"
-                   style="padding: 8px; border-bottom: 1px solid #fff"
-                   @click="handleLink('/common/interpretive')">
-                讲解服务
-              </div>
-              <div class="cursor"
-                   style="padding: 8px"
-                   @click="handleLink('/common/audiencesurveys')">
-                观众调查
+        <div class="col-9 col-md-6 row justify-around items-center">
+          <div class="cursor header-title relative"
+               @click="handleLink('/home/navigation')">
+            首页
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            导航
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            展览
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            典藏
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            资讯
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            文创
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            数字文脉
+          </div>
+
+          <div class="cursor header-title hover-dom relative">
+            关于
+            <div class="hidden-dom row justify-center"
+                 style="position: absolute; top: 20px; left: -38px; z-index: 9999">
+              <div class="row justify-center secmenu fl-mt-lg"
+                   style="padding: 4px 8px">
+                <div class="cursor"
+                     style="padding: 8px; border-bottom: 1px solid #fff"
+                     @click="handleLink('/about/statutes')">
+                  制度公开
+                </div>
+
+                <div class="cursor"
+                     style="padding: 8px; border-bottom: 1px solid #fff"
+                     @click="handleLink('/common/interpretive')">
+                  讲解服务
+                </div>
+                <div class="cursor"
+                     style="padding: 8px"
+                     @click="handleLink('/common/audiencesurveys')">
+                  观众调查
+                </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
+      </template>
+      <template v-if="currentDevice==='mobile'">
+        <div class="mobile-title">{{route.meta.title}}</div>
+      </template>
     </div>
     <div class="row fl-page-width">
       <div class="color-white overflow-auto about-menu"
@@ -83,18 +89,30 @@
     </div>
     <div style="height: 145px; background: #000"
          class="row justify-center color-white relative">
-      <div class="col-6 col-md-4 row justify-around"
-           style="margin-top: 32px; max-width: 300px">
-        <div class="cursor"
-             @click="handleLink('')">帮助</div>
-        <div class="cursor"
-             @click="handleLink('')">隐私</div>
-        <div class="cursor"
-             @click="handleLink('')">条款</div>
-        <div class="col-12 cursor text-center">
-          copyright 2024 最终所有权归延庆博物馆
+      <template v-if="currentDevice==='pc'">
+        <div class="col-6 col-md-4 row justify-around"
+             style="margin-top: 32px; max-width: 300px">
+          <div class="cursor"
+               @click="handleLink('')">帮助</div>
+          <div class="cursor"
+               @click="handleLink('')">隐私</div>
+          <div class="cursor"
+               @click="handleLink('')">条款</div>
+          <div class="col-12 cursor text-center">
+            copyright 2024 最终所有权归延庆博物馆
+          </div>
         </div>
-      </div>
+      </template>
+      <template v-if="currentDevice==='mobile'">
+        <div class="mobile-footer">
+          <div class="content1">
+            <div class="wrap1">
+              <img src="@/assets/images/zu1236@2x.png" alt="">
+            </div>
+            <div class="wrap2">延庆博物馆</div>
+          </div>
+        </div>
+      </template>
       <div v-if="state.isH5 == 'true'"
            style="
           border-radius: 50%;
@@ -208,6 +226,8 @@ import {
   nextTick,
 } from "vue";
 import { useRoute, useRouter } from "vue-router";
+import {useAdaptation} from '@/utils/self-adaption.js'
+const {currentDevice}= useAdaptation()
 const route = useRoute();
 const router = useRouter();
 const state = reactive({
@@ -291,7 +311,40 @@ const handleSecMenuClick = () => {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.mobile-footer{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .content1{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .wrap2{
+      margin-left: 15px;
+      font-size: 77px;
+      color: #fff;
+
+    }
+    .wrap1{
+      width: 137px;
+      height: 137px;
+      img{
+        width: 137px;
+        height: 137px;
+
+      }
+    }
+  }
+}
+.mobile-title{
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 80px;
+}
 .header-title {
   padding: 4px 18px;
   border-radius: 25px;
diff --git a/src/views/homepage.vue b/src/views/homepage.vue
index 039fdfc..7900b66 100644
--- a/src/views/homepage.vue
+++ b/src/views/homepage.vue
@@ -3,67 +3,72 @@
        class="100vw">
     <div style="height: 80px; background: #000"
          class="color-white row items-center">
-      <div class="col-3 col-md-4 row items-center justify-center">
-        <img src="../assets/images/icon-title.png"
-             style="width: 40px; height: 40px" /><span class="fl-ml-sm">延庆博物馆</span>
-      </div>
-
-      <div class="col-9 col-md-6 row justify-around items-center">
-        <div class="cursor header-title relative"
-             @click="handleLink('/home/navigation')">
-          首页
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          导航
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          展览
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          典藏
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          资讯
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          文创
-        </div>
-        <div class="cursor header-title relative"
-             @click="handleLink('')">
-          数字文脉
+      <template v-if="currentDevice==='pc'">
+        <div class="col-3 col-md-4 row items-center justify-center">
+          <img src="../assets/images/icon-title.png"
+               style="width: 40px; height: 40px" /><span class="fl-ml-sm">延庆博物馆</span>
         </div>
 
-        <div class="cursor header-title hover-dom relative">
-          关于
-          <div class="hidden-dom row justify-center"
-               style="position: absolute; top: 20px; left: -38px; z-index: 9999">
-            <div class="row justify-center secmenu fl-mt-lg"
-                 style="padding: 4px 8px">
-              <div class="cursor"
-                   style="padding: 8px; border-bottom: 1px solid #fff"
-                   @click="handleLink('/about/statutes')">
-                制度公开
-              </div>
+        <div class="col-9 col-md-6 row justify-around items-center">
+          <div class="cursor header-title relative"
+               @click="handleLink('/home/navigation')">
+            首页
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            导航
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            展览
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            典藏
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            资讯
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            文创
+          </div>
+          <div class="cursor header-title relative"
+               @click="handleLink('')">
+            数字文脉
+          </div>
 
-              <div class="cursor"
-                   style="padding: 8px; border-bottom: 1px solid #fff"
-                   @click="handleLink('/common/interpretive')">
-                讲解服务
-              </div>
-              <div class="cursor"
-                   style="padding: 8px"
-                   @click="handleLink('/common/audiencesurveys')">
-                观众调查
+          <div class="cursor header-title hover-dom relative">
+            关于
+            <div class="hidden-dom row justify-center"
+                 style="position: absolute; top: 20px; left: -38px; z-index: 9999">
+              <div class="row justify-center secmenu fl-mt-lg"
+                   style="padding: 4px 8px">
+                <div class="cursor"
+                     style="padding: 8px; border-bottom: 1px solid #fff"
+                     @click="handleLink('/about/statutes')">
+                  制度公开
+                </div>
+
+                <div class="cursor"
+                     style="padding: 8px; border-bottom: 1px solid #fff"
+                     @click="handleLink('/common/interpretive')">
+                  讲解服务
+                </div>
+                <div class="cursor"
+                     style="padding: 8px"
+                     @click="handleLink('/common/audiencesurveys')">
+                  观众调查
+                </div>
               </div>
             </div>
           </div>
         </div>
-      </div>
+      </template>
+      <template v-if="currentDevice==='mobile'">
+        <div class="mobile-title">{{route.meta.title}}</div>
+      </template>
     </div>
     <div>
       <router-view></router-view>
@@ -71,19 +76,30 @@
 
     <div style="height: 145px; background: #000"
          class="row justify-center color-white relative">
-      <div class="col-6 col-md-4 row justify-around"
-           style="margin-top: 32px; max-width: 300px">
-        <div class="cursor"
-             @click="handleLink('')">帮助</div>
-        <div class="cursor"
-             @click="handleLink('')">隐私</div>
-        <div class="cursor"
-             @click="handleLink('')">条款</div>
-        <div class="col-12 cursor text-center">
-          copyright 2024 最终所有权归延庆博物馆
-        </div>
-      </div>
-
+<template v-if="currentDevice==='pc'">
+  <div class="col-6 col-md-4 row justify-around"
+       style="margin-top: 32px; max-width: 300px">
+    <div class="cursor"
+         @click="handleLink('')">帮助</div>
+    <div class="cursor"
+         @click="handleLink('')">隐私</div>
+    <div class="cursor"
+         @click="handleLink('')">条款</div>
+    <div class="col-12 cursor text-center">
+      copyright 2024 最终所有权归延庆博物馆
+    </div>
+  </div>
+</template>
+<template v-if="currentDevice==='mobile'">
+<div class="mobile-footer">
+  <div class="content1">
+    <div class="wrap1">
+      <img src="@/assets/images/zu1236@2x.png" alt="">
+    </div>
+    <div class="wrap2">延庆博物馆</div>
+  </div>
+</div>
+</template>
       <div v-if="state.isH5 == 'true'"
            style="
           border-radius: 50%;
@@ -197,6 +213,8 @@ import {
   watch,
   nextTick,
 } from "vue";
+import {useAdaptation} from '@/utils/self-adaption.js'
+const {currentDevice}= useAdaptation()
 import { useRoute, useRouter } from "vue-router";
 const route = useRoute();
 const router = useRouter();
@@ -212,13 +230,13 @@ onBeforeMount(() => {
   state.isH5 = localStorage.getItem("isH5");
 });
 watch(
-  () => route.path,
-  (to, from) => {
-    // 执行路由变化时的操作
-    state.showMenu = false
-    state.showSecMenu = false
-  },
-  { deep: true }
+    () => route.path,
+    (to, from) => {
+      // 执行路由变化时的操作
+      state.showMenu = false
+      state.showSecMenu = false
+    },
+    { deep: true }
 );
 const handleLink = (url) => {
   if (url) {
@@ -236,7 +254,40 @@ const handleSecMenuClick = () => {
 }
 </script>
 
-<style scoped>
+<style scoped lang="scss">
+.mobile-footer{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  .content1{
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    .wrap2{
+      margin-left: 15px;
+      font-size: 77px;
+      color: #fff;
+
+    }
+    .wrap1{
+      width: 137px;
+      height: 137px;
+      img{
+        width: 137px;
+        height: 137px;
+
+      }
+    }
+  }
+}
+.mobile-title{
+  width: 100%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #fff;
+  font-size: 80px;
+}
 .header-title {
   padding: 4px 18px;
   border-radius: 25px;