From 5f3aad25399034fb2b85ce9b25a5cf9efdbd1c0a Mon Sep 17 00:00:00 2001
From: guoyue <guoyue2@hisense.com>
Date: Tue, 18 Oct 2022 10:45:40 +0800
Subject: [PATCH] =?UTF-8?q?=E8=A5=BF=E6=B5=B7=E5=B2=B8=EF=BC=9A=E7=82=B9?=
 =?UTF-8?q?=E5=87=BB=E5=9B=BE=E6=A0=87=E8=BF=9B=E5=85=A5=E9=A6=96=E9=A1=B5?=
 =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E6=9D=83=E9=99=90=E5=88=A4=E6=96=AD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 front/src/views/home/components/header.vue | 950 ++++++++++-----------
 1 file changed, 460 insertions(+), 490 deletions(-)

diff --git a/front/src/views/home/components/header.vue b/front/src/views/home/components/header.vue
index c9495bdb..0e35d30e 100644
--- a/front/src/views/home/components/header.vue
+++ b/front/src/views/home/components/header.vue
@@ -1,11 +1,8 @@
 <template>
-  <div
-    class="home-header"
-    :class="[
-      select !== 'home' || scrollTop > 500 ? 'white' : '',
-      props.showView === 'algorithm-details' ? '' : '',
-    ]"
-  >
+  <div class="home-header" :class="[
+    select !== 'home' || scrollTop > 500 ? 'white' : '',
+    props.showView === 'algorithm-details' ? '' : '',
+  ]">
     <div class="name" @click="goToHome">
       <div class="name-bg" v-if="!itShowXiHaiAn"></div>
       <div class="name-bg-xihaian" v-else></div>
@@ -14,52 +11,26 @@
         <p>(United Capacity System)</p>
       </div>
     </div>
-    <div
-      v-for="item in navList"
-      :key="item.key"
-      @click="jumpPage(item)"
-      class="nav"
-      :class="item.key == select ? 'select' : ''"
-    >
+    <div v-for="item in navList" :key="item.key" @click="jumpPage(item)" class="nav"
+      :class="item.key == select ? 'select' : ''">
       {{ item.name }}
     </div>
     <!-- 购物车 -->
     <a-badge :count="sgcNum">
-      <svg
-        t="1650455446850"
-        class="icon"
-        viewBox="0 0 1024 1024"
-        version="1.1"
-        xmlns="http://www.w3.org/2000/svg"
-        p-id="2069"
-        width="0.4rem"
-        height="0.4rem"
-        @click="goToSgc"
-      >
+      <svg t="1650455446850" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+        p-id="2069" width="0.4rem" height="0.4rem" @click="goToSgc">
         <path
           d="M384 832v85.333333h-85.333333v-85.333333h85.333333z m405.333333 0v85.333333h-85.333333v-85.333333h85.333333zM240.32 185.002667l24.149333 140.928h633.173334L835.285333 746.666667h-563.626666l-85.333334-497.685334H94.485333v-64h145.834667z m583.104 204.928H275.434667L325.632 682.666667h454.464l43.328-292.736z"
-          :fill="props.showView === 'algorithm-details' ? '#1296db' : '#1296db'"
-          p-id="2070"
-        ></path>
+          :fill="props.showView === 'algorithm-details' ? '#1296db' : '#1296db'" p-id="2070"></path>
       </svg>
     </a-badge>
     <a-badge :count="mynoticeNum" style="margin-left: 0.2rem">
       <!-- 消息提醒 -->
-      <svg
-        t="1654051054113"
-        class="icon2"
-        viewBox="0 0 1024 1024"
-        version="1.1"
-        xmlns="http://www.w3.org/2000/svg"
-        p-id="2187"
-        width="0.35rem"
-        height="0.35rem"
-      >
+      <svg t="1654051054113" class="icon2" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg"
+        p-id="2187" width="0.35rem" height="0.35rem">
         <path
           d="M544 161.536a330.666667 330.666667 0 0 1 298.666667 329.130667h-0.341334c0.213333 1.493333 0.341333 2.986667 0.341334 4.565333v219.434667h39.68a32 32 0 0 1 0 64h-212.053334a160 160 0 0 1-316.586666 0H141.909333a32 32 0 1 1 0-64h39.424v-219.434667c0-1.578667 0.128-3.072 0.341334-4.565333H181.333333a330.666667 330.666667 0 0 1 298.666667-329.130667V128a32 32 0 1 1 64 0v33.536z m-298.666667 553.130667h533.333334v-219.434667c0-1.578667 0.128-3.072 0.341333-4.565333h-0.341333a266.666667 266.666667 0 1 0-533.333334 0h-0.341333c0.213333 1.493333 0.341333 2.986667 0.341333 4.565333v219.434667z m359.765334 64H418.901333a96 96 0 0 0 186.197334 0z"
