物联设备页面和接口优化

src/views/biz/nuBaseInfo/components/BaseWlsbListForm.vue

@@ -8,7 +8,7 @@
           <template #title>
             <a-row style="font-weight: normal;">
               <a-col :span="18" style="font-size: 14px;">
-                <div>SN：<span style="font-weight: bold;">{{ item.sn }}</span></div>
+                <div>SN：<span style="font-weight: bold;">{{ item.mac }}</span></div>
                 <div style="font-size: 12px;">名称：{{ item.deviceName }}</div>
               </a-col>
               <a-col :span="6" style="display: flex; justify-content: flex-end;">
@@ -25,9 +25,19 @@
                   {{item.nuName?item.nuName:'未配置'}}
                 </a-col> -->
             <a-col :span="24" style="text-align: center;font-size: 44px;font-weight: bold;margin-top:10px;">
-              <img src="../../../../assets/iot/sxt.png" style="width:80px;" />
+              <img v-if="item.deviceType == 'NETWORKVIDEORECORDER'" src="../../../../assets/iot/lxj.png" style="width:80px;" />
+              <img v-if="item.deviceType == 'SURVEILLANCECAMERA'" src="../../../../assets/iot/sxt.png" style="width:80px;" />
+              <img v-if="item.deviceType == 'ROUTER'" src="../../../../assets/iot/router.png" style="width:80px;" />
+              <img v-if="item.deviceType == 'SWITCH'" src="../../../../assets/iot/switch.png" style="width:80px;" />
+              <img v-if="item.deviceType == 'AP'" src="../../../../assets/iot/ap.png" style="width:80px;" />
+            </a-col>
+            <a-col :span="12" style="margin-top: -1px;">
+              <a-tag v-if="item.deviceType == 'NETWORKVIDEORECORDER'" color="purple">录像机</a-tag>
+              <a-tag v-if="item.deviceType == 'SURVEILLANCECAMERA'" color="purple">摄像头</a-tag>
+              <a-tag v-if="item.deviceType == 'ROUTER'" color="purple">路由器</a-tag>
+              <a-tag v-if="item.deviceType == 'SWITCH'" color="purple">交换机</a-tag>
+              <a-tag v-if="item.deviceType == 'AP'" color="purple">无线AP</a-tag>
             </a-col>
-            <a-col :span="12" style="margin-top: -1px;"><a-tag color="purple">摄像头</a-tag></a-col>
             <a-col :span="12" style="margin-top: -11px;text-align:right;">
               <span v-if="item.maintainStatus == 0" style="font-weight:700;font-size:16px;">正常</span>
               <span v-if="item.maintainStatus == 1" style="font-weight:700;font-size:16px;color:red;">维修中</span>
@@ -38,7 +48,7 @@
           <a-divider style="margin: 10px 0 20px 0" />
           <p style="text-align:center;margin-bottom:5px !important">
 
-            <span style="display:inline-block;cursor: pointer;" @click="handlePreview(item)">
+            <span style="display:inline-block;cursor: pointer;" @click="handlePreview(item)" v-if="item.deviceType == 'SURVEILLANCECAMERA'">
               <span class="tbClass"><img src="../../../../assets/iot/a14.png" style="width:20px;" /></span><br />
               <span class="antTitle">预览</span>
             </span>
