修改自适应

src/layout/index.vue

@@ -206,9 +206,6 @@ const toLogout = () => {
   userStore.logOut()
   router.push('/login')
 }
-// const toLink = (item) => {
-//   window.open(item.href, '_blank') // 在新标签页中打开URL
-// }
 watch(
   route,
   (newVal) => {
@@ -388,6 +385,7 @@ provide('selectMenu', selectMenu)
     min-height: 74.2vh;
   }
   .bottom {
+    position: relative;
     width: 100%;
     padding: 7px 0;
     font-size: $global-font-size-20;

src/views/main/elevenHatch/index.vue

@@ -154,7 +154,6 @@ onBeforeUnmount(() => {
 </script>
 <style scoped lang="scss">
 .main {
-  height: 100vh;
   width: 100%;
   position: relative;
   background: url('./images/bg.jpg');

src/views/main/one.vue

@@ -155,6 +155,19 @@
               </el-col>
             </el-col>
           </el-row>
+          <el-row :gutter="20" class="type">
+            <el-col :span="8" class="list" v-for="(item, index) in typeList" :key="index">
+              <div class="title">{{ item.title }}</div>
+              <div
+                class="list_1"
+                v-for="(tag, indexx) in item.list"
+                :key="indexx"
+                @click="toLink(item)"
+              >
+                {{ tag.name }}
+              </div>
+            </el-col>
+          </el-row>
         </div>
       </el-col>
     </el-row>
@@ -184,6 +197,42 @@ const loading = ref(false)
 const newsList = ref([])
 // 比赛
 const matchList = ref([])
+// 分类
+const typeList = ref([
+  {
+    title: '热门高校',
+    list: [
+      { name: '吉林省人民政府', href: 'https://www.jl.gov.cn/' },
+      { name: '长春市人民政府', href: 'http://www.changchun.gov.cn/' },
+      { name: '吉林省工信厅', href: 'http://gxt.jl.gov.cn/' },
+      { name: '吉林省国资委', href: 'http://gzw.jl.gov.cn/' },
+      { name: '吉林省财政厅', href: 'http://czt.jl.gov.cn/' },
+      { name: '吉林省金融监管局', href: 'http://jr.jl.gov.cn/' }
+    ]
+  },
+  {
+    title: '政府部门',
+    list: [
+      { name: '吉林省人民政府', href: 'https://www.jl.gov.cn/' },
+      { name: '长春市人民政府', href: 'http://www.changchun.gov.cn/' },
+      { name: '吉林省工信厅', href: 'http://gxt.jl.gov.cn/' },
+      { name: '吉林省国资委', href: 'http://gzw.jl.gov.cn/' },
+      { name: '吉林省财政厅', href: 'http://czt.jl.gov.cn/' },
+      { name: '吉林省金融监管局', href: 'http://jr.jl.gov.cn/' }
+    ]
+  },
+  {
+    title: '科研机构',
+    list: [
+      { name: '吉林省人民政府', href: 'https://www.jl.gov.cn/' },
+      { name: '长春市人民政府', href: 'http://www.changchun.gov.cn/' },
+      { name: '吉林省工信厅', href: 'http://gxt.jl.gov.cn/' },
+      { name: '吉林省国资委', href: 'http://gzw.jl.gov.cn/' },
+      { name: '吉林省财政厅', href: 'http://czt.jl.gov.cn/' },
+      { name: '吉林省金融监管局', href: 'http://jr.jl.gov.cn/' }
+    ]
+  }
+])
 
 const carouselList = ref([{ url: match1 }, { url: match2 }, { url: match3 }, { url: match4 }])
 // 请求
@@ -231,6 +280,9 @@ const removeHtmlStyle = (html) => {
   }
   return newHtml
 }
+const toLink = (item) => {
+  window.open(item.href, '_blank') // 在新标签页中打开URL
+}
 // 查看更多
 const toMore = () => {
   router.push({ path: `/five` })
@@ -419,5 +471,48 @@ const toMore = () => {
       }
     }
   }
+  .type {
+    margin: 10px 0;
+    .list {
+      margin: 10px 0;
+      .title {
+        font-size: $global-font-size-18;
+        font-weight: 600;
+        text-align: center;
+        color: #252f49;
+      }
+      .title::before {
+        content: '';
+        position: absolute;
+        transform: translateY(-50%);
+        top: 20px;
+        margin-left: -70px;
+        width: 40px;
+        height: 1px;
+        border-bottom: 1px #252f49 solid;
+      }
+      .title::after {
+        content: '';
+        position: absolute;
+        transform: translateY(-50%);
+        top: 20px;
+        margin-left: 30px;
+        width: 40px;
+        height: 1px;
+        border-bottom: 1px #252f49 solid;
+      }
+      .list_1 {
+        margin: 8px;
+        padding: 5px;
+        text-align: center;
+        border: 1px #ebe2e2 solid;
+        border-radius: 4px;
+      }
+      .list_1:hover {
+        background: #2280ff;
+        color: #ffffff;
+      }
+    }
+  }
 }
 </style>

src/views/main/twelveHatch/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="main">
+  <div class="twelve">
     <el-row>
       <el-col :span="24" class="animate__animated animate__backInRight" v-loading="loading">
         <div class="head clearfix">
@@ -128,8 +128,7 @@ onBeforeUnmount(() => {
 })
 </script>
 <style scoped lang="scss">
-.main {
-  height: 100vh;
+.twelve {
   width: 100%;
   position: relative;
   background: url('./images/bg.png');
@@ -214,7 +213,6 @@ onBeforeUnmount(() => {
 
   .head {
     position: relative;
-    height: 4rem;
     margin: 0 15px;
   }
   .head h1 {