src/api/pms/device/index.ts

@@ -46,8 +46,8 @@ export interface IotDeviceVO {
 
 // 设备台账 API
 export const IotDeviceApi = {
-  getMapDevice: async () => {
-    return await request.get({ url: `/rq/iot-device/map`})
+  getMapDevice: async (params:any) => {
+    return await request.get({ url: `/rq/iot-device/map`, params})
   },
   // 查询设备台账分页
   getIotDevicePage: async (params: any) => {

src/locales/en.ts

@@ -640,7 +640,8 @@ export default {
     save:'Save',
     return:'Return',
     useProject:'useProject',
-    assetOwner:'assetOwnership'
+    assetOwner:'assetOwnership',
+    deptHolder:'please select depart'
   },
   file:{
     name:'FileName',

src/locales/zh-CN.ts

@@ -637,7 +637,8 @@ export default {
     save:'保存',
     return:'返回',
     useProject:'使用项目',
-    assetOwner:'资产归属'
+    assetOwner:'资产归属',
+    deptHolder:'请选择部门机构'
   },
   file:{
     name:'文件名称',

src/views/pms/map/Map.vue

@@ -16,6 +16,17 @@
       <button @click="zoomOut">{{t('map.reduce')}}</button>
       <button @click="toggleMapType"
       >{{t('map.SwitchMapType')}}({{ mapType === 'BMAP_NORMAL_MAP' ? '地图' : '卫星' }})</button>
+        <el-tree-select
+          class="my-el-select"
+          v-model="queryParams.deptId"
+          :data="treeList"
+          :props="defaultProps"
+          check-strictly
+          node-key="id"
+          :placeholder="t('deviceForm.deptHolder')"
+          filterable
+          @change="getData"
+        />
     </div>
   </div>
   <DeviceMonitorDrawer :model-value="drawerVisible" @update:model-value="(val) => (drawerVisible = val)" :id="deviceId" :deviceName="deviceName" :lastLineTime="lastLineTime"
@@ -29,6 +40,7 @@ import { DICT_TYPE, getDictLabel } from '@/utils/dict'
 import { IotDeviceApi, IotDeviceVO } from '@/api/pms/device'
 import DeviceMonitorDrawer from '@/views/pms/map/DeviceMonitorDrawer.vue'
 import * as DeptApi from '@/api/system/dept'
+import {defaultProps, handleTree} from "@/utils/tree";
 
 interface Cluster {
   lng: number
@@ -54,7 +66,7 @@ const inlineCount = ref(0)
 const outlineCount = ref(0)
 // 设备数据示例
 const devices = ref<IotDeviceVO[]>()
-
+const treeList = ref<Tree[]>([]) // 树形结构
 // 初始化地图
 const initMap = () => {
   if (!mapContainer.value) return
@@ -322,9 +334,12 @@ const toggleMapType = () => {
   mapType.value = mapType.value === 'BMAP_NORMAL_MAP' ? 'BMAP_SATELLITE_MAP' : 'BMAP_NORMAL_MAP'
   map.value.setMapType((window as any)[mapType.value])
 }
-
+const queryParams = reactive({
+  deptId: undefined
+})
 const getData = async () => {
-  await IotDeviceApi.getMapDevice().then((res) => {
+  debugger
+  await IotDeviceApi.getMapDevice(queryParams).then((res) => {
     devices.value = res.filter((item)=> item.lat!=0&&item.lng!=0)
     outlineCount.value = devices.value.filter((item)=> item.ifInline===4).length
     inlineCount.value = devices.value.filter((item)=> item.ifInline===3).length
@@ -333,6 +348,10 @@ const getData = async () => {
 }
 onMounted(async () => {
   await getData()
+  const res = await DeptApi.getSimpleDeptList()
+  treeList.value = []
+  treeList.value.push(...handleTree(res))
+  debugger
 })
 
 onBeforeUnmount(() => {
@@ -429,4 +448,12 @@ onBeforeUnmount(() => {
   background-repeat: no-repeat;
   background-position: center;
 }
+
+
+:deep(.el-select__selection) {
+  height: 35px; /* 自定义高度 */
+}
+:deep(.el-select__placeholder.is-transparent){
+  color: orangered;
+}
 </style>