From 00d277dd39d1c1f7f9d8e28980bbea5a41437bfe Mon Sep 17 00:00:00 2001
From: wuhongjian <wuhongjian@hisense.com>
Date: Fri, 16 Dec 2022 17:27:57 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B7=B3=E8=BD=AC=E9=97=AE=E9=A2=98=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../components/AbilityRanking.vue             |  12 +-
 .../components/CapabilityRequirements.vue     |  12 +-
 .../newHome/components/LatestCapabilities.vue |  36 +-
 .../newHome/components/PopularAbility.vue     | 537 +++++++++---------
 .../components/RecommendationAbility.vue      |  12 +-
 5 files changed, 325 insertions(+), 284 deletions(-)

diff --git a/front/src/views/abilityStatistics/components/AbilityRanking.vue b/front/src/views/abilityStatistics/components/AbilityRanking.vue
index 33aaac78..43e43c8c 100644
--- a/front/src/views/abilityStatistics/components/AbilityRanking.vue
+++ b/front/src/views/abilityStatistics/components/AbilityRanking.vue
@@ -138,12 +138,20 @@
   //查看详情方法
   function viewDetails(id) {
     console.log('id=========>', id)
-    router.push({
-      path: '/details',
+    // router.push({
+    //   path: '/details',
+    //   query: {
+    //     id: id,
+    //   },
+    // })
+    const detailPage = router.resolve({
+      path: '/details', // 跳转的页面路由
       query: {
         id: id,
+        hiddenBackFlag: true,
       },
     })
+    window.open(detailPage.href, '_blank')
   }
   // 获取榜单数据
   const praiseList = ref([])
diff --git a/front/src/views/abilityStatistics/components/CapabilityRequirements.vue b/front/src/views/abilityStatistics/components/CapabilityRequirements.vue
index 1e081145..34d63e7b 100644
--- a/front/src/views/abilityStatistics/components/CapabilityRequirements.vue
+++ b/front/src/views/abilityStatistics/components/CapabilityRequirements.vue
@@ -59,12 +59,20 @@
   //查看详情方法
   function viewDetails(id) {
     console.log('id=========>', id)
-    router.push({
-      path: '/demandDetails',
+    // router.push({
+    //   path: '/demandDetails',
+    //   query: {
+    //     id: id,
+    //   },
+    // })
+    const detailPage = router.resolve({
+      path: '/demandDetails', // 跳转的页面路由
       query: {
         id: id,
+        // hiddenBackFlag: true,
       },
     })
+    window.open(detailPage.href, '_blank')
   }
   function jumpPage() {
     router.push({
diff --git a/front/src/views/newHome/components/LatestCapabilities.vue b/front/src/views/newHome/components/LatestCapabilities.vue
index 4f83e330..77381fa6 100644
--- a/front/src/views/newHome/components/LatestCapabilities.vue
+++ b/front/src/views/newHome/components/LatestCapabilities.vue
@@ -8,13 +8,13 @@
       <div class="bottom">
         <div class="item" v-for="item in productServiceData" :key="item.id">
           <div class="img" :class="item.imgType"></div>
-          <a-tooltip >
+          <a-tooltip>
             <template #title>{{ item.name }}</template>
             <div class="name">{{ item.name }}</div>
           </a-tooltip>
           <div class="dec">
-                <span>{{ item.deptName }}</span>
-              </div>
+            <span>{{ item.deptName }}</span>
+          </div>
           <div class="text">
             {{ item.description || '暂无描述' }}
           </div>
@@ -81,18 +81,26 @@
       query: {
         // select: '组件服务',
         select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
-        orderField:'tdr.create_date'
+        orderField: 'tdr.create_date',
       },
     })
   }
   const selectOne = (id) => {
     console.log('点击===============》', id)
-    router.push({
-      path: '/details',
+    // router.push({
+    //   path: '/details',
+    //   query: {
+    //     id: id,
+    //   },
+    // })
+    const detailPage = router.resolve({
+      path: '/details', // 跳转的页面路由
       query: {
         id: id,
+        hiddenBackFlag: true,
       },
     })
+    window.open(detailPage.href, '_blank')
   }
 </script>
 <style lang="less" scoped>
@@ -177,15 +185,15 @@
             word-break: break-all;
           }
           .dec {
-              margin: 8px 8px;
-              text-align: center;
-              padding-right: 10px;
-              color: #0058e1;
-              span {
-                background: rgba(0, 88, 225, 0.1);
-                padding: 5px 5px;
-              }
+            margin: 8px 8px;
+            text-align: center;
+            padding-right: 10px;
+            color: #0058e1;
+            span {
+              background: rgba(0, 88, 225, 0.1);
+              padding: 5px 5px;
             }
+          }
           .text {
             width: 100%;
             height: 0.9rem;
diff --git a/front/src/views/newHome/components/PopularAbility.vue b/front/src/views/newHome/components/PopularAbility.vue
index 4040cc2a..d85c5476 100644
--- a/front/src/views/newHome/components/PopularAbility.vue
+++ b/front/src/views/newHome/components/PopularAbility.vue
@@ -48,11 +48,10 @@
               <div class="dec">
                 <span>{{ item.deptName }}</span>
               </div>
-              <a-tooltip >
+              <a-tooltip>
                 <template #title>{{ item.description || '暂无描述' }}</template>
-                <div class="text">{{item.description || '暂无描述'}}</div>
+                <div class="text">{{ item.description || '暂无描述' }}</div>
               </a-tooltip>
-             
             </div>
           </div>
         </div>
@@ -65,302 +64,312 @@
   </div>
 </template>
 <script setup>
-import { ref } from 'vue'
-import { pageWithAttrs } from '@/api/home.js'
-import { useRouter } from 'vue-router'
-import { useStore } from 'vuex'
-import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
-const store = useStore()
-const router = useRouter()
-const select = ref('申请量')
-const selList = ref(['申请量', '收藏量'])
-const list = ref([])
+  import { ref } from 'vue'
+  import { pageWithAttrs } from '@/api/home.js'
+  import { useRouter } from 'vue-router'
+  import { useStore } from 'vuex'
+  import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
+  const store = useStore()
+  const router = useRouter()
+  const select = ref('申请量')
+  const selList = ref(['申请量', '收藏量'])
+  const list = ref([])
 
-const paramsGetResources = {
-  districtId: '',
-  pageNum: 1,
-  pageSize: 6,
-  type: '应用资源',
-  name: '',
-  infoList: [],
-  orderField: 'applyCount', // total 综合 visits 浏览量 applyCount 申请量 score 评分  collectCount 收藏量
-  orderType: 'DESC', // ASC 升序  DESC 降序
-}
-const selectChange = (sel) => {
-  select.value = sel
-  switch (select.value) {
-    case '浏览量':
-      paramsGetResources.orderField = 'visits'
-      break
-    case '申请量':
-      paramsGetResources.orderField = 'applyCount'
-      break
-    case '收藏量':
-      paramsGetResources.orderField = 'collectCount'
-      break
-    default:
-      paramsGetResources.orderField = 'total'
-      break
+  const paramsGetResources = {
+    districtId: '',
+    pageNum: 1,
+    pageSize: 6,
+    type: '应用资源',
+    name: '',
+    infoList: [],
+    orderField: 'applyCount', // total 综合 visits 浏览量 applyCount 申请量 score 评分  collectCount 收藏量
+    orderType: 'DESC', // ASC 升序  DESC 降序
+  }
+  const selectChange = (sel) => {
+    select.value = sel
+    switch (select.value) {
+      case '浏览量':
+        paramsGetResources.orderField = 'visits'
+        break
+      case '申请量':
+        paramsGetResources.orderField = 'applyCount'
+        break
+      case '收藏量':
+        paramsGetResources.orderField = 'collectCount'
+        break
+      default:
+        paramsGetResources.orderField = 'total'
+        break
+    }
+    getList()
+  }
+  const getList = () => {
+    pageWithAttrs(paramsGetResources).then((res) => {
+      console.log('查询列表============>', res.data.data.records)
+      res.data.data.records.forEach((val) => {
+        switch (val.type) {
+          case '组件服务':
+            val.imgType = 'zj'
+            break
+          case '应用资源':
+            val.imgType = 'yy'
+            break
+          case '基础设施':
+            val.imgType = 'jc'
+            break
+          case '数据资源':
+            val.imgType = 'sj'
+            break
+          case '知识库':
+            val.imgType = 'zs'
+            break
+          default:
+            val.imgType = 'zj'
+            break
+        }
+      })
+      list.value = res.data.data.records
+    })
   }
   getList()
-}
-const getList = () => {
-  pageWithAttrs(paramsGetResources).then((res) => {
-    console.log('查询列表============>', res.data.data.records)
-    res.data.data.records.forEach((val) => {
-      switch (val.type) {
-        case '组件服务':
-          val.imgType = 'zj'
-          break
-        case '应用资源':
-          val.imgType = 'yy'
-          break
-        case '基础设施':
-          val.imgType = 'jc'
-          break
-        case '数据资源':
-          val.imgType = 'sj'
-          break
-        case '知识库':
-          val.imgType = 'zs'
-          break
-        default:
-          val.imgType = 'zj'
-          break
-      }
-    })
-    list.value = res.data.data.records
-  })
-}
-getList()
 
-function jumpPage() {
-  // 点击内存入store
-  store.commit('home/selectCardsData', {
-    selectCardsnum: '组件服务',
-  })
-  console.log('选中===================>', store.getters['home/selectCardsnum'])
-  router.push({
-    path: '/DetailsPageconetent',
-    query: {
-      // select: '组件服务',
-      select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
-      orderField:paramsGetResources.orderField  //根据什么排序
-    },
-  })
-}
-const selectOne = (id) => {
-  console.log('点击===============》', id)
-  router.push({
-    path: '/details',
-    query: {
-      id: id,
-    },
-  })
-}
+  function jumpPage() {
+    // 点击内存入store
+    store.commit('home/selectCardsData', {
+      selectCardsnum: '组件服务',
+    })
+    console.log(
+      '选中===================>',
+      store.getters['home/selectCardsnum']
+    )
+    router.push({
+      path: '/DetailsPageconetent',
+      query: {
+        // select: '组件服务',
+        select: DETAIL_PAGE_CONTENT_DEFAULT_TAB,
+        orderField: paramsGetResources.orderField, //根据什么排序
+      },
+    })
+  }
+  const selectOne = (id) => {
+    console.log('点击===============》', id)
+    // router.push({
+    //   path: '/details',
+    //   query: {
+    //     id: id,
+    //   },
+    // })
+    const detailPage = router.resolve({
+      path: '/details', // 跳转的页面路由
+      query: {
+        id: id,
+        hiddenBackFlag: true,
+      },
+    })
+    window.open(detailPage.href, '_blank')
+  }
 </script>
 <style lang="less" scoped>
-.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;
+  .popular-ability {
+    height: 6.8rem;
+    background: url('~@/assets/newHome/popular-bg.png') no-repeat;
+    background-size: 100%;
     display: flex;
-    flex-direction: column;
-    flex-wrap: wrap;
-    .top {
-      font-size: 0.3rem;
-      color: #fff;
-      text-align: center;
+    justify-content: center;
+    .main {
+      width: 13rem;
+      margin-top: 0.78rem;
       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 {
+      .top {
+        font-size: 0.3rem;
+        color: #fff;
+        text-align: center;
         display: flex;
         flex-direction: column;
         flex-wrap: wrap;
-        .select {
-          cursor: pointer;
+        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;
-          align-items: center;
-          justify-content: center;
-          width: 1.05rem;
-          height: 2.1rem;
-          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;
-       
-          }
-        }
-        .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%;
+          .select {
+            cursor: pointer;
             display: flex;
-            justify-content: center;
+            flex-direction: column;
+            flex-wrap: wrap;
             align-items: center;
-            background: #eef1f8;
+            justify-content: center;
+            width: 1.05rem;
+            height: 2.1rem;
+            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.56rem;
-              height: 0.56rem;
+              width: 0.36rem;
+              height: 0.36rem;
               background-size: 100%;
             }
-            .zj {
-              background: url('~@/assets/newHome/popular-zj.png') no-repeat;
+            .fwl {
+              background: url('~@/assets/newHome/fwl-no.png') no-repeat;
               background-size: contain;
             }
-            .yy {
-              background: url('~@/assets/newHome/popular-yy.png') no-repeat;
+            .sgl {
+              background: url('~@/assets/newHome/sgl-no.png') no-repeat;
               background-size: contain;
             }
-            .jc {
-              background: url('~@/assets/newHome/popular-jc.png') no-repeat;
+            .scl {
+              background: url('~@/assets/newHome/scl-no.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;
-              word-break: break-all;
-            }
-            .dec {
-              margin: 8px 8px;
-              text-align: center;
-              padding-right: 10px;
-              color: #0058e1;
-              span {
-                background: rgba(0, 88, 225, 0.1);
-                padding: 5px 5px;
-              }
-            }
             .text {
-              width: 100%;
-              padding: 0rem 0.03rem;
+              color: rgba(255, 255, 255, 0.6);
               font-size: 0.14rem;
-              color: #212121;
-              line-height: 0.24rem;
-              height: 1rem;
-              word-break: break-all;
-              overflow: hidden;
             }
           }
+          .select:hover {
+            background: rgba(255, 255, 255, 0.12);
+          }
+          .checked {
+            background: rgba(255, 255, 255, 0.18) !important;
+            border-right: 0.02rem solid #fff;
+          }
         }
-        .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);
+        .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;
+                word-break: break-all;
+              }
+              .dec {
+                margin: 8px 8px;
+                text-align: center;
+                padding-right: 10px;
+                color: #0058e1;
+                span {
+                  background: rgba(0, 88, 225, 0.1);
+                  padding: 5px 5px;
+                }
+              }
+              .text {
+                width: 100%;
+                padding: 0rem 0.03rem;
+                font-size: 0.14rem;
+                color: #212121;
+                line-height: 0.24rem;
+                height: 1rem;
+                word-break: break-all;
+                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;
+      .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);
       }
-    }
-    .bottom-btn:hover {
-      background: rgba(0, 88, 225, 0.1);
     }
   }
-}
 </style>
diff --git a/front/src/views/newHome/components/RecommendationAbility.vue b/front/src/views/newHome/components/RecommendationAbility.vue
index 1f5dc17d..1b9d6987 100644
--- a/front/src/views/newHome/components/RecommendationAbility.vue
+++ b/front/src/views/newHome/components/RecommendationAbility.vue
@@ -104,12 +104,20 @@
   }
   const selectOne = (id) => {
     console.log('点击===============》', id)
-    router.push({
-      path: '/details',
+    // router.push({
+    //   path: '/details',
+    //   query: {
+    //     id: id,
+    //   },
+    // })
+    const detailPage = router.resolve({
+      path: '/details', // 跳转的页面路由
       query: {
         id: id,
+        hiddenBackFlag: true,
       },
     })
+    window.open(detailPage.href, '_blank')
   }
 </script>
 <style lang="less" scoped>