fix: 修改弹窗大小

config/proxy.ts

@@ -10,10 +10,10 @@ module.exports = {
       changeOrigin: true,
       pathRewrite: { '^/user': '' }
     },
-    '/cvs': {
-      target: 'http://127.0.0.1:8888',
+    '/cvss': {
+      target: 'http://124.222.113.37:8080',
       changeOrigin: true,
-      pathRewrite: { '^/cvs': '' }
+      pathRewrite: { '^/cvss': '' }
     },
     '/iot': {
       target: 'http://124.222.113.37:8888',

src/api/cvs/nodes.ts

@@ -0,0 +1,9 @@
+import request from '@/service/request'
+
+export const getNodesPage = (params: COMMON.API.QueryParams & {serverType?: 'ais' | 'ss'}) => {
+  return request<(CVS.Nodes.ais | CVS.Nodes.ss)[]>({
+    url: '/serverNode',
+    method: 'GET',
+    params
+  })
+}

src/controller/cvs/nodesController.ts

@@ -0,0 +1,9 @@
+import { getNodesPage } from '@/api/cvs/nodes'
+
+export class NodesController {
+  static serverType = ['ais', 'ss']
+
+  static async page (params: COMMON.API.QueryParams & {serverType?: 'ais' | 'ss'}) {
+    return await getNodesPage(params)
+  }
+}

src/controller/index.ts

@@ -20,3 +20,5 @@ export { ProjectController } from './cvs/projectController'
 export { OperatorController } from './cvs/operatorController'
 
 export { FeatureController } from './cvs/featureController'
+
+export { NodesController } from './cvs/nodesController'

src/hooks/effect.ts

@@ -55,7 +55,7 @@ export const usePort = (title: string) => {
   if (title === '物联网') {
     setBaseUrl('/iot')
   } else if (title === '视联网') {
-    setBaseUrl('/cvs')
+    setBaseUrl('/cvss')
   } else if (title === '用户群组') {
     setBaseUrl('/user')
   } else {

src/pages/Iot/rule/linkRules.vue

@@ -57,14 +57,14 @@
   </a-card>
 
   <modal-pro
-    style="width: 1400px;"
+    style="width: 1000px;"
     :label=" state.opraState !== 'preview' ? '创建联动规则' : '查看详情'"
     :open="state.visible"
     destroyOnClose
     @cancel="state.visible = false"
     @ok="ok"
   >
-    <div style="height: 550px;overflow: hidden; overflow-y: auto;">
+    <div style="height: 500px;overflow: hidden; overflow-y: auto;">
       <a-card
         title="基本信息"
         :bordered="false"

src/pages/cvs/nodes/index.vue

@@ -1,9 +1,119 @@
 <template>
-<a-card>
-  nodes
+<a-card title="节点管理" >
+  <table-pro
+    :service="NodesController.page"
+    :serviceParams="{serverType}"
+    :columns="columns"
+    ref="tableProDom"
+  >
+    <template #search >
+      <a-space>
+        <a-select style="width: 170px;" v-model:value="serverType" >
+            <a-select-option v-for="item in NodesController.serverType" :key="item" :value="item" >
+              {{item}}
+            </a-select-option>
+          </a-select>
+          <a-button type="primary" @click="search">搜索</a-button>
+      </a-space>
+    </template>
+  </table-pro>
 </a-card>
 </template>
 <script lang='ts' setup >
+import { NodesController } from '@/controller'
+import { computed, ref } from 'vue'
+
+const serverType = ref<'ais' | 'ss'>('ais')
+
+const tableProDom = ref()
+
+const aisColumns = [
+  {
+    title: '服务ID',
+    dataIndex: 'serverId',
+    key: 'serverId'
+  },
+  {
+    title: '服务名称',
+    dataIndex: 'serverName',
+    key: 'serverName'
+  },
+  {
+    title: '服务地址',
+    dataIndex: 'serverAddr',
+    key: 'serverAddr'
+  },
+  {
+    title: 'rtsp前缀',
+    dataIndex: 'serverPort',
+    key: 'serverPort'
+  },
+  {
+    title: 'rtmp前缀',
+    dataIndex: 'rtmpUrl',
+    key: 'rtmpUrl'
+  },
+  {
+    title: '国标地址',
+    dataIndex: 'gbUrl',
+    key: 'gbUrl'
+  },
+  {
+    title: 'http-flv地址',
+    dataIndex: 'hdlUrl',
+    key: 'hdlUrl'
+  },
+  {
+    title: 'hls地址',
+    dataIndex: 'hlsUrl',
+    key: 'hlsUrl'
+  },
+  {
+    title: 'web rtc地址',
+    dataIndex: 'webRtcUrl',
+    key: 'webRtcUrl'
+  },
+  {
+    title: '最后心跳时间',
+    dataIndex: 'lastPingTime',
+    key: 'lastPingTime'
+  }
+]
+
+const ssColumns = [
+  {
+    title: '服务ID',
+    dataIndex: 'serverId',
+    key: 'serverId'
+  },
+  {
+    title: '服务名称',
+    dataIndex: 'serverName',
+    key: 'serverName'
+  },
+  {
+    title: '服务地址',
+    dataIndex: 'serverAddr',
+    key: 'serverAddr'
+  },
+  {
+    title: 'ai 请求地址',
+    dataIndex: 'aiPath',
+    key: 'aiPath'
+  },
+  {
+    title: '最后心跳时间',
+    dataIndex: 'lastPingTime',
+    key: 'lastPingTime'
+  }
+]
+
+const columns = computed(() => serverType.value === 'ais' ? aisColumns : ssColumns)
+
+const search = () => {
+  tableProDom.value.reload()
+}
+
 </script>
 <style lang='less' scoped >
 </style>

src/pages/cvs/video/device.vue

@@ -91,21 +91,45 @@
   >
       <a-space>
           <a-range-picker v-model:value="deviceActionParams.times" />
-          <a-select width="80px"  v-model:value="deviceActionParams.recordFormat" >
-            <a-select-options v-for="item in SpaceController.recordFormat" :key="item" :value="item" >
+          <a-select style="width: 170px;"  v-if="activeTabKey === 'record'" v-model:value="deviceActionParams.recordFormat" >
+            <a-select-option v-for="item in SpaceController.recordFormat" :key="item" :value="item" >
               {{item}}
-            </a-select-options>
+            </a-select-option>
           </a-select>
-          <a-button type="primary" @click="search">搜索</a-button>
+          <a-select style="width: 170px;"  v-if="activeTabKey === 'ai'" v-model:value="deviceActionParams.aiId" >
+            <a-select-option v-for="item in state.aiList" :key="item.aiId" :value="item.aiId" >
+              {{item.aiName}}
+            </a-select-option>
+          </a-select>
+          <a-button type="primary" @click="searchDevice">搜索</a-button>
         </a-space>
         <!-- 视频 图片区域 -->
-        <a-row :gutter="[8, 8]" style="margin-top: 20px;" >
-          <a-col :span="4" v-for="item in state.deviceMediaList" :key="item" >
-            <div class="media-card">
-
-            </div>
-          </a-col>
-        </a-row>
+        <a-spin :spinning="state.loading">
+          <a-row :gutter="[8, 8]" style="margin-top: 20px;" >
+            <a-col :span="4" v-for="item in state.deviceMediaList" :key="item" >
+              <div class="media-card">
+                  <video
+                  v-if="activeTabKey === 'record'"
+                    :controls="false"
+                    :src="item.recordUrl"
+                  ></video>
+                <div v-else-if="activeTabKey === 'thumb'" >
+                  <a-image
+                    width="100%"
+                    height="80px"
+                    style="object-fit: cover;display: block;"
+                    :src="item.thumbUrl"
+                  />
+                </div>
+                <div v-else-if="activeTabKey === 'ai'" style="height: 85px;" >
+                  <video v-if="item.aiRetType === 'VIDEO'" :controls="false" :src="item.aiRetUrl"></video>
+                  <a-image width="100%" height="80px"  style="object-fit: cover;display: block;" v-else :controls="false" :src="item.aiRetUrl"></a-image>
+                </div>
+                <div class="craete-time">{{dayjs(item.createAt).format('YYYY/MM/DD HH:mm:ss')}}</div>
+              </div>
+            </a-col>
+          </a-row>
+        </a-spin>
   </a-card>
 </modal-pro>
 </template>
@@ -113,7 +137,7 @@
 import { InputTsx } from '@/components/MicroComponents/index'
 import { reactive, onMounted, nextTick, ref, getCurrentInstance, watch } from 'vue'
 import { Form } from 'ant-design-vue'
-import { SpaceController } from '@/controller'
+import { OperatorController, SpaceController } from '@/controller'
 import { useRoute } from 'vue-router'
 import dayjs from 'dayjs'
 
@@ -235,12 +259,16 @@ const state = reactive<{
   visible: boolean,
   activeVisible: boolean,
   spaceList: CVS.space[]
-  deviceMediaList: any[]
+  deviceMediaList: any[],
+  aiList: CVS.Operator[]
+  loading: boolean
 }>({
   visible: false,
   activeVisible: false,
   spaceList: [],
-  deviceMediaList: []
+  deviceMediaList: [],
+  aiList: [],
+  loading: false
 })
 
 const deviceActionParams = reactive({
@@ -250,7 +278,8 @@ const deviceActionParams = reactive({
   recordFormat: '',
   deviceId: '',
   page: 1,
-  pageSize: 10
+  pageSize: 10,
+  aiId: null
 })
 
 watch(
@@ -287,12 +316,16 @@ const { resetFields, validate, validateInfos } = useForm(deviceState, {
   stream: [{ required: true, message: '请填写stream名称' }]
 })
 
+const searchDevice = () => getMedia()
+
 const onTabChange = (key: 'record' | 'thumb' | 'ai') => {
   activeTabKey.value = key
 }
 
 const getMedia = async () => {
+  state.loading = true
   const { data, sum } = await deviceActionMap.get(activeTabKey.value)?.get(deviceActionParams as any)
+  state.loading = false
   state.deviceMediaList = data
   console.log(state.deviceMediaList)
 }
@@ -337,19 +370,36 @@ const getSpaceList = async () => {
   })
 }
 
+const getAiList = async () => {
+  state.aiList = await OperatorController.list()
+}
+
 const search = () => {
   tableProDom.value.reload()
 }
 
 onMounted(() => {
   getSpaceList()
+  getAiList()
 })
 </script>
 <style lang='less' scoped >
 
 .media-card {
   width: 100%;
-  height: 80px;
-  background-color: pink;
+  height: 85px !important;
+  background-color: #000;
+  video {
+    width: 100%;
+    height: 85px !important;
+  }
+  img {
+    width: 100%;
+    height: 85px;
+    display: block;
+  }
+  .craete-time {
+    margin-top: 5px;
+  }
 }
 </style>

src/type/cvs.d.ts

@@ -141,4 +141,30 @@ declare namespace CVS {
 
   }
 
+  namespace Nodes {
+    interface ais {
+      serverId: string
+      serverName: string
+      serverAddr: string
+      serverPort: string
+      rtspUrl: string
+      rtmpUrl: string
+      gbUrl: string
+      hdlUrl: string
+      hlsUrl: string
+      serverId: string
+      webRtcUrl: string
+      lastPingTime: string
+    }
+
+    interface ss {
+      serverId: string
+      serverName: string
+      serverAddr: string
+      serverPort: string
+      aiPath: string
+      lastPingTime: string
+    }
+  }
+
 }