| | |
| | | .h580 { |
| | | height: 580px; |
| | | } |
| | | .h25-percent { |
| | | height: 25%; |
| | | } |
| | | .h30-percent { |
| | | height: 30%; |
| | | } |
New file |
| | |
| | | // 获取斜率 |
| | | 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; |
New file |
| | |
| | | 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; |
| | |
| | | import { |
| | | Timeout |
| | | } from '../assets/js/tools' |
| | | import getPageMenu from "@/assets/js/tools/getPageMenu"; |
| | | |
| | | export default { |
| | | components: { |
| | |
| | | username: sessionStorage.getItem('username'), |
| | | termDateShow: true, |
| | | termDate: 0, |
| | | menus: [], |
| | | options: { |
| | | text: { |
| | | color: '#041F6C', |
| | |
| | | }).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() { |
| | |
| | | |
| | | // 查询版本 |
| | | this.searchVersion(); |
| | | |
| | | // 查询导航 |
| | | this.getPageMenu(); |
| | | }, |
| | | destroyed() { |
| | | this.timer.stop(); |
| | |
| | | this.menus = getPageMenu(); |
| | | this.changeMenus(this.menus, data); |
| | | }).catch(error=>{ |
| | | this.menus = getPageMenu(); |
| | | console.log(error); |
| | | }); |
| | | }, |
| | |
| | | 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; |
| | |
| | | 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, |
| | |
| | | // 根据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); |
| | | }, |
| | |
| | | } |
| | | 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 { |
| | |
| | | // 格式化数据 |
| | | 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) { |
| | |
| | | } |
| | | |
| | | // 容量 |
| | | 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]]); |
| | | }); |
New file |
| | |
| | | <template> |
| | | <flex-layout no-bg> |
| | | <router-view></router-view> |
| | | </flex-layout> |
| | | </template> |
| | | |
| | | <script> |
| | | export default { |
| | | name: "test", |
| | | data() { |
| | | return {} |
| | | }, |
| | | } |
| | | </script> |
| | | |
| | | <style scoped> |
| | | |
| | | </style> |
New file |
| | |
| | | <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> |
| | |
| | | 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: { |