视频联调

src/views/VisualDisplay/src/api/index.ts

@@ -239,4 +239,11 @@ export const GetSelectSydList = async (data:any) => {
     url: `/kshzs/zsxx/selectSydList`,
     data
   })
+}
+// 视频
+export const GetSelectSpList = async (data:any) => {
+  return await request.post({
+    url: `/kshzs/zsxx/selectSpList`,
+    data
+  })
 }

src/views/VisualDisplay/src/pages/cf/index.vue

@@ -281,13 +281,19 @@
                     <!-- <el-table-column prop="jsdj" label="结算单价（元）" align="center" /> -->
                     <el-table-column prop="cch" label="车船号" align="center" />
                     <el-table-column prop="cfhw" label="仓房货位" align="center" />
-                    <el-table-column prop="crklx" label="出入库类型" align="center" />
-                    <el-table-column
-                      prop="zzmd"
-                      label="附件个数（个）"
-                      width="160"
-                      align="center"
-                    />
+                    <el-table-column prop="crklx" label="出入库类型" align="center">
+                      <template #default="scope">
+                        <span v-if="scope.row.crklx == 0">出库</span>
+                        <span v-if="scope.row.crklx == 1">入库</span>
+                      </template>
+                    </el-table-column>
+                    <el-table-column prop="fileIds" label="附件个数" width="160" align="center">
+                      <template #default="scope">
+                        <span class="fjBtn" @click="openFiles(scope.row.fileList)">{{
+                          scope.row.fileIds
+                        }}</span>
+                      </template>
+                    </el-table-column>
                   </el-table>
                   <el-pagination
                     @size-change="handleSizeChange"
@@ -334,144 +340,100 @@
                         <span v-if="!scope.row.sfhg && scope.row.sfhg !== 0">-</span>
                       </template>
                     </el-table-column>
-                    <el-table-column prop="zzmd" label="纸质码单" align="center" />
+                    <el-table-column prop="zzmd" label="附件个数" align="center" />
                   </el-table>
                 </el-scrollbar>
               </div>
             </div>
             <div v-if="tabPosition == 'wsdjc'">
-              <el-scrollbar style="height: 600px">
-                <!-- <div class="radiobox">
+              <!-- <div class="radiobox">
                   <el-radio-group @change="zhijianInfo" v-model="wensdRadio">
                     <el-radio-button label="01" value="01">列表信息</el-radio-button>
                     <el-radio-button label="02" value="02">图文信息</el-radio-button>
                   </el-radio-group>
                 </div> -->
-                <div v-if="wensdRadio == '01'">
-                  <el-form class="formstyletwo" ref="form" :model="wensdform" label-width="200px">
-                    <el-row>
-                      <el-col :span="8">
-                        <el-form-item label="仓廒名称">
-                          <el-input v-model="wensdform.camc" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食品种">
-                          <el-input v-model="wensdform.lspzmc" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
+              <div>
+                <el-form class="formstyletwo" ref="form" :model="wensdform" label-width="200px">
+                  <el-row :gutter="30">
+                    <el-col :span="8">
+                      <el-form-item label="仓廒名称">
+                        <el-input v-model="wensdform.camc" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="粮食品种">
+                        <el-input v-model="wensdform.lspzmc" />
+                      </el-form-item>
+                    </el-col>
+                    <!-- <el-col :span="8">
                         <el-form-item label="粮食性质">
                           <el-input v-model="wensdform.lsxzmc" />
                         </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食等级">
