<template>
|
<div class="box-tools page-content-tools">
|
<el-popover placement="bottom" trigger="hover">
|
<div class="hdw-menu-list">
|
<ul>
|
<li class="hdw-menu-item">
|
<a href="javascript:void(0);" @click="nibian.show=true">逆变信息</a>
|
</li>
|
<li class="hdw-menu-item">
|
<a href="javascript:void(0);" @click="moduleInfo.show=true">模块信息</a>
|
</li>
|
</ul>
|
</div>
|
<button class="hdw-btn transparentBtn" slot="reference">
|
<span>更多信息</span>
|
<i class="hdw-icon el-icon-caret-bottom"></i>
|
</button>
|
</el-popover>
|
<!-- 逆变信息 -->
|
<el-dialog
|
title="逆变信息" width="600px"
|
:visible.sync="nibian.show"
|
:close-on-click-modal="false" top="0"
|
class="dialog-center" :modal-append-to-body="false">
|
<ni-bian v-if="nibian.show" :batt="batt"></ni-bian>
|
</el-dialog>
|
<!-- 模块信息 -->
|
<el-dialog
|
:title="moduleInfoTitle" width="1300px"
|
:visible.sync="moduleInfo.show"
|
:close-on-click-modal="false" top="0"
|
class="dialog-center" :modal-append-to-body="false">
|
<module-info v-if="moduleInfo.show" :batt="batt"></module-info>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import NiBian from "@/pages/dataTest/dialogs/NiBian";
|
import ModuleInfo from "@/pages/dataTest/dialogs/ModuleInfo";
|
|
export default {
|
name: "BoxTools",
|
components: {
|
NiBian,
|
ModuleInfo
|
},
|
props: {
|
batt: {
|
type: Object,
|
default() {
|
return {};
|
}
|
}
|
},
|
data() {
|
return {
|
nibian: {
|
show: false,
|
},
|
moduleInfo: {
|
show: false
|
}
|
}
|
},
|
computed: {
|
moduleInfoTitle(){
|
let batt = this.batt;
|
return batt.StationName+'-装置信息';
|
}
|
},
|
}
|
</script>
|
|
<style scoped>
|
.box-tools .iconfont,
|
.box-tools .el-iconfont {
|
margin-left: 4px;
|
font-size: 22px;
|
}
|
|
.hdw-btn {
|
display: inline-block;
|
color: #fff;
|
background-color: #409eff;
|
border-color: #409eff;
|
line-height: 1;
|
white-space: nowrap;
|
cursor: pointer;
|
-webkit-appearance: none;
|
text-align: center;
|
box-sizing: border-box;
|
outline: none;
|
margin: 0;
|
transition: 0.1s;
|
font-weight: 500;
|
-webkit-user-select: none;
|
-moz-user-select: none;
|
-ms-user-select: none;
|
user-select: none;
|
padding: 6px 10px;
|
font-size: 14px;
|
border-radius: 4px;
|
}
|
|
.hdw-btn:hover {
|
background-color: #3c91e6;
|
color: #FFFFFF;
|
}
|
|
.hdw-menu-list {
|
border: 1px solid #409eff;
|
}
|
|
.hdw-menu-list .hdw-menu-item {
|
border-top: 1px solid #0e5194;
|
}
|
|
.hdw-menu-list .hdw-menu-item:first-child {
|
border-top: none;
|
}
|
|
.hdw-menu-item a {
|
display: block;
|
text-align: center;
|
padding: 8px;
|
color: #ffffff;
|
cursor: pointer;
|
background-color: rgba(30, 125, 219, 0.767);
|
}
|
|
.hdw-menu-item a:hover {
|
background-color: rgb(60, 135, 211);
|
}
|
|
.hdw-menu-item a:active {
|
background-color: rgb(34, 100, 167);
|
}
|
</style>
|
