whychdw
2021-07-01 92c22239458e47bb14e33f212cb892356543db4a
内容提交
4个文件已添加
6个文件已修改
355 ■■■■■ 已修改文件
src/assets/css/common.css 3 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/js/tools/getSlope.js 8 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/js/tools/getSpecialPointIndex.js 47 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/PageHeader.vue 48 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/PageMenu.vue 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/chart/js/getYMax.js 6 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/pages/dataTest/history.vue 58 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/pages/test/index.vue 18 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/pages/test/lineMarkPoint.vue 150 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/router/routes.js 16 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/assets/css/common.css
@@ -64,6 +64,9 @@
.h580 {
    height: 580px;
}
.h25-percent {
    height: 25%;
}
.h30-percent {
    height: 30%;
}
src/assets/js/tools/getSlope.js
New file
@@ -0,0 +1,8 @@
// 获取斜率
function getSlope(y1, x1, y2, x2) {
    let k1 = y1-y2;
    let k2 = x1-x2;
    return k2 ==0?0:(k1/k2).toHold(2);
}
export default getSlope;
src/assets/js/tools/getSpecialPointIndex.js
New file
@@ -0,0 +1,47 @@
import getSlope from "@/assets/js/tools/getSlope";
// 获取数据集的特殊点
function getSpecialPointIndex(data) {
    let rs = {
        code: 0,
        min: -1,
        max: -1,
    };
    if(data.length < 20) {
        rs.code = 0;
        return rs;
    }
    let slopes = [];
    for(let i=1; i<data.length; i++) {
        let temp1 = data[i-1];
        let temp2 = data[i];
        slopes.push(getSlope(temp1,i-1,temp2, i));
    }
    // 遍历斜率
    for(let i=0; i<slopes.length; i++) {
        if(slopes[i]>0 && rs.min == -1) {
            rs.min = i;
        }
        if(slopes[i]<=0 && rs.max == -1 && rs.min != -1) {
            rs.max = i;
        }
    }
    if(rs.min == 0) {
        rs.min = -1;
    }
    for(let i=0; i<rs.min; i++) {
        if(slopes[i]>0) {
            rs.min = -1;
            break;
        }
    }
    if(rs.max != -1 && rs.min != -1) {
        rs.code = 1;
    }
    return rs;
}
export default getSpecialPointIndex;
src/components/PageHeader.vue
@@ -130,6 +130,7 @@
    import {
        Timeout
    } from '../assets/js/tools'
    import getPageMenu from "@/assets/js/tools/getPageMenu";
    export default {
        components: {
@@ -152,6 +153,7 @@
                username: sessionStorage.getItem('username'),
                termDateShow: true,
                termDate: 0,
                menus: [],
                options: {
                    text: {
                        color: '#041F6C',
@@ -626,7 +628,48 @@
                }).catch(error=>{
                });
            }
            },
            getPageMenu() {
                this.$apis.pageSetting.getPageMenu().then(res=>{
                    let rs = JSON.parse(res.data.result);
                    let data = [];
                    if(rs.code == 1) {
                        data = rs.data;
                    }
                    this.menus = getPageMenu();
                    this.changeMenus(this.menus, data);
                    this.changeBox(this.menus);
                }).catch(error=>{
                    this.menus = getPageMenu();
                    this.changeBox(this.menus);
                    console.log(error);
                });
            },
            changeMenus(menus, list) {
                menus.forEach(menu=>{
                    let item = "";
                    for(let i=0; i<list.length; i++) {
                        if(menu.id == list[i].id) {
                            item = list[i];
                            break;
                        }
                    }
                    if(item && item.childrens) {
                        item.childrens.forEach(children=>{
                            for(let i=0; i<menu.childrens.length; i++) {
                                let item2 = menu.childrens[i];
                                if(item2.id == children.id) {
                                    item2.enableduse = children.enableduse;
                                    break;
                                }
                            }
                        });
                    }
                });
            },
            changeBox(menus) {
                console.log(menus);
            },
        },
        computed: {
            processAlarmMsg() {
@@ -763,6 +806,9 @@
            // 查询版本
            this.searchVersion();
            // 查询导航
            this.getPageMenu();
        },
        destroyed() {
            this.timer.stop();
src/components/PageMenu.vue
@@ -33,6 +33,7 @@
                this.menus = getPageMenu();
                this.changeMenus(this.menus, data);
            }).catch(error=>{
                this.menus = getPageMenu();
                console.log(error);
            });
        },
