whychdw
2019-08-16 b9b73b06e718dee9d80c02827d4cbbbec5beacac
内容提交
4个文件已修改
110 ■■■■ 已修改文件
src/components/BarChart.vue 8 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/ContentTitle.vue 53 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/HomeTree.vue 41 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/views/monitor/realTime.vue 8 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/BarChart.vue
@@ -129,16 +129,16 @@
                var max = getMaxFromArr(data);
                // 设置最小值
                if(this.range.minFlag == false || this.range.min == undefined) {
                    min = Math.floor(min*0.09);
                    min = Math.floor(min*0.9);
                }else {
                    min = this.range.min>min?Math.floor(min*0.1):this.range.min;
                    min = this.range.min>min?Math.floor(min*0.9):this.range.min;
                }
                // 设置最大值
                if(this.range.maxFlag == false || this.range.max == undefined) {
                    max = Math.ceil(max*1.1);
                    max = Math.ceil(max*1.25);
                }else {
                   max= this.range.max<max?Math.ceil(max*1.1):this.range.max;
                   max= this.range.max<max?Math.ceil(max*1.25):this.range.max;
                }
                option.yAxis.min = min;
                option.yAxis.max = max;
src/components/ContentTitle.vue
@@ -1,15 +1,20 @@
<template>
    <div class="content-title">
        <div class="content-title-container">
            <div class="ob_img"><img src="../assets/images/ob_line_left.gif"></div>
            <div class="content-title-text">测点信息</div>
            <div class="ob_img"><img src="../assets/images/ob_line_right.gif"></div>
            <div class="content-title-left"></div>
            <div class="content-title-text">{{title}}</div>
            <div class="content-title-right"></div>
        </div>
    </div>
</template>
<script>
export default {
    props: {
        title: {
            type: String,
            default: '测点信息'
        }
    }
}
</script>
<style scoped>
@@ -19,21 +24,47 @@
    .content-title-container {
        display: inline-block;
    }
    .ob_img {
        display: inline-block;
    .content-title-left {
        position: relative;
        display: inline-block;
        width: 20px;
        margin-bottom: -8px;
        border-bottom: 3px solid #468FB6;
    }
    .ob_img img {
    .content-title-left::before {
        content:"";
        position:absolute;
        bottom: 0;
        width: 10px;
        height: 10px;
        left: -10px;
        top: -4px;
        width: 12px;
        box-sizing:border-box;
        border-bottom:1px solid #468FB6;
        transform-origin:bottom center;
        transform:rotateZ(45deg) scale(1);
    }
    .content-title-right {
        position: relative;
        display: inline-block;
        width: 20px;
        margin-bottom: -8px;
        border-bottom: 3px solid #468FB6;
    }
    .content-title-right::after {
        content:"";
        position:absolute;
        right: -10px;
        top: -4px;
        width: 12px;
        box-sizing:border-box;
        border-bottom:1px solid #468FB6;
        transform-origin:bottom center;
        transform:rotateZ(135deg) scale(1);
    }
    .content-title-text {
        display: inline-block;
        padding-left: 16px;
        padding-right: 16px;
        font-size: 16px;
        font-size: 14px;
        font-weight: bold;
        color: #468FB6;
        border-bottom: 1px solid #468FB6;
src/components/HomeTree.vue
@@ -3,14 +3,24 @@
        <div class="tree-content">
            <Tree :data="data" :load-data="loadData" @on-select-change="handlerSelectChange"></Tree>
        </div>
    </div>
</template>
<script>
import {ajax} from '../libs/common'
export default {
    props: {
        homeName: {
            type: String,
            default: ''
        },
        groupName: {
            type: String,
            default: ''
        }
    },
    data() {
        return {
            first: true,
            data: []
        }
    },
@@ -35,14 +45,28 @@
                    var rs = JSON.parse(res.result);
                    if(rs.code == 1) {
                        var data = rs.data;
                        var expand = 0;
                        for(var i=0; i<data.length; i++) {
                            var _data = data[i];
                            _data.type = "home";
                            _data.loading = false;
                            _data.title = _data.StationName;
                            _data.children = [];
                            _data.expand = false;
                            // 判断是否展开
                            if(_data.StationName == self.homeName) {
                                expand = i;
                            }
                        }
                        self.data = data;
                        // 设置被展开的机房
                        data[expand].expand = true;
                        // 查询被展开机房的电池组
                        self.battGroup(data[0], function(res) {
                            for(var i=0; i<res.length; i++) {
                                data[0].children.push(res[i]);
                            }
                        });
                    }
                },
                error: function() {
@@ -51,6 +75,7 @@
            });
        },
        battGroup: function(item, callback) {
            var self = this;
            // 根据机房的id获取电池组列表
            ajax({
                type: "post",                 
@@ -64,13 +89,25 @@
                    var rs = JSON.parse(res.result);
                    if(rs.code == 1) {
                        var data = rs.data;
                        var selected = 0;
                        for(var i=0; i<data.length; i++) {
                            var _data = data[i];
                            _data.type="group";
                            _data.title = _data.BattGroupName;
                            _data.selected = false;
                            // 判断被选中的电池组
                            if(_data.BattGroupName == self.groupName) {
                                selected = i;
                            }
                        }
                        callback(data);
                        if(self.first) {
                            data[selected].selected = true;
                            // 触发选中电池组后的事件并通知父组件
                            self.handlerSelectChange([data[0]]);
                            self.first = false;
                        }
                    }
                }
            });
src/views/monitor/realTime.vue
@@ -9,6 +9,7 @@
                </div>
                <div class="view-layout-right">
                    <science-card width="100%" height="100%">
                        <content-title :title="contentTitle"></content-title>
                        <square-box style="margin: 8px" title="实时图谱" icon="ios-podium">
                            <Tabs value="monVolBar" class="ivu-tabs-yellow" name="controlTabs">
                                <TabPane label="电压" name="monVolBar" tab="controlTabs">
@@ -101,6 +102,7 @@
        return {
            batt: {},       // 电池组信息
            alarmlist: [],   // 电池告警参数
            contentTitle: '机房信息', // 主题内容的标题
            option: {
                xAxis: {
                    type: 'category',
@@ -123,11 +125,15 @@
    methods: {
        handlerSelectChange: function(item) {   // 处理左侧机房列表点击事件
            if(item.type == 'group') {
                // console.log(item);
                this.batt = item;
                this.searchBattAlarmParam();        //查询并存储电池告警参数
                this.setContentTitle();             // 设置内容的标题
            }
        },
        setContentTitle: function() {   // 设置内容的标题
            var batt = this.batt;
            this.contentTitle = batt.StationName+'-'+batt.BattGroupName+'-标称容量'+batt.MonCapStd+'AH';
        },
        searchBattAlarmParam: function() {      //查询并存储电池告警参数
            var batt = this.batt;
            if(!batt.BattGroupId) {