diff --git a/back/src/views/modules/workBench/components/bottom-view.vue b/back/src/views/modules/workBench/components/bottom-view.vue
index 98acdc7a..75368b2d 100644
--- a/back/src/views/modules/workBench/components/bottom-view.vue
+++ b/back/src/views/modules/workBench/components/bottom-view.vue
@@ -28,108 +28,108 @@
   </div>
 </template>
 <script>
-import contentTitle from "./content-title";
-import * as Apis from '../api';
+import contentTitle from './content-title'
+import * as Apis from '../api'
 export default {
   components: {
     contentTitle
   },
-  data() {
+  data () {
     return {
-      title: { dynamic: "部门发布动态", recommend: "部门推荐能力" },
+      title: { dynamic: '部门发布动态', recommend: '部门推荐能力' },
       list: [],
       columns: [
         {
-          title: "名称",
-          key: "name",
-          dataIndex: "name",
+          title: '名称',
+          key: 'name',
+          dataIndex: 'name',
           width: 250
         },
         {
-          title: "类型",
-          key: "type",
-          dataIndex: "type",
+          title: '类型',
+          key: 'type',
+          dataIndex: 'type',
           width: 76
         },
         {
-          title: "单位",
-          key: "deptContacts",
-          dataIndex: "deptContacts",
+          title: '单位',
+          key: 'deptContacts',
+          dataIndex: 'deptContacts',
           width: 144
         },
         {
-          title: "时间",
-          key: "createDate",
-          dataIndex: "createDate",
+          title: '时间',
+          key: 'createDate',
+          dataIndex: 'createDate',
           width: 153
         },
         {
-          title: "当前申请数",
-          key: "applyCount",
-          dataIndex: "applyCount",
+          title: '当前申请数',
+          key: 'applyCount',
+          dataIndex: 'applyCount',
           width: 145
-        },
+        }
       ],
       tableData: [],
       maxSize: { y: 195 },
       loadingDynamic: false,
-      loadingTable: false,
-    };
+      loadingTable: false
+    }
   },
-  mounted() {
-    this.getResourceByDept();
+  mounted () {
+    this.getResourceByDept()
     this.getApplyByDept()
   },
   methods: {
-    // 发布动态 
-    getResourceByDept() {
-      let data = {
+    // 发布动态
+    getResourceByDept () {
+      const data = {
         limit: 5,
         page: 1
-      };
-      this.loadingDynamic = true;
+      }
+      this.loadingDynamic = true
       Apis.getResourceByDept(
         data,
         res => {
-          this.loadingDynamic = false;
+          this.loadingDynamic = false
           if (res.data.code !== 0) {
             return this.$message.error(res.data.msg)
           }
-          console.log('res.data----发布动态-------->', res.data);
+          console.log('res.data----发布动态-------->', res.data)
           this.list = res.data.data.list || []
-          this.list.push(this.list[0])
-          this.list.push(this.list[0])
+          // this.list.push({})
+          // this.list.push({})
         },
         err => {
-          this.loadingDynamic = false;
+          this.loadingDynamic = false
           this.$message.error(err)
-          console.log('err-----发布动态------->', err);
+          console.log('err-----发布动态------->', err)
         }
-      );
+      )
     },
     // 部门推荐能力
-    getApplyByDept() {
-      let data = {
+    getApplyByDept () {
+      const data = {
         limit: 5,
         page: 1
-      };
-      this.loadingTable = true;
+      }
+      this.loadingTable = true
       Apis.getApplyByDept(
         data,
         res => {
-          this.loadingTable = false;
+          this.loadingTable = false
           if (res.data.code !== 0) {
             return this.$message.error(res.data.msg)
           }
-          console.log('res.data------部门推荐能力------>', res.data);
-          this.tableData = res.data.data.list || [];
+          console.log('res.data------部门推荐能力------>', res.data)
+          this.tableData = res.data.data.list || []
         },
         err => {
-          this.loadingTable = false;
+          this.loadingTable = false
           this.$message.error(err)
-          console.log("err", err);
+          console.log('err', err)
         }
-      );
+      )
     }
   }
 }
@@ -142,7 +142,6 @@ export default {
   text-overflow: ellipsis;
 }
 
-
 .bottom-view {
   width: 100%;
   height: 335px;
@@ -220,4 +219,4 @@ export default {
 ::v-deep .ant-table-thead {
   background-color: #f4f5f8;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/back/src/views/modules/workBench/components/frequency-top5-view.vue b/back/src/views/modules/workBench/components/frequency-top5-view.vue
index 49938ded..61f3133c 100644
--- a/back/src/views/modules/workBench/components/frequency-top5-view.vue
+++ b/back/src/views/modules/workBench/components/frequency-top5-view.vue
@@ -25,7 +25,7 @@
             </div>
             <div class="flex-row-between row-name" v-for="(data, i) in listInfo" :key="i">
                 <div class="left">
-                    <div class="row-index">{{ i + 3 }}</div>
+                    <div class="row-index">{{ i + 4 }}</div>
                     <el-tooltip effect="dark" :content="data.name" placement="top">
                         <div class="name-text ellipsis">{{ data.name || '--' }}</div>
                     </el-tooltip>
@@ -41,185 +41,181 @@
 import * as Apis from '../api.js'
 import contentTitle from './content-title.vue'
 export default {
-    data() {
-        return {
-            listInfo: [],
-            colorObj: {
-                1: '#4658710',
-                2: '#734204',
-                3: '#805932',
-            },
-            no1Obj: {
-                name: '',
-                count: '',
-            },
-            no2Obj: {
-                name: '',
-                count: '',
-            },
-            no3Obj: {
-                name: '',
-                count: '',
-            },
-            noData: false,
-            loading: true,
-        };
-    },
-    mounted() {
-        this.getData();
-    },
-    methods: {
-        // 频率
-        getData() {
-            let data = {
-                limit: 5,
-                page: 1,
-            };
-            this.loading = true
-            Apis.getFrequence(data, res => {
-                this.loading = false;
-                if (res.data.code !== 0) {
-                    return this.$message.error(res.data.msg);
-                }
-                console.log("res----频率-------->", res.data);
-                let _arr = res.data.data.records || [];
-                if (_arr.length == 0) {
-                    this.noData = true
-                    return;
-                }
-                for (let i = 0; i < 3; i++) {
-                    let k = i + 1;
-                    this[`no${k}Obj`].name = _arr[i].name
-                    this[`no${k}Obj`].count = _arr[i].count
-                }
-                this.listInfo = []
-                this.listInfo.push(_arr[3] || {})
-                this.listInfo.push(_arr[4] || {})
-
-            }, err => {
-                this.loading = false;
-                this.$message.error(err);
-            });
-        },
-        formatCount(count) {
-            return count || count === 0 ? count : '--'
+  data () {
+    return {
+      listInfo: [],
+      colorObj: {
+        1: '#4658710',
+        2: '#734204',
+        3: '#805932'
+      },
+      no1Obj: {
+        name: '',
+        count: ''
+      },
+      no2Obj: {
+        name: '',
+        count: ''
+      },
+      no3Obj: {
+        name: '',
+        count: ''
+      },
+      noData: false,
+      loading: true
+    }
+  },
+  mounted () {
+    this.getData()
+  },
+  methods: {
+    // 频率
+    getData () {
+      const data = {
+        limit: 5,
+        page: 1
+      }
+      this.loading = true
+      Apis.getFrequence(data, res => {
+        this.loading = false
+        if (res.data.code !== 0) {
+          return this.$message.error(res.data.msg)
         }
+        console.log('res----频率-------->', res.data)
+        const _arr = res.data.data.records || []
+        if (_arr.length == 0) {
+          this.noData = true
+          return
+        }
+        for (let i = 0; i < 3; i++) {
+          const k = i + 1
+          this[`no${k}Obj`].name = _arr[i].name
+          this[`no${k}Obj`].count = _arr[i].count
+        }
+        this.listInfo = []
+        this.listInfo.push(_arr[3] || {})
+        this.listInfo.push(_arr[4] || {})
+      }, err => {
+        this.loading = false
+        this.$message.error(err)
+      })
     },
-    components: { contentTitle }
+    formatCount (count) {
+      return count || count === 0 ? count : '--'
+    }
+  },
+  components: { contentTitle }
 }
 </script>
 <style lang="scss" scoped>
 .ellipsis {
-    //超出一行省略号
-    overflow: hidden;
-    white-space: nowrap;
-    text-overflow: ellipsis;
+  //超出一行省略号
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
 }
 
 .flex-row-between {
-    display: flex;
-    width: 100%;
-    margin-bottom: 8px;
-    height: 52px;
-    align-items: center;
-    justify-content: space-between;
-    padding-left: 10px;
-    padding-right: 16px;
-    box-sizing: border-box;
+  display: flex;
+  width: 100%;
+  margin-bottom: 8px;
+  height: 52px;
+  align-items: center;
+  justify-content: space-between;
+  padding-left: 10px;
+  padding-right: 16px;
+  box-sizing: border-box;
 }
 
 .left {
-    display: flex;
+  display: flex;
 }
 
 .frequency {
-    width: 540px;
-    height: 335px;
-    background: #fff;
-    padding: 0 16px;
-    box-sizing: border-box;
+  width: 540px;
+  height: 335px;
+  background: #fff;
+  padding: 0 16px;
+  box-sizing: border-box;
 }
 
 .no-box {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-    margin-bottom: 24px;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  margin-bottom: 24px;
 }
 
 .no1 {
-    width: 170px;
-    height: 120px;
-    margin-top: -20px;
-    background-image: url("~@/assets/img/workBench/NO1.png");
+  width: 170px;
+  height: 120px;
+  margin-top: -20px;
+  background-image: url("~@/assets/img/workBench/NO1.png");
 }
 
 .no {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-direction: column;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-direction: column;
 }
 
 .no2 {
-    width: 170px;
-    height: 120px;
-    margin-top: 10px;
-    background-image: url("~@/assets/img/workBench/NO2.png");
+  width: 170px;
+  height: 120px;
+  margin-top: 10px;
+  background-image: url("~@/assets/img/workBench/NO2.png");
 }
 
-
 .no3 {
-    width: 170px;
-    height: 120px;
-    margin-top: 10px;
-    background-image: url("~@/assets/img/workBench/NO3.png");
+  width: 170px;
+  height: 120px;
+  margin-top: 10px;
+  background-image: url("~@/assets/img/workBench/NO3.png");
 }
 
 .name {
-    font-size: 16px;
-    margin-bottom: 10px;
-    margin-top: 70px;
-    width: 150px;
-    text-align: center;
+  font-size: 16px;
+  margin-bottom: 10px;
+  margin-top: 70px;
+  width: 150px;
+  text-align: center;
 }
 
 .count {
-    font-size: 18px;
-    color: #2b2b2b;
+  font-size: 18px;
+  color: #2b2b2b;
 }
 
 .row-name {
-    background: #f4f5f8;
-    border-radius: 1px;
+  background: #f4f5f8;
+  border-radius: 1px;
 }
 
 .row-index {
-    font-size: 16px;
-    color: #414d60;
+  font-size: 16px;
+  color: #414d60;
 }
 
 .name-text {
-    font-size: 16px;
-    color: #464545;
-    margin-left: 10px;
-    width: 430px;
+  font-size: 16px;
+  color: #464545;
+  margin-left: 10px;
+  width: 430px;
 }
 
-
 .num-text {
-    font-size: 14px;
-    color: #2b2b2b;
-
+  font-size: 14px;
+  color: #2b2b2b;
 }
 
 .no-data {
-    width: 540px;
-    height: 300px;
-    background: #fff;
-    line-height: 232px;
-    font-size: 16px;
-    color: #212121;
-    text-align: center;
+  width: 540px;
+  height: 300px;
+  background: #fff;
+  line-height: 232px;
+  font-size: 16px;
+  color: #212121;
+  text-align: center;
 }
-</style>
\ No newline at end of file
+</style>
diff --git a/front/public/static/config/location.js b/front/public/static/config/location.js
index 7a90265f..92fcaa3c 100644
--- a/front/public/static/config/location.js
+++ b/front/public/static/config/location.js
@@ -1,13 +1,22 @@
 /*
  * @Author: hisense.wuhongjian
  * @Date: 2020-07-07 16:03:23
+<<<<<<< HEAD
  * @LastEditors: hisense.wuhongjian
  * @LastEditTime: 2022-07-07 17:30:10
+=======
+ * @LastEditors: hisense.liangjunhua
+ * @LastEditTime: 2022-07-07 17:41:25
+>>>>>>> 420a31531fdd60d9a8007e3328d071690c7688f1
  * @Description: 数据资源参数配置
  */
 const newLocation = 'qingdao'
 // const newLocation = 'baotou'
+<<<<<<< HEAD
 // const newLocation = 'xihaian'
+=======
+//  const newLocation = 'xihaian'
+>>>>>>> 420a31531fdd60d9a8007e3328d071690c7688f1
 
 // 数据资源数据
 const whoShow = {}
diff --git a/front/src/main.js b/front/src/main.js
index a24e5800..c43d1b20 100644
--- a/front/src/main.js
+++ b/front/src/main.js
@@ -2,7 +2,7 @@
  * @Author: hisense.wuhongjian
  * @Date: 2022-03-29 17:48:03
  * @LastEditors: hisense.liangjunhua
- * @LastEditTime: 2022-07-05 15:04:47
+ * @LastEditTime: 2022-07-07 09:22:56
  * @Description: 告诉大家这是什么
  */
 import { createApp } from 'vue'
@@ -51,9 +51,3 @@ router.beforeEach((to, from, next) => {
   document.body.scrollTop = 0
   next()
 })
-// 解决bug：页面/路由跳转后，滚动条消失，页面无法滚动
-router.afterEach((to, from, next) => {
-  document
-    .querySelector('body')
-    .setAttribute('style', 'overflow: auto !important;')
-})
diff --git a/front/src/views/abilityStatistics/components/AtlasResources.vue b/front/src/views/abilityStatistics/components/AtlasResources.vue
index 4c93e14a..9d9afe04 100644
--- a/front/src/views/abilityStatistics/components/AtlasResources.vue
+++ b/front/src/views/abilityStatistics/components/AtlasResources.vue
@@ -31,7 +31,9 @@
             v-for="(item, index) in bubbleList"
             :key="item.id"
             class="bubble-item"
-            @click.stop.prevent="index == 0 ? showDepartmentList() : ''"
+            @click.stop.prevent="
+              index == 0 ? showDepartmentList() : goToDetails(item)
+            "
           >
             <a-tooltip>
               <template #title>{{ item.name }}</template>
@@ -58,7 +60,7 @@
               </span>
             </nav>
           </article>
-          <p>查看更多&gt;</p>
+          <!-- <p>查看更多&gt;</p> -->
         </div>
         <div class="itemList" v-else-if="navSelect.indexOf('应用领域') > 0">
           <div class="item" v-for="item in dataList" :key="item.deptId">
@@ -136,6 +138,8 @@
     provideDeptTopN,
     applyDeptTopN,
   } from '@/api/abilityStatistics'
+  // import { useRouter } from 'vue-router'
+  // const router = useRouter()
   // 左侧导航
   const navList = ref([
     '能力共享方-应用领域',
@@ -149,6 +153,15 @@
   ])
   const navSelect = ref('能力共享方-应用领域')
   const departmentListFlag = ref(false)
+  const goToDetails = (item) => {
+    // console.log('点击气泡===============>', item)
+    // router.push({
+    //   path: '/details',
+    //   query: {
+    //     id: item.id,
+    //   },
+    // })
+  }
   // 点击导航
   const selectNav = (name) => {
     navSelect.value = name
diff --git a/front/src/views/abilityStatistics/components/ResourceAggregation.vue b/front/src/views/abilityStatistics/components/ResourceAggregation.vue
index a892d2b9..837b6885 100644
--- a/front/src/views/abilityStatistics/components/ResourceAggregation.vue
+++ b/front/src/views/abilityStatistics/components/ResourceAggregation.vue
@@ -147,6 +147,10 @@
           break
       }
     })
+    let arr = ['组件服务', '应用资源', '基础设施', '数据资源', '知识库']
+    dataList.value.dataList.sort((a, b) => {
+      return arr.indexOf(a.type) - arr.indexOf(b.type)
+    })
   })
   let datas = ref([])
   let laiyuanDataList = ref([])