-                          <el-input v-model="wensdform.lsdjmc" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食数量（吨）">
-                          <el-input v-model="wensdform.kcsl" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="仓房外温（℃）">
-                          <el-input v-model="wensdform.cfww" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="仓房外湿（%）">
-                          <el-input v-model="wensdform.cfws" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="仓房内温（℃）">
-                          <el-input v-model="wensdform.cfnw" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="仓房内湿（%）">
-                          <el-input v-model="wensdform.cfns" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食最高温（℃）">
-                          <el-input v-model="wensdform.lszgw" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食最低温（℃）">
-                          <el-input v-model="wensdform.lszdw" />
-                        </el-form-item>
-                      </el-col>
-                      <el-col :span="8">
-                        <el-form-item label="粮食平均温（℃）">
-                          <el-input v-model="wensdform.lspjw" />
-                        </el-form-item>
-                      </el-col>
-                    </el-row>
-                  </el-form>
-                  <div v-if="0">
-                    <el-scrollbar style="height: 500px">
-                      <div
-                        class="resettablewrap"
-                        v-for="(cengitem, cengindex) in wensdform.wsdjhList"
-                        :key="cengindex"
-                      >
-                        <h3><i></i>{{ cengitem.cs }}</h3>
-                        <el-table
-                          :data="cengitem.hangList"
-                          style="width: 100%; margin-bottom: 20px; overflow-x: hidden"
-                          :header-cell-class-name="'headerBg'"
-                          :row-class-name="tableRowClassName"
-                        >
-                          <el-table-column prop="xulie" label="列号行号" align="center" />
-                          <el-table-column
-                            v-for="(childItem, childIndex) in cengitem.lie"
-                            :property="'lie' + childItem"
-                            :key="childIndex"
-                            :label="childItem + '列'"
-                            align="center"
-                          />
-                        </el-table>
+                      </el-col> -->
+                    <el-col :span="8">
+                      <el-form-item label="粮食等级">
+                        <el-input v-model="wensdform.lsdjmc" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="粮食数量（吨）">
+                        <el-input v-model="wensdform.kcsl" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="仓房外温（℃）">
+                        <el-input v-model="wensdform.cfww" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="仓房外湿（%）">
+                        <el-input v-model="wensdform.cfws" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="仓房内温（℃）">
+                        <el-input v-model="wensdform.cfnw" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="仓房内湿（%）">
+                        <el-input v-model="wensdform.cfns" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="粮食最高温（℃）">
+                        <el-input v-model="wensdform.lszgw" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="粮食最低温（℃）">
+                        <el-input v-model="wensdform.lszdw" />
+                      </el-form-item>
+                    </el-col>
+                    <el-col :span="8">
+                      <el-form-item label="粮食平均温（℃）">
+                        <el-input v-model="wensdform.lspjw" />
+                      </el-form-item>
+                    </el-col>
+                  </el-row>
+                  <el-row :gutter="30">
+                    <el-col :span="8" v-for="(item, index) in wensdform.fileList" :key="index">
+                      <div class="image_preview">
+                        <el-image
+                          style="width: 100%; height: 100%"
+                          :src="item.slice(1, item.length)"
+                          :zoom-rate="1.2"
+                          :max-scale="7"
+                          :min-scale="0.2"
+                          :preview-src-list="[item.slice(1, item.length)]"
+                          show-progress
+                          fit="contain"
+                        />
                       </div>
-                    </el-scrollbar>
-                  </div>
-                </div>
-                <div v-else>
-                  <div class="pfcbox">
-                    <!-- 遍历行，加上左间距 -->
-                    <div
-                      v-for="(hangitem, hangindex) in wensdform.wsdjhList[0].hangList.length"
-                      :key="hangindex"
-                      class="pfc-div"
-                      :style="{
-                        margin: `${hangindex * 40}px 0 0 ${hangindex * 30}px`
-                      }"
-                    >
-                      <ul class="pfc-ul">
-                        <!-- 遍历每行下面的列，展示柱子 -->
-                        <li
-                          v-for="(lieItem, lieIndex) in wensdform.wsdjhList[0].lie"
-                          :key="lieIndex"
-                        >
-                          <div class="zhut">
-                            <!-- 遍历层，展示每层的数据 -->
-                            <i
-                              v-for="(cengItem, cengIndex) in wensdform.wsdjhList"
-                              :key="cengIndex"
-                            >
-                              {{ cengItem.hangList[hangindex][`lie${lieIndex + 1}`] }}
-                            </i>
-                          </div>
-                        </li>
-                      </ul>
-                    </div>
-                  </div>
-                  <!-- <img src="../../assets/images/3Dcs1.png" style="width:100%"/> -->
-                </div>
-              </el-scrollbar>
+                    </el-col>
+                  </el-row>
+                </el-form>
+              </div>
             </div>
             <div v-if="tabPosition == 'sy'">
               <el-scrollbar style="height: 600px">
