Merge branch 'wyfMain-dev'

src/components/customDefaultPage/index.vue

@@ -3,6 +3,8 @@ import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
 import size375 from '@/components/customDefaultPage/size375/index.vue'
+import size768 from '@/components/customDefaultPage/size1920/index.vue'
+import size1440 from '@/components/customDefaultPage/size1920/index.vue'
 import size1920 from '@/components/customDefaultPage/size1920/index.vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
@@ -15,13 +17,11 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
-  }
+  } else if (viewWidth <= 1100) {
-  //    else if (viewWidth <= 1100) {
+    return size768
-  //     return size768;
+  } else if (viewWidth <= 1500) {
-  //   } else if (viewWidth <= 1500) {
+    return size1440
-  //     return size1440;
+  } else if (viewWidth <= 1920 || viewWidth > 1920) {
-  //   }
-  else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }
 })
@@ -30,7 +30,7 @@ const viewComponent = computed(() => {
 <template>
   <component :is="viewComponent" v-bind="$attrs">
     <template v-for="(_, slot) in $slots" #[slot]="scope">
-      <slot :name="slot" v-bind="scope"/>
+      <slot :name="slot" v-bind="scope" />
     </template>
   </component>
 </template>

src/components/customFooter/index.vue

@@ -3,6 +3,8 @@ import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
 import size375 from '@/components/customFooter/size375/index.vue'
+import size768 from '@/components/customFooter/size1920/index.vue'
+import size1440 from '@/components/customFooter/size1920/index.vue'
 import size1920 from '@/components/customFooter/size1920/index.vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
@@ -15,13 +17,11 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
-  }
+  } else if (viewWidth <= 1100) {
-  //    else if (viewWidth <= 1100) {
+    return size768
-  //     return size768;
+  } else if (viewWidth <= 1500) {
-  //   } else if (viewWidth <= 1500) {
+    return size1440
-  //     return size1440;
+  } else if (viewWidth <= 1920 || viewWidth > 1920) {
-  //   }
-  else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }
 })

src/components/customFooter/size1920/index.vue

@@ -1,23 +1,23 @@
 <template>
-    <!-- 通用页脚 -->
+  <!-- 通用页脚 -->
-    <div class="custom-footer">
+  <div class="custom-footer">
-      <span>Copyright &copy; 2024-2027 FiEE</span>
+    <span>Copyright &copy; 2024-2027 FiEE</span>
-    </div>
+  </div>
-  </template>
+</template>
-  
+
-  <script setup></script>
+<script setup></script>
-  
+
-  <style scoped lang="scss">
+<style scoped lang="scss">
-  .custom-footer {
+.custom-footer {
-    width: 100%;
+  width: 100%;
-    text-align: center;
+  text-align: center;
-    padding: 24px 0;
+  padding: 24px 0;
-    color: #888;
+  color: #888;
-    font-size: 15px;
+  // font-size: 15px;
-    background: #f7f8fa;
+  font-size: 1.05rem;
-    letter-spacing: 1px;
+  background: #f7f8fa;
-    border-top: 1px solid #ececec;
+  letter-spacing: 1px;
-    z-index: 100;
+  border-top: 1px solid #ececec;
-  }
+  z-index: 100;
-  </style>
+}
-  
+</style>

src/components/customHeader/index.vue

@@ -3,6 +3,8 @@ import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
 import size375 from '@/components/customHeader/size375/index.vue'
+import size768 from '@/components/customHeader/size375/index.vue'
+import size1440 from '@/components/customHeader/size1920/index.vue'
 import size1920 from '@/components/customHeader/size1920/index.vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
@@ -15,13 +17,11 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
-  }
+  } else if (viewWidth <= 768) {
-  //    else if (viewWidth <= 1100) {
+    return size768
-  //     return size768;
+  } else if (viewWidth <= 1500) {
-  //   } else if (viewWidth <= 1500) {
+    return size1440
-  //     return size1440;
+  } else if (viewWidth <= 1920 || viewWidth > 1920) {
-  //   }
-  else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }
 })

src/components/customHeader/size1920/index.vue

@@ -81,7 +81,7 @@ const handleToHome = () => {
 
 <style scoped lang="scss">
 .custom-header {
-  --header-height: 80px;
+  --header-height: 5rem;
   --primary-color: #8b59f7;
   transition: all 0.3s ease;
   background: transparent;
@@ -133,7 +133,8 @@ const handleToHome = () => {
     margin: 0 20px;
     transition: all 0.3s ease;
     font-weight: 700;
-    font-size: 16px;
+    // font-size: 16px;
+    font-size: 1.05rem;
     min-width: 120px;
     text-align: center;
 

src/views/events-calendar/index.vue

@@ -4,8 +4,10 @@
   </div>
 </template>
 <script setup>
-import size1920 from '@/views/events-calendar/size1920/index.vue'
 import size375 from '@/views/events-calendar/size375/index.vue'
+import size768 from '@/views/events-calendar/size375/index.vue'
+import size1440 from '@/views/events-calendar/size1920/index.vue'
+import size1920 from '@/views/events-calendar/size1920/index.vue'
 import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
@@ -14,6 +16,10 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
+  } else if (viewWidth <= 768) {
+    return size768
+  } else if (viewWidth <= 1500) {
+    return size1440
   } else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }

src/views/index/index.vue

@@ -1,6 +1,8 @@
 <script setup>
-import size1920 from '@/views/index/size1920/index.vue'
 import size375 from '@/views/index/size375/index.vue'
+import size768 from '@/views/index/size1920/index.vue'
+import size1440 from '@/views/index/size1920/index.vue'
+import size1920 from '@/views/index/size1920/index.vue'
 import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
@@ -9,6 +11,10 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
+  } else if (viewWidth <= 1100) {
+    return size768
+  } else if (viewWidth <= 1500) {
+    return size1440
   } else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }

src/views/press-releases/index.vue

@@ -4,8 +4,10 @@
   </div>
 </template>
 <script setup>
-import size1920 from '@/views/press-releases/size1920/index.vue'
 import size375 from '@/views/press-releases/size375/index.vue'
+import size768 from '@/views/press-releases/size375/index.vue'
+import size1440 from '@/views/press-releases/size1920/index.vue'
+import size1920 from '@/views/press-releases/size1920/index.vue'
 import { computed } from 'vue'
 import { useWindowSize } from '@vueuse/core'
 
@@ -14,6 +16,10 @@ const viewComponent = computed(() => {
   const viewWidth = width.value
   if (viewWidth <= 450) {
     return size375
+  } else if (viewWidth <= 768) {
+    return size768
+  } else if (viewWidth <= 1500) {
+    return size1440
   } else if (viewWidth <= 1920 || viewWidth > 1920) {
     return size1920
   }