diff --git a/front/public/static/config/basicConfig.js b/front/public/static/config/basicConfig.js
index 47ff4d3f..fa306d8d 100644
--- a/front/public/static/config/basicConfig.js
+++ b/front/public/static/config/basicConfig.js
@@ -8,9 +8,9 @@
 var _global = {}
 var CONFIGITEM = {
   // version: 'qingdao', //青岛
-  // version: 'xihaian', // 西海岸
+  version: 'xihaian', // 西海岸
   // version: 'dev', // 开发
-  version: 'zhanTingDev', // 展厅dev (2022-09-13:姜永超让添加)
+  // version: 'zhanTingDev', // 展厅dev (2022-09-13:姜永超让添加)
   //version: 'test', // 测试
   //version: 'frp', // 内网穿透
   vNum: 'v0.8.7.2',
@@ -62,7 +62,8 @@ var CONFIGITEM = {
       },
       backUrl: 'http://10.134.135.9:9797',
       previewUrl: 'http://10.134.135.9:9796/',
-      websocketURL: '10.134.135.9:8888/renren-admin',
+      websocketURL: '10.134.135.9:8888/renren-admin', // 正式环境
+      websocketURL: '10.134.135.92:8888/renren-admin', // 测试环境
       // websocketURL: '10.18.1.99:8889/renren-admin', // 研发
       POI_URL:
         'http://15.72.178.129:8090/iserver/services/addressmatch-qingdaoPOI181015/restjsr/v1/address',
diff --git a/front/src/api/file.js b/front/src/api/file.js
index 7ff3cbd6..d7e2349d 100644
--- a/front/src/api/file.js
+++ b/front/src/api/file.js
@@ -99,7 +99,7 @@ export function getHls(params) {
 }
 //能力集市基础设施-左侧列表
 export function getCameraInfoByAreaId(params) {
-  return axios.get(`http://10.134.135.92:9537/data_service/getCamera/getCameraInfoByAreaId?areaId=${params.areaId}&status=${params.status}`,
+  return axios.get(`http://10.134.135.92:9537/data_service/getCamera/getCameraInfoByAreaId?areaId=${params.areaId}`,
     config2
   )
 }
diff --git a/front/src/views/home/detailsPageInfrastructureTree.vue b/front/src/views/home/detailsPageInfrastructureTree.vue
index 62c1b8fb..a4aaab3b 100644
--- a/front/src/views/home/detailsPageInfrastructureTree.vue
+++ b/front/src/views/home/detailsPageInfrastructureTree.vue
@@ -136,7 +136,6 @@
           } else {
             getCameraInfoByAreaId({
               areaId: '70be8c5b664f4bcf869d82f2e8335051',
-              status: 1,
             }).then((res) => {
               treeData.value = res.data.data
             })
@@ -270,7 +269,6 @@
         } else {
           getCameraInfoByAreaId({
             areaId: val.id,
-            status: 1,
           }).then((res) => {
             treeData.value.map((treeDataItem, index) => {
               if (item.id == treeDataItem.id) {
@@ -345,7 +343,6 @@
         } else {
           getCameraInfoByAreaId({
             areaId: item.id,
-            status: 1,
           }).then((res) => {
             treeData.value.map((treeDataItem, index) => {
               if (item.id == treeDataItem.id) {
diff --git a/front/src/views/home/infrastructurePage.vue b/front/src/views/home/infrastructurePage.vue
index 878bf69b..822b67c6 100644
--- a/front/src/views/home/infrastructurePage.vue
+++ b/front/src/views/home/infrastructurePage.vue
@@ -5,24 +5,15 @@
     <div class="infrastructrue-tab">
       <div v-for="(item, index) in tabList" :key="index" class="tabBox">
         <b class="leftType">{{ item.title }}</b>
-        <el-button
-          @click="nullClick"
-          v-if="item.title == '视频标签'"
-          type="small"
-        >
+        <el-button @click="nullClick" v-if="item.title == '视频标签'" type="small">
           清空
         </el-button>
-        <span
-          v-for="itemContent in item.content"
-          :key="itemContent"
-          @click="tabClick(index, itemContent)"
-          :class="
-            clickList[index].content.indexOf(itemContent.labelName) != -1 ||
-            clickList[index].content.indexOf(itemContent) != -1
-              ? 'down'
-              : ''
-          "
-        >
+        <span v-for="itemContent in item.content" :key="itemContent" @click="tabClick(index, itemContent)" :class="
+          clickList[index].content.indexOf(itemContent.labelName) != -1 ||
+          clickList[index].content.indexOf(itemContent) != -1
+            ? 'down'
+            : ''
+        ">
           {{ itemContent.labelName || itemContent }}
         </span>
       </div>
@@ -30,35 +21,19 @@
 
     <div v-if="!room" class="roomBox">
       <div class="leftMake">
-        <div
-          class="leftTop"
-          @click="roomResults"
-          :class="roomYuyue ? 'roomBackground' : 'nullBackground'"
-        >
+        <div class="leftTop" @click="roomResults" :class="roomYuyue ? 'roomBackground' : 'nullBackground'">
           会议室预约
         </div>
-        <div
-          class="leftBottom"
-          @click="result"
-          :class="roomResult ? 'roomBackground' : 'nullBackground'"
-        >
+        <div class="leftBottom" @click="result" :class="roomResult ? 'roomBackground' : 'nullBackground'">
           预约结果
         </div>
       </div>
       <div class="roomSearch">
         <span>会议室搜索</span>
         <div class="searchInput">
-          <a-input-search
-            v-model:value="roomInput"
-            placeholder="请输入关键词"
-            enter-button="搜索"
-            size="large"
-            @search="onSearch"
-          />
-          <a-button
-            style="width: 0.8rem; height: 0.36rem; margin-left: 0.7rem"
-            @click="reSetSearch"
-          >
+          <a-input-search v-model:value="roomInput" placeholder="请输入关键词" enter-button="搜索" size="large"
+            @search="onSearch" />
+          <a-button style="width: 0.8rem; height: 0.36rem; margin-left: 0.7rem" @click="reSetSearch">
             重置
           </a-button>
         </div>
@@ -69,40 +44,23 @@
           <div class="roomTime">
             <span>可用时间查询</span>
             <a-space direction="vertical" class="roomSpace">
-              <a-date-picker
-                v-model:value="roomCerateDate"
-                placeholder="开始日期"
-                value-format="YYYY-MM-DD"
-              />
-              <a-time-picker
-                v-model:value="roomCreateTime"
-                placeholder="开始时间"
-                value-format="HH:mm:ss"
-                :disabledHours="disabledStartHours"
-                :disabledMinutes="disabledStartMinutes"
-                :disabledSeconds="disabledStartSeconds"
-              />
-              <a-time-picker
-                v-model:value="roomEndTime"
-                placeholder="结束时间"
-                value-format="HH:mm:ss"
-                :disabledHours="disabledEndHours"
-                :disabledMinutes="disabledEndMinutes"
-                :disabledSeconds="disabledEndSeconds"
-              />
+              <a-date-picker v-model:value="roomCerateDate" placeholder="开始日期" value-format="YYYY-MM-DD" />
+              <a-time-picker v-model:value="roomCreateTime" placeholder="开始时间" value-format="HH:mm:ss"
+                :disabledHours="disabledStartHours" :disabledMinutes="disabledStartMinutes"
+                :disabledSeconds="disabledStartSeconds" />
+              <a-time-picker v-model:value="roomEndTime" placeholder="结束时间" value-format="HH:mm:ss"
+                :disabledHours="disabledEndHours" :disabledMinutes="disabledEndMinutes"
+                :disabledSeconds="disabledEndSeconds" />
             </a-space>
           </div>
         </div>
         <div class="roomItem" v-for="item in roomList" :key="item.id">
           <div class="leftImg">
-            <img
-              :src="
-                item.pic == null
-                  ? 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp1.itc.cn%2Fimages01%2F20201221%2F00885cf666cc4c2ab80c7b4e59259e85.jpeg&refer=http%3A%2F%2Fp1.itc.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1662707222&t=13d3246428ee80cc7519702d5eb6eb7d'
-                  : `${item.pic}`
-              "
-              alt=""
-            />
+            <img :src="
+              item.pic == null
+                ? 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fp1.itc.cn%2Fimages01%2F20201221%2F00885cf666cc4c2ab80c7b4e59259e85.jpeg&refer=http%3A%2F%2Fp1.itc.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1662707222&t=13d3246428ee80cc7519702d5eb6eb7d'
+                : `${item.pic}`
+            " alt="" />
           </div>
           <div class="rightContent">
             <div class="topContent">{{ item.name }}</div>
@@ -115,54 +73,39 @@
               {{ item.description }}
             </div>
           </div>
-          <a-button
-            style="
+          <a-button style="
               margin-left: 0.8rem;
               background: #e1edfa;
               color: #0087ff;
               border: none;
               border-radius: 0.06rem;
-            "
-            @click="appointment(item)"
-          >
+            " @click="appointment(item)">
             预约
           </a-button>
         </div>
-        <a-pagination
-          v-model:current="roomPage"
-          v-model:pageSize="roomLimit"
-          show-quick-jumper
-          :total="roomTotal"
-          :page-size-options="pageSizeOptions"
-          @change="onRoomChange"
-          @showSizeChange="onShowSizeChange"
-          show-size-changer
-        />
+        <a-pagination v-model:current="roomPage" v-model:pageSize="roomLimit" show-quick-jumper :total="roomTotal"
+          :page-size-options="pageSizeOptions" @change="onRoomChange" @showSizeChange="onShowSizeChange"
+          show-size-changer />
       </div>
       <div v-if="roomResult" style="display: grid">
-        <a-table
-          :columns="columnsRomm"
-          :data-source="dataRoom"
-          :filterMultiple="false"
-          :align="center"
-          :pagination="false"
-        >
+        <a-table :columns="columnsRomm" :data-source="dataRoom" :filterMultiple="false" :align="center"
+          :pagination="false">
           <template #bodyCell="{ column, record }">
             <template v-if="column.key === 'bookDate'">
               <span>
                 {{ record.bookDate }} {{ record.startTime }}-{{
-                  record.endTime
+                record.endTime
                 }}
               </span>
             </template>
             <template v-if="column.key === 'state'">
               <span>
                 {{
-                  record.state == 2
-                    ? '通过'
-                    : record.state == 1
-                    ? '审核中'
-                    : '不通过'
+                record.state == 2
+                ? '通过'
+                : record.state == 1
+                ? '审核中'
+                : '不通过'
                 }}
               </span>
             </template>
@@ -171,69 +114,52 @@
             </template>
           </template>
         </a-table>
-        <a-pagination
-          v-model:current="roomPage"
-          v-model:pageSize="roomLimit"
-          show-quick-jumper
-          :total="roomTotal"
-          :page-size-options="pageSizeOptionsChengguo"
-          @change="onRoomChangeChengguo"
-          @showSizeChange="onShowSizeChangeChengguo"
-          show-size-changer
-        />
+        <a-pagination v-model:current="roomPage" v-model:pageSize="roomLimit" show-quick-jumper :total="roomTotal"
+          :page-size-options="pageSizeOptionsChengguo" @change="onRoomChangeChengguo"
+          @showSizeChange="onShowSizeChangeChengguo" show-size-changer />
       </div>
-      <a-modal
-        v-model:visible="visibleRoom"
-        width="10rem"
-        title="预约详情"
-        :body-style="bodystyle"
-        class="modalClass"
-        :footer="null"
-      >
+      <a-modal v-model:visible="visibleRoom" width="10rem" title="预约详情" :body-style="bodystyle" class="modalClass"
+        :footer="null">
         <div class="modalResult" style="margin-bottom: 0.05rem">预约结果</div>
-        <div
-          style="
+        <div style="
             width: 100%;
             height: 0.01rem;
             border-top: 1px solid #ccc;
             transform: scaleY(0.5);
-          "
-        ></div>
-        <div
-          class="modalExamine"
-          style="display: flex; flex-direction: column; margin-top: 0.2rem"
-        >
+          "></div>
+        <div class="modalExamine" style="display: flex; flex-direction: column; margin-top: 0.2rem">
           <span style="margin-bottom: 0.2rem">
-            审核结果：{{ lookData.state === '2' ? '通过' : '不通过' }}
+            审核结果：{{
+            lookData.state == 2
+            ? '通过'
+            : lookData.state == 1
+            ? '审核中'
+            : '不通过'
+            }}
           </span>
           <span style="width: 8rem; margin-bottom: 0.3rem">
             审核意见：{{ lookData.auditViem }}
           </span>
         </div>
         <div class="modalYuyue" style="margin-bottom: 0.05rem">预约信息</div>
-        <div
-          style="
+        <div style="
             width: 100%;
             height: 0.01rem;
             border-top: 1px solid #ccc;
             transform: scaleY(0.5);
-          "
-        ></div>
+          "></div>
         <div class="modalTime" style="margin-top: 0.2rem">
           <div>
             预约时段：{{ lookData.bookDate }} {{ lookData.startTime }}-{{
-              lookData.endTime
+            lookData.endTime
             }}
           </div>
-          <div
-            class="modalContent"
-            style="
+          <div class="modalContent" style="
               width: 7.5rem;
               display: flex;
               justify-content: space-between;
               margin: 0.15rem 0 0.15rem 0;
-            "
-          >
+            ">
             <span>预约人：{{ lookData.name }}</span>
             <span>联系方式：{{ lookData.phone }}</span>
             <span>预约部门：{{ lookData.dept }}</span>
@@ -243,43 +169,18 @@
           使用事项：{{ lookData.matter }}
         </div>
       </a-modal>
-      <a-modal
-        v-model:visible="appointmentRoom"
-        title="会议室预约"
-        width="10rem"
-        @ok="handleOk"
-        :body-style="bodystyle"
-        class="appModal"
-        :footer="null"
-      >
-        <a-form
-          :model="formState"
-          name="basic"
-          :label-col="{ span: 8 }"
-          :wrapper-col="{ span: 16 }"
-          autocomplete="off"
-          @finish="onFinish"
-          @finishFailed="onFinishFailed"
-          :labelAlign="labelPosition"
-        >
+      <a-modal v-model:visible="appointmentRoom" title="会议室预约" width="10rem" @ok="handleOk" :body-style="bodystyle"
+        class="appModal" :footer="null">
+        <a-form :model="formState" name="basic" :label-col="{ span: 8 }" :wrapper-col="{ span: 16 }" autocomplete="off"
+          @finish="onFinish" @finishFailed="onFinishFailed" :labelAlign="labelPosition">
           <a-row>
             <a-col :span="8">
-              <a-form-item
-                name="bookDate"
-                label="预约日期"
-                v-bind="validateInfos.bookDate"
-                @blur="validate('create', { trigger: 'blur' }).catch(() => {})"
-              >
-                <a-date-picker
-                  style="width: 72%"
-                  v-model:value="formState.bookDate"
-                  value-format="YYYY-MM-DD"
-                  @change="handleChange"
-                />
+              <a-form-item name="bookDate" label="预约日期" v-bind="validateInfos.bookDate"
+                @blur="validate('create', { trigger: 'blur' }).catch(() => {})">
+                <a-date-picker style="width: 72%" v-model:value="formState.bookDate" value-format="YYYY-MM-DD"
+                  @change="handleChange" />
               </a-form-item>
-              <div
-                :class="roomDateList[0] != null ? 'jinggaoD' : 'jinggaoNull'"
-              >
+              <div :class="roomDateList[0] != null ? 'jinggaoD' : 'jinggaoNull'">
                 <div class="imgJinggao"></div>
                 <span style="color: #da2a13; font-size: 0.12rem">
                   当日会议室可用时段：{{ roomDateList[0] }}
@@ -287,89 +188,47 @@
               </div>
             </a-col>
             <a-col :span="8">
-              <a-form-item
-                name="startTime"
-                label="预约时段"
-                v-bind="validateInfos.startTime"
-                style="display: flex"
-              >
-                <a-time-picker
-                  v-model:value="formState.startTime"
-                  placeholder="开始时间"
-                  value-format="HH:mm:ss"
-                  :disabledHours="disabledTimeHours"
-                  :disabledMinutes="disabledTimeMinutes"
-                  :disabledSeconds="disabledTimeSeconds"
-                />
+              <a-form-item name="startTime" label="预约时段" v-bind="validateInfos.startTime" style="display: flex">
+                <a-time-picker v-model:value="formState.startTime" placeholder="开始时间" value-format="HH:mm:ss"
+                  :disabledHours="disabledTimeHours" :disabledMinutes="disabledTimeMinutes"
+                  :disabledSeconds="disabledTimeSeconds" />
               </a-form-item>
             </a-col>
             <a-col :span="8">
-              <a-time-picker
-                v-model:value="formState.endTime"
-                placeholder="结束时间"
-                value-format="HH:mm:ss"
-                :disabledHours="disabledTimeEndHours"
-                :disabledMinutes="disabledTimeEndMinutes"
-                :disabledSeconds="disabledTimeEndSeconds"
-              />
+              <a-time-picker v-model:value="formState.endTime" placeholder="结束时间" value-format="HH:mm:ss"
+                :disabledHours="disabledTimeEndHours" :disabledMinutes="disabledTimeEndMinutes"
+                :disabledSeconds="disabledTimeEndSeconds" />
             </a-col>
           </a-row>
           <a-row style="margin-top: 0.4rem">
             <a-col :span="8">
-              <a-form-item
-                name="name"
-                label="预约人"
-                v-bind="validateInfos.name"
-              >
+              <a-form-item name="name" label="预约人" v-bind="validateInfos.name">
                 <a-input v-model:value="formState.name" style="width: 72%" />
               </a-form-item>
             </a-col>
             <a-col :span="8">
-              <a-form-item
-                name="phone"
-                label="联系电话"
-                v-bind="validateInfos.phone"
-              >
+              <a-form-item name="phone" label="联系电话" v-bind="validateInfos.phone">
                 <a-input v-model:value="formState.phone" style="width: 72%" />
               </a-form-item>
             </a-col>
             <a-col :span="8">
-              <a-form-item
-                name="dept"
-                label="预约部门"
-                v-bind="validateInfos.dept"
-              >
+              <a-form-item name="dept" label="预约部门" v-bind="validateInfos.dept">
                 <a-input v-model:value="formState.dept" style="width: 72%" />
               </a-form-item>
             </a-col>
           </a-row>
           <a-row style="margin-top: 0.4rem">
             <a-col :span="24">
-              <a-form-item
-                name="matter"
-                v-bind="validateInfos.matter"
-                label="使用事项"
-                class="introduction"
-              >
+              <a-form-item name="matter" v-bind="validateInfos.matter" label="使用事项" class="introduction">
                 <a-textarea v-model:value="formState.matter" />
               </a-form-item>
             </a-col>
           </a-row>
           <a-row style="margin-top: 0.4rem">
             <a-col :span="24">
-              <a-form-item
-                name="uploadRoom"
-                label="附件上传"
-                class="introduction"
-              >
-                <a-upload
-                  :max-count="1"
-                  accept=".doc,.docx,pdf"
-                  v-model:file-list="fileList"
-                  :action="`${apiURL}/upload`"
-                  @remove="handleRemove"
-                  @change="roomUpload"
-                >
+              <a-form-item name="uploadRoom" label="附件上传" class="introduction">
+                <a-upload :max-count="1" accept=".doc,.docx,pdf" v-model:file-list="fileList"
+                  :action="`${apiURL}/upload`" @remove="handleRemove" @change="roomUpload">
                   <a-button>
                     <upload-outlined>选择上传附件</upload-outlined>
                   </a-button>
@@ -380,16 +239,9 @@
               </a-form-item>
             </a-col>
           </a-row>
-          <a-form-item
-            :wrapper-col="{ span: 14, offset: 4 }"
-            style="text-align: center; margin-top: 0.4rem"
-          >
+          <a-form-item :wrapper-col="{ span: 14, offset: 4 }" style="text-align: center; margin-top: 0.4rem">
             <a-button @click="resetFields" type="primary" danger>取消</a-button>
-            <a-button
-              style="margin-left: 10px"
-              type="primary"
-              @click="onSubmit"
-            >
+            <a-button style="margin-left: 10px" type="primary" @click="onSubmit">
               提交
             </a-button>
           </a-form-item>
@@ -421,1017 +273,892 @@
         <div class="contentRight">
           <!-- 搜索@search="onSearch" -->
           <div class="searchInput" v-if="isXiHaiAn">
-            <a-input-search
-              v-model:value="mapSearchParam.cameraName"
-              placeholder="请输入关键词"
-              enter-button="搜索"
-              size="large"
-              @change="getCamera"
-            />
-            <a-button
-              type="primary"
-              style="width: 0.8rem; height: 0.36rem; margin-left: 0.7rem"
-              @click="clean"
-            >
+            <a-input-search v-model:value="mapSearchParam.cameraName" placeholder="请输入关键词" enter-button="搜索"
+              size="large" @change="(e) => getCamera(true, e.target.value)" />
+            <a-button type="primary" style="width: 0.8rem; height: 0.36rem; margin-left: 0.7rem" @click="clean">
               重置
             </a-button>
           </div>
           <i class="boundary"></i>
           <!-- 批量预览 -->
-          <a-button
-            type="primary"
-            @click="batchPreview"
-            class="buttonAdd"
-            v-if="isXiHaiAn"
-          >
+          <a-button type="primary" @click="batchPreview" class="buttonAdd" v-if="isXiHaiAn">
             批量预览
           </a-button>
           <!-- 批量预览 -->
-          <a-button
-            type="primary"
-            @click="batchPicturePreview"
-            class="buttonAdd"
-            v-if="!cloudResourcesFlag"
-          >
+          <a-button type="primary" @click="batchPicturePreview" class="buttonAdd" v-else>
             批量预览
           </a-button>
           <!-- 添加至申购车 -->
-          <a-button
-            type="primary"
-            @click="addShoppingCart"
-            class="buttonAdd"
-            v-if="!cloudResourcesFlag"
-          >
+          <a-button type="primary" @click="addShoppingCart" class="buttonAdd">
             添加至申购车
           </a-button>
           <!-- 一键申请 -->
-          <a-button
-            type="primary"
-            @click="apply"
-            class="buttonAdd"
-            v-if="!cloudResourcesFlag"
-          >
+          <a-button type="primary" @click="apply" class="buttonAdd">
             一键申请
           </a-button>
-          <!-- 申请政务云资源 -->
-          <a-button
-            type="primary"
-            @click="applyCloudResources"
-            class="buttonAdd"
-            v-if="cloudResourcesFlag"
-          >
-            我要申请政务云资源
-          </a-button>
         </div>
       </div>
       <!-- 表格 -->
       <div class="infrastructrue-table" v-if="!wrjFlag">
-        <a-table
-          class="ant-table-striped"
-          :dataSource="dataSource"
-          :columns="columns"
-          :scroll="{ y: tableHeight }"
-          rowKey="channelId"
-          :rowClassName="
+        <a-table class="ant-table-striped" :dataSource="dataSource" :columns="columns" :scroll="{ y: tableHeight }"
+          rowKey="channelId" :rowClassName="
             (record, index) => (index % 2 === 1 ? 'table-striped' : null)
-          "
-          :pagination="pagination"
-          @change="handleTableChange"
-          :row-selection="{
+          " :pagination="pagination" @change="handleTableChange" :row-selection="{
             selectedRowKeys: selectedRowKeys,
             // onChange: onSelectChange,
             onSelect: onSelectChange,
             onSelectAll: onSelectAll,
-          }"
-        >
+          }">
           <template #bodyCell="{ column, record }">
             <template v-if="column.dataIndex === 'operation'">
-              <a
-                v-if="isXiHaiAn"
-                @click="
-                  openVideo(
-                    record.channelCode ||
-                      record.channelId ||
-                      record.channelCode.channelId
-                  )
-                "
-              >
+              <a v-if="isXiHaiAn" @click="
+                openVideo(
+                  record.channelCode ||
+                    record.channelId ||
+                    record.channelCode.channelId, record
+                )
+              ">
                 预览
               </a>
-              <a
-                v-else
-                @click="
-                  openPicture(
-                    record.channelCode ||
-                      record.channelId ||
-                      record.channelCode.channelId
-                  )
-                "
-              >
+              <a v-else @click="
+                openPicture(
+                  record.channelCode ||
+                    record.channelId ||
+                    record.channelCode.channelId
+                )
+              ">
                 预览
               </a>
             </template>
           </template>
         </a-table>
       </div>
+      <!-- 西海岸-无人机、单兵设备 -->
       <div class="infrastructrue-table" v-else-if="isXiHaiAn && wrjFlag">
-        <a-table
-          class="ant-table-striped"
-          :dataSource="dataSource2"
-          :columns="columns2"
-          :scroll="{ y: tableHeight }"
-          rowKey="channelId"
-          :rowClassName="
+        <a-table class="ant-table-striped" :dataSource="dataSource2" :columns="columns2" :scroll="{ y: tableHeight }"
+          rowKey="channelId" :rowClassName="
             (record, index) => (index % 2 === 1 ? 'table-striped' : null)
-          "
-          :pagination="dataSource2.length"
-        >
+          " :pagination="pagination" @change="handleTableChange">
           <template #bodyCell="{ column, record }">
             <template v-if="column.dataIndex === 'operation'">
-              <a
-                @click="goToWrj(record)"
-                style="margin-right: 10px"
-                v-if="record.type !== '单兵设备'"
-              >
-                控制台
-              </a>
-              <a @click="goToApply(record)" style="margin-right: 10px" v-else>
+              <a-button @click="goToApply(record)" type="link" :disabled="record.state != 1">
                 申请
-              </a>
-              <a @click="showWrj(record)">详情</a>
+              </a-button>
+              <a-button @click="showWrj(record)" type="link">
+                详情
+              </a-button>
             </template>
           </template>
         </a-table>
       </div>
       <!-- 单个预览弹窗 -->
-      <a-modal
-        wrapClassName="single-preview-modal"
-        v-model:visible="visible"
-        title="视频预览"
-        :width="960"
-        destroyOnClose
-      >
+      <a-modal wrapClassName="single-preview-modal" v-model:visible="visible" title="视频预览" :width="960" destroyOnClose>
         <template #footer></template>
         <div style="width: 100%; display: flex; justify-content: center">
-          <div style="width: 100%; height: 100%">
+          <div style="width: 100%; height: 100%;position:relative">
+            <!-- 预览视频--遮罩 -->
+            <div class="video-cover" @click="videoShowMsg"></div>
             <vue3VideoPlay v-bind="options" />
           </div>
         </div>
       </a-modal>
+
       <!-- 图片预览 -->
-      <a-modal
-        wrapClassName="single-preview-modal"
-        v-model:visible="picVisible"
-        title="图片预览"
-        :width="960"
-        destroyOnClose
-      >
+      <a-modal wrapClassName="single-preview-modal" v-model:visible="picVisible" title="图片预览" :width="960"
+        destroyOnClose>
         <template #footer></template>
         <div style="width: 100%; display: flex; justify-content: center">
           <a-image :src="options.src" />
         </div>
       </a-modal>
       <!-- 批量预览图片弹窗 -->
-      <a-modal
-        wrapClassName="batch-preview-modal"
-        v-model:visible="batchPicVisible"
-        title="图片批量预览"
-        :width="1060"
-        destroyOnClose
-        @cancel="videoClean"
-      >
+      <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%"
-          >
-            <a-image
-              width="500px"
-              height="281px"
-              :src="item.options.src"
-              fallback="data:image/png;base64,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"
-            />
+          <div v-for="item in videoList" :key="item.id" style="width: 100%; height: 100%">
+            <a-image width="500px" height="281px" :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-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"
-        title="视频批量预览"
-        :width="1060"
-        destroyOnClose
-        @cancel="videoClean"
-      >
+      <a-modal wrapClassName="batch-preview-modal" v-model:visible="batchVisible" 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%"
-          >
+          <div v-for="(item, index) in videoList" :key="item.id" style="width: 100%; height: 100%;position:relative">
+            <!-- 批量预览视频--遮罩 -->
+            <div class="batch-video-cover" @click="videoShowMsg(index)"></div>
             <p></p>
             <vue3VideoPlay v-bind="item.options" />
           </div>
         </div>
-        <a-pagination
-          v-model:current="current"
-          :total="videoTotal"
-          defaultPageSize="4"
-          :showSizeChanger="false"
-          @change="batchPreview"
-          show-less-items
-        />
+        <a-pagination v-model:current="current" :total="videoTotal" defaultPageSize="4" :showSizeChanger="false"
+          @change="batchPreview" show-less-items />
       </a-modal>
-      <a-modal
-        wrapClassName="wrj"
-        v-model:visible="wrjVisible"
-        :width="1000"
-        :title="wrjName + '详情'"
-        @ok="wrjVisible = false"
-      >
-        <template v-if="dataSource2[0].type !== '单兵设备'">
-          <div v-for="wrj in wrjData" :key="wrj.name">
-            <div
-              style="
-                font-size: 20px;
-                font-weight: 600;
-                margin: 10px 0;
-                text-align: center;
-              "
-            >
-              {{ wrj.name }}
-            </div>
-            <div
-              style="padding: 0 30px"
-              v-for="(value, key) in wrj.attribute"
-              :key="value"
-            >
-              {{ key + '：' + value }}
-            </div>
-          </div>
-        </template>
-        <template v-else>
-          <div v-for="(db, key) in wrjData" :key="key">
-            <template v-if="typeof db == 'object'">
-              <div
-                style="
+      <a-modal wrapClassName="wrj" v-model:visible="wrjVisible" :width="1000" :title="wrjName + '详情'"
+        @ok="wrjVisible = false">
+        <div v-for="(db, key) in wrjData" :key="key">
+          <template v-if="typeof db == 'object'">
+            <div style="
                   font-size: 20px;
                   font-weight: 600;
                   margin: 10px 0;
                   text-align: center;
-                "
-              >
-                {{ key }}
-              </div>
-              <div
-                style="padding: 0 30px"
-                v-for="(value, key2) in db"
-                :key="value"
-              >
+                ">
+              {{ db.attrType || '--' }}
+            </div>
+            <template v-if="db.attrValue">
+              <div style="padding: 0 30px" v-for="(value, key2) in JSON.parse(db.attrValue)" :key="value">
                 {{ key2 + '：' + value }}
               </div>
             </template>
-            <template v-else>
-              <div style="padding: 0 30px">
-                {{ key + '：' + db }}
-              </div>
-            </template>
-          </div>
-        </template>
+          </template>
+        </div>
       </a-modal>
     </div>
   </div>
 </template>
 <script setup>
-  import VideoSurveillance from '@/views/home/videoSurveillance'
-  // import { getCategoryTreePage } from '@/api/personalCenter'
-  // import { dataType } from 'element-plus/es/components/table-v2/src/common'
-  import { useRouter } from 'vue-router'
-  import { message, Upload } from 'ant-design-vue'
-  import {
-    ref,
-    reactive,
-    onMounted,
-    defineProps,
-    watch,
-    defineComponent,
-    nextTick,
-    defineExpose,
-  } from 'vue'
-  import {
-    getCameraByParentId,
-    getStreamByChannelCode,
-    getCameraAllLabel,
-    selectByChannelCode,
-  } from '@/api/videoSurveillance'
-  import { getCameraByCondition } from '@/api/file'
-  import {
-    sgcInsert,
-    getRoomSearch,
-    getDate,
-    setSubmit,
-    getYuyue,
-  } from '@/api/home'
-  import mybus from '@/myplugins/mybus'
-  import dayjs from 'dayjs'
-  import { Form } from 'ant-design-vue'
-  import moment from 'moment'
-  const props = defineProps({
-    // 模糊查
-    searchValue: { type: String, default: '' },
-  })
-  const current = ref(1)
-  const videoTotal = ref(0)
-  const router = useRouter()
-  const whoShow1 = ref(whoShow)
-  const isXiHaiAn = whoShow1.value.itShowXiHaiAn
-  const options = reactive({
-    width: '912px', //播放器宽度
-    height: '513px', //播放器高度
-    color: '#409eff', //主题色
-    title: '', //视频名称
-    src: '', //视频源
-    type: 'm3u8', // 视频源类型
-    muted: false, //静音
-    webFullScreen: false,
-    speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
-    autoPlay: isXiHaiAn, //自动播放
-    loop: false, //循环播放
-    mirror: false, //镜像画面
-    ligthOff: false, //关灯模式
-    volume: 0.3, //默认音量大小
-    control: true, //是否显示控制
-    controlBtns: [
-      'audioTrack',
-      'quality',
-      'speedRate',
-      'volume',
-      'setting',
-      'pip',
-      'pageFullScreen',
-      'fullScreen',
-    ], //显示所有按钮,
-  })
-  const videoList = ref([])
-  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,
-    current: 1,
-    pageSize: 10, //每页中显示10条数据
-    showSizeChanger: true,
-    pageSizeOptions: ['10', '30', '50', '100', '1000'], //每页中显示的数据
-  })
-  //会议室变量区域=======
-  const paginationRoom = ref({
-    total: 0,
-    current: 1,
-    pageSize: 10, //每页中显示10条数据
-    showSizeChanger: true,
-    pageSizeOptions: ['5', '10', '15', '20'], //每页中显示的数据
-  })
-  const formState = reactive({
-    // name: '',
-    // iphone: '18264084961',
-    // group: '',
-    // create: '',
-    // cerateTime: '',
-    // endTime: '',
-    // introduction: '',
-    // uploadRoom: '',
-    roomId: '',
-    bookDate: '', //日期
-    startTime: '', //开始时间
-    endTime: '', //结束时间
-    name: '',
-    phone: '',
-    dept: '',
-    matter: '',
-    file: '',
-  })
-  const fileList = ref([])
-  const useForm = Form.useForm
-  const roomInput = ref('')
-  const rulesRef = reactive({
-    bookDate: [
-      {
-        type: 'string',
-        required: true,
-        message: '请选择日期',
-      },
-    ],
-    startTime: [
-      {
-        type: 'string',
-        required: true,
-        message: '请选择时间段',
-      },
-    ],
-    name: [
-      {
-        required: true,
-        message: '请输入预约人',
-      },
-    ],
-    matter: [{ min: 1, max: 500, required: true, message: '可输入500字内容' }],
-    phone: [
-      {
-        required: true,
-        pattern: /^1[3|4|5|7|8][0-9]\d{8}$/,
-        message: '请输入正确的手机号',
-      },
-    ],
-    dept: [
-      {
-        required: true,
-        message: '请输入部门',
-      },
-    ],
-  })
-  const { resetFields, validateInfos, validate } = useForm(formState, rulesRef)
-  const mapSearchParam = ref({
-    // 地图搜索初始化数据
-    parentId: '',
-    cameraName: '',
-    checkStatus: '1',
-    pageNum: pagination.value.current,
-    pageSize: pagination.value.pageSize,
-    gpsX: '',
-    gpsY: '',
-    radius: '',
-    labelCodes: [],
-  })
-  const showMap = ref(true)
-  const room = ref(true)
-  const roomResult = ref(true)
-  const roomYuyue = ref(true)
-  const visibleRoom = ref(false)
-  const appointmentRoom = ref(false)
-  const labelPosition = ref('left')
-  const apiURL = window.SITE_CONFIG.apiURL
-  const roomList = ref([])
-  const roomPage = ref(1)
-  const roomLimit = ref(5)
-  const roomTotal = ref(0)
-  const pageSizeOptions = ref(['5', '10', '20', '50'])
-  const pageSizeOptionsChengguo = ref(['5', '10', '20', '50'])
-  const dateId = ref(null)
-  const roomDateList = ref([])
-  //开始时间---结束时间
-  const roomCerateDate = ref('')
-  const roomCreateTime = ref('')
-  const roomEndTime = ref('')
-  const roomModalCreateTime = ref('')
-  const roomModalEndTime = ref('')
-  const lookData = ref({})
+import VideoSurveillance from '@/views/home/videoSurveillance'
+import { useRouter } from 'vue-router'
+import { message, Upload } from 'ant-design-vue'
+import {
+  ref,
+  reactive,
+  onMounted,
+  defineProps,
+  watch,
+  defineComponent,
+  nextTick,
+  defineExpose,
+  computed,
 
-  // console.log('模糊查传递', props.searchValue)
-  if (props.searchValue) {
-    // console.log('模糊查传递')
-    // eslint-disable-next-line vue/no-setup-props-destructure
-    mapSearchParam.value.cameraName = props.searchValue
-  }
-  //===========================
-  onMounted(() => {
-    if (jcssType.value) {
-      tabClick(0, jcssType.value)
-      if (jcssType.value == '视频资源') {
-        getCamera()
-      }
-    } else {
-      tabClick(0, '政务云资源')
-      // getCamera()
-    }
+} from 'vue'
+import {
+  getCameraByParentId,
+  getStreamByChannelCode,
+  getCameraAllLabel,
+  selectByChannelCode,
+} from '@/api/videoSurveillance'
+import { getCameraByCondition } from '@/api/file'
+import {
+  sgcInsert,
+  getRoomSearch,
+  getDate,
+  setSubmit,
+  getYuyue,
+  getSoldierList,
+} from '@/api/home'
+import mybus from '@/myplugins/mybus'
+import dayjs from 'dayjs'
+import { Form } from 'ant-design-vue'
+import moment from 'moment'
+const props = defineProps({
+  // 模糊查
+  searchValue: { type: String, default: '' },
+})
+const current = ref(1)
+const videoTotal = ref(0)
+const router = useRouter()
+const whoShow1 = ref(whoShow)
+const isXiHaiAn = whoShow1.value.itShowXiHaiAn;
+const options = reactive({
+  width: '912px', //播放器宽度
+  height: '513px', //播放器高度
+  color: '#409eff', //主题色
+  title: '', //视频名称
+  src: '', //视频源
+  type: 'm3u8', // 视频源类型
+  muted: false, //静音
+  webFullScreen: false,
+  speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
+  autoPlay: isXiHaiAn ? false : true, //自动播放
+  loop: false, //循环播放
+  mirror: false, //镜像画面
+  ligthOff: false, //关灯模式
+  volume: 0.3, //默认音量大小
+  control: isXiHaiAn ? false : true, //是否显示控制
+  controlBtns: isXiHaiAn ? [] : [
+    'audioTrack',
+    'quality',
+    'speedRate',
+    'volume',
+    'setting',
+    'pip',
+    'pageFullScreen',
+    'fullScreen',
+  ], //显示所有按钮,
+})
+const videoList = ref([])
+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,
+  current: 1,
+  pageSize: 10, //每页中显示10条数据
+  showSizeChanger: true,
+  pageSizeOptions: ['10', '30', '50', '100', '1000'], //每页中显示的数据
+})
+//会议室变量区域=======
+const paginationRoom = ref({
+  total: 0,
+  current: 1,
+  pageSize: 10, //每页中显示10条数据
+  showSizeChanger: true,
+  pageSizeOptions: ['5', '10', '15', '20'], //每页中显示的数据
+})
+const formState = reactive({
+  roomId: '',
+  bookDate: '', //日期
+  startTime: '', //开始时间
+  endTime: '', //结束时间
+  name: '',
+  phone: '',
+  dept: '',
+  matter: '',
+  file: '',
+  roomName: '',
+})
+const fileList = ref([])
+const useForm = Form.useForm
+const roomInput = ref('')
+const rulesRef = reactive({
+  bookDate: [
+    {
+      type: 'string',
+      required: true,
+      message: '请选择日期',
+    },
+  ],
+  startTime: [
+    {
+      type: 'string',
+      required: true,
+      message: '请选择时间段',
+    },
+  ],
+  name: [
+    {
+      required: true,
+      message: '请输入预约人',
+    },
+  ],
+  matter: [{ min: 1, max: 500, required: true, message: '可输入500字内容' }],
+  phone: [
+    {
+      required: true,
+      pattern: /^1[3|4|5|7|8|9][0-9]\d{8}$/,
+      message: '请输入正确的手机号',
+    },
+  ],
+  dept: [
+    {
+      required: true,
+      message: '请输入部门',
+    },
+  ],
+})
+const { resetFields, validateInfos, validate } = useForm(formState, rulesRef)
+const mapSearchParam = ref({
+  // 地图搜索初始化数据
+  parentId: '',
+  cameraName: '',
+  checkStatus: '1',
+  pageNum: pagination.value.current,
+  pageSize: pagination.value.pageSize,
+  gpsX: '',
+  gpsY: '',
+  radius: '',
+  labelCodes: [],
+})
+const showMap = ref(true)
+const room = ref(true)
+const roomResult = ref(true)
+const roomYuyue = ref(true)
+const visibleRoom = ref(false)
+const appointmentRoom = ref(false)
+const labelPosition = ref('left')
+const apiURL = window.SITE_CONFIG.apiURL
+const roomList = ref([])
+const roomPage = ref(1)
+const roomLimit = ref(5)
+const roomTotal = ref(0)
+const pageSizeOptions = ref(['5', '10', '20', '50'])
+const pageSizeOptionsChengguo = ref(['5', '10', '20', '50'])
+const dateId = ref(null)
+const roomDateList = ref([])
+//开始时间---结束时间
+const roomCerateDate = ref('')
+const roomCreateTime = ref('')
+const roomEndTime = ref('')
+const roomModalCreateTime = ref('')
+const roomModalEndTime = ref('')
+const lookData = ref({})
 
-    mybus.off('getListByParentId')
-    mybus.on('getListByParentId', (parentId) => {
-      mapSearchParam.value.parentId = parentId
+// console.log('模糊查传递', props.searchValue)
+if (props.searchValue) {
+  mapSearchParam.value.cameraName = props.searchValue
+}
+onMounted(() => {
+  if (jcssType.value) {
+    tabClick(0, jcssType.value)
+    if (jcssType.value == '视频资源') {
       getCamera()
-    })
-    mybus.off('getListByMap')
-    mybus.on('getListByMap', (param) => {
-      mapSearchParam.value.gpsX = param.gpsX
-      mapSearchParam.value.gpsY = param.gpsY
-      mapSearchParam.value.radius = param.radius
-      getCamera()
-    })
+    }
+  } else {
+    tabClick(0, '视频资源')
+    getCamera()
+  }
+
+  mybus.off('getListByParentId')
+  mybus.on('getListByParentId', (parentId) => {
+    mapSearchParam.value.parentId = parentId
+    getCamera()
   })
-  const selectedList = ref([])
-  const selectedRowKeys = ref([])
-  const tabList = ref([
-    {
-      title: '设施类型',
-      content: ['政务云资源', '视频资源', '感知资源', '城市云脑会客厅'],
-    },
-    {
-      title: '视频标签',
-      content: [],
-    },
-  ])
-  const wrjVisible = ref(false)
-  const wrjName = ref('')
-  const wrjData = ref([])
-  const showWrj = (data) => {
-    wrjName.value = data.wrjName
-    wrjData.value = data.details
-    wrjVisible.value = true
-  }
-  const goToWrj = (data) => {
-    window.open(data.url)
-  }
-  const goToApply = (data) => {
-    console.log(data, dept)
-    let arr = [
-      {
-        arr: [
-          {
-            description:
-              '申请单兵手持便携终端，提告前端人员执法透明度，加强执法人员与指挥中心实时沟通。',
-            resourceId: 'dbsb',
-            resourceName: data.wrjName,
-            type: '单兵设备',
-          },
-        ],
-        deptId: dept.deptId,
-        deptName: dept.deptName,
-      },
-    ]
-    localStorage.setItem('applyList', JSON.stringify(arr))
-    router.push({
-      path: '/apply',
-    })
-  }
-  if (whoShow1.value.itShowXiHaiAn) {
-    tabList.value[0].content.push('无人机')
-    tabList.value[0].content.push('单兵设备')
-  }
-  // 打开视频预览
-  const openVideo = (id) => {
-    console.log('打开视频', id)
-    const param = {
-      key: id,
-    }
-    getStreamByChannelCode(param).then((res) => {
-      console.log(res)
-      visible.value = true
-      options.src = res.data.data
-    })
-  }
-  // 打开图片预览
-  const openPicture = (id) => {
-    console.log('打开图片', id)
-    const param = {
-      channelCode: id,
-    }
-    selectByChannelCode(param).then((res) => {
-      console.log(res)
-      if (res.data.data && res.data.data[0].picUrl) {
-        options.src = res.data.data[0].picUrl
-        picVisible.value = true
-      } else {
-        message.warning('该点位暂无预览图片！')
-      }
-    })
-  }
-  // const dataTypeList = () => {
-  //   if (tabList.value[0].content.indexOf('视频资源') != -1) {
-  //     tabList.value[1].content = ['123344', '213124']
-  //   }else if(tabList.value[0].content.indexOf('政务云资源') != -1){
-  //     tabList.value[1].content = ['5555', '666']
+  mybus.off('getListByMap')
+  mybus.on('getListByMap', (param) => {
+    mapSearchParam.value.gpsX = param.gpsX
+    mapSearchParam.value.gpsY = param.gpsY
+    mapSearchParam.value.radius = param.radius
+    getCamera()
+  })
+})
+const selectedList = ref([])
+const selectedRowKeys = ref([])
+const tabList = ref([
+  {
+    title: '设施类型',
+    content: isXiHaiAn ? ['视频资源'] : ['视频资源', '云资源', '感知资源', '城市云脑会客厅'],
+  },
+])
+if (!isXiHaiAn) {
+  tabList.value.push({
+    title: '视频标签',
+    content: [],
+  })
+}
+const wrjVisible = ref(false)
+const wrjName = ref('')
+const wrjData = ref([])
 
-  //   }
-  // }
-  // dataTypeList()
-  //初始化数据
-  const init = () => {
-    tabList.value.map((item) => {
-      let params = {
-        title: item.title,
-        content: [],
-      }
-      clickList.value.push(params)
-    })
-    mybus.off('tranferToList')
-    mybus.on('tranferToList', () => {
-      console.log('获取到的列表数据')
-    })
-  }
-  let clickList = ref([]) //存储点击的tab
-  init()
-  //点击会议室左侧切换
-  const result = () => {
-    roomYuyue.value = false
-    roomResult.value = true
-    chengguoSearch()
-  }
-  const chengguoSearch = () => {
-    let query = {
-      page: roomPage.value,
-      limit: roomLimit.value,
-      roomName: roomInput.value,
-    }
-    getYuyue(query).then(({ data: res }) => {
-      dataRoom.value = res.data.list
-      roomTotal.value = res.data.total
-    })
-  }
-  const roomResults = () => {
-    roomYuyue.value = true
-    roomResult.value = false
-  }
-  // 查看详情
-  const look = (row) => {
-    visibleRoom.value = true
-    lookData.value = row
-  }
-  //   搜索
-  const onSearch = (searchValue) => {
-    searchData()
-    chengguoSearch()
-  }
-  //重置
-  const reSetSearch = () => {
-    roomInput.value = ''
-    searchData()
-    chengguoSearch()
-  }
-  // 时间选择器限制----可用时间查询
-  //获取不可选择的小时
-  const disabledStartHours = () => {
-    if (roomEndTime.value) {
-      let hours = []
-      let hour = moment().hour()
-      for (let i = hour + 1; i < 24; i++) {
-        hours.push(i)
-      }
-      return hours
-    }
-  }
-  //获取不可选择的分钟
-  const disabledStartMinutes = (selectedHour) => {
-    if (roomEndTime.value) {
-      let minutes = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      if (selectedHour === hour) {
-        for (let i = minute + 1; i < 60; i++) {
-          minutes.push(i)
-        }
-      }
-      return minutes
-    }
-  }
-  //获取不可选择的秒
-  const disabledStartSeconds = (selectedHour, selectedMinute) => {
-    if (roomEndTime.value) {
-      let seconds = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      let second = moment().second()
-      if (selectedHour === hour && selectedMinute.value === minute) {
-        for (let i = second + 1; i < 60; i++) {
-          seconds.push(i)
-        }
-      }
-      return seconds
-    }
-  }
-  //获取不可选择的小时
-  const disabledEndHours = () => {
-    if (roomCreateTime.value) {
-      let hours = []
-      let hour = moment().hour()
-      for (let i = 0; i < hour; i++) {
-        hours.push(i)
-      }
-      return hours
-    }
-  }
-  //获取不可选择的分钟
-  const disabledEndMinutes = (selectedHour) => {
-    if (roomCreateTime.value) {
-      let minutes = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      if (selectedHour === hour) {
-        for (let i = 0; i < minute; i++) {
-          minutes.push(i)
-        }
-      }
-      return minutes
-    }
-  }
-  //获取不可选择的秒
-  const disabledEndSeconds = (selectedHour, selectedMinute) => {
-    if (roomCreateTime.value) {
-      let seconds = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      let second = moment().second()
-      if (selectedHour === hour && selectedMinute.value === minute) {
-        for (let i = 0; i < second; i++) {
-          seconds.push(i)
-        }
-      }
-      return seconds
-    }
-  }
-  // 时间选择器限制----会议室预约时段
-  //获取不可选择的小时
-  const disabledTimeHours = () => {
-    if (formState.endTime) {
-      let hours = []
-      let hour = moment().hour()
-      for (let i = hour + 1; i < 24; i++) {
-        hours.push(i)
-      }
-      return hours
-    }
-  }
-  //获取不可选择的分钟
-  const disabledTimeMinutes = (selectedHour) => {
-    if (formState.endTime) {
-      let minutes = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      if (selectedHour === hour) {
-        for (let i = minute + 1; i < 60; i++) {
-          minutes.push(i)
-        }
-      }
-      return minutes
-    }
-  }
-  //获取不可选择的秒
-  const disabledTimeSeconds = (selectedHour, selectedMinute) => {
-    if (formState.endTime) {
-      let seconds = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      let second = moment().second()
-      if (selectedHour === hour && selectedMinute.value === minute) {
-        for (let i = second + 1; i < 60; i++) {
-          seconds.push(i)
-        }
-      }
-      return seconds
-    }
-  }
-  //获取不可选择的小时
-  const disabledTimeEndHours = () => {
-    if (formState.startTime) {
-      let hours = []
-      let hour = moment().hour()
-      for (let i = 0; i < hour; i++) {
-        hours.push(i)
-      }
-      return hours
-    }
-  }
-  //获取不可选择的分钟
-  const disabledTimeEndMinutes = (selectedHour) => {
-    if (formState.startTime) {
-      let minutes = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      if (selectedHour === hour) {
-        for (let i = 0; i < minute; i++) {
-          minutes.push(i)
-        }
-      }
-      return minutes
-    }
-  }
-  //获取不可选择的秒
-  const disabledTimeEndSeconds = (selectedHour, selectedMinute) => {
-    if (formState.startTime) {
-      let seconds = []
-      let hour = moment().hour()
-      let minute = moment().minute()
-      let second = moment().second()
-      if (selectedHour === hour && selectedMinute.value === minute) {
-        for (let i = 0; i < second; i++) {
-          seconds.push(i)
-        }
-      }
-      return seconds
-    }
-  }
-  //分页
-  const onRoomChange = (pageNumber) => {
-    roomPage.value = pageNumber
-    searchData()
-  }
-  const onShowSizeChange = (current, pageSize) => {
-    roomLimit.value = pageSize
-    searchData()
-  }
-  const onRoomChangeChengguo = (pageNumber) => {
-    roomPage.value = pageNumber
-    chengguoSearch()
-  }
-  const onShowSizeChangeChengguo = (current, pageSize) => {
-    roomLimit.value = pageSize
-    chengguoSearch()
-  }
-  //预约
-  const appointment = (item) => {
-    dateId.value = item.id
-    formState.roomId = item.id
-    appointmentRoom.value = true
-  }
-  //预约弹框 选择日期
-  const handleChange = (i) => {
-    let query = {
-      date: i, //查询的riqi
-      roomId: dateId.value, //会议室主键
-    }
-    getDate(query).then(({ data: res }) => {
-      roomDateList.value = res.data
-    })
-  }
+// 单兵、无人机-详情
+const showWrj = (data) => {
+  wrjName.value = data.wrjName
+  wrjData.value = data.deviceAttrDTOList || []
+  wrjVisible.value = true
+}
+const goToWrj = (data) => {
+  window.open(data.url)
+}
 
-  const columnsRomm = [
+// 西海岸-无人机、单兵设备申请
+const goToApply = (data) => {
+  console.log(data, dept)
+  let arr = [
     {
-      title: '会议室名称',
-      dataIndex: 'roomName',
-      align: 'center',
-    },
-    {
-      title: '预约时段',
-      key: 'bookDate',
-      align: 'center',
-    },
-    {
-      title: '预约状态',
-      key: 'state',
-      align: 'center',
-    },
-    {
-      title: '预约详情',
-      key: 'action',
-      align: 'center',
+      arr: [
+        {
+          // description:
+          //   '申请单兵手持便携终端，提告前端人员执法透明度，加强执法人员与指挥中心实时沟通。',
+          // resourceId: 'dbsb',
+          // type: '单兵设备',
+          description: data.description,
+          resourceId: data.id,
+          resourceName: data.wrjName,
+          type: data.type,
+        },
+      ],
+      deptId: dept.deptId || data.deptId || '',
+      deptName: dept.deptName,
     },
   ]
-  const dataRoom = ref([])
-  const bodystyle = {
-    paddingTop: 0,
-    borderBottom: 0,
+  localStorage.setItem('applyList', JSON.stringify(arr))
+  router.push({
+    path: '/apply',
+  })
+}
+if (whoShow1.value.itShowXiHaiAn) {
+  tabList.value[0].content.push('无人机')
+  tabList.value[0].content.push('单兵设备')
+}
+
+// 单个预览，当前点击数据
+const rowClickData = ref(null)
+// 打开视频预览 todo1
+const openVideo = (id, item) => {
+  if(item) {
+    rowClickData.value = item;
   }
-  const handleOk = (e) => {
-    console.log(e)
+  console.log('打开视频', id)
+  const param = {
+    key: id,
   }
-  //文件上传成功回调
-  const roomUpload = (response) => {
-    if (response.file.response !== undefined) {
-      fileList.value = response.fileList
-      formState.file = response.file.response.data
-    }
+  getStreamByChannelCode(param).then((res) => {
+    console.log(res)
+    visible.value = true
+    options.src = res.data.data
+  })
+  // // 视频测试--勿删
+  // visible.value = true
+  // options.src = 'http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8'
+}
+// 打开图片预览
+const openPicture = (id) => {
+  console.log('打开图片', id)
+  const param = {
+    channelCode: id,
   }
-  //提交预约
-  const onSubmit = () => {
-    validate()
-      .then(() => {
-        setSubmit(formState).then(({ data: res }) => {
-          appointmentRoom.value = false
-          formState.roomId = ''
-          formState.bookDate = ''
-          formState.startTime = '' //开始时间
-          formState.endTime = '' //结束时间
-          formState.name = ''
-          formState.phone = ''
-          formState.dept = ''
-          formState.matter = ''
-          formState.file = ''
-          fileList.value = []
-          searchData()
-        })
-      })
-      .catch((err) => {
-        console.log('error', err)
-      })
-  }
-  //会议室查询接口
-  const searchData = () => {
-    let query = {
-      bookDate: roomCerateDate.value, //	预约开始时间 年月日
-      startTime: roomCreateTime.value, //预约开始时 间时分秒
-      endTime: roomEndTime.value, //	预约结束时间
-      name: roomInput.value, //会议室名称
-      page: roomPage.value, //页码
-      limit: roomLimit.value, //每页条数
-    }
-    getRoomSearch(query).then(({ data: res }) => {
-      roomList.value = res.data.list
-      roomTotal.value = res.data.total
-    })
-  }
-  const emits = defineEmits(['add'])
-  //表格的高度
-  let tableHeight = ref('600')
-  //tab切换点击事件
-  const tabClick = (indexFather, name) => {
-    console.log(
-      '点击tab================>',
-      indexFather,
-      name,
-      clickList.value[indexFather]
-    )
-    selectedRowKeys.value = []
-    selectedList.value = []
-    if (clickList.value[indexFather].content.indexOf(name) != -1) {
-      if (name == '视频资源') {
-        cloudResourcesFlag.value = false
-        room.value = true
-        tableHeight.value = 330
-        showMap.value = true
-        tabList.value[1].title = '视频标签'
-      } else if (name == '政务云资源') {
-        cloudResourcesFlag.value = true
-        room.value = true
-        tableHeight.value = 600
-        showMap.value = false
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
-        tabList.value[1].title = '政务云资源分类'
-      } else if (name == '感知资源') {
-        cloudResourcesFlag.value = false
-        room.value = true
-        tableHeight.value = 330
-        showMap.value = true
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
-      } else if (name == '城市云脑会客厅') {
-        cloudResourcesFlag.value = false
-        //     room.value = false
-        //     wrjFlag.value = true
-        //     showMap.value = false
-        // roomYuyue.value = true
-        //     roomResult.value = false
-        //     tabList.value[1] = []
-        //     emits('add', 6)
-        //     searchData()
-      }
-      clickList.value[indexFather].content.splice(
-        clickList.value[indexFather].content.indexOf(name),
-        1
-      )
+  selectByChannelCode(param).then((res) => {
+    console.log(res)
+    if (res.data.data && res.data.data[0].picUrl) {
+      options.src = res.data.data[0].picUrl
+      picVisible.value = true
     } else {
-      if (name == '视频资源') {
-        wrjFlag.value = false
-        cloudResourcesFlag.value = false
-        tableHeight.value = 330
-        showMap.value = true
-        tabList.value[1].content = []
-        clickList.value[1].content = []
+      message.warning('该点位暂无预览图片！')
+    }
+  })
+}
+
+//初始化数据
+const init = () => {
+  tabList.value.map((item) => {
+    let params = {
+      title: item.title,
+      content: [],
+    }
+    clickList.value.push(params)
+  })
+  mybus.off('tranferToList')
+  mybus.on('tranferToList', () => {
+    console.log('获取到的列表数据')
+  })
+}
+let clickList = ref([]) //存储点击的tab
+init()
+//点击会议室左侧切换
+const result = () => {
+  roomYuyue.value = false
+  roomResult.value = true
+  chengguoSearch()
+}
+const chengguoSearch = () => {
+  let query = {
+    page: roomPage.value,
+    limit: roomLimit.value,
+    roomName: roomInput.value,
+  }
+  getYuyue(query).then(({ data: res }) => {
+    dataRoom.value = res.data.list
+    roomTotal.value = res.data.total
+  })
+}
+const roomResults = () => {
+  roomYuyue.value = true
+  roomResult.value = false
+}
+// 查看详情
+const look = (row) => {
+  visibleRoom.value = true
+  lookData.value = row
+}
+//   搜索
+const onSearch = (searchValue) => {
+  searchData()
+  chengguoSearch()
+}
+//重置
+const reSetSearch = () => {
+  roomInput.value = ''
+  searchData()
+  chengguoSearch()
+}
+// 时间选择器限制----可用时间查询
+//获取不可选择的小时
+const disabledStartHours = () => {
+  if (roomEndTime.value) {
+    let hours = []
+    let hour = roomEndTime.value.substr(0, 2)
+    for (let i = hour; i < 24; i++) {
+      hours.push(i)
+    }
+    return hours
+  }
+}
+//获取不可选择的分钟
+const disabledStartMinutes = (selectedHour) => {
+  if (roomEndTime.value) {
+    let minutes = []
+    let hour = roomEndTime.value.substr(0, 2)
+    let minute = roomEndTime.value.substr(3, 2)
+    if (selectedHour == hour) {
+      for (let i = minute; i < 60; i++) {
+        minutes.push(i)
+      }
+    }
+    return minutes
+  }
+}
+//获取不可选择的秒
+const disabledStartSeconds = (selectedHour, selectedMinute) => {
+  if (roomEndTime.value) {
+    let seconds = []
+    let hour = roomEndTime.value.substr(0, 2)
+    let minute = roomEndTime.value.substr(3, 2)
+    let second = roomEndTime.value.substr(6, 2)
+    if (selectedHour == hour && selectedMinute.value == minute) {
+      for (let i = second - 1; i < 60; i++) {
+        seconds.push(i)
+      }
+    }
+    return seconds
+  }
+}
+//获取不可选择的小时
+const disabledEndHours = () => {
+  if (roomCreateTime.value) {
+    let hours = []
+    let hour = roomCreateTime.value.substr(0, 2)
+    for (let i = 0; i < hour; i++) {
+      hours.push(i)
+    }
+    return hours
+  }
+}
+//获取不可选择的分钟
+const disabledEndMinutes = (selectedHour) => {
+  if (roomCreateTime.value) {
+    let minutes = []
+    let hour = roomCreateTime.value.substr(0, 2)
+    let minute = roomCreateTime.value.substr(3, 2)
+    if (selectedHour == hour) {
+      for (let i = 0; i < minute; i++) {
+        minutes.push(i)
+      }
+    }
+    return minutes
+  }
+}
+//获取不可选择的秒
+const disabledEndSeconds = (selectedHour, selectedMinute) => {
+  if (roomCreateTime.value) {
+    let seconds = []
+    let hour = roomCreateTime.value.substr(0, 2)
+    let minute = roomCreateTime.value.substr(3, 2)
+    let second = roomCreateTime.value.substr(6, 2)
+    if (selectedHour == hour && selectedMinute.value == minute) {
+      for (let i = 0; i <= second; i++) {
+        seconds.push(i)
+      }
+    }
+    return seconds
+  }
+}
+// 时间选择器限制----会议室预约时段
+//获取不可选择的小时
+const disabledTimeHours = () => {
+  if (formState.endTime) {
+    let hours = []
+    let hour = formState.endTime.substr(0, 2)
+    for (let i = hour; i < 24; i++) {
+      hours.push(i)
+    }
+    return hours
+  }
+}
+//获取不可选择的分钟
+const disabledTimeMinutes = (selectedHour) => {
+  if (formState.endTime) {
+    let minutes = []
+    let hour = formState.endTime.substr(0, 2)
+    let minute = formState.endTime.substr(3, 2)
+    if (selectedHour == hour) {
+      for (let i = minute; i < 60; i++) {
+        minutes.push(i)
+      }
+    }
+    return minutes
+  }
+}
+//获取不可选择的秒
+const disabledTimeSeconds = (selectedHour, selectedMinute) => {
+  if (formState.endTime) {
+    let seconds = []
+    let hour = formState.endTime.substr(0, 2)
+    let minute = formState.endTime.substr(3, 2)
+    let second = formState.endTime.substr(6, 2)
+    if (selectedHour == hour && selectedMinute.value == minute) {
+      for (let i = second - 1; i < 60; i++) {
+        seconds.push(i)
+      }
+    }
+    return seconds
+  }
+}
+//获取不可选择的小时
+const disabledTimeEndHours = () => {
+  if (formState.startTime) {
+    let hours = []
+    let hour = formState.startTime.substr(0, 2)
+    for (let i = 0; i < hour; i++) {
+      hours.push(i)
+    }
+    return hours
+  }
+}
+//获取不可选择的分钟
+const disabledTimeEndMinutes = (selectedHour) => {
+  if (formState.startTime) {
+    let minutes = []
+    let hour = formState.startTime.substr(0, 2)
+    let minute = formState.startTime.substr(3, 2)
+    if (selectedHour == hour) {
+      for (let i = 0; i < minute; i++) {
+        minutes.push(i)
+      }
+    }
+    return minutes
+  }
+}
+//获取不可选择的秒
+const disabledTimeEndSeconds = (selectedHour, selectedMinute) => {
+  if (formState.startTime) {
+    let seconds = []
+    let hour = formState.startTime.substr(0, 2)
+    let minute = formState.startTime.substr(3, 2)
+    let second = formState.startTime.substr(6, 2)
+    if (selectedHour == hour && selectedMinute.value == minute) {
+      for (let i = 0; i <= second; i++) {
+        seconds.push(i)
+      }
+    }
+    return seconds
+  }
+}
+//分页
+const onRoomChange = (pageNumber) => {
+  roomPage.value = pageNumber
+  searchData()
+}
+const onShowSizeChange = (current, pageSize) => {
+  roomLimit.value = pageSize
+  searchData()
+}
+const onRoomChangeChengguo = (pageNumber) => {
+  roomPage.value = pageNumber
+  chengguoSearch()
+}
+const onShowSizeChangeChengguo = (current, pageSize) => {
+  roomLimit.value = pageSize
+  chengguoSearch()
+}
+//预约
+const appointment = (item) => {
+  dateId.value = item.id
+  formState.roomId = item.id
+  formState.roomName = item.name
+  appointmentRoom.value = true
+}
+//预约弹框 选择日期
+const handleChange = (i) => {
+  let query = {
+    date: i, //查询的riqi
+    roomId: dateId.value, //会议室主键
+  }
+  getDate(query).then(({ data: res }) => {
+    roomDateList.value = res.data
+  })
+}
+
+const columnsRomm = [
+  {
+    title: '会议室名称',
+    dataIndex: 'roomName',
+    align: 'center',
+  },
+  {
+    title: '预约时段',
+    key: 'bookDate',
+    align: 'center',
+  },
+  {
+    title: '预约状态',
+    key: 'state',
+    align: 'center',
+  },
+  {
+    title: '预约详情',
+    key: 'action',
+    align: 'center',
+  },
+]
+const dataRoom = ref([])
+const bodystyle = {
+  paddingTop: 0,
+  borderBottom: 0,
+}
+const handleOk = (e) => {
+  console.log(e)
+}
+//文件上传成功回调
+const roomUpload = (response) => {
+  if (response.file.response !== undefined) {
+    fileList.value = response.fileList
+    formState.file = response.file.response.data
+  }
+}
+//提交预约
+const onSubmit = () => {
+  validate()
+    .then(() => {
+      setSubmit(formState).then(({ data: res }) => {
+        appointmentRoom.value = false
+        rulesRef.bookDate = []
+        rulesRef.startTime = []
+        rulesRef.name = []
+        rulesRef.matter = []
+        rulesRef.phone = []
+        rulesRef.dept = []
+        formState.roomId = ''
+        formState.bookDate = ''
+        formState.startTime = '' //开始时间
+        formState.endTime = '' //结束时间
+        formState.name = ''
+        formState.phone = ''
+        formState.dept = ''
+        formState.matter = ''
+        formState.file = ''
+        fileList.value = []
+        searchData()
+      })
+    })
+    .catch((err) => {
+      console.log('error', err)
+    })
+}
+//会议室查询接口
+const searchData = () => {
+  let query = {
+    bookDate: roomCerateDate.value, //	预约开始时间 年月日
+    startTime: roomCreateTime.value, //预约开始时 间时分秒
+    endTime: roomEndTime.value, //	预约结束时间
+    name: roomInput.value, //会议室名称
+    page: roomPage.value, //页码
+    limit: roomLimit.value, //每页条数
+  }
+  getRoomSearch(query).then(({ data: res }) => {
+    roomList.value = res.data.list
+    roomTotal.value = res.data.total
+  })
+}
+const emits = defineEmits(['add'])
+//表格的高度
+let tableHeight = ref('600')
+//tab切换点击事件
+const tabClick = (indexFather, name) => {
+  console.log(
+    '点击tab================>',
+    indexFather,
+    name,
+    clickList.value[indexFather]
+  )
+  selectedRowKeys.value = []
+  selectedList.value = []
+  if (clickList.value[indexFather].content.indexOf(name) != -1) {
+    if (name == '视频资源') {
+      room.value = true
+      tableHeight.value = 330
+      showMap.value = true
+      if (tabList.value[1]) {
         tabList.value[1].title = '视频标签'
-        clickList.value[indexFather].content[0] = name
-        dataSource.value = []
-        dataSource2.value = []
-        room.value = true
-        getCameraAllLabel().then((res) => {
-          res.data.data.forEach((val) => {
+      }
+
+    } else if (name == '云资源') {
+      room.value = true
+      tableHeight.value = 600
+      showMap.value = false
+      dataSource.value = []
+      dataSource2.value = []
+      pagination.value.total = 0
+      if (tabList.value[1]) {
+        tabList.value[1].title = '云资源分类'
+      }
+    } else if (name == '感知资源') {
+      room.value = true
+      tableHeight.value = 330
+      showMap.value = true
+      dataSource.value = []
+      dataSource2.value = []
+      pagination.value.total = 0
+    } else if (name == '城市云脑会客厅') {
+      //     room.value = false
+      //     wrjFlag.value = true
+      //     showMap.value = false
+      // roomYuyue.value = true
+      //     roomResult.value = false
+      //     tabList.value[1] = []
+      //     emits('add', 6)
+      //     searchData()
+    }
+    clickList.value[indexFather].content.splice(
+      clickList.value[indexFather].content.indexOf(name),
+      1
+    )
+  } else {
+    if (name == '视频资源') {
+      wrjFlag.value = false
+      tableHeight.value = 330
+      showMap.value = true
+      if (tabList.value[1]) {
+        tabList.value[1].content = []
+        tabList.value[1].title = '视频标签'
+      }
+      if (clickList.value[1]) {
+        clickList.value[1].content = []
+      }
+      clickList.value[indexFather].content[0] = name
+      dataSource.value = []
+      dataSource2.value = []
+      room.value = true
+      getCameraAllLabel().then((res) => {
+        res.data.data.forEach((val) => {
+          if (tabList.value[1]) {
             tabList.value[1].content.push({
               labelCode: val.labelCode,
               labelName: val.labelName,
             })
-          })
+          }
         })
-        // 改变查询摄像头接口的labelCode数组
-        mapSearchParam.value.labelCodes = []
+      })
+      // 改变查询摄像头接口的labelCode数组
+      mapSearchParam.value.labelCodes = []
+      if (clickList.value[1]) {
         clickList.value[1].content.map((item) => {
           mapSearchParam.value.labelCodes.push(item.labelCode)
         })
-        console.log('选中的标签code', mapSearchParam.value)
-        mapSearchParam.value.labelCodes = mapSearchParam.value.labelCodes + ''
-        emits('add', 1)
-        getCamera()
-      } else if (name == '政务云资源') {
-        cloudResourcesFlag.value = true
-        tableHeight.value = 600
-        showMap.value = false
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
+      }
+      console.log('选中的标签code', mapSearchParam.value)
+      mapSearchParam.value.labelCodes = mapSearchParam.value.labelCodes + ''
+      emits('add', 1)
+      getCamera()
+    } else if (name == '云资源') {
+      tableHeight.value = 600
+      showMap.value = false
+      dataSource.value = []
+      dataSource2.value = []
+      pagination.value.total = 0
+      if (clickList.value[1]) {
         clickList.value[1].content = []
-        tabList.value[1].title = '政务云资源分类'
-        clickList.value[indexFather].content[0] = name
+      }
+      clickList.value[indexFather].content[0] = name
+      if (tabList.value[1]) {
+        tabList.value[1].title = '云资源分类'
         tabList.value[1].content = [
           '云主机',
           '算力主机',
@@ -1442,434 +1169,459 @@
           '负载均衡',
           '公网IP',
         ]
-        room.value = true
-        wrjFlag.value = false
-        emits('add', 2)
-      } else if (name == '感知资源') {
-        cloudResourcesFlag.value = false
-        tableHeight.value = 330
-        showMap.value = true
-        clickList.value[1].content = []
-        pagination.value.total = 0
-        tabList.value[1].title = '感知资源分类'
-        clickList.value[indexFather].content[0] = name
-        tabList.value[1].content = []
-        dataSource.value = []
-        dataSource2.value = []
-        room.value = true
-        wrjFlag.value = false
-        emits('add', 3)
-      } else if (name == '无人机') {
-        cloudResourcesFlag.value = false
-        room.value = true
-        tableHeight.value = 600
-        showMap.value = false
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
-        clickList.value[1].content = []
-        clickList.value[indexFather].content[0] = name
-        tabList.value[1].title = ''
-        tabList.value[1].content = []
-        uavAndIndividualSoldier.uavList.map((wrj) => {
-          dataSource2.value.push({
-            wrjName: wrj.name,
-            wrjState: '已申请',
-            url: wrj.url,
-            details: wrj.details,
-          })
-        })
-        wrjFlag.value = true
-      } else if (name == '单兵设备') {
-        cloudResourcesFlag.value = false
-        room.value = true
-        tableHeight.value = 600
-        showMap.value = false
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
-        clickList.value[1].content = []
-        clickList.value[indexFather].content[0] = name
-        tabList.value[1].title = ''
-        tabList.value[1].content = []
-        uavAndIndividualSoldier.individualSoldier.map((db) => {
-          dataSource2.value.push({
-            wrjName: db.name,
-            wrjState: '未申请',
-            details: db.details,
-            type: db.type,
-          })
-        })
-        wrjFlag.value = true
-      } else if (name == '城市云脑会客厅') {
-        cloudResourcesFlag.value = false
-        showMap.value = false
-        dataSource.value = []
-        dataSource2.value = []
-        pagination.value.total = 0
-        clickList.value[1].content = []
-        clickList.value[indexFather].content[0] = name
-        tabList.value[1].title = ''
-        tabList.value[1].content = []
-        wrjFlag.value = true
-        room.value = false
-        // wrjFlag.value = true
-        // showMap.value = false
-        roomYuyue.value = true
-        roomResult.value = false
-        // tabList.value[1] = []
-        emits('add', 6)
-        searchData()
-      } else {
-        clickList.value[indexFather].content.push(name)
       }
-    }
-    // 改变查询摄像头接口的labelCode数组
-    mapSearchParam.value.labelCodes = []
-    clickList.value[1].content.map((item) => {
-      mapSearchParam.value.labelCodes.push(item.labelCode)
-    })
-    console.log('选中的标签code', mapSearchParam.value)
-    mapSearchParam.value.labelCodes = mapSearchParam.value.labelCodes + ''
-    // let fatherName = ref('视频资源')
-    // if (name == '视频资源' || name == '政务云资源' || name == '感知资源') {
-    //   fatherName.value == name
-    // }
-    // if (fatherName.value == '视频资源') {
-    //   getCamera()
-    // } else {
-    //   dataSource.value = []
-    //   pagination.value.total = 0
-    // }
-    if (name == '政务云资源' || name == '感知资源') {
+      room.value = true
+      wrjFlag.value = false
+      emits('add', 2)
+    } else if (name == '感知资源') {
+      tableHeight.value = 330
+      showMap.value = true
+      if (clickList.value[1]) {
+        clickList.value[1].content = []
+      }
+      pagination.value.total = 0
+      clickList.value[indexFather].content[0] = name
+      if (tabList.value[1]) {
+        tabList.value[1].content = []
+        tabList.value[1].title = '感知资源分类'
+      }
+      dataSource.value = []
+      dataSource2.value = []
+      room.value = true
+      wrjFlag.value = false
+      emits('add', 3)
+    } else if (name == '无人机') {
+      pagination.value.current = 1;
+      getSoldierData(indexFather, name)
+    } else if (name == '单兵设备') {
+      pagination.value.current = 1;
+      getSoldierData(indexFather, name)
+    } else if (name == '城市云脑会客厅') {
+      showMap.value = false
       dataSource.value = []
       dataSource2.value = []
       pagination.value.total = 0
+      if (clickList.value[1]) {
+        clickList.value[1].content = []
+      }
+      clickList.value[indexFather].content[0] = name
+      if (tabList.value[1]) {
+        tabList.value[1].content = []
+        tabList.value[1].title = ''
+      }
+      wrjFlag.value = true
+      room.value = false
+      roomYuyue.value = true
+      roomResult.value = false
+      emits('add', 6)
+      searchData()
     } else {
-      if (name !== '无人机' && name !== '单兵设备') {
-        getCamera()
+      if (clickList.value[indexFather]) {
+        clickList.value[indexFather].content.push(name)
       }
     }
   }
-  // 打开视频批量预览
-  const batchPreview = 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 = {
-          key: list[index].channelId,
-        }
-        let ob = {
-          options: {
-            width: '512px', //播放器宽度
-            height: '288px', //播放器高度
-            color: '#409eff', //主题色
-            title: '', //视频名称
-            src: '', //视频源
-            type: 'm3u8', // 视频源类型
-            muted: false, //静音
-            webFullScreen: false,
-            speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
-            autoPlay: isXiHaiAn, //自动播放
-            loop: false, //循环播放
-            mirror: false, //镜像画面
-            ligthOff: false, //关灯模式
-            volume: 0.3, //默认音量大小
-            control: true, //是否显示控制
-            controlBtns: [
-              'audioTrack',
-              'quality',
-              'speedRate',
-              'volume',
-              'setting',
-              'pip',
-              'pageFullScreen',
-              'fullScreen',
-            ], //显示所有按钮,
-          },
-        }
-        await getStreamByChannelCode(param).then((res) => {
-          ob.options.src = res.data.data
-          console.log('监测ob的变化', ob)
-          videoList.value.push(ob)
-        })
-      }
-      console.log('验证数据的准确性', videoList)
-      batchVisible.value = true
-    } else {
-      message.error('请选择需要预览的数据')
+  // 改变查询摄像头接口的labelCode数组
+  mapSearchParam.value.labelCodes = []
+  if (clickList.value[1]) {
+    clickList.value[1].content.map((item) => {
+      mapSearchParam.value.labelCodes.push(item.labelCode)
+    })
+  }
+  console.log('选中的标签code', mapSearchParam.value)
+  mapSearchParam.value.labelCodes = mapSearchParam.value.labelCodes + ''
+
+  if (name == '云资源' || name == '感知资源') {
+    dataSource.value = []
+    dataSource2.value = []
+    pagination.value.total = 0
+  } else {
+    if (name !== '无人机' && name !== '单兵设备') {
+      getCamera()
     }
   }
-  // 打开图片批量预览
-  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 = () => {
+}
+
+// 无人机、单兵设备状态
+const wrjStateObj = {
+  0: '待审批',
+  1: '未申请',
+  2: '通过',
+  3: '未通过'
+}
+// 获取无人机、单兵设备
+const getSoldierData = (indexFather, name) => {
+  room.value = true
+  tableHeight.value = 600
+  showMap.value = false
+  dataSource.value = []
+  dataSource2.value = []
+  if (clickList.value[1]) {
     clickList.value[1].content = []
-    mapSearchParam.value.labelCodes = ''
-    getCamera()
-    console.log('hhhhhhhh')
   }
-  // 重置
-  const clean = () => {
-    mapSearchParam.value.cameraName = ''
-    selectedList.value = []
-    selectedRowKeys.value = []
+  clickList.value[indexFather].content[0] = name
+  if (tabList.value[1]) {
+    tabList.value[1].title = ''
+    tabList.value[1].content = []
+  }
+  wrjFlag.value = true
+
+  let _params = {
+    type: name,
+    page: pagination.value.current,
+    limit: pagination.value.pageSize,
+  }
+  getSoldierList(_params).then(res => {
+    console.log('res---获取无人机、单兵设备--------->', res);
+    if (res.data.code !== 0) {
+      return message.error(res.data.msg)
+    }
+    let { list = [], total = 0 } = res.data.data;
+    console.log('total------------>', total);
+
+    pagination.value.total = total
+    if (name == '无人机') {
+      list.map((wrj) => {
+        dataSource2.value.push({
+          wrjName: wrj.name,
+          wrjState: wrjStateObj[wrj.state],
+          url: wrj.url,
+          details: wrj.details,
+          ...wrj
+        })
+      })
+    }
+    if (name == '单兵设备') {
+      list.map((db) => {
+        dataSource2.value.push({
+          wrjName: db.name,
+          wrjState: wrjStateObj[db.state],
+          details: db.details,
+          type: db.type,
+          ...db
+        })
+      })
+    }
+
+  }).catch(err => {
+    message.error(err)
+  })
+}
+// 打开视频批量预览
+const batchPreview = 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 = []
-    pagination.value.current = 1
-    mapSearchParam.value.pageNum = 1
-    pagination.value.pageSize = 10
-    getCamera()
-  }
-  const videoClean = () => {
-    selectedList.value = []
-    selectedRowKeys.value = []
-    videoList.value = []
-    current.value = 1
-  }
-  // 改变批量预览的分页
-  const changePage = (page) => {}
-  // 一键申请
-  const dept = reactive({})
-  // eslint-disable-next-line no-undef
-  if (infrastructure) {
-    // eslint-disable-next-line no-undef
-    dept.deptId = infrastructure.deptId
-    // eslint-disable-next-line no-undef
-    dept.deptName = infrastructure.deptName
-  }
-  const apply = () => {
-    if (selectedRowKeys.value.length != 0) {
-      console.log('一键申请', selectedList.value)
-      let arr = [
-        {
-          arr: [
-            {
-              description: '',
-              note1: JSON.stringify(selectedList.value),
-              resourceId: '1522550195055828996',
-              resourceName: '摄像头列表',
-              type: '基础设施',
-            },
-          ],
-          deptId: dept.deptId,
-          deptName: dept.deptName,
+    for (let index = 0; index < length; index++) {
+      const param = {
+        key: list[index].channelId,
+      }
+      let ob = {
+        options: {
+          width: '512px', //播放器宽度
+          height: '288px', //播放器高度
+          color: '#409eff', //主题色
+          title: '', //视频名称
+          src: '', //视频源
+          type: 'm3u8', // 视频源类型
+          muted: false, //静音
+          webFullScreen: false,
+          speedRate: ['0.75', '1.0', '1.25', '1.5', '2.0'], //播放倍速
+          autoPlay: isXiHaiAn ? false : true, //自动播放
+          loop: false, //循环播放
+          mirror: false, //镜像画面
+          ligthOff: false, //关灯模式
+          volume: 0.3, //默认音量大小
+          control: isXiHaiAn ? false : true, //是否显示控制
+          controlBtns: isXiHaiAn ? [] : [
+            'audioTrack',
+            'quality',
+            'speedRate',
+            'volume',
+            'setting',
+            'pip',
+            'pageFullScreen',
+            'fullScreen',
+          ], //显示所有按钮,
         },
-      ]
-      localStorage.setItem('applyList', JSON.stringify(arr))
-      router.push({
-        path: '/apply',
+      }
+      await getStreamByChannelCode(param).then((res) => {
+        // 视频测试
+        // ob.options.src = 'http://playertest.longtailvideo.com/adaptive/bipbop/gear4/prog_index.m3u8'
+        ob.options.src = res.data.data
+        console.log('监测ob的变化', ob)
+        videoList.value.push(ob)
       })
-    } else {
-      message.error('请选择需要申请的数据')
     }
+    console.log('验证数据的准确性', videoList)
+    batchVisible.value = true
+  } else {
+    message.error('请选择需要预览的数据')
   }
-  // // 添加至购物车
-  // const addShopCar = () => {
-  //   console.log('添加至购物车')
-  // }
-  const wrjFlag = ref(false)
-  const cloudResourcesFlag = ref(false)
-  const getCamera = (flag, str) => {
-    if (flag) {
-      mapSearchParam.value.cameraName = str
-      console.log('赋值===============》', str, mapSearchParam.value)
-    }
-    console.log('初始化调用')
-    console.log('不选左侧树的时候不调用接口', mapSearchParam.value)
-    if (!whoShow1.value.itShowXiHaiAn) {
-      getCameraByParentId(mapSearchParam.value).then((res) => {
-        console.log('RRRRRRRRRR', res.data.data)
-        dataSource.value = res.data.data
-        pagination.value.total = res.data.count
+}
+// 打开图片批量预览
+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)
       })
-    } else {
-      let params = {
-        regionId:
-          mapSearchParam.value.parentId || '70be8c5b664f4bcf869d82f2e8335051',
-        pageNum: mapSearchParam.value.pageNum,
-        pageSize: mapSearchParam.value.pageSize,
-        name: mapSearchParam.value.cameraName || '',
-        longitude: mapSearchParam.value.gpsX || '',
-        latitude: mapSearchParam.value.gpsY || '',
-        radius: mapSearchParam.value.radius || '',
-        status: 1,
-      }
-      if (
-        params.regionId === '70be8c5b664f4bcf869d82f2e8335051' &&
-        !params.name &&
-        !params.longitude
-      ) {
-        params.status = ''
-      }
-      let paramsFather = ''
-      let i = 1
-      for (var key in params) {
-        if (params[key] === '') {
-          delete params[key]
-        } else {
-          if (i != 1) {
-            paramsFather += `&${key}=` + params[key]
-            i += 1
-          } else if (i == 1) {
-            paramsFather += `${key}=` + params[key]
-            i += 1
-          }
+    }
+    console.log('验证数据的准确性', videoList)
+    batchPicVisible.value = true
+  } else {
+    message.error('请选择需要预览的数据')
+  }
+}
+// 清空
+const nullClick = () => {
+  if (clickList.value[1]) {
+    clickList.value[1].content = []
+  }
+  mapSearchParam.value.labelCodes = ''
+  getCamera()
+  console.log('hhhhhhhh')
+}
+// 重置
+const clean = () => {
+  mapSearchParam.value.cameraName = ''
+  selectedList.value = []
+  selectedRowKeys.value = []
+  videoList.value = []
+  pagination.value.current = 1
+  mapSearchParam.value.pageNum = 1
+  pagination.value.pageSize = 10
+  getCamera()
+}
+const videoClean = () => {
+  selectedList.value = []
+  selectedRowKeys.value = []
+  videoList.value = []
+  current.value = 1
+}
+// 改变批量预览的分页
+const changePage = (page) => { }
+// 一键申请
+const dept = reactive({})
+// eslint-disable-next-line no-undef
+if (infrastructure) {
+  console.log('infrastructure------------>', infrastructure);
+
+  // eslint-disable-next-line no-undef
+  dept.deptId = infrastructure.deptId || ''
+  // eslint-disable-next-line no-undef
+  dept.deptName = infrastructure.deptName || ''
+}
+const apply = () => {
+  if (selectedRowKeys.value.length != 0) {
+    console.log('一键申请', selectedList.value)
+    let arr = [
+      {
+        arr: [
+          {
+            description: '',
+            note1: JSON.stringify(selectedList.value),
+            resourceId: '1522550195055828996',
+            resourceName: '摄像头列表',
+            type: '基础设施',
+          },
+        ],
+        deptId: dept.deptId,
+        deptName: dept.deptName,
+      },
+    ]
+    localStorage.setItem('applyList', JSON.stringify(arr))
+    router.push({
+      path: '/apply',
+    })
+  } else {
+    message.error('请选择需要申请的数据')
+  }
+}
+// // 添加至购物车
+// const addShopCar = () => {
+//   console.log('添加至购物车')
+// }
+const wrjFlag = ref(false)
+const getCamera = (flag, str) => {
+  console.log('mapSearchParam.value.cameraName------------>', mapSearchParam.value.cameraName);
+  if (flag) {
+    mapSearchParam.value.cameraName = str
+    console.log('赋值===============》', str, mapSearchParam.value)
+  }
+  console.log('初始化调用')
+  console.log('不选左侧树的时候不调用接口', mapSearchParam.value)
+  if (!whoShow1.value.itShowXiHaiAn) {
+    getCameraByParentId(mapSearchParam.value).then((res) => {
+      console.log('RRRRRRRRRR', res.data.data)
+      dataSource.value = res.data.data
+      pagination.value.total = res.data.count
+    })
+  } else {
+    console.log('mapSearchParam------------>', mapSearchParam);
+    let params = {
+      regionId:
+        mapSearchParam.value.parentId || '70be8c5b664f4bcf869d82f2e8335051',
+      pageNum: mapSearchParam.value.pageNum,
+      pageSize: mapSearchParam.value.pageSize,
+      name: mapSearchParam.value.cameraName || '',
+      longitude: mapSearchParam.value.gpsX || '',
+      latitude: mapSearchParam.value.gpsY || '',
+      radius: mapSearchParam.value.radius || '',
+      name: mapSearchParam.value.cameraName
+    }
+    // todo-临时放开
+    // if (
+    //   params.regionId === '70be8c5b664f4bcf869d82f2e8335051' &&
+    //   !params.name &&
+    //   !params.longitude
+    // ) {
+    //   params.status = ''
+    // }
+    let paramsFather = ''
+    let i = 1
+    for (var key in params) {
+      if (params[key] === '') {
+        delete params[key]
+      } else {
+        if (i != 1) {
+          paramsFather += `&${key}=` + params[key]
+          i += 1
+        } else if (i == 1) {
+          paramsFather += `${key}=` + params[key]
+          i += 1
         }
       }
-      getCameraByCondition(paramsFather).then((res) => {
-        dataSource.value = res.data.data
-        pagination.value.total = res.data.count
-        console.log('根据parent查询摄像头', res.data.data)
-      })
     }
+    getCameraByCondition(paramsFather).then((res) => {
+      dataSource.value = res.data.data
+      pagination.value.total = res.data.count
+      console.log('根据parent查询摄像头', res.data.data)
+    })
   }
-  defineExpose({
-    getCamera,
-  })
-  //加入申购车
-  const addShoppingCart = () => {
-    if (selectedList.value.length > 0) {
-      sgcInsert({
-        delFlag: '0',
-        resourceId: '8888888880000000001',
-        note1: selectedList.value,
-        // userId: userId.value,
-      }).then((res) => {
-        console.log(res)
-        message.success('添加申购车成功！')
-        mybus.emit('getSgcNum')
-      })
+}
+defineExpose({
+  getCamera,
+})
+//加入申购车
+const addShoppingCart = () => {
+  if (selectedList.value.length > 0) {
+    sgcInsert({
+      delFlag: '0',
+      resourceId: '8888888880000000001',
+      note1: selectedList.value,
+      // userId: userId.value,
+    }).then((res) => {
+      console.log(res)
+      message.success('添加申购车成功！')
+      mybus.emit('getSgcNum')
+    })
+  } else {
+    message.error('请选择需要添加申购车的数据')
+  }
+}
+// 表格
+const dataSource = ref([])
+const dataSource2 = ref([])
+const columns = ref([
+  {
+    title: '名称',
+    dataIndex: 'channelName',
+    key: 'channelName',
+  },
+  {
+    title: '归属',
+    dataIndex: 'nodeName',
+    width: '60%',
+    key: 'nodeName',
+  },
+  {
+    title: '操作',
+    dataIndex: 'operation',
+    width: '10%',
+    key: 'channelId',
+  },
+])
+const columns2 = ref([
+  {
+    title: '名称',
+    dataIndex: 'wrjName',
+    key: 'wrjName',
+    align: 'center'
+  },
+  {
+    title: '申请状态',
+    dataIndex: 'wrjState',
+    width: '60%',
+    key: 'wrjState',
+    align: 'center'
+  },
+  {
+    title: '操作',
+    dataIndex: 'operation',
+    width: '20%',
+    key: 'wrjName',
+    align: 'center'
+  },
+])
+// const allClick = ref([])
+const onSelectChange = (record, selected, selectedRows, nativeEvent) => {
+  console.log('hahhahah', record, selected, selectedRows, nativeEvent)
+  if (selected) {
+    if (selectedRowKeys.value.length == 1000) {
+      message.warning('最多只能添加1000个摄像头！')
     } else {
-      message.error('请选择需要添加申购车的数据')
+      selectedList.value.push(record)
+      selectedRowKeys.value.push(record.channelCode || record.channelId)
     }
+  } else {
+    selectedList.value = selectedList.value.filter(
+      (item) => item.idtCameraChannel !== record.idtCameraChannel
+    )
+    selectedRowKeys.value.splice(
+      selectedRowKeys.value.indexOf(record.channelCode || record.channelId),
+      1
+    )
   }
-  // 申请政务云资源
-  const applyCloudResources = () => {
-    window.open('http://15.72.183.88:8760/yzy/login')
-  }
-  // 表格
-  const dataSource = ref([])
-  const dataSource2 = ref([])
-  const columns = ref([
-    {
-      title: '名称',
-      dataIndex: 'channelName',
-      key: 'channelName',
-    },
-    {
-      title: '归属',
-      dataIndex: 'nodeName',
-      width: '60%',
-      key: 'nodeName',
-    },
-    {
-      title: '操作',
-      dataIndex: 'operation',
-      width: '10%',
-      key: 'channelId',
-    },
-  ])
-  const columns2 = ref([
-    {
-      title: '名称',
-      dataIndex: 'wrjName',
-      key: 'wrjName',
-    },
-    {
-      title: '申请状态',
-      dataIndex: 'wrjState',
-      width: '60%',
-      key: 'wrjState',
-    },
-    {
-      title: '操作',
-      dataIndex: 'operation',
-      width: '20%',
-      key: 'wrjName',
-    },
-  ])
-  // const allClick = ref([])
-  const onSelectChange = (record, selected, selectedRows, nativeEvent) => {
-    console.log('hahhahah', record, selected, selectedRows, nativeEvent)
-    if (selected) {
-      if (selectedRowKeys.value.length == 1000) {
-        message.warning('最多只能添加1000个摄像头！')
-      } else {
-        selectedList.value.push(record)
-        selectedRowKeys.value.push(record.channelCode || record.channelId)
-      }
-    } else {
-      selectedList.value = selectedList.value.filter(
-        (item) => item.idtCameraChannel !== record.idtCameraChannel
-      )
-      selectedRowKeys.value.splice(
-        selectedRowKeys.value.indexOf(record.channelCode || record.channelId),
-        1
-      )
-    }
-    console.log('已选中======================>', selectedList.value)
-    // selectedList.value = selectedRows
-    // allClick.value = selectedRowKeys
-  }
-  const onSelectAll = (selected, selectedRows, changeRows) => {
-    if (selected) {
-      changeRows.map((val) => {
-        selectedList.value.push(val)
-        selectedRowKeys.value.push(val.channelCode || val.channelId)
-      })
-      if (selectedRowKeys.value.length > 1000) {
-        message.warning('最多只能添加1000个摄像头！')
-        changeRows.map((val) => {
-          selectedList.value = selectedList.value.filter(
-            (item) => item.idtCameraChannel !== val.idtCameraChannel
-          )
-          selectedRowKeys.value.splice(
-            selectedRowKeys.value.indexOf(val.channelCode || val.channelId),
-            1
-          )
-        })
-      }
-    } else {
+  console.log('已选中======================>', selectedList.value)
+  // selectedList.value = selectedRows
+  // allClick.value = selectedRowKeys
+}
+const onSelectAll = (selected, selectedRows, changeRows) => {
+  if (selected) {
+    changeRows.map((val) => {
+      selectedList.value.push(val)
+      selectedRowKeys.value.push(val.channelCode || val.channelId)
+    })
+    if (selectedRowKeys.value.length > 1000) {
+      message.warning('最多只能添加1000个摄像头！')
       changeRows.map((val) => {
         selectedList.value = selectedList.value.filter(
           (item) => item.idtCameraChannel !== val.idtCameraChannel
@@ -1880,28 +1632,59 @@
         )
       })
     }
-    console.log('heiheiheiehiehei', selected, selectedRows, changeRows)
+  } else {
+    changeRows.map((val) => {
+      selectedList.value = selectedList.value.filter(
+        (item) => item.idtCameraChannel !== val.idtCameraChannel
+      )
+      selectedRowKeys.value.splice(
+        selectedRowKeys.value.indexOf(val.channelCode || val.channelId),
+        1
+      )
+    })
   }
-  const handleTableChange = (val) => {
-    pagination.value.current = val.current
-    pagination.value.pageSize = val.pageSize
-    mapSearchParam.value.pageNum = val.current
-    mapSearchParam.value.pageSize = val.pageSize
+  console.log('heiheiheiehiehei', selected, selectedRows, changeRows)
+}
+
+// 切换tab
+const handleTableChange = (val) => {
+  pagination.value.current = val.current
+  pagination.value.pageSize = val.pageSize
+  mapSearchParam.value.pageNum = val.current
+  mapSearchParam.value.pageSize = val.pageSize
+
+  let _arr = clickList.value.filter(v => v.content.includes('单兵设备') || v.content.includes('无人机')) || []
+  let _tab_name = _arr[0] && _arr[0].content && _arr[0].content[0]
+  // 无人机、单兵设备
+  if (_tab_name) {
+    getSoldierData(0, _tab_name)
+  } else {
     getCamera()
-    // this.getTableList()
   }
+}
+
+// 视频预览 提示
+const videoShowMsg = (index) => {
+  let itemData = null;
+  if (index) {
+    itemData = selectedList.value[index]
+  }
+  let msg = '请申请后在我的申请中预览视频!'
+  if ((itemData && itemData.status != 1) || (rowClickData.value && rowClickData.value.status != 1)) {
+    msg = '当前视频离线不可预览!'
+  } else {
+    msg = '请申请后在我的申请中预览视频!'
+  }
+  message.warning(msg)
+}
 </script>
 <style lang="less" scoped>
 .infrastructrueBox {
   padding: 0.2rem;
-  // background: #f3f5f9;
   background: #ffffff;
-  /* padding: 0.16rem; */
   border-bottom: 0.01rem solid rgba(150, 144, 144, 0.3);
+
   .infrastructrue-tab {
-    // background: #ffffff;
-    // padding: 0.2rem;
-    // border-bottom: 0.01rem solid rgba(150, 144, 144, 0.3);
     span {
       display: inline-block;
       height: 0.24rem;
@@ -1915,43 +1698,49 @@
       cursor: pointer;
       padding: 0 0.08rem;
     }
+
     .leftType {
       margin: 0.2rem 0;
       margin-right: 0.06rem;
     }
+
     .down {
       background: #0087ff;
       color: #ffffff;
     }
+
     .tabBox {
-      margin-bottom: 0.16rem;
-    }
-    .tabBox:last-of-type {
-      margin-bottom: 0;
+      padding-bottom: 0.16rem;
     }
   }
+
   .infrastructrue-content {
     display: flex;
     justify-content: space-between;
     padding: 0.14rem 0.2rem 0.1rem;
     background: #ffffff;
+
     .contentNum {
       position: relative;
       display: flex;
+
       p {
         color: #666666;
         padding: 0;
         margin: 0;
+
         span {
           color: #0087ff;
           font-size: 0.2rem;
           font-weight: 500;
         }
       }
+
       p:first-of-type {
         padding-right: 0.16rem;
         margin-right: 0.16rem;
       }
+
       .boundary {
         position: absolute;
         left: 0.9rem;
@@ -1963,10 +1752,12 @@
         background: rgba(150, 144, 144, 0.3);
       }
     }
+
     .contentRight {
       position: relative;
       display: flex;
       justify-content: space-between;
+
       .boundary {
         position: absolute;
         left: 3.74rem;
@@ -1977,12 +1768,15 @@
         height: 0.2rem;
         background: rgba(150, 144, 144, 0.3);
       }
+
       .searchInput {
         display: flex;
         margin-right: 0.2rem;
+
         .ant-input-search {
           max-width: 4rem;
         }
+
         :deep(.ant-input) {
           width: 2rem;
           height: 0.36rem;
@@ -1990,9 +1784,11 @@
           color: #b2b2b2;
           background: #f5f5f5;
         }
+
         :deep(.ant-input-group-addon) {
           display: inline-block;
           margin-left: 0.1rem;
+
           .ant-input-search-button {
             width: 0.8rem;
             height: 0.36rem;
@@ -2001,11 +1797,13 @@
             font-size: 0.14rem;
           }
         }
+
         :deep(.ant-btn) {
           background: #0558e1;
           border-radius: 0.04rem;
         }
       }
+
       .buttonAdd {
         background: #0558e1;
         border-radius: 0.04rem;
@@ -2015,11 +1813,13 @@
       }
     }
   }
+
   .infrastructrue-table {
     .ant-table-striped :deep(.table-striped) td {
       background-color: #fafafa;
     }
   }
+
   .map-contain {
     // width: 9.46rem;
     height: 4.1rem;
@@ -2027,40 +1827,49 @@
     position: relative;
   }
 }
+
 .roomBackground {
   background: #0058e1;
   color: #ffffff;
 }
+
 .nullBackground {
   background: #f3f5f9;
   color: #0087ff;
 }
+
 :deep(.ant-form-item-control-input-content) {
   margin-left: 0.15rem;
 }
+
 :deep(.ant-col) {
   .ant-form-item {
     margin-bottom: 0;
   }
 }
+
 .jinggaoD {
   display: flex;
   align-items: center;
 }
+
 .jinggaoNull {
   display: none;
 }
+
 .imgJinggao {
   width: 0.2rem;
   height: 0.2rem;
   background: url('~@/assets/home/jingao.png') no-repeat;
   background-size: 100%;
 }
+
 .introduction {
   :deep(.ant-form-item-control) {
     margin-left: -2.1rem;
   }
 }
+
 .roomBox {
   .leftMake {
     float: left;
@@ -2068,6 +1877,7 @@
     margin-top: -0.5rem;
     font-size: 0.2rem;
     cursor: pointer;
+
     .leftTop {
       width: 0.6rem;
       height: 1.75rem;
@@ -2076,6 +1886,7 @@
       padding: 0.13rem;
       text-align: center;
     }
+
     .leftBottom {
       width: 0.6rem;
       height: 1.75rem;
@@ -2085,13 +1896,16 @@
       text-align: center;
     }
   }
+
   .roomSearch {
     display: flex;
     align-items: center;
+
     .searchInput {
       display: flex;
       margin-right: 0.2rem;
       margin-left: 0.2rem;
+
       // .ant-input-search {
       //   max-width: 4rem;
       // }
@@ -2102,9 +1916,11 @@
         color: #b2b2b2;
         background: #f5f5f5;
       }
+
       :deep(.ant-input-group-addon) {
         display: inline-block;
         margin-left: 0.1rem;
+
         .ant-input-search-button {
           width: 0.8rem;
           height: 0.36rem;
@@ -2113,31 +1929,37 @@
           font-size: 0.14rem;
         }
       }
+
       :deep(.ant-btn) {
         border-radius: 0.06rem;
       }
     }
   }
+
   .roomTableList {
     display: flex;
     justify-content: space-between;
     align-items: center;
     margin: 0.4rem 0 0.2rem 0;
+
     .roomTime {
       display: flex;
       align-items: center;
+
       :deep(.ant-space-vertical) {
         flex-direction: inherit;
         margin-left: 0.2rem;
       }
     }
   }
+
   .roomItem {
     width: 10.3rem;
     height: 2rem;
     border-top: 1px #d5d4d4 solid;
     display: flex;
     align-items: center;
+
     .leftImg {
       width: 2.4rem;
       height: 1.75rem;
@@ -2145,19 +1967,23 @@
 
       // background: url('~@/assets/home/yyzy_square.png') no-repeat;
       background-size: 100%;
+
       img {
         width: 100%;
         height: 100%;
       }
     }
+
     .rightContent {
       height: 1.75rem;
       width: 5.8rem;
+
       .topContent {
         font-size: 0.2rem;
         color: #000;
         font-weight: 600;
       }
+
       .centerContent {
         display: flex;
         justify-content: space-between;
@@ -2166,9 +1992,11 @@
       }
     }
   }
+
   :deep(.ant-pagination) {
     float: right;
   }
+
   :deep(.ant-pagination) {
     text-align: end;
   }
@@ -2178,50 +2006,61 @@
 .wrj {
   .ant-modal-body {
     height: 700px !important;
+    overflow-y: auto;
   }
 }
+
 .modalClass {
   .ant-modal-body {
     height: 4rem !important;
     overflow-y: scroll !important;
   }
+
   .ant-modal-title {
     font-weight: 600;
   }
+
   .ant-modal-content {
     .ant-modal-header {
       border-bottom: 0 !important;
     }
   }
 }
+
 .appModal {
   .ant-modal-body {
     height: 4.8rem !important;
     overflow-y: scroll !important;
   }
+
   .ant-modal-title {
     font-weight: 600;
   }
+
   .ant-modal-content {
     .ant-modal-header {
       border-bottom: 0 !important;
     }
   }
 }
+
 .single-preview-modal {
   .ant-modal-header {
     background: url(~@/assets/home/video-background.png) no-repeat;
     background-size: cover;
   }
+
   .ant-modal-title {
     font-size: 0.16rem;
     font-weight: 500;
     color: #ffffff;
   }
+
   .anticon {
     color: #ffffff;
   }
 }
+
 .batch-preview-modal {
   .batch-video {
     width: 100%;
@@ -2232,20 +2071,53 @@
     grid-row-gap: 10px;
     grid-column-gap: 10px;
   }
+
   .ant-pagination-item-link {
     background-color: #5580f7;
   }
+
   .ant-modal-header {
     background: url(~@/assets/home/video-background.png) no-repeat;
     background-size: cover;
   }
+
   .ant-modal-title {
     font-size: 0.16rem;
     font-weight: 500;
     color: #ffffff;
   }
+
   .anticon {
     color: #ffffff;
   }
 }
+
+/*禁用video的controls（要慎重！不要轻易隐藏掉，会导致点击视频不能播放）*/
+video::-webkit-media-controls {
+  display: none !important;
+}
+
+.video-cover {
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  background: transparent;
+  z-index: 99999999;
+  cursor: pointer;
+}
+
+.batch-video-cover {
+  position: absolute;
+  left: 0;
+  top: 0;
+  background: transparent;
+  height: 288px;
+  z-index: 99999999;
+  width: 512px;
+  margin-top: 14px;
+  cursor: pointer;
+}
+
 </style>
diff --git a/front/src/views/home/videoSurveillance/index.vue b/front/src/views/home/videoSurveillance/index.vue
index 117f7bbf..333b6258 100644
--- a/front/src/views/home/videoSurveillance/index.vue
+++ b/front/src/views/home/videoSurveillance/index.vue
@@ -226,7 +226,6 @@
             longitude: this.mapSearchParam.gpsX || '',
             latitude: this.mapSearchParam.gpsY || '',
             radius: this.mapSearchParam.radius || '',
-            status: 1,
           }
           let paramsFather = ''
           let i = 1
diff --git a/front/src/views/login/index.vue b/front/src/views/login/index.vue
index 7e481975..cd9cc7f8 100644
--- a/front/src/views/login/index.vue
+++ b/front/src/views/login/index.vue
@@ -42,6 +42,9 @@ import { Encrypt } from '@/utils/crypto'
 import { UserOutlined, LockOutlined } from '@ant-design/icons-vue'
 import { message, Modal } from 'ant-design-vue'
 
+// 是否是西海岸
+const isXiHaiAn = whoShow.itShowXiHaiAn
+
 export default {
   name: 'Login',
   components: {
@@ -145,7 +148,19 @@ export default {
         window.sessionStorage.setItem('visits', JSON.stringify([]))
         console.log('添加visits========================================>')
         // console.log(this.handleRoute())
-        await this.$router.push('/home')
+        // 西海岸特殊处理
+        if (isXiHaiAn) {
+          await this.$router.push({
+            path: '/DetailsPageconetent',
+            query: {
+              select: '基础设施',
+              tecHnosphere: '',
+              appLiCation: ''
+            }
+          })
+        } else {
+          await this.$router.push('/home')
+        }
       } catch (error) {
         message.error('登陆失败，用户名或密码错误！')
       }
diff --git a/front/src/views/personalCenter/components/AbilityApplication.vue b/front/src/views/personalCenter/components/AbilityApplication.vue
index 11567292..3a75af0e 100644
--- a/front/src/views/personalCenter/components/AbilityApplication.vue
+++ b/front/src/views/personalCenter/components/AbilityApplication.vue
@@ -187,7 +187,7 @@
                 </div>
                 <a-button
                     type="primary"
-                    v-if="item.approveStatus === '通过' && whoShow1.itShowXiHaiAn"
+                    v-if="item.approveStatus == '通过' && whoShow1.itShowXiHaiAn"
                     @click.stop="openVideo(val)"
                   >
                   视频预览
@@ -440,6 +440,9 @@
   // 视频预览
   const openVideo = (item) => {
     console.log('打开视频', item)
+    if(item && item.status != 1) {
+      return message.error('当前视频离线不可预览!')
+    }
     const param = {
       key: item.cameraId,
     }