From b6e56cc0ea2db7dfe5705523dede1656180622a3 Mon Sep 17 00:00:00 2001
From: guoyue <guoyue2@hisense.com>
Date: Fri, 2 Dec 2022 17:29:20 +0800
Subject: [PATCH] =?UTF-8?q?=E7=9F=A5=E8=AF=86=E5=BA=93--=E6=A8=A1=E5=9E=8B?=
 =?UTF-8?q?=E8=A7=84=E5=88=99=E8=AF=A6=E6=83=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/views/detailsAll/GovernanceModel.vue  | 226 +++++-----
 .../GovernanceModelInputData.vue              | 108 +++++
 .../GovernanceModelNavigation.vue             |  88 ++++
 front/src/views/home/details.vue              | 387 +++++++++---------
 4 files changed, 498 insertions(+), 311 deletions(-)
 create mode 100644 front/src/views/detailsAll/components/GovernanceModel/GovernanceModelInputData.vue
 create mode 100644 front/src/views/detailsAll/components/GovernanceModel/GovernanceModelNavigation.vue

diff --git a/front/src/views/detailsAll/GovernanceModel.vue b/front/src/views/detailsAll/GovernanceModel.vue
index 0b501ca9..496ce70d 100644
--- a/front/src/views/detailsAll/GovernanceModel.vue
+++ b/front/src/views/detailsAll/GovernanceModel.vue
@@ -8,128 +8,126 @@
 <template>
   <div class="application-details" :class="{ fixed2: scrollTop >= 600 }">
     <!-- 头部基本信息 -->
-    <layer-service-top-details
-      :dataList="dataList.data"
-    ></layer-service-top-details>
-    <!-- 模型信息-->
-    <layer-service-information
-      :dataList="dataList.data"
-      id="service-information"
-      class="scrollBox"
-    ></layer-service-information>
+    <layer-service-top-details :dataList="dataList.data"></layer-service-top-details>
+    <!-- tab导航 -->
+    <GovernanceModelNavigation :dataList="dataList.data" :class="{ fixed: scrollTop >= 600 }" :selectNow="selectNow">
+    </GovernanceModelNavigation>
+    <!-- 输入数据 -->
+    <GovernanceModelInputData :dataList="dataList.data" id="governance-model-input-data" class="scrollBox" title="输入数据">
+    </GovernanceModelInputData>
+    <!-- 输出数据 -->
+    <GovernanceModelInputData :dataList="dataList.data" id="governance-model-output-data" class="scrollBox"
+      title="输出数据">
+    </GovernanceModelInputData>
+    <!-- 模型规则 -->
+    <GovernanceModelInputData :dataList="dataList.data" id="governance-model-rule" class="scrollBox" title="模型规则">
+    </GovernanceModelInputData>
   </div>
 </template>
 <script setup>
