分离西海岸基础设施

front/src/api/home.js

@@ -2,7 +2,7 @@
  * @Author: hisense.wuhongjian
  * @Date: 2022-04-01 19:19:40
  * @LastEditors: Light
- * @LastEditTime: 2022-10-31 15:52:57
+ * @LastEditTime: 2022-11-18 09:16:13
  * @Description: 告诉大家这是什么
  */
 import request from '@/utils/request'
@@ -526,3 +526,10 @@ export function getGisByArea(data) {
     data,
   })
 }
+export function getPolicyCloudService(params) {
+  return request({
+    url: '/resource/getPolicyCloudService',
+    method: 'get',
+    params,
+  })
+}

front/src/views/home/DetailsPageconetent.vue

@@ -1,4 +1,5 @@
 <template>
+  itShowQingDao
   <!-- 青岛 -->
   <div class="details-pageconetent" v-if="whoShow1 && whoShow1.itShowQingDao">
     <home-header></home-header>
@@ -22,13 +23,14 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
+          <button class="button-reset" @click="globalSearch()">全局搜索</button>
           <button
             class="button-reset"
-            @click="globalSearch()"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
           >
-            全局搜索
+            重置
           </button>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
           <button
             v-if="Cardsname == '应用资源'"
             class="button-reset"
@@ -169,13 +171,14 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
+          <button class="button-reset" @click="globalSearch()">全局搜索</button>
           <button
             class="button-reset"
-            @click="globalSearch()"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
           >
-            全局搜索
+            重置
           </button>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
           <div class="hengxian" style="background: transparent"></div>
         </div>
       </div>
@@ -229,13 +232,14 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
+          <button class="button-reset" @click="globalSearch()">全局搜索</button>
           <button
             class="button-reset"
-            @click="globalSearch()"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
           >
-            全局搜索
+            重置
           </button>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
           <div class="hengxian" style="background: transparent"></div>
         </div>
       </div>
@@ -302,7 +306,7 @@
       <detailsPageconetentTree />
     </div>
     <div class="details-pageconetent-left" v-else>
-      <detailsPageInfrastructureTree />
+      <detailsPageInfrastructureTreeXha />
     </div>
     <div class="top" v-if="Cardsname != '知识库' && Cardsname != '基础设施'">
       <div class="top-title">
@@ -335,7 +339,13 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
+          >
+            重置
+          </button>
           <div class="hengxian"></div>
         </div>
       </div>
@@ -445,7 +455,7 @@
         </div>
       </div>
       <div class="top-content-father">
-        <infrastructurePage
+        <infrastructurePageXha
           ref="camera"
           :searchValue="searchValue"
           :searchType="searchType"
@@ -483,7 +493,13 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
+          >
+            重置
+          </button>
         </div>
       </div>
       <KnowledgeBase
@@ -541,7 +557,13 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
-          <button class="button-reset" style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
+          >
+            重置
+          </button>
           <div class="hengxian"></div>
         </div>
       </div>
@@ -707,7 +729,13 @@
             class="resultListSearchInput"
           />
           <i class="searchImg" aria-hidden="true"></i>
-          <button class="button-reset"  style="margin-left: 0.1rem;" @click="chongzhi()">重置</button>
+          <button
+            class="button-reset"
+            style="margin-left: 0.1rem"
+            @click="chongzhi()"
+          >
+            重置
+          </button>
         </div>
       </div>
       <KnowledgeBase
@@ -747,7 +775,9 @@
   import DetailsPageResource from '@/views/home/components/DetailsPageResource.vue'
   // 基础设施引用
   import infrastructurePage from '@/views/home/infrastructurePage.vue'
+  import infrastructurePageXha from '@/views/home/infrastructurePageXha.vue'
   import detailsPageInfrastructureTree from '@/views/home/detailsPageInfrastructureTree.vue'
+  import detailsPageInfrastructureTreeXha from '@/views/home/detailsPageInfrastructureTreeXha.vue'
   import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
   import { useStore } from 'vuex'
   import { message } from 'ant-design-vue'
@@ -1907,7 +1937,9 @@
       KnowledgeBase,
       DetailsPageResource,
       infrastructurePage,
+      infrastructurePageXha,
       detailsPageInfrastructureTree,