-          :fill="props.showView === 'algorithm-details' ? '#1296db' : '#1296db'"
-          p-id="2188"
-        ></path>
+          :fill="props.showView === 'algorithm-details' ? '#1296db' : '#1296db'" p-id="2188"></path>
       </svg>
       <!-- <a-avatar shape="square" size="large" /> -->
     </a-badge>
@@ -88,10 +59,7 @@
         <template #title>
           <span>{{ user.realName }}</span>
         </template>
-        <span
-          class="name"
-          @click="jumpPage({ name: '个人中心', key: 'personalCenter' })"
-        >
+        <span class="name" @click="jumpPage({ name: '个人中心', key: 'personalCenter' })">
           {{ user.realName }}
         </span>
       </a-tooltip>
@@ -114,171 +82,234 @@
           fill="#bfbfbf"
         ></path>
       </svg> -->
-      <i
-        @click="jumpPage({ name: '后台管理', key: 'houtaiguanli' })"
-        class="iconTo"
-        v-show="backFlag"
-      ></i>
+      <i @click="jumpPage({ name: '后台管理', key: 'houtaiguanli' })" class="iconTo" v-show="backFlag"></i>
     </div>
   </div>
 </template>
 <script setup>
-  import { ref, onMounted, onBeforeUnmount, defineProps } from 'vue'
-  import { getUserInfo } from '@/api/user'
-  import { recordRoute } from '@/config'
-  import { useRoute, useRouter } from 'vue-router'
-  import { mynotice } from '@/api/home'
-  import { useStore } from 'vuex'
-  import { getSgcTotal } from '@/api/home'
-  import Cookies from 'js-cookie'
-  import mybus from '@/myplugins/mybus'
-  import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
-  import { message } from 'ant-design-vue'
+import { ref, onMounted, onBeforeUnmount, defineProps } from 'vue'
+import { getUserInfo } from '@/api/user'
+import { recordRoute } from '@/config'
+import { useRoute, useRouter } from 'vue-router'
+import { mynotice } from '@/api/home'
+import { useStore } from 'vuex'
+import { getSgcTotal } from '@/api/home'
+import Cookies from 'js-cookie'
+import mybus from '@/myplugins/mybus'
+import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
+import { message } from 'ant-design-vue'
 
-  const store = useStore()
-  const router = useRouter()
-  const route = useRoute()
-  const itShowXiHaiAn = ref(whoShow.itShowXiHaiAn)
+const store = useStore()
+const router = useRouter()
+const route = useRoute()
+const itShowXiHaiAn = ref(whoShow.itShowXiHaiAn)
 
-  // 用户信息
-  const user = ref({
-    username: store.getters['user/username'],
-    realName: store.getters['user/realName'],
-  })
-  const select = ref(router.currentRoute.value.name)
-  const mynoticeFlag = ref(false)
-  const mynoticeData = ref([])
-  const navList = ref(navListManagement.navList)
-  const backFlag = ref(true)
-  getUserInfo().then((res) => {
-    if (
-      res.data.data.roleIdList.length == 0 &&
-      res.data.data.superAdmin === 0
-    ) {
-      backFlag.value = false
-    }
-  })
-  console.log('navList------------>', navList)
+// 用户信息
+const user = ref({
+  username: store.getters['user/username'],
+  realName: store.getters['user/realName'],
+})
+const select = ref(router.currentRoute.value.name)
+const mynoticeFlag = ref(false)
+const mynoticeData = ref([])
+const navList = ref(navListManagement.navList)
+const backFlag = ref(true)
+getUserInfo().then((res) => {
+  if (
+    res.data.data.roleIdList.length == 0 &&
+    res.data.data.superAdmin === 0
+  ) {
+    backFlag.value = false
+  }
+})
+console.log('navList------------>', navList)
 