diff --git a/front/src/views/capabilityCloud/components/ComponentServices.vue b/front/src/views/capabilityCloud/components/ComponentServices.vue
index ae100a9f..bf6082cf 100644
--- a/front/src/views/capabilityCloud/components/ComponentServices.vue
+++ b/front/src/views/capabilityCloud/components/ComponentServices.vue
@@ -271,8 +271,8 @@
       },
       grid: {
         top: '10%',
-        left: '0%',
-        right: '5%',
+        left: '3%',
+        right: '10%',
         bottom: '0%',
         containLabel: true,
       },
diff --git a/front/src/views/detailsAll/components/Algorithm/AlgorithmUsageMode.vue b/front/src/views/detailsAll/components/Algorithm/AlgorithmUsageMode.vue
index 9f43f6cb..380272aa 100644
--- a/front/src/views/detailsAll/components/Algorithm/AlgorithmUsageMode.vue
+++ b/front/src/views/detailsAll/components/Algorithm/AlgorithmUsageMode.vue
@@ -65,6 +65,7 @@
 
 <script setup>
   import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
+  import { message } from 'ant-design-vue'
   import { pinyin } from 'pinyin-pro'
   import { ref, defineProps, watch } from 'vue'
   let dataFrom = ref({
@@ -184,12 +185,19 @@
     let obj = props.dataList.infoList.filter(
       (item) => item.attrType === '技术文档'
     )[0]
-    console.log('dataFrom.value.link', obj.attrValue)
-    window.open(
-      window.SITE_CONFIG.previewUrl +
-        'hisense_office/onlinePreview?url=' +
-        btoa(encodeURI(obj.attrValue))
-    )
+    // console.log('dataFrom.value.link', obj.attrValue)
+    if (obj) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+          'hisense_office/onlinePreview?url=' +
+          btoa(encodeURI(obj.attrValue))
+      )
+    } else {
+      message.config({
+        top: '100px', // 距离顶部的位置
+      })
+      message.error('暂无上传技术文档')
+    }
   }
 </script>
 
diff --git a/front/src/views/detailsAll/components/Business/BusinessUsageMode.vue b/front/src/views/detailsAll/components/Business/BusinessUsageMode.vue
index 053d6e75..e1e19e28 100644
--- a/front/src/views/detailsAll/components/Business/BusinessUsageMode.vue
+++ b/front/src/views/detailsAll/components/Business/BusinessUsageMode.vue
@@ -2,7 +2,10 @@
   <!-- 使用方式 -->
   <div class="usage-mode" v-if="flag">
     <div class="tltle">
-      <DetalsTitle :title="dataFrom.title" :type="dataFrom.englishTitle"></DetalsTitle>
+      <DetalsTitle
+        :title="dataFrom.title"
+        :type="dataFrom.englishTitle"
+      ></DetalsTitle>
     </div>
     <div class="content" v-for="item in dataFrom.content" :key="item.title">
       <div class="content-left">
@@ -84,281 +87,297 @@
 </template>
 
 <script setup>
