From 916ea5ecd266d8be82ce3f3cfc6446006132a193 Mon Sep 17 00:00:00 2001
From: wuhongjian <wuhongjian@hisense.com>
Date: Thu, 25 Aug 2022 19:06:53 +0800
Subject: [PATCH] =?UTF-8?q?bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 front/public/static/config/basicConfig.js     |   6 +-
 front/public/static/config/location.js        |   6 +-
 front/src/views/home/infrastructurePage.vue   |  90 +++++++-
 .../views/home/integrationServicesDetails.vue | 194 ++++++++++--------
 4 files changed, 198 insertions(+), 98 deletions(-)

diff --git a/front/public/static/config/basicConfig.js b/front/public/static/config/basicConfig.js
index 73869dc9..e8518f3e 100644
--- a/front/public/static/config/basicConfig.js
+++ b/front/public/static/config/basicConfig.js
@@ -2,13 +2,13 @@
  * @Author: hisense.wuhongjian
  * @Date: 2020-07-07 16:03:23
  * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-08-25 15:19:39
+ * @LastEditTime: 2022-08-25 17:19:45
  * @Description: 系统静态参数配置
  */
 var _global = {}
 var CONFIGITEM = {
-  // version: 'qingdao', //青岛
-  version: 'xihaian', // 西海岸
+  version: 'qingdao', //青岛
+  //version: 'xihaian', // 西海岸
   //version: 'dev', // 开发
   //version: 'test', // 测试
   //version: 'frp', // 内网穿透
diff --git a/front/public/static/config/location.js b/front/public/static/config/location.js
index 900c698e..bf3fed64 100644
--- a/front/public/static/config/location.js
+++ b/front/public/static/config/location.js
@@ -2,7 +2,7 @@
  * @Author: hisense.wuhongjian
  * @Date: 2020-07-07 16:03:23
  * @LastEditors: hisense.wuhongjian
- * @LastEditTime: 2022-08-25 14:06:25
+ * @LastEditTime: 2022-08-25 18:47:08
  * @Description: 数据资源参数配置
  */
 // eslint-disable-next-line no-undef
@@ -39,8 +39,8 @@ if (newLocation !== 'baotou' && newLocation !== 'xihaian') {
     // { name: '个人中心', key: 'personalCenter' },
     { name: '区市站点', key: 'mapTest' },
     // { name: '后台管理', key: 'houtaiguanli' },
-    { name: '典型赋能案例', key: 'assignCase' },
-    // { name: '融合服务', key: 'integrationServices' },
+    //  { name: '典型赋能案例', key: 'assignCase' },
+    { name: '融合服务', key: 'integrationServices' },
     { name: 'CIM专区', key: 'cimSpecialArea' },
   ]
   footerDataList.footerList = {
diff --git a/front/src/views/home/infrastructurePage.vue b/front/src/views/home/infrastructurePage.vue
index eb7001e0..57adcc91 100644
--- a/front/src/views/home/infrastructurePage.vue
+++ b/front/src/views/home/infrastructurePage.vue
@@ -93,7 +93,7 @@
             </a-space>
           </div>
         </div>
-        <div class="roomItem" v-for="(item, index) in roomList">
+        <div class="roomItem" v-for="item in roomList" :key="item.id">
           <div class="leftImg">
             <img
               :src="
@@ -442,7 +442,16 @@
             type="primary"
             @click="batchPreview"
             class="buttonAdd"
-            v-show="isXiHaiAn"
+            v-if="isXiHaiAn"
+          >
+            批量预览
+          </a-button>
+          <!-- 批量预览 -->
+          <a-button
+            type="primary"
+            @click="batchPicturePreview"
+            class="buttonAdd"
+            v-else
           >
             批量预览
           </a-button>
@@ -563,7 +572,41 @@
           <a-image :src="options.src" />
         </div>
       </a-modal>
-      <!-- 批量预览弹窗 -->
+      <!-- 批量预览图片弹窗 -->
+      <a-modal
+        wrapClassName="batch-preview-modal"
+        v-model:visible="batchPicVisible"
+        title="图片批量预览"
+        :width="1060"
+        destroyOnClose
+        @cancel="videoClean"
+      >
+        <template #footer></template>
+        <div class="batch-video">
+          <div
+            v-for="item in videoList"
+            :key="item.id"
+            style="width: 100%; height: 100%"
+          >
+            <p></p>
+            <a-image
+              width="100%"
+              height="100%"
+              :src="item.options.src"
+              fallback="data:image/png;base64,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"
+            />
+          </div>
+        </div>
+        <a-pagination
+          v-model:current="current"
+          :total="videoTotal"
+          defaultPageSize="4"
+          :showSizeChanger="false"
+          @change="batchPicturePreview"
+          show-less-items
+        />
+      </a-modal>
+      <!-- 批量预览视频弹窗 -->
       <a-modal
         wrapClassName="batch-preview-modal"
         v-model:visible="batchVisible"
@@ -723,9 +766,10 @@
     ], //显示所有按钮,
   })
   const videoList = ref([])
