|
@@ -1,7 +1,9 @@
|
|
<template>
|
|
<template>
|
|
<div class="dataAnalysisLineAna" :class="!theme ? 'themeDark' : 'themeLight'">
|
|
<div class="dataAnalysisLineAna" :class="!theme ? 'themeDark' : 'themeLight'">
|
|
<div class="dataAnalysisLineAnaMain">
|
|
<div class="dataAnalysisLineAnaMain">
|
|
- <p>曲线偏差率分析</p>
|
|
|
|
|
|
+ <div class="main_top">
|
|
|
|
+ <p class="topPsty">曲线偏差率分析</p>
|
|
|
|
+ </div>
|
|
<div class="main">
|
|
<div class="main">
|
|
<div class="treeDataMain">
|
|
<div class="treeDataMain">
|
|
<tree-cop ref="treeCopRef" :data="treeData" @checkChange="funTreeCheckChange" :show-checkbox="true"
|
|
<tree-cop ref="treeCopRef" :data="treeData" @checkChange="funTreeCheckChange" :show-checkbox="true"
|
|
@@ -9,7 +11,8 @@
|
|
</div>
|
|
</div>
|
|
<div class="excelDataMain">
|
|
<div class="excelDataMain">
|
|
<excel-cop :checkIds="excelCheckIds" :showCheckbox="excelCheckboxShow" :data="excelList"
|
|
<excel-cop :checkIds="excelCheckIds" :showCheckbox="excelCheckboxShow" :data="excelList"
|
|
- :height="excelHeight" @excelChange="funExcelChange" @checkChange="funExcelCheckChange">
|
|
|
|
|
|
+ :theme="theme" :height="excelHeight" @excelChange="funExcelChange"
|
|
|
|
+ @checkChange="funExcelCheckChange">
|
|
</excel-cop>
|
|
</excel-cop>
|
|
</div>
|
|
</div>
|
|
<div class="tableDataMain">
|
|
<div class="tableDataMain">
|
|
@@ -97,9 +100,9 @@
|
|
// import tableRes from '@/data/table.json'
|
|
// import tableRes from '@/data/table.json'
|
|
// import areaDataRes from '@/data/areaData.json'
|
|
// import areaDataRes from '@/data/areaData.json'
|
|
/**配置参数 */
|
|
/**配置参数 */
|
|
- const treeHeight = ref(window.innerHeight - 190 + 'px') //tree高度
|
|
|
|
- const excelHeight = ref(window.innerHeight - 190 + 'px') //excel高度
|
|
|
|
- const tableHeight = ref(window.innerHeight - 190 + 'px')
|
|
|
|
|
|
+ const treeHeight = ref(window.innerHeight - 150 + 'px') //tree高度
|
|
|
|
+ const excelHeight = ref(window.innerHeight - 150 + 'px') //excel高度
|
|
|
|
+ const tableHeight = ref(window.innerHeight - 150 + 'px')
|
|
/**excel 开始 */
|
|
/**excel 开始 */
|
|
const excelCheckboxShow = ref(false)
|
|
const excelCheckboxShow = ref(false)
|
|
const excelCheckIds = ref([])
|
|
const excelCheckIds = ref([])
|
|
@@ -233,7 +236,8 @@
|
|
if (res.data.sjgl.length) {
|
|
if (res.data.sjgl.length) {
|
|
for (const wtObj of res.data.sjgl) {
|
|
for (const wtObj of res.data.sjgl) {
|
|
seriesData.value.push({
|
|
seriesData.value.push({
|
|
- name: wtObj.obj.windturbineId + "\n实际功率",
|
|
|
|
|
|
+ // name: wtObj.obj.windturbineId + "\n实际功率",
|
|
|
|
+ name: wtObj.obj.code + "\n实际功率",
|
|
type: "line",
|
|
type: "line",
|
|
symbol: "line", //设定为实心点
|
|
symbol: "line", //设定为实心点
|
|
symbolSize: 0, //设定实心点的大小
|
|
symbolSize: 0, //设定实心点的大小
|
|
@@ -647,13 +651,13 @@
|
|
funGetTree()
|
|
funGetTree()
|
|
theme.value = store.state.theme
|
|
theme.value = store.state.theme
|
|
echartsTheme.value = !theme.value ? 'dark' : ''
|
|
echartsTheme.value = !theme.value ? 'dark' : ''
|
|
- tableHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
- excelHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
- treeHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
|
|
+ tableHeight.value = window.innerHeight - 150 + 'px'
|
|
|
|
+ excelHeight.value = window.innerHeight - 150 + 'px'
|
|
|
|
+ treeHeight.value = window.innerHeight - 150 + 'px'
|
|
window.addEventListener('resize', () => {
|
|
window.addEventListener('resize', () => {
|
|
- tableHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
- excelHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
- treeHeight.value = window.innerHeight - 190 + 'px'
|
|
|
|
|
|
+ tableHeight.value = window.innerHeight - 150 + 'px'
|
|
|
|
+ excelHeight.value = window.innerHeight - 150 + 'px'
|
|
|
|
+ treeHeight.value = window.innerHeight - 150 + 'px'
|
|
})
|
|
})
|
|
/**test */
|
|
/**test */
|
|
// funExcelChange({
|
|
// funExcelChange({
|
|
@@ -670,60 +674,94 @@
|
|
|
|
|
|
<style lang="less" scoped>
|
|
<style lang="less" scoped>
|
|
.dataAnalysisLineAna {
|
|
.dataAnalysisLineAna {
|
|
- padding: 20px;
|
|
|
|
|
|
+ height: 100%;
|
|
|
|
|
|
- p {
|
|
|
|
- font-size: 16px;
|
|
|
|
- margin-bottom: 10px;
|
|
|
|
- margin-left: 20px;
|
|
|
|
- }
|
|
|
|
|
|
+ .dataAnalysisLineAnaMain {
|
|
|
|
+ height: 100%;
|
|
|
|
|
|
- .main {
|
|
|
|
- display: flex;
|
|
|
|
- justify-content: space-between;
|
|
|
|
- // width: calc(100% - 40px);
|
|
|
|
- width: 100%;
|
|
|
|
-
|
|
|
|
- .treeDataMain,
|
|
|
|
- .excelDataMain,
|
|
|
|
- .tableDataMain {
|
|
|
|
- padding: 10px;
|
|
|
|
- border-radius: 10px;
|
|
|
|
|
|
+ .main_top {
|
|
|
|
+ height: 40px;
|
|
|
|
+ display: flex;
|
|
|
|
+ align-items: center;
|
|
|
|
+
|
|
|
|
+ .topPsty {
|
|
|
|
+ position: relative;
|
|
|
|
+ top: 5px;
|
|
|
|
+ padding: 7px 20px;
|
|
|
|
+ font-size: 12px;
|
|
|
|
+ font-weight: 600;
|
|
|
|
+ margin-left: 10px;
|
|
|
|
+ border-radius: 3px;
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
- .treeDataMain {
|
|
|
|
- width: calc(20% - 20px);
|
|
|
|
|
|
+ .main {
|
|
|
|
+ display: flex;
|
|
|
|
+ justify-content: space-between;
|
|
|
|
+ // width: calc(100% - 40px);
|
|
|
|
+ width: 100%;
|
|
|
|
|
|
- }
|
|
|
|
|
|
+ .treeDataMain,
|
|
|
|
+ .excelDataMain,
|
|
|
|
+ .tableDataMain {
|
|
|
|
+ padding: 10px;
|
|
|
|
+ border-radius: 10px;
|
|
|
|
+ }
|
|
|
|
|
|
- .excelDataMain {
|
|
|
|
- width: calc(13% - 20px);
|
|
|
|
- }
|
|
|
|
|
|
+ .treeDataMain {
|
|
|
|
+ width: calc(20% - 20px);
|
|
|
|
|
|
- .tableDataMain {
|
|
|
|
- width: calc(66% - 20px);
|
|
|
|
- position: relative;
|
|
|
|
|
|
+ }
|
|
|
|
|
|
- .butten_com {
|
|
|
|
- position: absolute;
|
|
|
|
- right: 20px;
|
|
|
|
- z-index: 111111;
|
|
|
|
|
|
+ .excelDataMain {
|
|
|
|
+ width: calc(13% - 20px);
|
|
}
|
|
}
|
|
- }
|
|
|
|
|
|
|
|
|
|
+ .tableDataMain {
|
|
|
|
+ width: calc(66% - 20px);
|
|
|
|
+ position: relative;
|
|
|
|
+
|
|
|
|
+ .butten_com {
|
|
|
|
+ position: absolute;
|
|
|
|
+ right: 20px;
|
|
|
|
+ z-index: 111111;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
+
|
|
|
|
+
|
|
}
|
|
}
|
|
|
|
|
|
.themeDark {
|
|
.themeDark {
|
|
|
|
|
|
- p {
|
|
|
|
- color: #fff;
|
|
|
|
- }
|
|
|
|
|
|
+ .dataAnalysisLineAnaMain {
|
|
|
|
+ .main_top {
|
|
|
|
+
|
|
|
|
+ .topPsty {
|
|
|
|
+ color: #1C99FF;
|
|
|
|
+ background: #1E2126;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .main {
|
|
|
|
+ background: #13171e;
|
|
|
|
+
|
|
|
|
+ .treeDataMain {
|
|
|
|
+ background: transparent;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .excelDataMain {
|
|
|
|
+ background: #313233;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .tableDataMain {
|
|
|
|
+ margin-top: 5px;
|
|
|
|
+ background: #212223;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
|
|
- .treeDataMain,
|
|
|
|
- .excelDataMain,
|
|
|
|
- .tableDataMain {
|
|
|
|
- background: #161f1e;
|
|
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|
|
@@ -731,20 +769,31 @@
|
|
.themeLight {
|
|
.themeLight {
|
|
padding: 0;
|
|
padding: 0;
|
|
|
|
|
|
- p {
|
|
|
|
- color: #000;
|
|
|
|
- }
|
|
|
|
|
|
+ .dataAnalysisLineAnaMain {
|
|
|
|
+ .main_top {
|
|
|
|
|
|
- .treeDataMain,
|
|
|
|
- .excelDataMain,
|
|
|
|
- .tableDataMain {
|
|
|
|
- background: #edeffb;
|
|
|
|
- }
|
|
|
|
|
|
+ .topPsty {
|
|
|
|
+ color: #2778FF;
|
|
|
|
+ background: #FFFFFF;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
|
|
- .dataAnalysisLineAnaMain {
|
|
|
|
- padding: 20px 0;
|
|
|
|
- border-radius: 10px;
|
|
|
|
- background: #fff;
|
|
|
|
|
|
+ .main {
|
|
|
|
+ background: #E6E8F2;
|
|
|
|
+
|
|
|
|
+ .treeDataMain {
|
|
|
|
+ background: transparent;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .excelDataMain {
|
|
|
|
+ background: #F4F6FB;
|
|
|
|
+ }
|
|
|
|
+
|
|
|
|
+ .tableDataMain {
|
|
|
|
+ background: #fff;
|
|
|
|
+ margin-top: 5px;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
|
|
|
|
}
|
|
}
|