xins
/
highwaysass
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改看板接口

Browse Source
dev
夜笙歌 1 year ago
parent 68b448c9ce
commit dc505ab90e
8 changed files with 285 additions and 716 deletions
Show Stats Download Patch File Download Diff File

17
ruoyi-ui/src/api/board/equipment.js
Unescape Escape View File

@ -4,7 +4,7 @@ import request from '@/utils/request'
export function treeList(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/treeList',
url: '/business/monitorPlatform/treeList/1',
method: 'get',
})
}
@ -12,8 +12,8 @@ export function treeList(query) {
export function selectDeviceByDeviceModeByMonitorUnitId(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/selectDeviceByDeviceModeByMonitorUnitId',
method: 'post',
url: '/business/monitorPlatform/selectDevicesByMonitorUnitId/1/1',
method: 'get',
data:query
})
}
@ -21,8 +21,17 @@ export function selectDeviceByDeviceModeByMonitorUnitId(query) {
export function selectDeviceModeFunctionByFunctionType(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/selectDeviceModeFunctionByFunctionType',
url: '/business/monitorPlatform/selectLatestDataByDeviceMode',
method: 'post',
data:query
})
}
// 中上
export function getMonitorById(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/getMonitorById/1',
method: 'get',
data:query
})
}

27
ruoyi-ui/src/api/board/equipmentMonitoring.js
Unescape Escape View File

@ -1,19 +1,28 @@
import request from '@/utils/request'
// 查询定时任务调度列表
export function listJob(query) {
// 右
export function selectLatestDataByDeviceMode(query) {
return request({
url: '/schedule/job/list',
method: 'get',
params: query
url: '/business/monitorPlatform/selectLatestDataByDeviceMode',
method: 'post',
data: {
"sceneId": 1,
"deviceModeId": 1,
"startTime": 1222222222222,
"offset": 0,
"limit": 10
}
})
}
// 新增定时任务调度
export function addJob(data) {
// 左
export function getDeviceModesBySceneId(data) {
return request({
url: '/schedule/job',
url: '/business/monitorPlatform/getDeviceModesBySceneId',
method: 'post',
data: data
data: {
"sceneId": 1,
}
})
}

10
ruoyi-ui/src/api/board/nav.js
Unescape Escape View File

@ -0,0 +1,10 @@
import request from '@/utils/request'
// 上
export function selectSecnes(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/selectSecnes',
method: 'get',
})
}

34
ruoyi-ui/src/api/board/senso.js
Unescape Escape View File

@ -0,0 +1,34 @@
import request from '@/utils/request'
// 上
export function getDeviceInfo(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/getDeviceInfo/1',
method: 'get',
})
}
// 中
export function getHistoryData(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/getHistoryData',
method: 'post',
data:{
"sceneId": 1,
"deviceId": 2,
"offset": 0,
"limit": 5,
"startTime": 1266666666666
}
})
}
// 下
export function getLinkDevices(query) {
return request({
// baseURL:'/monitoring-api',
url: '/business/monitorPlatform/getLinkDevices/1',
method: 'get',
})
}

31
ruoyi-ui/src/components/BoardTopNav/index.vue
Unescape Escape View File

