瀏覽代碼

继续修复

yanghao 5 天之前
父節點
當前提交
fe0059b2c3

+ 1 - 1
.env.dev

@@ -4,7 +4,7 @@ NODE_ENV=production
 VITE_DEV=true
 
 # 请求路径
-VITE_BASE_URL='https://iot.deepoil.cc'
+VITE_BASE_URL='http://1.94.244.160:66'
 
 # MQTT服务地址
 VITE_MQTT_SERVER_URL = ''

+ 1 - 1
.env.local

@@ -4,7 +4,7 @@ NODE_ENV=development
 VITE_DEV=true
 
 # 请求路径
-VITE_BASE_URL='http://192.168.188.149:8080' # 192.168.188.149:48080 https://iot.deepoil.cc
+VITE_BASE_URL='http://172.21.10.222:8080' # 192.168.188.149:48080 https://iot.deepoil.cc
 
 # MQTT服务地址
 VITE_MQTT_SERVER_URL = 'ws://localhost:8083/mqtt'

+ 3 - 6
src/views/pms/video_center/category/index.vue

@@ -13,12 +13,9 @@
           />
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" :icon="Search" size="default" @click="handleQuery">{{ t('search') }}</el-button>
-          <el-button :icon="Refresh" size="default" @click="resetQuery">{{ t('reset') }}</el-button>
-          <el-checkbox v-model="queryParams.showSenior" style="margin: 0px 10px" @change="handleQuery">{{ t('product.index091251-8') }}</el-checkbox>
-          <el-tooltip :content="t('product.index091251-9')" placement="top">
-            <el-icon><InfoFilled /></el-icon>
-          </el-tooltip>
+          <el-button type="primary" :icon="Search" size="default" @click="handleQuery">搜索</el-button>
+          <el-button :icon="Refresh" size="default" @click="resetQuery">重置</el-button>
+          
         </el-form-item>
       </el-form>
     </el-card>

+ 508 - 0
src/views/pms/video_center/device/baiduMapPicker.vue

@@ -0,0 +1,508 @@
+<template>
+  <el-dialog
+    v-model="dialogVisible"
+    :title="title"
+    :width="dialogWidth"
+    :fullscreen="isFullscreen"
+    :close-on-click-modal="false"
+    @closed="handleDialogClosed"
+    class="map-picker-dialog"
+  >
+    <!-- 地图容器 -->
+    <div ref="mapContainer" class="map-container"></div>
+
+    <!-- 工具栏 -->
+    <div class="toolbar">
+      <el-space :size="10">
+        <el-input
+          v-model="searchAddress"
+          placeholder="输入地址搜索"
+          clearable
+          @keyup.enter="handleAddressSearch"
+          style="width: 300px"
+        >
+          <template #prepend>
+            <el-icon><Search /></el-icon>
+          </template>
+        </el-input>
+
+        <el-button-group>
+          <el-button type="primary" @click="handleAddressSearch"> 搜索地址 </el-button>
+        </el-button-group>
+      </el-space>
+    </div>
+
+    <!-- 结果展示区域 -->
+    <div class="result-panel">
+      <el-descriptions
+        :title="selectedPoint ? '拾取结果' : '操作提示'"
+        :column="1"
+        border
+        size="small"
+      >
+        <el-descriptions-item label="坐标" v-if="selectedPoint">
+          {{ selectedPoint.lng }}, {{ selectedPoint.lat }}
+          <el-button type="text" size="small" @click="copyCoordinates" class="copy-btn">
+            <el-icon><CopyDocument /></el-icon>
+            复制
+          </el-button>
+        </el-descriptions-item>
+
+        <el-descriptions-item label="地址" v-if="selectedPoint">
+          {{ selectedPoint.address }}
+        </el-descriptions-item>
+
+        <el-descriptions-item label="操作提示" v-if="!selectedPoint">
+          <span class="tip-text"> 点击地图选择位置,或输入地址进行搜索 </span>
+        </el-descriptions-item>
+      </el-descriptions>
+    </div>
+  </el-dialog>
+</template>
+
+<script setup>
+import { ref, watch, nextTick, computed } from 'vue'
+import { Search, CopyDocument, Plus, Minus, Location, FullScreen } from '@element-plus/icons-vue'
+import { ElMessage, ElMessageBox } from 'element-plus'
+
+const props = defineProps({
+  modelValue: {
+    type: Boolean,
+    default: false
+  },
+  // 对话框标题
+  title: {
+    type: String,
+    default: '地图坐标拾取器'
+  },
+  // 初始中心点
+  initCenter: {
+    type: Object,
+    default: () => ({ lng: 116.404, lat: 39.915 })
+  },
+  // 初始缩放级别
+  initZoom: {
+    type: Number,
+    default: 12
+  },
+  // 对话框宽度
+  width: {
+    type: String,
+    default: '900px'
+  }
+})
+
+// 自定义事件
+const emit = defineEmits(['update:modelValue', 'select'])
+
+// 响应式数据
+const dialogVisible = ref(props.modelValue)
+const mapContainer = ref(null)
+const searchAddress = ref('')
+const inputLng = ref('')
+const inputLat = ref('')
+const selectedPoint = ref(null)
+const hasGeolocation = ref('geolocation' in navigator)
+const isFullscreen = ref(false)
+
+let map = null
+let geocoder = null
+let currentMarker = null
+let infoWindow = null
+
+const dialogWidth = computed(() => {
+  return isFullscreen.value ? '100%' : props.width
+})
+
+// 监听 modelValue 变化
+watch(
+  () => props.modelValue,
+  (val) => {
+    dialogVisible.value = val
+    if (val) {
+      // 对话框打开时初始化地图
+      nextTick(() => {
+        initMap()
+      })
+    }
+  }
+)
+
+// 监听对话框可见性变化
+watch(dialogVisible, (val) => {
+  emit('update:modelValue', val)
+  if (!val) {
+    cleanupMap()
+  }
+})
+
+// 初始化地图
+const initMap = () => {
+  // 如果容器不存在或已初始化,则返回
+  if (!mapContainer.value || map) return
+
+  // 动态加载百度地图API
+  if (!window.BMap) {
+    loadBaiduMapAPI()
+    return
+  }
+
+  nextTick(() => {
+    try {
+      // 创建地图实例
+      map = new BMap.Map(mapContainer.value)
+      map.centerAndZoom(new BMap.Point(props.initCenter.lng, props.initCenter.lat), props.initZoom)
+
+      // 启用控件和交互
+      map.enableScrollWheelZoom(true)
+      map.addControl(new BMap.NavigationControl())
+      map.addControl(new BMap.ScaleControl())
+
+      // 初始化地理编码器
+      geocoder = new BMap.Geocoder()
+
+      // 绑定地图点击事件
+      map.addEventListener('click', handleMapClick)
+
+      console.log('百度地图初始化完成')
+    } catch (error) {
+      console.error('地图初始化失败:', error)
+      ElMessage.error('地图初始化失败,请检查API Key和网络连接')
+    }
+  })
+}
+
+// 动态加载百度地图API
+const loadBaiduMapAPI = () => {
+  return new Promise((resolve, reject) => {
+    if (window.BMap) {
+      initMap()
+      resolve()
+      return
+    }
+
+    const script = document.createElement('script')
+    script.type = 'text/javascript'
+    script.src = `https://api.map.baidu.com/api?v=3.0&ak=c0crhdxQ5H7WcqbcazGr7mnHrLa4GmO0&type=webgl&callback=initBaiduMapCallback`
+
+    // 设置超时
+    const timeoutId = setTimeout(() => {
+      reject(new Error('百度地图API加载超时'))
+    }, 10000)
+
+    // 全局回调函数
+    window.initBaiduMapCallback = () => {
+      clearTimeout(timeoutId)
+      nextTick(() => {
+        initMap()
+      })
+      resolve()
+    }
+
+    script.onerror = () => {
+      clearTimeout(timeoutId)
+      reject(new Error('百度地图API加载失败'))
+    }
+
+    document.head.appendChild(script)
+  })
+}
+
+// 地图点击事件处理
+const handleMapClick = (e) => {
+  const point = e.point
+
+  // 反向地理编码获取地址信息
+  geocoder.getLocation(point, (result) => {
+    if (result) {
+      const pointData = {
+        lng: point.lng.toFixed(6),
+        lat: point.lat.toFixed(6),
+        address: result.address,
+        formattedAddress: formatAddress(result),
+        pois: result.surroundingPois || [],
+        rawPoint: point // 保存原始点对象供后续使用
+      }
+
+      selectedPoint.value = pointData
+
+      // 添加标记
+      addMarker(point, result.address)
+
+      // 触发选择事件
+      emit('select', pointData)
+    }
+  })
+}
+
+// 地址搜索
+const handleAddressSearch = async () => {
+  if (!searchAddress.value.trim()) {
+    ElMessage.warning('请输入搜索地址')
+    return
+  }
+
+  if (!geocoder) {
+    ElMessage.warning('地图服务正在初始化,请稍后再试')
+    return
+  }
+
+  try {
+    // 使用 LocalSearch 进行地址搜索
+    const local = new BMap.LocalSearch(map, {
+      onSearchComplete: function (results) {
+        if (local.getStatus() == BMAP_STATUS_SUCCESS) {
+          // 获取第一个搜索结果
+          if (results.getNumPois() > 0) {
+            const poi = results.getPoi(0)
+            const point = poi.point
+
+            map.centerAndZoom(point, 16)
+
+            // 获取详细地址信息
+            geocoder.getLocation(point, (result) => {
+              const pointData = {
+                lng: point.lng.toFixed(6),
+                lat: point.lat.toFixed(6),
+                address: result?.address || poi.title,
+                formattedAddress: result ? formatAddress(result) : '',
+                pois: result?.surroundingPois || [],
+                rawPoint: point
+              }
+
+              selectedPoint.value = pointData
+              addMarker(point, result?.address || poi.title)
+
+              emit('select', pointData)
+            })
+          } else {
+            ElMessage.warning('未找到该地址对应的坐标')
+          }
+        } else {
+          ElMessage.warning('未找到该地址对应的坐标')
+        }
+      }
+    })
+
+    local.search(searchAddress.value)
+  } catch (error) {
+    console.error('地址搜索失败:', error)
+    ElMessage.error('地址搜索失败,请重试')
+  }
+}
+
+// 添加标记点
+const addMarker = (point, title) => {
+  // 清除旧标记
+  if (currentMarker) {
+    map.removeOverlay(currentMarker)
+    if (infoWindow) {
+      map.closeInfoWindow(infoWindow)
+    }
+  }
+
+  // 创建新标记
+  currentMarker = new BMap.Marker(point)
+  map.addOverlay(currentMarker)
+
+  // 创建信息窗口
+  infoWindow = new BMap.InfoWindow(title, {
+    width: 250,
+    height: 60
+  })
+
+  // 标记点击事件
+  currentMarker.addEventListener('click', () => {
+    currentMarker.openInfoWindow(infoWindow)
+  })
+
+  currentMarker.openInfoWindow(infoWindow)
+}
+
+const formatAddress = (result) => {
+  if (!result || !result.addressComponents) return ''
+
+  const addr = result.addressComponents
+  const components = []
+
+  if (addr.province) components.push(addr.province)
+  if (addr.city && addr.city !== addr.province) components.push(addr.city)
+  if (addr.district) components.push(addr.district)
+  if (addr.street) components.push(addr.street)
+  if (addr.streetNumber) components.push(addr.streetNumber)
+
+  return components.join('')
+}
+
+const copyCoordinates = async () => {
+  if (!selectedPoint.value) return
+
+  const text = `${selectedPoint.value.lng}, ${selectedPoint.value.lat}`
+
+  try {
+    await navigator.clipboard.writeText(text)
+    ElMessage.success('坐标已复制到剪贴板')
+  } catch (err) {
+    // 降级方案
+    const textArea = document.createElement('textarea')
+    textArea.value = text
+    document.body.appendChild(textArea)
+    textArea.select()
+    document.execCommand('copy')
+    document.body.removeChild(textArea)
+    ElMessage.success('坐标已复制')
+  }
+}
+
+// 地图控制方法
+const zoomIn = () => {
+  if (map) map.zoomIn()
+}
+
+const zoomOut = () => {
+  if (map) map.zoomOut()
+}
+
+const handleDialogClosed = () => {
+  cleanupMap()
+}
+
+const cleanupMap = () => {
+  if (currentMarker) {
+    map?.removeOverlay(currentMarker)
+    currentMarker = null
+  }
+  if (infoWindow) {
+    map?.closeInfoWindow(infoWindow)
+    infoWindow = null
+  }
+  selectedPoint.value = null
+  searchAddress.value = ''
+  inputLng.value = ''
+  inputLat.value = ''
+}
+
+const handleConfirm = () => {
+  if (!selectedPoint.value) {
+    ElMessage.warning('请先选择坐标点')
+    return
+  }
+
+  emit('confirm', selectedPoint.value)
+  dialogVisible.value = false
+}
+
+const handleCancel = () => {
+  emit('cancel')
+  dialogVisible.value = false
+}
+
+defineExpose({
+  openDialog: () => {
+    dialogVisible.value = true
+  },
+  closeDialog: () => {
+    dialogVisible.value = false
+  },
+  getSelectedPoint: () => selectedPoint.value,
+  clearSelection: () => {
+    cleanupMap()
+  }
+})
+</script>
+
+<style scoped>
+.map-picker-dialog {
+  :deep(.el-dialog__body) {
+    padding: 0;
+    display: flex;
+    flex-direction: column;
+    height: 70vh;
+  }
+}
+
+.map-container {
+  flex: 1;
+  min-height: 400px;
+  background: #f5f5f5;
+}
+
+.toolbar {
+  padding: 15px;
+  background: white;
+  border-bottom: 1px solid #ebeef5;
+}
+
+.result-panel {
+  padding: 15px;
+  background: white;
+  border-top: 1px solid #ebeef5;
+  max-height: 200px;
+  overflow-y: auto;
+}
+
+.copy-btn {
+  margin-left: 10px;
+  padding: 2px 4px;
+}
+
+.tip-text {
+  color: #909399;
+  font-style: italic;
+}
+
+.poi-section {
+  margin-top: 10px;
+}
+
+.poi-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+
+.poi-item {
+  padding: 6px 8px;
+  border-bottom: 1px solid #f0f0f0;
+  cursor: pointer;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  transition: background-color 0.2s;
+}
+
+.poi-item:hover {
+  background-color: #f5f7fa;
+}
+
+.poi-title {
+  font-size: 13px;
+  color: #303133;
+}
+
+.poi-distance {
+  font-size: 12px;
+  color: #909399;
+}
+
+.map-controls {
+  position: absolute;
+  top: 85px;
+  right: 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  z-index: 1000;
+}
+
+.map-controls .el-button-group {
+  display: flex;
+  flex-direction: column;
+}
+
+.dialog-footer {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+}
+</style>