@@ -400,8 +410,7 @@ function getWsdj(record) {
 // 抄电表
 async function handleRead(record) {
   const params = {
-    'cid': record.cid,
-    'address': record.address,
+    'sn': record.sn,
   };
   await eleRead(params);
   setTimeout(() => {
@@ -422,9 +431,8 @@ async function handleControlLz(record) {
     return;
   }
   const params = {
-    'cid': record.cid,
-    'address': record.address,
-    'type': '10',
+    'sn' : record.sn,
+    'type': '10'
   };
   await eleControl(params);
   setTimeout(() => {
@@ -445,8 +453,7 @@ async function handleControlHz(record) {
     return;
   }
   const params = {
-    'cid': record.cid,
-    'address': record.address,
+    'sn' : record.sn,
     'type': '11',
   };
   await eleControl(params);
@@ -458,8 +465,7 @@ async function handleControlHz(record) {
 // 电表清零
 async function handleReset(record) {
   const params = {
-    'cid': record.cid,
-    'address': record.address,
+    'sn': record.sn,
   };
   await eleReset(params);
   setTimeout(() => {
@@ -597,6 +603,7 @@ function showWsdjApiLog(record) {
  * 摄像头预览
  */
 function handlePreview(record: Recordable) {
+  record.streamType = 1;
   previewModal.value.disableSubmit = true;
   previewModal.value.edit(record);
 }

src/views/biz/nuBaseInfo/iotDevices/IotDevices.data.ts

@@ -18,7 +18,7 @@ export const columns: BasicColumn[] = [
   {
     title: '设备标识',
     align: "center",
-    dataIndex: 'deviceIndex'
+    dataIndex: 'sn'
   },
   {
     title: '设备型号',

src/views/biz/nuBaseInfo/iotDevices/IotDevicesList.vue

@@ -176,6 +176,7 @@ import CameraPreviewModal from '/@/views/iot/tplink/camera/components/CameraPrev
  * 摄像头预览
  */
 function handlePreview(record: Recordable) {
+  record.streamType = 1;
   previewModal.value.disableSubmit = true;
   previewModal.value.edit(record);
 }

src/views/iot/tplink/camera/components/CameraPreviewForm.vue

@@ -1,5 +1,5 @@
 <template>
-  <a-spin :spinning="confirmLoading">
+<!--  <a-spin :spinning="confirmLoading">-->
     <a-row>
       <a-col :span="24">
         <div id="video-container-preview" style="min-height: 400px;"></div>
@@ -156,7 +156,7 @@
           </span>
       </a-col> -->
     </a-row>
-  </a-spin>
+<!--  </a-spin>-->
 </template>
 
 <script lang="ts" setup>
@@ -211,7 +211,7 @@ const formData = reactive<Record<string, any>>({
 const { createMessage } = useMessage();
 const labelCol = ref<any>({ xs: { span: 24 }, sm: { span: 5 } });
 const wrapperCol = ref<any>({ xs: { span: 24 }, sm: { span: 16 } });
-const confirmLoading = ref<boolean>(false);
+// const confirmLoading = ref<boolean>(false);
 
 //表单验证
 const validatorRules = reactive({
@@ -235,7 +235,7 @@ const disabled = computed(() => {
  */
 async function edit(record) {
   await nextTick(() => {
-    confirmLoading.value = true;
+    // confirmLoading.value = true;
     resetFields();
     const tmpData = {};
     Object.keys(formData).forEach((key) => {
@@ -246,8 +246,8 @@ async function edit(record) {
     //赋值
     Object.assign(formData, tmpData);
   });
-  createPreview();
-  getSwitch();
+  // createPreview();
+  // getSwitch();
 }
 
 /**
@@ -259,7 +259,7 @@ async function createPreview() {
     formData.backupUrl = res.backupUrl;
     formData.wsUrl = res.wsUrl;
     formData.wssUrl = res.wssUrl;
-    confirmLoading.value = false;
+    // confirmLoading.value = false;
   });
   if (player.value) {
     player.value.destroy().then(() => {

src/views/iot/tplink/camera/components/CameraPreviewModal.vue

@@ -137,6 +137,7 @@ const { resetFields, validate, validateInfos } = useForm(formData, validatorRule
  */
 
 async function edit(record) {
+  console.log(record);
   title.value = record.deviceName;
   showCamera.value = true;
   visible.value = true;
@@ -178,7 +179,8 @@ function submitCallback() {
 function handleCancel() {
   visible.value = false;
   nextTick(() => {
-    registerForm.value.destroy();
+    // registerForm.value.destroy();
+    destroy();
     showCamera.value = false;
   });
 }
@@ -212,6 +214,7 @@ function stopPhone() {
  * 创建预览
  */
 async function createPreview() {
+  console.log("🌊 ~ createPreview ~ a:", formData)
   await getPreviewUrl({ "deviceIndex": formData.deviceIndex, "streamType": formData.streamType }).then(res => {
     formData.url = res.url;
     formData.backupUrl = res.backupUrl;
@@ -224,7 +227,6 @@ async function createPreview() {
     }); // 销毁
     player.value = null;
   }
-  console.log("🌊 ~ createPreview ~ a:", formData)
   const TumsPlayer = window['tums-player'].default;
   player.value = new TumsPlayer('video-container-preview', {
     type: "rtsp", // 协议类型，rtsp
@@ -361,6 +363,17 @@ function recordingEnd() {
   });
 }
 
+/**
+ * 销毁
+ */
+function destroy() {
+  if (player) {
+    player.value.destroy().then(() => {
+    }); // 销毁
+    player.value = null;
+  }
+}
+
 defineExpose({
   edit,
   disableSubmit,

src/views/iot/tq/ApiRequestLog/ApiRequestLog.data.ts

@@ -8,7 +8,7 @@ export const columns: BasicColumn[] = [
   {
     title: 'SN',
     align: "center",
-    dataIndex: 'address'
+    dataIndex: 'cid'
   },
   // {
   //   title: '类型',
@@ -58,7 +58,7 @@ export const columns2: BasicColumn[] = [
   {
     title: 'SN',
     align: "center",
-    dataIndex: 'address'
+    dataIndex: 'cid'
   },
   {
     title: '操作时间',