From 565549fd30c7495dd3afec6bac0461d43c2b891d Mon Sep 17 00:00:00 2001
From: zhcnyuyang <yyydm@qq.com>
Date: Sat, 24 May 2025 01:48:31 +0800
Subject: [PATCH] =?UTF-8?q?=E6=A0=B9=E9=99=A4=E8=A1=8C=E4=B8=9A=E6=A1=88?=
 =?UTF-8?q?=E4=BE=8B=E8=A7=86=E9=A2=91=E6=97=A0=E6=B3=95=E6=92=AD=E6=94=BE?=
 =?UTF-8?q?=E9=97=AE=E9=A2=98=EF=BC=8C=E9=A1=BA=E4=BE=BF=E8=AE=A9=E5=A4=87?=
 =?UTF-8?q?=E6=A1=88=E5=8F=B7=E6=9C=80=E5=90=8E=E5=8A=A0=E8=BD=BD=E3=80=82?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue                 | 20 ++++++++++++--------
 src/components/Aboutus.vue  |  8 ++++----
 src/components/Examples.vue | 21 ++++++++++++---------
 src/components/Homepage.vue | 10 ++++------
 4 files changed, 32 insertions(+), 27 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 5d3f61a..f51ddbd 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -17,15 +17,10 @@ router.isReady().then(() => {
 <template>
   <div id="contentPane">
     <Toolbar></Toolbar>
+    <div v-if="$isMobile.android.phone||$isMobile.android.tablet" id="androidblackbar"></div>
     <div v-if="$route.path === '/ContactUs'">
       <router-view/>
-      <CopyrightIcp></CopyrightIcp>
-      <!-- 如果 ContactUs 页面也需要Footer并同样逻辑加载，则也加上 v-if -->
-      <!--
-      <div id="footer" v-if="isContentLoaded">
-        <Footer></Footer>
-      </div>
-      -->
+      <CopyrightIcp v-if="isContentLoaded"></CopyrightIcp>
     </div>
     <div v-else id="defaultcontainer">
       <div id="content"><router-view/></div>
@@ -33,7 +28,7 @@ router.isReady().then(() => {
       <div id="footer" v-if="isContentLoaded">
         <Footer></Footer>
       </div>
-      <CopyrightIcp></CopyrightIcp>
+      <CopyrightIcp v-if="isContentLoaded"></CopyrightIcp>
     </div>
   </div>
 </template>
@@ -42,6 +37,15 @@ router.isReady().then(() => {
 @import "node_modules/bootstrap/scss/_functions.scss";
 @import "node_modules/bootstrap/scss/_variables.scss";
 @import "node_modules/bootstrap/scss/_mixins.scss";
+#androidblackbar{
+  background-color: black;
+  @include media-breakpoint-between(xs, md) {
+    height:70px;
+  }
+  @include media-breakpoint-up(md){
+    height: 95.17px;
+  }
+}
 
 #contentPane{
   display: flex;
diff --git a/src/components/Aboutus.vue b/src/components/Aboutus.vue
index d09a944..a59d9eb 100644
--- a/src/components/Aboutus.vue
+++ b/src/components/Aboutus.vue
@@ -7,10 +7,10 @@ const { breakpoint } = useBootstrapBreakpoint();
 <template>
   <div class="pageroot" id="aboutusroot">
     <div id="aboutusbanner" class="videorootbanner">
-      <img v-if="$isMobile.android.phone||$isMobile.android.tablet"
-           src="/AboutusVideo.gif"
-           class="videoimg"/>
-      <video v-else-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
+<!--      <img v-if="$isMobile.android.phone||$isMobile.android.tablet"-->
+<!--           src="/AboutusVideo.gif"-->
+<!--           class="videoimg"/>-->
+      <video v-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
              poster="/AboutusVideoPreload.png"
              controls=""
              id="abtbannervideo"
diff --git a/src/components/Examples.vue b/src/components/Examples.vue
index 6314ec3..01bb6c4 100644
--- a/src/components/Examples.vue
+++ b/src/components/Examples.vue
@@ -1,19 +1,22 @@
 <script setup>
 import ExamplesContent from './ExamplesContent.vue';
+import { useBootstrapBreakpoint } from './useBreakpoint.js'; // 假设 useBreakpoint.js 路径正确
+const { breakpoint } = useBootstrapBreakpoint();
 </script>
 
 <template>
   <div class="pageroot" id="examplesprocessroot">
     <div id="examplebanner" class="videorootbanner">
-      <img v-if="$isMobile.android.phone||$isMobile.android.tablet"
-           src="/ExpVideoPreload.png"
-           class="videoimg"/>
-      <video v-else-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
-             poster="/bannervideopreload.png" controls="controls"
-             id="bannervideo" muted autoplay="autoplay" loop="loop"
-             playsinline webkit-playsinline
-             class="bannervideos"
-             x5-video-player-type="h5-page">
+<!--      <img v-if="$isMobile.android.phone||$isMobile.android.tablet"-->
+<!--           src="/ExpVideoPreload.png"-->
+<!--           class="videoimg"/>-->
+      <video v-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
+             poster="/ExpVideoPreload.png"
+             controls=""
+             id="expbannervideo"
+             muted autoplay="autoplay"
+             loop="loop" playsinline webkit-playsinline
+             class="bannervideos">
         <source src="/ExpVideo.mp4" type="video/mp4"></source>
       </video>
       <video v-else
diff --git a/src/components/Homepage.vue b/src/components/Homepage.vue
index f6c074f..57dd650 100644
--- a/src/components/Homepage.vue
+++ b/src/components/Homepage.vue
@@ -7,10 +7,10 @@ const { breakpoint } = useBootstrapBreakpoint();
 <template>
 <div id="homepageroot" class="pageroot">
   <div id="homepagebanner" class="videorootbanner">
-    <img v-if="$isMobile.android.phone||$isMobile.android.tablet"
-         src="/bannervideopreload.png"
-         class="videoimg"/>
-    <video v-else-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
+<!--    <img v-if="$isMobile.android.phone||$isMobile.android.tablet"-->
+<!--         src="/bannervideopreload.png"-->
+<!--         class="videoimg"/>-->
+    <video v-if="breakpoint==='xs'||breakpoint==='sm'||breakpoint==='md'"
            poster="/bannervideopreload.png" controls=""
            id="bannervideo" muted autoplay="autoplay" loop="loop"
            playsinline webkit-playsinline
@@ -284,12 +284,10 @@ export default {
   }
 
   @include media-breakpoint-between(xs, md) {
-    //margin-left: 32px;
     width: 326px;
   }
 
   @include media-breakpoint-between(md, xl) {
-    //margin-left: 100px;
     width: 326px;
   }