@ -13,11 +13,7 @@
智慧场景 <i class="el-icon-arrow-down el-icon--right"></i>
</span>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>黄金糕</el-dropdown-item>
<el-dropdown-item>狮子头</el-dropdown-item>
<el-dropdown-item>螺蛳粉</el-dropdown-item>
<el-dropdown-item>双皮奶</el-dropdown-item>
<el-dropdown-item>蚵仔煎</el-dropdown-item>
<el-dropdown-item v-for="i in selectSecnesList">{{ i.sceneName }}</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</div>
@ -33,22 +29,27 @@
</div>
</div>
<div class="right" >
<div class="right">
<span>
管 理
</span>
</div>
<div class="rightImg" >
<div class="rightImg">
</div>
</div>
</template>
<script>
import {
selectSecnes
} from '@/api/board/nav'
export default {
data() {
return {}
return {
selectSecnesList: []
}
},
props: {
nowMenu: {
@ -58,8 +59,14 @@ export default {
},
mounted() {
this.setSelectSecnes()
},
methods: {}
methods: {
async setSelectSecnes() {
const {data} = await selectSecnes()
this.selectSecnesList = data
}
}
};
</script>
<style lang="less" scoped>
@ -97,7 +104,8 @@ export default {
transform: translate(-50%, -50%);
color: #f6f6f6;
}
.rightImg{
.rightImg {
transform: rotateX(180deg);
background-image: url('~@/assets/board/common/subheadClick1.png');
background-repeat: no-repeat;
@ -108,7 +116,8 @@ export default {
top: 3.8%;
left: 71%;
}
.right{
.right {
position: absolute;
width: 8vw;
height: 1.66vw;

73
ruoyi-ui/src/views/board/equipment/index.vue
Unescape Escape View File

@ -9,8 +9,8 @@
:data="treeData"
:props="{label:'monitorUnitName',children:'child',value:'monitorUnitId'}"
accordion
@node-click="treeClick"
node-key="id">
node-key="id"
@node-click="treeClick">
<span slot-scope="{ node, data }" class="custom-tree-node">
<span>{{ node.label }}</span>
</span>
@ -18,20 +18,20 @@
</div>
<div class="equipmentInfo">
<p>
<span>设备编码：</span>
<span style="color: #d9dee3">王秀1#变</span>
<span>设备名称：</span>
<span style="color: #d9dee3">{{ MonitorInfo.monitorUnitName }}</span>
</p>
<p>
<span>设备编码：</span>
<span style="color: #d9dee3">王秀1#变</span>
<span>设备id：</span>
<span style="color: #d9dee3">{{ MonitorInfo.monitorUnitId }}</span>
</p>
<p>
<span>设备编码：</span>
<span style="color: #d9dee3">王秀1#变</span>
<span>设备状态：</span>
<span style="color: #d9dee3">{{ MonitorInfo.monitorUnitStatus === 1 ? '正常' : '异常' }}</span>
</p>
<p>
<span>设备编码：</span>
<span style="color: #d9dee3">王秀1#变</span>
<span>设备类型：</span>
<span style="color: #d9dee3">{{ MonitorInfo.monitorUnitTypeId }}</span>
</p>
</div>
<div class="img"></div>
@ -42,9 +42,9 @@
</el-form-item>
</el-form>
<div class="terminalList">
<div v-for="i in 10" class="item">
<div v-for="i in controlList" class="item">
<div class="icon"></div>
<div class="title">车间-阀门</div>
<div class="title">{{ i.deviceName }}</div>
<div class="switch">
<el-switch
v-model="data1"
@ -56,16 +56,16 @@
</div>
</div>
<div class="right">
<div v-for="i in 10" class="item">
<div v-for="i in acquisitionList" class="item">
<div class="iconBg"></div>
<div class="icon"></div>
<div class="rightBg">
<div class="title">大厅-温度</div>
<div class="title">{{ i.deviceName }}</div>
<div style="position: absolute;left: 24%;top: 0px;width: 75%;height: 100%;">
<div v-for="i in 3" class="infoItem">
<div class="span">温度:</div>
<div v-for="val in Object.keys(i.deviceDataMaps[0]).slice(0,3)" class="infoItem">
<div class="span">{{ val }}:</div>
<div class="spanBg"></div>
<div class="num">47.5℃</div>
<div class="num">{{ i.deviceDataMaps[0][val] }}</div>
</div>
</div>
<div class="btn">
@ -87,7 +87,8 @@
import {
treeList,
selectDeviceByDeviceModeByMonitorUnitId,
selectDeviceModeFunctionByFunctionType
selectDeviceModeFunctionByFunctionType,
getMonitorById
} from '@/api/board/equipment'
import BoardTopNav from '@/components/BoardTopNav'
@ -98,16 +99,22 @@ export default {
},
data() {
return {
monitorUnitId:'',
monitorUnitId: '',
data1: true,
form: {
data1: ''
},
treeData: []
treeData: [],
controlList: [],
acquisitionList: [],
MonitorInfo:{}
}
},
mounted() {
this.getTree()
this.getDevice()
this.getRightDevice()
this.setMonitorById()
},
methods: {
async getTree() {
@ -115,23 +122,31 @@ export default {
console.log(data)
this.treeData = data
},
treeClick(e){
if(e.child.length === 0){
treeClick(e) {
if (e.child.length === 0) {
this.monitorUnitId = e.monitorUnitId
this.getDevice(e.monitorUnitId)
this.getRightDevice(e.monitorUnitId)
}
},
getDevice(e){
selectDeviceByDeviceModeByMonitorUnitId({monitorUnitId:e}).then(val=>{
console.log(val)
})
async getDevice(e) {
const {data} = await selectDeviceByDeviceModeByMonitorUnitId({monitorUnitId: e})
this.controlList = data.control
this.acquisitionList = data.acquisition
},
getRightDevice(e){
selectDeviceModeFunctionByFunctionType({monitorUnitId:e}).then(val=>{
console.log(val)
async getRightDevice(e) {
const data = await selectDeviceModeFunctionByFunctionType({
"sceneId": 1,
"deviceModeId": 1,
"startTime": 1222222222222,
"offset": 0,
"limit": 1
})
},
async setMonitorById() {
const {data} = await getMonitorById()
this.MonitorInfo = data
}
}
};
</script>

401
ruoyi-ui/src/views/board/equipmentMonitoring/index.vue
Unescape Escape View File

@ -3,8 +3,8 @@
<div class="centerImg"></div>
<BoardTopNav nowMenu="3"></BoardTopNav>
<div class="leftMenu">
<div v-for="i in 10" class="item">
<span>温度传感器</span>
<div v-for="i in deviceList" class="item">
<span>{{ i.deviceModeName }}</span>
</div>
</div>
<div ref="right" class="right">
@ -38,40 +38,32 @@
:max-height="maxHeight">
style="width: 100%">
<el-table-column
label="序号"
prop="data1">
label="rssi"
prop="rssi">
</el-table-column>
<el-table-column
label="传感器ID"
prop="data2">
label="value1"
prop="value1">
</el-table-column>
<el-table-column
label="传感器名称"
prop="data3">
label="编号"
prop="devicecode">
</el-table-column>
<el-table-column
label="标号"
prop="data4">
label="alias"
prop="alias">
</el-table-column>
<el-table-column
label="温度"
prop="data4">
label="设备名称"
prop="devicename">
</el-table-column>
<el-table-column
label="排名"
prop="data6">
label="ts"
prop="ts">
</el-table-column>
<el-table-column
label="湿度"
prop="data7">
</el-table-column>
<el-table-column
label="压力"
prop="data8">
</el-table-column>
<el-table-column
label="传感器"
prop="data9">
label="voltage"
prop="voltage">
</el-table-column>
</el-table>
</div>
@ -84,7 +76,10 @@
</template>
<script>
import {
selectLatestDataByDeviceMode,
getDeviceModesBySceneId,
} from '@/api/board/equipmentMonitoring'
import BoardTopNav from '@/components/BoardTopNav'
export default {
@ -100,354 +95,15 @@ export default {
data3: null
},
maxHeight: 0,
tableData: [
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
{
data1: 'data1',
data2: 'data2',
data3: 'data3',
data4: 'data4',
data5: 'data5',
data6: 'data6',
data7: 'data7',
data8: 'data8',
data9: 'data9',
},
]
tableData: [],
deviceList:[]
}
},
mounted() {
this.maxHeight = this.$refs.right.clientHeight - this.$refs.search.clientHeight - this.$refs.pagination.clientHeight - 12
this.tableShow = true
this.setSelectLatestDataByDeviceMode()
this.setDeviceModesBySceneId()
},
methods: {
setStyle(e) {
@ -456,6 +112,15 @@ export default {
} else {
return {textAlign: 'center', backgroundColor: '#063468', color: '#05aaba'}
}
},
async setSelectLatestDataByDeviceMode(){
const {data} = await selectLatestDataByDeviceMode()
this.tableData = data.latestData.rows
console.log(this.tableData)
},
async setDeviceModesBySceneId(){
const {data} = await getDeviceModesBySceneId()
this.deviceList = data
}
}
};

408
ruoyi-ui/src/views/board/senso/index.vue
Unescape Escape View File

@ -3,218 +3,84 @@
<div class="centerImg"></div>
<BoardTopNav nowMenu="4"></BoardTopNav>
<div class="collapse">
<el-collapse v-model="activeName" accordion>
<el-collapse-item name="1">
<template slot="title">
<div class="itemBg">
<div class="icon"></div>
<div class="icon1"></div>
<div class="icon2"></div>
<div class="title"> 大厅-摄像头</div>
<div class="info">
<div class="info1">所属区域</div>
<div class="info2">大厅</div>
<div style="margin-bottom: 24px">
<el-collapse v-model="activeName" accordion>
<el-collapse-item name="1">
<template slot="title">
<div class="itemBg">
<div class="icon"></div>
<div class="icon1"></div>
<div :style="'background-image: url('+topData.devicePic+')'" class="icon2"></div>
<div class="title"> {{ topData.monitorUnitName }}</div>
<div class="info">
<div class="info1">所属区域</div>
<div class="info2"> {{ topData.deviceName }}</div>
</div>
<div class="info" style="left: 70vh;">
<div class="info1">位置:</div>
<div class="info2">深圳</div>
</div>
<div class="info" style="left: 80vh;">
<div class="info1">日期:</div>
<div class="info2">2023-01-01 00:00:00</div>
</div>
</div>
<div class="info" style="left: 70vh;">
<div class="info1">位置:</div>
<div class="info2">深圳</div>
</div>
<div class="info" style="left: 80vh;">
<div class="info1">日期:</div>
<div class="info2">2023-01-01 00:00:00</div>
</div>
</div>
</template>
<div>
</template>
<div>
<el-row :gutter="24">
<el-col :span="12">
<el-radio-group v-model="radio">
<el-radio-button label="日统计报表"></el-radio-button>
<el-radio-button label="月统计报表"></el-radio-button>
</el-radio-group>
</el-col>
<el-col :span="12">
<div style="position: absolute; right: 30px;">
<span style="color: #fff;"> 开始时间：</span>
<div style="display: inline-block;width: 200px;margin-right: 12px;">
<el-date-picker type="date" placeholder="选择日期" style="width: 100%;"></el-date-picker>
</div>
<el-button type="primary">搜索</el-button>
<el-button>重置</el-button>
<el-button>导出</el-button>
</div>
</el-col>
</el-row>
<el-table :data="tableData" style="width: 100%;margin-top: 12px;"
:header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }"
:cell-style="setStyle">
<el-table-column prop="date1" label="设备ID">
</el-table-column>
<el-table-column prop="date2" label="传感器编号">
</el-table-column>
<el-table-column prop="date3" label="xx">
</el-table-column>
<el-table-column prop="date4" label="编号">
</el-table-column>
<el-table-column prop="date5" label="xx">
</el-table-column>
<el-table-column prop="date6" label="温度">
</el-table-column>
<el-table-column prop="date7" label="湿度">
</el-table-column>
<el-table-column prop="date8" label="时间">
</el-table-column>
</el-table>
<el-pagination background layout="prev, pager, next" :total="1000">
</el-pagination>
</div>
</div>
</el-collapse-item>
<el-collapse-item name="2">
<template slot="title">
<div class="itemBg">
<div class="icon"></div>
<div class="icon1"></div>
<div class="icon2"></div>
<div class="title"> 大厅-摄像头</div>
<div class="info">
<div class="info1">所属区域</div>
<div class="info2">大厅</div>
</div>
<div class="info" style="left: 70vh;">
<div class="info1">位置:</div>
<div class="info2">深圳</div>
</div>
<div class="info" style="left: 80vh;">
<div class="info1">日期:</div>
<div class="info2">2023-01-01 00:00:00</div>
<div>
<!-- <el-row :gutter="24">-->
<!-- <el-col :span="12">-->
<!-- <el-radio-group v-model="radio">-->
<!-- <el-radio-button label="日统计报表"></el-radio-button>-->
<!-- <el-radio-button label="月统计报表"></el-radio-button>-->
<!-- </el-radio-group>-->
<!-- </el-col>-->
<!-- <el-col :span="12">-->
<!-- <div style="position: absolute; right: 30px;">-->
<!-- <span style="color: #fff;"> 开始时间：</span>-->
<!-- <div style="display: inline-block;width: 200px;margin-right: 12px;">-->
<!-- <el-date-picker placeholder="选择日期" style="width: 100%;" type="date"></el-date-picker>-->
<!-- </div>-->
<!-- <el-button type="primary">搜索</el-button>-->
<!-- <el-button>重置</el-button>-->
<!-- <el-button>导出</el-button>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-table :cell-style="setStyle" :data="tableData"
:header-cell-style="{ textAlign: 'center',backgroundColor:'#0a457d' }"
style="width: 100%;margin-top: 12px;">
<el-table-column label="设备ID" prop="columnName">
</el-table-column>
<el-table-column label="传感器编号" prop="columnKey">
</el-table-column>
<el-table-column label="alias" prop="alias">
</el-table-column>
<el-table-column label="rssi" prop="rssi">
</el-table-column>
<el-table-column label="ts" prop="ts">
</el-table-column>
<el-table-column label="value1" prop="value1">
</el-table-column>
<el-table-column label="voltage" prop="voltage">
</el-table-column>
</el-table>
<el-pagination :total="1000" background layout="prev, pager, next">
</el-pagination>
</div>
</div>
</template>
<div>
<div>
<el-row :gutter="24">
<el-col :span="12">
<el-radio-group v-model="radio">
<el-radio-button label="日统计报表"></el-radio-button>
<el-radio-button label="月统计报表"></el-radio-button>
</el-radio-group>
</el-col>
<el-col :span="12">
<div style="position: absolute; right: 30px;">
<span style="color: #fff;"> 开始时间：</span>
<div style="display: inline-block;width: 200px;margin-right: 12px;">
<el-date-picker type="date" placeholder="选择日期" style="width: 100%;"></el-date-picker>
</div>
<el-button type="primary">搜索</el-button>
<el-button>重置</el-button>
<el-button>导出</el-button>
</el-collapse-item>
</el-collapse>
</div>
</div>
</el-col>
</el-row>
<el-table :data="tableData" style="width: 100%;margin-top: 12px;"
:header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center',backgroundColor:'#08406f' }">
<el-table-column prop="date1" label="设备ID">
</el-table-column>
<el-table-column prop="date2" label="传感器编号">
</el-table-column>
<el-table-column prop="date3" label="xx">
</el-table-column>
<el-table-column prop="date4" label="编号">
</el-table-column>
<el-table-column prop="date5" label="xx">
</el-table-column>
<el-table-column prop="date6" label="温度">
</el-table-column>
<el-table-column prop="date7" label="湿度">
</el-table-column>
<el-table-column prop="date8" label="时间">
</el-table-column>
</el-table>
<el-pagination background layout="prev, pager, next" :total="1000">
</el-pagination>
</div>
</div>
</el-collapse-item>
<el-collapse-item name="3">
<template slot="title">
<div class="itemBg">
<div class="icon"></div>
<div class="icon1"></div>
<div class="icon2"></div>
<div class="title"> 大厅-摄像头</div>
<div class="info">
<div class="info1">所属区域</div>
<div class="info2">大厅</div>
</div>
<div class="info" style="left: 70vh;">
<div class="info1">位置:</div>
<div class="info2">深圳</div>
</div>
<div class="info" style="left: 80vh;">
<div class="info1">日期:</div>
<div class="info2">2023-01-01 00:00:00</div>
</div>
</div>
</template>
<div>
<div>
<el-row :gutter="24">
<el-col :span="12">
<el-radio-group v-model="radio">
<el-radio-button label="日统计报表"></el-radio-button>
<el-radio-button label="月统计报表"></el-radio-button>
</el-radio-group>
</el-col>
<el-col :span="12">
<div style="position: absolute; right: 30px;">
<span style="color: #fff;"> 开始时间：</span>
<div style="display: inline-block;width: 200px;margin-right: 12px;">
<el-date-picker type="date" placeholder="选择日期" style="width: 100%;"></el-date-picker>
</div>
<el-button type="primary">搜索</el-button>
<el-button>重置</el-button>
<el-button>导出</el-button>
</div>
</el-col>
</el-row>
<el-table :data="tableData" style="width: 100%;margin-top: 12px;"
:header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center',backgroundColor:'#08406f' }">
<el-table-column prop="date1" label="设备ID">
</el-table-column>
<el-table-column prop="date2" label="传感器编号">
</el-table-column>
<el-table-column prop="date3" label="xx">
</el-table-column>
<el-table-column prop="date4" label="编号">
</el-table-column>
<el-table-column prop="date5" label="xx">
</el-table-column>
<el-table-column prop="date6" label="温度">
</el-table-column>
<el-table-column prop="date7" label="湿度">
</el-table-column>
<el-table-column prop="date8" label="时间">
</el-table-column>
</el-table>
<el-pagination background layout="prev, pager, next" :total="1000">
</el-pagination>
</div>
</div>
</el-collapse-item>
<el-collapse-item name="4">
<el-collapse v-model="activeName" accordion>
<el-collapse-item v-for="i in bottomData">
<template slot="title">
<div class="itemBg">
<div class="icon"></div>
<div class="icon1"></div>
<div class="icon2"></div>
<div class="title"> 大厅-摄像头</div>
<div class="title"> {{ i.deviceName }}</div>
<div class="info">
<div class="info1">所属区域</div>
<div class="info2">大厅</div>
@ -229,52 +95,6 @@
</div>
</div>
</template>
<div>
<div>
<el-row :gutter="24">
<el-col :span="12">
<el-radio-group v-model="radio">
<el-radio-button label="日统计报表"></el-radio-button>
<el-radio-button label="月统计报表"></el-radio-button>
</el-radio-group>
</el-col>
<el-col :span="12">
<div style="position: absolute; right: 30px;">
<span style="color: #fff;"> 开始时间：</span>
<div style="display: inline-block;width: 200px;margin-right: 12px;">
<el-date-picker type="date" placeholder="选择日期" style="width: 100%;"></el-date-picker>
</div>
<el-button type="primary">搜索</el-button>
<el-button>重置</el-button>
<el-button>导出</el-button>
</div>
</el-col>
</el-row>
<el-table :data="tableData" style="width: 100%;margin-top: 12px;"
:header-cell-style="{ textAlign: 'center' }"
:cell-style="{ textAlign: 'center',backgroundColor:'#08406f' }">
<el-table-column prop="date1" label="设备ID">
</el-table-column>
<el-table-column prop="date2" label="传感器编号">
</el-table-column>
<el-table-column prop="date3" label="xx">
</el-table-column>
<el-table-column prop="date4" label="编号">
</el-table-column>
<el-table-column prop="date5" label="xx">
</el-table-column>
<el-table-column prop="date6" label="温度">
</el-table-column>
<el-table-column prop="date7" label="湿度">
</el-table-column>
<el-table-column prop="date8" label="时间">
</el-table-column>
</el-table>
<el-pagination background layout="prev, pager, next" :total="1000">
</el-pagination>
</div>
</div>
</el-collapse-item>
</el-collapse>
</div>
@ -282,6 +102,11 @@
</template>
<script>
import {
getDeviceInfo,
getHistoryData,
getLinkDevices
} from '@/api/board/senso'
import BoardTopNav from '@/components/BoardTopNav'
export default {
@ -290,55 +115,42 @@ export default {
},
data() {
return {
topData: {},
bottomData: [],
radio: '日统计报表',
tableData: [{
date1: '1233454576',
date2: '1233454576',
date3: 'DFHDGHJK',
date4: '12',
date5: 'QSD',
date6: '111',
date7: '222',
date8: new Date().getDate(),
}, {
date1: '1233454576',
date2: '1233454576',
date3: 'DFHDGHJK',
date4: '12',
date5: 'QSD',
date6: '111',
date7: '222',
date8: new Date().getDate(),
}, {
date1: '1233454576',
date2: '1233454576',
date3: 'DFHDGHJK',
date4: '12',
date5: 'QSD',
date6: '111',
date7: '222',
date8: new Date().getDate(),
}, {
date1: '1233454576',
date2: '1233454576',
date3: 'DFHDGHJK',
date4: '12',
date5: 'QSD',
date6: '111',
date7: '222',
date8: new Date().getDate(),
}]
tableData: []
}
},
mounted() {
this.setDeviceInfo()
this.setHistoryData()
this.setLinkDevices()
},
methods: {
setStyle(e) {
if (e.rowIndex % 2 === 0) {
return {textAlign: 'center', backgroundColor: '#08406f', color: '#05aaba'}
}else{
} else {
return {textAlign: 'center', backgroundColor: '#063468', color: '#05aaba'}
}
},
async setDeviceInfo() {
const {data} = await getDeviceInfo()
this.topData = data
},
async setHistoryData() {
const {data} = await getHistoryData()
this.tableData = data.historyData.rows.map((e, i) => {
return {
...e,
...data.deviceDataColumns[i]
}
})
},
async setLinkDevices() {
const {data} = await getLinkDevices()
console.log(data)
this.bottomData = data
}
}
};
@ -361,37 +173,43 @@ export default {
height: 87%;
overflow: auto;
/deep/.el-collapse-item__wrap {
/deep/ .el-collapse-item__wrap {
background-color: #0000;
border-color: #0000;
}
/deep/.el-table {
/deep/ .el-table {
background-color: #FFF0 !important;
color: #fff;
}
/deep/.el-table tr {
/deep/ .el-table tr {
background-color: #FFF0 !important;
}
/deep/.el-table th.el-table__cell.is-leaf,{
/deep/ .el-table th.el-table__cell.is-leaf, {
border-color: #0000;
}
/deep/.el-table::before, .el-table--group::after, .el-table--border::after{
/deep/ .el-table::before, .el-table--group::after, .el-table--border::after {
background-color: #0000;
}
/deep/.el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th{
/deep/ .el-table .el-table__header-wrapper th, .el-table .el-table__fixed-header-wrapper th {
background-color: #0000;
}
/deep/.el-collapse-item__header {
/deep/ .el-collapse-item__header {
background-color: #0000;
border-color: #0000;
height: auto;
}
/deep/.el-collapse {
/deep/ .el-collapse {
border-color: #0000;
}
/deep/ .el-table td.el-table__cell{
/deep/ .el-table td.el-table__cell {
border-color: #0000;
}

Write Preview
Loading…
Cancel
Save