123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281 |
- <template>
- <div class='detailTable' style='width: 767px'>
- <!-- <el-table :data='tableList' border>
- <el-table-column prop='title' label width='95'></el-table-column>
- <el-table-column prop label='冷机开启台数' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.chillerNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(row.chillerNumSetLOrg,true,0)}}</font>
- 大
- <font :class='row.chillerNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(row.chillerNumSetSOrg,true,0)}}</font>
- 小
- </template>
- </el-table-column>
- <el-table-column prop label='冷机出水温度' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.chillWaterOutTempSetOrg=="-9999"?"reds":""'>{{formatterRes(parseInt(row.chillWaterOutTempSetOrg),false,1)}}</font>
- ℃
- </template>
- </el-table-column>
- <el-table-column prop label='冷冻泵台数' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.coolPumpNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(row.coolPumpNumSetLOrg,true,1)}}</font>
- 大
- <font :class='row.coolPumpNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(row.coolPumpNumSetSOrg,true,0)}}</font>
- 小
- </template>
- </el-table-column>
- <el-table-column prop label='冷冻泵频率' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.coolPumpFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(row.coolPumpFreqSetOrg,false,0)}}</font>
- HZ
- </template>
- </el-table-column>
- <el-table-column prop label='冷却泵台数' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.chillPumpNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(row.chillPumpNumSetLOrg,true,0)}}</font>
- 大
- <font :class='row.chillPumpNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(row.chillPumpNumSetSOrg,true,0)}}</font>
- 小
- </template>
- </el-table-column>
- <el-table-column prop label='冷却泵频率' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.chillPumpFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(row.chillPumpFreqSetOrg,false,0)}}</font>
- HZ
- </template>
- </el-table-column>
- <el-table-column prop label='冷却塔台数' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.coolTowerNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(row.coolTowerNumSetSOrg,true,0)}}</font>
- 大
- <font :class='row.coolTowerNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(row.coolTowerNumSetLOrg,true,0)}}</font>
- 小
- </template>
- </el-table-column>
- <el-table-column prop='zip' label='冷却塔频率' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.coolTowerFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(row.coolTowerFreqSetOrg,false,0)}}</font>
- HZ
- </template>
- </el-table-column>
- <el-table-column prop label='室内平均温度' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.meanTindoor=="-9999"?"reds":""'>{{formatterRes(row.meanTindoor,false,1)}}</font>
- ℃
- </template>
- </el-table-column>
- <el-table-column prop label='室内最高温度' align='center' width>
- <template slot-scope='{row}'>
- <font :class='row.maxTindoor=="-9999"?"reds":""'>{{formatterRes(row.maxTindoor,false,1)}}</font>
- ℃
- </template>
- </el-table-column>
- <el-table-column prop label='冷机负载率' align='center' width>
- <template slot-scope='{row}'>
- <font
- :class='parseInt(row.plrAllOrg)=="-9999"?"reds":""'
- >{{(row.plrAllOrg==undefined)?'--':(parseInt(row.plrAllOrg)=='-9999'?'x':(parseInt(row.plrAllOrg)=='-9998'?'--':parseInt(row.plrAllOrg)))}}</font>
- HZ
- </template>
- </el-table-column>
- </el-table>-->
- <div class='detail-box'>
- <div class='detail-box-top'>
- <div style='width:100px;diplay:inline-block;'></div>
- <span style='width:75px;text-align:center'>
- 冷机
- <br />开启台数
- </span>
- <span style='width:75px;text-align:center'>
- 冷机
- <br />出水温度
- </span>
- <span style='width:70px;text-align:center'>
- 冷冻泵
- <br />台数
- </span>
- <span style='width:60px;text-align:center'>
- 冷冻泵
- <br />频率
- </span>
- <span style='width:70px;text-align:center'>
- 冷却泵
- <br />台数
- </span>
- <span style='width:60px;text-align:center'>
- 冷却泵
- <br />频率
- </span>
- <span style='width:70px;text-align:center'>
- 冷却塔
- <br />台数
- </span>
- <span style='width:60px;text-align:center'>
- 冷却塔
- <br />频率
- </span>
- <span style='width:75px;text-align:center'>
- 室内
- <br />平均温度
- </span>
- <span style='width:75px;text-align:center'>
- 室内
- <br />最高温度
- </span>
- <span style='width:60px;text-align:center'>
- 冷机
- <br />负载率
- </span>
- </div>
- <div class='detail-box-bottom' Î>
- <div class='detail-box-bottom-box' v-for='(item,index) in tableList' :key='index'>
- <span
- style='width:100px;font-size:12px;background:rgba(248,249,250,1);color:rgba(100,106,115,1);diplay:inline-block;text-align: center;'
- >{{item.title}}</span>
- <span style='width:75px;text-align:center'>
- <font :class='item.chillerNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(item.chillerNumSetLOrg,true,0)}}</font>大
- <font :class='item.chillerNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(item.chillerNumSetSOrg,true,0)}}</font>小
- </span>
- <span style='width:75px;text-align:center'>
- <font
- :class='item.chillWaterOutTempSetOrg=="-9999"?"reds":""'
- >{{formatterRes(parseInt(item.chillWaterOutTempSetOrg),false,1)}}</font>℃
- </span>
- <span style='width:70px;text-align:center'>
- <font :class='item.coolPumpNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(item.coolPumpNumSetLOrg,true,1)}}</font>大
- <font :class='item.coolPumpNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(item.coolPumpNumSetSOrg,true,0)}}</font>小
- </span>
- <span style='width:60px;text-align:center'>
- <font :class='item.coolPumpFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(item.coolPumpFreqSetOrg,false,0)}}</font>Hz
- </span>
- <span style='width:70px;text-align:center'>
- <font :class='item.chillPumpNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(item.chillPumpNumSetLOrg,true,0)}}</font>大
- <font :class='item.chillPumpNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(item.chillPumpNumSetSOrg,true,0)}}</font>小
- </span>
- <span style='width:60px;text-align:center'>
- <font :class='item.chillPumpFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(item.chillPumpFreqSetOrg,false,0)}}</font>Hz
- </span>
- <span style='width:70px;text-align:center'>
- <font :class='item.coolTowerNumSetSOrg=="-9999"?"reds":""'>{{formatterRes(item.coolTowerNumSetSOrg,true,0)}}</font>大
- <font :class='item.coolTowerNumSetLOrg=="-9999"?"reds":""'>{{formatterRes(item.coolTowerNumSetLOrg,true,0)}}</font>小
- </span>
- <span style='width:60px;text-align:center'>
- <font :class='item.coolTowerFreqSetOrg=="-9999"?"reds":""'>{{formatterRes(item.coolTowerFreqSetOrg,false,0)}}</font>Hz
- </span>
- <span style='width:75px;text-align:center'>
- <font :class='item.meanTindoor=="-9999"?"reds":""'>{{formatterRes(item.meanTindoor,false,1)}}</font>℃
- </span>
- <span style='width:75px;text-align:center'>
- <font :class='item.maxTindoor=="-9999"?"reds":""'>{{formatterRes(item.maxTindoor,false,1)}}</font>℃
- </span>
- <span style='width:60px;text-align:center'>
- <font
- :class='parseInt(item.plrAllOrg)=="-9999"?"reds":""'
- >{{(item.plrAllOrg==undefined)?'--':(parseInt(item.plrAllOrg)=='-9999'?'x':(parseInt(item.plrAllOrg)=='-9998'?'--':parseInt(item.plrAllOrg)))}}</font>Hz
- </span>
- </div>
- </div>
- </div>
- </div>
- </template>
- <script>
- export default {
- data() {
- return {}
- },
- props: ['tableList'],
- mounted() {
- console.log(this.tableList)
- },
- methods: {
- formatterRes(res, type, num) {
- if (res == '-9999') {
- return 'x'
- } else if (res == '-9998') {
- if (type) {
- return 0
- } else {
- return '--'
- }
- } else {
- if (res != undefined) {
- console.log(res)
- res = res.toFixed(num)
- } else {
- return '--'
- }
- return res
- }
- }
- }
- }
- </script>
- <style lang="scss" scoped>
- .detailTable {
- .reds {
- color: #f54e45;
- }
- margin: 0 auto;
- .el-table {
- font-size: 12px;
- }
- .el-table th {
- padding: 6px 0;
- font-size: 12px;
- }
- .el-table td {
- padding: 8px 0;
- }
- .el-table th > .cell {
- padding-right: 2px;
- padding-left: 2px;
- }
- .detail-box {
- // width: 100%;
- .detail-box-top {
- // width: 762px;
- height: 48px;
- background: rgba(248, 249, 250, 1);
- display: flex;
- border-bottom: 1px solid #eee;
- span {
- display: inline-block;
- font-size: 12px;
- font-family: MicrosoftYaHei;
- color: rgba(100, 106, 115, 1);
- line-height: 16px;
- padding: 8px 5px;
- }
- }
- .detail-box-bottom {
- // width:92px;
- height: 123px;
- background: rgba(255, 255, 255, 1);
- font-size: 12px;
- font-family: MicrosoftYaHei;
- color: rgba(31, 36, 41, 1);
- .detail-box-bottom-box {
- display: flex;
- border-bottom: 1px solid #eee;
- span {
- padding: 12px 5px;
- display: inline-block;
- }
- }
- }
- }
- }
- </style>
- <style lang="scss">
- .detailTable {
- .el-table__header,
- table {
- width: auto !important;
- }
- .el-table_tbody {
- width: auto !important;
- }
- }
- </style>
|