|
|
@@ -0,0 +1,157 @@
|
|
|
+<template>
|
|
|
+<a-card>
|
|
|
+ <a-row>
|
|
|
+ <a-col>
|
|
|
+ <a-space>
|
|
|
+ <a-select v-model:value="queryParams.modelId" style="width: 170px;" >
|
|
|
+ <a-select-option
|
|
|
+ v-for="item in state.modelList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ {{item.modelLabel}}
|
|
|
+ </a-select-option>
|
|
|
+ </a-select>
|
|
|
+ <a-select v-model:value="queryParams.deviceId" style="width: 170px;" >
|
|
|
+ <a-select-option
|
|
|
+ v-for="item in state.deviceList"
|
|
|
+ :key="item.id"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ {{item.deviceLabel}}
|
|
|
+ </a-select-option>
|
|
|
+ </a-select>
|
|
|
+ <a-range-picker v-model:value="time" :format="['DD/MM/YYYY', 'DD/MM/YYYY']" />
|
|
|
+ </a-space>
|
|
|
+
|
|
|
+ </a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-table
|
|
|
+ style="margin-top: 20px;"
|
|
|
+ :columns="columns"
|
|
|
+ :loading="state.loading"
|
|
|
+ :data-source="state.dataSource"
|
|
|
+ >
|
|
|
+
|
|
|
+ </a-table>
|
|
|
+</a-card>
|
|
|
+</template>
|
|
|
+<script lang='ts' setup name="aaa" >
|
|
|
+import { DeviceContriller, ModelController } from '@/controller'
|
|
|
+import { DataController } from '@/controller/iot/data'
|
|
|
+import { onMounted, reactive, ref, watch } from 'vue'
|
|
|
+import dayjs from 'dayjs'
|
|
|
+
|
|
|
+const columns = [
|
|
|
+ {
|
|
|
+ title: '设备ID',
|
|
|
+ dataIndex: 'deviceId'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'key',
|
|
|
+ dataIndex: 'key'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'keyLabel',
|
|
|
+ dataIndex: 'keyLabel'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'stringValue',
|
|
|
+ dataIndex: 'stringValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'doubleValue',
|
|
|
+ dataIndex: 'doubleValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'longValue',
|
|
|
+ dataIndex: 'longValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'booleanValue',
|
|
|
+ dataIndex: 'booleanValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'jsonValue',
|
|
|
+ dataIndex: 'jsonValue'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: 'dataUnit',
|
|
|
+ dataIndex: 'dataUnit'
|
|
|
+ }
|
|
|
+]
|
|
|
+
|
|
|
+const time = ref([])
|
|
|
+
|
|
|
+const queryParams = reactive({
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ total: 0,
|
|
|
+ deviceId: '',
|
|
|
+ modelId: '',
|
|
|
+ attributeKey: '',
|
|
|
+ startTime: '',
|
|
|
+ endTime: ''
|
|
|
+})
|
|
|
+
|
|
|
+const state = reactive<{
|
|
|
+ loading: boolean,
|
|
|
+ dataSource: IOT.API.DATA.History[],
|
|
|
+ modelList: IOT.API.MODEL.Model[]
|
|
|
+ deviceList: IOT.API.DEVICE.Device[]
|
|
|
+}>({
|
|
|
+ loading: false,
|
|
|
+ dataSource: [],
|
|
|
+ modelList: [],
|
|
|
+ deviceList: []
|
|
|
+})
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => time.value,
|
|
|
+ () => {
|
|
|
+ queryParams.startTime = dayjs(time.value[0]).format('YYYY/MM/DD')
|
|
|
+ queryParams.endTime = dayjs(time.value[1]).format('YYYY/MM/DD')
|
|
|
+ getHistoryPage()
|
|
|
+ }
|
|
|
+)
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => queryParams.deviceId,
|
|
|
+ () => getHistoryPage()
|
|
|
+)
|
|
|
+
|
|
|
+watch(
|
|
|
+ () => queryParams.modelId,
|
|
|
+ () => {
|
|
|
+ console.log(queryParams.modelId)
|
|
|
+ getHistoryPage()
|
|
|
+ }
|
|
|
+)
|
|
|
+
|
|
|
+const getDeviceList = async () => {
|
|
|
+ const { data } = await DeviceContriller.list()
|
|
|
+ state.deviceList = data
|
|
|
+}
|
|
|
+
|
|
|
+const getModelList = async () => {
|
|
|
+ const { data: modelData } = await ModelController.list()
|
|
|
+ state.modelList = modelData
|
|
|
+}
|
|
|
+
|
|
|
+const getHistoryPage = async () => {
|
|
|
+ state.loading = true
|
|
|
+
|
|
|
+ const { data: historyData, sum } = await DataController.pageHistory(queryParams)
|
|
|
+ state.loading = false
|
|
|
+ state.dataSource = historyData
|
|
|
+ queryParams.total = sum
|
|
|
+}
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ getModelList()
|
|
|
+ getDeviceList()
|
|
|
+})
|
|
|
+
|
|
|
+</script>
|
|
|
+<style lang='less' scoped >
|
|
|
+</style>
|