-  let visible = ref(false)
-  let picVisible = ref(false)
-  let batchVisible = ref(false)
+  let visible = ref(false) // 视频预览
+  let picVisible = ref(false) // 图片预览
+  let batchVisible = ref(false) // 视频批量预览
+  let batchPicVisible = ref(false) // 图片批量预览
   const jcssType = ref(router.currentRoute.value.query.type)
   const pagination = ref({
     total: 0,
@@ -1479,6 +1523,7 @@
       }
     }
   }
+  // 打开视频批量预览
   const batchPreview = async function (page) {
     if (page.layerX) {
       page = 1
@@ -1536,6 +1581,39 @@
       message.error('请选择需要预览的数据')
     }
   }
+  // 打开图片批量预览
+  const batchPicturePreview = async function (page) {
+    if (page.layerX) {
+      page = 1
+    }
+    if (selectedList.value.length > 0) {
+      videoTotal.value = selectedList.value.length
+      const arr = JSON.parse(JSON.stringify(selectedList.value))
+      let start = (page - 1) * 4
+      let list = []
+      list = arr.splice(start, 4)
+      const length = list.length
+      videoList.value = []
+      for (let index = 0; index < length; index++) {
+        const param = {
+          channelCode: list[index].channelId,
+        }
+        let ob = {
+          options: {
+            src: '', //图片源
+          },
+        }
+        selectByChannelCode(param).then((res) => {
+          ob.options.src = (res.data.data && res.data.data[0].picUrl) || ''
+          videoList.value.push(ob)
+        })
+      }
+      console.log('验证数据的准确性', videoList)
+      batchPicVisible.value = true
+    } else {
+      message.error('请选择需要预览的数据')
+    }
+  }
   // 清空
   const nullClick = () => {
     clickList.value[1].content = []
diff --git a/front/src/views/home/integrationServicesDetails.vue b/front/src/views/home/integrationServicesDetails.vue
index c792ace5..3f0f132f 100644
--- a/front/src/views/home/integrationServicesDetails.vue
+++ b/front/src/views/home/integrationServicesDetails.vue
@@ -1,7 +1,7 @@
 <!-- 融合服务详情 -->
 <template>
   <div class="IntegrationServicesDetails" :class="{ fixed2: scrollTop >= 600 }">
-  <home-header></home-header>
+    <home-header></home-header>
     <!-- 头部基本信息 -->
     <application-top-details
       :dataList="detailInfoObj"
@@ -25,89 +25,91 @@
     </div>
 
     <!-- 场景痛点 -->
-    <div
-      id="integration-pain-point"
-      class="pain-point scrollBox"
-    >
+    <div id="integration-pain-point" class="pain-point scrollBox">
       <div class="title-1">
         <DetalsTitle title="场景痛点" type="PAIN POINT"></DetalsTitle>
       </div>
       <div class="flex-row-center">
         <div class="bg"></div>
         <div class="content">
-          <div class="content-item" v-for="(item, i) in painPoint" :key="i">{{i+1}}.{{item.description}}</div>
+          <div class="content-item" v-for="(item, i) in painPoint" :key="i">
+            {{ i + 1 }}.{{ item.description }}
+          </div>
         </div>
       </div>
     </div>
 
     <!-- 解决方案 -->
-    <div
-      id="integration-solution"
-      class="solution scrollBox"
-    >
+    <div id="integration-solution" class="solution scrollBox">
       <div class="title-1">
         <DetalsTitle title="解决方案" type="SOLUTION"></DetalsTitle>
       </div>
       <div class="flex-row-center">
         <div class="content">
-          <div class="content-item" v-for="(item, i) in solution" :key="i">{{i+1}}.{{item.description}}</div>
+          <div class="content-item" v-for="(item, i) in solution" :key="i">
+            {{ i + 1 }}.{{ item.description }}
+          </div>
         </div>
       </div>
     </div>
 
     <!-- 使用能力 -->
-    <div
-      id="integration-ability"
-      class="ability scrollBox"
-    >
+    <div id="integration-ability" class="ability scrollBox">
       <div class="title-1">
         <DetalsTitle title="使用能力" type="ABILITY"></DetalsTitle>
       </div>
-        <div class="flex-row-center combine-content" v-for="(item, i) in combineList" :key="i">
-          <div class="title"></div>
-          <div>
-            <el-table
-              class="table"
-              :data="item.list"
-              stripe
-              :header-cell-style="{'text-align': 'center'}">
-              <el-table-column
-                prop="name"
-                label="数据"
-                align="center"
-                width="200"
-                show-overflow-tooltip="true">
-              </el-table-column>
-              <el-table-column
-                prop="dept"
-                label="能力来源"
-                align="center"
-                width="300"
-                show-overflow-tooltip="true">
-              </el-table-column>
-              <el-table-column
-                prop="platform"
-                label="申请平台"
-                align="center"
-                width="100"
-                show-overflow-tooltip="true">
-              </el-table-column>
-            </el-table>
-          </div>
+      <div
+        class="flex-row-center combine-content"
+        v-for="(item, i) in combineList"
+        :key="i"
+      >
+        <div class="title"></div>
+        <div>
+          <el-table
+            class="table"
+            :data="item.list"
+            stripe
+            :header-cell-style="{ 'text-align': 'center' }"
+          >
+            <el-table-column
+              prop="name"
+              label="数据"
+              align="center"
+              width="200"
+              show-overflow-tooltip="true"
+            ></el-table-column>
+            <el-table-column
+              prop="dept"
+              label="能力来源"
+              align="center"
+              width="300"
+              show-overflow-tooltip="true"
+            ></el-table-column>
+            <el-table-column
+              prop="platform"
+              label="申请平台"
+              align="center"
+              width="100"
+              show-overflow-tooltip="true"
+            ></el-table-column>
+          </el-table>
         </div>
+      </div>
     </div>
 
     <!-- 构建步骤 -->
-    <div
-      id="integration-step"
-      class="step scrollBox"
-    >
+    <div id="integration-step" class="step scrollBox">
       <div class="title-1">
         <DetalsTitle title="构建步骤" type="STEP"></DetalsTitle>
       </div>
       <div class="flex-row-center step-content">
         <el-steps direction="vertical" :space="150" :active="step.length">
-          <el-step v-for="(item, i) in step" :key="i" :title="item.question" :description="item.answer"></el-step>
+          <el-step
+            v-for="(item, i) in step"
+            :key="i"
+            :title="item.question"
+            :description="item.answer"
+          ></el-step>
         </el-steps>
       </div>
     </div>
@@ -131,7 +133,7 @@
   const domArr = ref([])
   const painPoint = ref([])
   const solution = ref([])
-  const step=ref([])
+  const step = ref([])
   const id = router.currentRoute.value.query.id
   document.documentElement.style.transition = 'all 0.3s ease'
   document.documentElement.scrollTop = 0
@@ -248,28 +250,48 @@
           attrType: '常见问题',
           attrValue: questionValue.attrValue || '[]',
         }