+      detailsPageInfrastructureTreeXha,
     },
     beforeUnmount() {
       mybus.off('getCameraByParentId')

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

@@ -0,0 +1,102 @@
+<!--
+ * @Author: Light
+ * @Date: 2022-11-16 16:46:16
+ * @LastEditors: Light
+ * @LastEditTime: 2022-11-17 09:46:45
+ * @Description: 政务云资源列表
+-->
+<template>
+  <div class="top">
+    <div>检索结果：60项</div>
+    <div>
+      使用声明:
+      附加增值服务，委办局单位可以根据自身需求，按需采购，由采购单位付费。
+    </div>
+  </div>
+  <div class="bottom">
+    <div class="left"></div>
+    <div class="right">
+      <div class="title">
+        <div>
+          <div class="name">云主机</div>
+          <div class="type">基础服务</div>
+        </div>
+        <div>年份：2022</div>
+      </div>
+      <div class="text">云主机配置</div>
+      <div class="info">
+        <div>一级条目：主机服务</div>
+        <div>规格：1H2G</div>
+      </div>
+    </div>
+  </div>
+</template>
+<script setup></script>
+<style lang="less" scoped>
+  .top {
+    display: flex;
+    justify-content: space-between;
+    color: #333;
+    padding-bottom: 10px;
+    border-bottom: 1px #ccc solid;
+  }
+  .bottom {
+    margin-top: 20px;
+    padding-bottom: 20px;
+    display: flex;
+    justify-content: flex-start;
+    align-items: center;
+    border-bottom: 1px #ccc solid;
+    .left {
+      width: 110px;
+      height: 110px;
+      background: url('~@/assets/home/znsf_square.png') no-repeat;
+      background-size: 100%;
+    }
+    .right {
+      flex: 1;
+      margin-left: 20px;
+      .title {
+        display: flex;
+        justify-content: space-between;
+        div:nth-of-type(1) {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          .name {
+            max-width: 400px;
+            height: 22px;
+            line-height: 24px;
+            overflow: hidden; //超出的文本隐藏
+            display: -webkit-box;
+            -webkit-line-clamp: 1; // 超出多少行
+            -webkit-box-orient: vertical;
+            font-size: 20px;
+            font-weight: 600;
+          }
+          .type {
+            margin-left: 10px;
+            padding: 1px 5px;
+            color: rgba(0, 88, 225, 0.8);
+            background-color: rgba(0, 135, 225, 0.1);
+            border-radius: 15px;
+          }
+        }
+      }
+      .text {
+        height: 50px;
+        overflow: hidden; //超出的文本隐藏
+        display: -webkit-box;
+        -webkit-line-clamp: 2; // 超出多少行
+        -webkit-box-orient: vertical;
+      }
+      .info {
+        display: flex;
+        justify-content: flex-start;
+        div:nth-of-type(1) {
+          margin-right: 50px;
+        }
+      }
+    }
+  }
+</style>

front/src/views/home/detailsPageInfrastructureTreeXha.vue

@@ -0,0 +1,336 @@
+<template>
+  <div class="wrapper">
+    <div class="wrapper-title-left-tree" :key="showKey">
+      <div v-for="item in treeData" :key="item.id" class="primaryNode">
+        <div class="top" @click="showBottom(item)" :class="item.show ? 'topSelect' : ''">
+          {{ item.name }}
+          ({{ item.channelCount }})
+          <DownOutlined v-show="!item.show" />
+          <UpOutlined v-show="item.show" />
+        </div>
+        <div class="bottom" v-show="item.show">
+          <div v-for="val in item.children" :key="val.id" class="item">
+            <div class="up" :class="selectId == val.id ? 'select' : ''"
+              @click="showDown(item, val), onSelect(item, val)">
+              <div>
+                <svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                  xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
+                  v-show="selectId == val.id">
+                  <path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
+                </svg>
+                <span class="name">{{ val.name }}({{ val.channelCount }})</span>
+              </div>
+              <span v-if="item.children.length < 0">{{ val.total }}</span>
+              <span v-else>
+                <down-outlined v-show="!val.show" />
+                <up-outlined v-show="val.show" />
+              </span>
+            </div>
+            <div class="down" v-show="val.show">
+              <div v-for="child in val.children" :key="child.id" class="child"
+                :class="selectId == child.id ? 'select2' : ''" @click="onSelect(item, child, child)">
+                <div>
+                  <svg t="1654068878091" class="icon" viewBox="0 0 1024 1024" version="1.1"
+                    xmlns="http://www.w3.org/2000/svg" p-id="2156" width="0.25rem" height="0.25rem"
+                    v-show="selectId == child.id">
+                    <path d="M512 624a112 112 0 1 0 0-224 112 112 0 0 0 0 224z" p-id="2157" fill="#0058e1"></path>
+                  </svg>
+                  <span class="name">
+                    {{ child.name }}
+                  </span>
+                </div>
+                <span>{{ child.channelCount }}</span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+<script>
+import { defineComponent, ref, watch } from 'vue'
+import { getCameraAllOrgan } from '@/api/videoSurveillance'
+import { getCameraInfoByAreaId } from '@/api/file'
+import mybus from '@/myplugins/mybus'
+import { useRouter } from 'vue-router'
+import { UpOutlined, DownOutlined } from '@ant-design/icons-vue'
+import { DETAIL_PAGE_CONTENT_DEFAULT_TAB } from '@/global/GlobalConfig.js'
+
+export default defineComponent({
+  setup() {
+    const router = useRouter()
+    const whoShow1 = ref(whoShow)
+    const showKey = ref(0)
+    const treeData = ref([])
+    const selectId = ref('')
+
+    // 初始化
+    const init = async () => {
+      treeData.value = []
+      console.log(
+        'router.currentRoute.value.query.select',
+        router.currentRoute.value.query.select
+      )
+      let select = router.currentRoute.value.query.select || DETAIL_PAGE_CONTENT_DEFAULT_TAB
+      if (select === '123') {
+        select = ''
+      }
+      console.log(
+        '获取url中的select=====================>',
+        router.currentRoute.value.query.select
+      )
+      if (select == '基础设施') {
+        let res = {};
+        if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
+          res = await getCameraAllOrgan({ parentId: 'S4NbecfYB1DBH8HNULGS34' })
+        } else {
+          // 西海岸
+          res = await getCameraInfoByAreaId({
+            areaId: '70be8c5b664f4bcf869d82f2e8335051',
+          })
+        }
+        treeData.value = res.data && res.data.data || []
+        // 只有一个，默认展开到二级菜单
+        if(res.data && res.data.data.length == 1) {
+          showBottom(treeData.value[0])
+        }
+      }
+    }
+    mybus.on('getDeptList', () => {
+      init()
+    })
+
+    const onSelect = async (item, val, child) => {
+      console.log('item--------onSelect---->', item);
+      console.log('val------onSelect------>', val);
+      console.log('child-----onSelect------->', child);
+      mybus.emit('getCameraByParentId', val.id)
+      mybus.emit('getListByParentId', val.id)
+      let res = {}
+      if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
+        res = await getCameraAllOrgan({ parentId: val.id })
+      } else {
+        // 西海岸
+        res = await getCameraInfoByAreaId({ areaId: val.id })
+      }
+      treeData.value.map((treeDataItem, index) => {
+        if (item.id == treeDataItem.id) {
+          treeData.value[index].children.map((childItem, childIndex) => {
+            if (childItem.id == val.id) {
+              treeData.value[index].children[childIndex].children =
+                res.data.data
+            }
+          })
+        }
+      })
+      if (child) {
+        selectId.value = child.id
+      }
+    }
+
+    watch(selectId, (newVal) => {
+      if (newVal == '') {
+        mybus.emit('getCameraByParentId', '')
+        mybus.emit('getListByParentId', '')
+      }
+    })
+
+    const showBottom = async (item) => {
+      item.show = !item.show;
+      let res = {};
+      if (whoShow1.value && !whoShow1.value.itShowXiHaiAn) {
+        res = await getCameraAllOrgan({ parentId: item.id })
+      } else {
+        // 西海岸
+        res = await getCameraInfoByAreaId({ areaId: item.id })
+      }
+
+      treeData.value.map((treeDataItem, index) => {
+        if (item.id == treeDataItem.id) {
+          treeData.value[index].children = res.data && res.data.data || []
+          console.log('treeData.value.[index]', treeData.value[index])
+        }
+      })
+    }
+    const showDown = (item, val) => {
+      selectId.value = val.id
+      console.log('item---showDown--------->', item);
+      console.log('val----showDown-------->', val);
+      if (item.children) {
+        val.show = !val.show;
+        // 取消选中
+        if (!val.show) {
+          selectId.value = ''
+        }
+      }
+    }
+    return {
+      treeData,
+      showKey,
+      onSelect,
+      showBottom,
+      showDown,
+      selectId,
+    }
+  },
+  beforeUnmount() {
+    mybus.off('getDeptList')
+    console.log('getDeptList销毁~~~~~~~~~~~~~~~~~~~')
+  },
+  components: {
+    UpOutlined,
+    DownOutlined,
+  },
+})
+</script>
+<style lang="less" scoped>
+.primaryNode {
+  .top {
+    width: 100%;
+    height: 0.4rem;
+    background: rgba(0, 135, 225, 0.1);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 0 0.1rem;
+    margin-top: 0.08rem;
+  }
+
+  .top:hover {
+    cursor: pointer;
+    // 0058e1 透明度 0.5
+    background: rgba(0, 88, 225, 0.8);
+    color: white;
+
+    :deep(.anticon) {
+      color: white;
+    }
+  }
+
+  .topSelect {
+    background: #0058e1;
+    color: white;
+
+    :deep(.anticon) {
+      color: white;
+    }
+  }
+
+  .bottom {
+    width: 100%;
+    background: rgba(244, 245, 248, 0.8);
+    padding: 0 0.1rem;
+
+    // margin-bottom: .08rem;
+    .up {
+      cursor: pointer;
+      height: 0.4rem;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      border-top: 0.01rem solid #ccc;
+      padding: 0 0.1rem;
+
+      &>div {
+        display: flex;
+        justify-content: flex-start;
+      }
+
+      .name {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        display: -webkit-box;
+        -webkit-line-clamp: 1;
+        -webkit-box-orient: vertical;
+        word-break: break-all;
+      }
+    }
+
+    .up:hover {
+      .name {
+        color: #0058e1;
+        font-weight: 600;
+      }
+
+      span {
+        color: #0058e1;
+        font-weight: 600;
+      }
+    }
+
+    .select {
+      padding: 0 0.1rem 0 0;
+
+      .name {
+        width: 1.7rem;
+        color: #0058e1 !important;
+        font-weight: 600;
+      }
+
+      span {
+        color: #0058e1;
+        font-weight: 600;
+      }
+    }
+
+    .item:nth-of-type(1) .up {
+      border-top: none;
+    }
+
+    .down {
+      width: 100%;
+
+      .child {
+        cursor: pointer;
+        height: 0.4rem;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        padding: 0 0.1rem;
+
+        &>div {
+          display: flex;
+          justify-content: flex-start;
+        }
+
+        .name {
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-line-clamp: 1;
+          -webkit-box-orient: vertical;
+          word-break: break-all;
+        }
+      }
+
+      .child:hover {
+        .name {
+          color: #0058e1;
+          font-weight: 600;
+        }
+
+        span {
+          color: #0058e1;
+          font-weight: 600;
+        }
+      }
+
+      .select2 {
+        .name {
+          width: 1.7rem;
+          color: #0058e1;
+          font-weight: 600;
+        }
+
+        span {
+          color: #0058e1;
+          font-weight: 600;
+        }
+
+        padding: 0 0.1rem 0 0;
+      }
+    }
+  }
+}
+</style>