-  import LayerServiceInformation from '@/views/detailsAll/components/GovernanceModel/GovernanceModelInformation.vue' //模型信息
-  import LayerServiceTopDetails from '@/views/detailsAll/components/GovernanceModel/GovernanceModelTopDetails.vue' //头部基本信息
-  import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
-  import { useRouter } from 'vue-router'
-  import {
-    updateVisits,
-    selectOne,
-    queryPartAppByKeyId2,
-    browsingInsert,
-  } from '@/api/home'
-  import mybus from '@/myplugins/mybus'
-  const router = useRouter()
-  const scrollTop = ref(0)
-  const domArr = ref([])
-  const selectNow = ref('')
-  const dataList = reactive({ data: {} })
-  const id = router.currentRoute.value.query.id
-  const obj = JSON.parse(window.sessionStorage.getItem('preview'))
-  const associatedComponents = ref([{ type: '应用资源', dataList: [] }])
-  let loading = ref(true)
-  document.documentElement.style.transition = 'all 0.3s ease'
-  document.documentElement.scrollTop = 0
-  document.body.style.transition = 'all 0.3s ease'
-  document.body.scrollTop = 0
-  mybus.on('flyToView', (id) => {
-    let top = document.querySelector('#' + id).offsetTop - 50
-    document.documentElement.scrollTop = top
-    document.body.scrollTop = top
-  })
-  onMounted(() => {
-    window.addEventListener('scroll', () => {
-      domArr.value = document.querySelectorAll('.scrollBox')
-      scrollTop.value =
-        document.documentElement.scrollTop || document.body.scrollTop
-      for (let i = 0; i < domArr.value.length; i++) {
-        if (i === 0) {
-          if (scrollTop.value <= domArr.value[i + 1].offsetTop - 50) {
-            selectNow.value = domArr.value[i].id
-          }
-        } else if (i == domArr.value.length - 1) {
-          if (scrollTop.value >= domArr.value[i].offsetTop - 50) {
-            selectNow.value = domArr.value[i].id
-          }
-        } else {
-          if (
-            scrollTop.value >= domArr.value[i].offsetTop - 50 &&
-            scrollTop.value <= domArr.value[i + 1].offsetTop - 50
-          ) {
-            selectNow.value = domArr.value[i].id
-          }
+import GovernanceModelNavigation from '@/views/detailsAll/components/GovernanceModel/GovernanceModelNavigation.vue' // Tab信息
+import LayerServiceTopDetails from '@/views/detailsAll/components/GovernanceModel/GovernanceModelTopDetails.vue' // 头部基本信息
+import GovernanceModelInputData from '@/views/detailsAll/components/GovernanceModel/GovernanceModelInputData.vue' // 输入数据、输出数据、模型规则
+import { ref, onMounted, onBeforeUnmount, reactive } from 'vue'
+import { useRouter } from 'vue-router'
+import {
+  updateVisits,
+  selectOne,
+  browsingInsert,
+} from '@/api/home';
+import mybus from '@/myplugins/mybus';
+
+const router = useRouter()
+const scrollTop = ref(0)
+const domArr = ref([])
+const selectNow = ref('')
+const dataList = reactive({ data: {} })
+const id = router.currentRoute.value.query.id
+const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+let loading = ref(true)
+document.documentElement.style.transition = 'all 0.3s ease'
+document.documentElement.scrollTop = 0
+document.body.style.transition = 'all 0.3s ease'
+document.body.scrollTop = 0
+
+mybus.on('flyToView', (id) => {
+  let top = document.querySelector('#' + id).offsetTop - 50
+  document.documentElement.scrollTop = top
+  document.body.scrollTop = top
+})
+
+onMounted(() => {
+  window.addEventListener('scroll', () => {
+    domArr.value = document.querySelectorAll('.scrollBox')
+    scrollTop.value =
+      document.documentElement.scrollTop || document.body.scrollTop
+    for (let i = 0; i < domArr.value.length; i++) {
+      if (i === 0) {
+        if (scrollTop.value <= domArr.value[i + 1].offsetTop - 50) {
+          selectNow.value = domArr.value[i].id
+        }
+      } else if (i == domArr.value.length - 1) {
+        if (scrollTop.value >= domArr.value[i].offsetTop - 50) {
+          selectNow.value = domArr.value[i].id
+        }
+      } else {
+        if (
+          scrollTop.value >= domArr.value[i].offsetTop - 50 &&
+          scrollTop.value <= domArr.value[i + 1].offsetTop - 50
+        ) {
+          selectNow.value = domArr.value[i].id
         }
       }
-    })
-  })
-
-  const init = (id) => {
-    if (id) {
-      selectOne(id).then((res) => {
-        dataList.data = res.data.data
-        console.log('初始化详情页=========================>', dataList.data)
-        const arrList = ref([])
-        arrList.value = JSON.parse(window.sessionStorage.getItem('visits'))
-        if (arrList.value && arrList.value.indexOf(id) === -1) {
-          arrList.value.push(id)
-          updateVisits({
-            id: res.data.data.id,
-            visits: res.data.data.visits || '0',
-          }).then(() => {
-            window.sessionStorage.setItem(
-              'visits',
-              JSON.stringify(arrList.value)
-            )
-          })
-        }
-        // 浏览记录
-        browsingInsert({
-          resourceId: res.data.data.id,
-        }).then(() => {
-          console.log('浏览记录+1')
-        })
-      })
-      associatedComponents.value.map((item, index) => {
-        let queryPartAppByKeyIdParams = {
-          keyId: id,
-        }
-        queryPartAppByKeyId2(queryPartAppByKeyIdParams).then((res) => {
-          associatedComponents.value[index].dataList = res.data.data
-          loading.value = false
-        })
-      })
-    } else if (obj) {
-      dataList.data = obj
-      console.log('预览==============', obj)
     }
-  }
-  init(id)
-  onBeforeUnmount(() => {
-    mybus.off('flyToView')
   })
+})
+
+const init = (id) => {
+  if (id) {
+    selectOne(id).then((res) => {
+      dataList.data = res.data.data
+      console.log('初始化详情页=========================>', dataList.data)
+      const arrList = ref([])
+      arrList.value = JSON.parse(window.sessionStorage.getItem('visits'))
+      if (arrList.value && arrList.value.indexOf(id) === -1) {
+        arrList.value.push(id)
+        updateVisits({
+          id: res.data.data.id,
+          visits: res.data.data.visits || '0',
+        }).then(() => {
+          window.sessionStorage.setItem(
+            'visits',
+            JSON.stringify(arrList.value)
+          )
+        })
+      }
+      // 浏览记录
+      browsingInsert({
+        resourceId: res.data.data.id,
+      }).then(() => {
+        console.log('浏览记录+1')
+      })
+    })
+  } else if (obj) {
+    dataList.data = obj
+    console.log('预览==============', obj)
+  }
+}
+init(id)
+onBeforeUnmount(() => {
+  mybus.off('flyToView')
+})
 </script>
 <style lang="less" scoped>
-  .fixed {
-    position: fixed;
-    z-index: 2000;
-    top: 0;
-    left: 50%;
-    margin-left: -9.56rem;
-  }
+.fixed {
+  position: fixed;
+  z-index: 2000;
+  top: 0;
+  left: 50%;
+  margin-left: -9.56rem;
+}
 
-  .fixed2 > div:nth-of-type(3) {
-    margin-top: 0.84rem;
-  }
+.fixed2>div:nth-of-type(3) {
+  margin-top: 0.84rem;
+}
 </style>
diff --git a/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelInputData.vue b/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelInputData.vue
new file mode 100644
index 00000000..f352d604
--- /dev/null
+++ b/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelInputData.vue
@@ -0,0 +1,108 @@
+<!--
+ * @Author: hisense.hucongqian
+ * @Date: 2022-12-01 08:56:28
+ * @LastEditors: hisense.hucongqian
+ * @LastEditTime: 2022-12-01 11:54:40
+ * @Description: 模型详情信息
+-->
+
+<template>
+  <!-- 信息  -->
+  <div class="usage-mode">
+    <div class="tltle">
+      <DetalsTitle :title="title" type="INFORMATION"></DetalsTitle>
+    </div>
+    <div class="content">
+      <div class="content-left">
+        {{ title }}
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import DetalsTitle from '@/views/detailsAll/components/DetalsTitle'
+import { ref, defineProps, watch } from 'vue'
+const iconImg = require('@/assets/detailsAll/layer-service/layer-icon.png')
+
+// 数据初始化
+const props = defineProps({
+  dataList: { type: Object, default: null },
+  title: { type: String, default: '' },
+})
+
+</script>
+
+<style lang="less" scoped>
+.usage-mode {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  padding: 0.8rem 0;
+
+  .content {
+    margin-top: 0.3rem;
+    display: flex;
+
+    .content-left {
+      height: 2.8rem;
+      background: url('~@/assets/detailsAll/layer-service/layer-bg.png');
+      background-size: 100% 100%;
+      background-repeat: no-repeat;
+      border-radius: 0.1rem;
+      box-shadow: 0rem 0.05rem 0.15rem rgba(82, 106, 255, 0.4);
+      display: flex;
+      align-items: center;
+      padding: 0 0.35rem;
+
+      .content-left-content {
+        width: 100%;
+        font-size: 0.2rem;
+        color: rgba(33, 41, 86, 0.8);
+        line-height: 0.2rem;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+
+        ul {
+          padding: 0;
+          margin: 0;
+        }
+
+        ul li {
+          list-style: none;
+          display: flex;
+          align-items: center;
+          margin-bottom: 0.3rem;
+          line-height: 0.25rem;
+        }
+
+        img {
+          margin: 0 0.2rem 0 0;
+          width: 0.15rem;
+          height: 0.15rem;
+        }
+
+        span {
+          font-size: 0.2rem;
+          color: #666666;
+          display: block;
+          margin-right: 0.5rem;
+          width: 120px;
+        }
+
+        p {
+          margin-bottom: 0;
+          font-size: 0.2rem;
+          color: #333333;
+          display: -webkit-box;
+          overflow: hidden;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
+          word-break: break-all;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelNavigation.vue b/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelNavigation.vue
new file mode 100644
index 00000000..97a5485d
--- /dev/null
+++ b/front/src/views/detailsAll/components/GovernanceModel/GovernanceModelNavigation.vue
@@ -0,0 +1,88 @@
+<!--
+ * @Description: 知识库--模型规则导航
+-->
+<template>
+  <div class="governance-navigation" v-if="navList.length > 0">
+    <template v-for="nav in navList" :key="nav.key">
+      <div class="nav" :class="{ select: nav.key == select }" @click="selectNav(nav.key)">
+        {{ nav.name }}
+        <span class="line"></span>
+      </div>
+    </template>
+  </div>
+</template>
+<script setup>
+import { ref, defineProps, watch, getCurrentInstance } from 'vue'
+import mybus from '@/myplugins/mybus'
+// 获取当前路由地址
+const navList = ref([
+  {
+    name: '输入数据',
+    key: 'governance-model-input-data',
+  },
+  {
+    name: '输出数据',
+    key: 'governance-model-output-data',
+  },
+  {
+    name: '详细规则',
+    key: 'governance-model-rule',
+  },
+])
+const select = ref('governance-model-input-data')
+
+const props = defineProps({
+  selectNow: { type: String, default: '' },
+  dataList: { type: Object, default: null },
+})
+
+watch(
+  () => props.selectNow,
+  (newValue) => {
+    select.value = newValue
+  }
+)
+console.log('selectNow------------>', props.selectNow);
+
+const selectNav = (key) => {
+  select.value = key
+  mybus.emit('flyToView', select.value)
+}
+
+</script>
+<style lang="less" scoped>
+.governance-navigation {
+  width: 1912px;
+  height: 84px;
+  line-height: 80px;
+  display: flex;
+  justify-content: space-around;
+  font-size: 24px;
+  color: #666;
+  background: #fff;
+  padding: 0 300px;
+  box-shadow: 0px 5px 10px #f2f3fb;
+  position: relative;
+
+  .nav {
+    cursor: pointer;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-between;
+    align-items: center;
+
+    .line {
+      width: 40px;
+      height: 4px;
+    }
+  }
+
+  .select {
+    color: #526aff;
+
+    .line {
+      background: #526aff;
+    }
+  }
+}
+</style>
diff --git a/front/src/views/home/details.vue b/front/src/views/home/details.vue
index 29f7ca71..69315a07 100644
--- a/front/src/views/home/details.vue
+++ b/front/src/views/home/details.vue
@@ -8,174 +8,107 @@
 <template>
   <div>
     <div id="apply-container">
-      <home-header :showView="showView" :target-flag = "targetFlag"></home-header>
+      <home-header :showView="showView" :target-flag="targetFlag"></home-header>
       <detail-back></detail-back>
       <div class="detail-content">
-          <details-view v-if="showView === 'details-view'"></details-view>
-      <algorithm-details
-        v-if="showView === 'algorithm-details'"
-      ></algorithm-details>
-      <application-details
-        v-else-if="showView === 'application-details'"
-      ></application-details>
-      <developer-components
-        v-else-if="showView === 'development-of-component'"
-      ></developer-components>
-      <business-details
-        v-else-if="showView === 'business-details'"
-      ></business-details>
-      <layer-service v-else-if="showView === 'layer-service'"></layer-service>
-      <governance-model v-else-if="showView === 'governance-model'"></governance-model>
-      <standard-doc v-else-if="showView === 'standard-doc'"></standard-doc>
+        <details-view v-if="showView === 'details-view'"></details-view>
+        <algorithm-details v-if="showView === 'algorithm-details'"></algorithm-details>
+        <application-details v-else-if="showView === 'application-details'"></application-details>
+        <developer-components v-else-if="showView === 'development-of-component'"></developer-components>
+        <business-details v-else-if="showView === 'business-details'"></business-details>
+        <layer-service v-else-if="showView === 'layer-service'"></layer-service>
+        <governance-model v-else-if="showView === 'governance-model'"></governance-model>
+        <standard-doc v-else-if="showView === 'standard-doc'"></standard-doc>
       </div>
       <home-footer></home-footer>
-     
+
     </div>
   </div>
 </template>
 
 <script>
-  import HomeHeader from '@/views/home/components/header'
-  import { defineComponent, reactive, ref } from 'vue'
-  import DetailsView from './components/DetailsView.vue'
-  import HomeFooter from '@/views/newHome/components/Footer'
-  // import Standard from "@/views/detailsAll/StandardDoc "
-  import AlgorithmDetails from '@/views/detailsAll/AlgorithmDetails'
-  import ApplicationDetails from '@/views/detailsAll/ApplicationDetails'
-  import DeveloperComponents from '@/views/detailsAll/DeveloperComponents'
-  import BusinessDetails from '@/views/detailsAll/BusinessDetails'
-  import LayerService from '@/views/detailsAll/LayerService'
-  import GovernanceModel from '@/views/detailsAll/GovernanceModel'
-  import StandardDoc from '@/views/detailsAll/StandardDoc'
-  import detailBack from '@/views/home/detailBack.vue'
-  import { selectOne } from '@/api/home'
-  import { useRouter } from 'vue-router'
-  export default defineComponent({
-    name: '',
-    props: {},
-    components: {
-      HomeHeader,
-      DetailsView,
-      HomeFooter,
-      AlgorithmDetails,
-      ApplicationDetails,
-      DeveloperComponents,
-      BusinessDetails,
-      LayerService,
-      detailBack,
-      StandardDoc,
-      GovernanceModel,
-      
-    },
-    setup() {
-      const formState = reactive({
-        applyRequire: '',
-        applyDept: '',
-        applyName: '',
-        applyPurpose: '',
-        applySystem: '',
-      })
+import HomeHeader from '@/views/home/components/header'
+import { defineComponent, reactive, ref } from 'vue'
+import DetailsView from './components/DetailsView.vue'
+import HomeFooter from '@/views/newHome/components/Footer'
+// import Standard from "@/views/detailsAll/StandardDoc "
+import AlgorithmDetails from '@/views/detailsAll/AlgorithmDetails'
+import ApplicationDetails from '@/views/detailsAll/ApplicationDetails'
+import DeveloperComponents from '@/views/detailsAll/DeveloperComponents'
+import BusinessDetails from '@/views/detailsAll/BusinessDetails'
+import LayerService from '@/views/detailsAll/LayerService'
+import GovernanceModel from '@/views/detailsAll/GovernanceModel'
+import StandardDoc from '@/views/detailsAll/StandardDoc'
+import detailBack from '@/views/home/detailBack.vue'
+import { selectOne } from '@/api/home'
+import { useRouter } from 'vue-router'
+export default defineComponent({
+  name: '',
+  props: {},
+  components: {
+    HomeHeader,
+    DetailsView,
+    HomeFooter,
+    AlgorithmDetails,
+    ApplicationDetails,
+    DeveloperComponents,
+    BusinessDetails,
+    LayerService,
+    detailBack,
+    StandardDoc,
+    GovernanceModel,
 
-      const options = ref([
-        {
-          value: '政法委',
-          label: '政法委',
-        },
-        {
-          value: '公安局',
-          label: '公安局',
-        },
-        {
-          value: '卫健委',
-          label: '卫健委',
-        },
-        {
-          value: '城市管理局',
-          label: '城市管理局',
-        },
-        {
-          value: '生态环境局',
-          label: '生态环境局',
-        },
-        {
-          value: '交通运输局',
-          label: '交通运输局',
-        },
-      ])
-      const router = useRouter()
-      const id = router.currentRoute.value.query.id
-      const obj = JSON.parse(window.sessionStorage.getItem('preview'))
-      let showView = ref('')
-      const targetFlag= ref(true)
-      const init = () => {
-        debugger
-        if (id) {
-          selectOne(id).then((res) => {
-            if (res.data.data.type == '组件服务') {
-             
-              let detection = res.data.data.infoList.filter(
-                (item) => item.attrType === '组件类型'
-              )[0]
-              if (detection) {
-                res.data.data.infoList.map((item) => {
-                  if (item.attrType == '组件类型') {
-                    switch (item.attrValue) {
-                      case '智能算法':
-                        showView.value = 'algorithm-details'
-                        break
-                      case '开发组件':
-                        showView.value = 'development-of-component'
-                        break
-                      case '业务组件':
-                        showView.value = 'business-details'
-                        break
-                      case '图层服务':
-                        showView.value = 'layer-service'
-                        break
-                      default:
-                        break
-                    }
-                  }
-                })
-              } else {
-                showView.value = 'algorithm-details'
-              }
-            } else if (res.data.data.type == '知识库') {
-             
-             let detection = res.data.data.infoList.filter(
-               (item) => item.attrType === '知识库类型'
-             )[0]
-             if (detection) {
-               res.data.data.infoList.map((item) => {
-                 if (item.attrType == '知识库类型') {
-                   switch (item.attrValue) {
-                    case '数据标准':
-                       showView.value = 'standard-doc'
-                       break
-                     case '治理模型':
-                       showView.value = 'governance-model'
-                       break
-                     default:
-                      showView.value = 'standard-doc'
-                       break
-                   }
-                 }
-               })
-             } else {
-               showView.value = 'standard-doc'
-             }
-           } else {
-              showView.value = 'standard-doc'
-            }
-          })
-        } else if (obj) {
-          console.log('obj============>', obj)
-          if (obj.type == '组件服务') {
-            let detection = obj.infoList.filter(
+  },
+  setup() {
+    const formState = reactive({
+      applyRequire: '',
+      applyDept: '',
+      applyName: '',
+      applyPurpose: '',
+      applySystem: '',
+    })
+
+    const options = ref([
+      {
+        value: '政法委',
+        label: '政法委',
+      },
+      {
+        value: '公安局',
+        label: '公安局',
+      },
+      {
+        value: '卫健委',
+        label: '卫健委',
+      },
+      {
+        value: '城市管理局',
+        label: '城市管理局',
+      },
+      {
+        value: '生态环境局',
+        label: '生态环境局',
+      },
+      {
+        value: '交通运输局',
+        label: '交通运输局',
+      },
+    ])
+    const router = useRouter()
+    const id = router.currentRoute.value.query.id
+    const obj = JSON.parse(window.sessionStorage.getItem('preview'))
+    let showView = ref('')
+    const targetFlag = ref(true)
+    const init = () => {
+      debugger
+      if (id) {
+        selectOne(id).then((res) => {
+          if (res.data.data.type == '组件服务') {
+            let detection = res.data.data.infoList.filter(
               (item) => item.attrType === '组件类型'
             )[0]
             if (detection) {
-              obj.infoList.map((item) => {
+              res.data.data.infoList.map((item) => {
                 if (item.attrType == '组件类型') {
                   switch (item.attrValue) {
                     case '智能算法':
@@ -198,24 +131,24 @@
             } else {
               showView.value = 'algorithm-details'
             }
-          }else  if (obj.type == '知识库') {
-            let detection = obj.infoList.filter(
-              (item) => item.attrType === '知识库类型'
-            )[0]
+          } else if (res.data.data.type == '知识库') {
+            let detection = res.data.data.infoList.find((item) => item.attrType === '知识库类型')
+            console.log('detection---ww--------->', detection);
             if (detection) {
-              obj.infoList.map((item) => {
+              res.data.data.infoList.map((item) => {
                 if (item.attrType == '知识库类型') {
                   switch (item.attrValue) {
-                     case '数据标准':
-                       showView.value = 'standard-doc'
-                       break
-                     case '治理模型':
-                       showView.value = 'governance-model'
-                       break
-                     default:
-                       break
-                   }
+                    case '数据标准':
+                      showView.value = 'standard-doc'
+                      break
+                    case '治理模型':
+                      showView.value = 'governance-model'
+                      break
+                    default:
+                      showView.value = 'standard-doc'
+                      break
                   }
+                }
               })
             } else {
               showView.value = 'standard-doc'
@@ -223,36 +156,96 @@
           } else {
             showView.value = 'standard-doc'
           }
+        })
+      } else if (obj) {
+        console.log('obj============>', obj)
+        if (obj.type == '组件服务') {
+          let detection = obj.infoList.filter(
+            (item) => item.attrType === '组件类型'
+          )[0]
+          if (detection) {
+            obj.infoList.map((item) => {
+              if (item.attrType == '组件类型') {
+                switch (item.attrValue) {
+                  case '智能算法':
+                    showView.value = 'algorithm-details'
+                    break
+                  case '开发组件':
+                    showView.value = 'development-of-component'
+                    break
+                  case '业务组件':
+                    showView.value = 'business-details'
+                    break
+                  case '图层服务':
+                    showView.value = 'layer-service'
+                    break
+                  default:
+                    break
+                }
+              }
+            })
+          } else {
+            showView.value = 'algorithm-details'
+          }
+        } else if (obj.type == '知识库') {
+          let detection = obj.infoList.filter(
+            (item) => item.attrType === '知识库类型'
+          )[0]
+          if (detection) {
+            obj.infoList.map((item) => {
+              if (item.attrType == '知识库类型') {
+                switch (item.attrValue) {
+                  case '数据标准':
+                    showView.value = 'standard-doc'
+                    break
+                  case '治理模型':
+                    showView.value = 'governance-model'
+                    break
+                  default:
+                    break
+                }
+              }
+            })
+          } else {
+            showView.value = 'standard-doc'
+          }
+        } else {
+          showView.value = 'standard-doc'
         }
       }
-      init()
-      
-      return {
-        formState,
-        options,
-        showView,
-        targetFlag,
-        init,
-        router,
-        id,
-      }
-    },
-  })
+    }
+    init()
+
+    return {
+      formState,
+      options,
+      showView,
+      targetFlag,
+      init,
+      router,
+      id,
+    }
+  },
+})
 </script>
 
-<style scoped lang="less"></style>
-<style>
-  html,
-  body {
-    height: unset;
-  }
-  #apply-container {
-    height: 100vh;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-  }
-   .detail-content{
-      margin-top:90px;
-    }
+<style scoped lang="less">
+
+</style>
+<style>
+html,
+body {
+  height: unset;
+}
+
+#apply-container {
+  height: 100vh;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-between;
+}
+
+.detail-content {
+  margin-top: 90px;
+}
 </style>