-        painPoint.value = JSON.parse(fuseAttrList.find((v) => v.attrType === '场景痛点').attrValue) || []
-        solution.value = JSON.parse(fuseAttrList.find((v) => v.attrType === '解决方案').attrValue) || []
-        step.value = JSON.parse(fuseAttrList.find((v) => v.attrType === '使用步骤').attrValue) || []
+        painPoint.value =
+          JSON.parse(
+            fuseAttrList.find((v) => v.attrType === '场景痛点').attrValue
+          ) || []
+        solution.value =
+          JSON.parse(
+            fuseAttrList.find((v) => v.attrType === '解决方案').attrValue
+          ) || []
+        step.value =
+          JSON.parse(
+            fuseAttrList.find((v) => v.attrType === '使用步骤').attrValue
+          ) || []
         let areaObj = {
           attrType: '应用领域',
-          attrValue: fuseAttrList.find((v) => v.attrType === '应用领域').attrValue,
+          attrValue: '',
         }
         combineList.value.forEach((item) => {
           let arr = []
-          let resource=fuseResourceList.filter((v)=>v.resource && v.type == item.title)
-          if(resource.length>0){
-            if(item.title==='基础设施'){
-              arr=resource.map(res=>({
-                id: res.resource.idtCameraChannel, name: res.resource.channelName, dept: res.resource.nodeName, platform: 'UCS'
+          let resource = fuseResourceList.filter(
+            (v) => v.resource && v.type == item.title
+          )
+          if (resource.length > 0) {
+            if (item.title === '基础设施') {
+              arr = resource.map((res) => ({
+                id: res.resource.idtCameraChannel,
+                name: res.resource.channelName,
+                dept: res.resource.nodeName,
+                platform: 'UCS',
               }))
-            }else if(item.title==='组件服务'){
-              arr=resource.map(res=>({
-                id: res.resource.id, name: res.resource.name, dept: res.resource.deptName, platform: 'UCS'
+            } else if (item.title === '组件服务') {
+              arr = resource.map((res) => ({
+                id: res.resource.id,
+                name: res.resource.name,
+                dept: res.resource.deptName,
+                platform: 'UCS',
               }))
-            }else if(item.title==='数据资源'){
-              arr=resource.map(res=>({
-                id: res.resource.zycode, name: res.resource.zyname, dept: res.resource.TGBM, platform: '共享交换平台'
+            } else if (item.title === '数据资源') {
+              arr = resource.map((res) => ({
+                id: res.resource.zycode,
+                name: res.resource.zyname,
+                dept: res.resource.TGBM,
+                platform: '共享交换平台',
               }))
             }
           }
@@ -461,21 +483,21 @@
     padding: 0.8rem 0;
     background: rgb(247, 248, 250);
     .bg {
-        height: 3rem;
-        width: 3rem;
-        background: url('~@/assets/home/rhfw_square.png') no-repeat;
-        background-size: 100%;
-        margin-top: 0.3rem;
+      height: 3rem;
+      width: 3rem;
+      background: url('~@/assets/home/rhfw_square.png') no-repeat;
+      background-size: 100%;
+      margin-top: 0.3rem;
     }
     .content {
-        overflow: auto;
-        height: 3rem;
-        width: 6rem;
-        margin-top: 0.3rem;
-        .content-item {
-          font-size: 16px;
-          margin: 0rem 0rem 0.1rem 0.1rem;
-        }
+      overflow: auto;
+      height: 3rem;
+      width: 6rem;
+      margin-top: 0.3rem;
+      .content-item {
+        font-size: 16px;
+        margin: 0rem 0rem 0.1rem 0.1rem;
+      }
     }
   }
 
@@ -483,11 +505,11 @@
     padding: 0.8rem 0;
     background: rgb(247, 248, 250);
     .content {
-        width: 9rem;
-        .content-item {
-          font-size: 16px;
-          margin: 0.3rem;
-        }
+      width: 9rem;
+      .content-item {
+        font-size: 16px;
+        margin: 0.3rem;
+      }
     }
   }
 
@@ -525,7 +547,7 @@
       }
       .table {
         width: 100%;
-        font-size: 16px
+        font-size: 16px;
       }
     }