zhaohy
7 months ago
36 changed files with 1094 additions and 1080 deletions
@ -1,13 +1,14 @@ |
|||||
|
// 设备监测
|
||||
export enum deviceMonitor { |
export enum deviceMonitor { |
||||
// getTableList = '/carbon/emission/factor/queryCarbonFactorPage',
|
|
||||
// addNewData = '/carbon/emission/factor/creatOrUpdate',
|
|
||||
// editUser = '/carbon-smart/api/user/edit',
|
|
||||
// frozen = '/carbon-smart/api/user/frozen',
|
|
||||
// resetPwd = '/carbon-smart/api/user/resetPwd',
|
|
||||
// del = '/carbon-smart/api/user/del',
|
|
||||
// batchDel = '/carbon-smart/api/user/batchDel',
|
|
||||
// getCarbonFactorTree = '/carbon/emission/type/getCarbonFactorTree',
|
|
||||
// queryDeptTree = '/carbon-smart/api/user/queryDeptTree',
|
|
||||
// queryUserPerList = '/carbon-smart/api/user/queryUserPerList',
|
|
||||
getDeviceGraph = '/carbon-smart/api/monitor/getDeviceGraph', |
getDeviceGraph = '/carbon-smart/api/monitor/getDeviceGraph', |
||||
|
getDevicePointToMonitor = '/carbon-smart//api/monitor/getDevicePointToMonitor', |
||||
} |
} |
||||
|
|
||||
|
// 能耗监测
|
||||
|
export enum energyMonitor { |
||||
|
getDeviceOrNodeEnergyGraph = '/carbon-smart/api/monitor/getDeviceOrNodeEnergyGraph', |
||||
|
getDeviceOrNodeEnergyAnalyse = '/carbon-smart/api/monitor/getDeviceOrNodeEnergyAnalyse', |
||||
|
} |
||||
|
|
||||
|
// 环境监测
|
||||
|
export enum environmentMonitor {} |
||||
|
|||||
|
After Width: | Height: | Size: 3.6 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 1.4 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
@ -0,0 +1,53 @@ |
|||||
|
<template> |
||||
|
<div class="map-box"> |
||||
|
<div class="map"> |
||||
|
<liftInfo></liftInfo> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
import { ref, onMounted } from 'vue'; |
||||
|
import liftInfo from './liftInfo.vue' |
||||
|
// 请求 |
||||
|
import { message } from 'ant-design-vue'; |
||||
|
|
||||
|
// 初始化 =========================================================== |
||||
|
|
||||
|
onMounted(() => { |
||||
|
|
||||
|
}) |
||||
|
|
||||
|
// tab页部分 ======================================================== |
||||
|
|
||||
|
// 表格数据 |
||||
|
const dataSource = ref([]); |
||||
|
|
||||
|
|
||||
|
</script> |
||||
|
<style lang="less" scoped> |
||||
|
.map-box { |
||||
|
// 颜色变量，用于区别颜色 |
||||
|
|
||||
|
// 正常 - 开启 - 上行 -下行 |
||||
|
--on: #0DFFA4; |
||||
|
// 关闭 |
||||
|
--off: #BFCDE2; |
||||
|
// 暂停 - 维修 |
||||
|
--pause: #FFBC46; |
||||
|
// 告警 - 急停 |
||||
|
--stop: #F36163; |
||||
|
// 故障 |
||||
|
--fault: #FF7636; |
||||
|
// 未知 |
||||
|
--unknown: #A742FF; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
.map { |
||||
|
width: 1280px; |
||||
|
height: 720px; |
||||
|
background-image: url(../image/bg.jpg); |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,151 @@ |
|||||
|
<template> |
||||
|
<div class="info-box"> |
||||
|
<div class="box-title"> |
||||
|
<div class="dot"></div> |
||||
|
<span>办公区域扶梯A</span> |
||||
|
</div> |
||||
|
<div class="box-inner"> |
||||
|
<!-- 是否开启 --> |
||||
|
<div class="item"> |
||||
|
<div class="item-box"> |
||||
|
<div class="icon"> |
||||
|
<div class="icon-item"> |
||||
|
<img src="../image/liftState/lift-normal.svg" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="item-text">开启</div> |
||||
|
</div> |
||||
|
<!-- 是否故障 --> |
||||
|
<div class="item"> |
||||
|
<div class="item-box"> |
||||
|
<div class="icon"> |
||||
|
<div class="icon-item"> |
||||
|
<img src="../image/liftState/lift-normal.svg" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="item-text">开启</div> |
||||
|
</div> |
||||
|
<!-- 如何运行 --> |
||||
|
<div class="item"> |
||||
|
<div class="item-box"> |
||||
|
<div class="icon"> |
||||
|
<div class="icon-item"> |
||||
|
<img src="../image/liftState/lift-normal.svg" alt=""> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<div class="item-text">开启</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script setup lang="ts"> |
||||
|
import { ref, onMounted } from 'vue'; |
||||
|
|
||||
|
// 请求 |
||||
|
|
||||
|
// 初始化 =========================================================== |
||||
|
|
||||
|
onMounted(() => { |
||||
|
|
||||
|
}) |
||||
|
|
||||
|
// tab页部分 ======================================================== |
||||
|
|
||||
|
// 运行状态 |
||||
|
const runState = ref('1'); |
||||
|
// 电梯状态 |
||||
|
const liftState = ref('2'); |
||||
|
|
||||
|
|
||||
|
</script> |
||||
|
<style lang="less" scoped> |
||||
|
// 面板 |
||||
|
.info-box { |
||||
|
// 字体颜色变量 |
||||
|
--text: rgb(20, 255, 255); |
||||
|
|
||||
|
width: 240px; |
||||
|
height: 130px; |
||||
|
display: flex; |
||||
|
gap: 5px; |
||||
|
flex-direction: column; |
||||
|
background: rgb(17, 44, 86, 0.9); |
||||
|
border-radius: 8px; |
||||
|
box-sizing: border-box; |
||||
|
padding: 8px; |
||||
|
border: 3px solid var(--text); |
||||
|
// 面板标题 |
||||
|
.box-title { |
||||
|
height: auto; |
||||
|
color: var(--text); |
||||
|
// 标题前小方块 |
||||
|
.dot { |
||||
|
display: inline-block; |
||||
|
width: 2px; |
||||
|
height: 16px; |
||||
|
vertical-align: middle; |
||||
|
background: var(--text); |
||||
|
} |
||||
|
// 标题 |
||||
|
span { |
||||
|
padding-left: 8px; |
||||
|
} |
||||
|
} |
||||
|
// 下半部分 |
||||
|
.box-inner { |
||||
|
flex: 1; |
||||
|
display: flex; |
||||
|
padding: 0 10px; |
||||
|
// 单个盒子（3盒子） |
||||
|
.item { |
||||
|
flex: 1; |
||||
|
display: flex; |
||||
|
flex-direction: column; |
||||
|
// 盒子中放置图片的容器 |
||||
|
.item-box { |
||||
|
flex: 1; |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; |
||||
|
// border: 1px solid red; |
||||
|
.icon { |
||||
|
width: 55px; |
||||
|
height: 55px; |
||||
|
background-image: url(../image/box.svg); |
||||
|
background-size: 130% 130%; |
||||
|
background-repeat: no-repeat; |
||||
|
background-position: left -8px top -8px; |
||||
|
// border: 1px solid red; |
||||
|
position: relative; |
||||
|
.icon-item { |
||||
|
position: absolute; |
||||
|
width: 20px; |
||||
|
height: 20px; |
||||
|
left: 0; |
||||
|
right: 0; |
||||
|
bottom: 0; |
||||
|
top: 0; |
||||
|
margin: auto; |
||||
|
img { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.item-text { |
||||
|
height: 20px; |
||||
|
text-align: center; |
||||
|
font-size: 12px; |
||||
|
color: white; |
||||
|
user-select: none; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
|
||||
|
</style> |
||||
@ -1,88 +0,0 @@ |
|||||
import { ref } from 'vue'; |
|
||||
export const treeData = ref([ |
|
||||
{ |
|
||||
label: '站厅', |
|
||||
id: '1', |
|
||||
// 前端遍历后添加，属前端属性
|
|
||||
selected: false, |
|
||||
children: [{ |
|
||||
label: '站厅1区', |
|
||||
id: '1-1', |
|
||||
// 前端属性
|
|
||||
selected: false, |
|
||||
// 后端属性（表示禁用了一个设备）
|
|
||||
stop: false, |
|
||||
// 当前的控制模式
|
|
||||
type: 3 |
|
||||
},{ |
|
||||
label: '站厅2区', |
|
||||
id: '1-2', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 1 |
|
||||
}] |
|
||||
}, |
|
||||
{ |
|
||||
label: '站台', |
|
||||
id: '2', |
|
||||
selected: false, |
|
||||
children: [{ |
|
||||
label: '站台1区', |
|
||||
id: '2-1', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 1 |
|
||||
},{ |
|
||||
label: '站台2区', |
|
||||
id: '2-2', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 2 |
|
||||
},{ |
|
||||
label: '站台3区', |
|
||||
id: '2-3', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 3 |
|
||||
},{ |
|
||||
label: '站台4区', |
|
||||
id: '2-4', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 1 |
|
||||
}] |
|
||||
},{ |
|
||||
label: '办公室', |
|
||||
id: '3', |
|
||||
selected: false, |
|
||||
children: [{ |
|
||||
label: '办公室1区', |
|
||||
id: '3-1', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 2 |
|
||||
}] |
|
||||
},{ |
|
||||
label: '楼道', |
|
||||
id: '4', |
|
||||
selected: false, |
|
||||
children: [{ |
|
||||
label: '楼道1区', |
|
||||
id: '4-1', |
|
||||
selected: false, |
|
||||
stop: false, |
|
||||
type: 3 |
|
||||
}] |
|
||||
}, |
|
||||
]); |
|
||||
|
|
||||
export const controlType = ref([{ |
|
||||
name: '托管', |
|
||||
type: 1, |
|
||||
},{ |
|
||||
name: 'AI', |
|
||||
type: 2, |
|
||||
},{ |
|
||||
name: '手动', |
|
||||
type: 3, |
|
||||
}]) |
|
||||
Loading…
Reference in new issue