+ 92 - 53
src/views/pms/video_center/device/device-edit.vue

@@ -14,7 +14,7 @@
           <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
             <el-row :gutter="100">
               <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
-                 <el-form-item label="所在部门" prop="deptId">
+                <el-form-item label="所在部门" prop="deptId">
                   <el-tree-select
                     v-model="form.deptId"
                     :data="deptList"
@@ -24,8 +24,6 @@
                     filterable
                     placeholder="请选择所在部门"
                     @change="handleDeptChange"
-                    
-                   
                   />
                 </el-form-item>
                 <el-form-item :label="t('device.device-edit148398-1')" prop="deviceName">
@@ -42,17 +40,16 @@
                 </el-form-item>
 
                 <el-form-item label="关联设备" prop="pmsDevice">
-                   <el-select v-model="form.pmsDevice" placeholder="请选择要关联的设备">
-                      <el-option
-                        v-for="item in deviceOptions"
-                        :key="item.key"
-                        :label="item.label"
-                        :value="item.key"
-                      />
-                    </el-select>
+                  <el-select v-model="form.pmsDevice" placeholder="请选择要关联的设备">
+                    <el-option
+                      v-for="item in deviceOptions"
+                      :key="item.key"
+                      :label="item.label"
+                      :value="item.key"
+                    />
+                  </el-select>
                 </el-form-item>
 
-
                 <el-form-item prop="productName">
                   <template #label>
                     <span style="color: red">*</span>
@@ -181,8 +178,8 @@
                     <template #append>
                       <el-link
                         :underline="false"
-                        href="https://api.map.baidu.com/lbsapi/getpoint/index.html"
-                        target="_blank"
+                         @click="showMapPicker"
+                       
                         :disabled="form.locationWay !== 3"
                       >
                         {{ t('device.device-edit148398-23') }}
@@ -200,8 +197,7 @@
                     <template #append>
                       <el-link
                         :underline="false"
-                        href="https://api.map.baidu.com/lbsapi/getpoint/index.html"
-                        target="_blank"
+                         @click="showMapPicker"
                         :disabled="form.locationWay !== 3"
                       >
                         {{ t('device.device-edit148398-23') }}
@@ -605,11 +601,20 @@
         </template>
       </el-dialog>
     </el-card>
+
+   <BaiduMapPicker
+      v-model="showMapDialog"
+      :title="'请选择坐标位置'"
+      :init-center="initCenter"
+      :init-zoom="13"
+      @select="handleCoordinateSelect"
+      @update:modelValue="handleDialogVisibleChange"
+    />
   </div>
 </template>
 
 <script setup>
-import { ref,unref ,reactive, computed, onMounted, onActivated, onUnmounted, nextTick } from 'vue'
+import { ref, unref, reactive, computed, onMounted, onActivated, onUnmounted, nextTick } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import JsonViewer from 'vue-json-viewer/ssr'
@@ -658,6 +663,8 @@ import DeptTree from '@/views/system/user/DeptTree.vue'
 import { defaultProps, handleTree } from '@/utils/tree'
 import * as DeptApi from '@/api/system/dept'
 import { IotDeviceApi } from '@/api/pms/device'
+import BaiduMapPicker from './baiduMapPicker.vue'
+
 defineOptions({
   name: 'VideoCenterDeviceEdit'
 })
