代码找回 (详情按钮，西海岸智能算法支持，融合服务详情，西海岸登录默认基础设施) 【2022-09-30：修改文件 】

front/src/router/index.js

@@ -85,7 +85,7 @@ export const constantRoutes = [
   {
     path: '/',
     component: Layout,
-    redirect: '/home',
+    redirect: whoShow.itShowXiHaiAn ? '/DetailsPageconetent' : '/home',
     meta: {
       title: '能力管理平台编目',
       icon: 'apps-line',

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

@@ -131,21 +131,12 @@
   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'],
@@ -208,7 +199,7 @@
         router.push({
           path: '/DetailsPageconetent',
           query: {
-            select: '组件服务',
+            select: DETAIL_PAGE_CONTENT_DEFAULT_TAB
           },
         })
         break
@@ -255,10 +246,6 @@
       case '融合服务':
         router.push({
           path: '/integrationServices',
-          //  path: '/DetailsPageconetent',
-          query: {
-            select: '融合服务',
-          },
         })
         break
       case 'CIM专区':

front/src/views/home/infrastructurePage.vue

@@ -510,7 +510,6 @@
             </template>
             <template v-if="column.dataIndex === 'operation'">
               <a
-                v-if="isXiHaiAn"
                 @click="
                   openVideo(
                     record.channelCode ||
@@ -577,18 +576,18 @@
         <template #footer></template>
         <div style="width: 100%; display: flex; justify-content: center">
           <div style="width: 100%; height: 100%; position: relative">
-            <!-- 预览视频--遮罩 -->
+            <!-- 西海岸--预览视频--遮罩 todo-->
-            <div class="video-cover" @click="videoShowMsg"></div>
+            <div class="video-cover" @click="videoShowMsg" v-show="isXiHaiAn"></div>
-            <div class="waterMark waterMark-left-top">
+            <div class="waterMark waterMark-left-top" v-show="isXiHaiAn">
               {{ userInfo.usernameShow }}
             </div>
-            <div class="waterMark waterMark-right-top">
+            <div class="waterMark waterMark-right-top" v-show="isXiHaiAn">
               {{ userInfo.realNameShow }}
             </div>
-            <div class="waterMark waterMark-left-bottom">
+            <div class="waterMark waterMark-left-bottom" v-show="isXiHaiAn">
               {{ userInfo.usernameShow }}
             </div>
-            <div class="waterMark waterMark-right-bottom">
+            <div class="waterMark waterMark-right-bottom" v-show="isXiHaiAn">
               {{ userInfo.realNameShow }}
             </div>
             <vue3VideoPlay v-bind="options" />
@@ -660,17 +659,17 @@
             style="width: 100%; height: 100%; position: relative"
           >
             <!-- 批量预览视频--遮罩 -->
-            <div class="batch-video-cover" @click="videoShowMsg(index)"></div>
+            <div class="batch-video-cover" @click="videoShowMsg(index)" v-show="isXiHaiAn"></div>
-            <div class="batch-waterMark batch-waterMark-left-top">
+            <div class="batch-waterMark batch-waterMark-left-top" v-show="isXiHaiAn">
               {{ userInfo.usernameShow }}
             </div>
-            <div class="batch-waterMark batch-waterMark-right-top">
+            <div class="batch-waterMark batch-waterMark-right-top" v-show="isXiHaiAn">
               {{ userInfo.realNameShow }}
             </div>
-            <div class="batch-waterMark batch-waterMark-left-bottom">
+            <div class="batch-waterMark batch-waterMark-left-bottom" v-show="isXiHaiAn">
               {{ userInfo.usernameShow }}
             </div>
-            <div class="batch-waterMark batch-waterMark-right-bottom">
+            <div class="batch-waterMark batch-waterMark-right-bottom" v-show="isXiHaiAn">
               {{ userInfo.realNameShow }}
             </div>
             <p></p>
@@ -1950,12 +1949,6 @@
       width: '60%',
       key: 'managementUnitName',
     },
-    {
-      title: '状态',
-      dataIndex: 'status',
-      width: '10%',
-      key: 'status',
-    },
     {
       title: '操作',
       dataIndex: 'operation',
@@ -1963,6 +1956,15 @@
       key: 'channelId',
     },
   ])
+  // 西海岸--状态展示
+  if(isXiHaiAn) {
+    columns.value = columns.value.splice(2, 0, {
+      title: '状态',
+      dataIndex: 'status',
+      width: '10%',
+      key: 'status',
+    })
+  }
   const columns2 = ref([
     {
       title: '名称',

front/src/views/home/integrationServices.vue

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