front/src/views/home/infrastructurePage.vue

@@ -560,6 +560,12 @@
           @change="handleMeeting"
         ></a-table>
       </div>
+      <div
+        class="infrastructrue-table"
+        v-if="!wrjFlag && selectType == '政务云资源'"
+      >
+        <GovernmentCloudResources></GovernmentCloudResources>
+      </div>
       <!-- 西海岸-无人机、单兵设备 -->
       <div class="infrastructrue-table" v-else-if="isXiHaiAn && wrjFlag">
         <a-table
@@ -771,20 +777,10 @@
 </template>
 <script setup>
   import VideoSurveillance from '@/views/home/videoSurveillance'
+  import GovernmentCloudResources from './components/GovernmentCloudResources'
   import { useRouter } from 'vue-router'
-  import { message, Upload } from 'ant-design-vue'
-  import {
-    ref,
-    reactive,
-    onMounted,
-    defineProps,
-    watch,
-    defineComponent,
-    nextTick,
-    defineExpose,
-    computed,
-  } from 'vue'
-  import { getUser, getEnkeUsers } from '@/api/home'
+  import { message } from 'ant-design-vue'
+  import { ref, reactive, onMounted, defineProps, defineExpose } from 'vue'
   import { initiateMeet } from '@/api/file'
   import {
     getCameraByParentId,
@@ -794,17 +790,18 @@
   } from '@/api/videoSurveillance'
   import { getCameraByCondition } from '@/api/file'
   import {
+    getUser,
+    getEnkeUsers,
     sgcInsert,
-    xhaAddCart,
     getRoomSearch,
     getDate,
     setSubmit,
     getYuyue,
     getSoldierList,
     getMaxApplyNum,
+    getPolicyCloudService,
   } from '@/api/home'
   import mybus from '@/myplugins/mybus'