-import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
-import { pinyin } from 'pinyin-pro'
-import { ref, defineProps, watch } from 'vue'
-let dataFrom = ref({
-  title: '使用方式',
-  englishTitle: 'USAGE',
-  content: [
-    {
-      title: '组件地址',
-      link: {
-        name: '接口地址：',
+  import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
+  import { pinyin } from 'pinyin-pro'
+  import { ref, defineProps, watch } from 'vue'
+  import { message } from 'ant-design-vue'
+  let dataFrom = ref({
+    title: '使用方式',
+    englishTitle: 'USAGE',
+    content: [
+      {
+        title: '组件地址',
+        link: {
+          name: '接口地址：',
+        },
+        linkValue: '',
+        contact: '归属部门',
+        facilitator: { name: '归属部门：', value: '' },
+        people: { name: '部门联系人：', value: '' },
+        phone: {
+          name: '联系人电话：',
+          value: '',
+        },
+        contact2: '服务商',
+        facilitator2: { name: '服务商：', value: '' },
+        people2: { name: '服务商联系人：', value: '' },
+        phone2: {
+          name: '联系人电话：',
+          value: '',
+        },
       },
-      linkValue: '',
-      contact: '归属部门',
-      facilitator: { name: '归属部门：', value: '' },
-      people: { name: '部门联系人：', value: '' },
-      phone: {
-        name: '联系人电话：',
-        value: '',
-      },
-      contact2: '服务商',
-      facilitator2: { name: '服务商：', value: '' },
-      people2: { name: '服务商联系人：', value: '' },
-      phone2: {
-        name: '联系人电话：',
-        value: '',
-      },
-    },
-  ],
-})
-//数据初始化
-const props = defineProps({
-  dataList: { type: Object, default: null },
-})
-const flag = ref(true)
-if (props.dataList.infoList) {
-  let obj = props.dataList.infoList.filter(
-    (item) =>
-      item.attrType === '技术文档' ||
-      item.attrType === '服务商' ||
-      item.attrType === '服务商联系人' ||
-      item.attrType === '使用手册' ||
-      item.attrType === '服务地址' ||
-      item.attrType === '样式服务地址' ||
-      item.attrType === '服务商联系电话'
-  )[0]
-  if (!obj) {
-    flag.value = false
-  } else {
-    // eslint-disable-next-line vue/no-setup-props-destructure
-    dataFrom.value.content[0].link.value = props.dataList.apiUrl
-    dataFrom.value.content[0].facilitator.value = props.dataList.deptName
-    dataFrom.value.content[0].people.value = props.dataList.deptContacts
-    dataFrom.value.content[0].phone.value = props.dataList.deptPhone
-    console.log('dataList', props.dataList)
-    props.dataList.infoList.map((item) => {
-      if (item.attrType === '组件地址') {
-        dataFrom.value.content[0].linkValue = item.attrValue || '--'
-      } else if (item.attrType === '服务商') {
-        dataFrom.value.content[0].facilitator2.value = item.attrValue || '--'
-      } else if (item.attrType === '服务商联系人') {
-        dataFrom.value.content[0].people2.value = item.attrValue || '--'
-      } else if (item.attrType === '服务商联系电话') {
-        dataFrom.value.content[0].phone2.value = item.attrValue || '--'
-      }
-    })
-  }
-}
-watch(
-  () => props.dataList,
-  (val) => {
-    if (val) {
-      let obj = val.infoList.filter(
-        (item) =>
-          item.attrType === '技术文档' ||
-          item.attrType === '服务商' ||
-          item.attrType === '服务商联系人' ||
-          item.attrType === '使用手册' ||
-          item.attrType === '服务地址' ||
-          item.attrType === '样式服务地址' ||
-          item.attrType === '服务商联系电话'
-      )[0]
-      if (!obj) {
-        flag.value = false
-      } else {
-        dataFrom.value.content[0].link.value = val.apiUrl
-        dataFrom.value.content[0].facilitator.value = val.deptName
-        dataFrom.value.content[0].people.value = val.deptContacts
-        dataFrom.value.content[0].phone.value = val.deptPhone
-        console.log('dataList', val)
-        val.infoList.map((item) => {
-          if (item.attrType === '组件地址') {
-            dataFrom.value.content[0].linkValue = item.attrValue || '--'
-          } else if (item.attrType === '服务商') {
-            dataFrom.value.content[0].facilitator2.value =
-              item.attrValue || '--'
-          } else if (item.attrType === '服务商联系人') {
-            dataFrom.value.content[0].people2.value = item.attrValue || '--'
-          } else if (item.attrType === '服务商联系电话') {
-            dataFrom.value.content[0].phone2.value = item.attrValue || '--'
-          }
-        })
-      }
+    ],
+  })
+  //数据初始化
+  const props = defineProps({
+    dataList: { type: Object, default: null },
+  })
+  const flag = ref(true)
+  if (props.dataList.infoList) {
+    let obj = props.dataList.infoList.filter(
+      (item) =>
+        item.attrType === '技术文档' ||
+        item.attrType === '服务商' ||
+        item.attrType === '服务商联系人' ||
+        item.attrType === '使用手册' ||
+        item.attrType === '服务地址' ||
+        item.attrType === '样式服务地址' ||
+        item.attrType === '服务商联系电话'
+    )[0]
+    if (!obj) {
+      flag.value = false
+    } else {
+      // eslint-disable-next-line vue/no-setup-props-destructure
+      dataFrom.value.content[0].link.value = props.dataList.apiUrl
+      dataFrom.value.content[0].facilitator.value = props.dataList.deptName
+      dataFrom.value.content[0].people.value = props.dataList.deptContacts
+      dataFrom.value.content[0].phone.value = props.dataList.deptPhone
+      console.log('dataList', props.dataList)
+      props.dataList.infoList.map((item) => {
+        if (item.attrType === '组件地址') {
+          dataFrom.value.content[0].linkValue = item.attrValue || '--'
+        } else if (item.attrType === '服务商') {
+          dataFrom.value.content[0].facilitator2.value = item.attrValue || '--'
+        } else if (item.attrType === '服务商联系人') {
+          dataFrom.value.content[0].people2.value = item.attrValue || '--'
+        } else if (item.attrType === '服务商联系电话') {
+          dataFrom.value.content[0].phone2.value = item.attrValue || '--'
+        }
+      })
     }
   }
-)
-function technical() {
-  // 拼接路径
-  // const type = pinyin(props.dataList.type, {
-  //   pattern: 'initial',
-  // }).replace(/\s*/g, '')
-  // // 打开文档
-  // const id = props.dataList.id
-  // window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank')
-  // console.log('dataFrom.value.link', dataFrom.value.link)
-  let obj = props.dataList.infoList.filter(
-    (item) => item.attrType === '技术文档'
-  )[0]
-  console.log('dataFrom.value.link', obj.attrValue)
-  window.open(
-    window.SITE_CONFIG.previewUrl +
-    'hisense_office/onlinePreview?url=' +
-    btoa(encodeURI(obj.attrValue))
+  watch(
+    () => props.dataList,
+    (val) => {
+      if (val) {
+        let obj = val.infoList.filter(
+          (item) =>
+            item.attrType === '技术文档' ||
+            item.attrType === '服务商' ||
+            item.attrType === '服务商联系人' ||
+            item.attrType === '使用手册' ||
+            item.attrType === '服务地址' ||
+            item.attrType === '样式服务地址' ||
+            item.attrType === '服务商联系电话'
+        )[0]
+        if (!obj) {
+          flag.value = false
+        } else {
+          dataFrom.value.content[0].link.value = val.apiUrl
+          dataFrom.value.content[0].facilitator.value = val.deptName
+          dataFrom.value.content[0].people.value = val.deptContacts
+          dataFrom.value.content[0].phone.value = val.deptPhone
+          console.log('dataList', val)
+          val.infoList.map((item) => {
+            if (item.attrType === '组件地址') {
+              dataFrom.value.content[0].linkValue = item.attrValue || '--'
+            } else if (item.attrType === '服务商') {
+              dataFrom.value.content[0].facilitator2.value =
+                item.attrValue || '--'
+            } else if (item.attrType === '服务商联系人') {
+              dataFrom.value.content[0].people2.value = item.attrValue || '--'
+            } else if (item.attrType === '服务商联系电话') {
+              dataFrom.value.content[0].phone2.value = item.attrValue || '--'
+            }
+          })
+        }
+      }
+    }
   )
-}
-function technicalNew() {
-  // 拼接路径
-  // const type = pinyin(props.dataList.type, {
-  //   pattern: 'initial',
-  // }).replace(/\s*/g, '')
-  // // 打开文档
-  // const id = props.dataList.id
-  // window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank')
-  let obj = props.dataList.infoList.filter(
-    (item) => item.attrType === '使用手册'
-  )[0]
-  console.log('dataFrom.value.link', obj.attrValue)
-  window.open(
-    window.SITE_CONFIG.previewUrl +
-    'hisense_office/onlinePreview?url=' +
-    btoa(encodeURI(obj.attrValue))
-  )
-}
+  function technical() {
+    // 拼接路径
+    // const type = pinyin(props.dataList.type, {
+    //   pattern: 'initial',
+    // }).replace(/\s*/g, '')
+    // // 打开文档
+    // const id = props.dataList.id
+    // window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank')
+    // console.log('dataFrom.value.link', dataFrom.value.link)
+    let obj = props.dataList.infoList.filter(
+      (item) => item.attrType === '技术文档'
+    )[0]
+    if (obj) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+          'hisense_office/onlinePreview?url=' +
+          btoa(encodeURI(obj.attrValue))
+      )
+    } else {
+      message.config({
+        top: '100px', // 距离顶部的位置
+      })
+      message.error('暂无上传技术文档')
+    }
+  }
+  function technicalNew() {
+    // 拼接路径
+    // const type = pinyin(props.dataList.type, {
+    //   pattern: 'initial',
+    // }).replace(/\s*/g, '')
+    // // 打开文档
+    // const id = props.dataList.id
+    // window.open(window.SITE_CONFIG.frontUrl + type + '/' + id + '.md', '_blank')
+    let obj = props.dataList.infoList.filter(
+      (item) => item.attrType === '使用手册'
+    )[0]
+    console.log('dataFrom.value.link', obj.attrValue)
+    if (obj) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+          'hisense_office/onlinePreview?url=' +
+          btoa(encodeURI(obj.attrValue))
+      )
+    } else {
+      message.config({
+        top: '100px', // 距离顶部的位置
+      })
+      message.error('暂无上传使用手册')
+    }
+  }
 </script>
 
 <style lang="less" scoped>
