18610965287
/
hand_device
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

map

master
xh 16 hours ago
parent
b5dea4be76
commit
c0dbf9efcb
7 changed files with 76 additions and 29 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 4
      web/README.md
  2. 2
      web/index.html
  3. 7
      web/src/views/HandDevice/Home/components/constants/map.constants.ts
  4. 13
      web/src/views/HandDevice/Home/components/services/map.service.ts
  5. 12
      web/src/views/HandDevice/Home/components/utils/map.utils.ts
  6. 58
      web/src/views/gas/handdetector/index.vue
  7. 9
      web/src/views/gas/personnel/index.vue

4
web/README.md
View File

@ -1 +1,3 @@
sudo unzip -o /home/zdhlroot/roadmap.zip -d /opt/website/mobile.zdhlcn.com/roadmap/
sudo unzip -o /home/zdhlroot/roadmap.zip -d /opt/website/mobile.zdhlcn.com/roadmap/
sudo cp /tmp/xiangheng/* /opt/website/mobile.zdhlcn.com/ -r

2
web/index.html
View File

@ -1,5 +1,5 @@
<!doctype html> <!doctype html>
<html lang="en">
<html lang="zh">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" /> <link rel="icon" href="/favicon.ico" />

7
web/src/views/HandDevice/Home/components/constants/map.constants.ts
View File

@ -1,6 +1,7 @@
/** /**
* 地图组件常量配置 * 地图组件常量配置
*/ */
import type { StatusDictItem, FenceData } from '../types/map.types' import type { StatusDictItem, FenceData } from '../types/map.types'
// 状态字典配置 // 状态字典配置
@ -28,11 +29,13 @@ export const STATUS_DICT = {
// 状态优先级定义 (数字越小优先级越高) // 状态优先级定义 (数字越小优先级越高)
export const STATUS_PRIORITY = { export const STATUS_PRIORITY = {
gasStatus_2: 1, gasStatus_2: 1,
gasStatus_1: 2, gasStatus_1: 2,
// battery_2: 3, // battery_2: 3,
batteryStatus_1: 4, batteryStatus_1: 4,
// fence_2: 5, // fence_2: 5,
fenceStatus_1: 6, fenceStatus_1: 6,
offline: 7, offline: 7,
normal: 8 normal: 8
@ -46,9 +49,9 @@ export const DEFAULT_MARKERS = []
// 地图默认配置 // 地图默认配置
export const MAP_DEFAULTS = { export const MAP_DEFAULTS = {
tileUrl:'https://webrd04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}',
tileUrl: 'https://webrd04.is.autonavi.com/appmaptile?lang=zh_cn&size=1&scale=1&style=7&x={x}&y={y}&z={z}',
// tileUrl: 'http://qtbj.icpcdev.site/roadmap/{z}/{x}/{y}.png', // tileUrl: 'http://qtbj.icpcdev.site/roadmap/{z}/{x}/{y}.png',
// tileUrl: 'http://192.168.43.94:8080/{z}/{x}/{y}.png',
center: [116.3912757, 39.906217] as [number, number], center: [116.3912757, 39.906217] as [number, number],
zoom: 10, zoom: 10,
maxZoom: 18, maxZoom: 18,

13
web/src/views/HandDevice/Home/components/services/map.service.ts
View File

@ -5,8 +5,10 @@ import { Map, View } from 'ol'
import { Tile as TileLayer } from 'ol/layer' import { Tile as TileLayer } from 'ol/layer'
import { OSM, XYZ } from 'ol/source' import { OSM, XYZ } from 'ol/source'
import { fromLonLat,transformExtent } from 'ol/proj'
import { boundingExtent } from 'ol/extent'
import { fromLonLat, transformExtent } from 'ol/proj'
import { boundingExtent } from 'ol/extent'
import Overlay from 'ol/Overlay' import Overlay from 'ol/Overlay'
import type { MapProps } from '../types/map.types' import type { MapProps } from '../types/map.types'
@ -36,7 +38,8 @@ export class MapService {
zoom: props.zoom, zoom: props.zoom,
maxZoom: props.maxZoom, maxZoom: props.maxZoom,
minZoom: props.minZoom minZoom: props.minZoom
})
}),
}) })
} }
@ -88,13 +91,13 @@ export class MapService {
*/ */
fitToMarkers(lonLats: number[][]): void { fitToMarkers(lonLats: number[][]): void {
if (!this.map || lonLats.length === 0) return if (!this.map || lonLats.length === 0) return
const extent = boundingExtent(lonLats) const extent = boundingExtent(lonLats)
const webMercatorExtent = transformExtent(extent, 'EPSG:4326', 'EPSG:3857') const webMercatorExtent = transformExtent(extent, 'EPSG:4326', 'EPSG:3857')
this.map.getView().fit(webMercatorExtent, { this.map.getView().fit(webMercatorExtent, {
padding: [80, 50, 100, 50], padding: [80, 50, 100, 50],
maxZoom: this.map.getView().getMaxZoom()
maxZoom: this.map.getView().getMaxZoom()
}) })
} }
/** /**

12
web/src/views/HandDevice/Home/components/utils/map.utils.ts
View File

@ -36,6 +36,11 @@ export const getHighestPriorityStatus = (markerData: {
fenceStatus?: number fenceStatus?: number
onlineStatus?: number onlineStatus?: number
}): keyof typeof STATUS_PRIORITY => { }): keyof typeof STATUS_PRIORITY => {
const onlineStatus = String(markerData.onlineStatus) !== '1' ? 'offline' : null
if (onlineStatus === 'offline') {
return 'offline'
}
const statuses: string[] = [] const statuses: string[] = []
// 收集非正常状态 // 收集非正常状态
@ -53,11 +58,8 @@ export const getHighestPriorityStatus = (markerData: {
const fenceStatusStr = getStatusMapping('fenceStatus', String(markerData.fenceStatus)) const fenceStatusStr = getStatusMapping('fenceStatus', String(markerData.fenceStatus))
fenceStatusStr && statuses.push(fenceStatusStr) fenceStatusStr && statuses.push(fenceStatusStr)
} }
// 检查各种状态
const onlineStatus = String(markerData.onlineStatus) !== '1' ? 'offline' : null
if (onlineStatus) {
statuses.push(onlineStatus)
}
// console.log('statuses', statuses) // console.log('statuses', statuses)
// 如果没有报警状态，则为正常 // 如果没有报警状态，则为正常

58
web/src/views/gas/handdetector/index.vue
View File

@ -27,6 +27,22 @@
class="!w-240px" class="!w-240px"
/> />
</el-form-item> </el-form-item>
<el-form-item label="部门" prop="deptId">
<el-cascader
class="!w-240px"
v-model="queryParams.deptId"
:options="deptList"
:props="{
checkStrictly: true,
label: 'name',
value: 'id',
children: 'children',
emitPath: false
}"
clearable
/>
</el-form-item>
<el-form-item> <el-form-item>
<el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button> <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
<el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button> <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
@ -74,7 +90,7 @@
<el-table-column label="SN" align="center" prop="sn" min-width="150px" /> <el-table-column label="SN" align="center" prop="sn" min-width="150px" />
<el-table-column label="持有人" align="center" prop="name" /> <el-table-column label="持有人" align="center" prop="name" />
<el-table-column label="应用围栏" align="center" prop="fenceIds"> <el-table-column label="应用围栏" align="center" prop="fenceIds">
<template #default="scope">
<template #default="scope">
{{ {{
scope.row.fenceIdsArray && scope.row.fenceIdsArray &&
scope.row.fenceIdsArray.length > 0 && scope.row.fenceIdsArray.length > 0 &&
@ -87,7 +103,11 @@
<!-- 围栏类型 --> <!-- 围栏类型 -->
<el-table-column label="围栏类型" align="center" prop="fenceType"> <el-table-column label="围栏类型" align="center" prop="fenceType">
<template #default="scope"> <template #default="scope">
<DictTag :type="DICT_TYPE.HAND_DETECTOR_FENCE_TYPE" :value="scope.row.fenceType" v-if="scope.row.fenceType" />
<DictTag
:type="DICT_TYPE.HAND_DETECTOR_FENCE_TYPE"
:value="scope.row.fenceType"
v-if="scope.row.fenceType"
/>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="气体类型" align="center" prop="gasTypeId"> <el-table-column label="气体类型" align="center" prop="gasTypeId">
@ -95,13 +115,28 @@
{{ handDetectorStore.getGasTypes.find((item) => item.id === scope.row.gasTypeId)?.name }} {{ handDetectorStore.getGasTypes.find((item) => item.id === scope.row.gasTypeId)?.name }}
</template> </template>
</el-table-column> </el-table-column>
<!-- 部门 -->
<el-table-column label="部门" align="center" prop="deptId">
<template #default="scope">
<span v-if="scope.row.deptId">
{{ deptList.find((dept) => dept.id === scope.row.deptId)?.name || '-' }}
</span>
<span v-else>-</span>
</template>
</el-table-column>
<el-table-column label="启用状态" align="center" prop="enableStatus"> <el-table-column label="启用状态" align="center" prop="enableStatus">
<template #default="scope"> <template #default="scope">
<DictTag :type="DICT_TYPE.HAND_DETECTOR_ENABLE_STATUS" :value="scope.row.enableStatus" /> <DictTag :type="DICT_TYPE.HAND_DETECTOR_ENABLE_STATUS" :value="scope.row.enableStatus" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="备注" align="center" prop="remark" /> <el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="创建时间" align="center" prop="createTime" :formatter="dateFormatter" width="160px" />
<el-table-column
label="创建时间"
align="center"
prop="createTime"
:formatter="dateFormatter"
width="160px"
/>
<el-table-column label="操作" align="center" min-width="120px"> <el-table-column label="操作" align="center" min-width="120px">
<template #default="scope"> <template #default="scope">
<el-button <el-button
@ -140,13 +175,15 @@
import { isEmpty } from '@/utils/is' import { isEmpty } from '@/utils/is'
import download from '@/utils/download' import download from '@/utils/download'
import { HandDetectorApi, HandDetector } from '@/api/gas/handdetector' import { HandDetectorApi, HandDetector } from '@/api/gas/handdetector'
import { DeptVO, getSimpleDeptList } from '@/api/system/dept'
import HandDetectorForm from './HandDetectorForm.vue' import HandDetectorForm from './HandDetectorForm.vue'
import { DICT_TYPE } from '@/utils/dict' import { DICT_TYPE } from '@/utils/dict'
import { Fence } from '@/api/gas/fence' import { Fence } from '@/api/gas/fence'
import type { Type } from '@/api/gas/gastype' import type { Type } from '@/api/gas/gastype'
import { useHandDetectorStore } from '@/store/modules/handDetector' import { useHandDetectorStore } from '@/store/modules/handDetector'
import { dateFormatter } from '@/utils/formatTime' import { dateFormatter } from '@/utils/formatTime'
import { handleTree } from '@/utils/tree'
/** GAS手持探测器 列表 */ /** GAS手持探测器 列表 */
defineOptions({ name: 'HandDetector' }) defineOptions({ name: 'HandDetector' })
const handDetectorStore = useHandDetectorStore() const handDetectorStore = useHandDetectorStore()
@ -161,12 +198,20 @@ const queryParams = reactive({
pageSize: 10, pageSize: 10,
sn: undefined, sn: undefined,
name: undefined, name: undefined,
deptId: undefined,
createTime: [] createTime: []
}) })
const queryFormRef = ref() // 搜索的表单 const queryFormRef = ref() // 搜索的表单
const exportLoading = ref(false) // 导出的加载中 const exportLoading = ref(false) // 导出的加载中
const fences = ref<Fence[]>([]) const fences = ref<Fence[]>([])
const gasTypes = ref<Type[]>([]) const gasTypes = ref<Type[]>([])
const deptList = ref<DeptVO[]>([]) // 部门列表
function getDeptList() {
getSimpleDeptList().then((res) => {
deptList.value = handleTree(res || [])
})
}
/** 查询列表 */ /** 查询列表 */
const getList = async () => { const getList = async () => {
loading.value = true loading.value = true
@ -197,10 +242,10 @@ const resetQuery = () => {
/** 添加/修改操作 */ /** 添加/修改操作 */
const formRef = ref() const formRef = ref()
const openForm = (type: string, id?: number) => { const openForm = (type: string, id?: number) => {
if(fences.value.length === 0) {
if (fences.value.length === 0) {
getAllFences() getAllFences()
} }
if(gasTypes.value.length === 0) {
if (gasTypes.value.length === 0) {
getAllGasTypes() getAllGasTypes()
} }
formRef.value.open(type, id) formRef.value.open(type, id)
@ -261,5 +306,6 @@ onMounted(() => {
getList() getList()
getAllFences() getAllFences()
getAllGasTypes() getAllGasTypes()
getDeptList()
}) })
</script> </script>

9
web/src/views/gas/personnel/index.vue
View File

@ -40,15 +40,6 @@
}" }"
clearable clearable
/> />
<!-- <el-select
v-model="queryParams.deptId"
placeholder="请选择部门"
clearable
filterable
class="!w-240px"
>
<el-option v-for="dept in deptList" :key="dept.id" :label="dept.name" :value="dept.id" />
</el-select> -->
</el-form-item> </el-form-item>
<el-form-item label="系统用户" prop="userId"> <el-form-item label="系统用户" prop="userId">
<el-select <el-select

Write Preview
Loading…
Cancel
Save