@@ -709,7 +716,7 @@ const form = reactive({
   productId: 0,
   status: 1,
   deptId: '',
-  pmsDevice:'',
+  pmsDevice: '',
   locationWay: 1,
   firmwareVersion: 1.0,
   serialNumber: '',
@@ -852,11 +859,12 @@ const mqttSubscribe = (device) => {
 }
 
 const getPlayerData = (data) => {
-  console.log('>>>>>>>>>>>>>>>>>>>>>', data)
   activeName.value = data.tabName
   channelId.value = data.channelId
+  console.log('***********************', channelId.value, deviceLiveStreamRef.value)
   nextTick(() => {
     if (channelId.value && deviceLiveStreamRef.value) {
+      console.log('1111111111111111111')
       deviceLiveStreamRef.value.channelId = channelId.value
       deviceLiveStreamRef.value.changeChannel()
     }
@@ -978,32 +986,31 @@ const formatThingsModel = (data) => {
 }
 
 function loadBMap() {
-    return new Promise(function(resolve, reject) {
-        if (typeof BMap !== 'undefined') {
-            resolve(BMap)
-            return true
-        }
-        window.onBMapCallback = function() {
-            resolve(BMap)
-        }
-        // 使用https协议需要添加一下meta标签
-        let protocolStr = document.location.protocol;  
-        if(protocolStr == "https:")  
-        {  
-            let meta = document.createElement('meta')
-            meta.httpEquiv = 'Content-Security-Policy'
-            meta.content ='upgrade-insecure-requests'
-            meta.onerror = reject
-            document.head.appendChild(meta)
-        }       
-        // 引入百度地图
-        let script = document.createElement('script')
-        script.type = 'text/javascript'
-        script.src =
-            'https://api.map.baidu.com/api?v=3.0&ak=c0crhdxQ5H7WcqbcazGr7mnHrLa4GmO0&type=webgl'
-        script.onerror = reject
-        document.head.appendChild(script)
-    })
+  return new Promise(function (resolve, reject) {
+    if (typeof BMap !== 'undefined') {
+      resolve(BMap)
+      return true
+    }
+    window.onBMapCallback = function () {
+      resolve(BMap)
+    }
+    // 使用https协议需要添加一下meta标签
+    let protocolStr = document.location.protocol
+    if (protocolStr == 'https:') {
+      let meta = document.createElement('meta')
+      meta.httpEquiv = 'Content-Security-Policy'
+      meta.content = 'upgrade-insecure-requests'
+      meta.onerror = reject
+      document.head.appendChild(meta)
+    }
+    // 引入百度地图
+    let script = document.createElement('script')
+    script.type = 'text/javascript'
+    script.src =
+      'https://api.map.baidu.com/api?v=3.0&ak=c0crhdxQ5H7WcqbcazGr7mnHrLa4GmO0&type=webgl'
+    script.onerror = reject
+    document.head.appendChild(script)
+  })
 }
 
 const loadMap = () => {
@@ -1014,6 +1021,35 @@ const loadMap = () => {
   })
 }
 
+// 对话框状态
+const showMapDialog = ref(false)
+
+// 选择的坐标信息
+const selectedCoordinate = ref(null)
+
+// 初始化中心点(可以根据需要设置默认值)
+const initCenter = ref({ 
+  lng: 121.4737,  // 上海
+  lat: 31.2304 
+})
+
+// 打开地图选择器
+const showMapPicker = () => {
+  showMapDialog.value = true
+}
+
+
+// 处理坐标选择(每次选择都会触发)
+const handleCoordinateSelect = (coordinate) => {
+  console.log('选择变更:', coordinate)
+}
+
+
+// 处理对话框可见性变化
+const handleDialogVisibleChange = (visible) => {
+  console.log('对话框状态:', visible ? '打开' : '关闭')
+}
+
 const goBack = () => {
   // 关闭当前tab页签,打开新页签
   const { delView } = useTagsViewStore()
@@ -1265,7 +1301,7 @@ const handleViewMqtt = () => {
   })
 }
 
-onMounted(async() => {
+onMounted(async () => {
   let activeNameParam = route.query.activeName
   if (activeNameParam !== null && activeNameParam !== '') {
     activeName.value = activeNameParam
@@ -1273,13 +1309,16 @@ onMounted(async() => {
   // 获取设备信息
   form.deviceId = route.query && route.query.deviceId
 
-    if (form.deviceId != 0) {
-       
-      getDevice(form.deviceId).then((response) => { 
-        
-        Object.assign(form, response)
-      })
-    }
+  if (form.deviceId != 0) {
+    getDevice(form.deviceId).then((response) => {
+      Object.assign(form, response)
+    })
+
+    console.log('dddddddddddddddddddddd', form)
+    handleDeptChange(form.deptId)
+  }
+
+  
 
   isSubDev.value = route.query.isSubDev === 1
 

+ 1 - 1
src/views/pms/video_center/product/index.vue

@@ -530,7 +530,7 @@ function handleTemp() {
 // 查看设备按钮操作
 function handleViewDevice(productId) {
   router.push({
-    path: '/videocenter/device',
+    path: '/iotvideopms/videodevice',
     query: {
       t: Date.now(),
       productId: productId

+ 0 - 1803
src/views/pms/video_center/productedit.vue

@@ -1,1803 +0,0 @@
-<template>
-  <div>
-    <el-card style="margin: 6px; padding-bottom: 100px" class="main-card">
-      <el-tabs
-        v-model="activeName"
-        style="padding: 10px; min-height: 400px"
-        tab-position="left"
-        @tab-change="tabChange"
-      >
-        <el-tab-pane name="basic">
-          <template #label>
-            <span style="color: red">*</span>
-            {{ t('product.product-edit473153-0') }}
-          </template>
-          <el-form ref="formRef" :model="form" :rules="rules" label-width="100px">
-            <el-row :gutter="100">
-              <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
-                <!-- <el-form-item label="所在部门" prop="groupName">
-                  <el-tree-select
-                    v-model="form.groupName"
-                    :data="deptList"
-                    :props="defaultProps"
-                    check-strictly
-                    node-key="id"
-                    filterable
-                    placeholder="请选择所在部门"
-                    @change="handleDeptChange"
-                    :disabled="form.status == 2 || form.isOwner == 0"
-                   
-                  />
-                </el-form-item> -->
-                <el-form-item :label="t('product.product-edit473153-1')" prop="productName">
-                  <el-input
-                    v-model="form.productName"
-                    :placeholder="t('product.product-edit473153-2')"
-                    :readonly="form.status == 2 || form.isOwner == 0"
-                  />
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-3')" prop="categoryId">
-                  <el-select
-                    v-model="form.categoryId"
-                    :placeholder="t('product.product-edit473153-4')"
-                    @change="selectCategory"
-                    style="width: 100%"
-                    :disabled="form.status == 2 || form.isOwner == 0"
-                  >
-                    <el-option
-                      v-for="category in categoryShortList"
-                      :key="category.categoryId"
-                      :label="category.categoryName"
-                      :value="category.categoryId"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item v-if="form.deviceType !== 3" label="通讯协议" prop="protocolCode">
-                  <template #label>
-                    <span>通讯协议</span>
-                    <el-tooltip effect="light" placement="bottom" style="cursor: pointer">
-                      <template #content>
-                        产品建立后,不允许修改通讯协议,修改会导致该产品下设备脏数据问题
-                        <br />
-                      </template>
-                      <el-icon><QuestionFilled /></el-icon>
-                    </el-tooltip>
-                  </template>
-                  <el-select
-                    v-model="form.protocolCode"
-                    :disabled="form.status == 2 || form.productId != 0 || form.isOwner == 0"
-                    placeholder="请选择协议"
-                    style="width: 100%"
-                    @change="changeProductCode"
-                  >
-                    <el-option
-                      v-for="p in protocolList"
-                      :key="p.protocolCode"
-                      :label="p.protocolName"
-                      :value="p.protocolCode"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item v-if="form.deviceType !== 3 && tempOpen">
-                  <el-alert
-                    description="当前通讯协议为modbus协议,请选择采集点模板,默认添加设备为网关设备"
-                    type="success"
-                  />
-                </el-form-item>
-                <el-form-item v-if="tempOpen && selectRowData" prop="templateId">
-                  <template #label>
-                    <span style="color: #f56c6c">*</span>
-                    采集点模板
-                  </template>
-                  <div style="display: inline-block; padding-right: 5px">
-                    <span
-                      style="
-                        font-size: 9px;
-                        padding-right: 5px;
-                        color: #00bb00;
-                        font-size: 12px;
-                        font-weight: bold;
-                      "
-                      >{{ selectRowData.templateName }}</span
-                    >
-                    <el-button
-                      :disabled="form.status == 2 || form.productId != 0 || form.isOwner == 0"
-                      plain
-                      size="small"
-                      @click="deleteData"
-                      >删除</el-button
-                    >
-                  </div>
-                  <el-button
-                    plain
-                    size="small"
-                    type="primary"
-                    :disabled="form.status == 2 || form.productId != 0 || form.isOwner == 0"
-                    @click="selectTemplate"
-                    >选择模板</el-button
-                  >
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-78')" prop="deviceType">
-                  <el-select
-                    v-model="form.deviceType"
-                    :disabled="form.productId != 0"
-                    placeholder="请选择设备类型"
-                    style="width: 100%"
-                  >
-                    <el-option
-                      v-for="dict in iot_device_type"
-                      :key="dict.value"
-                      :label="dict.label"
-                      :value="parseInt(dict.value)"
-                    />
-                  </el-select>
-                </el-form-item>
-
-                <el-form-item
-                  v-if="form.deviceType !== 4"
-                  :label="t('product.product-edit473153-14')"
-                  prop="transport"
-                >
-                  <el-select
-                    v-model="form.transport"
-                    :placeholder="t('product.product-edit473153-15')"
-                    style="width: 100%"
-                    :disabled="form.productId != 0"
-                    @change="transportChange"
-                  >
-                    <el-option
-                      v-for="dict in iot_transport_type"
-                      :key="dict.value"
-                      :value="dict.value"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-16')" prop="networkMethod">
-                  <el-select
-                    v-model="form.networkMethod"
-                    :placeholder="t('product.product-edit473153-17')"
-                    style="width: 100%"
-                    :disabled="form.productId != 0"
-                  >
-                    <el-option
-                      v-for="dict in networkOptions"
-                      :key="dict.value"
-                      :label="dict.label"
-                      :value="parseInt(dict.value)"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-18')" prop="isSys">
-                  <template #label>
-                    <span>{{ t('product.product-edit473153-18') }}</span>
-                    <el-tooltip style="cursor: pointer" effect="light" placement="bottom">
-                      <template #content>
-                        {{ t('product.product-edit473153-19') }}
-                        <br />
-                      </template>
-                      <el-icon><QuestionFilled /></el-icon>
-                    </el-tooltip>
-                  </template>
-                  <el-switch
-                    v-model="form.isSys"
-                    :active-value="1"
-                    :disabled="form.productId != 0"
-                    :inactive-value="0"
-                  />
-                </el-form-item>
-              </el-col>
-              <el-col
-                v-show="dialogVisibleInterface === 'MTG'"
-                :xs="24"
-                :sm="24"
-                :md="24"
-                :lg="12"
-                :xl="8"
-              >
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-20')"
-                  prop="networkMethod"
-                >
-                  <el-switch
-                    v-model="form.isAuthorize"
-                    @change="changeIsAuthorize"
-                    :active-value="1"
-                    :inactive-value="0"
-                    :disabled="form.productId != 0"
-                  />
-                </el-form-item>
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-21')"
-                  prop="vertificateMethod"
-                >
-                  <el-select
-                    v-model="form.vertificateMethod"
-                    :placeholder="t('product.product-edit473153-22')"
-                    style="width: 100%"
-                    :disabled="form.productId != 0"
-                  >
-                    <el-option
-                      v-for="dict in iot_vertificate_method"
-                      :key="dict.value"
-                      :label="dict.label"
-                      :value="parseInt(dict.value)"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-23')"
-                  prop="locationWay"
-                >
-                  <el-select
-                    v-model="form.locationWay"
-                    :placeholder="t('product.product-edit473153-24')"
-                    clearable
-                    size="small"
-                    :disabled="form.productId != 0"
-                    style="width: 100%"
-                  >
-                    <el-option
-                      v-for="dict in iot_location_way"
-                      :key="dict.value"
-                      :label="dict.label"
-                      :value="Number(dict.value)"
-                    />
-                  </el-select>
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-25')" prop="productId">
-                  <el-input
-                    v-model="form.productId"
-                    :placeholder="t('product.product-edit473153-26')"
-                    :disabled="form.productId != 0"
-                    readonly
-                  />
-                </el-form-item>
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-27')"
-                  prop="mqttAccount"
-                >
-                  <el-input
-                    v-model="form.mqttAccount"
-                    :placeholder="t('product.product-edit473153-28')"
-                    :disabled="form.deviceType == 3"
-                    :readonly="accountInputType == 'password' || form.isOwner == 0"
-                    :type="accountInputType"
-                  >
-                    <template #append>
-                      <el-button
-                        :icon="View"
-                        style="font-size: 18px"
-                        @click="changeInputType('account')"
-                      />
-                    </template>
-                  </el-input>
-                </el-form-item>
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-29')"
-                  prop="mqttPassword"
-                >
-                  <el-input
-                    v-model="form.mqttPassword"
-                    :placeholder="t('product.product-edit473153-30')"
-                    :disabled="form.deviceType == 3"
-                    :readonly="passwordInputType == 'password' || form.isOwner == 0"
-                    :type="passwordInputType"
-                  >
-                    <template #append>
-                      <el-button
-                        :icon="View"
-                        style="font-size: 18px"
-                        @click="changeInputType('password')"
-                      />
-                    </template>
-                  </el-input>
-                </el-form-item>
-                <el-form-item
-                  v-if="form.deviceType != 4"
-                  :label="t('product.product-edit473153-31')"
-                  prop="mqttSecret"
-                >
-                  <el-input
-                    v-model="form.mqttSecret"
-                    :placeholder="t('product.product-edit473153-26')"
-                    :disabled="form.productId != 0"
-                    readonly
-                    :type="keyInputType"
-                  >
-                    <template #append>
-                      <el-button
-                        :icon="View"
-                        style="font-size: 18px"
-                        @click="changeInputType('key')"
-                      />
-                    </template>
-                  </el-input>
-                </el-form-item>
-                <el-form-item :label="t('product.product-edit473153-32')" prop="remark">
-                  <el-input
-                    v-model="form.remark"
-                    :placeholder="t('product.product-edit473153-33')"
-                    rows="3"
-                    :readonly="form.status == 2 || form.isOwner == 0"
-                  />
-                </el-form-item>
-              </el-col>
-
-              <el-col
-                :xs="24"
-                :sm="24"
-                :md="24"
-                :lg="12"
-                :xl="8"
-                v-show="dialogVisibleInterface === 'HTTP'"
-              >
-                <el-form-item label="用户登录">
-                  <el-switch
-                    v-model="userParmas.isLogin"
-                    @change="changeIsLogin"
-                    :active-value="true"
-                    :inactive-value="false"
-                  />
-                </el-form-item>
-
-                <el-form-item label="响应数据key">
-                  <el-input
-                    v-model="form.responseKey"
-                    :disabled="form.status == 2 ? true : false"
-                  />
-                </el-form-item>
-                <el-form-item label="请求间隔">
-                  <el-input
-                    v-model="form.cronExpression"
-                    placeholder="请输入cron执行表达式"
-                    :disabled="form.status == 2 ? true : false"
-                  >
-                    <template #append>
-                      <el-button
-                        type="primary"
-                        @click="handleShowCron"
-                        :disabled="form.status == 2 ? true : false"
-                      >
-                        生成表达式
-                        <el-icon class="el-icon--right"><Timer /></el-icon>
-                      </el-button>
-                    </template>
-                  </el-input>
-                </el-form-item>
-
-                <el-form-item label="请求方式">
-                  <el-select
-                    v-model="form.methodType"
-                    placeholder="请选择"
-                    :disabled="form.status == 2 ? true : false"
-                  >
-                    <el-option label="get" value="get" />
-                    <el-option label="post" value="post" />
-                    <el-option label="put" value="put" />
-                  </el-select>
-                </el-form-item>
-
-                <el-form-item label="请求地址">
-                  <el-input
-                    placeholder="例:http:127.0.0.1/"
-                    v-model="form.url"
-                    :disabled="form.status == 2 ? true : false"
-                  />
-                </el-form-item>
-
-                <el-form-item label="请求参数">
-                  <div style="margin-top: 20px; overflow-y: auto">
-                    <el-tabs style="height: 350px" v-model="form.requestType">
-                      <el-tab-pane label="Header" :disabled="form.status == 2 ? true : false">
-                        <el-table :data="form.headersList" style="width: 100%">
-                          <el-table-column type="index" width="50" />
-                          <el-table-column label="key" prop="key">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.key"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="value" prop="value">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.value"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="操作" width="120">
-                            <template #default="scope">
-                              <el-button
-                                size="small"
-                                @click="handleEdit(form.headersList)"
-                                :disabled="form.status == 2 ? true : false"
-                                >+</el-button
-                              >
-                              <el-button
-                                size="small"
-                                type="danger"
-                                @click="handleDelete(scope.$index, form.headersList)"
-                                :disabled="form.status == 2 ? true : false"
-                                >-</el-button
-                              >
-                            </template>
-                          </el-table-column>
-                        </el-table>
-                      </el-tab-pane>
-                      <el-tab-pane label="Params" :disabled="form.status == 2 ? true : false">
-                        <el-table :data="form.paramsDataList" style="width: 100%">
-                          <el-table-column type="index" width="50" />
-                          <el-table-column label="key" prop="key">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.key"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="value" prop="value">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.value"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="操作" width="120">
-                            <template #default="scope">
-                              <el-button
-                                size="small"
-                                @click="handleEdit(form.paramsDataList)"
-                                :disabled="form.status == 2 ? true : false"
-                                >+</el-button
-                              >
-                              <el-button
-                                size="small"
-                                type="danger"
-                                :disabled="form.status == 2 ? true : false"
-                                @click="handleDelete(scope.$index, form.paramsDataList)"
-                                >-</el-button
-                              >
-                            </template>
-                          </el-table-column>
-                        </el-table>
-                      </el-tab-pane>
-                      <el-tab-pane label="Body" :disabled="form.status == 2 ? true : false">
-                        <div style="margin-bottom: 10px">
-                          <el-radio-group
-                            v-model="form.contentTypeNumber"
-                            :disabled="form.status == 2 ? true : false"
-                          >
-                            <el-radio :label="1">none</el-radio>
-                            <el-radio :label="2">form-data</el-radio>
-                            <el-radio :label="3">x-www-form-urlencoded</el-radio>
-                            <el-radio :label="4">json</el-radio>
-                            <el-radio :label="5">xml</el-radio>
-                          </el-radio-group>
-                        </div>
-                        <el-empty
-                          description="该请求没有body体"
-                          v-if="form.contentTypeNumber == 1"
-                          :image-size="100"
-                        />
-                        <el-table
-                          :data="form.bodyDataTable"
-                          style="width: 100%"
-                          v-else-if="form.contentTypeNumber == 2 || form.contentTypeNumber == 3"
-                        >
-                          <el-table-column type="index" width="50" />
-                          <el-table-column label="key" prop="key">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.key"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="value" prop="value">
-                            <template #default="scope">
-                              <el-input
-                                placeholder="请输入"
-                                v-model="scope.row.value"
-                                :disabled="form.status == 2 ? true : false"
-                              />
-                            </template>
-                          </el-table-column>
-                          <el-table-column label="操作" width="120">
-                            <template #default="scope">
-                              <el-button
-                                size="small"
-                                @click="handleEdit(form.bodyDataTable)"
-                                :disabled="form.status == 2 ? true : false"
-                                >+</el-button
-                              >
-                              <el-button
-                                size="small"
-                                type="danger"
-                                @click="handleDelete(scope.$index, form.bodyDataTable)"
-                                :disabled="form.status == 2 ? true : false"
-                                >-</el-button
-                              >
-                            </template>
-                          </el-table-column>
-                        </el-table>
-                        <el-input
-                          type="textarea"
-                          :rows="8"
-                          placeholder="请输入内容"
-                          v-model="form.bodyDataArea"
-                          v-else-if="form.contentTypeNumber == 4 || form.contentTypeNumber == 5"
-                          :disabled="form.status == 2 ? true : false"
-                        />
-                      </el-tab-pane>
-                    </el-tabs>
-                  </div>
-                </el-form-item>
-              </el-col>
-
-              <el-col
-                v-show="dialogVisibleInterface === 'SNMP'"
-                :xs="24"
-                :sm="24"
-                :md="24"
-                :lg="12"
-                :xl="8"
-              >
-                <el-form-item label="请求间隔">
-                  <el-input
-                    v-model="form.cronExpression"
-                    placeholder="请输入cron执行表达式"
-                    :disabled="form.status == 2 ? true : false"
-                  >
-                    <template #append>
-                      <el-button
-                        type="primary"
-                        @click="handleShowCron"
-                        :disabled="form.status == 2 ? true : false"
-                      >
-                        生成表达式
-                        <el-icon class="el-icon--right"><Timer /></el-icon>
-                      </el-button>
-                    </template>
-                  </el-input>
-                </el-form-item>
-                <el-form-item label="设备地址" prop="ipAddress">
-                  <el-input v-model="form.ipAddress" :disabled="form.status == 2 ? true : false" />
-                </el-form-item>
-                <el-form-item label="团体名" prop="community">
-                  <el-input v-model="form.community" :disabled="form.status == 2 ? true : false" />
-                </el-form-item>
-                <div>
-                  <el-form-item
-                    label="OID信息"
-                    label-width="57%"
-                    align="center"
-                    style="text-align: center; background-color: #f5f7fa"
-                    prop="vertificateMethod"
-                  />
-                  <div
-                    class="flex-center mb20"
-                    v-for="(item, index) in form.oidList"
-                    :key="index"
-                    style="border-bottom: 1px solid #dfe6ec; position: relative"
-                  >
-                    <el-form-item label="名称" label-width="60px" prop="oidName">
-                      <el-input
-                        style="width:"
-                        v-model="item.oidName"
-                        :disabled="form.status == 2 ? true : false"
-                      />
-                    </el-form-item>
-                    <el-form-item label="oid" label-width="50px" prop="oid">
-                      <el-input v-model="item.oid" :disabled="form.status == 2 ? true : false" />
-                    </el-form-item>
-                    <el-form-item>
-                      <el-button
-                        v-if="form.oidList.length > 1"
-                        size="small"
-                        type="danger"
-                        @click="deleteOid(item, index)"
-                        :icon="Minus"
-                      />
-                    </el-form-item>
-                  </div>
-                  <div class="flex-center">
-                    <el-button size="small" type="primary" @click="addOid" :icon="Plus" />
-                  </div>
-                </div>
-              </el-col>
-
-              <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl="8">
-                <el-form-item :label="t('product.product-edit473153-34')">
-                  <div v-if="form.status == 2 && form.imgUrl == null && form.isOwner != 0">
-                    <el-image
-                      style="height: 145px; height: 145px; border-radius: 10px"
-                      :preview-src-list="[require('@/assets/imgs/gateway.png')]"
-                      :src="require('@/assets/imgs/gateway.png')"
-                      fit="cover"
-                      v-if="form.deviceType == 2"
-                    />
-                    <el-image
-                      style="height: 145px; height: 145px; border-radius: 10px"
-                      :preview-src-list="[require('@/assets/imgs/video.png')]"
-                      :src="require('@/assets/imgs/video.png')"
-                      fit="cover"
-                      v-else-if="form.deviceType == 3"
-                    />
-                    <el-image
-                      style="height: 145px; height: 145px; border-radius: 10px"
-                      :preview-src-list="[require('@/assets/imgs/product.png')]"
-                      :src="require('@/assets/imgs/product.png')"
-                      fit="cover"
-                      v-else
-                    />
-                  </div>
-                  <div v-else>
-                    <image-upload
-                      ref="imageUploadRef"
-                      :disabled="true"
-                      :value="form.imgUrl"
-                      :limit="form.status == 2 ? 0 : 1"
-                      :file-size="1"
-                      @input="getImagePath"
-                    />
-                  </div>
-                  <div
-                    class="el-upload__tip"
-                    style="color: #f56c6c"
-                    v-if="form.productId == null || form.productId == 0"
-                  >
-                    {{ t('product.product-edit473153-35') }}
-                  </div>
-                </el-form-item>
-              </el-col>
-            </el-row>
-
-            <el-col :span="20">
-              <el-form-item style="text-align: center; margin: 40px 0px">
-                <el-button
-                  type="primary"
-                  @click="submitForm"
-                  v-show="form.productId != 0 && form.status != 2 && form.isOwner != 0"
-                >
-                  {{ t('product.product-edit473153-36') }}
-                </el-button>
-
-                <el-button
-                  type="primary"
-                  @click="submitForm"
-                  v-show="form.productId == 0 && form.status != 2"
-                  >{{ t('product.product-edit473153-37') }}</el-button
-                >
-              </el-form-item>
-            </el-col>
-          </el-form>
-        </el-tab-pane>
-        <el-tab-pane label="" name="things" :disabled="form.productId == 0">
-          <template #label>
-            <span style="color: red">*</span>
-            {{ t('product.product-edit473153-38') }}
-          </template>
-          <product-things-model
-            ref="productThingsModelRef"
-            :product="form"
-            @updateModel="updateModel"
-          />
-        </el-tab-pane>
-
-        <el-tab-pane
-          label=""
-          name="sipConfig"
-          :disabled="form.productId == 0"
-          v-if="form.deviceType === 3"
-        >
-          <template #label>{{ t('product.product-edit473153-41') }}</template>
-          <config-sip ref="configSipRef" :product="form" />
-        </el-tab-pane>
-        <el-tab-pane
-          name="scada"
-          :disabled="form.deviceId == 0"
-          v-if="form.deviceType !== 3 && isShowScada == true"
-          lazy
-        >
-          <template #label>{{ t('device.device-edit.148398-73') }}</template>
-          <product-scada ref="productScadaRef" :product="form" />
-        </el-tab-pane>
-        <!-- 用于设置间距 -->
-        <el-tab-pane>
-          <template #label>
-            <div style="margin-top: 200px"></div>
-          </template>
-        </el-tab-pane>
-        <el-tab-pane v-if="form.status == 1" name="product04" disabled>
-          <template #label>
-            <el-button
-              type="success"
-              v-if="form.isOwner != 0"
-              size="small"
-              @click="changeProductStatusAsync(2)"
-              >{{ t('product.product-edit473153-42') }}</el-button
-            >
-          </template>
-        </el-tab-pane>
-        <el-tab-pane v-if="form.status == 2" name="product05" disabled>
-          <template #label>
-            <el-button
-              type="danger"
-              v-if="form.isOwner != 0"
-              size="small"
-              @click="changeProductStatusAsync(1)"
-              >{{ t('product.product-edit473153-43') }}</el-button
-            >
-          </template>
-        </el-tab-pane>
-        <el-tab-pane name="product06" disabled>
-          <template #label>
-            <el-button type="info" size="small" @click="goBack()">{{
-              t('product.product-edit473153-44')
-            }}</el-button>
-          </template>
-        </el-tab-pane>
-      </el-tabs>
-      <!--添加从机对话框-->
-      <el-dialog v-model="open" :title="title" append-to-body width="1000px">
-        <el-row :gutter="30">
-          <el-col :span="11">
-            <el-form ref="tempParamsRef" :inline="true" :model="tempParams">
-              <el-form-item size="small">
-                <el-input v-model="tempParams.templateName" placeholder="模板名称" />
-              </el-form-item>
-              <el-form-item size="small">
-                <el-button :icon="Search" size="small" type="primary" @click="queryTemp"
-                  >搜索</el-button
-                >
-                <el-button :icon="Refresh" size="small" @click="resetQuery">重置</el-button>
-              </el-form-item>
-            </el-form>
-            <el-table
-              :border="false"
-              ref="multipleTableRef"
-              v-loading="loading"
-              :data="tempList"
-              highlight-current-row
-              style="width: 100%"
-            >
-              <el-table-column align="left" label="选择采集点模板">
-                <template #default="scope">
-                  <el-radio
-                    v-model="currentRow"
-                    :label="scope.row"
-                    @change="getCurrentRow(scope.row)"
-                    >{{ scope.row.templateName }}</el-radio
-                  >
-                </template>
-              </el-table-column>
-            </el-table>
-            <el-pagination
-              v-show="tempTotal > 0"
-              v-model:page-size="tempParams.pageSize"
-              v-model:current-page="tempParams.pageNum"
-              :total="tempTotal"
-              layout="total, prev, pager, next"
-              small
-              @current-change="getTempList"
-            />
-          </el-col>
-          <el-col :span="13">
-            <el-form :inline="true" :model="pointsParams">
-              <el-form-item size="small">
-                <template #label>
-                  <span style="font-size: 16px; font-weight: 400">物模型列表</span>
-                </template>
-              </el-form-item>
-              <el-form-item size="small">
-                <template #label>
-                  <span style="font-weight: 400; font-size: 12px">从机数量:</span>
-                </template>
-                {{ selectRowData.slaveTotal }}
-              </el-form-item>
-              <el-form-item size="small">
-                <template #label>
-                  <span style="font-weight: 400; font-size: 12px">变量数量:</span>
-                </template>
-                {{ selectRowData.pointTotal }}
-              </el-form-item>
-              <el-form-item size="small">
-                <template #label>
-                  <span style="font-weight: 400; font-size: 12px">采集方式:</span>
-                </template>
-                <dict-tag
-                  :options="data_collect_type"
-                  :value="selectRowData.pollingMethod"
-                  size="small"
-                  style="display: inline-block"
-                />
-              </el-form-item>
-            </el-form>
-            <el-table :border="false" v-loading="loading" :data="pointList" size="small">
-              <el-table-column label="物模型名称" prop="templateName" />
-              <el-table-column label="寄存器" prop="regAddr" />
-              <el-table-column label="数值类型" prop="datatype" />
-            </el-table>
-            <el-pagination
-              v-show="total > 0"
-              v-model:page-size="pointsParams.pageSize"
-              v-model:current-page="pointsParams.pageNum"
-              :total="total"
-              layout="total, prev, pager, next"
-              small
-              @current-change="getList"
-            />
-          </el-col>
-        </el-row>
-
-        <template #footer>
-          <div class="dialog-footer">
-            <el-button @click="cancel">取 消</el-button>
-            <el-button type="primary" @click="submitSelect">确 定</el-button>
-          </div>
-        </template>
-      </el-dialog>
-      <el-dialog v-model="userEdit" title="登录信息" append-to-body @close="userClose">
-        <el-form :inline="true" ref="userFormRef" :model="userParmas">
-          <div class="flex-center">
-            <div>
-              <div>
-                <el-form-item label="账号" prop="user">
-                  <el-input
-                    v-model="userParmas.user"
-                    placeholder="请输入账号"
-                    clearable
-                    size="small"
-                  />
-                </el-form-item>
-              </div>
-              <div>
-                <el-form-item label="密码" prop="password">
-                  <el-input
-                    v-model="userParmas.password"
-                    placeholder="请输入密码"
-                    clearable
-                    size="small"
-                  />
-                </el-form-item>
-              </div>
-              <div>
-                <el-form-item label="登录地址" prop="password">
-                  <el-input
-                    v-model="userParmas.url"
-                    placeholder="请输入登录地址,例:http:127.0.0.1/"
-                    clearable
-                    size="small"
-                  />
-                </el-form-item>
-              </div>
-            </div>
-          </div>
-        </el-form>
-        <template #footer>
-          <div class="dialog-footer">
-            <el-button @click="cancelUser">取 消</el-button>
-            <el-button type="primary" @click="confirmUser">确 定</el-button>
-          </div>
-        </template>
-      </el-dialog>
-      <el-dialog
-        v-model="openCron"
-        title="Cron表达式生成器"
-        append-to-body
-        destroy-on-close
-        class="scrollbar"
-      >
-        <crontab @hide="openCron = false" @fill="crontabFill" :expression="expression" />
-      </el-dialog>
-    </el-card>
-  </div>
-</template>
-
-<script setup>
-import { ref, reactive, computed, onMounted, getCurrentInstance } from 'vue'
-import { useRoute, useRouter } from 'vue-router'
-import productThingsModel from './product-things-model.vue'
-import imageUpload from './components/ImageUpload/index.vue'
-import configSip from '../sip/sipconfig.vue'
-import productScada from './product-scada.vue'
-import { listProtocol } from '@/api/pms/video/protocol'
-
-import { listShortCategory, listCategory } from '@/api/pms/video/category'
-import { getDicts } from '@/api/pms/video/dicts'
-import {
-  addProduct,
-  changeProductStatus,
-  deviceCount,
-  getProduct,
-  updateProduct
-} from '@/api/pms/video/product'
-import { getTempByPId, listTemp } from '@/api/pms/video/temp'
-import { getAllPoints } from '@/api/pms/video/template'
-
-import Crontab from './components/Crontab/index.vue'
-import { getAccessToken } from '@/utils/auth'
-import { View, QuestionFilled, Timer, Minus, Plus, Search, Refresh } from '@element-plus/icons-vue'
-import { useTagsViewStore } from '@/store/modules/tagsView'
-import DeptTree from '@/views/system/user/DeptTree.vue'
-import { defaultProps, handleTree } from '@/utils/tree'
-import * as DeptApi from '@/api/system/dept'
-import { IotDeviceApi } from '@/api/pms/device'
-
-// 定义组件名称和属性
-defineOptions({
-  name: 'VideoCenterProductEdit'
-})
-
-// 获取实例、路由和路由器
-const route = useRoute()
-const router = useRouter()
-const { t } = useI18n() // 国际化
-
-// 字典定义
-const iot_device_type = ref([])
-const iot_network_method = ref([])
-const iot_vertificate_method = ref([])
-const iot_transport_type = ref([])
-const data_collect_type = ref([])
-const iot_location_way = ref([])
-const sub_gateway_type = ref([])
-
-// Refs
-const formRef = ref(null)
-const tempParamsRef = ref(null)
-const multipleTableRef = ref(null)
-const userFormRef = ref(null)
-const imageUploadRef = ref(null)
-const productThingsModelRef = ref(null)
-const productFirmwareRef = ref(null)
-const productAuthorizeRef = ref(null)
-const configSipRef = ref(null)
-const productScadaRef = ref(null)
-
-// Reactive 数据
-const dialogVisibleInterface = ref('MTG')
-const expression = ref('')
-const openCron = ref(false)
-
-// 输入框类型
-const keyInputType = ref('password')
-const accountInputType = ref('password')
-const passwordInputType = ref('password')
-
-// 选中选项卡
-const activeName = ref('basic')
-
-// 分类短列表
-const categoryShortList = ref([])
-
-// 协议列表
-const protocolList = ref([])
-
-// 组态相关按钮是否显示,true显示,false不显示
-const isShowScada = ref(false)
-
-// 表单参数
-const userParmas = reactive({
-  isLogin: false
-})
-
-const userStatus = ref(false)
-const userEdit = ref(false)
-
-const userRule = {
-  user: [
-    {
-      required: true,
-      message: '用户id不能为空',
-      trigger: 'blur'
-    }
-  ],
-  password: [
-    {
-      required: true,
-      message: '密码不能为空',
-      trigger: 'blur'
-    }
-  ],
-  url: [
-    {
-      required: true,
-      message: '登录地址不能为空',
-      trigger: 'blur'
-    }
-  ]
-}
-
-const deptList = ref([]) // 树形结构
-let selectedDeptId = ref(null)
-// 新增时部门改变时获取设备列表
-const handleDeptChange = async (deptId) => {
-  if (deptId) {
-    selectedDeptId.value = deptId
-    getDeviceList(deptId)
-  }
-}
-// 获取设备列表
-const deviceOptions = ref([])
-const getDeviceList = async (deptId) => {
-  try {
-    const res = await IotDeviceApi.getIotDeviceSetOptions(deptId)
-    deviceOptions.value = res.map((item) => ({
-      key: item.id, // 始终使用id作为key
-      label: `${item.deviceName} (${item.deviceCode})`,
-      ...item
-    }))
-  } catch (err) {
-    console.error(err)
-  }
-}
-
-const form = reactive({
-  networkMethod: 1,
-  deviceType: 1,
-  groupName:'',
-  vertificateMethod: 3,
-  transport: 'MQTT',
-  imgUrl: '',
-  locationWay: 1,
-  isSys: 0,
-
-  // --------http协议--------
-  responseKey: '',
-  methodType: 'get',
-  url: '',
-  data: {},
-  intervalType: '',
-  interval: '',
-  contentTypeNumber: 1,
-  requestType: '0',
-  paramsData: '',
-  cronExpression: '',
-  paramsDataList: [
-    {
-      key: '',
-      value: ''
-    }
-  ],
-  contentType: 1,
-  bodyDataTable: [
-    {
-      key: '',
-      value: ''
-    }
-  ],
-  bodyDataArea: '',
-  headersList: [
-    {
-      key: 'Authorization',
-      value: 'Bearer ' + getAccessToken()
-    }
-  ],
-  // --------http协议---------
-
-  //SNMP
-  oidListStr: '',
-  ipAddress: null,
-  community: null,
-  oidList: [
-    {
-      oidName: null,
-      oid: null
-    }
-  ]
-})
-
-const tempOpen = ref(false)
-
-// 表单校验
-const rules = {
-  groupName: [{ required: true, message: '请选择部门', trigger: 'change' }],
-  productName: [
-    {
-      required: true,
-      message: t('product.product-edit473153-58'),
-      trigger: 'blur'
-    }
-  ],
-  categoryId: [
-    {
-      required: true,
-      message: t('product.product-edit473153-59'),
-      trigger: 'blur'
-    }
-  ],
-  deviceType: [
-    {
-      required: true,
-      message: t('product.product-edit473153-13'),
-      trigger: 'blur'
-    }
-  ],
-  protocolCode: [
-    {
-      required: true,
-      message: t('product.product-edit473153-60'),
-      trigger: 'blur'
-    }
-  ],
-  transport: [
-    {
-      required: true,
-      message: t('product.product-edit473153-61'),
-      trigger: 'blur'
-    }
-  ],
-  isSys: [
-    {
-      required: true,
-      message: t('product.product-edit473153-61'),
-      trigger: 'blur'
-    }
-  ]
-}
-
-// 查询参数
-const queryParams = reactive({
-  tenantName: null
-})
-
-const pointList = ref([])
-const open = ref(false)
-
-// 弹出层标题
-const title = ref('')
-
-const loading = ref(true)
-const tempList = ref([])
-
-// 总条数
-const total = ref(0)
-const tempTotal = ref(0)
-
-// 查询参数
-const pointsParams = reactive({
-  pageNum: 1,
-  pageSize: 8,
-  templateId: 0
-})
-
-const tempParams = reactive({
-  pageNum: 1,
-  pageSize: 10,
-  templateName: ''
-})
-
-const currentRow = ref({})
-const selectRowData = ref({})
-const isModbus = ref(false)
-
-// Computed properties
-const networkOptions = computed(() => {
-  return iot_network_method.value
-})
-
-// Methods
-const userClose = () => {
-  if (userParmas.isLogin) {
-    for (let key in userParmas) {
-      if (!userParmas[key]) {
-        userParmas.isLogin = false
-      }
-    }
-  }
-}
-
-const changeIsLogin = (status) => {
-  if (status) {
-    Object.assign(userParmas, {
-      isLogin: true,
-      user: '',
-      password: '',
-      url: ''
-    })
-    userEdit.value = true
-  } else {
-    Object.assign(userParmas, { isLogin: false })
-  }
-}
-
-const cancelUser = () => {
-  Object.assign(userParmas, { isLogin: false })
-  userEdit.value = false
-}
-
-const confirmUser = () => {
-  userFormRef.value.validate((valid) => {
-    if (valid) {
-      userEdit.value = false
-    }
-  })
-}
-
-const deleteOid = (item, index) => {
-  form.oidList.splice(index, 1)
-}
-
-const addOid = (index) => {
-  form.oidList.push({
-    oidName: '',
-    oid: ''
-  })
-}
-
-/** cron表达式按钮操作 */
-const handleShowCron = () => {
-  expression.value = form.cronExpression
-  openCron.value = true
-}
-
-/** 确定后回传值 */
-const crontabFill = (value) => {
-  form.cronExpression = value
-}
-
-const handleEdit = (row) => {
-  let data = {
-    key: '',
-    value: ''
-  }
-  row.push(data)
-}
-
-const handleDelete = (xh, row) => {
-  if (row.length == 1) {
-    return
-  }
-  row.forEach((element, index) => {
-    if (index == xh) {
-      row.splice(index, 1)
-    }
-  })
-}
-
-// 获取简短分类列表
-const getShortCategory = () => {
-  listCategory().then((response) => {
-    categoryShortList.value = response.list
-  })
-}
-
-/** 返回按钮 */
-const goBack = () => {
-  // 关闭当前tab页签,打开新页签
-  const { delView } = useTagsViewStore()
-  // 先删除当前页签
-  delView(unref(router.currentRoute))
-  // 跳转到列表页
-  router.push({ name: 'VideoCenterProduct' })
-  reset()
-}
-
-/** 获取产品信息 */
-const getProductInfo = () => {
-  getProduct(form.productId).then((response) => {
-    Object.assign(form, response)
-
-    if (form.transport === 'HTTP') {
-      Object.assign(userParmas, form.userParmas)
-      form.bodyDataTable = []
-      dialogVisibleInterface.value = 'HTTP'
-      form.headersList = JSON.parse(form.headers)
-      form.paramsDataList = JSON.parse(form.paramsData)
-
-      if (form.contentTypeNumber === 2 || form.contentTypeNumber === 3) {
-        let data1 = JSON.parse(form.data)
-
-        var dataJSONObj = data1
-        if (Object.prototype.toString.call(data1) !== '[object Object]') {
-          dataJSONObj = JSON.parse(data1)
-        }
-        let data = Object.keys(dataJSONObj)
-        for (let i = 0; i < data.length; i++) {
-          let obj = {
-            key: '',
-            value: ''
-          }
-          obj.key = data[i]
-          obj.value = dataJSONObj[obj.key]
-          form.bodyDataTable.push(obj)
-          form.data = null
-        }
-      } else if (form.contentTypeNumber === 4 || form.contentTypeNumber === 5) {
-        form.bodyDataArea = JSON.parse(form.data)
-        form.bodyDataTable = [
-          {
-            key: '',
-            value: ''
-          }
-        ]
-      } else {
-        form.bodyDataTable = [
-          {
-            key: '',
-            value: ''
-          }
-        ]
-      }
-    }
-    if (form.transport === 'SNMP') {
-      dialogVisibleInterface.value = 'SNMP'
-      form.oidList = JSON.parse(form.oidListStr)
-    }
-    changeProductCode(form.protocolCode)
-  })
-}
-
-// 表单重置
-const reset = () => {
-  Object.assign(form, {
-    // --------http协议--------
-    responseKey: '',
-    methodType: '',
-    url: '',
-    data: {},
-    intervalType: '',
-    interval: '',
-    contentTypeNumber: 1,
-    requestType: '0',
-    paramsData: '',
-    cronExpression: '',
-    paramsDataList: [
-      {
-        key: '',
-        value: ''
-      }
-    ],
-    contentType: 1,
-    bodyDataTable: [
-      {
-        key: '',
-        value: ''
-      }
-    ],
-    bodyDataArea: '',
-    headersList: [
-      {
-        key: 'Authorization',
-        value: 'Bearer ' + getAccessToken()
-      }
-    ],
-    // --------http协议---------
-
-    productId: 0,
-    productName: null,
-    categoryId: null,
-    categoryName: null,
-    status: 0,
-    tslJson: null,
-    isAuthorize: 0,
-    deviceType: 1,
-    networkMethod: 1,
-    vertificateMethod: 3,
-    mqttAccount: null,
-    mqttPassword: null,
-    mqttSecret: null,
-    remark: null,
-    imgUrl: '',
-    locationWay: 1,
-    isSys: 0,
-
-    //SNMP
-    ipAddress: null,
-    community: null,
-    oidList: [
-      {
-        oidName: null,
-        oid: null
-      }
-    ],
-    oidListStr: ''
-  })
-  formRef.value?.resetFields()
-}
-
-/** 提交按钮 */
-const submitForm = () => {
-  formRef.value.validate((valid) => {
-    if (valid) {
-      let data = {}
-      let bodyDataTable = form.bodyDataTable
-
-      if (bodyDataTable) {
-        for (let itemindex = 0; itemindex < bodyDataTable.length; itemindex++) {
-          if (bodyDataTable[itemindex].key) {
-            // 在 Vue 3 中可以直接赋值,响应式系统会自动检测变化
-            data[bodyDataTable[itemindex].key] = bodyDataTable[itemindex].value
-          }
-        }
-      }
-      if (form.contentTypeNumber === 2) {
-        form.contentType = 'multipart/form-data'
-      } else if (form.contentTypeNumber === 3) {
-        form.contentType = 'application/x-www-form-urlencoded;charset=utf-8'
-      } else if (form.contentTypeNumber === 4) {
-        form.contentType = 'application/json;charset=utf-8'
-        data = form.bodyDataArea
-      } else if (form.contentTypeNumber === 5) {
-        form.contentType = 'text/xml'
-        data = form.bodyDataArea
-      } else {
-        form.contentType = 'application/json;charset=utf-8'
-      }
-
-      form.bodyDataTable = bodyDataTable
-      form.data = JSON.stringify(data)
-
-      if (form.transport === 'SNMP') {
-        form.oidListStr = JSON.stringify(form.oidList)
-      } else if (form.transport === 'HTTP') {
-        form.userParmas = userParmas
-      }
-      if (form.productId != null && form.productId != 0) {
-        form.headers = JSON.stringify(form.headersList)
-
-        updateProduct(form).then((response) => {
-          changeProductCode(form.protocolCode)
-          ElMessage.success(t('product.product-edit473153-62'))
-        })
-      } else {
-        if (tempOpen.value && !form.templateId) {
-          ElMessage('请选择采集点模板')
-          return
-        }
-
-        form.headers = JSON.stringify(form.headersList)
-
-        // console.log(form, 'this.form');
-        addProduct(form).then((response) => {
-          if (!form.isModbus) {
-            ElMessage.success(t('product.product-edit473153-64'))
-          } else {
-            ElMessage.success('物模型已经从采集点模板同步至产品')
-          }
-          Object.assign(form, response.data)
-          changeProductCode(form.protocolCode)
-        })
-      }
-    }
-  })
-}
-
-/**同步获取产品下的设备数量**/
-const getDeviceCountByProductId = (productId) => {
-  return new Promise((resolve, reject) => {
-    deviceCount(productId)
-      .then((res) => {
-        resolve(res)
-      })
-      .catch((error) => {
-        reject(error)
-      })
-  })
-}
-
-/** 更新产品状态 */
-const changeProductStatusAsync = async (status) => {
-  let message = t('product.product-edit473153-66')
-  if (status == 2) {
-    message = t('product.product-edit473153-67')
-  } else if (status == 1) {
-    let result = await getDeviceCountByProductId(form.productId)
-    if (result.data > 0) {
-      message = t('product.product-edit473153-68', [result.data])
-    }
-  }
-
-  ElMessageBox.confirm(message, t('product.product-edit473153-69'), {
-    confirmButtonText: t('product.product-edit473153-70'),
-    cancelButtonText: t('product.product-edit473153-71'),
-    type: 'warning'
-  })
-    .then(() => {
-      let data = {
-        productId: form.productId,
-        status: status,
-        deviceType: form.deviceType
-      }
-
-      changeProductStatus(data)
-        .then((response) => {
-          if (status == 2) {
-            ElMessage.success('发布成功')
-          }
-          activeName.value = 'basic'
-          getProductInfo()
-        })
-        .catch(() => {
-          if (status == 2) {
-            activeName.value = 'basic'
-          } else {
-            goBack()
-          }
-        })
-    })
-    .catch(() => {
-      activeName.value = 'basic'
-    })
-}
-
-/** 选择分类 */
-const selectCategory = (val) => {
-  for (let i = 0; i < categoryShortList.value.length; i++) {
-    if (categoryShortList.value[i].categoryId == val) {
-      form.categoryName = categoryShortList.value[i].categoryName
-      return
-    }
-  }
-}
-
-/**获取上传图片的路径 */
-const getImagePath = (data) => {
-  form.imgUrl = data
-}
-
-/**改变输入框类型**/
-const changeInputType = (name) => {
-  if (name == 'key') {
-    keyInputType.value = keyInputType.value == 'password' ? 'text' : 'password'
-  } else if (name == 'account') {
-    accountInputType.value = accountInputType.value == 'password' ? 'text' : 'password'
-  } else if (name == 'password') {
-    passwordInputType.value = passwordInputType.value == 'password' ? 'text' : 'password'
-  }
-}
-
-const isInitialized = ref(false)
-// 授权码状态修改
-const changeIsAuthorize = () => {
-  if (!isInitialized.value) return
-  let text =
-    form.isAuthorize == '1'
-      ? t('product.product-edit473153-72')
-      : t('product.product-edit473153-74')
-
-  ElMessageBox.confirm(t('product.product-edit473153-75', [text]), '提示', {
-    confirmButtonText: t('product.product-edit473153-70'),
-    cancelButtonText: t('product.product-edit473153-71'),
-    type: 'warning'
-  })
-    .then(() => {
-      if (form.productId != null && form.productId != 0) {
-        updateProduct(form).then((response) => {
-          ElMessage.success(t('product.product-edit473153-77') + text)
-        })
-      }
-    })
-    .catch(() => {
-      form.isAuthorize = 0
-    })
-}
-
-//获取设备协议
-const getProtocol = () => {
-  const data = {
-    protocolStatus: 1,
-    pageSize: 99
-  }
-  listProtocol(data).then((res) => {
-    protocolList.value = res.list
-  })
-}
-
-/*选择模板*/
-const selectTemplate = () => {
-  // reset();
-  open.value = true
-  title.value = '选择模板'
-  getTempList()
-  // getList()
-}
-
-const getTempDetail = () => {
-  const params = {
-    productId: form.productId
-  }
-  getTempByPId(params).then((response) => {
-    selectRowData.value = response.data
-  })
-}
-
-// 取消按钮
-const cancel = () => {
-  open.value = false
-  // reset();
-}
-
-/** 查询设备采集变量模板列表 */
-const getTempList = () => {
-  loading.value = true
-  listTemp(tempParams).then((response) => {
-    tempList.value = response.list
-    tempTotal.value = response.total
-    currentRow.value = tempList.value[0]
-    // pointsParams.templateId = currentRow.value.templateId;
-    getCurrentRow(tempList.value[0])
-    loading.value = false
-    getList()
-  })
-}
-
-const getList = () => {
-  getAllPoints(pointsParams).then((response) => {
-    pointList.value = response
-    total.value = response.length || 0
-  })
-}
-
-/*确认选择*/
-const submitSelect = () => {
-  open.value = false
-  form.templateId = selectRowData.value.templateId
-}
-
-const getCurrentRow = (val) => {
-  if (val != null) {
-    selectRowData.value = val
-  }
-  pointsParams.templateId = val.templateId
-  getList()
-}
-
-const deleteData = () => {
-  selectRowData.value = {}
-  form.templateId = null
-}
-
-const transportChange = (val) => {
-  if (val === 'HTTP') {
-    dialogVisibleInterface.value = 'HTTP'
-  } else if (val === 'SNMP') {
-    dialogVisibleInterface.value = 'SNMP'
-  } else {
-    dialogVisibleInterface.value = 'MTG'
-  }
-}
-
-const changeProductCode = (val) => {
-  if (val && val.startsWith('MODBUS')) {
-    tempOpen.value = true
-    form.deviceType = 2
-    form.isModbus = true
-    if (form.productId != 0 && form.productId != null) {
-      getTempDetail()
-    }
-  } else {
-    form.isModbus = false
-    tempOpen.value = false
-  }
-}
-
-/**选项卡切换事件**/
-const tabChange = (tabItem) => {
-  // 切换到告警配置,获取物模型
-  if (tabItem === 'alert') {
-    productThingsModelRef.value.getCacheThingsModel(form.productId)
-  } else if (tabItem === 'productFirmware') {
-    productFirmwareRef.value.getList()
-  } else if (tabItem === 'productAuthorize') {
-    productAuthorizeRef.value.queryParams.productId = form.productId
-    productAuthorizeRef.value.getList()
-  }
-}
-
-/*按照模板名查询*/
-const queryTemp = () => {
-  getTempList()
-}
-
-/** 搜索按钮操作 */
-const handleQuery = () => {
-  tempParams.pageNum = 1
-  getTempList()
-}
-
-/** 重置按钮操作 */
-const resetQuery = () => {
-  tempParamsRef.value?.resetFields()
-  handleQuery()
-}
-
-/**刷新产品模型 */
-const updateModel = () => {
-  productModbusRef.value.getThingsModelList()
-}
-
-// Lifecycle hooks
-onMounted(async() => {
-  // 获取产品信息
-  const productId = route.query && route.query.productId
-  form.productId = productId
-  if (form.productId != 0 && form.productId != null) {
-    getProductInfo()
-  }
-  // 切换选项卡
-  const tabPanelName = route.query && route.query.tabPanelName
-  if (tabPanelName != null && tabPanelName != '') {
-    activeName.value = tabPanelName
-  }
-  // 获取分类信息
-  getShortCategory()
-  // 设置账号密码输入框类型,新增时为text,查看时为password
-  if (!form.productId || form.productId == 0) {
-    accountInputType.value = 'text'
-    passwordInputType.value = 'text'
-  }
-  getProtocol()
-
-  getDicts('iot_device_type').then((response) => {
-    iot_device_type.value = response
-  })
-
-  getDicts('iot_transport_type').then((response) => {
-    iot_transport_type.value = response
-  })
-
-  // iot_network_method
-  getDicts('iot_network_method').then((response) => {
-    iot_network_method.value = response
-  })
-
-  getDicts('iot_vertificate_method').then((response) => {
-    iot_vertificate_method.value = response
-  })
-  getDicts('data_collect_type').then((response) => {
-    data_collect_type.value = response
-  })
-  getDicts('iot_location_way').then((response) => {
-    iot_location_way.value = response
-  })
-  getDicts('sub_gateway_type').then((response) => {
-    sub_gateway_type.value = response
-  })
-  deptList.value = handleTree(await DeptApi.getSimpleDeptList())
-
-  setTimeout(() => {
-    isInitialized.value = true
-  }, 0)
-})
-</script>
-
-<style lang="scss" scoped>
-.el-aside {
-  margin: 0;
-  padding: 0;
-  background-color: #fff;
-  color: #333;
-}
-
-.el-main {
-  margin: 0;
-  padding: 0 10px;
-  background-color: #fff;
-  color: #333;
-}
-
-.base-table.table-btn {
-  position: absolute;
-  right: -40px;
-  top: 33%;
-  transform: translate(0, -50%);
-}
-::v-deep .el-alert__description {
-  font-size: 12px;
-}
-</style>

+ 3 - 2
src/views/pms/video_center/sip/components/player/deviceLiveStream.vue

@@ -88,6 +88,7 @@ const playinfo = reactive({
 
 // Watch device prop变化
 watch(() => props.device, (newVal, oldVal) => {
+  console.log('device 发生变化>>>>>>>>>>>>>>>', newVal?.channelId)
   deviceInfo.value = newVal
   if (newVal?.channelId) {
     channelId.value = newVal.channelId
@@ -97,10 +98,11 @@ watch(() => props.device, (newVal, oldVal) => {
     queryParams.deviceSipId = newVal.serialNumber
     deviceId.value = newVal.serialNumber
   }
-})
+}, { immediate: true })
 
 // 组件挂载时执行
 onMounted(() => {
+
   if (props.device) {
     queryParams.deviceSipId = props.device.serialNumber
     deviceId.value = props.device.serialNumber
@@ -127,7 +129,6 @@ const getList = () => {
 
 // 通道切换
 const changeChannel = () => {
-  console.log('playinfo>>>>>>>>>>>>>>>>', playinfo.value)
   console.log('channelId>>>>>>>>>>>>>>>', channelId.value)
   playinfo.channelId = channelId.value
   startPlayer()

+ 1 - 1
src/views/pms/video_center/sip/index.vue

@@ -472,7 +472,7 @@ watch(
 // 查看设备操作
 const handleViewDevice = (serialNumber) => {
   router.push({
-    path: '/videocenter/device',
+    path: '/iotvideopms/videodevice',
     query: {
       t: Date.now(),
       sn: serialNumber