-  const props = defineProps({
-    showView: { type: String, default: '' },
-  })
+const props = defineProps({
+  showView: { type: String, default: '' },
+})
 
-  // 退出登录
-  const logout = async () => {
-    await store.dispatch('user/logout')
-    window.sessionStorage.setItem('visits', JSON.stringify([]))
-    // 西海岸不返回登录页
-    if (!itShowXiHaiAn.value) {
-      if (recordRoute) {
-        const fullPath = route.fullPath
-        router.push(`/login?redirect=${fullPath}`)
-      } else {
-        router.push('/login')
-      }
+// 退出登录
+const logout = async () => {
+  await store.dispatch('user/logout')
+  window.sessionStorage.setItem('visits', JSON.stringify([]))
+  // 西海岸不返回登录页
+  if (!itShowXiHaiAn.value) {
+    if (recordRoute) {
+      const fullPath = route.fullPath
+      router.push(`/login?redirect=${fullPath}`)
+    } else {
+      router.push('/login')
     }
   }
-  // 返回首页
-  const goToHome = () => {
-    router.push({
-      path: '/home',
+}
+// 返回首页
+const goToHome = () => {
+  // 西海岸
+  if (itShowXiHaiAn.value) {
+    if (
+      !xhaHasPermissionUser.list.includes(user.value.username)
+    ) {
+      return message.warn('暂无权限')
+    }
+  }
+  router.push({
+    path: '/home',
+  })
+}
+// 跳转页面
+const jumpPage = (item) => {
+  // 西海岸
+  if (itShowXiHaiAn.value) {
+    let _arr = ['共享门户', '能力云图', '能力统计', '需求中心', '赋能案例']
+    if (
+      _arr.includes(item.name) &&
+      !xhaHasPermissionUser.list.includes(user.value.username)
+    ) {
+      return message.warn('暂无权限')
+    }
+  }
+  select.value = item.key
+  switch (item.name) {
+    case '个人中心':
+      window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
+      router.push({
+        path: '/personalCenter',
+      })
+      break
+    case '能力统计':
+      router.push({
+        path: '/abilityStatistics',
+      })
+      break
+    case '能力集市':
+      router.push({
+        path: '/DetailsPageconetent',
+        query: {
+          select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
+        },
+      })
+      break
+    case '能力云图':
+      router.push({
+        path: '/capabilityCloud',
+      })
+      break
+    // case '技术文档':
+    //   router.push({
+    //     path: '/developmentGuide',
+    //   })
+    //   break
+    case '新手指南':
+      router.push({
+        path: '/instructionManual',
+      })
+      break
+    case '需求中心':
+      router.push({
+        path: '/demandCenter',
+      })
+      break
+    case '区市站点':
+      router.push({
+        path: '/mapTest',
+      })
+      break
+    case '后台管理':
+      Cookies.remove('JSESSIONID')
+      window.open(window.SITE_CONFIG.backUrl + '/#/workBench-workBench')
+      // window.reload('http://15.2.21.238:9797')
+      break
+    case '赋能案例':
+      router.push({
+        path: '/assignCase',
+      })
+      break
+    case '典型赋能案例':
+      router.push({
+        path: '/assignCase',
+      })
+      break
+    case '融合服务':
+      router.push({
+        path: '/integrationServices',
+      })
+      break
+    case 'CIM专区':
+      router.push({
+        path: '/cimSpecialArea',
+      })
+      break
+    default:
+      router.push('/home')
+      break
+  }
+}
+const scrollTop = ref(0)
+window.onscroll = function () {
+  //为了保证兼容性，这里取两个值，哪个有值取哪一个
+  //scrollTop就是触发滚轮事件时滚轮的高度
+  scrollTop.value =
+    document.documentElement.scrollTop || document.body.scrollTop
+  // console.log('滚动距离' + scrollTop.value)
+}
+mybus.on('getSgcNum', () => {
+  getSgcTotal().then((res) => {
+    sgcNum.value = res.data.data.count
+    // console.log('申购车总数========================>', res.data.data.count)
+  })
+})
+
+const sgcNum = ref(0)
+const goToSgc = () => {
+  window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
+  router.push('/personalCenter')
+}
+const mynoticeNum = ref(0)
+// 我的消息
+const getMynotice = () => {
+  mynotice({ page: 1, limit: 3, readStatus: 0 }).then((res) => {
+    // console.log('我的消息', res.data.data)
+    mynoticeNum.value = res.data.data.total
+    mynoticeData.value = res.data.data.list
+  })
+}
+const goToView = () => {
+  router.push({
+    path: '/mynoticeView',
+  })
+}
+// const read = (item) => {
+//   mynoticeRead(item.id).then((res) => {
+//     console.log('已读', res)
+//     getMynotice()
+//   })
+// }
+// 建立链接 -- 携带cookie参数
+
+onMounted(() => {
+  getSgcTotal().then((res) => {
+    // console.log('初始化========================>', res.data.data.count)
+    sgcNum.value = res.data.data.count
+  })
+  getMynotice()
+  // 解决
+  const mynoticeDom = document.querySelector('.icon2')
+  const mynotice = document.querySelector('.mynotice')
+  if (mynoticeDom) {
+    mynoticeDom.addEventListener('mouseover', () => {
+      mynoticeFlag.value = true
+    })
+    mynoticeDom.addEventListener('mouseout', () => {
+      mynoticeFlag.value = false
     })
   }
-  // 跳转页面
-  const jumpPage = (item) => {
-    // 西海岸
-    if (itShowXiHaiAn.value) {
-      let _arr = ['共享门户', '能力云图', '能力统计', '需求中心', '赋能案例']
-      if (
-        _arr.includes(item.name) &&
-        !xhaHasPermissionUser.list.includes(user.value.username)
-      ) {
-        return message.warn('暂无权限')
-      }
-    }
-    select.value = item.key
-    switch (item.name) {
-      case '个人中心':
-        window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
-        router.push({
-          path: '/personalCenter',
-        })
-        break
-      case '能力统计':
-        router.push({
-          path: '/abilityStatistics',
-        })
-        break
-      case '能力集市':
-        router.push({
-          path: '/DetailsPageconetent',
-          query: {
-            select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
-          },
-        })
-        break
-      case '能力云图':
-        router.push({
-          path: '/capabilityCloud',
-        })
-        break
-      // case '技术文档':
-      //   router.push({
-      //     path: '/developmentGuide',
-      //   })
-      //   break
-      case '新手指南':
-        router.push({
-          path: '/instructionManual',
-        })
-        break
-      case '需求中心':
-        router.push({
-          path: '/demandCenter',
-        })
-        break
-      case '区市站点':
-        router.push({
-          path: '/mapTest',
-        })
-        break
-      case '后台管理':
-        Cookies.remove('JSESSIONID')
-        window.open(window.SITE_CONFIG.backUrl + '/#/workBench-workBench')
-        // window.reload('http://15.2.21.238:9797')
-        break
-      case '赋能案例':
-        router.push({
-          path: '/assignCase',
-        })
-        break
-      case '典型赋能案例':
-        router.push({
-          path: '/assignCase',
-        })
-        break
-      case '融合服务':
-        router.push({
-          path: '/integrationServices',
-        })
-        break
-      case 'CIM专区':
-        router.push({
-          path: '/cimSpecialArea',
-        })
-        break
-      default:
-        router.push('/home')
-        break
-    }
-  }
-  const scrollTop = ref(0)
-  window.onscroll = function () {
-    //为了保证兼容性，这里取两个值，哪个有值取哪一个
-    //scrollTop就是触发滚轮事件时滚轮的高度
-    scrollTop.value =
-      document.documentElement.scrollTop || document.body.scrollTop
-    // console.log('滚动距离' + scrollTop.value)
+  if (mynotice) {
+    mynotice.addEventListener('mouseover', () => {
+      mynoticeFlag.value = true
+    })
+    mynotice.addEventListener('mouseout', () => {
+      mynoticeFlag.value = false
+    })
   }
   mybus.on('getSgcNum', () => {
     getSgcTotal().then((res) => {
@@ -286,329 +317,268 @@
       // console.log('申购车总数========================>', res.data.data.count)
     })
   })
-
-  const sgcNum = ref(0)
-  const goToSgc = () => {
-    window.sessionStorage.setItem('type', JSON.stringify('PurchaseVehicle'))
-    router.push('/personalCenter')
-  }
-  const mynoticeNum = ref(0)
-  // 我的消息
-  const getMynotice = () => {
-    mynotice({ page: 1, limit: 3, readStatus: 0 }).then((res) => {
-      // console.log('我的消息', res.data.data)
-      mynoticeNum.value = res.data.data.total
-      mynoticeData.value = res.data.data.list
-    })
-  }
-  const goToView = () => {
-    router.push({
-      path: '/mynoticeView',
-    })
-  }
-  // const read = (item) => {
-  //   mynoticeRead(item.id).then((res) => {
-  //     console.log('已读', res)
-  //     getMynotice()
-  //   })
-  // }
-  // 建立链接 -- 携带cookie参数
-
-  onMounted(() => {
-    getSgcTotal().then((res) => {
-      // console.log('初始化========================>', res.data.data.count)
-      sgcNum.value = res.data.data.count
-    })
+  mybus.on('getMynotice', () => {
     getMynotice()
-    // 解决
-    const mynoticeDom = document.querySelector('.icon2')
-    const mynotice = document.querySelector('.mynotice')
-    if (mynoticeDom) {
-      mynoticeDom.addEventListener('mouseover', () => {
-        mynoticeFlag.value = true
-      })
-      mynoticeDom.addEventListener('mouseout', () => {
-        mynoticeFlag.value = false
-      })
-    }
-    if (mynotice) {
-      mynotice.addEventListener('mouseover', () => {
-        mynoticeFlag.value = true
-      })
-      mynotice.addEventListener('mouseout', () => {
-        mynoticeFlag.value = false
-      })
-    }
-    mybus.on('getSgcNum', () => {
-      getSgcTotal().then((res) => {
-        sgcNum.value = res.data.data.count
-        // console.log('申购车总数========================>', res.data.data.count)
-      })
-    })
-    mybus.on('getMynotice', () => {
-      getMynotice()
-    })
-  })
-  onBeforeUnmount(() => {
-    mybus.off('getSgcNum')
-    mybus.off('getMynotice')
   })
+})
+onBeforeUnmount(() => {
+  mybus.off('getSgcNum')
+  mybus.off('getMynotice')
+})
 </script>
 <style lang="less" scoped>
-  @font-face {
-    font-family: 'header-typeface';
-    src: url('~@/assets/newHome/font/header-typeface.ttf');
+@font-face {
+  font-family: 'header-typeface';
+  src: url('~@/assets/newHome/font/header-typeface.ttf');
+}
+
+.home-header {
+  height: 0.64rem;
+  width: 100%;
+  max-width: 1920px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  // padding: 0 1rem;
+  background-color: rgba(0, 0, 25, 0.7);
+  position: fixed;
+  z-index: 1000;
+  top: 0;
+
+  div {
+    color: #fff;
+    font-size: 0.16rem;
   }
 
-  .home-header {
+  .name {
+    cursor: pointer;
+    font-size: 0.22rem;
+    font-family: header-typeface;
+    margin-right: 0.2rem;
+    display: flex;
+    align-items: center;
+
+    .name-bg {
+      height: 0.6rem;
+      width: 0.6rem;
+      background: url('~@/assets/newHome/ucs-2.png') no-repeat;
+      background-size: 100%;
+      margin-right: 0.15rem;
+    }
+
+    .name-bg-xihaian {
+      height: 0.6rem;
+      width: 0.6rem;
+      background: url('~@/assets/newHome/newHome-title-bg-xihaian.png') no-repeat;
+      background-size: 100%;
+      margin-right: 0.15rem;
+    }
+
+    .name-content {
+      padding-top: 0.14rem;
+
+      p {
+        font-size: 0.2rem;
+        margin-bottom: 0;
+
+        &:nth-of-type(2) {
+          font-size: 0.12rem;
+        }
+      }
+    }
+  }
+
+  .nav {
+    width: 1.2rem;
     height: 0.64rem;
-    width: 100%;
-    max-width: 1920px;
+    line-height: 0.64rem;
+    text-align: center;
+  }
+
+  .nav:hover {
+    background: #0058e1;
+    color: #fff;
+    cursor: pointer;
+  }
+
+  .select {
+    background: #0058e1;
+    color: #fff !important;
+  }
+
+  .info {
+    // width: 2rem;
+    margin-left: 0.2rem;
     display: flex;
     justify-content: center;
-    align-items: center;
-    // padding: 0 1rem;
-    background-color: rgba(0, 0, 25, 0.7);
-    position: fixed;
-    z-index: 1000;
-    top: 0;
 
-    div {
-      color: #fff;
+    .img {
+      width: 0.3rem;
+      height: 0.3rem;
+      border-radius: 0.1rem;
+      background: url('~@/assets/newHome/user.png') no-repeat;
+      background-size: 100%;
+    }
+
+    span {
+      height: 0.3rem;
+      line-height: 0.3rem;
+      margin-left: 0.08rem;
+      margin-right: 0.06rem;
       font-size: 0.16rem;
     }
 
     .name {
+      max-width: 2.3rem;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-line-clamp: 1;
+      -webkit-box-orient: vertical;
+      overflow: hidden;
+      word-break: break-all;
+    }
+
+    .out {
       cursor: pointer;
-      font-size: 0.22rem;
-      font-family: header-typeface;
-      margin-right: 0.2rem;
-      display: flex;
-      align-items: center;
-
-      .name-bg {
-        height: 0.6rem;
-        width: 0.6rem;
-        background: url('~@/assets/newHome/ucs-2.png') no-repeat;
-        background-size: 100%;
-        margin-right: 0.15rem;
-      }
-
-      .name-bg-xihaian {
-        height: 0.6rem;
-        width: 0.6rem;
-        background: url('~@/assets/newHome/newHome-title-bg-xihaian.png')
-          no-repeat;
-        background-size: 100%;
-        margin-right: 0.15rem;
-      }
-
-      .name-content {
-        padding-top: 0.14rem;
-
-        p {
-          font-size: 0.2rem;
-          margin-bottom: 0;
-
-          &:nth-of-type(2) {
-            font-size: 0.12rem;
-          }
-        }
-      }
-    }
-
-    .nav {
-      width: 1.2rem;
-      height: 0.64rem;
-      line-height: 0.64rem;
-      text-align: center;
-    }
-
-    .nav:hover {
-      background: #0058e1;
-      color: #fff;
-      cursor: pointer;
-    }
-
-    .select {
-      background: #0058e1;
-      color: #fff !important;
-    }
-
-    .info {
-      // width: 2rem;
-      margin-left: 0.2rem;
-      display: flex;
-      justify-content: center;
-
-      .img {
-        width: 0.3rem;
-        height: 0.3rem;
-        border-radius: 0.1rem;
-        background: url('~@/assets/newHome/user.png') no-repeat;
-        background-size: 100%;
-      }
-
-      span {
-        height: 0.3rem;
-        line-height: 0.3rem;
-        margin-left: 0.08rem;
-        margin-right: 0.06rem;
-        font-size: 0.16rem;
-      }
-
-      .name {
-        max-width: 2.3rem;
-        text-overflow: ellipsis;
-        display: -webkit-box;
-        -webkit-line-clamp: 1;
-        -webkit-box-orient: vertical;
-        overflow: hidden;
-        word-break: break-all;
-      }
-
-      .out {
-        cursor: pointer;
-        // padding: 0 0.16rem;
-        padding: 0 0.04rem 0 0.1rem;
-        border-left: 0.01rem solid #666;
-      }
-
-      .icon {
-        cursor: pointer;
-      }
-    }
-  }
-
-  .white {
-    background-color: #fff;
-    box-shadow: 0 0.02rem 0.1rem rgba(0, 0, 0, 0.1);
-
-    .name {
-      color: #0058e1;
-
-      .name-bg {
-        height: 0.6rem;
-        width: 0.6rem;
-        background: url('~@/assets/newHome/ucs-1.png') no-repeat;
-        background-size: 100%;
-        margin-right: 0.15rem;
-      }
-
-      p {
-        color: #0058e1;
-      }
+      // padding: 0 0.16rem;
+      padding: 0 0.04rem 0 0.1rem;
+      border-left: 0.01rem solid #666;
     }
 
     .icon {
       cursor: pointer;
     }
-
-    .nav {
-      color: #000;
-    }
-
-    .info {
-      span {
-        color: #000;
-      }
-    }
   }
+}
 
-  .blue {
-    position: absolute;
-    background: linear-gradient(
-      to right,
-      rgba(15, 90, 253, 0.8),
-      rgba(36, 25, 248, 0.8)
-    );
+.white {
+  background-color: #fff;
+  box-shadow: 0 0.02rem 0.1rem rgba(0, 0, 0, 0.1);
 
-    .name {
-      color: #fff;
+  .name {
+    color: #0058e1;
+
+    .name-bg {
+      height: 0.6rem;
+      width: 0.6rem;
+      background: url('~@/assets/newHome/ucs-1.png') no-repeat;
+      background-size: 100%;
+      margin-right: 0.15rem;
     }
 
-    .nav {
-      color: #fff;
-    }
-
-    .nav:hover {
-      background: #fff;
+    p {
       color: #0058e1;
     }
-
-    .info {
-      span {
-        color: #fff;
-      }
-    }
   }
 
-  .mynotice {
-    width: 4rem;
-    height: 3rem;
-    background: #eee;
-    border-radius: 0.05rem;
-    position: absolute;
-    top: 0.45rem;
-    right: 2.4rem;
-    overflow-y: scroll;
-
-    .bottom {
-      cursor: pointer;
-      width: 100%;
-      text-align: center;
-      color: #000;
-      font-size: 0.16rem;
-    }
-  }
-
-  .mynotice::-webkit-scrollbar {
-    display: none;
-  }
-
-  :deep(.ant-list-item) {
-    border-bottom: 0.01rem solid #ccc;
-    padding: 0.1rem;
-  }
-
-  :deep(.ant-list-item-meta-title) {
-    // display: flex;
-    // justify-content: space-around;
-    // align-items: center;
-    // padding: 0 0.05rem;
-    a {
-      width: 3.8rem;
-      overflow: hidden;
-      text-overflow: ellipsis;
-      display: -webkit-box;
-      -webkit-line-clamp: 2;
-      word-break: break-all;
-      -webkit-box-orient: vertical;
-    }
-
-    button {
-      width: 0.7rem;
-      height: 0.25rem;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-
-      span {
-        font-size: 0.1rem;
-      }
-    }
-  }
-
-  .iconTo {
-    display: block;
-    width: 0.35rem;
-    height: 0.35rem;
-    background: url('~@/assets/newHome/iconTo.png') no-repeat;
+  .icon {
     cursor: pointer;
   }
+
+  .nav {
+    color: #000;
+  }
+
+  .info {
+    span {
+      color: #000;
+    }
+  }
+}
+
+.blue {
+  position: absolute;
+  background: linear-gradient(to right,
+      rgba(15, 90, 253, 0.8),
+      rgba(36, 25, 248, 0.8));
+
+  .name {
+    color: #fff;
+  }
+
+  .nav {
+    color: #fff;
+  }
+
+  .nav:hover {
+    background: #fff;
+    color: #0058e1;
+  }
+
+  .info {
+    span {
+      color: #fff;
+    }
+  }
+}
+
+.mynotice {
+  width: 4rem;
+  height: 3rem;
+  background: #eee;
+  border-radius: 0.05rem;
+  position: absolute;
+  top: 0.45rem;
+  right: 2.4rem;
+  overflow-y: scroll;
+
+  .bottom {
+    cursor: pointer;
+    width: 100%;
+    text-align: center;
+    color: #000;
+    font-size: 0.16rem;
+  }
+}
+
+.mynotice::-webkit-scrollbar {
+  display: none;
+}
+
+:deep(.ant-list-item) {
+  border-bottom: 0.01rem solid #ccc;
+  padding: 0.1rem;
+}
+
+:deep(.ant-list-item-meta-title) {
+
+  // display: flex;
+  // justify-content: space-around;
+  // align-items: center;
+  // padding: 0 0.05rem;
+  a {
+    width: 3.8rem;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    word-break: break-all;
+    -webkit-box-orient: vertical;
+  }
+
+  button {
+    width: 0.7rem;
+    height: 0.25rem;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    span {
+      font-size: 0.1rem;
+    }
+  }
+}
+
+.iconTo {
+  display: block;
+  width: 0.35rem;
+  height: 0.35rem;
+  background: url('~@/assets/newHome/iconTo.png') no-repeat;
+  cursor: pointer;
+}
 </style>
 <style>
-  html::-webkit-scrollbar {
-    display: none;
-  }
+html::-webkit-scrollbar {
+  display: none;
+}
 </style>