-  import dayjs from 'dayjs'
   import { Form } from 'ant-design-vue'
   import moment from 'moment'
   import { useStore } from 'vuex'
@@ -1123,7 +1120,7 @@
   let clickList = ref([]) //存储点击的tab
   if (!isXiHaiAn) {
     tabList.value.push({
-      title: '城市云脑会客厅',
+      title: '筛选条件',
       content: [],
     })
   }
@@ -1580,7 +1577,7 @@
         dataSource2.value = []
         pagination.value.total = 0
         if (tabList.value[1]) {
-          tabList.value[1].title = '政务云资源分类'
+          tabList.value[1].title = '服务类别'
         }
         selectType.value = '政务云资源'
       } else if (name == '感知资源') {
@@ -1604,10 +1601,12 @@
         }
         selectType.value = '视频会议'
       }
+      if (indexFather !== 0 && selectType.value !== '政务云资源') {
         clickList.value[indexFather].content.splice(
           clickList.value[indexFather].content.indexOf(name),
           1
         )
+      }
     } else {
       if (name == '视频资源') {
         selectType.value = '视频资源'
@@ -1661,17 +1660,21 @@
         }
         clickList.value[indexFather].content[0] = name
         if (tabList.value[1]) {
-          tabList.value[1].title = '政务云资源分类'
+          if (!isXiHaiAn) {
+            tabList.value[1].title = '服务类别'
             tabList.value[1].content = [
-            '云主机',
-            '算力主机',
-            '对象存储',
-            '堡垒机',
-            '防火墙',
-            '网闸',
-            '负载均衡',
-            '公网IP',
+              '基础服务',
+              'PaaS服务',
+              '安全服务',
+              '大数据服务',
+              '附加增值服务',
             ]
+          } else {
+            if (tabList.value[1]) {
+              tabList.value[1].title = ''
+              tabList.value[1].content = []
+            }
+          }
         }
         room.value = true
         wrjFlag.value = false
@@ -1738,11 +1741,51 @@
         emits('add', 6)
         searchData()
       } else {
-        if (clickList.value[indexFather]) {
+        if (
+          clickList.value[indexFather] &&
+          (clickList.value[0].content[0] !== '政务云资源' || indexFather !== 1)
+        ) {
           clickList.value[indexFather].content.push(name)
         }
       }
     }
