修改页面样式
This commit is contained in:
@@ -29,58 +29,67 @@
|
||||
</el-col>
|
||||
<el-col :span="13">
|
||||
<el-card>
|
||||
<div class="tall">
|
||||
<h3 class="mb10">暂降列表</h3>
|
||||
<div class="tall1">
|
||||
<vxe-table
|
||||
height="auto"
|
||||
auto-resize
|
||||
:data="distributionData"
|
||||
v-loading="loading"
|
||||
v-bind="defaultAttribute"
|
||||
>
|
||||
<vxe-column
|
||||
field="newStationName"
|
||||
title="新能源站名称"
|
||||
min-width="150px"
|
||||
show-overflow-tooltip
|
||||
></vxe-column>
|
||||
<vxe-column field="startTime" title="暂降发生时刻" min-width="150px"></vxe-column>
|
||||
<vxe-column
|
||||
field="featureAmplitude"
|
||||
title="暂降(骤升)幅值(%)"
|
||||
sortable
|
||||
min-width="150px"
|
||||
></vxe-column>
|
||||
<vxe-column
|
||||
field="advanceReason"
|
||||
title="暂降原因"
|
||||
sortable
|
||||
:formatter="formFilter"
|
||||
min-width="100px"
|
||||
></vxe-column>
|
||||
<vxe-column field="severity" title="严重度" min-width="100px" sortable></vxe-column>
|
||||
<vxe-column title="操作" width="80px">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
type="primary"
|
||||
v-if="row.wavePath != null"
|
||||
size="small"
|
||||
link
|
||||
@click="boxi(row)"
|
||||
>
|
||||
查看波形
|
||||
</el-button>
|
||||
<el-button v-else disabled size="small" link>暂无波形</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>暂降列表</span>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<!-- <h3 class="mb10">暂降列表</h3> -->
|
||||
<div class="tall1">
|
||||
<vxe-table
|
||||
height="auto"
|
||||
auto-resize
|
||||
:data="distributionData"
|
||||
v-loading="loading"
|
||||
v-bind="defaultAttribute"
|
||||
>
|
||||
<vxe-column
|
||||
field="newStationName"
|
||||
title="新能源站名称"
|
||||
min-width="150px"
|
||||
show-overflow-tooltip
|
||||
></vxe-column>
|
||||
<vxe-column field="startTime" title="暂降发生时刻" min-width="150px"></vxe-column>
|
||||
<vxe-column
|
||||
field="featureAmplitude"
|
||||
title="暂降(骤升)幅值(%)"
|
||||
sortable
|
||||
min-width="150px"
|
||||
></vxe-column>
|
||||
<vxe-column
|
||||
field="advanceReason"
|
||||
title="暂降原因"
|
||||
sortable
|
||||
:formatter="formFilter"
|
||||
min-width="100px"
|
||||
></vxe-column>
|
||||
<vxe-column field="severity" title="严重度" min-width="100px" sortable></vxe-column>
|
||||
<vxe-column title="操作" width="80px">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
type="primary"
|
||||
v-if="row.wavePath != null"
|
||||
size="small"
|
||||
link
|
||||
@click="boxi(row)"
|
||||
>
|
||||
查看波形
|
||||
</el-button>
|
||||
<el-button v-else disabled size="small" link>暂无波形</el-button>
|
||||
</template>
|
||||
</vxe-column>
|
||||
</vxe-table>
|
||||
</div>
|
||||
</el-card>
|
||||
<el-card class="mt10">
|
||||
<template #header>
|
||||
<div class="card-header">
|
||||
<span>暂降波形</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="tall" v-loading="loading1">
|
||||
<h3 class="mb10">暂降波形</h3>
|
||||
<!-- <h3 class="mb10">暂降波形</h3> -->
|
||||
<div v-if="wp != null">
|
||||
<rmsboxi :value="1" :height="height" :boxoList="boxoList" :wp="wp" />
|
||||
</div>
|
||||
@@ -295,13 +304,16 @@ const clickMap = (e: any) => {
|
||||
}
|
||||
// 表格数据处理
|
||||
const tabulation = (e: any) => {
|
||||
console.log();
|
||||
|
||||
console.log()
|
||||
|
||||
loading.value = true
|
||||
voltageRideThroughEventQueryPage({
|
||||
...tableStore.table.params,
|
||||
areaId: e.data.id,
|
||||
frequencyType: e.seriesName == '高压' ? triggerType.filter(item => item.code == 'Voltage_Rise')[0].id : triggerType.filter(item => item.code == 'Voltage_Dip')[0].id
|
||||
frequencyType:
|
||||
e.seriesName == '高压'
|
||||
? triggerType.filter(item => item.code == 'Voltage_Rise')[0].id
|
||||
: triggerType.filter(item => item.code == 'Voltage_Dip')[0].id
|
||||
})
|
||||
.then(res => {
|
||||
distributionData.value = res.data
|
||||
@@ -377,10 +389,10 @@ const layout1 = mainHeight(93) as any
|
||||
height: calc(v-bind('layout1.height') - 30px);
|
||||
}
|
||||
.tall {
|
||||
height: calc((v-bind('layout1.height') - 60px) / 2);
|
||||
height: calc((v-bind('layout1.height') - 100px) / 2);
|
||||
}
|
||||
.tall1 {
|
||||
height: calc((v-bind('layout1.height') - 60px) / 2 - 35px);
|
||||
height: calc((v-bind('layout1.height') - 100px) / 2 - 50px);
|
||||
}
|
||||
|
||||
.group {
|
||||
|
||||
@@ -88,11 +88,7 @@
|
||||
<el-link
|
||||
:type="row.vtimes == '1' ? 'danger' : 'success'"
|
||||
:class="row.vtimes == '1' ? 'percentage' : ''"
|
||||
@click="
|
||||
row.vtimes == '1'
|
||||
? detailClick(row, '谐波电压(%)', '2')
|
||||
: ''
|
||||
"
|
||||
@click="row.vtimes == '1' ? detailClick(row, '谐波电压(%)', '2') : ''"
|
||||
>
|
||||
{{ row.vtimes == '1' ? '越限' : '合格' }}
|
||||
</el-link>
|
||||
@@ -103,11 +99,7 @@
|
||||
<el-link
|
||||
:type="row.itimes == '1' ? 'danger' : 'success'"
|
||||
:class="row.itimes == '1' ? 'percentage' : ''"
|
||||
@click="
|
||||
row.itimes == '1'
|
||||
? detailClick(row, '谐波电流(A)', '3')
|
||||
: ''
|
||||
"
|
||||
@click="row.itimes == '1' ? detailClick(row, '谐波电流(A)', '3') : ''"
|
||||
>
|
||||
{{ row.itimes == '1' ? '越限' : '合格' }}
|
||||
</el-link>
|
||||
@@ -148,11 +140,7 @@
|
||||
<el-link
|
||||
:type="row.flicker == '1' ? 'danger' : 'success'"
|
||||
:class="row.flicker == '1' ? 'percentage' : ''"
|
||||
@click="
|
||||
row.flicker == '1'
|
||||
? detailClick(row, '长时闪变', 'plt')
|
||||
: ''
|
||||
"
|
||||
@click="row.flicker == '1' ? detailClick(row, '长时闪变', 'plt') : ''"
|
||||
>
|
||||
{{ row.flicker == '1' ? '越限' : '合格' }}
|
||||
</el-link>
|
||||
@@ -184,11 +172,7 @@
|
||||
:class="row.sequenceCurrentUnbalance == '1' ? 'percentage' : ''"
|
||||
@click="
|
||||
row.sequenceCurrentUnbalance == '1'
|
||||
? detailClick(
|
||||
row,
|
||||
'电流不平衡度(%)',
|
||||
'iNeg'
|
||||
)
|
||||
? detailClick(row, '电流不平衡度(%)', 'iNeg')
|
||||
: ''
|
||||
"
|
||||
>
|
||||
@@ -509,35 +493,35 @@ const tableStore = new TableStore({
|
||||
{
|
||||
label: '0%~10%',
|
||||
quantity: res.minsNum0,
|
||||
percentage: res.proportion0 + '%',
|
||||
percentage: res.proportion0.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot0,
|
||||
value: '0%~10%'
|
||||
},
|
||||
{
|
||||
label: '10%~20%',
|
||||
quantity: res.minsNum1,
|
||||
percentage: res.proportion1 + '%',
|
||||
percentage: res.proportion1.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot1,
|
||||
value: '10%~10%'
|
||||
},
|
||||
{
|
||||
label: '20%~30%',
|
||||
quantity: res.minsNum2,
|
||||
percentage: res.proportion2 + '%',
|
||||
percentage: res.proportion2.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot2,
|
||||
value: '10%~30%'
|
||||
},
|
||||
{
|
||||
label: '30%~40%',
|
||||
quantity: res.minsNum3,
|
||||
percentage: res.proportion3 + '%',
|
||||
percentage: res.proportion3.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot3,
|
||||
value: '30%~40%'
|
||||
},
|
||||
{
|
||||
label: '40%~50%',
|
||||
quantity: res.minsNum4,
|
||||
percentage: res.proportion4 + '%',
|
||||
percentage: res.proportion4.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot4,
|
||||
value: '40%~50%'
|
||||
}
|
||||
@@ -546,35 +530,35 @@ const tableStore = new TableStore({
|
||||
{
|
||||
label: '50%~60%',
|
||||
quantity: res.minsNum5,
|
||||
percentage: res.proportion5 + '%',
|
||||
percentage: res.proportion5.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot5,
|
||||
value: '50%~60%'
|
||||
},
|
||||
{
|
||||
label: '60%~70%',
|
||||
quantity: res.minsNum6,
|
||||
percentage: res.proportion6 + '%',
|
||||
percentage: res.proportion6.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot6,
|
||||
value: '60%~70%'
|
||||
},
|
||||
{
|
||||
label: '70%~80%',
|
||||
quantity: res.minsNum7,
|
||||
percentage: res.proportion7 + '%',
|
||||
percentage: res.proportion7.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot7,
|
||||
value: '70%~80%'
|
||||
},
|
||||
{
|
||||
label: '80%~90%',
|
||||
quantity: res.minsNum8,
|
||||
percentage: res.proportion8 + '%',
|
||||
percentage: res.proportion8.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot8,
|
||||
value: '80%~90%'
|
||||
},
|
||||
{
|
||||
label: '90%~100%',
|
||||
quantity: res.minsNum9,
|
||||
percentage: res.proportion9 + '%',
|
||||
percentage: res.proportion9.toFixed(2) + '%',
|
||||
crossTheLine: res.isOrNot9,
|
||||
value: '90%~100%'
|
||||
}
|
||||
@@ -605,7 +589,7 @@ const tableStore = new TableStore({
|
||||
lineHeight: 8,
|
||||
minMargin: 10,
|
||||
formatter: function (e) {
|
||||
return '{name|' + e.name + '}{percent|' + e.data.percentage + '}'
|
||||
return '{name|' + e.name + '}{percent|' + e.data.percentage+ '}'
|
||||
},
|
||||
rich: {
|
||||
name: {
|
||||
@@ -753,12 +737,11 @@ const timeClick = (row: any) => {
|
||||
}
|
||||
// 点击越限
|
||||
const detailClick = (row: any, title: string, key: string) => {
|
||||
|
||||
detailRef.value.open({
|
||||
row: row,
|
||||
title: title,
|
||||
field: index.value,
|
||||
lineId: dotList.value.id ,
|
||||
lineId: dotList.value.id,
|
||||
key: key
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user