修改文件

front/public/static/config/location.js

@@ -1,8 +1,8 @@
 /*
  * @Author: hisense.wuhongjian
  * @Date: 2020-07-07 16:03:23
- * @LastEditors: hisense.liangjunhua
+ * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-09-27 16:48:51
+ * @LastEditTime: 2022-08-29 09:55:56
  * @Description: 数据资源参数配置
  */
 // eslint-disable-next-line no-undef
@@ -26,22 +26,18 @@ const footerDataList = {}
 // qingdao
 if (newLocation !== 'baotou' && newLocation !== 'xihaian') {
   whoShow.itShowQingDao = true
-  if (newLocation == 'zhanTingDev' || newLocation == 'dev') {
-    whoShow.itShowZhanTingDev = true
-  }
-
   infrastructure.deptName = '青岛市大数据发展管理局'
   infrastructure.deptId = '1067246875800000066'
   navListManagement.navList = [
     { name: '共享门户', key: 'home' },
     { name: '能力集市', key: 'DetailsPageconetent' },
-    // { name: '能力云图', key: 'capabilityCloud' },
+    { name: '能力云图', key: 'capabilityCloud' },
     { name: '能力统计', key: 'abilityStatistics' },
     // { name: '开发指南', key: 'developmentGuide' },
-    { name: '技术文档', key: 'instructionManual' },
+    { name: '新手指南', key: 'instructionManual' },
     { name: '需求中心', key: 'demandCenter' },
     // { name: '个人中心', key: 'personalCenter' },
-    // { name: '区市站点', key: 'mapTest' },
+    { name: '区市站点', key: 'mapTest' },
     // { name: '后台管理', key: 'houtaiguanli' },
     //  { name: '典型赋能案例', key: 'assignCase' },
     { name: '融合服务', key: 'integrationServices' },
@@ -126,15 +122,12 @@ else if (newLocation === 'baotou') {
     { name: '能力集市', key: 'DetailsPageconetent' },
     { name: '能力云图', key: 'capabilityCloud' },
     { name: '能力统计', key: 'abilityStatistics' },
-    { name: '技术文档', key: 'instructionManual' },
     // { name: '开发指南', key: 'developmentGuide' },
     { name: '需求中心', key: 'demandCenter' },
     // { name: '个人中心', key: 'personalCenter' },
     // { name: '区市站点', key: 'mapTest' },
     // { name: '后台管理', key: 'houtaiguanli' },
     { name: '赋能案例', key: 'assignCase' },
-    { name: '融合服务', key: 'integrationServices' },
-    { name: 'CIM专区', key: 'cimSpecialArea' },
   ]
   footerDataList.footerList = {
     company: {
@@ -500,15 +493,12 @@ else if (newLocation === 'xihaian') {
     { name: '能力集市', key: 'DetailsPageconetent' },
     { name: '能力云图', key: 'capabilityCloud' },
     { name: '能力统计', key: 'abilityStatistics' },
-    // { name: '技术文档', key: 'instructionManual' },
     // { name: '开发指南', key: 'developmentGuide' },
     { name: '需求中心', key: 'demandCenter' },
     // { name: '个人中心', key: 'personalCenter' },
     // { name: '区市站点', key: 'mapTest' },
     // { name: '后台管理', key: 'houtaiguanli' },
     { name: '赋能案例', key: 'assignCase' },
-    // { name: '融合服务', key: 'integrationServices' },
-    // { name: 'CIM专区', key: 'cimSpecialArea' },
   ]
   footerDataList.footerList = {
     company: {

front/src/router/index.js

@@ -85,7 +85,7 @@ export const constantRoutes = [
   {
     path: '/',
     component: Layout,
-    redirect: whoShow.itShowXiHaiAn ? '/DetailsPageconetent' : '/home',
+    redirect: '/home',
     meta: {
       title: '能力管理平台编目',
       icon: 'apps-line',
@@ -495,7 +495,7 @@ export const constantRoutes = [
     name: 'instructionManual',
     component: () => import('@/views/instructionManual/index'),
     meta: {
-      title: '技术文档',
+      title: '新手指南',
       icon: 'error-warning-line',
     },
   },

front/src/views/home/components/header.vue

@@ -131,44 +131,56 @@
   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'
-
   const store = useStore()
   const router = useRouter()
   const route = useRoute()
-
+  // const navListManagement = ref([
+  //   { name: '共享门户', key: 'home' },
+  //   { name: '能力集市', key: 'DetailsPageconetent' },
+  //   { name: '能力云图', key: 'capabilityCloud' },
+  //   { name: '能力统计', key: 'abilityStatistics' },
+  //   { name: '开发指南', key: 'developmentGuide' },
+  //   { name: '需求中心', key: 'demandCenter' },
+  //   // { name: '个人中心', key: 'personalCenter' },
+  //   { name: '区市站点', key: 'mapTest' },
+  //   // { name: '后台管理', key: 'houtaiguanli' },
+  //   { name: '赋能案例', key: 'assignCase' },
+  // ])
   const whoShow1 = whoShow
   const user = ref({
     username: store.getters['user/username'],
   })
+  // user.username.value = store.getters(['user/username'])
   const select = ref(router.currentRoute.value.name)
   const mynoticeFlag = ref(false)
   const mynoticeData = ref([])
   console.log('navListManagement------------>', navListManagement)
 
+  // eslint-disable-next-line no-undef
   const navList = ref(navListManagement.navList)
   console.log('navList------------>', navList)
 
   const props = defineProps({
     showView: { type: String, default: '' },
   })
-  
+  // // 获取用户信息
+  // getUser().then((res) => {
+  //   user.value = res.data.data
+  //   // console.log('user===============>', user.value)
+  // })
   // 退出登录
   const logout = async () => {
     await store.dispatch('user/logout')
-    // 移除本地存储查询条件
-    localStorage.removeItem('integrationServices')
-    localStorage.removeItem('DetailsPageconetent')
     window.sessionStorage.setItem('visits', JSON.stringify([]))
     // 西海岸不返回登录页
-    // if (!whoShow1.itShowXiHaiAn) {
+    if (!whoShow1.itShowXiHaiAn) {
-    //   if (recordRoute) {
+      if (recordRoute) {
-    //     const fullPath = route.fullPath
+        const fullPath = route.fullPath
-    //     router.push(`/login?redirect=${fullPath}`)
+        router.push(`/login?redirect=${fullPath}`)
-    //   } else {
+      } else {
-    //     router.push('/login')
+        router.push('/login')
-    //   }
+      }
-    // }
+    }
   }
   // 返回首页
   const goToHome = () => {
@@ -196,8 +208,7 @@
         router.push({
           path: '/DetailsPageconetent',
           query: {
-            // select: '组件服务',
+            select: '组件服务',
-            select: DETAIL_PAGE_CONTENT_DEFAULT_TAB
           },
         })
         break
@@ -206,7 +217,12 @@
           path: '/capabilityCloud',
         })
         break
-      case '技术文档':
+      // case '技术文档':
+      //   router.push({
+      //     path: '/developmentGuide',
+      //   })
+      //   break
+      case '新手指南':
         router.push({
           path: '/instructionManual',
         })
@@ -239,6 +255,10 @@
       case '融合服务':
         router.push({
           path: '/integrationServices',
+          //  path: '/DetailsPageconetent',
+          query: {
+            select: '融合服务',
+          },
         })
         break
       case 'CIM专区':

front/src/views/home/integrationServices.vue

@@ -5,8 +5,13 @@
     <div class="top">
       <div class="top-title">
         全部：
-        <div v-for="(item, index) in titleName" :key="index" class="tabAll" @click="changeCards(index)"
+        <div
-          :class="{ sel: index == number }">
+          v-for="(item, index) in titleName"
+          :key="index"
+          class="tabAll"
+          @click="changeCards(index)"
+          :class="{ sel: index == number }"
+        >
           <span>
             {{ item.name === '赋能场景' ? '典型赋能场景' : '打包模式' }}
           </span>
@@ -15,26 +20,54 @@
       <div class="resultListSearchInput-father" v-if="number === 0">
         <div class="resultListSearchInput-son">
           模糊搜索
-          <a-input-search v-model:value="searchValue" placeholder="请输入关键词" enter-button="搜索" size="large"
+          <a-input-search
-            @search="getIntegrationList" @change="onSearch" class="resultListSearchInput" />
+            v-model:value="searchValue"
-          <button class="button-reset" @click="resetAction()">重置</button>
+            placeholder="请输入关键词"
+            enter-button="搜索"
+            size="large"
+            @search="getAppResources"
+            @change="onSearch"
+            class="resultListSearchInput"
+          />
+          <button class="button-reset" @click="chongzhi()">重置</button>
           <div class="hengxian"></div>
         </div>
       </div>
       <div v-loading="loadingData">
-        <searchResultList v-if="number === 0" v-show="resourceList.data && resourceList.data.length > 0"
+        <searchResultList
-          :resourceList="resourceList" :resourceTotal="resourceTotal" @saveSearchCodition="saveSearchCodition"
+          v-if="number === 0"
-          ref="searchResultListDom" :selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
+          v-show="resourceList.data && resourceList.data.length > 0"
-        <CanAssignCase v-else v-show="resourceList.data && resourceList.data.length > 0" :resourceList="resourceList"
+          :key="listKey2"
-          @saveSearchCodition="saveSearchCodition" :resourceTotal="resourceTotal"
+          :resourceList="resourceList"
-          :selectCardsname="number == 0 ? '融合服务' : '赋能场景'" />
+          :resourceTotal="resourceTotal"
+          :selectCardsname="number == 0 ? '融合服务' : '赋能场景'"
+        />
+        <CanAssignCase
+          v-else
+          v-show="resourceList.data && resourceList.data.length > 0"
+          :key="listKey2"
+          :resourceList="resourceList"
+          :resourceTotal="resourceTotal"
+          :selectCardsname="number == 0 ? '融合服务' : '赋能场景'"
+        />
         <div class="pagination">
-          <a-pagination v-if="resourceList.data && resourceList.data.length > 0" v-model:current="currentPage"
+          <a-pagination
-            v-model:pageSize="currentPageSize" show-size-changer show-less-items show-quick-jumper
+            v-if="resourceList.data && resourceList.data.length > 0"
-            :total="resourceTotal" :page-size-options="pageSizeOptions" @change="pageChange"
+            v-model:current="currentPage"
-            @showSizeChange="onShowSizeChange" />
+            v-model:pageSize="currentPageSize"
+            show-size-changer
+            show-less-items
+            show-quick-jumper
+            :total="resourceTotal"
+            :page-size-options="pageSizeOptions"
+            @change="pageChange"
+            @showSizeChange="onShowSizeChange"
+          />
         </div>
-        <div v-if="resourceList.data && resourceList.data.length <= 0" style="margin-top: 2rem">
+        <div
+          v-if="resourceList.data && resourceList.data.length <= 0"
+          style="margin-top: 2rem"
+        >
           <a-empty />
         </div>
       </div>
@@ -43,357 +76,342 @@
   <home-footer></home-footer>
 </template>
 <script>
-import HomeFooter from '@/views/newHome/components/Footer'
+  import HomeFooter from '@/views/newHome/components/Footer'
-import mybus from '@/myplugins/mybus'
+  import mybus from '@/myplugins/mybus'
-import { defineComponent, reactive, ref, toRefs, onMounted, nextTick } from 'vue'
+  import { defineComponent, reactive, ref, toRefs, onMounted, watch } from 'vue'
-import { getIntegrationServicesList } from '@/api/home.js'
-import { useRouter } from 'vue-router'
-import HomeHeader from '@/views/home/components/header'
-import searchResultList from '@/views/home/components/searchResultList.vue'
-import CanAssignCase from '@/views/home/components/CanAssignCase.vue'
-import { message } from 'ant-design-vue'
 
-export default defineComponent({
+  import { getIntegrationServicesList } from '@/api/home.js'
-  beforeRouteLeave(to, from, next) {
+  import { useRouter } from 'vue-router'
-    console.log('to---integrationServices--beforeRouteLeave------->', to)
+  import HomeHeader from '@/views/home/components/header'
-    console.log('from---integrationServices--beforeRouteLeave------->', from)
+  import searchResultList from '@/views/home/components/searchResultList.vue'
-    console.log('next---integrationServices--beforeRouteLeave------->', next)
+  import CanAssignCase from '@/views/home/components/CanAssignCase.vue'
-    if (to.name !== 'packagingDetails' && to.name !== 'integrationServicesDetails') {
+  import { message } from 'ant-design-vue'
-      localStorage.removeItem('integrationServices')
-    }
-    next()
-  },
-  setup() {
-    // 分页
-    const loading = ref(true)
-    const currentPage = ref(1)
-    const currentPageSize = ref(5)
-    const pageSizeOptions = ref(['2', '5', '10', '20', '50'])
-    const router = useRouter()
-    const select = router.currentRoute.value.query.select
-    const searchValue = ref('')
-    const Cardsname = ref(select)
-    const resourceList = reactive({ data: [] })
-    const resourceTotal = ref(0)
-    const loadingData = ref(false)
-    // 选项卡
-    const titleName = ref([
-      {
-        name: '打包模式',
-      },
-      {
-        name: '赋能场景',
-      },
-    ])
-    const number = ref(0)
-    // 查询参数
-    const paramsGetResources = {
-      page: currentPage.value,
-      limit: currentPageSize.value,
-      type: titleName.value[number.value].name,
-      name: searchValue.value,
-      orderField: 'create_date',
-      orderType: 'DESC', // ASC 升序  DESC 降序
-    }
-    const searchResultListDom = ref(null)
-    const storageSearchInfo = JSON.parse(localStorage.getItem('integrationServices'))
-    // 读取本地存储：表单赋值
-    const handleSetSearchData = () => {
-      if (storageSearchInfo) {
-        number.value = storageSearchInfo.type == '打包模式' ? 0 : 1;
-        // 搜索名称 
-        searchValue.value = storageSearchInfo.name;
-        currentPage.value = storageSearchInfo.page;
-        currentPageSize.value = storageSearchInfo.limit;
-        paramsGetResources.limit = storageSearchInfo.limit;
-        paramsGetResources.page = storageSearchInfo.page;
-        paramsGetResources.type = storageSearchInfo.type;
-        // 延迟使用，因为还没有返回跟挂载
-        nextTick(() => {
-          searchResultListDom.value && searchResultListDom.value.changeCondition && searchResultListDom.value.changeCondition({
-            value: storageSearchInfo.orderField,
-            orderType: storageSearchInfo.orderType,
-          }, true)
-        })
-        getIntegrationList()
-      }
-    }
 
-    const changeCards = (val) => {
+  export default defineComponent({
-      // 打包模式
+    setup() {
-      number.value = val;
-      paramsGetResources.type = titleName.value[number.value].name;
-      resetAction()
-    }
-
-    // 查询
-    const onSearch = () => {
-      currentPage.value = 1
-      getIntegrationList()
-    }
-    // 重置数据
-    const resetAction = () => {
-      // 重置模糊查字段
-      searchValue.value = ''
       // 分页
-      currentPage.value = 1
+      const loading = ref(true)
-      currentPageSize.value = 5
+      const currentPage = ref(1)
-      // 重置查询条件
+      const currentPageSize = ref(10)
-      paramsGetResources.page = 1
+      const pageSizeOptions = ref(['5', '10', '20', '50'])
-      paramsGetResources.limit = 5
+      const router = useRouter()
-      paramsGetResources.orderField = 'create_date'
+      const select = router.currentRoute.value.query.select
-      paramsGetResources.orderType = 'DESC'
+      const searchValue = ref('')
-
+      const Cardsname = ref(select)
-      mybus.emit('resetAction', {
+      const resourceList = reactive({ data: [] })
-        type: titleName.value[number.value].name,
+      const resourceTotal = ref(0)
-      })
+      const current = ref(1)
-      getIntegrationList()
+      const loadingData = ref(false)
-    }
+      // 选项卡
-
+      const titleName = ref([
-    // 获取融合服务列表
+        {
-    const getIntegrationList = () => {
+          name: '打包模式',
-      loadingData.value = true
-      paramsGetResources.name = searchValue.value;
-      console.log('paramsGetResources------参数下发------>', paramsGetResources);
-      getIntegrationServicesList(paramsGetResources).then(
-        (res) => {
-          loadingData.value = false
-          if (res.data.code !== 0) {
-            return message.error(res.data.msg)
-          }
-          resourceList.data = res.data.data.list || []
-          resourceTotal.value = res.data.data.total || 0
         },
-        (err) => {
+        {
-          loadingData.value = false
+          name: '赋能场景',
-          message.error(err)
+        },
-        }
+      ])
-      )
-    }
 
-    mybus.on('paramsGetResources', (ids) => {
+      const number = ref(0)
-      if (ids && ids.length > 0) {
+      // 刷新筛选条件组件
-        paramsGetResources.deptIds = ids
+      let listKey = ref(0)
-      } else {
+      // 刷新筛选列表信息组件
-        delete paramsGetResources.deptIds
+      const listKey2 = ref(0)
+
+      // 查询参数
+      const paramsGetResources = {
+        pageNum: 1,
+        pageSize: currentPageSize.value,
+        type: titleName.value[number.value].name,
+        name: '',
+        orderField: 'create_date', // total 综合 visits 访问量 applyCount 申请量 score 评分  collectCount 收藏量
+        orderType: 'DESC', // ASC 升序  DESC 降序
       }
-      getIntegrationList()
-    })
 
-    mybus.on('changePage', (page) => {
+      const changeCards = (val) => {
-      paramsGetResources.page = page
+        console.log(val)
-      getIntegrationList()
+        number.value = val
-    })
+        chongzhi()
+      }
 
-    mybus.on('changeSelcted', () => {
+      // 查询
-      getIntegrationList()
+      const onSearch = () => {
-    })
+        loading.value = true
+        currentPage.value = 1
+      }
+      // 重置数据
+      const chongzhi = () => {
+        loading.value = true
+        // 重置模糊查字段
+        searchValue.value = ''
+        // 分页
+        currentPage.value = 1
+        currentPageSize.value = 10
+        // 重置查询条件
+        paramsGetResources.pageNum = 1
+        paramsGetResources.pageSize = 10
+        paramsGetResources.orderField = 'create_date'
+        paramsGetResources.orderType = 'DESC'
+        mybus.emit('chongzhi', {
+          type: titleName.value[number.value].name,
+        })
+        getAppResources()
+      }
 
-    mybus.on('refresh', () => {
+      const getAppResources = () => {
-      paramsGetResources.page = 1
-      currentPage.value = 1
-      getIntegrationList()
-    })
-    mybus.on('changeCondition', (condition) => {
-      paramsGetResources.orderField = condition.orderField
-      paramsGetResources.orderType = condition.orderType
-      getIntegrationList()
-    })
-
-    const pageChange = (val) => {
-      currentPage.value = val
-      paramsGetResources.page = val
-      getIntegrationList() //判断是否是点击下面的分页的调用模糊查询方法还是点击搜索调用模糊查询方法
-    }
-
-    // 分页
-    const onShowSizeChange = (current, pageSize) => {
-      currentPage.value = current
-      currentPageSize.value = pageSize
-      paramsGetResources.page = current
-      paramsGetResources.limit = pageSize
-      getIntegrationList()
-    }
-
-    // 存储查询条件到本地
-    const saveSearchCodition = (n) => {
-      console.log('融合服务-----存储查询条件到本地------->', paramsGetResources);
-      localStorage.setItem(
-        'integrationServices',
-        JSON.stringify(paramsGetResources)
-      )
-    }
-
-    onMounted(() => {
-      if (storageSearchInfo) {
-        handleSetSearchData()
-      } else {
         getIntegrationList()
       }
-    })
 
-    return {
+      // 获取融合服务列表
-      searchValue,
+      const getIntegrationList = () => {
-      currentPage,
+        loadingData.value = true
-      resourceList,
+        console.log('获取融合服务列表------------>')
-      resourceTotal,
+        let postData = {
-      pageChange,
+          limit: currentPageSize.value,
-      Cardsname,
+          page: currentPage.value,
-      getIntegrationList,
+          orderField: paramsGetResources.orderField,
-      resetAction,
+          orderType: paramsGetResources.orderType,
-      onSearch,
+          name: searchValue.value,
-      currentPageSize,
+          type: titleName.value[number.value].name,
-      pageSizeOptions,
+        }
-      loading,
+        getIntegrationServicesList(postData).then(
-      titleName,
+          (res) => {
-      changeCards,
+            loadingData.value = false
-      number,
+            if (res.data.code !== 0) {
-      loadingData,
+              return message.error(res.data.msg)
-      onShowSizeChange,
+            }
-      saveSearchCodition,
+            console.log('res.data------------>', res.data)
-      searchResultListDom,
+
-    }
+            resourceList.data = res.data.data.list || []
-  },
+            resourceTotal.value = res.data.data.total || 0
-  components: {
+            listKey2.value++
-    HomeHeader,
+          },
-    HomeFooter,
+          (err) => {
-    searchResultList,
+            loadingData.value = false
-    CanAssignCase,
+            message.error(err)
-  },
+          }
-  beforeUnmount() {
+        )
-    mybus.off('paramsGetResources')
+      }
-    mybus.off('changeCondition')
+
-    mybus.off('refresh')
+      mybus.on('paramsGetResources', (ids) => {
-    mybus.off('changePage')
+        if (ids && ids.length > 0) {
-  },
+          paramsGetResources.deptIds = ids
-})
+        } else {
+          delete paramsGetResources.deptIds
+        }
+        getAppResources()
+        console.log('paramsGetResources', paramsGetResources)
+      })
+      mybus.on('changePage', (page) => {
+        paramsGetResources.pageNum = page
+        getAppResources('分页查询')
+      })
+      mybus.on('changeSelcted', () => {
+        getAppResources()
+      })
+
+      mybus.on('refresh', () => {
+        paramsGetResources.pageNum = 1
+        currentPage.value = 1
+        getAppResources()
+      })
+      mybus.on('changeCondition', (condition) => {
+        paramsGetResources.orderField = condition.orderField
+        paramsGetResources.orderType = condition.orderType
+        getAppResources()
+      })
+
+      const pageChange = (val) => {
+        console.log(val)
+        loading.value = true
+        currentPage.value = val
+        paramsGetResources.pageNum = val
+        let params = '分页查询' //判断是否是点击下面的分页的调用模糊查询方法还是点击搜索调用模糊查询方法
+        getAppResources(params)
+      }
+
+      onMounted(() => {
+        console.log('222----onMounted-------->', 222)
+        listKey2.value++
+        getAppResources()
+      })
+
+      // 分页
+      const onShowSizeChange = (current, pageSize) => {
+        currentPage.value = current
+        currentPageSize.value = pageSize
+        paramsGetResources.pageNum = current
+        paramsGetResources.pageSize = pageSize
+        getAppResources()
+      }
+      watch(currentPageSize, () => {
+        console.log('pageSize', currentPageSize.value)
+      })
+
+      return {
+        listKey,
+        searchValue,
+        currentPage,
+        resourceList,
+        resourceTotal,
+        pageChange,
+        listKey2,
+        Cardsname,
+        getAppResources,
+        chongzhi,
+        onSearch,
+        currentPageSize,
+        pageSizeOptions,
+        current,
+        loading,
+        titleName,
+        changeCards,
+        number,
+        loadingData,
+      }
+    },
+    components: {
+      HomeHeader,
+      HomeFooter,
+      searchResultList,
+      CanAssignCase,
+    },
+    beforeUnmount() {
+      mybus.off('paramsGetResources')
+      mybus.off('changeCondition')
+      mybus.off('refresh')
+      mybus.off('changePage')
+    },
+  })
 </script>
 <style lang="less" scoped>
-.resultListSearchInput-father {
+  .resultListSearchInput-father {
-  background: #f3f5f9;
+    background: #f3f5f9;
-  padding: 0.2rem;
+    padding: 0.2rem;
 
-  .resultListSearchInput-son {
+    // padding-left: 0.2rem;
-    background: #fff;
+    // padding-top: 0.2rem;
-    padding: 0.2rem 0.2rem 0rem 0.3rem;
+    .resultListSearchInput-son {
+      background: #fff;
+      padding: 0.2rem 0.2rem 0rem 0.3rem;
 
-    .hengxian {
+      .hengxian {
-      width: 100%;
+        width: 100%;
-      height: 0.01rem;
+        height: 0.01rem;
-      background: rgba(150, 144, 144, 0.3);
+        background: rgba(150, 144, 144, 0.3);
-      margin-top: 0.2rem;
+        margin-top: 0.2rem;
+      }
     }
   }
-}
 
-.resultListSearchInput {
+  .resultListSearchInput {
-  margin-left: 0.1rem;
+    margin-left: 0.1rem;
 
-  :deep(.ant-input) {
+    :deep(.ant-input) {
-    width: 4rem;
+      width: 4rem;
-    height: 0.36rem;
+      height: 0.36rem;
-    background: #fff;
+      background: #fff;
-    border-radius: 0.04rem;
+      border-radius: 0.04rem;
+    }
+
+    :deep(.ant-input-search-button) {
+      width: 0.8rem;
+      height: 0.36rem;
+      background: #0087ff;
+      border-radius: 0.04rem !important;
+      font-size: 0.14rem;
+      font-weight: 400;
+      color: #fff;
+      line-height: 0.34rem;
+      margin-left: 0.1rem;
+    }
+
+    :deep(.ant-input-group-addon) {
+      left: 0 !important;
+    }
   }
 
-  :deep(.ant-input-search-button) {
+  .button-reset {
+    border: 0;
+    outline: none;
     width: 0.8rem;
     height: 0.36rem;
-    background: #0087ff;
+    background: #e1edfa;
-    border-radius: 0.04rem !important;
+    border-radius: 0.04rem;
     font-size: 0.14rem;
     font-weight: 400;
-    color: #fff;
+    color: #0087ff;
     line-height: 0.34rem;
-    margin-left: 0.1rem;
+    margin-left: 2.5rem;
+    cursor: pointer;
   }
 
-  :deep(.ant-input-group-addon) {
+  .details-pageconetent {
-    left: 0 !important;
+    height: 100%;
-  }
+    width: 100%;
-}
-
-.button-reset {
-  border: 0;
-  outline: none;
-  width: 0.8rem;
-  height: 0.36rem;
-  background: #e1edfa;
-  border-radius: 0.04rem;
-  font-size: 0.14rem;
-  font-weight: 400;
-  color: #0087ff;
-  line-height: 0.34rem;
-  margin-left: 2.5rem;
-  cursor: pointer;
-}
-
-.details-pageconetent {
-  height: 100%;
-  width: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  margin-top: 0.67rem;
-  position: relative;
-  background: rgba(245, 243, 243, 0.3);
-
-  .details-pageconetent-left {
-    max-height: 6.9rem;
-    position: absolute;
-    width: 2.5rem;
-    top: 0.17rem;
-    left: 2.5rem;
-    margin-right: 0.17rem;
-    overflow: auto;
-  }
-
-  .top {
-    min-height: 7.2rem;
-    position: relative;
-    width: 11.5rem;
     display: flex;
-    padding-top: 0.2rem;
+    justify-content: center;
-    flex-direction: column;
+    align-items: center;
-    font-size: 0.16rem;
+    margin-top: 0.67rem;
-    justify-content: left;
+    position: relative;
-    background: #f3f5f9;
+    background: rgba(245, 243, 243, 0.3);
 
-    .pagination {
+    .details-pageconetent-left {
-      background: #f3f5f9;
+      max-height: 6.9rem;
-      padding-bottom: 0.6rem;
+      position: absolute;
+      width: 2.5rem;
+      top: 0.17rem;
+      left: 2.5rem;
+      margin-right: 0.17rem;
+      overflow: auto;
     }
 
-    .top-title {
+    .top {
-      padding: 0.2rem;
+      min-height: 7.2rem;
+      position: relative;
+      width: 11.5rem;
       display: flex;
-      font-size: 18px;
+      padding-top: 0.2rem;
+      flex-direction: column;
+      font-size: 0.16rem;
+      justify-content: left;
+      background: #f3f5f9;
 
-      .tabAll {
+      .pagination {
+        background: #f3f5f9;
+        padding-bottom: 0.6rem;
+      }
+
+      .top-title {
+        padding: 0.2rem;
+        display: flex;
         font-size: 18px;
-        color: #000000;
-        margin-right: 35px;
-        cursor: pointer;
-      }
 
-      .tabAll:nth-child(1) {
+        .tabAll {
-        margin-left: 20px;
+          font-size: 18px;
-      }
+          color: #000000;
+          margin-right: 35px;
+          cursor: pointer;
+        }
 
-      .sel {
+        .tabAll:nth-child(1) {
-        font-weight: 600;
+          margin-left: 20px;
-        color: #0087ff;
+        }
-        border-bottom: 0.02rem solid #0087ff;
+
+        .sel {
+          font-weight: 600;
+          color: #0087ff;
+          border-bottom: 0.02rem solid #0087ff;
+        }
       }
     }
   }
-}
 
-:deep(.ant-card-grid) {
+  :deep(.ant-card-grid) {
-  overflow: hidden;
+    overflow: hidden;
-  white-space: nowrap;
+    white-space: nowrap;
-  text-overflow: ellipsis;
+    text-overflow: ellipsis;
-  -webkit-line-clamp: 1;
+    -webkit-line-clamp: 1;
-  word-break: break-all;
+    word-break: break-all;
-}
+  }
 </style>

front/src/views/instructionManual/index.vue

@@ -2,42 +2,26 @@
   <home-header></home-header>
   <div class="menu-container">
     <div id="container" class="content-menu">
-      <div class="left">
+      <!-- <div class="left">
-        <div
+        <div class="first-title-text doc" :style="{ color: '技术文档' === titleData.name ? '#0058e1' : '' }"
-          class="first-title-text doc"
+          @click="changeName({ name: '技术文档' })">
-          :style="{ color: '技术文档' === titleData.name ? '#0058e1' : '' }"
-          @click="changeName({ name: '技术文档' })"
-        >
           技术文档
         </div>
-        <abilityDocTree
+        <abilityDocTree style="max-height:320px;overflow-y:auto" :dataList="treeArray" @treeClick="treeClick"
-          style="max-height: 320px; overflow-y: auto"
+          :clickData="clickData"></abilityDocTree>
-          :dataList="treeArray"
+      </div> -->
-          @treeClick="treeClick"
-          :clickData="clickData"
-        ></abilityDocTree>
-      </div>
 
-      <div
+      <div class="first-title-text new-guide-box" :style="{ color: '使用手册' === titleData.name ? '#0058e1' : '' }"
-        class="first-title-text new-guide-box"
+        @click="changeName({ name: '使用手册' })">
-        :style="{ color: '使用手册' === titleData.name ? '#0058e1' : '' }"
-        @click="changeName({ name: '使用手册' })"
-      >
         <div class="guide-text">使用手册</div>
-        <el-icon :size="20" color="#0058e1" @click="downloadEvt()"><Download /></el-icon>
+        <img src="@/assets/developmentGuide/download.png"   @click="downloadDoc('/static/doc/userbook.docx', '通用能力服务平台USC用户手册')" alt="" />
       </div>
 
       <!-- 技术文档 -->
       <div class="right" v-if="titleData.name !== '使用手册'">
         <div style="height: 100%">
-          <iframe
+          <iframe name="iframeName" width="1300" height="100%" id="iframeId" :frameborder="0"
-            name="iframeName"
+            :src="doc_base_url + clickData.doc"></iframe>
-            width="1300"
-            height="100%"
-            id="iframeId"
-            :frameborder="0"
-            :src="doc_base_url + clickData.doc"
-          ></iframe>
         </div>
       </div>
     </div>
@@ -112,7 +96,7 @@ const changeName = (item) => {
           title: val.title,
           show:
             (i === 0 && val.children && val.children.length > 0) ||
-            typeList.includes(val.title)
+              typeList.includes(val.title)
               ? true
               : false,
           children: [],
@@ -131,7 +115,7 @@ const formData = (children = [], dataItem) => {
       title: item.title,
       show:
         (index === 0 && item.children && item.children.length > 0) ||
-        typeList.includes(item.title)
+          typeList.includes(item.title)
           ? true
           : false,
       children: [],
@@ -150,14 +134,15 @@ const getFirstData = (firstObj = {}) => {
     clickData.value = firstObj
   }
 }
-
+const downloadDoc = (path, name) => {
+  const a = document.createElement('a')
+      a.href = path
+      a.download =name
+      a.click()
+  }
 onMounted(() => {
   getTreeData()
 })
-
-const downloadEvt = (url = '') => {
-  window.open('/static/download/通用能力服务平台UCS用户手册-v3.5.docx', '_self')
-}
 </script>
 
 <style scoped lang="less">
@@ -213,7 +198,7 @@ const downloadEvt = (url = '') => {
   top: 300px;
   right: 205px;
   width: 74px;
-  height: 170px;
+  height: 150px;
   background: url('~@/assets/menu/new-bg.png') no-repeat;
   background-size: 100% 100%;
   display: flex;
@@ -229,8 +214,6 @@ const downloadEvt = (url = '') => {
   word-wrap: break-word;
   font-size: 20px;
   color: #0058e1;
-  height: 136px;
-  margin-bottom: 4px;
 }
 
 .right {

front/src/views/mynoticeView/components/NoticeList.vue

@@ -79,11 +79,7 @@
           <a-list-item>
             <a-list-item-meta description="">
               <template #title>
-                <div
+                <div class="left" @click="read(item)">
-                  class="left"
-                  @click="read(item)"
-                  :class="item.readStatus === 1 ? '' : 'pointer'"
-                >
                   {{ item.content }}
                 </div>
                 <div class="right">{{ '发布时间：' + item.senderDate }}</div>
@@ -115,340 +111,342 @@
   </div>
 </template>
 <script setup>
-// import { SearchOutlined } from '@ant-design/icons-vue'
+  // import { SearchOutlined } from '@ant-design/icons-vue'
-import { ref, reactive, onBeforeUnmount } from 'vue'
+  import { ref, reactive, onBeforeUnmount } from 'vue'
-import mybus from '@/myplugins/mybus'
+  import mybus from '@/myplugins/mybus'
-import { message } from 'ant-design-vue'
+  import { message } from 'ant-design-vue'
-import { mynotice, mynoticeRead } from '@/api/home'
+  import { mynotice, mynoticeRead } from '@/api/home'
-import { useRouter } from 'vue-router'
+  import { useRouter } from 'vue-router'
-const router = useRouter()
+  const router = useRouter()
-const total = ref(0)
+  const total = ref(0)
-const pageSize = ref(8)
+  const pageSize = ref(8)
-const pageNum = ref(1)
+  const pageNum = ref(1)
-const value = ref('全部消息')
+  const value = ref('全部消息')
-const obj = reactive({ page: pageNum.value, limit: pageSize.value })
+  const obj = reactive({ page: pageNum.value, limit: pageSize.value })
-const navList = reactive([
+  const navList = reactive([
-  {
+    {
-    title: '全部',
+      title: '全部',
-    key: 'all',
+      key: 'all',
-    num: 0,
+      num: 0,
-  },
+    },
-  {
+    {
-    title: '通知',
+      title: '通知',
-    key: 'notice',
+      key: 'notice',
-    num: 0,
+      num: 0,
-  },
+    },
-  {
+    {
-    title: '评论',
+      title: '评论',
-    key: 'comment',
+      key: 'comment',
-    num: 0,
+      num: 0,
-  },
+    },
-  {
+    {
-    title: '其它',
+      title: '其它',
-    key: 'other',
+      key: 'other',
-    num: 0,
+      num: 0,
-  },
+    },
-])
+  ])
-const selectNav = ref('all')
+  const selectNav = ref('all')
-const selectData = ref([])
+  const selectData = ref([])
-const data = ref([])
+  const data = ref([])
-const changeNav = (nav) => {
+  const changeNav = (nav) => {
-  selectNav.value = nav.key
+    selectNav.value = nav.key
-  if (nav.key === 'all') {
+    if (nav.key === 'all') {
-    delete obj.from
+      delete obj.from
-  } else {
+    } else {
-    obj.from = nav.title
+      obj.from = nav.title
+    }
+    value.value = '全部消息'
+    delete obj.readStatus
+    init()
   }
-  value.value = '全部消息'
+  const changeCheckBox = (item) => {
-  delete obj.readStatus
+    item.checked = !item.checked
-  init()
+    if (item.checked) {
-}
+      selectData.value.push(item.id)
-const changeCheckBox = (item) => {
+    } else {
-  item.checked = !item.checked
+      selectData.value = selectData.value.filter((val) => val !== item.id)
-  if (item.checked) {
+    }
-    selectData.value.push(item.id)
-  } else {
-    selectData.value = selectData.value.filter((val) => val !== item.id)
   }
-}
+  const changeCheckAll = () => {
-const changeCheckAll = () => {
+    if (selectData.value.length == data.value.length) {
-  if (selectData.value.length == data.value.length) {
+      selectData.value = []
-    selectData.value = []
+      data.value.forEach((val) => {
-    data.value.forEach((val) => {
+        val.checked = false
-      val.checked = false
+      })
-    })
+    } else {
-  } else {
+      selectData.value = []
-    selectData.value = []
+      data.value.forEach((val) => {
-    data.value.forEach((val) => {
+        val.checked = true
-      val.checked = true
+        selectData.value.push(val.id)
-      selectData.value.push(val.id)
+      })
+    }
+  }
+  const changePageNum = (page) => {
+    pageNum.value = page
+    obj.page = pageNum.value
+    init()
+  }
+  const handleChange = () => {
+    pageNum.value = 1
+    obj.page = pageNum.value
+    switch (value.value) {
+      case '全部消息':
+        delete obj.readStatus
+        break
+      case '已读消息':
+        obj.readStatus = 1
+        break
+      case '未读消息':
+        obj.readStatus = 0
+        break
+      default:
+        delete obj.readStatus
+        break
+    }
+    init()
+  }
+  const goBack = (url) => {
+    router.push({
+      path: url,
     })
   }
-}
+  const read = (item) => {
-const changePageNum = (page) => {
+    // console.log(item)
-  pageNum.value = page
+    if (selectData.value.length === 0 && !item) {
-  obj.page = pageNum.value
+      message.error('未选择消息！')
-  init()
-}
-const handleChange = () => {
-  pageNum.value = 1
-  obj.page = pageNum.value
-  switch (value.value) {
-    case '全部消息':
-      delete obj.readStatus
-      break
-    case '已读消息':
-      obj.readStatus = 1
-      break
-    case '未读消息':
-      obj.readStatus = 0
-      break
-    default:
-      delete obj.readStatus
-      break
-  }
-  init()
-}
-const goBack = (url) => {
-  router.push({
-    path: url,
-  })
-}
-const read = (item) => {
-  // console.log(item)
-  if (selectData.value.length === 0 && !item) {
-    message.error('未选择消息！')
-    return
-  }
-  console.log(selectData.value)
-
-  if (item) {
-    // 已读状态
-    if (item.readStatus === 1) {
       return
     }
-    mynoticeRead(item.id).then((res) => {
+    console.log(selectData.value)
-      if (res.data.code == 0) {
+    // let str = ''
-        message.success('操作成功！')
+    // selectData.value.forEach((val, index) => {
-        mybus.emit('getMynotice')
+    //   str += val
-        init()
+    //   if (index < selectData.value.length - 1) {
-      } else {
+    //     str += ';'
-        message.error('操作失败！')
+    //   }
-      }
+    // })
-    })
+    if (item) {
-  } else {
+      mynoticeRead(item.id).then((res) => {
-    console.log('提交')
+        if (res.data.code == 0 ) {
-    selectData.value.map((val) => {
+          message.success('通知已读！')
-      mynoticeRead(val).then((res) => {
+        //    if(item.readStatus == 1){
-        if (res.data.code == 0) {
+        //   message.success('通知已读！')
-          // message.success('操作成功！')
+        // }  if(item.readStatus == 0){
+        //   message.success('通知已设为已读！')
+        // }
           mybus.emit('getMynotice')
           init()
         } else {
           message.error('操作失败！')
         }
       })
+    } else {
+      console.log('提交')
+      selectData.value.map((val) => {
+        mynoticeRead(val).then((res) => {
+          if (res.data.code == 0) {
+            // message.success('操作成功！')
+            mybus.emit('getMynotice')
+            init()
+          } else {
+            message.error('操作失败！')
+          }
+        })
+      })
+    }
+  }
+  const init = () => {
+    // from 通知 评论 readStatus 0 未读  1 已读
+    mynotice(obj).then((res) => {
+      console.log('消息=============>', res.data.data)
+      res.data.data.list.forEach((val) => {
+        if (val.from === '通知') {
+          val.src = require('@/assets/mynoticeView/notice.png')
+        } else if (val.from === '评论') {
+          val.src = require('@/assets/mynoticeView/comment.png')
+        } else if (val.from === '其它') {
+          val.src = require('@/assets/mynoticeView/other.png')
+        }
+        val.checked = false
+      })
+      data.value = res.data.data.list
+      total.value = res.data.data.total
+      selectData.value = []
     })
   }
-}
+  navList.forEach((val) => {
-const init = () => {
+    if (val.title === '全部') {
-  // from 通知 评论 readStatus 0 未读  1 已读
+      mynotice({ page: pageNum.value, limit: pageSize.value }).then((res) => {
-  mynotice(obj).then((res) => {
+        val.num = res.data.data.total
-    console.log('消息=============>', res.data.data)
+      })
-    res.data.data.list.forEach((val) => {
+    } else {
-      if (val.from === '通知') {
+      mynotice({
-        val.src = require('@/assets/mynoticeView/notice.png')
+        page: pageNum.value,
-      } else if (val.from === '评论') {
+        limit: pageSize.value,
-        val.src = require('@/assets/mynoticeView/comment.png')
+        from: val.title,
-      } else if (val.from === '其它') {
+      }).then((res) => {
-        val.src = require('@/assets/mynoticeView/other.png')
+        val.num = res.data.data.total
-      }
+      })
-      val.checked = false
+    }
-    })
-    data.value = res.data.data.list
-    total.value = res.data.data.total
-    selectData.value = []
   })
-}
-navList.forEach((val) => {
-  if (val.title === '全部') {
-    mynotice({ page: pageNum.value, limit: pageSize.value }).then((res) => {
-      val.num = res.data.data.total
-    })
-  } else {
-    mynotice({
-      page: pageNum.value,
-      limit: pageSize.value,
-      from: val.title,
-    }).then((res) => {
-      val.num = res.data.data.total
-    })
-  }
-})
-init()
-mybus.on('noticeListInit', () => {
   init()
-})
+  mybus.on('noticeListInit', () => {
-onBeforeUnmount(() => {
+    init()
-  mybus.off('noticeListInit')
+  })
-})
+  onBeforeUnmount(() => {
+    mybus.off('noticeListInit')
+  })
 </script>
 <style lang="less" scoped>
-.notice-list {
+  .notice-list {
-  padding: 0.64rem 0 0;
+    padding: 0.64rem 0 0;
-  background: #f4f5f8;
+    background: #f4f5f8;
-  .ant-breadcrumb {
+    .ant-breadcrumb {
-    padding: 0.1rem 3.1rem;
+      padding: 0.1rem 3.1rem;
-  }
-  .top {
-    background: #fff;
-    padding: 0.18rem 3.1rem 0;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-
-    .left {
-      display: flex;
-      .item {
-        display: flex;
-        flex-direction: column;
-        justify-content: center;
-        align-items: center;
-        margin-left: 1.28rem;
-        margin-bottom: 0.16rem;
-        border-bottom: 3px solid #fff;
-        i {
-          display: inline-block;
-          width: 0.48rem;
-          height: 0.48rem;
-          margin-bottom: 0.15rem;
-          cursor: pointer;
-        }
-        .all {
-          background: url('~@/assets/mynoticeView/all.png') no-repeat;
-          background-size: 100%;
-        }
-        .notice {
-          background: url('~@/assets/mynoticeView/notice.png') no-repeat;
-          background-size: 100%;
-        }
-        .comment {
-          background: url('~@/assets/mynoticeView/comment.png') no-repeat;
-          background-size: 100%;
-        }
-        .other {
-          background: url('~@/assets/mynoticeView/other.png') no-repeat;
-          background-size: 100%;
-        }
-      }
-      .item:nth-of-type(1) {
-        margin-left: 0;
-      }
-      .select {
-        border-bottom: 3px solid #0058e1;
-        color: #0058e1;
-      }
     }
-    .right {
+    .top {
+      background: #fff;
+      padding: 0.18rem 3.1rem 0;
       display: flex;
+      justify-content: space-between;
       align-items: center;
-      height: 0.32rem;
+      .left {
-      div {
-        width: 0.5rem;
-      }
-      .reset {
-        color: #0058e1;
-        cursor: pointer;
-      }
-    }
-  }
-  .btn {
-    background: #fff;
-    margin-top: 0.16rem;
-    padding: 0.14rem 3.1rem 0;
-    display: flex;
-    justify-content: space-between;
-
-    .left {
-      display: flex;
-      align-items: center;
-      .ant-select {
-        margin-right: 0.24rem;
-      }
-      .check {
         display: flex;
-        align-items: center;
+        .item {
-        div {
+          display: flex;
-          margin-left: 0.24rem;
+          flex-direction: column;
-          span {
+          justify-content: center;
-            font-size: 18px;
+          align-items: center;
-            color: #0058e1;
+          margin-left: 1.28rem;
+          margin-bottom: 0.16rem;
+          border-bottom: 3px solid #fff;
+          i {
+            display: inline-block;
+            width: 0.48rem;
+            height: 0.48rem;
+            margin-bottom: 0.15rem;
+            cursor: pointer;
+          }
+          .all {
+            background: url('~@/assets/mynoticeView/all.png') no-repeat;
+            background-size: 100%;
+          }
+          .notice {
+            background: url('~@/assets/mynoticeView/notice.png') no-repeat;
+            background-size: 100%;
+          }
+          .comment {
+            background: url('~@/assets/mynoticeView/comment.png') no-repeat;
+            background-size: 100%;
+          }
+          .other {
+            background: url('~@/assets/mynoticeView/other.png') no-repeat;
+            background-size: 100%;
           }
         }
-        div:nth-of-type(1) {
+        .item:nth-of-type(1) {
-          margin-left: 0.12rem;
+          margin-left: 0;
         }
-      }
+        .select {
-    }
+          border-bottom: 3px solid #0058e1;
-    .right {
-      display: flex;
-      justify-content: space-around;
-      align-items: center;
-      div {
-        margin: 0 0.1rem;
-      }
-      span {
-        cursor: pointer;
-        color: #0058e1;
-        text-align: center;
-        align-self: center;
-        padding: 0.05rem 0.1rem;
-      }
-
-      span:hover {
-        background: rgba(0, 88, 225, 0.1);
-      }
-    }
-  }
-  .main {
-    background: #fff;
-    padding: 0 3.1rem;
-    height: 4.75rem;
-    overflow-y: scroll;
-    :deep(.ant-list-item-meta) {
-      display: flex;
-      align-items: center;
-      .ant-checkbox-wrapper {
-        margin-right: 0.3rem;
-      }
-      .ant-list-item-meta-title {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-
-        .left {
-          width: 9.2rem;
-          max-height: 0.43rem;
-          overflow: hidden;
-          text-overflow: ellipsis;
-          display: -webkit-box;
-          -webkit-line-clamp: 2;
-          -webkit-box-orient: vertical;
-          word-break: break-all;
-        }
-        .pointer {
-          cursor: pointer;
-        }
-        .left:hover {
           color: #0058e1;
         }
       }
+      .right {
+        display: flex;
+        align-items: center;
+        height: 0.32rem;
+        div {
+          width: 0.5rem;
+        }
+        .reset {
+          color: #0058e1;
+          cursor: pointer;
+        }
+      }
+    }
+    .btn {
+      background: #fff;
+      margin-top: 0.16rem;
+      padding: 0.14rem 3.1rem 0;
+      display: flex;
+      justify-content: space-between;
+      .left {
+        display: flex;
+        align-items: center;
+        .ant-select {
+          margin-right: 0.24rem;
+        }
+        .check {
+          display: flex;
+          align-items: center;
+          div {
+            margin-left: 0.24rem;
+            span {
+              font-size: 18px;
+              color: #0058e1;
+            }
+          }
+          div:nth-of-type(1) {
+            margin-left: 0.12rem;
+          }
+        }
+      }
+      .right {
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        div {
+          margin: 0 0.1rem;
+        }
+        span {
+          cursor: pointer;
+          color: #0058e1;
+          text-align: center;
+          align-self: center;
+          padding: 0.05rem 0.1rem;
+        }
+
+        span:hover {
+          background: rgba(0, 88, 225, 0.1);
+        }
+      }
+    }
+    .main {
+      background: #fff;
+      padding: 0 3.1rem;
+      height: 4.75rem;
+      overflow-y: scroll;
+      :deep(.ant-list-item-meta) {
+        display: flex;
+        align-items: center;
+        .ant-checkbox-wrapper {
+          margin-right: 0.3rem;
+        }
+        .ant-list-item-meta-title {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          .left {
+            cursor: pointer;
+            width: 9.2rem;
+            max-height: 0.43rem;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            display: -webkit-box;
+            -webkit-line-clamp: 2;
+            -webkit-box-orient: vertical;
+            word-break: break-all;
+          }
+          .left:hover {
+            color: #0058e1;
+          }
+        }
+      }
+    }
+    .ant-pagination {
+      background: #fff;
+      margin-top: 0;
+      padding: 0.2rem 0 0.2rem;
     }
   }
-  .ant-pagination {
-    background: #fff;
-    margin-top: 0;
-    padding: 0.2rem 0 0.2rem;
-  }
-}
 </style>