@@ -492,11 +454,11 @@
                         {{ scope.$index + 1 }}
                       </template>
                     </el-table-column> -->
-                    <el-table-column prop="cksj" label="出库时间" width="120" align="center">
+                    <!-- <el-table-column prop="cksj" label="出库时间" width="120" align="center">
                       <template #default="scope">
                         {{ scope.row.cksj ? scope.row.cksj.slice(0, 10) : '' }}
                       </template>
-                    </el-table-column>
+                    </el-table-column> -->
                     <el-table-column prop="rkjz" label="入库净重(吨)" align="center" />
                     <el-table-column prop="rksf" label="入库水分(%)" align="center" />
                     <el-table-column prop="rkzz" label="入库杂质(吨)" align="center" />
@@ -536,6 +498,37 @@
         </div>
       </el-col>
     </el-row>
+
+    <div class="dialog_file">
+      <el-dialog title="" v-model="Dialogfiles" width="1050px" top="15vh">
+        <template #header="{}">
+          <div class="dialog_title">
+            <span class="dialog_title_text">附件列表</span>
+          </div>
+        </template>
+        <el-scrollbar style="height: 600px">
+          <el-row style="height: 600px;padding:15px">
+            <el-col :span="12" v-for="(item, index) in fileList" :key="index">
+              <!-- <img :src="item" alt="附件图片"/>
+             -->
+              <div class="image_preview">
+                <el-image
+                  style="width: 100%; height: 100%"
+                  :src="item"
+                  :zoom-rate="1.2"
+                  :max-scale="7"
+                  :min-scale="0.2"
+                  :preview-src-list="[item]"
+                  show-progress
+                  fit="contain"
+                />
+              </div>
+            </el-col>
+            <!-- <el-col :span="12">图片</el-col> -->
+          </el-row>
+        </el-scrollbar>
+      </el-dialog>
+    </div>
   </div>
 </template>
 
@@ -548,6 +541,7 @@ defineOptions({ name: 'DisplayCf' })
 
 const router = useRouter() // 路由对象
 const route = useRoute() // 路由接收对象
+const Dialogfiles = ref(false)
 const xzqhList = ref([])
 const cangName = ref('')
 const wensdRadio = ref('01')
@@ -585,10 +579,23 @@ const baseformhw = ref({
   // hth: 'xx',
   // jgsl: 'xx'
 })
