|
|
@@ -1,115 +1,60 @@
|
|
|
<template>
|
|
|
- <div class="dataAnalysisAgcAna" :class="!theme ? 'themeDark' : 'themeLight'">
|
|
|
- <div class="dataAnalysisAgcAnaMain">
|
|
|
- <div class="main_top">
|
|
|
- <p class="topPsty">AGC曲线偏差分析</p>
|
|
|
- <search-cop @submit="funSubmit"> </search-cop>
|
|
|
- </div>
|
|
|
- <div class="main">
|
|
|
- <div class="tableDataMain">
|
|
|
- <el-tabs v-model="activeTab" style="width: 100%">
|
|
|
- <el-tab-pane label="图表展示" name="2">
|
|
|
- <div
|
|
|
- :style="{
|
|
|
+ <div class="dataAnalysisAgcAna" :class="!theme ? 'themeDark' : 'themeLight'">
|
|
|
+ <div class="dataAnalysisAgcAnaMain">
|
|
|
+ <div class="main_top">
|
|
|
+ <p class="topPsty">AGC曲线偏差分析</p>
|
|
|
+ <search-cop @submit="funSubmit"> </search-cop>
|
|
|
+ </div>
|
|
|
+ <div class="main">
|
|
|
+ <div class="tableDataMain">
|
|
|
+ <el-tabs v-model="activeTab" style="width: 100%">
|
|
|
+ <el-tab-pane label="图表展示" name="2">
|
|
|
+ <div :style="{
|
|
|
height:
|
|
|
typeof tableHeight === 'string'
|
|
|
? 'calc(' + tableHeight + ' + ' + paginationHeight + 'px)'
|
|
|
: tableHeight + paginationHeight + 'px',
|
|
|
width: '100%',
|
|
|
- }"
|
|
|
- class="p-[10px]"
|
|
|
- >
|
|
|
- <CurrentScatterChart
|
|
|
- ref="chartRef"
|
|
|
- :width="tableWidth"
|
|
|
- :height="`calc( ${tableHeight} + ${paginationHeight}px - 20px)`"
|
|
|
- :chartTitle="''"
|
|
|
- :xAxisData="xAxisData"
|
|
|
- :yAxisData="{ splitLine: { show: false } }"
|
|
|
- :seriesData="seriesData"
|
|
|
- :showLegend="true"
|
|
|
- :brushSelected="false"
|
|
|
- :dataSet="dataSet"
|
|
|
- @getSelected="funChartSelect"
|
|
|
- />
|
|
|
- </div>
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane
|
|
|
- :label="`表格数据${
|
|
|
+ }" class="p-[10px]">
|
|
|
+ <CurrentScatterChart ref="chartRef" :width="tableWidth"
|
|
|
+ :height="`calc( ${tableHeight} + ${paginationHeight}px - 20px)`" :chartTitle="''"
|
|
|
+ :xAxisData="xAxisData" :yAxisData="{ splitLine: { show: false } }"
|
|
|
+ :seriesData="seriesData" :showLegend="true" :brushSelected="false"
|
|
|
+ :dataSet="dataSet" @getSelected="funChartSelect" />
|
|
|
+ </div>
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane :label="`表格数据${
|
|
|
tableData?.length ? ' (' + tableData.length + '个)' : ''
|
|
|
- }`"
|
|
|
- name="1"
|
|
|
- >
|
|
|
- <table-cop
|
|
|
- :data="tableData"
|
|
|
- :loading="tableLoading"
|
|
|
- :column="tableColumn"
|
|
|
- :height="tableHeight"
|
|
|
- :tableId="tableShowId"
|
|
|
- :tableName="tableName"
|
|
|
- fromTableId="7"
|
|
|
- :showHj="false"
|
|
|
- style="position: relative; top: -10px"
|
|
|
- >
|
|
|
- </table-cop>
|
|
|
- <el-pagination layout="prev, pager, next" :total="50" />
|
|
|
- </el-tab-pane>
|
|
|
- <el-tab-pane
|
|
|
- :label="`超限测点 (${abnormalPoint.length}个)`"
|
|
|
- name="3"
|
|
|
- >
|
|
|
- <el-table
|
|
|
- :data="abnormalPoint"
|
|
|
- style="width: 100%"
|
|
|
- :max-height="tableHeight"
|
|
|
- >
|
|
|
- <el-table-column
|
|
|
- prop="date"
|
|
|
- label="时间"
|
|
|
- width="180"
|
|
|
- align="center"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- filter-class-name="currentFilter"
|
|
|
- prop="name"
|
|
|
- label="超限原因 (点击定位至图表位置)"
|
|
|
- width="400"
|
|
|
- align="center"
|
|
|
- :filters="[
|
|
|
+ }`" name="1">
|
|
|
+ <table-cop :data="tableData" :loading="tableLoading" :column="tableColumn"
|
|
|
+ :height="tableHeight" :tableId="tableShowId" :tableName="tableName" fromTableId="7"
|
|
|
+ :showHj="false" style="position: relative; top: -10px">
|
|
|
+ </table-cop>
|
|
|
+ <el-pagination layout="prev, pager, next" :total="50" />
|
|
|
+ </el-tab-pane>
|
|
|
+ <el-tab-pane :label="`超限测点 (${abnormalPoint.length}个)`" name="3">
|
|
|
+ <el-table :data="abnormalPoint" style="width: 100%" :max-height="tableHeight">
|
|
|
+ <el-table-column prop="date" label="时间" width="180" align="center" />
|
|
|
+ <el-table-column filter-class-name="currentFilter" prop="name" label="超限原因 (点击定位至图表位置)"
|
|
|
+ width="400" align="center" :filters="[
|
|
|
{ text: '低于下限', value: '低于下限' },
|
|
|
{ text: '高于上限', value: '高于上限' },
|
|
|
- ]"
|
|
|
- :filter-method="tableFilterMethod"
|
|
|
- >
|
|
|
- <template #default="scoped">
|
|
|
- <p style="cursor: pointer" @click="createMark(scoped.row)">
|
|
|
- <span
|
|
|
- :style="`color:${scoped.row.color}; margin-right: 8px;`"
|
|
|
- >
|
|
|
- {{ scoped.row.res }}
|
|
|
- </span>
|
|
|
- <el-icon
|
|
|
- ><component
|
|
|
- :is="scoped.row.icon"
|
|
|
- :color="scoped.row.color"
|
|
|
- /></el-icon>
|
|
|
- </p>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="value"
|
|
|
- label="测点值"
|
|
|
- width="180"
|
|
|
- align="center"
|
|
|
- />
|
|
|
- <el-table-column
|
|
|
- prop="jud"
|
|
|
- label="限值"
|
|
|
- width="180"
|
|
|
- align="center"
|
|
|
- />
|
|
|
- </el-table>
|
|
|
- <!-- <el-pagination
|
|
|
+ ]" :filter-method="tableFilterMethod">
|
|
|
+ <template #default="scoped">
|
|
|
+ <p style="cursor: pointer" @click="createMark(scoped.row)">
|
|
|
+ <span :style="`color:${scoped.row.color}; margin-right: 8px;`">
|
|
|
+ {{ scoped.row.res }}
|
|
|
+ </span>
|
|
|
+ <el-icon>
|
|
|
+ <component :is="scoped.row.icon" :color="scoped.row.color" />
|
|
|
+ </el-icon>
|
|
|
+ </p>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column prop="value" label="测点值" width="180" align="center" />
|
|
|
+ <el-table-column prop="jud" label="限值" width="180" align="center" />
|
|
|
+ </el-table>
|
|
|
+ <!-- <el-pagination
|
|
|
layout="total, sizes, prev, pager, next, jumper"
|
|
|
v-model:current-page="paginationCurrentPage"
|
|
|
v-model:page-size="paginationPageSize"
|
|
|
@@ -118,713 +63,726 @@
|
|
|
@size-change="paginationSizeChange"
|
|
|
@current-change="paginationCurrentChange"
|
|
|
/> -->
|
|
|
- </el-tab-pane>
|
|
|
- </el-tabs>
|
|
|
+ </el-tab-pane>
|
|
|
+ </el-tabs>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
</template>
|
|
|
<script setup name="prepare">
|
|
|
-import searchCop from "./components/search.vue";
|
|
|
-import tableCop from "@/components/generatingCapacityComponent/table.vue";
|
|
|
-import { ElMessage } from "element-plus";
|
|
|
-import { onMounted, ref, onActivated, watch } from "vue";
|
|
|
-import { useStore } from "vuex";
|
|
|
-import CurrentScatterChart from "./components/current-scatter-chart.vue";
|
|
|
-import httpRequest from "@/utils/request.js";
|
|
|
-import dayjs from "dayjs";
|
|
|
-import agcJson from "./agcJson.json";
|
|
|
-import * as echarts from "echarts";
|
|
|
-import jsonData from "./components/data.json";
|
|
|
+ import searchCop from "./components/search.vue";
|
|
|
+ import tableCop from "@/components/generatingCapacityComponent/table.vue";
|
|
|
+ import {
|
|
|
+ ElMessage
|
|
|
+ } from "element-plus";
|
|
|
+ import {
|
|
|
+ onMounted,
|
|
|
+ ref,
|
|
|
+ onActivated,
|
|
|
+ watch
|
|
|
+ } from "vue";
|
|
|
+ import {
|
|
|
+ useStore
|
|
|
+ } from "vuex";
|
|
|
+ import CurrentScatterChart from "./components/current-scatter-chart.vue";
|
|
|
+ import httpRequest from "@/utils/request.js";
|
|
|
+ import dayjs from "dayjs";
|
|
|
+ import agcJson from "./agcJson.json";
|
|
|
+ import * as echarts from "echarts";
|
|
|
+ import jsonData from "./components/data.json";
|
|
|
|
|
|
-const tableDataSource = ref([]);
|
|
|
-const paginationCurrentPage = ref(1);
|
|
|
-const paginationPageSize = ref(100);
|
|
|
-const paginationTotal = ref(0);
|
|
|
+ const tableDataSource = ref([]);
|
|
|
+ const paginationCurrentPage = ref(1);
|
|
|
+ const paginationPageSize = ref(100);
|
|
|
+ const paginationTotal = ref(0);
|
|
|
|
|
|
-const paginationSizeChange = (size) => {};
|
|
|
+ const paginationSizeChange = (size) => {};
|
|
|
|
|
|
-const paginationCurrentChange = (page) => {};
|
|
|
+ const paginationCurrentChange = (page) => {};
|
|
|
|
|
|
-const tableFilterMethod = (value, row) => {
|
|
|
- return row.res === value;
|
|
|
-};
|
|
|
-
|
|
|
-/**配置参数 */
|
|
|
-const paginationHeight = ref(10);
|
|
|
-const tableWidth = ref(window.innerWidth - 200 + "px");
|
|
|
-const tableHeight = ref(
|
|
|
- window.innerHeight - 170 - paginationHeight.value + "px"
|
|
|
-);
|
|
|
-const treeHeight = ref(window.innerHeight - 170 + "px"); //tree高度
|
|
|
-const excelHeight = ref(window.innerHeight - 170 + "px"); //excel高度
|
|
|
-/**excel 开始 */
|
|
|
-const excelList = ref([]);
|
|
|
-const funExcelChange = async (obj) => {
|
|
|
- //点击excel项时
|
|
|
- activeTab.value = "1";
|
|
|
- tableShowId.value = obj.id;
|
|
|
- tableName.value = obj.name;
|
|
|
- tableLoading.value = true;
|
|
|
- const res = await httpRequest.get("/power/prepare/show", {
|
|
|
- params: {
|
|
|
- id: obj.id,
|
|
|
- },
|
|
|
- });
|
|
|
- if (res.code === 200) {
|
|
|
- tableColumn.value = res.data.title.map((o) => {
|
|
|
- return {
|
|
|
- prop: o.key,
|
|
|
- label: o.des,
|
|
|
- width: o.des === "时间" ? 100 : 80,
|
|
|
- };
|
|
|
- });
|
|
|
- tableData.value = res.data.data;
|
|
|
- tableLoading.value = false;
|
|
|
- } else {
|
|
|
- tableLoading.value = false;
|
|
|
- }
|
|
|
-};
|
|
|
-/**tree 开始 */
|
|
|
-const treeData = ref([]);
|
|
|
-const funRepeatMap = (arr) => {
|
|
|
- return arr.map((o) => {
|
|
|
- if (o.children) {
|
|
|
- const findIndex = o.children.findIndex((p) => !!p.type);
|
|
|
- if (findIndex !== -1) {
|
|
|
- o.childs = o.children;
|
|
|
- o.children = [];
|
|
|
- }
|
|
|
- }
|
|
|
- return {
|
|
|
- ...o,
|
|
|
- children: o.children.length ? funRepeatMap(o.children) : [],
|
|
|
+ const tableFilterMethod = (value, row) => {
|
|
|
+ return row.res === value;
|
|
|
};
|
|
|
- });
|
|
|
-};
|
|
|
-const funGetTree = async () => {
|
|
|
- const res = await httpRequest.get("/power/prepare/tree");
|
|
|
- treeData.value = funRepeatMap(res.data);
|
|
|
- excelList.value = [];
|
|
|
-};
|
|
|
-const funCurrentChange = ({ current, currentNode }) => {
|
|
|
- if (current.childs) {
|
|
|
- excelList.value = current.childs.map((o) => {
|
|
|
- return {
|
|
|
- id: o.id,
|
|
|
- interval: o.interval,
|
|
|
- path: o.path,
|
|
|
- prepareid: o.prepareid,
|
|
|
- station: o.station,
|
|
|
- time: o.time,
|
|
|
- type: o.type,
|
|
|
- windturbine: o.windturbine,
|
|
|
- name: o.path.substring(
|
|
|
- o.path.indexOf(o.station + "_") + (o.station + "_").length
|
|
|
- ),
|
|
|
- };
|
|
|
- });
|
|
|
- } else {
|
|
|
- excelList.value = [];
|
|
|
- }
|
|
|
-};
|
|
|
-/**table 开始 */
|
|
|
-const tableShowId = ref("");
|
|
|
-const tableName = ref("");
|
|
|
-const tableColumn = ref([]);
|
|
|
-const tableLoading = ref(false);
|
|
|
-const tableData = ref([]);
|
|
|
-/**tab */
|
|
|
-const activeTab = ref("1");
|
|
|
-/**chart Data */
|
|
|
-const xAxisData = ref([]);
|
|
|
-const chartRef = ref(); //chart 的ref
|
|
|
-const seriesData = ref([]);
|
|
|
-const dataSet = ref("");
|
|
|
-const funChartSelect = async (batch) => {
|
|
|
- return false;
|
|
|
-};
|
|
|
|
|
|
-const createMark = (markInfo) => {
|
|
|
- activeTab.value = "2";
|
|
|
- chartRef.value.initChart(markInfo);
|
|
|
-};
|
|
|
-/**submit */
|
|
|
-const funSubmit = (params) => {
|
|
|
- activeTab.value = "2";
|
|
|
- tableShowId.value = "";
|
|
|
- tableName.value = "AGC";
|
|
|
- tableLoading.value = true;
|
|
|
- httpRequest
|
|
|
- .get("/agc/deviate", {
|
|
|
- params: params,
|
|
|
- })
|
|
|
- .then((res) => {
|
|
|
- // const res = agcJson
|
|
|
- tableColumn.value = [
|
|
|
- {
|
|
|
- prop: "ts",
|
|
|
- label: "时间",
|
|
|
- width: 100,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "ygsdxz",
|
|
|
- label: "有功设定限值",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "sfyg",
|
|
|
- label: "实发有功",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "cz",
|
|
|
- label: "差值",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "llgl",
|
|
|
- label: "理论功率",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "pcsx",
|
|
|
- label: "偏差上限",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "pcxx",
|
|
|
- label: "偏差下限",
|
|
|
- width: 100,
|
|
|
- },
|
|
|
- ];
|
|
|
- const tableArr = [];
|
|
|
- const tsArr = [];
|
|
|
- const ygsdxz = [];
|
|
|
- const sfyg = [];
|
|
|
- const llgl = [];
|
|
|
- const pcsx = [];
|
|
|
- const pcxx = [];
|
|
|
- res["有功设定限值"].values.map((o, index) => {
|
|
|
- tsArr.push(dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"));
|
|
|
- ygsdxz.push(Number(o.value).toFixed(2));
|
|
|
- if (res["实发有功"].values.length > 0) {
|
|
|
- sfyg.push(Number(res["实发有功"].values[index].value).toFixed(2));
|
|
|
- }
|
|
|
- if (res["理论功率"].values.length > 0) {
|
|
|
- llgl.push(Number(res["理论功率"].values[index].value).toFixed(2));
|
|
|
+ /**配置参数 */
|
|
|
+ const paginationHeight = ref(10);
|
|
|
+ const tableWidth = ref(window.innerWidth - 200 + "px");
|
|
|
+ const tableHeight = ref(
|
|
|
+ window.innerHeight - 170 - paginationHeight.value + "px"
|
|
|
+ );
|
|
|
+ const treeHeight = ref(window.innerHeight - 170 + "px"); //tree高度
|
|
|
+ const excelHeight = ref(window.innerHeight - 170 + "px"); //excel高度
|
|
|
+ /**excel 开始 */
|
|
|
+ const excelList = ref([]);
|
|
|
+ const funExcelChange = async (obj) => {
|
|
|
+ //点击excel项时
|
|
|
+ activeTab.value = "1";
|
|
|
+ tableShowId.value = obj.id;
|
|
|
+ tableName.value = obj.name;
|
|
|
+ tableLoading.value = true;
|
|
|
+ const res = await httpRequest.get("/power/prepare/show", {
|
|
|
+ params: {
|
|
|
+ id: obj.id,
|
|
|
+ },
|
|
|
+ });
|
|
|
+ if (res.code === 200) {
|
|
|
+ tableColumn.value = res.data.title.map((o) => {
|
|
|
+ return {
|
|
|
+ prop: o.key,
|
|
|
+ label: o.des,
|
|
|
+ width: o.des === "时间" ? 100 : 80,
|
|
|
+ };
|
|
|
+ });
|
|
|
+ tableData.value = res.data.data;
|
|
|
+ tableLoading.value = false;
|
|
|
+ } else {
|
|
|
+ tableLoading.value = false;
|
|
|
}
|
|
|
- if (res["偏差上限"].values.length > 0) {
|
|
|
- pcsx.push(Number(res["偏差上限"].values[index].value).toFixed(2));
|
|
|
+ };
|
|
|
+ /**tree 开始 */
|
|
|
+ const treeData = ref([]);
|
|
|
+ const funRepeatMap = (arr) => {
|
|
|
+ return arr.map((o) => {
|
|
|
+ if (o.children) {
|
|
|
+ const findIndex = o.children.findIndex((p) => !!p.type);
|
|
|
+ if (findIndex !== -1) {
|
|
|
+ o.childs = o.children;
|
|
|
+ o.children = [];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return {
|
|
|
+ ...o,
|
|
|
+ children: o.children.length ? funRepeatMap(o.children) : [],
|
|
|
+ };
|
|
|
+ });
|
|
|
+ };
|
|
|
+ const funGetTree = async () => {
|
|
|
+ const res = await httpRequest.get("/power/prepare/tree");
|
|
|
+ treeData.value = funRepeatMap(res.data);
|
|
|
+ excelList.value = [];
|
|
|
+ };
|
|
|
+ const funCurrentChange = ({
|
|
|
+ current,
|
|
|
+ currentNode
|
|
|
+ }) => {
|
|
|
+ if (current.childs) {
|
|
|
+ excelList.value = current.childs.map((o) => {
|
|
|
+ return {
|
|
|
+ id: o.id,
|
|
|
+ interval: o.interval,
|
|
|
+ path: o.path,
|
|
|
+ prepareid: o.prepareid,
|
|
|
+ station: o.station,
|
|
|
+ time: o.time,
|
|
|
+ type: o.type,
|
|
|
+ windturbine: o.windturbine,
|
|
|
+ name: o.path.substring(
|
|
|
+ o.path.indexOf(o.station + "_") + (o.station + "_").length
|
|
|
+ ),
|
|
|
+ };
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ excelList.value = [];
|
|
|
}
|
|
|
- if (res["偏差下限"].values.length > 0) {
|
|
|
- pcxx.push(Number(res["偏差下限"].values[index].value).toFixed(2));
|
|
|
+ };
|
|
|
+ /**table 开始 */
|
|
|
+ const tableShowId = ref("");
|
|
|
+ const tableName = ref("");
|
|
|
+ const tableColumn = ref([]);
|
|
|
+ const tableLoading = ref(false);
|
|
|
+ const tableData = ref([]);
|
|
|
+ /**tab */
|
|
|
+ const activeTab = ref("1");
|
|
|
+ /**chart Data */
|
|
|
+ const xAxisData = ref([]);
|
|
|
+ const chartRef = ref(); //chart 的ref
|
|
|
+ const seriesData = ref([]);
|
|
|
+ const dataSet = ref("");
|
|
|
+ const funChartSelect = async (batch) => {
|
|
|
+ return false;
|
|
|
+ };
|
|
|
+
|
|
|
+ const createMark = (markInfo) => {
|
|
|
+ activeTab.value = "2";
|
|
|
+ chartRef.value.initChart(markInfo);
|
|
|
+ };
|
|
|
+ /**submit */
|
|
|
+ const funSubmit = (params) => {
|
|
|
+ activeTab.value = "2";
|
|
|
+ tableShowId.value = "";
|
|
|
+ tableName.value = "AGC";
|
|
|
+ tableLoading.value = true;
|
|
|
+ httpRequest
|
|
|
+ .get("/agc/deviate", {
|
|
|
+ params: params,
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
+ // const res = agcJson
|
|
|
+ tableColumn.value = [{
|
|
|
+ prop: "ts",
|
|
|
+ label: "时间",
|
|
|
+ width: 100,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "ygsdxz",
|
|
|
+ label: "有功设定限值",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "sfyg",
|
|
|
+ label: "实发有功",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "cz",
|
|
|
+ label: "差值",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "llgl",
|
|
|
+ label: "理论功率",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "pcsx",
|
|
|
+ label: "偏差上限",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "pcxx",
|
|
|
+ label: "偏差下限",
|
|
|
+ width: 100,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ const tableArr = [];
|
|
|
+ const tsArr = [];
|
|
|
+ const ygsdxz = [];
|
|
|
+ const sfyg = [];
|
|
|
+ const llgl = [];
|
|
|
+ const pcsx = [];
|
|
|
+ const pcxx = [];
|
|
|
+ res["有功设定限值"].values.map((o, index) => {
|
|
|
+ tsArr.push(dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"));
|
|
|
+ ygsdxz.push(Number(o.value).toFixed(2));
|
|
|
+ if (res["实发有功"].values.length > 0) {
|
|
|
+ sfyg.push(Number(res["实发有功"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["理论功率"].values.length > 0) {
|
|
|
+ llgl.push(Number(res["理论功率"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["偏差上限"].values.length > 0) {
|
|
|
+ pcsx.push(Number(res["偏差上限"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["偏差下限"].values.length > 0) {
|
|
|
+ pcxx.push(Number(res["偏差下限"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ tableArr.push({
|
|
|
+ ts: dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"),
|
|
|
+ ygsdxz: Number(o.value).toFixed(2),
|
|
|
+ sfyg: res["实发有功"].values.length > 0 ?
|
|
|
+ Number(res["实发有功"].values[index].value).toFixed(2) : "-",
|
|
|
+ llgl: res["理论功率"].values.length > 0 ?
|
|
|
+ Number(res["理论功率"].values[index].value).toFixed(2) : "-",
|
|
|
+ pcsx: res["偏差上限"].values.length > 0 ?
|
|
|
+ Number(res["偏差上限"].values[index].value).toFixed(2) : "-",
|
|
|
+ pcxx: res["偏差下限"].values.length > 0 ?
|
|
|
+ Number(res["偏差下限"].values[index].value).toFixed(2) : "-",
|
|
|
+ cz: res["有功设定限值"].values.length && res["实发有功"].values.length ?
|
|
|
+ (
|
|
|
+ Number(res["有功设定限值"].values[index].value) -
|
|
|
+ Number(res["实发有功"].values[index].value)
|
|
|
+ ).toFixed(2) : "-",
|
|
|
+ });
|
|
|
+ });
|
|
|
+ xAxisData.value = tableArr.map((o) => o.ts);
|
|
|
+ seriesData.value = [{
|
|
|
+ name: "有功设定限值",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: ygsdxz,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#67c23a"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "实发有功",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: sfyg,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "rgb(242.5, 208.5, 157.5)"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
+ markPoint: {
|
|
|
+ symbolSize: 36,
|
|
|
+ itemStyle: {
|
|
|
+ color: "#f60", // 特殊颜色
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ itemStyle: {
|
|
|
+ color: "#fff",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ blur: {
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 1,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "理论功率",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: llgl,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#f56c6c"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "偏差上限",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: pcsx,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#64b5f6",
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ symbol: "none",
|
|
|
+ large: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "偏差下限",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: pcxx,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#ffb74d",
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ symbol: "none",
|
|
|
+ large: true,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ tableData.value = tableArr;
|
|
|
+ tableLoading.value = false;
|
|
|
+ tableShowId.value = "1";
|
|
|
+
|
|
|
+ let abnormalPointTemp = [];
|
|
|
+ seriesData.value[1].data.forEach((ele, index) => {
|
|
|
+ if (
|
|
|
+ parseFloat(seriesData.value[2].data[index]) >
|
|
|
+ parseFloat(seriesData.value[0].data[index])
|
|
|
+ ) {
|
|
|
+ if (parseFloat(ele) > parseFloat(seriesData.value[3].data[index])) {
|
|
|
+ abnormalPointTemp.push({
|
|
|
+ date: tsArr[index],
|
|
|
+ value: parseFloat(ele),
|
|
|
+ jud: seriesData.value[3].data[index],
|
|
|
+ res: "高于上限",
|
|
|
+ color: "#f25656",
|
|
|
+ icon: "Top",
|
|
|
+ dataIndex: index,
|
|
|
+ });
|
|
|
+ } else if (
|
|
|
+ parseFloat(ele) < parseFloat(seriesData.value[4].data[index])
|
|
|
+ ) {
|
|
|
+ abnormalPointTemp.push({
|
|
|
+ date: tsArr[index],
|
|
|
+ value: parseFloat(ele),
|
|
|
+ jud: seriesData.value[4].data[index],
|
|
|
+ res: "低于下限",
|
|
|
+ color: "#1890ff",
|
|
|
+ icon: "Bottom",
|
|
|
+ dataIndex: index,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ abnormalPoint.value = abnormalPointTemp;
|
|
|
+ })
|
|
|
+ .catch(() => {
|
|
|
+ initPageData();
|
|
|
+ });
|
|
|
+
|
|
|
+ // if (res.code === 200) {
|
|
|
+ // if(res.data.sjgl?.length){
|
|
|
+ // for(const wtObj of res.data.sjgl){
|
|
|
+ // seriesData.value.push(
|
|
|
+ // {
|
|
|
+ // name: wtObj.obj.windturbine + "\n实际功率",
|
|
|
+ // type: "line",
|
|
|
+ // symbol: "line", //设定为实心点
|
|
|
+ // symbolSize: 0, //设定实心点的大小
|
|
|
+ // smooth: true, //这个是把线变成曲线
|
|
|
+ // data: wtObj.sjgl || [],
|
|
|
+ // xAxisIndex: 0,
|
|
|
+ // },
|
|
|
+ // )
|
|
|
+ // wtData.value.push(wtObj.obj)
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ // }
|
|
|
+ };
|
|
|
+ /**created */
|
|
|
+ // funGetTree()
|
|
|
+ const theme = ref(null);
|
|
|
+ const echartsTheme = ref("");
|
|
|
+ const store = useStore();
|
|
|
+ watch(
|
|
|
+ () => store.state.theme,
|
|
|
+ (newVal, oldVal) => {
|
|
|
+ theme.value = newVal;
|
|
|
+ echartsTheme.value = !newVal ? "dark" : "";
|
|
|
+ // funSubmit();
|
|
|
+ }, {
|
|
|
+ deep: true,
|
|
|
}
|
|
|
- tableArr.push({
|
|
|
- ts: dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"),
|
|
|
- ygsdxz: Number(o.value).toFixed(2),
|
|
|
- sfyg:
|
|
|
- res["实发有功"].values.length > 0
|
|
|
- ? Number(res["实发有功"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- llgl:
|
|
|
- res["理论功率"].values.length > 0
|
|
|
- ? Number(res["理论功率"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- pcsx:
|
|
|
- res["偏差上限"].values.length > 0
|
|
|
- ? Number(res["偏差上限"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- pcxx:
|
|
|
- res["偏差下限"].values.length > 0
|
|
|
- ? Number(res["偏差下限"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- cz:
|
|
|
- res["有功设定限值"].values.length && res["实发有功"].values.length
|
|
|
- ? (
|
|
|
- Number(res["有功设定限值"].values[index].value) -
|
|
|
- Number(res["实发有功"].values[index].value)
|
|
|
- ).toFixed(2)
|
|
|
- : "-",
|
|
|
+ );
|
|
|
+ const abnormalPoint = ref([]);
|
|
|
+ const initPageData = () => {
|
|
|
+ activeTab.value = "2";
|
|
|
+ tableShowId.value = "";
|
|
|
+ tableName.value = "AGC";
|
|
|
+ tableLoading.value = true;
|
|
|
+ const res = JSON.parse(JSON.stringify(jsonData.deviateData));
|
|
|
+ // const res = agcJson
|
|
|
+ tableColumn.value = [{
|
|
|
+ prop: "ts",
|
|
|
+ label: "时间",
|
|
|
+ width: 100,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "ygsdxz",
|
|
|
+ label: "有功设定限值",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "sfyg",
|
|
|
+ label: "实发有功",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "llgl",
|
|
|
+ label: "理论功率",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "pcsx",
|
|
|
+ label: "偏差上限",
|
|
|
+ width: 80,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ prop: "pcxx",
|
|
|
+ label: "偏差下限",
|
|
|
+ width: 100,
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ const tableArr = [];
|
|
|
+ const tsArr = [];
|
|
|
+ const ygsdxz = [];
|
|
|
+ const sfyg = [];
|
|
|
+ const llgl = [];
|
|
|
+ const pcsx = [];
|
|
|
+ const pcxx = [];
|
|
|
+ res["有功设定限值"].values.map((o, index) => {
|
|
|
+ tsArr.push(dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"));
|
|
|
+ ygsdxz.push(Number(o.value).toFixed(2));
|
|
|
+ if (res["实发有功"].values.length > 0) {
|
|
|
+ sfyg.push(Number(res["实发有功"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["理论功率"].values.length > 0) {
|
|
|
+ llgl.push(Number(res["理论功率"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["偏差上限"].values.length > 0) {
|
|
|
+ pcsx.push(Number(res["偏差上限"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ if (res["偏差下限"].values.length > 0) {
|
|
|
+ pcxx.push(Number(res["偏差下限"].values[index].value).toFixed(2));
|
|
|
+ }
|
|
|
+ tableArr.push({
|
|
|
+ ts: dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"),
|
|
|
+ ygsdxz: Number(o.value).toFixed(2),
|
|
|
+ sfyg: res["实发有功"].values.length > 0 ?
|
|
|
+ Number(res["实发有功"].values[index].value).toFixed(2) : "-",
|
|
|
+ llgl: res["理论功率"].values.length > 0 ?
|
|
|
+ Number(res["理论功率"].values[index].value).toFixed(2) : "-",
|
|
|
+ pcsx: res["偏差上限"].values.length > 0 ?
|
|
|
+ Number(res["偏差上限"].values[index].value).toFixed(2) : "-",
|
|
|
+ pcxx: res["偏差下限"].values.length > 0 ?
|
|
|
+ Number(res["偏差下限"].values[index].value).toFixed(2) : "-",
|
|
|
+ });
|
|
|
});
|
|
|
- });
|
|
|
- xAxisData.value = tableArr.map((o) => o.ts);
|
|
|
- seriesData.value = [
|
|
|
- {
|
|
|
- name: "有功设定限值",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: ygsdxz,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#67c23a" },
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "实发有功",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: sfyg,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "rgb(242.5, 208.5, 157.5)" },
|
|
|
- large: true,
|
|
|
- markPoint: {
|
|
|
- symbolSize: 36,
|
|
|
- itemStyle: {
|
|
|
- color: "#f60", // 特殊颜色
|
|
|
+ xAxisData.value = tableArr.map((o) => o.ts);
|
|
|
+ seriesData.value = [{
|
|
|
+ name: "有功设定限值",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: ygsdxz,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#67c23a"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "实发有功",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: sfyg,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "rgb(242.5, 208.5, 157.5)"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
+ markPoint: {
|
|
|
+ symbolSize: 36,
|
|
|
+ itemStyle: {
|
|
|
+ color: "#f60", // 特殊颜色
|
|
|
+ },
|
|
|
+ emphasis: {
|
|
|
+ itemStyle: {
|
|
|
+ color: "#fff",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ blur: {
|
|
|
+ itemStyle: {
|
|
|
+ opacity: 1,
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data: [],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "理论功率",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: llgl,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#f56c6c"
|
|
|
+ },
|
|
|
+ large: true,
|
|
|
},
|
|
|
- emphasis: {
|
|
|
- itemStyle: {
|
|
|
- color: "#fff",
|
|
|
- },
|
|
|
+ {
|
|
|
+ name: "偏差上限",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: pcsx,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#64b5f6",
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ symbol: "none",
|
|
|
+ large: true,
|
|
|
},
|
|
|
- blur: {
|
|
|
- itemStyle: {
|
|
|
- opacity: 1,
|
|
|
- },
|
|
|
+ {
|
|
|
+ name: "偏差下限",
|
|
|
+ type: "line",
|
|
|
+ symbol: "line", //设定为实心点
|
|
|
+ symbolSize: 0, //设定实心点的大小
|
|
|
+ smooth: false, //这个是把线变成曲线
|
|
|
+ data: pcxx,
|
|
|
+ xAxisIndex: 0,
|
|
|
+ lineStyle: {
|
|
|
+ color: "#ffb74d",
|
|
|
+ opacity: 0
|
|
|
+ },
|
|
|
+ symbol: "none",
|
|
|
+ large: true,
|
|
|
},
|
|
|
- data: [],
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- name: "理论功率",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: llgl,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#f56c6c" },
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "偏差上限",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: pcsx,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#64b5f6", opacity: 0 },
|
|
|
- symbol: "none",
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "偏差下限",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: pcxx,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#ffb74d", opacity: 0 },
|
|
|
- symbol: "none",
|
|
|
- large: true,
|
|
|
- },
|
|
|
- ];
|
|
|
- tableData.value = tableArr;
|
|
|
- tableLoading.value = false;
|
|
|
- tableShowId.value = "1";
|
|
|
+ ];
|
|
|
+ tableData.value = tableArr;
|
|
|
+ tableLoading.value = false;
|
|
|
+ tableShowId.value = "1";
|
|
|
|
|
|
- let abnormalPointTemp = [];
|
|
|
- seriesData.value[1].data.forEach((ele, index) => {
|
|
|
- if (
|
|
|
- parseFloat(seriesData.value[2].data[index]) >
|
|
|
- parseFloat(seriesData.value[0].data[index])
|
|
|
- ) {
|
|
|
- if (parseFloat(ele) > parseFloat(seriesData.value[3].data[index])) {
|
|
|
- abnormalPointTemp.push({
|
|
|
- date: tsArr[index],
|
|
|
- value: parseFloat(ele),
|
|
|
- jud: seriesData.value[3].data[index],
|
|
|
- res: "高于上限",
|
|
|
- color: "#f25656",
|
|
|
- icon: "Top",
|
|
|
- dataIndex: index,
|
|
|
- });
|
|
|
- } else if (
|
|
|
- parseFloat(ele) < parseFloat(seriesData.value[4].data[index])
|
|
|
- ) {
|
|
|
- abnormalPointTemp.push({
|
|
|
- date: tsArr[index],
|
|
|
- value: parseFloat(ele),
|
|
|
- jud: seriesData.value[4].data[index],
|
|
|
- res: "低于下限",
|
|
|
- color: "#1890ff",
|
|
|
- icon: "Bottom",
|
|
|
- dataIndex: index,
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- abnormalPoint.value = abnormalPointTemp;
|
|
|
- })
|
|
|
- .catch(() => {
|
|
|
- initPageData();
|
|
|
- });
|
|
|
+ let abnormalPointTemp = [];
|
|
|
+ seriesData.value[1].data.forEach((ele, index) => {
|
|
|
+ if (parseFloat(ele) > parseFloat(seriesData.value[3].data[index])) {
|
|
|
+ abnormalPointTemp.push({
|
|
|
+ date: tsArr[index],
|
|
|
+ value: parseFloat(ele),
|
|
|
+ jud: seriesData.value[3].data[index],
|
|
|
+ res: "高于上限",
|
|
|
+ color: "#f25656",
|
|
|
+ icon: "Top",
|
|
|
+ dataIndex: index,
|
|
|
+ });
|
|
|
+ } else if (parseFloat(ele) < parseFloat(seriesData.value[4].data[index])) {
|
|
|
+ abnormalPointTemp.push({
|
|
|
+ date: tsArr[index],
|
|
|
+ value: parseFloat(ele),
|
|
|
+ jud: seriesData.value[4].data[index],
|
|
|
+ res: "低于下限",
|
|
|
+ color: "#1890ff",
|
|
|
+ icon: "Bottom",
|
|
|
+ dataIndex: index,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ abnormalPoint.value = abnormalPointTemp;
|
|
|
+ };
|
|
|
|
|
|
- // if (res.code === 200) {
|
|
|
- // if(res.data.sjgl?.length){
|
|
|
- // for(const wtObj of res.data.sjgl){
|
|
|
- // seriesData.value.push(
|
|
|
- // {
|
|
|
- // name: wtObj.obj.windturbine + "\n实际功率",
|
|
|
- // type: "line",
|
|
|
- // symbol: "line", //设定为实心点
|
|
|
- // symbolSize: 0, //设定实心点的大小
|
|
|
- // smooth: true, //这个是把线变成曲线
|
|
|
- // data: wtObj.sjgl || [],
|
|
|
- // xAxisIndex: 0,
|
|
|
- // },
|
|
|
- // )
|
|
|
- // wtData.value.push(wtObj.obj)
|
|
|
- // }
|
|
|
- // }
|
|
|
- // }
|
|
|
-};
|
|
|
-/**created */
|
|
|
-// funGetTree()
|
|
|
-const theme = ref(null);
|
|
|
-const echartsTheme = ref("");
|
|
|
-const store = useStore();
|
|
|
-watch(
|
|
|
- () => store.state.theme,
|
|
|
- (newVal, oldVal) => {
|
|
|
- theme.value = newVal;
|
|
|
- echartsTheme.value = !newVal ? "dark" : "";
|
|
|
- // funSubmit();
|
|
|
- },
|
|
|
- {
|
|
|
- deep: true,
|
|
|
- }
|
|
|
-);
|
|
|
-const abnormalPoint = ref([]);
|
|
|
-const initPageData = () => {
|
|
|
- activeTab.value = "2";
|
|
|
- tableShowId.value = "";
|
|
|
- tableName.value = "AGC";
|
|
|
- tableLoading.value = true;
|
|
|
- const res = JSON.parse(JSON.stringify(jsonData.deviateData));
|
|
|
- // const res = agcJson
|
|
|
- tableColumn.value = [
|
|
|
- {
|
|
|
- prop: "ts",
|
|
|
- label: "时间",
|
|
|
- width: 100,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "ygsdxz",
|
|
|
- label: "有功设定限值",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "sfyg",
|
|
|
- label: "实发有功",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "llgl",
|
|
|
- label: "理论功率",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "pcsx",
|
|
|
- label: "偏差上限",
|
|
|
- width: 80,
|
|
|
- },
|
|
|
- {
|
|
|
- prop: "pcxx",
|
|
|
- label: "偏差下限",
|
|
|
- width: 100,
|
|
|
- },
|
|
|
- ];
|
|
|
- const tableArr = [];
|
|
|
- const tsArr = [];
|
|
|
- const ygsdxz = [];
|
|
|
- const sfyg = [];
|
|
|
- const llgl = [];
|
|
|
- const pcsx = [];
|
|
|
- const pcxx = [];
|
|
|
- res["有功设定限值"].values.map((o, index) => {
|
|
|
- tsArr.push(dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"));
|
|
|
- ygsdxz.push(Number(o.value).toFixed(2));
|
|
|
- if (res["实发有功"].values.length > 0) {
|
|
|
- sfyg.push(Number(res["实发有功"].values[index].value).toFixed(2));
|
|
|
- }
|
|
|
- if (res["理论功率"].values.length > 0) {
|
|
|
- llgl.push(Number(res["理论功率"].values[index].value).toFixed(2));
|
|
|
- }
|
|
|
- if (res["偏差上限"].values.length > 0) {
|
|
|
- pcsx.push(Number(res["偏差上限"].values[index].value).toFixed(2));
|
|
|
- }
|
|
|
- if (res["偏差下限"].values.length > 0) {
|
|
|
- pcxx.push(Number(res["偏差下限"].values[index].value).toFixed(2));
|
|
|
- }
|
|
|
- tableArr.push({
|
|
|
- ts: dayjs(o.ts).format("YYYY-MM-DD HH:mm:ss"),
|
|
|
- ygsdxz: Number(o.value).toFixed(2),
|
|
|
- sfyg:
|
|
|
- res["实发有功"].values.length > 0
|
|
|
- ? Number(res["实发有功"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- llgl:
|
|
|
- res["理论功率"].values.length > 0
|
|
|
- ? Number(res["理论功率"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- pcsx:
|
|
|
- res["偏差上限"].values.length > 0
|
|
|
- ? Number(res["偏差上限"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
- pcxx:
|
|
|
- res["偏差下限"].values.length > 0
|
|
|
- ? Number(res["偏差下限"].values[index].value).toFixed(2)
|
|
|
- : "-",
|
|
|
+ /**mounted */
|
|
|
+ onMounted(() => {
|
|
|
+ // funSubmit();
|
|
|
+ theme.value = store.state.theme;
|
|
|
+ echartsTheme.value = !theme.value ? "dark" : "";
|
|
|
+ tableWidth.value = "100%";
|
|
|
+ tableHeight.value = window.innerHeight - 170 - paginationHeight.value + "px";
|
|
|
+ excelHeight.value = window.innerHeight - 170 + "px";
|
|
|
+ treeHeight.value = window.innerHeight - 170 + "px";
|
|
|
+ window.addEventListener("resize", () => {
|
|
|
+ tableWidth.value = "100%";
|
|
|
+ tableHeight.value =
|
|
|
+ window.innerHeight - 170 - paginationHeight.value + "px";
|
|
|
+ excelHeight.value = window.innerHeight - 170 + "px";
|
|
|
+ treeHeight.value = window.innerHeight - 170 + "px";
|
|
|
+ });
|
|
|
+ });
|
|
|
+ /**activated */
|
|
|
+ onActivated(() => {
|
|
|
+ // funGetTree()
|
|
|
+ // funSubmit()
|
|
|
});
|
|
|
- });
|
|
|
- xAxisData.value = tableArr.map((o) => o.ts);
|
|
|
- seriesData.value = [
|
|
|
- {
|
|
|
- name: "有功设定限值",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: ygsdxz,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#67c23a" },
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "实发有功",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: sfyg,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "rgb(242.5, 208.5, 157.5)" },
|
|
|
- large: true,
|
|
|
- markPoint: {
|
|
|
- symbolSize: 36,
|
|
|
- itemStyle: {
|
|
|
- color: "#f60", // 特殊颜色
|
|
|
- },
|
|
|
- emphasis: {
|
|
|
- itemStyle: {
|
|
|
- color: "#fff",
|
|
|
- },
|
|
|
- },
|
|
|
- blur: {
|
|
|
- itemStyle: {
|
|
|
- opacity: 1,
|
|
|
- },
|
|
|
- },
|
|
|
- data: [],
|
|
|
- },
|
|
|
- },
|
|
|
- {
|
|
|
- name: "理论功率",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: llgl,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#f56c6c" },
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "偏差上限",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: pcsx,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#64b5f6", opacity: 0 },
|
|
|
- symbol: "none",
|
|
|
- large: true,
|
|
|
- },
|
|
|
- {
|
|
|
- name: "偏差下限",
|
|
|
- type: "line",
|
|
|
- symbol: "line", //设定为实心点
|
|
|
- symbolSize: 0, //设定实心点的大小
|
|
|
- smooth: false, //这个是把线变成曲线
|
|
|
- data: pcxx,
|
|
|
- xAxisIndex: 0,
|
|
|
- lineStyle: { color: "#ffb74d", opacity: 0 },
|
|
|
- symbol: "none",
|
|
|
- large: true,
|
|
|
- },
|
|
|
- ];
|
|
|
- tableData.value = tableArr;
|
|
|
- tableLoading.value = false;
|
|
|
- tableShowId.value = "1";
|
|
|
-
|
|
|
- let abnormalPointTemp = [];
|
|
|
- seriesData.value[1].data.forEach((ele, index) => {
|
|
|
- if (parseFloat(ele) > parseFloat(seriesData.value[3].data[index])) {
|
|
|
- abnormalPointTemp.push({
|
|
|
- date: tsArr[index],
|
|
|
- value: parseFloat(ele),
|
|
|
- jud: seriesData.value[3].data[index],
|
|
|
- res: "高于上限",
|
|
|
- color: "#f25656",
|
|
|
- icon: "Top",
|
|
|
- dataIndex: index,
|
|
|
- });
|
|
|
- } else if (parseFloat(ele) < parseFloat(seriesData.value[4].data[index])) {
|
|
|
- abnormalPointTemp.push({
|
|
|
- date: tsArr[index],
|
|
|
- value: parseFloat(ele),
|
|
|
- jud: seriesData.value[4].data[index],
|
|
|
- res: "低于下限",
|
|
|
- color: "#1890ff",
|
|
|
- icon: "Bottom",
|
|
|
- dataIndex: index,
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
- abnormalPoint.value = abnormalPointTemp;
|
|
|
-};
|
|
|
-
|
|
|
-/**mounted */
|
|
|
-onMounted(() => {
|
|
|
- funSubmit();
|
|
|
- theme.value = store.state.theme;
|
|
|
- echartsTheme.value = !theme.value ? "dark" : "";
|
|
|
- tableWidth.value = "100%";
|
|
|
- tableHeight.value = window.innerHeight - 170 - paginationHeight.value + "px";
|
|
|
- excelHeight.value = window.innerHeight - 170 + "px";
|
|
|
- treeHeight.value = window.innerHeight - 170 + "px";
|
|
|
- window.addEventListener("resize", () => {
|
|
|
- tableWidth.value = "100%";
|
|
|
- tableHeight.value =
|
|
|
- window.innerHeight - 170 - paginationHeight.value + "px";
|
|
|
- excelHeight.value = window.innerHeight - 170 + "px";
|
|
|
- treeHeight.value = window.innerHeight - 170 + "px";
|
|
|
- });
|
|
|
-});
|
|
|
-/**activated */
|
|
|
-onActivated(() => {
|
|
|
- // funGetTree()
|
|
|
- // funSubmit()
|
|
|
-});
|
|
|
</script>
|
|
|
<style lang="less" scoped>
|
|
|
-.dataAnalysisAgcAna {
|
|
|
- height: 100%;
|
|
|
+ .dataAnalysisAgcAna {
|
|
|
+ height: 100%;
|
|
|
|
|
|
- .dataAnalysisAgcAnaMain {
|
|
|
- height: 100%;
|
|
|
+ .dataAnalysisAgcAnaMain {
|
|
|
+ height: 100%;
|
|
|
|
|
|
- .main_top {
|
|
|
- height: 40px;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
+ .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;
|
|
|
- }
|
|
|
+ .topPsty {
|
|
|
+ position: relative;
|
|
|
+ top: 5px;
|
|
|
+ padding: 7px 20px;
|
|
|
+ font-size: 12px;
|
|
|
+ font-weight: 600;
|
|
|
+ margin-left: 10px;
|
|
|
+ border-radius: 3px;
|
|
|
+ }
|
|
|
|
|
|
- .seach {
|
|
|
- padding: 20px 0 0 20px;
|
|
|
- }
|
|
|
- }
|
|
|
+ .seach {
|
|
|
+ padding: 20px 0 0 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .main {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- // width: calc(100% - 40px);
|
|
|
- width: 100%;
|
|
|
+ .main {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ // width: calc(100% - 40px);
|
|
|
+ width: 100%;
|
|
|
|
|
|
- .tableDataMain {
|
|
|
- padding: 10px;
|
|
|
- border-radius: 10px;
|
|
|
- width: calc(100% - 20px);
|
|
|
- position: relative;
|
|
|
+ .tableDataMain {
|
|
|
+ padding: 10px;
|
|
|
+ border-radius: 10px;
|
|
|
+ width: calc(100% - 20px);
|
|
|
+ position: relative;
|
|
|
|
|
|
- .el-tabs__content,
|
|
|
- .el-tab-pane {
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
+ .el-tabs__content,
|
|
|
+ .el-tab-pane {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
|
|
|
- .butten_com {
|
|
|
- position: absolute;
|
|
|
- right: 20px;
|
|
|
- z-index: 111111;
|
|
|
+ .butten_com {
|
|
|
+ position: absolute;
|
|
|
+ right: 20px;
|
|
|
+ z-index: 111111;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
}
|
|
|
- }
|
|
|
-}
|
|
|
|
|
|
-.themeDark {
|
|
|
- .dataAnalysisAgcAnaMain {
|
|
|
- .main_top {
|
|
|
- .topPsty {
|
|
|
- color: #1c99ff;
|
|
|
- background: #1e2126;
|
|
|
- }
|
|
|
- }
|
|
|
+ .themeDark {
|
|
|
+ .dataAnalysisAgcAnaMain {
|
|
|
+ .main_top {
|
|
|
+ .topPsty {
|
|
|
+ color: #1c99ff;
|
|
|
+ background: #1e2126;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .main {
|
|
|
- background: #13171e;
|
|
|
+ .main {
|
|
|
+ background: #13171e;
|
|
|
|
|
|
- .treeDataMain {
|
|
|
- background: transparent;
|
|
|
- }
|
|
|
+ .treeDataMain {
|
|
|
+ background: transparent;
|
|
|
+ }
|
|
|
|
|
|
- .excelDataMain {
|
|
|
- background: #313233;
|
|
|
- }
|
|
|
+ .excelDataMain {
|
|
|
+ background: #313233;
|
|
|
+ }
|
|
|
|
|
|
- .tableDataMain {
|
|
|
- margin-top: 5px;
|
|
|
- background: #212223;
|
|
|
- }
|
|
|
+ .tableDataMain {
|
|
|
+ margin-top: 5px;
|
|
|
+ background: #212223;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
-}
|
|
|
|
|
|
-.themeLight {
|
|
|
- padding: 0;
|
|
|
+ .themeLight {
|
|
|
+ padding: 0;
|
|
|
|
|
|
- .dataAnalysisAgcAnaMain {
|
|
|
- .main_top {
|
|
|
- .topPsty {
|
|
|
- color: #2778ff;
|
|
|
- background: #ffffff;
|
|
|
- }
|
|
|
- }
|
|
|
+ .dataAnalysisAgcAnaMain {
|
|
|
+ .main_top {
|
|
|
+ .topPsty {
|
|
|
+ color: #2778ff;
|
|
|
+ background: #ffffff;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .main {
|
|
|
- background: #e6e8f2;
|
|
|
+ .main {
|
|
|
+ background: #e6e8f2;
|
|
|
|
|
|
- .treeDataMain {
|
|
|
- background: transparent;
|
|
|
- }
|
|
|
+ .treeDataMain {
|
|
|
+ background: transparent;
|
|
|
+ }
|
|
|
|
|
|
- .excelDataMain {
|
|
|
- background: #f4f6fb;
|
|
|
- }
|
|
|
+ .excelDataMain {
|
|
|
+ background: #f4f6fb;
|
|
|
+ }
|
|
|
|
|
|
- .tableDataMain {
|
|
|
- background: #fff;
|
|
|
- margin-top: 5px;
|
|
|
- }
|
|
|
+ .tableDataMain {
|
|
|
+ background: #fff;
|
|
|
+ margin-top: 5px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
-}
|
|
|
</style>
|
