Compare commits

...

7 Commits

  1. 3
      web/src/api/gas/handdetector/index.ts
  2. 39
      web/src/api/gas/tdengine/index.ts
  3. 4
      web/src/views/HandDevice/History/index.vue
  4. 10
      web/src/views/HandDevice/Home/components/OpenLayerMap.vue
  5. 10
      web/src/views/HandDevice/Home/index.vue
  6. 17
      web/src/views/gas/fencealarm/index.vue
  7. 12
      web/src/views/gas/handalarm/index.vue
  8. 7
      web/src/views/gas/handdetector/HandDetectorForm.vue
  9. 8
      web/src/views/gas/handdetector/index.vue
  10. 244
      web/src/views/gas/tdengine/index.vue

3
web/src/api/gas/handdetector/index.ts

@ -3,11 +3,12 @@ import type { Dayjs } from 'dayjs'
/** GAS手持探测器信息 */
export interface HandDetector {
id: number // 主键ID
id?: number // 主键ID
sn?: string // SN
name?: string // 持有人
fenceIds?: string // 围栏ids
fenceIdsArray?: string[] // 围栏ids数组
fenceType?: number // 围栏类型
gasTypeId?: number // 气体类型ID
gasChemical?: string // 气体化学式
min?: number // 测量范围中的最小值

39
web/src/api/gas/tdengine/index.ts

@ -0,0 +1,39 @@
import request from '@/config/axios'
export interface tdQuery {
pageNo: number // 页码
pageSize: number // 每页数量
sn?: string // 设备编号
startTime?: string | number // 开始时间
endTime?: string | number // 结束时间
}
/** 历史数据 */
export interface tdStruct {
sn?: string // 设备编号
battery?: string // 电量
value?: number // 数据
longitude?: number // 经度
latitude?: number // 纬度
ts?: string | number // 更新时间
name?: string // 持有人姓名
}
/** 原始数据 */
export interface tdengineOriginalStruct {
sn: string // 设备编号
payload: string //
ts: string | number // 更新时间
}
// 历史记录
export const tdengineApi = {
// 获取历史数据
getPage: async (params: any) => {
return await request.get({ url: `/gas/tdengine/page`, params })
},
// 获取原始数据
getOriginalLogPage: async (params: any) => {
return await request.get({ url: `/gas/tdengine/original-log-page`, params })
}
}

4
web/src/views/HandDevice/History/index.vue

@ -1,4 +0,0 @@
<template>历史数据</template>
<script setup lang="ts">
defineOptions({ name: 'HandDeviceHistory' })
</script>

10
web/src/views/HandDevice/Home/components/OpenLayerMap.vue

@ -39,14 +39,10 @@
<div class="data_item__title">在线数量</div>
<div class="data_item__value">200<span class="data_item__unit"></span></div>
</div>
<div class="data_item">
<!-- <div class="data_item">
<div class="data_item__title">用户数量</div>
<div class="data_item__value">200<span class="data_item__unit"></span></div>
</div>
<div class="data_item">
<div class="data_item__title">企业数量</div>
<div class="data_item__value">20<span class="data_item__unit"></span></div>
</div>
</div> -->
</div>
<div class="top-panel__right">
<span class="legend-title">报警图例</span>
@ -294,7 +290,7 @@ onMounted(() => {
defineExpose({ refreshFences })
</script>
<style scoped>
<style scoped lang="scss">
.map-container {
width: 100%;
height: 100%;

10
web/src/views/HandDevice/Home/index.vue

@ -51,10 +51,12 @@ const getFences = async () => {
onMounted(() => {
getMarkers()
getFences()
getDataTimer.value = setInterval(() => {
getMarkers()
getFences()
}, 5000)
console.log('定时器,暂时关掉,太烦了');
// getDataTimer.value = setInterval(() => {
// getMarkers()
// getFences()
// }, 5000)
})
onUnmounted(() => {
clearInterval(getDataTimer.value as NodeJS.Timeout)

17
web/src/views/gas/fencealarm/index.vue

@ -8,9 +8,9 @@
:inline="true"
label-width="120px"
>
<el-form-item label="持有人" prop="detectorId">
<el-form-item label="持有人" prop="name">
<el-select
v-model="queryParams.detectorId"
v-model="queryParams.name"
placeholder="请选择持有人"
clearable
@keyup.enter="handleQuery"
@ -24,7 +24,7 @@
/>
</el-select>
</el-form-item>
<el-form-item label="围栏" prop="fenceId">
<!-- <el-form-item label="围栏" prop="fenceId">
<el-select
v-model="queryParams.fenceId"
placeholder="请选择围栏"
@ -39,7 +39,7 @@
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form-item> -->
<el-form-item label="报警类型" prop="type">
<el-select
v-model="queryParams.type"
@ -129,7 +129,7 @@
@selection-change="handleRowCheckboxChange"
>
<el-table-column type="selection" width="55" />
<el-table-column label="持有人" align="center" prop="detectorId">
<el-table-column label="持有人" align="center" prop="name">
<template #default="scope">
{{
handDetectorStore.getHandDetectorList.find((item) => item.id === scope.row.detectorId)
@ -137,14 +137,15 @@
}}
</template>
</el-table-column>
<el-table-column label="围栏" align="center" prop="fenceId">
<!-- <el-table-column label="围栏" align="center" prop="fenceId">
<template #default="scope">
{{ handDetectorStore.getFences.find((item) => item.id === scope.row.fenceId)?.name }}
</template>
</el-table-column>
</el-table-column> -->
<el-table-column label="报警类型" align="center" prop="type">
<template #default="scope">
{{ handDetectorStore.getAlarmTypes.find((item) => item.id === scope.row.type)?.name }}
<!-- {{ handDetectorStore.getAlarmTypes }} -->
{{ handDetectorStore.getAlarmTypes.find((item) => item.level === scope.row.type)?.name }}
</template>
</el-table-column>
<el-table-column label="超出围栏米数" align="center" prop="distance" />

12
web/src/views/gas/handalarm/index.vue

@ -112,14 +112,14 @@
<el-form-item>
<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
<!-- <el-button
type="primary"
plain
@click="openForm('create')"
v-hasPermi="['gas:hand-alarm:create']"
>
<Icon icon="ep:plus" class="mr-5px" /> 新增
</el-button>
</el-button> -->
<el-button
type="success"
plain
@ -206,6 +206,10 @@
/>
<el-table-column label="操作" align="center" min-width="120px">
<template #default="scope">
<el-button link type="primary" @click="openForm('update', scope.row.id)">
查看位置
</el-button>
<el-button
link
type="primary"
@ -214,14 +218,14 @@
>
编辑
</el-button>
<el-button
<!-- <el-button
link
type="danger"
@click="handleDelete(scope.row.id)"
v-hasPermi="['gas:hand-alarm:delete']"
>
删除
</el-button>
</el-button> -->
</template>
</el-table-column>
</el-table>

7
web/src/views/gas/handdetector/HandDetectorForm.vue

@ -32,7 +32,7 @@
v-for="fence in selectFences"
:key="fence.id"
:label="fence.name"
:value="fence.id"
:value="String(fence.id)"
/>
</el-select>
</el-form-item>
@ -129,7 +129,7 @@ const props = defineProps({
required: true
}
})
const formData = ref({
const formData = ref<HandDetector>({
id: undefined,
sn: undefined,
name: undefined,
@ -176,6 +176,7 @@ const open = async (type: string, id?: number) => {
formLoading.value = true
try {
formData.value = await HandDetectorApi.getHandDetector(id)
formData.value.fenceIdsArray = formData.value.fenceIds?formData.value.fenceIds?.split(',') : []
} finally {
formLoading.value = false
}
@ -192,7 +193,7 @@ const submitForm = async () => {
formLoading.value = true
try {
const data = formData.value as unknown as HandDetector
data.fenceIds = data.fenceIdsArray?.join(',') || ''
data.fenceIds = data.fenceIdsArray?.join(',')
if (formType.value === 'create') {
await HandDetectorApi.createHandDetector(data)
message.success(t('common.createSuccess'))

8
web/src/views/gas/handdetector/index.vue

@ -73,13 +73,13 @@
<el-table-column label="SN" align="center" prop="sn" />
<el-table-column label="持有人" align="center" prop="name" />
<el-table-column label="应用围栏" align="center" prop="fenceIds">
<template #default="scope">
<template #default="scope">
{{
scope.row.fenceIdsArray &&
scope.row.fenceIdsArray.length > 0 &&
scope.row.fenceIdsArray
.map((item) => handDetectorStore.getFences.find((fence) => fence.id === item)?.name)
.join(',')
.map((item) => handDetectorStore.getFences.find((fence) => fence.id == item)?.name)
.join('')
}}
</template>
</el-table-column>
@ -220,7 +220,7 @@ const handleDeleteBatch = async () => {
} catch {}
}
const checkedIds = ref<number[]>([])
const checkedIds = ref<any[]>([])
const handleRowCheckboxChange = (records: HandDetector[]) => {
checkedIds.value = records.map((item) => item.id)
}

244
web/src/views/gas/tdengine/index.vue

@ -0,0 +1,244 @@
<template>
<ContentWrap>
<!-- 搜索工作栏 -->
<el-form
class="-mb-15px"
:model="queryParams"
ref="queryFormRef"
:inline="true"
label-width="120px"
>
<!-- <el-form-item label="持有人" prop="name">
<el-select
v-model="queryParams.name"
placeholder="请选择持有人"
clearable
filterable
@keyup.enter="handleQuery"
class="!w-240px"
>
<el-option
v-for="item in handDetectorStore.getHandDetectorList"
:key="item.id"
:label="item.name"
:value="String(item.id)"
/>
</el-select>
</el-form-item> -->
<el-form-item label="设备编号" prop="sn">
<el-input
v-model="queryParams.sn"
placeholder="请输入设备编号"
clearable
@keyup.enter="handleQuery"
class="!w-240px"
/>
</el-form-item>
<!-- <el-form-item label="报警类型" prop="alarmLevel">
<el-select
v-model="queryParams.alarmLevel"
placeholder="请选择报警类型"
clearable
class="!w-240px"
>
<el-option
v-for="item in handDetectorStore.getAlarmTypes"
:key="item.level"
:label="item.name"
:value="Number(item.level)"
/>
</el-select>
</el-form-item> -->
<!-- 气体类型 -->
<!-- <el-form-item label="气体类型" prop="gasType">
<el-select
v-model="queryParams.gasType"
placeholder="请选择气体类型"
clearable
class="!w-240px"
>
<el-option
v-for="item in handDetectorStore.getGasTypes"
:key="item.id"
:label="item.chemical"
:value="String(item.chemical)"
/>
</el-select>
</el-form-item> -->
<el-form-item label="开始时间" prop="startTime">
<el-date-picker
v-model="queryParams.startTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="date"
placeholder="选择开始时间"
clearable
class="!w-240px"
/>
</el-form-item>
<el-form-item label="结束时间" prop="endTime">
<el-date-picker
v-model="queryParams.endTime"
value-format="YYYY-MM-DD 23:59:59"
type="date"
placeholder="选择结束时间"
clearable
class="!w-240px"
/>
</el-form-item>
<!-- <el-form-item label="状态" prop="status">
<el-select v-model="queryParams.status" placeholder="请选择状态" clearable class="!w-240px">
<el-option
v-for="item in getIntDictOptions(DICT_TYPE.HAND_DETECTOR_HANDLE_STATUS)"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item> -->
<!-- <el-form-item label="创建时间" prop="createTime">
<el-date-picker
v-model="queryParams.createTime"
value-format="YYYY-MM-DD HH:mm:ss"
type="daterange"
start-placeholder="开始日期"
end-placeholder="结束日期"
:default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"
class="!w-240px"
/>
</el-form-item> -->
<el-form-item>
<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-form-item>
</el-form>
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
<el-table-column type="selection" width="55" />
<el-table-column label="持有人" align="center" prop="name">
<!-- <template #default="scope">
{{
handDetectorStore.getHandDetectorList.find((item) => item.id === scope.row.detectorId)
?.name
}}
</template> -->
</el-table-column>
<el-table-column label="设备编号" align="center" prop="sn" />
<el-table-column label="经度" align="center" prop="longitude" />
<el-table-column label="纬度" align="center" prop="latitude" />
<el-table-column label="数值" align="center" prop="value" />
<!-- <el-table-column label="气体类型" align="center" prop="gasType"></el-table-column> -->
<!-- <el-table-column label="首报值" align="center" prop="vAlarmFirst" />
<el-table-column label="最值" align="center" prop="vAlarmMaximum" /> -->
<!-- <el-table-column
label="开始时间"
align="center"
prop="tAlarmStart"
:formatter="dateFormatter"
width="180px"
/>
<el-table-column
label="结束时间"
align="center"
prop="tAlarmEnd"
:formatter="dateFormatter"
width="180px"
/> -->
<el-table-column
label="创建时间"
align="center"
prop="ts"
:formatter="dateFormatter"
width="180px"
/>
</el-table>
<!-- 分页 -->
<Pagination
:total="total"
v-model:page="queryParams.pageNo"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</ContentWrap>
<!-- 表单弹窗添加/修改 -->
<!-- <HandAlarmForm
ref="formRef"
@success="getList"
:handDetector="handDetectorStore.getHandDetectorList"
:gasTypes="handDetectorStore.getGasTypes"
:alarmTypes="handDetectorStore.getAlarmTypes"
/> -->
</template>
<script setup lang="ts">
import { dateFormatter } from '@/utils/formatTime'
import { tdengineApi, tdStruct, tdQuery } from '@/api/gas/tdengine/index'
// import HandAlarmForm from './HandAlarmForm.vue'
import { useHandDetectorStore } from '@/store/modules/handDetector'
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
/** 手持探测器警报 列表 */
defineOptions({ name: 'TDStruct' })
const handDetectorStore = useHandDetectorStore()
const loading = ref(true) //
const list = ref<tdStruct[]>([]) //
const total = ref(0) //
const queryParams = reactive<tdQuery>({
pageNo: 1,
pageSize: 10,
sn: undefined,
startTime: undefined,
endTime: undefined
})
const queryFormRef = ref() //
/** 查询列表 */
const getList = async () => {
loading.value = true
try {
const data = await tdengineApi.getPage(queryParams)
list.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
/** 搜索按钮操作 */
const handleQuery = () => {
queryParams.pageNo = 1
getList()
}
/** 重置按钮操作 */
const resetQuery = () => {
queryFormRef.value.resetFields()
handleQuery()
}
// const checkedIds = ref<number[]>([])
// const handleRowCheckboxChange = (records: tdStruct[]) => {
// checkedIds.value = records.map((item) => item.id)
// }
/** 初始化 **/
onMounted(() => {
getList()
handDetectorStore.getAllHandDetector()
handDetectorStore.getAllAlarmTypes()
handDetectorStore.getAllGasTypes()
})
</script>
Loading…
Cancel
Save