-const wensdform = ref({})
+const wensdform = ref({
+  // camc: '',
+  // lspzmc: '',
+  // lsxzmc: '',
+  // lsdjmc: '',
+  // kcsl: '',
+  // cfww: '',
+  // cfws: '',
+  // cfnw: '',
+  // cfns: '',
+  // lszgw: '',
+  // lszdw: '',
+  // lspjw: ''
+})
 const searchform = ref({
   ywrq: '',
-  crklx: 0 //（0出库，1入库）
+  crklx: 1 //（0出库，1入库）
 })
 const crkLxOptions = ref([
   {
@@ -598,18 +605,23 @@ const crkLxOptions = ref([
   {
     value: 1,
     label: '入库记录'
-  }
-])
-const cangOptions = ref([
-  {
-    hwdm: '1',
-    hwmc: 'HW-1'
   },
   {
-    hwdm: '2',
-    hwmc: 'HW-2'
+    value: 2,
+    label: '2'
   }
 ])
+const cangOptions = ref([
+  // {
+  //   hwdm: '1',
+  //   hwmc: 'HW-1'
+  // },
+  // {
+  //   hwdm: '2',
+  //   hwmc: 'HW-2'
+  // }
+])
+const fileList = ref([])
 //出入库
 const page = ref({
   pageNum: 1,
@@ -679,9 +691,13 @@ const getLqjc = async () => {
     cfid: route.query.cfid
   }
   res = await Api.GetSelectLqjcList(data)
-  if (res) {
+  if (res && res.length > 0) {
+    // console.log(res,"res-=======");
+
     wensdform.value = res[0]
   } else {
+    // console.log(wensdform.value, 'wensdform.value-====')
+
     wensdform.value = {}
   }
 }
@@ -726,7 +742,7 @@ const searchCrkSy = async () => {
   }
   res = await Api.GetSelectSydList(data)
   crkTableDataSy.value = res.list || []
-  pageSy.value.pageSize = res.total || 0
+  pageSy.value.total = res.total || 0
 }
 const handleSizeChange = (val: any) => {
   page.value.pageSize = val
@@ -754,6 +770,7 @@ const back = () => {
   router.push({
     path: 'DataVisualizationInitkq',
     query: {
+      xzqhdm: route.query.xzqhdm,
       mapName: route.query.mapName,
       kqid: route.query.kqid,
       kqmc: route.query.kqmc
@@ -781,6 +798,11 @@ const tableRowClassName = ({ row, rowIndex }) => {
   }
 }
 
+//文件弹窗
+const openFiles = (row: any) => {
+  Dialogfiles.value = true
+  fileList.value = row
+}
 // 获取行政区划代码
 const getXzqh = async () => {
   let res = await Api.GetXzqhApi()
@@ -1037,13 +1059,69 @@ onMounted(() => {
 :deep(.el-table__body tr.current-row > td.el-table__cell) {
   background-color: transparent;
 }
+
+// 弹窗
+:deep(.dialog_file) {
+  .el-dialog {
+    background: url('@/assets/ksh/dialog/splb-bj.png') no-repeat;
+    background-size: 100% 100%;
+    display: flex;
+    flex-direction: column;
+    margin: 0 !important;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    max-height: calc(100% - 30px);
+  }
+  .el-dialog__body::-webkit-scrollbar {
+    display: none;
+  }
+  .dialog_title {
+    color: #ffffff;
+    font-size: 24px;
+    line-height: 20px;
+    position: relative;
+    .dialog_title_text {
+      margin-left: 30px;
+      // margin-top: -10px;
+      position: relative;
+    }
+    .dialog_title_text::before {
+      content: '';
+      display: inline-block;
+      width: 13px;
+      height: 16px;
+      background: url('@/assets/ksh/home/icon-square.png') no-repeat;
+      background-size: 100% 100%;
+      position: absolute;
+      top: 8px;
+      left: -24px;
+    }
+  }
+  .el-dialog__headerbtn {
+    top: 6px;
+    right: 6px;
+  }
+  .el-dialog__headerbtn .el-dialog__close {
+    display: none;
+  }
+  .el-dialog__headerbtn::before {
+    content: '';
+    display: inline-block;
+    width: 15px;
+    height: 15px;
+    background: url('@/assets/ksh/dialog/close.png') no-repeat;
+    background-size: 100% 100%;
+  }
+}
 </style>
 <style lang="scss">
 .cfxx_content .el-tag {
   background-color: transparent;
   border-width: 0;
   color: #ffffff;
-  font-size: 18px;
+  font-size: 16px;
   padding: 0;
 }
 .operation-box {
@@ -1183,35 +1261,6 @@ onMounted(() => {
     }
   }
 }
-.pfcbox {
-  width: 800px;
-  position: relative;
-}
-.pfc-div {
-  position: absolute;
-  width: 100%;
-  height: 200px;
-}
-.pfc-ul {
-  display: flex;
-  justify-content: space-between;
-  height: 100%;
-  .zhut {
-    background: #68b3ef;
-    border: 2px solid #284a9b;
-    width: 6px;
-    height: 100%;
-    border-radius: 10px;
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-between;
-    i {
-      margin-left: 13px;
-      font-style: normal;
-    }
-  }
-}
 .resettablewrap2 {
   .el-table {
     thead tr {
@@ -1306,29 +1355,6 @@ onMounted(() => {
   }
 }
 
-// .el-select-dropdown {
-//   background: rgba(22, 37, 73, 0.8);
-//   .el-select-dropdown__item {
-//     color: #ffffff;
-//   }
-//   .el-select-dropdown__item.hover,
-//   .el-select-dropdown__item:hover {
-//     background: #22468b;
-//   }
-// }
-// .el-select-dropdown__item {
-//   font-size: 18px;
-//   padding: 0 24px;
-//   height: 44px;
-//   line-height: 44px;
-// }
-// .el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
-//   background: #22468a;
-// }
-// .el-select-dropdown.is-multiple .el-select-dropdown__item.selected.hover {
-//   background: #22468a;
-// }
-
 .el-pagination {
   margin-top: 10px;
   text-align: center;
@@ -1397,4 +1423,37 @@ onMounted(() => {
     color: #ffffff;
   }
 }
+.fjBtn {
+  color: #f8ca02;
+  cursor: pointer;
+}
+
+.image_preview {
+  width: 95%;
+  height: 280px;
+  // padding: 0 20px;
+  // margin: 20px;
+  // margin: 20px 20px 0;
+  // .demo-image__error .image-slot {
+  //   font-size: 20px;
+  // }
+  // .demo-image__error .image-slot .el-icon {
+  //   font-size: 20px;
+  // }
+  // .demo-image__error .el-image {
+  //   width: 100%;
+  //   height: 100px;
+  // }
+  .el-image{
+    position: relative;
+  }
+  .el-image__error{
+    width: 80%;
+    height: 80%;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+  }
+}
 </style>

src/views/VisualDisplay/src/pages/compontent/Map2.vue

@@ -36,6 +36,7 @@ interface pointObject {
   value: any[]
 }
 const router = useRouter() // 路由对象
+const route = useRoute() // 路由接收对象
 const useStore = VisualizationHomeStore()
 const emits = defineEmits(['mapMounted'])
 const publicUrl = 'https://geo.datav.aliyun.com/areas_v3/bound/'
@@ -135,7 +136,7 @@ const back = () => {
   mapName.value = '全国'
   getMapList('')
   isBack.value = false
-  initChart()
+  initChart(false)
 
   // handClick(queryParams.value.jglb)
 }
@@ -161,26 +162,34 @@ const getGeoJson = (jsonName: any) => {
   // 使用本地数据
   return axios.get('/ChinaData/' + jsonName)
 }
-const initChart = () => {
+const initChart = async (isback:any) => {
   // this.clickFlag = "1";
   let chart = echarts.init(MapCharts.value)
-  //allCode获取所有的区域编码信息
-  // getGeoJson('all.json').then((all) => {
-  //   allCode = all.data
-  // })
-  // //初始化地图展示
-  // getGeoJson('100000_full.json').then((China) => {
-  //   initEcharts(China.data, '中华人民共和国', chart)
-  // console.log(China.data,"China.data");
-  // })
-  Promise.all([getGeoJson('all.json'), getGeoJson('100000_full.json')])
-    .then(([allData, chinaData]) => {
-      allCode.value = allData.data
-      initEcharts(chinaData.data, '中华人民共和国', chart)
-    })
-    .catch((error) => {
-      console.error('初始化数据失败:', error)
-    })
+  let routeXzqhdm = route.query.xzqhdm || ''
+  if (routeXzqhdm && isback) {
+    console.log('小地图-===')
+    mapName.value = route.query.mapName
+    await getMapList(routeXzqhdm)
+    getGeoJson(routeXzqhdm + '_full.json')
+      .then((res) => {
+        xzqhdm.value = routeXzqhdm + ''
+        initEcharts(res.data, mapName.value, chart)
+      })
+      .catch((err) => {
+        console.log(err, 'err')
+      })
+    isBack.value = true
+    mapPopIsShow.value = false
+  } else {
+    Promise.all([getGeoJson('all.json'), getGeoJson('100000_full.json')])
+      .then(([allData, chinaData]) => {
+        allCode.value = allData.data
+        initEcharts(chinaData.data, '中华人民共和国', chart)
+      })
+      .catch((error) => {
+        console.error('初始化数据失败:', error)
+      })
+  }
 }
 const initEcharts = (geoJson, name, chart) => {
   echarts.registerMap(name, geoJson)
@@ -473,7 +482,7 @@ const getMapList = async (xzqhdm: string) => {
 onMounted(async () => {
   // await handClick(null, false)
   // getXzqh()
-  initChart()
+  initChart(true)
 })
 onBeforeMount(() => {})
 onBeforeUnmount(() => {

src/views/VisualDisplay/src/pages/index.vue

@@ -72,7 +72,7 @@
                     <span class="item-icon1"></span>
                   </div>
                   <div class="item-right">
-                    <span class="item-title">承储库点（个）</span>
+                    <span class="item-title">交收库点（个）</span>
                     <span class="item-content">{{ datacard.cckd }}</span>
                   </div>
                 </div>
@@ -229,8 +229,11 @@ const loadData = async () => {
   let data = {}
   // let res = await Api.GetXzqhApi()
   let res = await Api.GetMapList(data)
-  datacard.value = res
-  console.log(res, 'res-=======')
+
+  if (!isBack.value) {
+    datacard.value = res
+  }
+  // console.log(res, 'res-=======')
 }
 // 重置
 const reset = () => {
@@ -244,8 +247,8 @@ const getMapList = (data: any, isBackData: any) => {
   xzqhCode.value = data.xzqhdm + ''
   xzqhName.value = data.mapName
   isBack.value = isBackData.isBack
-  console.log(xzqhCode.value, 'xzqhCode.value-===')
-  console.log(isBack.value, 'isBack.value11111111-===')
+  // console.log(xzqhCode.value, 'xzqhCode.value-===')
+  // console.log(isBack.value, 'isBack.value11111111-===')
 }
 onMounted(() => {
   loadData()

src/views/VisualDisplay/src/pages/kq/index.vue

@@ -50,7 +50,9 @@
                 <div class="box_icon icon_kq2"></div>
                 <div class="box_content">
                   <span class="span_left">库区编码：</span>
-                  <span class="span_right" :title="formData.kqdm">{{ formData.kqdm }}</span>
+                  <span class="span_right span_special2" :title="formData.kqbm">{{
+                    formData.kqbm
+                  }}</span>
                 </div>
               </div>
               <div class="box_item">
@@ -90,13 +92,13 @@
                   <span class="span_right span_detail" @click="getCwxx"> 详情 </span>
                 </div>
               </div>
-              <div class="box_item">
+              <!-- <div class="box_item">
                 <div class="box_icon icon_kq7"></div>
                 <div class="box_content">
                   <span class="span_left">设计仓容：</span>
                   <span class="span_right" :title="formData.crzl">{{ formData.crzl }}吨</span>
                 </div>
-              </div>
+              </div> -->
             </div>
           </div>
           <div class="map_bottom">
@@ -141,34 +143,17 @@
         <el-row style="height: 600px">
           <el-col :span="6" style="margin-left: 20px" class="content_list">
             <div class="check_box">
-              <!-- <el-table
-                class="cfxx custom-table"
-                :data="VideoList"
-                height="540px"
-                style="width: 100%; overflow-x: hidden"
-                row-class-name="row-style1"
-                @row-click="handleSetVideo"
-                :show-header="false"
-              >
-                <el-table-column prop="jkdmc" label="监控点名称" align="center">
-                  <template #default="scope">
-                    <el-checkbox
-                      :label="scope.row.jkdmc"
-                      :value="scope.row.jkdmc"
-                      class="list_item"
-                    />
-                  </template>
-                </el-table-column>
-              </el-table> -->
-              <el-checkbox-group @change="handleSetVideo" v-model="checkList" class="check_box">
-                <el-checkbox
-                  :label="item.jkdmc"
-                  :value="item"
-                  class="list_item"
-                  v-for="(item, index) in VideoList"
-                  :key="index"
-                />
-              </el-checkbox-group>
+              <el-scrollbar class="custom-scrollbar" style="height: 500px">
+                <el-checkbox-group @change="handleSetVideo" v-model="checkList" class="">
+                  <el-checkbox
+                    :label="item.jkdmc"
+                    :value="item"
+                    class="list_item"
+                    v-for="(item, index) in VideoList"
+                    :key="index"
+                  />
+                </el-checkbox-group>
+              </el-scrollbar>
             </div>
           </el-col>
           <el-col :span="17">
@@ -200,7 +185,11 @@
             </div>
           </div>
           <div class="cwxx_center">
-            <div class="cwxx_center_item" v-for="(item, index) in cwxxData.cwxxYearList" :key="index">
+            <div
+              class="cwxx_center_item"
+              v-for="(item, index) in cwxxData.cwxxYearList"
+              :key="index"
+            >
               <div class="cwxx_item cwxx_title"> {{ item.cn }}年财务情况 </div>
               <div class="cwxx_item">
                 <span>总负债：</span>
@@ -249,22 +238,22 @@ const Dialogvideo = ref(false)
 const dialogVisibleDetail = ref(false)
 const tableData = ref([])
 const VideoList = ref([
-  {
-    jkdmc: '法泗中心磅房半球',
-    url: 'ws://172.16.13.3:559/openUrl/09zvvc4'
-  },
-  {
-    jkdmc: '法泗中心检验室半球',
-    url: 'ws://172.16.13.3:559/openUrl/0aXNyJG'
-  },
-  {
-    jkdmc: '法泗中心下磅区域枪机',
-    url: 'ws://172.16.13.3:559/openUrl/06E7P4Q'
-  },
-  {
-    jkdmc: '法泗中心扦样地磅枪机',
-    url: 'ws://172.16.13.3:559/openUrl/08aEfok'
-  }
+  // {
+  //   jkdmc: '法泗中心磅房半球',
+  //   url: 'ws://172.16.13.3:559/openUrl/09zvvc4'
+  // },
+  // {
+  //   jkdmc: '法泗中心检验室半球',
+  //   url: 'ws://172.16.13.3:559/openUrl/0aXNyJG'
+  // },
+  // {
+  //   jkdmc: '法泗中心下磅区域枪机',
+  //   url: 'ws://172.16.13.3:559/openUrl/06E7P4Q'
+  // },
+  // {
+  //   jkdmc: '法泗中心扦样地磅枪机',
+  //   url: 'ws://172.16.13.3:559/openUrl/08aEfok'
+  // }
 ])
 const videoCode = ref('')
 const viewList = ref([])
@@ -334,6 +323,7 @@ const tableRowClassName = ({ row, rowIndex }) => {
 const loadData = async () => {
   let res: any
   let res2: any
+  let res3: any
   let data = {
     kqid: kqid.value
   }
@@ -342,15 +332,20 @@ const loadData = async () => {
   tableData.value = res
   res2 = await Api.GetQueryKqInfo(data)
   formData.value = res2
+  res3 = await Api.GetSelectSpList({ kqdm: res2.kqbm })
+  console.log(res3, 'res3-======')
+
+  VideoList.value = res3 || []
 }
 // 列表点击
 const rowClick = (row) => {
-  console.log(row,"row-=======");
-  
+  console.log(row, 'row-=======')
+
   // router.push('DataVisualizationInitcf')
   router.push({
     path: 'DataVisualizationInitcf',
     query: {
+      xzqhdm: route.query.xzqhdm,
       mapName: route.query.mapName,
       kqid: route.query.kqid,
       kqmc: route.query.kqmc,
@@ -370,7 +365,15 @@ const getCwxx = async () => {
 }
 // 返回
 const back = () => {
-  router.push('DataVisualizationInit')
+  router.push({
+    path: 'DataVisualizationInit',
+    query: {
+      xzqhdm: route.query.xzqhdm,
+      mapName: route.query.mapName,
+      kqid: route.query.kqid,
+      kqmc: route.query.kqmc
+    }
+  })
 }
 // 视频查询
 const searchClick = () => {
@@ -403,24 +406,29 @@ const handlerInitPlay = () => {
 //打开视频
 const openVideo = () => {
   Dialogvideo.value = true
-  checkList.value = VideoList.value.slice(0, 4)
+
+  checkList.value = VideoList.value.slice(0, 1)
 }
 //点击监控点名称
-const handleSetVideo = (row) => {
-  // console.log(row, 'row-======')
-  handlerPlay(row)
+const handleSetVideo = () => {
+  if (checkList.value.length > 0) {
+    checkList.value = checkList.value.slice(checkList.value.length - 1, checkList.value.length)
+  }
+  // console.log(checkList.value, 'checkList.value-======')
+  handlerPlay(1)
 }
-const handlerPlay = (row) => {
+const handlerPlay = (row: any) => {
   if (!row) {
     let preUrl = ''
     let list = VideoList.value
     console.log(list, 'VideoList-=====')
     videoCode.value = list[0].url
-    let urlList = list.slice(0, 4)
+    // let urlList = list.slice(0, 4)
+    let urlList = list.slice(0, 1) //改成只显示一个视频
     console.log(urlList, 'urlList')
     viewList.value = urlList
     // const _this = this;
-    player.value.JS_ArrangeWindow(2).then(
+    player.value.JS_ArrangeWindow(1).then(
       () => {
         urlList.forEach((item, i) => {
           preUrl = item.url
@@ -448,68 +456,54 @@ const handlerPlay = (row) => {
     let preUrl = ''
     let list = checkList.value
     console.log(list, 'list[0]-=====')
+    if (list.length > 0) {
+      videoCode.value = list[0]['url']
+      // let urlList = list.slice(0, 4)
+      let urlList = list.slice(0, 1) //改成只显示一个视频
+      // console.log(urlList, 'urlList')
 
-    videoCode.value = list[0]['url']
-    let urlList = list.slice(0, 4)
-    console.log(urlList, 'urlList')
-
-    viewList.value = urlList
-    // const _this = this;
-    let videoNum = 2
-    if (urlList.length == 1) {
-      videoNum = 1
+      viewList.value = urlList
+      // const _this = this;
+      let videoNum = 2
+      if (urlList.length == 1) {
+        videoNum = 1
+      } else {
+        videoNum = 2
+      }
+      player.value.JS_ArrangeWindow(videoNum).then(
+        () => {
+          urlList.forEach((item, i) => {
+            preUrl = item['url']
+            let param = {
+              playURL: preUrl,
+              mode: 0
+            }
+            let index = i
+            player.value.JS_Play(preUrl, param, index).then(
+              () => {
+                // 播放成功回调
+                console.log('播放成功')
+              },
+              (err) => {
+                console.log(err, '播放失败')
+              }
+            )
+          })
+        },
+        (e) => {
+          console.error(e)
+        }
+      )
     } else {
-      videoNum = 2
+      player.value.JS_Stop(0).then(
+        () => {
+          console.info('JS_Stop success')
+        },
+        (err) => {
+          console.info('JS_Stop failed:', err)
+        }
+      )
     }
-    player.value.JS_ArrangeWindow(videoNum).then(
-      () => {
-        urlList.forEach((item, i) => {
-          preUrl = item['url']
-          let param = {
-            playURL: preUrl,
-            mode: 0
-          }
-          let index = i
-          player.value.JS_Play(preUrl, param, index).then(
-            () => {
-              // 播放成功回调
-              console.log('播放成功')
-            },
-            (err) => {
-              console.log(err, '播放失败')
-            }
-          )
-        })
-      },
-      (e) => {
-        console.error(e)
-      }
-    )
-    // 将下标移动到下一个视频窗口
-    // if (viewIndex.value && viewIndex.value == 1) {
-    //   currentIndex.value = 0
-    // } else {
-    //   currentIndex.value = ind.value % 4
-    //   ind.value++
-    // }
-
-    // let param = {
-    //   playURL: row.url,
-    //   mode: 0
-    // }
-    // rowUrl.value = row.url
-    // console.log(row.url, 'row.url')
-    // viewList[currentIndex.value] = row
-    // videoCode.value = row.url
-    // player.value.JS_Play(row.url, param, currentIndex.value).then(
-    //   () => {
-    //     // 播放成功回调
-    //     console.log('播放成功')
-    //   },
-    //   (err) => {
-    //     console.log('播放失败')
-    //   }
-    // )
   }
   // let that = this;
   player.value.JS_SetWindowControlCallback({
@@ -716,8 +710,8 @@ onMounted(() => {
 }
 .kqxx_content {
   width: 100%;
-  height: 84%;
-  padding-top: 20px;
+  height: 75%;
+  padding-top: 30px;
   display: flex;
   flex-wrap: wrap;
   justify-content: flex-start;
@@ -769,6 +763,9 @@ onMounted(() => {
 .kqxx_content .box_content .span_special {
   line-height: 20px;
 }
+.kqxx_content .box_content .span_special2 {
+  font-size: 16px;
+}
 .kqxx_content .box_content .span_detail {
   cursor: pointer;
 }
@@ -1016,6 +1013,9 @@ onMounted(() => {
       border-color: #7cbbed;
     }
   }
+  .custom-scrollbar .is-horizontal {
+    display: none !important;
+  }
 }
 
 .view_box {