fix:视频优化2

.env.local

@@ -4,7 +4,7 @@ NODE_ENV=development
 VITE_DEV=true
 
 # 请求路径
-VITE_BASE_URL='http://192.168.188.150: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'

src/api/pms/device/index.ts

@@ -148,4 +148,9 @@ export const IotDeviceApi = {
   getIotDeviceTdPage: async (params: any) => {
     return await request.get({ url: `/rq/iot-device/td/page`, params })
   },
+
+  // 新增时根据部门id获取设备列表
+  getIotDeviceSetOptions: async (id: any) => {
+    return await request.get({ url: `/rq/iot-device/dept/${id}` })
+  },
 }

src/api/pms/video/sipdevice.ts

@@ -51,7 +51,7 @@ export function delSipDevice(deviceId) {
 
 export function delSipDeviceBySipId(sipId) {
   return request.delete({
-    url: '/sip/device/sipid/' + sipId,
+    url: '/rq/yf-sip-device/sipid/' + sipId,
     
   })
 }

src/views/pms/video_center/device/device-edit.vue

@@ -14,6 +14,20 @@
           <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-tree-select
+                    v-model="form.deptId"
+                    :data="deptList"
+                    :props="defaultProps"
+                    check-strictly
+                    node-key="id"
+                    filterable
+                    placeholder="请选择所在部门"
+                    @change="handleDeptChange"
+                    
+                   
+                  />
+                </el-form-item>
                 <el-form-item :label="t('device.device-edit148398-1')" prop="deviceName">
                   <el-input
                     v-model="form.deviceName"
@@ -26,6 +40,19 @@
                     </template>
                   </el-input>
                 </el-form-item>
+
+                <el-form-item label="关联设备" prop="pms_device">
+                   <el-select v-model="form.pms_device" 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>
@@ -627,6 +654,11 @@ import {
 import { useTagsViewStore } from '@/store/modules/tagsView'
 import { getDicts } from '@/api/pms/video/dicts'
 
+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'
+
 
 // i18n
 const { t } = useI18n()
@@ -674,6 +706,8 @@ const channelId = ref('')
 const form = reactive({
   productId: 0,
   status: 1,
+  deptId: '',
+  pms_device:'',
   locationWay: 1,
   firmwareVersion: 1.0,
   serialNumber: '',
@@ -724,6 +758,7 @@ const deviceStatus = computed({
 
 // Rules
 const rules = {
+  deptId: [{ required: true, message: '请选择部门', trigger: 'change' }],
   deviceName: [
     {
       required: true,
@@ -746,6 +781,30 @@ const rules = {
   ]
 }
 
+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)
+  }
+}
+
 // Methods
 const updateMqttgroup = (stater) => {
   if (stater === 1) {
@@ -1203,7 +1262,7 @@ const handleViewMqtt = () => {
   })
 }
 
-onMounted(() => {
+onMounted(async() => {
   let activeNameParam = route.query.activeName
   if (activeNameParam !== null && activeNameParam !== '') {
     activeName.value = activeNameParam
@@ -1224,6 +1283,7 @@ onMounted(() => {
   getDicts('iot_location_way').then((response) => {
     iot_location_way.value = response
   })
+  deptList.value = handleTree(await DeptApi.getSimpleDeptList())
 })
 
 onActivated(() => {

src/views/pms/video_center/device/index.vue

@@ -15,9 +15,23 @@
             clearable
             size="default"
             @keyup.enter="handleQuery"
-            style="width: 150px"
+            style="width: 130px"
           />
         </el-form-item>
+         <el-form-item label="所在部门" prop="deptId">
+                  <el-tree-select
+                    v-model="queryParams.deptId"
+                    :data="deptList"
+                    :props="defaultProps"
+                    check-strictly
+                    node-key="id"
+                    filterable
+                    placeholder="请选择所在部门"
+                     @keyup.enter="handleQuery"
+                    style="width: 200px;"
+                   size="default"
+                  />
+                </el-form-item>
         <el-form-item label="设备编号" prop="serialNumber">
           <el-input
             v-model="queryParams.serialNumber"
@@ -25,7 +39,7 @@
             clearable
             size="default"
             @keyup.enter="handleQuery"
-            style="width: 150px"
+            style="width: 130px"
           />
         </el-form-item>
         <el-form-item label="设备状态" prop="status">
@@ -34,7 +48,7 @@
             placeholder="请选择设备状态"
             clearable
             size="default"
-            style="width: 150px"
+            style="width: 130px"
           >
             <el-option
               v-for="dict in getStrDictOptions(DICT_TYPE.VIDEO_DEVICE_STATUS)"
@@ -552,6 +566,10 @@ import SvgIcon from '@/components/SvgIcon/index.vue'
 
 import { DICT_TYPE, getDictLabel, getStrDictOptions } from '@/utils/dict'
 
+import DeptTree from '@/views/system/user/DeptTree.vue'
+import { defaultProps, handleTree } from '@/utils/tree'
+import * as DeptApi from '@/api/system/dept'
+
 const { proxy } = getCurrentInstance()
 // Vue Router 和 Store
 const router = useRouter()
@@ -596,7 +614,8 @@ const queryParams = reactive({
   serialNumber: null,
   status: null,
   networkAddress: null,
-  activeTime: null
+  activeTime: null,
+  deptId:null
 })
 
 // 表单参数
@@ -613,9 +632,9 @@ const form = reactive({
 
 // 批量导入参数
 const isSubDev = ref(false)
-
+const  deptList = ref([])
 // 生命周期钩子
-onMounted(() => {
+onMounted(async() => {
   const time = route.query.t
   if (time != null && time != uniqueId.value) {
     uniqueId.value = time
@@ -648,6 +667,7 @@ onMounted(() => {
   }
 
   getList()
+   deptList.value = handleTree(await DeptApi.getSimpleDeptList())
 
   // 以后会用，暂时注释掉
   // connectMqtt()
@@ -961,7 +981,7 @@ function handleDelete(row) {
   })
     .then(() => {
       if (row.deviceType === 3) {
-        return delSipDeviceBySipId(row.serialNumber)
+         delSipDeviceBySipId(row.serialNumber)
       }
       return delDevice(deviceIds)
     })

src/views/pms/video_center/product/index.vue

@@ -2,6 +2,7 @@
   <div class="product normal-form" style="padding: 6px">
     <el-card style="margin: 20px;border:0; margin-top: 10px;" shadow="never">
       <el-form
+      class="search-form"
         ref="queryFormRef"
         :inline="true"
         :model="queryParams"
@@ -13,7 +14,7 @@
             v-model="queryParams.productName"
             :placeholder="t('product.index091251-1')"
             clearable
-            size="small"
+            size="default"
             @keyup.enter="handleQuery"
           />
         </el-form-item>
@@ -22,7 +23,7 @@
             v-model="queryParams.categoryName"
             :placeholder="t('product.index091251-3')"
             clearable
-            size="small"
+            size="default"
             @keyup.enter="handleQuery"
           />
         </el-form-item>
@@ -31,7 +32,7 @@
             v-model="queryParams.status"
             :placeholder="t('product.index091251-5')"
             clearable
-            size="small"
+            size="default"
             style="width: 150px;"
           >
             <el-option
@@ -43,10 +44,10 @@
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button :icon="Search" size="small" type="primary" @click="handleQuery">{{
+          <el-button :icon="Search" size="default" type="primary" @click="handleQuery">{{
             t('product.index091251-6')
           }}</el-button>
-          <el-button :icon="Refresh" size="small" @click="resetQuery">{{
+          <el-button :icon="Refresh" size="default" @click="resetQuery">{{
             t('product.index091251-7')
           }}</el-button>
           <el-checkbox

src/views/pms/video_center/product/product-edit.vue

@@ -15,6 +15,20 @@
           <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"
@@ -65,13 +79,10 @@
                   </el-select>
                 </el-form-item>
                 <el-form-item v-if="form.deviceType !== 3 && tempOpen">
-                 
-                    <el-alert
-                      description="当前通讯协议为modbus协议,请选择采集点模板,默认添加设备为网关设备"
-                      type="success"
-                      
-                    />
-                
+                  <el-alert
+                    description="当前通讯协议为modbus协议,请选择采集点模板,默认添加设备为网关设备"
+                    type="success"
+                  />
                 </el-form-item>
                 <el-form-item v-if="tempOpen && selectRowData" prop="templateId">
                   <template #label>
@@ -905,7 +916,7 @@ 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 { listShortCategory, listCategory } from '@/api/pms/video/category'
 import { getDicts } from '@/api/pms/video/dicts'
 import {
   addProduct,
@@ -921,6 +932,10 @@ 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({
@@ -1007,9 +1022,34 @@ const userRule = {
   ]
 }
 
+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: '',
@@ -1065,6 +1105,7 @@ const tempOpen = ref(false)
 
 // 表单校验
 const rules = {
+  groupName: [{ required: true, message: '请选择部门', trigger: 'change' }],
   productName: [
     {
       required: true,
@@ -1228,8 +1269,6 @@ const handleDelete = (xh, row) => {
   })
 }
 
-
-
 // 获取简短分类列表
 const getShortCategory = () => {
   listCategory().then((response) => {
@@ -1252,7 +1291,7 @@ const goBack = () => {
 const getProductInfo = () => {
   getProduct(form.productId).then((response) => {
     Object.assign(form, response)
-   
+
     if (form.transport === 'HTTP') {
       Object.assign(userParmas, form.userParmas)
       form.bodyDataTable = []
@@ -1262,7 +1301,7 @@ const getProductInfo = () => {
 
       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)
@@ -1499,9 +1538,7 @@ const changeProductStatusAsync = async (status) => {
 /** 选择分类 */
 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
     }
@@ -1524,8 +1561,10 @@ const changeInputType = (name) => {
   }
 }
 
+const isInitialized = ref(false)
 // 授权码状态修改
 const changeIsAuthorize = () => {
+  if (!isInitialized.value) return
   let text =
     form.isAuthorize == '1'
       ? t('product.product-edit473153-72')
@@ -1599,7 +1638,6 @@ const getTempList = () => {
 
 const getList = () => {
   getAllPoints(pointsParams).then((response) => {
-    
     pointList.value = response
     total.value = response.length || 0
   })
@@ -1612,7 +1650,6 @@ const submitSelect = () => {
 }
 
 const getCurrentRow = (val) => {
-  
   if (val != null) {
     selectRowData.value = val
   }
@@ -1685,7 +1722,7 @@ const updateModel = () => {
 }
 
 // Lifecycle hooks
-onMounted(() => {
+onMounted(async() => {
   // 获取产品信息
   const productId = route.query && route.query.productId
   form.productId = productId
@@ -1716,7 +1753,6 @@ onMounted(() => {
 
   // iot_network_method
   getDicts('iot_network_method').then((response) => {
-   
     iot_network_method.value = response
   })
 
@@ -1732,6 +1768,11 @@ onMounted(() => {
   getDicts('sub_gateway_type').then((response) => {
     sub_gateway_type.value = response
   })
+  deptList.value = handleTree(await DeptApi.getSimpleDeptList())
+
+  setTimeout(() => {
+    isInitialized.value = true
+  }, 0)
 })
 </script>
 
@@ -1757,6 +1798,6 @@ onMounted(() => {
   transform: translate(0, -50%);
 }
 ::v-deep .el-alert__description {
- font-size: 12px;
+  font-size: 12px;
 }
 </style>

src/views/pms/video_center/protocol/index.vue

@@ -13,7 +13,7 @@
             v-model="queryParams.protocolName" 
             placeholder="协议名称" 
             clearable 
-            size="small" 
+            size="default" 
             @keyup.enter="handleQuery" 
           />
         </el-form-item>
@@ -22,13 +22,13 @@
             v-model="queryParams.protocolCode" 
             placeholder="请输入协议编码" 
             clearable 
-            size="small" 
+            size="default" 
             @keyup.enter="handleQuery" 
           />
         </el-form-item>
         <el-form-item>
-          <el-button :icon="Search" size="small" type="primary" @click="handleQuery">搜索</el-button>
-          <el-button :icon="Refresh" size="small" @click="resetQuery">重置</el-button>
+          <el-button :icon="Search" size="default" type="primary" @click="handleQuery">搜索</el-button>
+          <el-button :icon="Refresh" size="default" @click="resetQuery">重置</el-button>
         </el-form-item>
       </el-form>
     </el-card>

src/views/pms/video_center/sip/index.vue

@@ -7,7 +7,7 @@
             v-model="queryParams.deviceSipId"
             :placeholder="t('sip.index998533-1')"
             clearable
-            size="small"
+            size="default"
             @keyup.enter="handleQuery"
           />
         </el-form-item>
@@ -16,7 +16,7 @@
             v-model="queryParams.channelSipId"
             :placeholder="t('sip.index998533-3')"
             clearable
-            size="small"
+            size="default"
             @keyup.enter="handleQuery"
           />
         </el-form-item>
@@ -25,7 +25,7 @@
             v-model="queryParams.status"
             :placeholder="t('sip.index998533-5')"
             clearable
-            size="small"
+            size="default"
             style="width: 150px"
           >
            <el-option
@@ -39,8 +39,8 @@
           </el-select>
         </el-form-item>
         <el-form-item>
-          <el-button type="primary" :icon="Search" size="small" @click="handleQuery">搜素</el-button>
-          <el-button :icon="Refresh" size="small" @click="resetQuery">重置</el-button>
+          <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>