+    // 市局添加政务云资源
+    console.log(
+      '点击==========>',
+      indexFather,
+      name,
+      clickList.value,
+      clickList.value[0].content[0],
+      clickList.value[indexFather].content.indexOf(name)
+    )
+    if (!isXiHaiAn && indexFather == 0 && name == '政务云资源') {
+      getGovernmentCloud()
+    }
+    if (
+      clickList.value[0].content[0] === '政务云资源' &&
+      name !== '政务云资源'
+    ) {
+      console.log(
+        '点击政务云资源',
+        clickList.value[1].content[0],
+        clickList.value[indexFather].content.indexOf(name) !== -1
+      )
+      if (clickList.value[indexFather].content.indexOf(name) !== -1) {
+        console.log(
+          '点击政务云资源点击过',
+          clickList.value[indexFather].content[0]
+        )
+        clickList.value[indexFather].content.splice(
+          clickList.value[indexFather].content.indexOf(name),
+          1
+        )
+      } else {
+        clickList.value[indexFather].content = [name]
+      }
+      if (!isXiHaiAn) {
+        getGovernmentCloud()
+      }
+    }
     // 改变查询摄像头接口的labelCode数组
     mapSearchParam.value.labelCodes = []
     if (clickList.value[1]) {
@@ -2106,18 +2149,11 @@
   //加入申购车
   const addShoppingCart = () => {
     if (selectedList.value.length > 0) {
-      let _arr = []
-      selectedList.value.map((v) => {
-        _arr.push({
+      sgcInsert({
         delFlag: '0',
-          resourceId: v.idtCameraChannel,
-          note1: [v],
-        })
-      })
-      xhaAddCart(_arr).then((res) => {
-        if (res.data.code !== 0) {
-          return message.error(res.data.msg)
-        }
+        resourceld: '8888888880000000001',
+        note1: selectedList.value,
+      }).then((res) => {
         message.success('添加申购车成功！')
         mybus.emit('getSgcNum')
       })
@@ -2277,7 +2313,11 @@
     } else {
     }
   }
-
+  const getGovernmentCloud = () => {
+    getPolicyCloudService().then((res) => {
+      console.log('获取政务云资源======》', res.data.data)
+    })
+  }
   // 切换tab
   const handleTableChange = (val) => {
     pagination.value.current = val.current