src/components/chart/js/getYMax.js
@@ -3,7 +3,11 @@
    if (max == -Infinity) {
        return 1;
    }
    return Math.ceil(max * 1.01);
    if (max > 0) {
        Math.ceil(max * 1.01);
    } else {
        return Math.floor(max * 0.9);
    }
}
export default getYMax;
src/pages/dataTest/history.vue
@@ -172,6 +172,7 @@
import ChartWrapper from "@/components/ChartWrapper";
import chartImage from '@/assets/images/eleOn.gif'
import comparison from '../../components/comparisonData/comparison.vue'
import getSpecialPointIndex from "@/assets/js/tools/getSpecialPointIndex";
import {
    searchAll_lowAction,
    searchBattresdata,
@@ -556,6 +557,46 @@
            // 根据allData.groupVol数据设置groupVolLineChart的值
            groupVolLineChart.series[0].data = allData.onlineVol;
            groupVolLineChart.series[1].data = allData.groupVol;
            let specialPoint = getSpecialPointIndex(allData.groupVol.map(item=>{
                return item[1];
            }));
            let markLine = {};
            if(specialPoint.code) {
                markLine = {
                    data: [
                        {
                            label: {
                                show: true,
                                position: 'end',
                                formatter: [
                                    '{a|'+allData.groupVol[specialPoint.min][0]+'}',
                                    '{b|电压:'+allData.groupVol[specialPoint.min][1]+'}'
                                ].join('\n'),
                                rich: {
                                    a: {
                                        textAlign: 'left',
                                    },
                                    b: {
                                        textAlign: 'left',
                                    },
                                },
                            },
                            xAxis: allData.groupVol[specialPoint.min][0],
                        },
                        {
                            label: {
                                show: true,
                                formatter: [
                                    allData.groupVol[specialPoint.max][0],
                                    '电压:'+allData.groupVol[specialPoint.max][1]
                                ].join('\n'),
                            },
                            xAxis: allData.groupVol[specialPoint.max][0],
                        }
                    ]
                };
            }
            groupVolLineChart.series[1].markLine = markLine;
            // 更新图表
            this.$refs.groupVol.setOption(groupVolLineChart);
        },
