修改测试问题

This commit is contained in:
GGJ
2024-10-15 15:31:36 +08:00
parent a05cc2deab
commit 223e698c9b
9 changed files with 1720 additions and 1812 deletions

View File

@@ -5,7 +5,7 @@
<div class="bx" id="rms"></div>
</div>
</div>
<el-button
<!-- <el-button
style="position: absolute; right: 10px; top: 0px; z-index: 20000"
type="primary"
link
@@ -14,7 +14,7 @@
@click="download"
>
下载
</el-button>
</el-button> -->
</div>
</template>
<script lang="js">
@@ -27,7 +27,7 @@ import { mainHeight } from '@/utils/layout'
import url from '@/assets/img/point.png';
import url2 from '@/assets/img/dw.png';
export default {
props: {
props: {
value: {
type: Number,
default: 2,
@@ -46,8 +46,13 @@ export default {
wp: {
type: [Object, Array],
},
height: {
type: [String,Number],
default: false,
},
data() {
},
data() {
return {
zoom: "",
loading: true,
@@ -78,8 +83,8 @@ export default {
vh: null,
vw: null,
};
},
watch: {
},
watch: {
value: function (a, b) {
if (a == 2) {
//alert(a)
@@ -89,16 +94,18 @@ export default {
this.initWaves();
}
},
},
created() {
},
created() {
if (this.flag == 1) {
this.vh = mainHeight(165).height
}else if( this.height != false){
this.vh = this.height
} else {
this.vh = mainHeight(165,2).height
}
this.vw = '100%'
},
mounted() {
},
mounted() {
// this.$wave = $("#wave").eq(0);
this.zoom = 1 / document.body.style.zoom;
window.addEventListener("resize", () => {
@@ -106,8 +113,8 @@ export default {
});
// this.$rms = $("#rms").eq(0);
this.query();
},
methods: {
},
methods: {
download() {
// 转换成canvas
html2canvas(document.getElementById("boxr"), {
@@ -202,15 +209,6 @@ export default {
this.boxoList.evtParamTm +
"s";
}else {
console.log( this.boxoList.subName,"0000000000000000");
if((this.boxoList.featureAmplitude * 100).toFixed(0)){
this.boxoList.featureAmplitude= (this.boxoList.featureAmplitude * 100).toFixed(0)
}
for(var key in this.boxoList) {
if(this.boxoList[key]==null||!this.boxoList[key]){
this.boxoList[key]='/'
}
}
this.titles =
"变电站名称:" +
this.boxoList.subName +
@@ -219,7 +217,7 @@ export default {
" 发生时刻:" +
this.boxoList.startTime +
" 暂降(骤升)幅值:" +
this.boxoList.featureAmplitude+
(this.boxoList.featureAmplitude * 100).toFixed(0) +
"% 持续时间:" +
this.boxoList.duration +
"s";
@@ -830,11 +828,7 @@ export default {
var newDivRms = $(
` <div style="height:${
this.vh
};overflow: hidden;"><div class='bx' id='${rmsId}' style="zoom:${
this.zoom
};transform:scale(${
1 / this.zoom
});transform-origin:0 0;"></div></div>`
};overflow: hidden;"><div class='bx' id='${rmsId}' ></div></div>`
);
newDivRms.insertAfter($("#rmsp"));
$("#" + rmsId).css("height", picHeight);
@@ -922,7 +916,7 @@ export default {
enabled: true,
itemDistance: 5,
textStyle: {
fontSize: "0.6rem",
fontSize: "0.7rem",
color: _this.DColor ? "#fff" : echartsColor.WordColor,
rich: {
a: {
@@ -1041,7 +1035,7 @@ export default {
},
grid: {
left: "1%",
right: "2.8%",
right: "45px",
bottom: "40px",
top: "15%",
containLabel: true,
@@ -1337,7 +1331,7 @@ export default {
enabled: true,
itemDistance: 5,
textStyle: {
fontSize: "0.6rem",
fontSize: "0.7rem",
color: _this.DColor ? "#fff" : echartsColor.WordColor,
rich: {
a: {
@@ -1459,7 +1453,7 @@ export default {
},
grid: {
left: "1%",
right: "2.8%",
right: "45px",
bottom: "40px",
top: "15%",
containLabel: true,
@@ -1548,6 +1542,6 @@ export default {
temp = temp < tempB ? temp : tempB;
return temp;
},
},
},
};
</script>

View File

@@ -21,6 +21,7 @@
import html2canvas from 'html2canvas'
import $ from 'jquery'
import * as echarts from 'echarts'
import { mainHeight } from '@/utils/layout'
import url from '@/assets/img/point.png'
export default {
@@ -96,7 +97,7 @@ export default {
}
},
mounted() {
console.log(`123123`,this.boxoList,this.wp);
// console.log(`123123`,this.boxoList,this.wp);
this.zoom = 1 / document.body.style.zoom
window.addEventListener('resize', () => {
this.zoom = 1 / document.body.style.zoom
@@ -142,7 +143,6 @@ export default {
},
//根据后台查询的数据,清洗数据
initWaves() {
console.log(this.boxoList.systemType,"this.boxoList.systemType");
if (null != this.wp) {
if (this.boxoList.systemType == 'pms') {
this.titles =
@@ -170,15 +170,21 @@ export default {
' 持续时间:' +
this.boxoList.evtParamTm +
's'
}
else if (this.boxoList.systemType == 'WX') {
this.titles =
// "变电站名称:" +
// this.boxoList.equipmentName +
' 监测点名称:' +
this.boxoList.equipmentName +
' 发生时刻:' +
this.boxoList.startTime +
' 暂降(骤升)幅值:' +
this.boxoList.featureAmplitude==null?'/':this.boxoList.featureAmplitude.toFixed(2) +
' 持续时间:' +
this.boxoList.persistTime==null? '/':this.boxoList.persistTime+
's'
} else {
if((this.boxoList.featureAmplitude * 100).toFixed(0)){
this.boxoList.featureAmplitude= (this.boxoList.featureAmplitude * 100).toFixed(0)
}
for(var key in this.boxoList) {
if(this.boxoList[key]==null||!this.boxoList[key]){
this.boxoList[key]='/'
}
}
this.titles =
'变电站名称:' +
this.boxoList.subName +
@@ -187,7 +193,7 @@ export default {
' 发生时刻:' +
this.boxoList.startTime +
' 暂降(骤升)幅值:' +
this.boxoList.featureAmplitude +
(this.boxoList.featureAmplitude * 100).toFixed(0) +
'% 持续时间:' +
this.boxoList.duration +
's'
@@ -511,9 +517,7 @@ export default {
for (var step = 1; step < waveDatas.length; step++) {
var waveId = 'wave' + step
var newDivShunshi = $(` <div style="height:${this.vh};overflow: hidden;">
<div class='bx1' id='${waveId}' style="zoom:${this.zoom};transform:scale(${
1 / this.zoom
});transform-origin:0 0;">
<div class='bx1' id='${waveId}'>
</div>
</div>`)
newDivShunshi.insertAfter($('#shushi'))
@@ -589,7 +593,7 @@ export default {
},
title: {
left: 'center',
text: '电网侧-电压 ' + title,
text: title,
textStyle: {
fontSize: '0.8rem',
color: _this.DColor ? '#fff' : echartsColor.WordColor

View File

@@ -4,19 +4,9 @@
<el-option v-for="item in timeOptions" :key="item.value" :label="item.label" :value="item.value" />
</el-select>
<el-date-picker
v-model="timeValue"
type="daterange"
:disabled="disabledPicker"
style="width: 220px; margin-right: 10px"
unlink-panels
:clearable="false"
range-separator=""
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="YYYY-MM-DD"
:shortcuts="shortcuts"
/>
<el-date-picker v-model="timeValue" type="daterange" :disabled="disabledPicker"
style="width: 220px; margin-right: 10px" unlink-panels :clearable="false" range-separator=""
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD" :shortcuts="shortcuts" />
<el-button :disabled="backDisabled" type="primary" :icon="DArrowLeft" @click="preClick"></el-button>
<el-button type="primary" :icon="VideoPause" @click="nowTime">当前</el-button>
<el-button :disabled="preDisabled" type="primary" :icon="DArrowRight" @click="next"></el-button>
@@ -43,7 +33,7 @@ const count = ref(0)
const disabledPicker = ref(true)
const timeValue = ref()
const backDisabled = ref(false)
const preDisabled = ref(false)
const preDisabled = ref(true)
const timeOptions: any = ref([
{ label: '年份', value: 1 },
{ label: '季度', value: 2 },
@@ -86,7 +76,7 @@ onMounted(() => {
// 选择时间范围
const timeChange = (e: number) => {
backDisabled.value = false
preDisabled.value = false
preDisabled.value = true
count.value = 0
if (e == 1) {
disabledPicker.value = true
@@ -128,6 +118,7 @@ const nowTime = () => {
}
// 上一个
const preClick = () => {
preDisabled.value = false
let startTime = timeValue.value[0]
let endTime = timeValue.value[1]
let year = parseInt(startTime.substring(0, 4))
@@ -410,6 +401,12 @@ const next = () => {
}
}
if (!props.nextFlag) {
if (new Date(endTime + ' 00:00:00').getTime() >= new Date(window.XEUtils.toDateString(new Date(), 'yyyy-MM-dd ') + ' 00:00:00').getTime()) {
preDisabled.value = true
}
}
timeValue.value = [startTime, endTime]
}

View File

@@ -852,7 +852,7 @@ queryByCode('Device_Type').then(res => {
})
})
const echoName = (value: any, arr: any[]) => {
return value ? arr.find(item => item.value == value).label : '/'
return value ? arr.find(item => item.value == value)?.label : '/'
}
onMounted(() => {})

View File

@@ -150,6 +150,7 @@ defineExpose({ getWpData })
height: 50px;
display: flex;
align-items: center;
justify-content: space-between;
.el-select {
width: 200px !important;

View File

@@ -91,6 +91,7 @@ const tableStore: any = new TableStore({
row.loading = false
if (res != undefined) {
boxoList.value = row
boxoList.value.systemType = 'WX'
wp.value = res.data
view.value = false
view2.value = true
@@ -104,6 +105,18 @@ const tableStore: any = new TableStore({
waveFormAnalysisRef.value && waveFormAnalysisRef.value.getWpData(wp.value, boxoList.value)
})
}
},
{
name: 'edit',
text: '暂无波形',
type: 'info',
icon: 'el-icon-DataLine',
render: 'basicButton',
disabled: row => {
return row.wavePath
},
}
]
}

View File

@@ -56,6 +56,7 @@ import { position } from 'html2canvas/dist/types/css/property-descriptors/positi
import { read, writeFile, utils } from 'xlsx'
import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue'
import { yMethod } from '@/utils/echartMethod'
import TableHeader from '@/components/table/header/index.vue'
import { getTabsDataByType } from '@/api/cs-device-boot/EquipmentDelivery'
import DatePicker from '@/components/form/datePicker/index.vue'
@@ -183,45 +184,49 @@ const init = async () => {
.then((res: any) => {
if (res.code == 'A0000') {
historyDataList.value = res.data
echartsData.value = null
let chartsList = JSON.parse(JSON.stringify(res.data))
echartsData.value = {}
//icon图标替换legend图例
const iconThree =
'path://M512 85.333333c235.637333 0 426.666667 191.029333 426.666667 426.666667S747.637333 938.666667 512 938.666667 85.333333 747.637333 85.333333 512 276.362667 85.333333 512 85.333333z m214.592 318.677334a32 32 0 0 0-45.248 0.064L544.736 541.066667l-81.792-89.109334a32 32 0 0 0-46.613333-0.576l-119.36 123.733334a32 32 0 1 0 46.058666 44.437333l95.754667-99.264 81.418667 88.704a32 32 0 0 0 46.24 0.96l160.213333-160.693333a32 32 0 0 0-0.064-45.248z'
const iconDanger =
'path://M1001.661867 796.544c48.896 84.906667 7.68 157.013333-87.552 157.013333H110.781867c-97.834667 0-139.050667-69.504-90.112-157.013333l401.664-666.88c48.896-87.552 128.725333-87.552 177.664 0l401.664 666.88zM479.165867 296.533333v341.333334a32 32 0 1 0 64 0v-341.333334a32 32 0 1 0-64 0z m0 469.333334v42.666666a32 32 0 1 0 64 0v-42.666666a32 32 0 1 0-64 0z'
let xAxis: any = [],
timeList: any = []
// y轴单位数组
let unitList: any = []
historyDataList.value.map((item: any) => {
timeList.push(item.time)
if (unitList.indexOf(item.unit) == -1) {
unitList.push(item.unit)
let groupedData = chartsList.reduce((acc, item) => {
let key = item.anotherName;
if (!acc[key]) {
acc[key] = [];
}
acc[key].push(item);
return acc;
}, {})
let result = Object.values(groupedData);
if (chartsList.length > 0) {
unitList = result.map((item: any) => {
return item[0].unit
})
xAxis = timeList.sort((a: any, b: any) => {
return new Date(a).getTime() - new Date(b).getTime()
})
}
echartsData.value = {
options: {
title: [
{
left: '10%',
top: 0,
text: chartTitle.value
}
],
toolbox: {
feature: {
// saveAsImage: {
// title: '保存'
// },
// dataView: { readOnly: false },
// }
}
legend: {
itemWidth: 20,
itemHeight: 10,
itemGap: 15,
type: 'scroll', // 开启滚动分页
// orient: 'vertical', // 垂直排列
top: 5,
bottom: 30,
width: 400,
height: 50
},
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'cross',
label: {
color: '#fff',
fontSize: 16
}
},
textStyle: {
color: '#fff',
fontStyle: 'normal',
@@ -230,224 +235,104 @@ const init = async () => {
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0,
axisPointer: {
type: 'cross',
crossStyle: {
color: '#999'
}
formatter(params) {
const xname = params[0].value[0];
let str = `${xname}<br>`;
params.forEach((el, index) => {
str += `${el.marker}${el.seriesName.split('(')[0]}${el.value[1]}${el.value[2]}<br>`;
});
return str;
},
formatter: function (params: any) {
let list = params.filter((item, index, self) => {
return index === self.findIndex(t => t.seriesName === item.seriesName)
})
var res =
'<span style="margin-right:18px;"></span>' +
list[0].value[0] +
list[0].name +
'<br/>'
for (var i = 0, l = list.length; i < l; i++) {
list[i].unit =
echartsData.value.options.yAxis[
echartsData.value.options.series[list[i].seriesIndex].yAxisIndex
]?.name
res +=
list[i].seriesName +
' ' +
`<div style="width:16px;height:16px;float:left;background:${list[i].color};border-radius:50%;margin:0 15px"></div>` +
`<div style='float:right;padding-left:20px;'>${list[i].value[1]==null?'':list[i].value[1].toFixed(2)} ${list[i].unit || ''} </div><br/>`
}
return res
}
},
legend: {
//legend使用iconfont图标
data: [],
itemWidth: 20,
itemHeight: 10,
itemGap: 15,
type: 'scroll', // 开启滚动分页
// orient: 'vertical', // 垂直排列
right: '3%', // 位置调整
top: 0,
bottom: 20,
width: 430,
height: 50
},
},
color: ['#FFCC00', '#009900', '#CC0000', ...color],
xAxis: {
type: 'time',
axisLabel: {
formatter: {
day: '{MM}-{dd}',
month: '{MM}',
year: '{yyyy}',
year: '{yyyy}'
}
}
},
},
yAxis: [{
// [
// {
// type: 'category',
// name: '时间',
// axisLabel: {
// color: '#A9AEB2',
// fontSize: 12,
// show: function (index: any, value: any) {
// // 检查数据中是否存在这个时间点
// // return data.some(item:any => item[0] === value)
// }
// },
// nameTextStyle: {
// right: 0
// },
// data: Array.from(new Set(xAxis)),
// axisLine: {
// lineStyle: {
// color: '#43485E'
// }
// }
// }
// ],
yAxis: [
{
type: 'value',
name: unitList[0],
axisLabel: {
color: '#000',
fontSize: 14
},
splitNumber: 5,
minInterval: 1,
axisTick: {
show: true
},
axisLine: {
show: true,
lineStyle: {
color: colorList[0]
}
},
nameTextStyle: {
color: '#000',
fontSize: '14'
},
splitLine: {
show: false,
lineStyle: {
color: ['#43485E'],
width: 1,
type: 'solid'
}],
options: {
series: [
]
}
}
}
],
series: []
}
}
//处理多y轴
if (unitList.length != 0 && unitList.length > 1) {
// echartsData.value.options.yAxis[0].yAxisIndex = 0
unitList.map((item: any, index: any) => {
if (index != unitList.length - 1) {
echartsData.value.options.yAxis.push({
type: 'value',
if (chartsList.length > 0) {
echartsData.value.yAxis = []
unitList.forEach((item: any, index: any) => {
let right = {
position: 'right',
offset: index * 80, // y轴位置的偏移量
name: unitList[index + 1],
axisLabel: {
color: '#000',
fontSize: 14
},
offset: (index - 1) * 80,
}
echartsData.value.yAxis.push({
name: item,
yAxisIndex: index,
splitNumber: 5,
minInterval: 1,
axisTick: {
show: true
},
axisLine: {
show: true,
lineStyle: {
color: colorList[index + 1]
}
},
nameTextStyle: {
color: '#000',
fontSize: '14'
},
splitLine: {
show: false,
lineStyle: {
color: ['#43485E'],
width: 1,
type: 'solid'
}
}
},
...(index > 0 ? right : null)
})
}
})
result.forEach((item: any, index: any) => {
let yMethodList: any = []
let ABCList = Object.values(item.reduce((acc, item) => {
let key = item.phase;
if (!acc[key]) {
acc[key] = [];
}
acc[key].push(item);
return acc;
}, {}));
ABCList.forEach((kk: any,) => {
let seriesList: any = []
kk.forEach((cc: any) => {
if (cc.statisticalData) {
yMethodList.push(cc.statisticalData?.toFixed(2) - 0)
}
list.map((item: any, index: any) => {
item.map((vv: any, indexs: any) => {
//处理legend
if (historyDataList.value.length != 0) {
echartsData.value.options.legend.data.push({
name: vv.phase + '相' + vv.showName,
icon: iconThree
seriesList.push([cc.time, cc.statisticalData?.toFixed(2),cc.unit])
})
}
if (
unitList.findIndex((item: any) => {
return item == vv.unit
}) != -1
) {
vv.yAxisIndex = unitList.findIndex((item: any) => {
return item == vv.unit
})
} else {
vv.yAxisIndex = 0
}
//series数据
echartsData.value.options.series.push({
name: vv.phase + '相' + vv.showName,
name: kk[0].phase + '相' + item[0].anotherName,
type: 'line',
smooth: true,
symbol: 'none',
emphasis: {
focus: 'series'
},
itemStyle: {},
//数据
data: historyDataList.value
.map((kk: any) => {
if (kk.statisticalName == vv.name) {
data: seriesList,
yAxisIndex: index
return [kk.time, kk.statisticalData]
} else {
return ''
})
})
let [min, max] = yMethod(yMethodList)
echartsData.value.yAxis[index].min = min
echartsData.value.yAxis[index].max = max
})
}
})
.filter((kk: any) => kk !== ''),
//数据对应的y轴
// yAxisIndex:0,
yAxisIndex: vv.yAxisIndex
})
})
})
//设置数据项颜色
echartsData.value.options.series.map((item: any, index: any) => {
item.itemStyle = {
normal: {
color: colorList[index],
lineStyle: {
color: colorList[index]
}
}
}
})
loading.value = false
}
})

View File

@@ -424,7 +424,15 @@ const init = (flag: boolean) => {
fontSize: 14
},
backgroundColor: 'rgba(0,0,0,0.35)',
borderWidth: 0
borderWidth: 0,
formatter(params) {
const xname = params[0].value[0];
let str = `${xname}<br>`;
params.forEach((el, index) => {
str += `${el.marker}${el.seriesName.split('(')[0]}${el.value[1]}${el.value[2]}<br>`;
});
return str;
},
},
color: ['#FFCC00', '#009900', '#CC0000', ...color],
xAxis: {
@@ -448,7 +456,7 @@ const init = (flag: boolean) => {
}
}
if (chartsList.length > 0) {
echartsData.value.yAxis=[]
echartsData.value.yAxis = []
unitList.forEach((item: any, index: any) => {
let right = {
position: 'right',
@@ -457,6 +465,8 @@ const init = (flag: boolean) => {
echartsData.value.yAxis.push({
name: item,
yAxisIndex: index,
splitNumber: 5,
minInterval: 1,
splitLine: {
show: false,
@@ -484,7 +494,7 @@ const init = (flag: boolean) => {
}
seriesList.push([cc.time, cc.statisticalData?.toFixed(2)])
seriesList.push([cc.time, cc.statisticalData?.toFixed(2),cc.unit])
})

View File

@@ -26,7 +26,11 @@ const tableStore = new TableStore({
column: [
{ title: '设备名称', field: 'devName', align: 'center' },
{ title: '操作用户', field: 'operatorName', align: 'center' },
{ title: '操作内容', field: 'processName', align: 'center', width: '300' },
{
title: '操作内容', field: 'process', align: 'center', formatter: (row: any) => {
return row.cellValue == 1 ? '设备登记' : row.cellValue == 2 ? '功能调试' : row.cellValue == 3 ? '出厂调试' : row.cellValue == 4 ? '设备投运' : ''
}
},
{ title: '开始时间', field: 'startTime', align: 'center' },
{ title: '结束时间', field: 'endTime', align: 'center' }
],
@@ -52,5 +56,5 @@ onMounted(() => {
tableStore.index()
})
const addMenu = () => {}
const addMenu = () => { }
</script>