-.usage-mode {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  padding: 0.8rem 0;
-
-  .content {
-    margin-top: 0.3rem;
+  .usage-mode {
     display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 0.8rem 0;
 
-    .content-left {
-      height: 1.5rem;
-      width: 6.2rem;
-      background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png') no-repeat;
-      background-position: center;
-      background-size: 100% 100%;
-      border-radius: 0.1rem;
-      margin-right: 0.6rem;
-      box-shadow: 0rem 0.05rem 0.15rem rgba(82, 106, 255, 0.4);
+    .content {
+      margin-top: 0.3rem;
       display: flex;
-      align-items: center;
-      padding: 0 0.35rem;
 
-      .left {
-        .content-left-title {
-          font-size: 0.26rem;
-          line-height: 0.26rem;
-          color: #212956;
-          margin-bottom: 0.2rem;
+      .content-left {
+        height: 1.5rem;
+        width: 6.2rem;
+        background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png')
+          no-repeat;
+        background-position: center;
+        background-size: 100% 100%;
+        border-radius: 0.1rem;
+        margin-right: 0.6rem;
+        box-shadow: 0rem 0.05rem 0.15rem rgba(82, 106, 255, 0.4);
+        display: flex;
+        align-items: center;
+        padding: 0 0.35rem;
 
-          span:first-child {
-            margin-right: 0.1rem;
+        .left {
+          .content-left-title {
+            font-size: 0.26rem;
+            line-height: 0.26rem;
+            color: #212956;
+            margin-bottom: 0.2rem;
+
+            span:first-child {
+              margin-right: 0.1rem;
+            }
+          }
+
+          .content-left-content {
+            width: 4.2rem;
+            font-size: 0.2rem;
+            color: rgba(33, 41, 86, 0.8);
+            line-height: 0.2rem;
+
+            p {
+              display: -webkit-box;
+              margin-bottom: 0.1rem;
+
+              span:last-of-type {
+                width: 298px;
+                display: -webkit-box;
+                overflow: hidden;
+                -webkit-line-clamp: 1;
+                -webkit-box-orient: vertical;
+              }
+            }
           }
         }
 
-        .content-left-content {
-          width: 4.2rem;
-          font-size: 0.2rem;
+        .right {
+          div {
+            height: 0.4rem;
+            width: 1.3rem;
+            background: #ffffff;
+            border-radius: 0.2rem;
+            color: #526aff;
+            font-size: 0.2rem;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            cursor: pointer;
+          }
+
+          div:first-child {
+            margin-bottom: 0.2rem;
+          }
+        }
+      }
+
+      .content-right {
+        height: 1.5rem;
+        width: 6.2rem;
+        background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png')
+          no-repeat;
+        background-position: center;
+        background-size: 100% 100%;
+        border-radius: 0.1rem;
+        box-shadow: 0rem 0.05rem 0.15rem rgba(82, 106, 255, 0.4);
+        display: flex;
+        justify-content: space-around;
+        align-items: center;
+        padding: 0 0.3rem;
+
+        .content-right-left {
+          border-right: 0.01rem solid #707fe0;
+          padding-right: 0.1rem;
+          margin-right: 0.1rem;
+        }
+
+        .content-right-title {
+          font-size: 0.26rem;
+          line-height: 0.26rem;
+          color: #212956;
+          margin-bottom: 0.15rem;
+        }
+
+        .content-right-content {
+          display: flex;
+          font-size: 0.16rem;
           color: rgba(33, 41, 86, 0.8);
           line-height: 0.2rem;
+          overflow: hidden;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
+          flex-direction: column;
 
           p {
+            // width: 1.60rem;
+            height: 0.2rem;
             display: -webkit-box;
-            margin-bottom: 0.1rem;
+            // overflow: hidden;
+            margin-bottom: 0.08rem;
+            white-space: nowrap;
+            -webkit-line-clamp: 1;
+            -webkit-box-orient: vertical;
+            margin-right: 0.15rem;
 
-            span:last-of-type {
-              width: 298px;
-              display: -webkit-box;
-              overflow: hidden;
-              -webkit-line-clamp: 1;
-              -webkit-box-orient: vertical;
+            span {
+              cursor: pointer;
             }
           }
         }
       }
-
-      .right {
-        div {
-          height: 0.4rem;
-          width: 1.3rem;
-          background: #ffffff;
-          border-radius: 0.2rem;
-          color: #526aff;
-          font-size: 0.2rem;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-          cursor: pointer;
-        }
-
-        div:first-child {
-          margin-bottom: 0.2rem;
-        }
-      }
-    }
-
-    .content-right {
-      height: 1.5rem;
-      width: 6.2rem;
-      background: url('~@/assets/detailsAll/business/business_usage_mode_bg.png') no-repeat;
-      background-position: center;
-      background-size: 100% 100%;
-      border-radius: 0.1rem;
-      box-shadow: 0rem 0.05rem 0.15rem rgba(82, 106, 255, 0.4);
-      display: flex;
-      justify-content: space-around;
-      align-items: center;
-      padding: 0 0.3rem;
-
-      .content-right-left {
-        border-right: 0.01rem solid #707fe0;
-        padding-right: 0.1rem;
-        margin-right: 0.1rem;
-      }
-
-      .content-right-title {
-        font-size: 0.26rem;
-        line-height: 0.26rem;
-        color: #212956;
-        margin-bottom: 0.15rem;
-      }
-
-      .content-right-content {
-        display: flex;
-        font-size: 0.16rem;
-        color: rgba(33, 41, 86, 0.8);
-        line-height: 0.2rem;
-        overflow: hidden;
-        -webkit-line-clamp: 1;
-        -webkit-box-orient: vertical;
-        flex-direction: column;
-
-        p {
-          // width: 1.60rem;
-          height: 0.2rem;
-          display: -webkit-box;
-          // overflow: hidden;
-          margin-bottom: 0.08rem;
-          white-space: nowrap;
-          -webkit-line-clamp: 1;
-          -webkit-box-orient: vertical;
-          margin-right: 0.15rem;
-
-          span {
-            cursor: pointer;
-          }
-        }
-      }
     }
   }
-}
 </style>
diff --git a/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue b/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
index b0e395c3..b0585b8f 100644
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceNavigation.vue
@@ -8,7 +8,12 @@
 <template>
   <div class="business-navigation" v-if="navList.length > 0">
     <template v-for="nav in navList" :key="nav.key">
-      <div class="nav" :class="{ select: nav.key == select }" v-if="nav.show" @click="selectNav(nav.key)">
+      <div
+        class="nav"
+        :class="{ select: nav.key == select }"
+        v-if="nav.show"
+        @click="selectNav(nav.key)"
+      >
         {{ nav.name }}
         <span class="line"></span>
       </div>
@@ -16,248 +21,247 @@
   </div>
 </template>
 <script setup>
-import { ref, defineProps, watch, getCurrentInstance } from 'vue'
-import { useRouter } from 'vue-router'
-import mybus from '@/myplugins/mybus'
-import { queryPartAppByKeyId2 } from '@/api/home'
-// 获取当前路由地址
-const router = useRouter()
-const keyId = router.currentRoute.value.query.id
-const navList = ref([
-  {
-    name: '图层展示',
-    key: 'service-presentation',
-  },
-  {
-    name: '图层信息',
-    key: 'service-information',
-  },
-  {
-    name: '应用场景',
-    key: 'service-application-scenarios',
-  },
-  {
-    name: '应用案例',
-    key: 'service-application-case',
-  },
-  {
-    name: '图层预览',
-    key: 'service-preview',
-  },
-  {
-    name: '使用方式',
-    key: 'service-usage-mode',
-  },
-  {
-    name: '常见问题',
-    key: 'service-common-problem',
-  },
-])
-const props = defineProps({
-  selectNow: { type: String, default: '' },
-  dataList: { type: Object, default: null },
-  associatedComponents: { type: Array, default: null },
-})
-const list = ref([])
-// 根据能力id查询是否存在关联应用
-if (keyId) {
-  queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
-    console.log('ressssssss', res)
-    if (res.data.data.length > 0) {
-      // 存在关联应用时在导航栏加入关联应用
-      navList.value.unshift({
-        name: '关联应用',
-        key: 'layer-service-associated-ability',
-        show: true,
-      })
-      list.value.unshift('关联应用')
-    }
+  import { ref, defineProps, watch, getCurrentInstance } from 'vue'
+  import { useRouter } from 'vue-router'
+  import mybus from '@/myplugins/mybus'
+  import { queryPartAppByKeyId2 } from '@/api/home'
+  // 获取当前路由地址
+  const router = useRouter()
+  const keyId = router.currentRoute.value.query.id
+  const navList = ref([
+    {
+      name: '图层展示',
+      key: 'service-presentation',
+    },
+    {
+      name: '图层信息',
+      key: 'service-information',
+    },
+    {
+      name: '应用场景',
+      key: 'service-application-scenarios',
+    },
+    {
+      name: '应用案例',
+      key: 'service-application-case',
+    },
+    {
+      name: '图层预览',
+      key: 'service-preview',
+    },
+    {
+      name: '使用方式',
+      key: 'service-usage-mode',
+    },
+    {
+      name: '常见问题',
+      key: 'service-common-problem',
+    },
+  ])
+  const props = defineProps({
+    selectNow: { type: String, default: '' },
+    dataList: { type: Object, default: null },
+    associatedComponents: { type: Array, default: null },
   })
-}
-const select = ref('layer-service-associated-ability')
-const selectNav = (key) => {
-  select.value = key
-  console.log(key, select.value)
-  mybus.emit('flyToView', select.value)
-}
-if (props.dataList.infoList) {
-  list.value = []
-  let arr = [
-    '图层缩略图',
-    '坐标系',
-    '应用场景',
-    '应用案例',
-    '是否可预览',
-    '使用方式',
-    '常见问题',
-  ]
-  // 排序
-  // eslint-disable-next-line vue/no-mutating-props
-  props.dataList.infoList.sort((a, b) => {
-    return arr.indexOf(a.attrType) - arr.indexOf(b.attrType)
-  })
-  props.dataList.infoList.map((item) => {
-    if (
-      item.attrType === '常见问题' ||
-      item.attrType === '应用场景' ||
-      item.attrType === '应用案例'
-    ) {
-      list.value.push(item.attrType)
-    } else if (item.attrType === '图层缩略图') {
-      list.value.push('图层展示')
-    } else if (item.attrType === '是否可预览') {
-      if (item.attrValue === '是') {
-        list.value.push('图层预览')
+  const list = ref([])
+  // 根据能力id查询是否存在关联应用
+  if (keyId) {
+    queryPartAppByKeyId2({ keyId: keyId }).then((res) => {
+      console.log('ressssssss', res)
+      if (res.data.data.length > 0) {
+        // 存在关联应用时在导航栏加入关联应用
+        navList.value.unshift({
+          name: '关联应用',
+          key: 'layer-service-associated-ability',
+          show: true,
+        })
+        list.value.unshift('关联应用')
       }
-    } else if (
-      item.attrType === '服务类型' ||
-      item.attrType === '覆盖区域' ||
-      item.attrType === '切片策略' ||
-      item.attrType === '坐标系' ||
-      item.attrType === '切片尺寸' ||
-      item.attrType === '最小级别' ||
-      item.attrType === '数据范围' ||
-      item.attrType === '图层类型' ||
-      item.attrType === '最大级别'
-    ) {
-      list.value.push('图层信息')
-    } else if (
-      item.attrType === '技术文档' ||
-      item.attrType === '服务商' ||
-      item.attrType === '服务商联系人' ||
-      item.attrType === '使用手册' ||
-      item.attrType === '服务地址' ||
-      item.attrType === '样式服务地址' ||
-      item.attrType === '服务商联系电话'
-    ) {
-      list.value.push('使用方式')
-    }
-  })
-  list.value.unshift('关联应用')
-  navList.value.forEach((item) => {
-    console.log(item)
-    if (list.value.indexOf(item.name) > -1) {
-      item.show = true
-    }
-  })
-  select.value = navList.value.filter(
-    (item) => item.name === list.value[0]
-  )[0].key
-  console.log('11111111111111111111111111', list.value, navList.value)
-}
-watch(
-  () => props.selectNow,
-  (newValue) => {
-    select.value = newValue
+    })
   }
-)
-watch(
-  () => props.dataList,
-  (val) => {
-    if (val) {
-      list.value = []
-      let arr = [
-        '图层缩略图',
-        '坐标系',
-        '应用场景',
-        '应用案例',
-        '是否可预览',
-        '使用方式',
-        '常见问题',
-      ]
-      // 排序
-      // eslint-disable-next-line vue/no-mutating-props
-      props.dataList.infoList.sort((a, b) => {
-        // console.log('排序==============>', a, b)
-        return arr.indexOf(a.attrType) - arr.indexOf(b.attrType)
-      })
-      val.infoList.map((item) => {
-        if (
-          item.attrType === '常见问题' ||
-          item.attrType === '应用场景' ||
-          item.attrType === '应用案例'
-        ) {
-          list.value.push(item.attrType)
-        } else if (item.attrType === '图层缩略图') {
-          list.value.push('图层展示')
-        } else if (item.attrType === '是否可预览') {
-          if (item.attrValue === '是') {
-            list.value.push('图层预览')
+  const select = ref('layer-service-associated-ability')
+  const selectNav = (key) => {
+    select.value = key
+    console.log(key, select.value)
+    mybus.emit('flyToView', select.value)
+  }
+  if (props.dataList.infoList) {
+    list.value = []
+    let arr = [
+      '图层缩略图',
+      '坐标系',
+      '应用场景',
+      '应用案例',
+      '是否可预览',
+      '使用方式',
+      '常见问题',
+    ]
+    // 排序
+    // eslint-disable-next-line vue/no-mutating-props
+    props.dataList.infoList.sort((a, b) => {
+      return arr.indexOf(a.attrType) - arr.indexOf(b.attrType)
+    })
+    props.dataList.infoList.map((item) => {
+      if (
+        item.attrType === '常见问题' ||
+        item.attrType === '应用场景' ||
+        item.attrType === '应用案例'
+      ) {
+        list.value.push(item.attrType)
+      } else if (item.attrType === '图层缩略图') {
+        list.value.push('图层展示')
+      } else if (item.attrType === '是否可预览') {
+        if (item.attrValue === '是') {
+          list.value.push('图层预览')
+        }
+      } else if (
+        item.attrType === '服务类型' ||
+        item.attrType === '覆盖区域' ||
+        item.attrType === '切片策略' ||
+        item.attrType === '坐标系' ||
+        item.attrType === '切片尺寸' ||
+        item.attrType === '最小级别' ||
+        item.attrType === '数据范围' ||
+        item.attrType === '图层类型' ||
+        item.attrType === '最大级别'
+      ) {
+        list.value.push('图层信息')
+      } else if (
+        item.attrType === '技术文档' ||
+        item.attrType === '服务商' ||
+        item.attrType === '服务商联系人' ||
+        item.attrType === '使用手册' ||
+        item.attrType === '服务地址' ||
+        item.attrType === '样式服务地址' ||
+        item.attrType === '服务商联系电话'
+      ) {
+        list.value.push('使用方式')
+      }
+    })
+    list.value.unshift('关联应用')
+    navList.value.forEach((item) => {
+      console.log(item)
+      if (list.value.indexOf(item.name) > -1) {
+        item.show = true
+      }
+    })
+    select.value = navList.value.filter(
+      (item) => item.name === list.value[0]
+    )[0].key
+    console.log('11111111111111111111111111', list.value, navList.value)
+  }
+  watch(
+    () => props.selectNow,
+    (newValue) => {
+      select.value = newValue
+    }
+  )
+  watch(
+    () => props.dataList,
+    (val) => {
+      if (val) {
+        list.value = []
+        let arr = [
+          '图层缩略图',
+          '坐标系',
+          '应用场景',
+          '应用案例',
+          '是否可预览',
+          '使用方式',
+          '常见问题',
+        ]
+        // 排序
+        // eslint-disable-next-line vue/no-mutating-props
+        props.dataList.infoList.sort((a, b) => {
+          // console.log('排序==============>', a, b)
+          return arr.indexOf(a.attrType) - arr.indexOf(b.attrType)
+        })
+        val.infoList.map((item) => {
+          if (
+            item.attrType === '常见问题' ||
+            item.attrType === '应用场景' ||
+            item.attrType === '应用案例'
+          ) {
+            list.value.push(item.attrType)
+          } else if (item.attrType === '图层缩略图') {
+            list.value.push('图层展示')
+          } else if (item.attrType === '是否可预览') {
+            if (item.attrValue === '是') {
+              list.value.push('图层预览')
+            }
+          } else if (
+            item.attrType === '服务类型' ||
+            item.attrType === '覆盖区域' ||
+            item.attrType === '切片策略' ||
+            item.attrType === '坐标系' ||
+            item.attrType === '切片尺寸' ||
+            item.attrType === '最小级别' ||
+            item.attrType === '数据范围' ||
+            item.attrType === '图层类型' ||
+            item.attrType === '最大级别'
+          ) {
+            list.value.push('图层信息')
+          } else if (
+            item.attrType === '技术文档' ||
+            item.attrType === '服务商' ||
+            item.attrType === '服务商联系人' ||
+            item.attrType === '使用手册' ||
+            item.attrType === '服务地址' ||
+            item.attrType === '样式服务地址' ||
+            item.attrType === '服务商联系电话'
+          ) {
+            list.value.push('使用方式')
           }
-        } else if (
-          item.attrType === '服务类型' ||
-          item.attrType === '覆盖区域' ||
-          item.attrType === '切片策略' ||
-          item.attrType === '坐标系' ||
-          item.attrType === '切片尺寸' ||
-          item.attrType === '最小级别' ||
-          item.attrType === '数据范围' ||
-          item.attrType === '图层类型' ||
-          item.attrType === '最大级别'
-        ) {
-          list.value.push('图层信息')
-        } else if (
-          item.attrType === '技术文档' ||
-          item.attrType === '服务商' ||
-          item.attrType === '服务商联系人' ||
-          item.attrType === '使用手册' ||
-          item.attrType === '服务地址' ||
-          item.attrType === '样式服务地址' ||
-          item.attrType === '服务商联系电话'
-        ) {
-          list.value.push('使用方式')
+        })
+        list.value.unshift('关联应用')
+        navList.value.forEach((item) => {
+          console.log(item)
+          if (list.value.indexOf(item.name) > -1) {
+            item.show = true
+          }
+        })
+        if (navList.value.filter((item) => item.name === list.value[0])[0]) {
+          select.value = navList.value.filter(
+            (item) => item.name === list.value[0]
+          )[0].key
         }
-      })
-      list.value.unshift('关联应用')
-      navList.value.forEach((item) => {
-        console.log(item)
-        if (list.value.indexOf(item.name) > -1) {
-          item.show = true
-        }
-      })
-      if (list.value.length > 0) {
-        select.value = navList.value.filter(
-          (item) => item.name === list.value[0]
-        )[0].key
       }
-      console.log('11111111111111111111111111', list.value, navList.value)
     }
-  }
-)
+  )
 </script>
 <style lang="less" scoped>
-.business-navigation {
-  width: 19.12rem;
-  height: 0.84rem;
-  line-height: 0.8rem;
-  display: flex;
-  justify-content: space-around;
-  font-size: 0.24rem;
-  color: #666;
-  background: #fff;
-  padding: 0 3rem;
-  box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
-  position: relative;
-
-  .nav {
-    cursor: pointer;
+  .business-navigation {
+    width: 19.12rem;
+    height: 0.84rem;
+    line-height: 0.8rem;
     display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    align-items: center;
+    justify-content: space-around;
+    font-size: 0.24rem;
+    color: #666;
+    background: #fff;
+    padding: 0 3rem;
+    box-shadow: 0rem 0.05rem 0.1rem #f2f3fb;
+    position: relative;
 
-    .line {
-      width: 0.4rem;
-      height: 0.04rem;
+    .nav {
+      cursor: pointer;
+      display: flex;
+      flex-direction: column;
+      justify-content: space-between;
+      align-items: center;
+
+      .line {
+        width: 0.4rem;
+        height: 0.04rem;
+      }
+    }
+
+    .select {
+      color: #526aff;
+
+      .line {
+        background: #526aff;
+      }
     }
   }
-
-  .select {
-    color: #526aff;
-
-    .line {
-      background: #526aff;
-    }
-  }
-}
 </style>
diff --git a/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue b/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
index 089ff5c7..401fb247 100644
--- a/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
+++ b/front/src/views/detailsAll/components/LayerService/LayerServiceUsageMode.vue
@@ -90,6 +90,7 @@
 
 <script setup>
   import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
+  import { message } from 'ant-design-vue'
   import { pinyin } from 'pinyin-pro'
   import { ref, defineProps, watch } from 'vue'
   let dataFrom = ref({
@@ -213,12 +214,18 @@
     let obj = props.dataList.infoList.filter(
       (item) => item.attrType === '技术文档'
     )[0]
-    console.log('dataFrom.value.link', obj.attrValue)
-    window.open(
-      window.SITE_CONFIG.previewUrl +
-        'hisense_office/onlinePreview?url=' +
-        btoa(encodeURI(obj.attrValue))
-    )
+    if (obj) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+          'hisense_office/onlinePreview?url=' +
+          btoa(encodeURI(obj.attrValue))
+      )
+    } else {
+      message.config({
+        top: '100px', // 距离顶部的位置
+      })
+      message.error('暂无上传技术文档')
+    }
   }
   function technicalNew() {
     // 拼接路径
@@ -231,12 +238,18 @@
     let obj = props.dataList.infoList.filter(
       (item) => item.attrType === '使用手册'
     )[0]
-    console.log('dataFrom.value.link', obj.attrValue)
-    window.open(
-      window.SITE_CONFIG.previewUrl +
-        'hisense_office/onlinePreview?url=' +
-        btoa(encodeURI(obj.attrValue))
-    )
+    if (obj) {
+      window.open(
+        window.SITE_CONFIG.previewUrl +
+          'hisense_office/onlinePreview?url=' +
+          btoa(encodeURI(obj.attrValue))
+      )
+    } else {
+      message.config({
+        top: '100px', // 距离顶部的位置
+      })
+      message.error('暂上传使用手册')
+    }
   }
 </script>
 
diff --git a/front/src/views/home/DetailsPageconetent.vue b/front/src/views/home/DetailsPageconetent.vue
index 71e324d8..2bb136a0 100644
--- a/front/src/views/home/DetailsPageconetent.vue
+++ b/front/src/views/home/DetailsPageconetent.vue
@@ -96,7 +96,7 @@
                 />
               </div>
             </div>
-            <div class="top-content">
+            <div class="top-content" v-if="Cardsname == '组件服务'">
               <span class="top-content-title">共享条件</span>
               <div class="leixingsumfather">
                 <div class="leixingsum">
@@ -106,6 +106,8 @@
                   >
                     申请
                   </a-checkable-tag>
+                </div>
+                <div class="leixingsum">
                   <a-checkable-tag
                     :checked="tagFlag == '免批申请'"
                     @change="() => chagneTag('免批申请')"
@@ -312,7 +314,7 @@
                 />
               </div>
             </div>
-            <div class="top-content">
+            <div class="top-content" v-if="Cardsname == '组件服务'">
               <span class="top-content-title">共享条件</span>
               <div class="leixingsumfather">
                 <div class="leixingsum">
@@ -322,6 +324,8 @@
                   >
                     申请
                   </a-checkable-tag>
+                </div>
+                <div class="leixingsum">
                   <a-checkable-tag
                     :checked="tagFlag == '免批申请'"
                     @change="() => chagneTag('免批申请')"
@@ -508,7 +512,7 @@
                 />
               </div>
             </div>
-            <div class="top-content">
+            <div class="top-content" v-if="Cardsname == '组件服务'">
               <span class="top-content-title">共享条件</span>
               <div class="leixingsumfather">
                 <div class="leixingsum">
@@ -518,6 +522,8 @@
                   >
                     申请
                   </a-checkable-tag>
+                </div>
+                <div class="leixingsum">
                   <a-checkable-tag
                     :checked="tagFlag == '免批申请'"
                     @change="() => chagneTag('免批申请')"
diff --git a/front/src/views/home/components/header.vue b/front/src/views/home/components/header.vue
index 2d232f3f..aa448adc 100644
--- a/front/src/views/home/components/header.vue
+++ b/front/src/views/home/components/header.vue
@@ -20,7 +20,7 @@
       {{ item.name }}
     </div>
     <a-badge :count="sgcNum">
-    <!-- 购物车 -->
+      <!-- 购物车 -->
       <svg
         t="1650455446850"
         class="icon"
@@ -41,7 +41,7 @@
       <!-- <a-avatar shape="square" size="large" /> -->
     </a-badge>
     <a-badge :count="mynoticeNum" style="margin-left: 0.2rem">
-    <!-- 消息提醒 -->
+      <!-- 消息提醒 -->
       <svg
         t="1654051054113"
         class="icon2"
@@ -267,21 +267,17 @@
     if (mynoticeDom) {
       mynoticeDom.addEventListener('mouseover', () => {
         mynoticeFlag.value = true
-        // document.documentElement.style.overflowY = 'hidden'
       })
       mynoticeDom.addEventListener('mouseout', () => {
         mynoticeFlag.value = false
-        document.documentElement.style.overflowY = 'scroll'
       })
     }
     if (mynotice) {
       mynotice.addEventListener('mouseover', () => {
         mynoticeFlag.value = true
-        // document.documentElement.style.overflowY = 'hidden'
       })
       mynotice.addEventListener('mouseout', () => {
         mynoticeFlag.value = false
-        document.documentElement.style.overflowY = 'scroll'
       })
     }
     mybus.on('getSgcNum', () => {
diff --git a/front/src/views/home/components/searchResultList.vue b/front/src/views/home/components/searchResultList.vue
index 724084a0..56b63cf7 100644
--- a/front/src/views/home/components/searchResultList.vue
+++ b/front/src/views/home/components/searchResultList.vue
@@ -137,7 +137,7 @@
               <div v-if="selectCardsname !== '数据资源'">
                 浏览量：{{ item.visits || 0 }}次
               </div>
-              <div>申购量：{{ item.applyCount || 0 }}次</div>
+              <div>申请量：{{ item.applyCount || 0 }}次</div>
               <div v-if="selectCardsname === '数据资源'">
                 数据量：{{ item.sjlCount || 0 }}
               </div>
@@ -430,8 +430,7 @@
                 item.guid
             )
           } else {
-             window.open(
-            'http://10.134.135.24:30090/#/home')
+            window.open('http://10.134.135.24:30090/#/home')
           }
         } else {
           if (type === 'apply') {
@@ -620,340 +619,340 @@
   }
 </script>
 <style scoped lang="less">
-#search-result-list-container {
-  width: 1088px;
-  padding: 0 20px;
-  background: #f3f5f9;
+  #search-result-list-container {
+    width: 1088px;
+    padding: 0 20px;
+    background: #f3f5f9;
 
-  .detail-content {
-    // 超出
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    width: 130px;
-    display: inline-block;
-  }
-
-  .shai-xuan {
-    width: 1047px;
-    height: 36px;
-    // margin: 11px 0 20px;
-    // background: #e5f2ff;
-    // padding-left: 20px;
-    display: flex;
-    align-items: center;
-    position: relative;
-
-    .circle {
-      width: 16px;
-      height: 16px;
-      border-radius: 50%;
-      background-color: #0087ff;
-      text-align: center;
-      color: #fff;
-      line-height: 16px;
-      margin-right: 21px;
+    .detail-content {
+      // 超出
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      width: 130px;
+      display: inline-block;
     }
 
-    .result {
-      font-size: 14px;
-      font-weight: 500;
-      color: #212121;
-
-      span {
-        font-size: 18px;
-        color: #0087ff;
-      }
-    }
-
-    .condition {
-      position: absolute;
-      right: 20px;
-      top: 10px;
-
-      ul li {
-        list-style-type: none;
-      }
-
-      ul {
-        display: flex;
-
-        li {
-          width: 90px;
-          height: 12px;
-          text-align: center;
-          cursor: pointer;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-
-          .arrow {
-            display: inline-block;
-            width: 12px;
-            height: 12px;
-            background: url('~@/assets/newHome/arrow.png');
-            margin-left: 10px;
-          }
-
-          .down {
-            background: url('~@/assets/newHome/down.png');
-            margin-top: 6px;
-          }
-        }
-      }
-    }
-  }
-
-  .result-list {
-    width: 1048px;
-    display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
-    border-bottom: 1px rgba(150, 144, 144, 0.3) solid;
-    border-top: 1px rgba(150, 144, 144, 0.3) solid;
-    padding: 10px 0;
-
-    .item {
-      width: 100%;
-      margin-top: 10px;
+    .shai-xuan {
+      width: 1047px;
+      height: 36px;
+      // margin: 11px 0 20px;
+      // background: #e5f2ff;
+      // padding-left: 20px;
       display: flex;
       align-items: center;
+      position: relative;
 
-      .left {
-        display: inline-block;
-        width: 120px;
-        height: 110px;
-        margin-right: 16px;
+      .circle {
+        width: 16px;
+        height: 16px;
+        border-radius: 50%;
+        background-color: #0087ff;
+        text-align: center;
+        color: #fff;
+        line-height: 16px;
+        margin-right: 21px;
       }
 
-      .right {
-        width: 100%;
-      }
-
-      .yyzy {
-        background: url('~@/assets/home/yyzy_square.png') no-repeat;
-        background-size: 100%;
-      }
-
-      .sjzy {
-        background: url('~@/assets/home/sjzy_square.png') no-repeat;
-        background-size: 100%;
-      }
-      .znsf {
-        background: url('~@/assets/home/znsf_square.png') no-repeat;
-        background-size: 100%;
-      }
-      .tcfw {
-        background: url('~@/assets/home/tcfw_square.png') no-repeat;
-        background-size: 100%;
-      }
-      .kfzj {
-        background: url('~@/assets/home/kfzj_square.png') no-repeat;
-        background-size: 100%;
-      }
-      .ywzj {
-        background: url('~@/assets/home/ywzj_square.png') no-repeat;
-        background-size: 100%;
-      }
-
-      .header {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin: 0 10px 0 0;
-
-        .header-right {
-          display: flex;
-          font-size: 14px;
-          color: #212121;
-
-          span {
-            font-size: 14px;
-            color: #212121;
-          }
-
-          div {
-            margin-right: 24px;
-          }
-        }
-
-        .header-right:last-child {
-          div {
-            margin-right: 16px;
-          }
-        }
+      .result {
+        font-size: 14px;
+        font-weight: 500;
+        color: #212121;
 
         span {
-          font-size: 20px;
-          font-weight: 600;
-          // color: #0087ff;
+          font-size: 18px;
+          color: #0087ff;
         }
       }
 
-      .dec {
-        overflow: hidden;
-        text-overflow: ellipsis;
-        // white-space: nowrap;
-        color: #0058e1;
-        display: flex;
-        margin-top: 10px;
+      .condition {
+        position: absolute;
+        right: 20px;
+        top: 10px;
 
-        div {
-          margin-right: 10px;
-          background: rgba(0, 88, 225, 0.1);
-          padding-left: 10px;
-          padding-right: 10px;
+        ul li {
+          list-style-type: none;
         }
 
-        div:nth-child(3) {
-          max-width: 200px;
-          display: -webkit-box;
-          /*设置为弹性盒子*/
-          -webkit-line-clamp: 1;
-          /*最多显示3行*/
-          overflow: hidden;
-          /*超出隐藏*/
-          text-overflow: ellipsis;
-          /*超出显示为省略号*/
-          -webkit-box-orient: vertical;
-        }
-      }
-
-      .btn {
-        display: flex;
-        justify-content: space-between;
-        font-size: 14px;
-        margin: 5px 0;
-
-        // .left {
-        //   width: 600px;
-        //   display: flex;
-        //   justify-content: space-between;
-        //   flex-wrap: wrap;
-        //   & > div {
-        //     width: 300px;
-        //     & > span {
-        //       color: #0087ff;
-        //       font-weight: 600;
-        //     }
-        //   }
-        // }
-        .right {
-          flex: 1;
+        ul {
           display: flex;
-          justify-content: flex-end;
-          margin: 0 10px;
-          align-items: center;
 
-          .shopping {
+          li {
+            width: 90px;
+            height: 12px;
+            text-align: center;
+            cursor: pointer;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+
+            .arrow {
+              display: inline-block;
+              width: 12px;
+              height: 12px;
+              background: url('~@/assets/newHome/arrow.png');
+              margin-left: 10px;
+            }
+
+            .down {
+              background: url('~@/assets/newHome/down.png');
+              margin-top: 6px;
+            }
+          }
+        }
+      }
+    }
+
+    .result-list {
+      width: 1048px;
+      display: flex;
+      flex-direction: column;
+      flex-wrap: wrap;
+      border-bottom: 1px rgba(150, 144, 144, 0.3) solid;
+      border-top: 1px rgba(150, 144, 144, 0.3) solid;
+      padding: 10px 0;
+
+      .item {
+        width: 100%;
+        margin-top: 10px;
+        display: flex;
+        align-items: center;
+
+        .left {
+          display: inline-block;
+          width: 120px;
+          height: 110px;
+          margin-right: 16px;
+        }
+
+        .right {
+          width: 100%;
+        }
+
+        .yyzy {
+          background: url('~@/assets/home/yyzy_square.png') no-repeat;
+          background-size: 100%;
+        }
+
+        .sjzy {
+          background: url('~@/assets/home/sjzy_square.png') no-repeat;
+          background-size: 100%;
+        }
+        .znsf {
+          background: url('~@/assets/home/znsf_square.png') no-repeat;
+          background-size: 100%;
+        }
+        .tcfw {
+          background: url('~@/assets/home/tcfw_square.png') no-repeat;
+          background-size: 100%;
+        }
+        .kfzj {
+          background: url('~@/assets/home/kfzj_square.png') no-repeat;
+          background-size: 100%;
+        }
+        .ywzj {
+          background: url('~@/assets/home/ywzj_square.png') no-repeat;
+          background-size: 100%;
+        }
+
+        .header {
+          display: flex;
+          justify-content: space-between;
+          align-items: center;
+          margin: 0 10px 0 0;
+
+          .header-right {
+            display: flex;
+            font-size: 14px;
+            color: #212121;
+
             span {
+              font-size: 14px;
+              color: #212121;
+            }
+
+            div {
+              margin-right: 24px;
+            }
+          }
+
+          .header-right:last-child {
+            div {
+              margin-right: 16px;
+            }
+          }
+
+          span {
+            font-size: 20px;
+            font-weight: 600;
+            // color: #0087ff;
+          }
+        }
+
+        .dec {
+          overflow: hidden;
+          text-overflow: ellipsis;
+          // white-space: nowrap;
+          color: #0058e1;
+          display: flex;
+          margin-top: 10px;
+
+          div {
+            margin-right: 10px;
+            background: rgba(0, 88, 225, 0.1);
+            padding-left: 10px;
+            padding-right: 10px;
+          }
+
+          div:nth-child(3) {
+            max-width: 200px;
+            display: -webkit-box;
+            /*设置为弹性盒子*/
+            -webkit-line-clamp: 1;
+            /*最多显示3行*/
+            overflow: hidden;
+            /*超出隐藏*/
+            text-overflow: ellipsis;
+            /*超出显示为省略号*/
+            -webkit-box-orient: vertical;
+          }
+        }
+
+        .btn {
+          display: flex;
+          justify-content: space-between;
+          font-size: 14px;
+          margin: 5px 0;
+
+          // .left {
+          //   width: 600px;
+          //   display: flex;
+          //   justify-content: space-between;
+          //   flex-wrap: wrap;
+          //   & > div {
+          //     width: 300px;
+          //     & > span {
+          //       color: #0087ff;
+          //       font-weight: 600;
+          //     }
+          //   }
+          // }
+          .right {
+            flex: 1;
+            display: flex;
+            justify-content: flex-end;
+            margin: 0 10px;
+            align-items: center;
+
+            .shopping {
+              span {
+                display: inline-block;
+                height: 32px;
+                width: 32px;
+                margin-right: 10px;
+                margin-top: 5px;
+              }
+
+              .shopping-on {
+                background: url('~@/assets/newHome/shopping-on.png');
+                cursor: pointer;
+              }
+
+              .shopping-down {
+                background: url('~@/assets/newHome/shopping-down.png');
+              }
+            }
+
+            .pk-on {
               display: inline-block;
               height: 32px;
               width: 32px;
+              margin-left: 10px;
               margin-right: 10px;
               margin-top: 5px;
-            }
-
-            .shopping-on {
-              background: url('~@/assets/newHome/shopping-on.png');
+              background: url('~@/assets/newHome/pk-on.png');
               cursor: pointer;
             }
 
-            .shopping-down {
-              background: url('~@/assets/newHome/shopping-down.png');
-            }
-          }
-
-          .pk-on {
-            display: inline-block;
-            height: 32px;
-            width: 32px;
-            margin-left: 10px;
-            margin-right: 10px;
-            margin-top: 5px;
-            background: url('~@/assets/newHome/pk-on.png');
-            cursor: pointer;
-          }
-
-          .sc {
-            // margin-top: 4px;
-            cursor: pointer;
-            display: flex;
-            align-items: center;
-
-            .sc-down {
-              display: inline-block;
-              height: 32px;
-              width: 32px;
-              background: url('~@/assets/newHome/sc-down.png');
-            }
-
-            .sc-on {
-              display: inline-block;
-              height: 32px;
-              width: 32px;
-              background: url('~@/assets/newHome/sc-on.png');
-            }
-          }
-
-          .ant-btn {
-            background: transparent;
-            background: #0058e1;
-            color: white;
-            width: 80px;
-            height: 32px;
-            font-weight: 600;
-            border-radius: 2px;
-            text-align: center;
-            display: flex;
-            align-items: center;
-            justify-content: center;
-            margin-left: 10px;
-          }
-
-          .ant-btn:last-child {
-            background: #0058e1;
-            color: white;
-          }
-        }
-      }
-
-      .bottom {
-        display: flex;
-        justify-content: space-between;
-        margin-top: 10px;
-        align-items: center;
-
-        & > div {
-          display: flex;
-          align-items: center;
-
-          & > div {
-            margin: 0 10px;
-          }
-        }
-
-        .pingfen {
-          :deep(span) {
-            display: flex;
-            align-items: center;
-
-            :deep(ul) {
+            .sc {
+              // margin-top: 4px;
+              cursor: pointer;
               display: flex;
               align-items: center;
 
-              :deep(.ant-rate-star:not(:last-child)) {
-                margin-right: 4px;
+              .sc-down {
+                display: inline-block;
+                height: 32px;
+                width: 32px;
+                background: url('~@/assets/newHome/sc-down.png');
+              }
+
+              .sc-on {
+                display: inline-block;
+                height: 32px;
+                width: 32px;
+                background: url('~@/assets/newHome/sc-on.png');
+              }
+            }
+
+            .ant-btn {
+              background: transparent;
+              background: #0058e1;
+              color: white;
+              width: 80px;
+              height: 32px;
+              font-weight: 600;
+              border-radius: 2px;
+              text-align: center;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+              margin-left: 10px;
+            }
+
+            .ant-btn:last-child {
+              background: #0058e1;
+              color: white;
+            }
+          }
+        }
+
+        .bottom {
+          display: flex;
+          justify-content: space-between;
+          margin-top: 10px;
+          align-items: center;
+
+          & > div {
+            display: flex;
+            align-items: center;
+
+            & > div {
+              margin: 0 10px;
+            }
+          }
+
+          .pingfen {
+            :deep(span) {
+              display: flex;
+              align-items: center;
+
+              :deep(ul) {
+                display: flex;
+                align-items: center;
+
+                :deep(.ant-rate-star:not(:last-child)) {
+                  margin-right: 4px;
+                }
               }
             }
           }
         }
       }
-    }
 
-    .item:nth-of-type(1) {
-      margin-top: 0;
+      .item:nth-of-type(1) {
+        margin-top: 0;
+      }
     }
   }
-}
 </style>
diff --git a/front/src/views/home/infrastructurePage.vue b/front/src/views/home/infrastructurePage.vue
index 626f905e..2d3ef2e8 100644
--- a/front/src/views/home/infrastructurePage.vue
+++ b/front/src/views/home/infrastructurePage.vue
@@ -5,11 +5,17 @@
     <div class="infrastructrue-tab">
       <div v-for="(item, index) in tabList" :key="index" class="tabBox">
         <b class="leftType">{{ item.title }}</b>
-        <button @click="nullClick" v-if="item.title == '视频标签'">清空</button>
+        <a-button @click="nullClick" v-if="item.title == '视频标签'">
+          清空
+        </a-button>
         <span
           v-for="itemContent in item.content"
           :key="itemContent"
+<<<<<<< HEAD
           @click="tabClick(index, item.title)"
+=======
+          @click="tabClick(index, itemContent, item)"
+>>>>>>> 420a31531fdd60d9a8007e3328d071690c7688f1
           :class="
             clickList[index].content.indexOf(itemContent.labelName) != -1 ||
             clickList[index].content.indexOf(itemContent) != -1
@@ -253,6 +259,7 @@
   let tableHeight = ref('600')
   //tab切换点击事件
   const tabClick = (indexFather, name) => {
+    console.log(clickList.value, indexFather, name)
     selectedRowKeys.value = []
     selectedList.value = []
     if (clickList.value[indexFather].content.indexOf(name) != -1) {
@@ -538,6 +545,19 @@
       }
       .tabBox {
         margin-bottom: 0.16rem;
+        :deep(.ant-btn:active) {
+          color: unset;
+          border-color: unset;
+        }
+        :deep(.ant-btn) {
+          margin-left: 10px;
+          border: 1px solid #666666;
+          color: #666666;
+          border-radius: 10px;
+        }
+        :deep(.ant-btn:hover) {
+          color: #40a9ff;
+        }
       }
       .tabBox:last-of-type {
         margin-bottom: 0;
diff --git a/front/src/views/newHome/components/PopularAbility.vue b/front/src/views/newHome/components/PopularAbility.vue
index 5f86d6c7..ee733fcf 100644
--- a/front/src/views/newHome/components/PopularAbility.vue
+++ b/front/src/views/newHome/components/PopularAbility.vue
@@ -16,7 +16,7 @@
           >
             <span
               class="img"
-              :class="sel == '浏览量' ? 'fwl' : sel == '申购量' ? 'sgl' : 'scl'"
+              :class="sel == '浏览量' ? 'fwl' : sel == '申请量' ? 'sgl' : 'scl'"
             ></span>
             <span class="text">{{ sel }}</span>
           </div>
@@ -35,7 +35,7 @@
               <div class="fw" v-if="select == '浏览量'">
                 {{ select }}:{{ item.visits }}
               </div>
-              <div class="fw" v-if="select == '申购量'">
+              <div class="fw" v-if="select == '申请量'">
                 {{ select }}:{{ item.applyCount }}
               </div>
               <div class="fw" v-if="select == '收藏量'">
@@ -64,7 +64,7 @@
   const store = useStore()
   const router = useRouter()
   const select = ref('浏览量')
-  const selList = ref(['浏览量', '申购量', '收藏量'])
+  const selList = ref(['浏览量', '申请量', '收藏量'])
   const list = ref([])
 
   const paramsGetResources = {
@@ -83,7 +83,7 @@
       case '浏览量':
         paramsGetResources.orderField = 'visits'
         break
-      case '申购量':
+      case '申请量':
         paramsGetResources.orderField = 'applyCount'
         break
       case '收藏量':
@@ -153,195 +153,195 @@
   }
 </script>
 <style lang="less" scoped>
-  .popular-ability {
-    height: 6.8rem;
-    background: url('~@/assets/newHome/popular-bg.png') no-repeat;
-    background-size: 100%;
+.popular-ability {
+  height: 6.8rem;
+  background: url('~@/assets/newHome/popular-bg.png') no-repeat;
+  background-size: 100%;
+  display: flex;
+  justify-content: center;
+  .main {
+    width: 13rem;
+    margin-top: 0.78rem;
     display: flex;
-    justify-content: center;
-    .main {
-      width: 13rem;
-      margin-top: 0.78rem;
+    flex-direction: column;
+    flex-wrap: wrap;
+    .top {
+      font-size: 0.3rem;
+      color: #fff;
+      text-align: center;
       display: flex;
       flex-direction: column;
       flex-wrap: wrap;
-      .top {
-        font-size: 0.3rem;
-        color: #fff;
-        text-align: center;
+      justify-content: center;
+      align-items: center;
+      .line {
+        width: 0.34rem;
+        height: 0.03rem;
+        background-color: #fff;
+        margin-top: 0.08rem;
+      }
+    }
+    .bottom {
+      display: flex;
+      justify-content: space-between;
+      margin-top: 0.52rem;
+      .left {
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
-        justify-content: center;
-        align-items: center;
-        .line {
-          width: 0.34rem;
-          height: 0.03rem;
-          background-color: #fff;
-          margin-top: 0.08rem;
-        }
-      }
-      .bottom {
-        display: flex;
-        justify-content: space-between;
-        margin-top: 0.52rem;
-        .left {
+        .select {
+          cursor: pointer;
           display: flex;
           flex-direction: column;
           flex-wrap: wrap;
-          .select {
-            cursor: pointer;
+          align-items: center;
+          justify-content: center;
+          width: 1.05rem;
+          height: 1.39rem;
+          background: rgba(255, 255, 255, 0.08);
+          margin-bottom: 0.01rem;
+          border-right: 0.02rem solid rgba(233, 233, 233, 0.3);
+          .img {
+            width: 0.36rem;
+            height: 0.36rem;
+            background-size: 100%;
+          }
+          .fwl {
+            background: url('~@/assets/newHome/fwl-no.png') no-repeat;
+            background-size: contain;
+          }
+          .sgl {
+            background: url('~@/assets/newHome/sgl-no.png') no-repeat;
+            background-size: contain;
+          }
+          .scl {
+            background: url('~@/assets/newHome/scl-no.png') no-repeat;
+            background-size: contain;
+          }
+          .text {
+            color: rgba(255, 255, 255, 0.6);
+            font-size: 0.14rem;
+            margin-top: 0.08rem;
+          }
+        }
+        .select:hover {
+          background: rgba(255, 255, 255, 0.12);
+        }
+        .checked {
+          background: rgba(255, 255, 255, 0.18) !important;
+          border-right: 0.02rem solid #fff;
+        }
+      }
+      .right {
+        cursor: pointer;
+        display: flex;
+        justify-content: space-between;
+        flex-wrap: wrap;
+        margin-left: 0.2rem;
+        .item {
+          width: 3.78rem;
+          height: 2rem;
+          display: flex;
+          .item-left {
+            width: 0.83rem;
+            height: 100%;
             display: flex;
-            flex-direction: column;
-            flex-wrap: wrap;
-            align-items: center;
             justify-content: center;
-            width: 1.05rem;
-            height: 1.39rem;
-            background: rgba(255, 255, 255, 0.08);
-            margin-bottom: 0.01rem;
-            border-right: 0.02rem solid rgba(233, 233, 233, 0.3);
+            align-items: center;
+            background: #eef1f8;
             .img {
-              width: 0.36rem;
-              height: 0.36rem;
+              width: 0.56rem;
+              height: 0.56rem;
               background-size: 100%;
             }
-            .fwl {
-              background: url('~@/assets/newHome/fwl-no.png') no-repeat;
+            .zj {
+              background: url('~@/assets/newHome/popular-zj.png') no-repeat;
               background-size: contain;
             }
-            .sgl {
-              background: url('~@/assets/newHome/sgl-no.png') no-repeat;
+            .yy {
+              background: url('~@/assets/newHome/popular-yy.png') no-repeat;
               background-size: contain;
             }
-            .scl {
-              background: url('~@/assets/newHome/scl-no.png') no-repeat;
+            .jc {
+              background: url('~@/assets/newHome/popular-jc.png') no-repeat;
               background-size: contain;
             }
+            .sj {
+              background: url('~@/assets/newHome/popular-sj.png') no-repeat;
+              background-size: contain;
+            }
+            .zs {
+              background: url('~@/assets/newHome/popular-zs.png') no-repeat;
+              background-size: contain;
+            }
+          }
+          .item-right {
+            width: 100%;
+            height: 100%;
+            background: #fff;
+            .fw {
+              width: 100%;
+              padding-right: 0.1rem;
+              padding-top: 0.03rem;
+              text-align: right;
+              color: 666;
+              font-size: 0.14rem;
+              color: #666;
+            }
+            .name {
+              font-size: 0.18rem;
+              color: #212121;
+              text-align: center;
+              margin-top: 0.05rem;
+              overflow: hidden;
+              text-overflow: ellipsis;
+              display: -webkit-box;
+              -webkit-line-clamp: 1;
+              -webkit-box-orient: vertical;
+            }
             .text {
-              color: rgba(255, 255, 255, 0.6);
-              font-size: 0.14rem;
-              margin-top: 0.08rem;
-            }
-          }
-          .select:hover {
-            background: rgba(255, 255, 255, 0.12);
-          }
-          .checked {
-            background: rgba(255, 255, 255, 0.18) !important;
-            border-right: 0.02rem solid #fff;
-          }
-        }
-        .right {
-          cursor: pointer;
-          display: flex;
-          justify-content: space-between;
-          flex-wrap: wrap;
-          margin-left: 0.2rem;
-          .item {
-            width: 3.78rem;
-            height: 2rem;
-            display: flex;
-            .item-left {
-              width: 0.83rem;
-              height: 100%;
-              display: flex;
-              justify-content: center;
-              align-items: center;
-              background: #eef1f8;
-              .img {
-                width: 0.56rem;
-                height: 0.56rem;
-                background-size: 100%;
-              }
-              .zj {
-                background: url('~@/assets/newHome/popular-zj.png') no-repeat;
-                background-size: contain;
-              }
-              .yy {
-                background: url('~@/assets/newHome/popular-yy.png') no-repeat;
-                background-size: contain;
-              }
-              .jc {
-                background: url('~@/assets/newHome/popular-jc.png') no-repeat;
-                background-size: contain;
-              }
-              .sj {
-                background: url('~@/assets/newHome/popular-sj.png') no-repeat;
-                background-size: contain;
-              }
-              .zs {
-                background: url('~@/assets/newHome/popular-zs.png') no-repeat;
-                background-size: contain;
-              }
-            }
-            .item-right {
               width: 100%;
-              height: 100%;
-              background: #fff;
-              .fw {
-                width: 100%;
-                padding-right: 0.1rem;
-                padding-top: 0.03rem;
-                text-align: right;
-                color: 666;
-                font-size: 0.14rem;
-                color: #666;
-              }
-              .name {
-                font-size: 0.18rem;
-                color: #212121;
-                text-align: center;
-                margin-top: 0.05rem;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                display: -webkit-box;
-                -webkit-line-clamp: 1;
-                -webkit-box-orient: vertical;
-              }
-              .text {
-                width: 100%;
-                padding: 0.24rem 0.3rem;
-                font-size: 0.14rem;
-                color: #212121;
-                line-height: 0.24rem;
-                height: 1rem;
-                overflow: hidden;
-              }
+              padding: 0.24rem 0.3rem;
+              font-size: 0.14rem;
+              color: #212121;
+              line-height: 0.24rem;
+              height: 1rem;
+              overflow: hidden;
             }
           }
-          .item:nth-of-type(4),
-          .item:nth-of-type(5),
-          .item:nth-of-type(6) {
-            margin-top: 0.2rem;
-          }
-          .item:hover {
-            border-radius: 0.02rem;
-            border: 0.01rem solid #0058e1;
-            box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
-          }
         }
-      }
-      .bottom-btn {
-        cursor: pointer;
-        text-align: center;
-        margin-top: 0.24rem;
-        color: #fff;
-        width: 1rem;
-        height: 0.24rem;
-        line-height: 0.24rem;
-        margin-left: 6rem;
-        span {
-          display: inline-block;
-          width: 0.1rem;
-          height: 0.1rem;
-          background: url('~@/assets/newHome/gd.png') no-repeat;
-          background-size: contain;
+        .item:nth-of-type(4),
+        .item:nth-of-type(5),
+        .item:nth-of-type(6) {
+          margin-top: 0.2rem;
+        }
+        .item:hover {
+          border-radius: 0.02rem;
+          border: 0.01rem solid #0058e1;
+          box-shadow: 0rem 0.08rem 0.2rem rgba(0, 88, 225, 0.3);
         }
-      }
-      .bottom-btn:hover {
-        background: rgba(0, 88, 225, 0.1);
       }
     }
+    .bottom-btn {
+      cursor: pointer;
+      text-align: center;
+      margin-top: 0.24rem;
+      color: #fff;
+      width: 1rem;
+      height: 0.24rem;
+      line-height: 0.24rem;
+      margin-left: 6rem;
+      span {
+        display: inline-block;
+        width: 0.1rem;
+        height: 0.1rem;
+        background: url('~@/assets/newHome/gd.png') no-repeat;
+        background-size: contain;
+      }
+    }
+    .bottom-btn:hover {
+      background: rgba(0, 88, 225, 0.1);
+    }
   }
+}
 </style>