@@ -594,7 +635,7 @@
            }
            this.monInfo.title = title;
            this.monInfo.unit = unit;
            monLineChart.title.show=false;
            monLineChart.title.show = false;
            monLineChart.series = dataList.map((item, index) => {
                let monNum = "#" + (index + 1);
                return {
@@ -760,12 +801,11 @@
                // 格式化数据
                this.formateHisData(data);
                this.searchBattresdata();
            })
                .catch(error => {
                    // 关闭等待框
                    this.$layer.close(loading);
                    console.log(error);
                });
            }).catch(error => {
                // 关闭等待框
                this.$layer.close(loading);
                console.log(error);
            });
        },
        // 格式化历史信息数据
        formateHisData(data) {
@@ -846,8 +886,8 @@
            }
            // 容量
            monLineData.vol.forEach((item, key)=>{
                item.forEach((volItem, volItemKey)=>{
            monLineData.vol.forEach((item, key) => {
                item.forEach((volItem, volItemKey) => {
                    let resCapItem = monBarData.resCap[volItemKey];
                    monLineData.resCap[key].push([volItem[0], resCapItem[key][1]]);
                });
src/pages/test/index.vue
New file
@@ -0,0 +1,18 @@
<template>
    <flex-layout no-bg>
        <router-view></router-view>
    </flex-layout>
</template>
<script>
export default {
    name: "test",
    data() {
        return {}
    },
}
</script>
<style scoped>
</style>
src/pages/test/lineMarkPoint.vue
New file
@@ -0,0 +1,150 @@
<template>
    <flex-layout>
        <div class="full-height layout-box layout-box-top">
            <flex-box title="组端电压">
                <e-chart-wrapper ref="groupVol"></e-chart-wrapper>
            </flex-box>
        </div>
    </flex-layout>
</template>
<script>
import EChartWrapper from "@/components/chart/EChartWrapper";
import FlexBox from "@/components/FlexBox";
import getYMin from "@/components/chart/js/getYMin";
import getYMax from "@/components/chart/js/getYMax";
import {formatSeconds} from "@/assets/js/tools";
import echarts from 'echarts';
import getSpecialPointIndex from "@/assets/js/tools/getSpecialPointIndex";
export default {
    name: "lineMarkPoint",
    chartOpts(option) {
        let opt = option?option:{};
        let unit = opt.unit?option.unit:"";
        return {
            animation: false,
            tooltip: {
                trigger: 'axis',
                axisPointer: {            // 坐标轴指示器,坐标轴触发有效
                    type: 'line'        // 默认为直线,可选为:'line' | 'shadow'
                },
                appendToBody: true,
            },
            grid: {
                top: '32px',
                left: '1%',
                right: '1%',
                bottom: '18px',
                containLabel: true
            },
            xAxis: [
                {
                    type: 'category',
                }
            ],
            yAxis: [
                {
                    type: 'value',
                    name: unit?'Y('+unit+')':'Y',
                    min: getYMin,
                    max: getYMax,
                },
            ],
            series: [],
        }
    },
    components: {
        FlexBox,
        EChartWrapper
    },
    data() {
        return {}
    },
    methods: {
        resize() {
            this.$nextTick(()=>{
                this.$refs.groupVol.resize();
            });
        },
        setOption() {
            this.$refs.groupVol.setOption(this.$options.chartOpts({}));
        },
        setData() {
            let start = 53.5;
            let data = [];
            for(let i=0; i<10; i++) {
                start = start-0.3;
                data.push(start)
            }
            for(let i=0; i<20; i++) {
                start = start+0.4;
                data.push(start)
            }
            for(let i=0; i<100; i++) {
                start = start-0.01;
                data.push(start)
            }
            for(let i=0; i<100; i++) {
                start = start-0.4;
                data.push(start)
            }
            data = data.map(item=>{
                return item.toHold(2);
            });
            let specialPoint = getSpecialPointIndex(data);
            let markLine = null;
            if(specialPoint.code) {
                markLine ={
                    data: [
                        {
                            xAxis: formatSeconds(specialPoint.min)
                        },
                        {
                            xAxis: formatSeconds(specialPoint.max)
                        }
                    ]
                }
            }
            let volList = data.map((item,key)=>{
                return [formatSeconds(key), item.toFixed(2)];
            });
            let groupVolOpts = this.$options.chartOpts({
                unit: "V"
            });
            groupVolOpts.series = [
                {
                    type: 'line',
                    name: "组端电压",
                    smooth: false,
                    symbolSize: 0,
                    sampling: 'average',
                    data: volList,
                    markLine: markLine,
                }
            ];
            this.$refs.groupVol.setOption(groupVolOpts);
        },
    },
    mounted() {
        this.setOption();
        setTimeout(()=>{
            this.setData();
        }, 2000);
        window.addEventListener('resize', this.resize);
    },
    destroyed() {
        window.removeEventListener('resize', this.resize)
    }
}
</script>
<style scoped>
.layout-box {
    box-sizing: border-box;
    padding: 8px;
}
</style>
src/router/routes.js
@@ -449,6 +449,22 @@
        component: (resolve) => require(['../pages/reportStatistics/powerReport.vue'], resolve)
    },
    {
        path: '/test/',
        meta: {
            title: '测试模块',
        },
        component: resolve => require(['../pages/test/index.vue'], resolve),
        children: [
            {
                path: 'lineMarkPoint',
                meta: {
                    title: '测试折线图模块极值点',
                },
                component: resolve => require(['../pages/test/lineMarkPoint.vue'], resolve),
            }
        ]
    },
    {
        path: '*',
        name: '',
        meta: {