bw/src/views/bim/bimHome/components/EquipmentInfo.vue

81 lines
2.1 KiB
Vue

<template>
<div class="buildDiv">
<TopDiv title="设备信息"></TopDiv>
<dv-border-box-10 backgroundColor="#00174b" :color="['#3cbfdf', '#3cbfdf']">
<div>
<span class="name">设备名称</span>
<span class="text">{{ equipmentInfo.name }}</span>
</div>
<div>
<span class="name">设备编号</span>
<span class="text">{{ equipmentInfo.number }}</span>
</div>
<div>
<span class="name">设备状态</span>
<span class="text">{{ equipmentInfo.status }}</span>
</div>
<div>
<span class="name">设备位置</span>
<span class="text">{{ equipmentInfo.location }}</span>
</div>
<div>
<span class="name">所属厂区:</span>
<span class="text">{{ equipmentInfo.belong }}</span>
</div>
<div>
<span class="name">过保截至日期:</span>
<span class="text">{{ equipmentInfo.date }}</span>
</div>
</dv-border-box-10>
</div>
</template>
<script setup>
import bimStore from '@/store/modules/bim';
import TopDiv from "./TopDiv.vue";
const data = reactive({
equipmentInfo: {
name: '空调机组',
number: 'AHU-F01-02',
status: '启用',
location: '漳州厂区糖化间',
belong: '漳州厂区',
date: '2025-12-15'
}
});
const { equipmentInfo } = toRefs(data);
</script>
<style lang='scss' scoped>
.buildDiv {
position: absolute;
top: 10px;
right: 10px;
width: 360px;
height: 340px;
display: flex;
flex-direction: column;
align-items: center;
color: #3cbfdf;
:deep(.border-box-content) {
padding: 10px;
>div {
line-height: 48px;
display: flex;
justify-content: space-between;
}
.name {
width: 40%;
}
.text {
width: 59%;
color: #fff;
}
}
}</style>