|
|
@@ -1,723 +1,674 @@
|
|
|
<template>
|
|
|
- <div class="alarm-center-1">
|
|
|
- <div class="action-bar">
|
|
|
- <div class="query mg-b-16">
|
|
|
- <div class="query-items">
|
|
|
- <div class="query-item">
|
|
|
- <div class="lable">风场：</div>
|
|
|
- <div class="search-input">
|
|
|
- <el-select
|
|
|
- v-model="wpvalue"
|
|
|
- clearable
|
|
|
- placeholder="请选择"
|
|
|
- popper-class="select"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in wpoptions"
|
|
|
- :key="item.id"
|
|
|
- :label="item.name"
|
|
|
- :value="item.id"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="query-item">
|
|
|
- <div class="lable">开始日期：</div>
|
|
|
- <div class="search-input">
|
|
|
- <el-date-picker
|
|
|
- v-model="startdate"
|
|
|
- type="date"
|
|
|
- placeholder="选择日期"
|
|
|
- popper-class="date-select"
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="query-item">
|
|
|
- <div class="lable">结束日期：</div>
|
|
|
- <div class="search-input">
|
|
|
- <el-date-picker
|
|
|
- v-model="enddate"
|
|
|
- type="date"
|
|
|
- placeholder="选择日期"
|
|
|
- popper-class="date-select"
|
|
|
- >
|
|
|
- </el-date-picker>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="query-item">
|
|
|
- <div class="lable">规则：</div>
|
|
|
- <el-cascader
|
|
|
- style="width: 240px"
|
|
|
- size="mini"
|
|
|
- popper-class="search-select"
|
|
|
- :options="cascaderOptions"
|
|
|
- :props="cascaderProps"
|
|
|
- v-model="cascaderSel"
|
|
|
- collapse-tags
|
|
|
- :clearable="true"
|
|
|
- ></el-cascader>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <div class="query-actions">
|
|
|
- <button class="btn green" @click="searchData">搜索</button>
|
|
|
- <button class="btn green" @click="searchTree">筛选</button>
|
|
|
- <button class="btn green" @click="fx">分析</button>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <panel-3 class="table-panel">
|
|
|
- <table-3 :data="tableData" :height="'85vh'">
|
|
|
- <template v-for="(item, i) in column" :key="i" #[item]="scope">
|
|
|
- <div class="bar" @click="showChart(scope)">
|
|
|
- <div
|
|
|
- class="bar-percent"
|
|
|
- :style="{
|
|
|
- width:
|
|
|
- (scope.data.count &&
|
|
|
- scope.data.count / (scope.data.count + scope.data.time)) *
|
|
|
- 100 +
|
|
|
- 'px',
|
|
|
- }"
|
|
|
- ></div>
|
|
|
- <span class="value"
|
|
|
- >{{ scope.data.count && scope.data.count }} 次数</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- <div class="bar" @click="showChart(scope)">
|
|
|
- <div
|
|
|
- class="bar-percent"
|
|
|
- :style="{
|
|
|
- width:
|
|
|
- (scope.data.count &&
|
|
|
- scope.data.time / (scope.data.count + scope.data.time)) *
|
|
|
- 100 +
|
|
|
- 'px',
|
|
|
- }"
|
|
|
- ></div>
|
|
|
- <span class="value"
|
|
|
- >{{ scope.data.count && scope.data.time }} 分钟</span
|
|
|
- >
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </table-3>
|
|
|
- </panel-3>
|
|
|
- <el-dialog
|
|
|
- :title="dialogTitle"
|
|
|
- v-model="dialogVisible"
|
|
|
- width="70%"
|
|
|
- top="10vh"
|
|
|
- custom-class="modal"
|
|
|
- :close-on-click-modal="false"
|
|
|
- >
|
|
|
- <div class="searchForm">
|
|
|
- <div class="choose">
|
|
|
- <button class="btn green">等间隔</button>
|
|
|
- <!-- <button :class="chooseStatus?'btn green':'btn'" @click="switchChange(1,'original')">原始数据</button> -->
|
|
|
- </div>
|
|
|
- <el-select
|
|
|
- v-if="!chooseStatus"
|
|
|
- @change="switchChange(selectValue)"
|
|
|
- class="inputs"
|
|
|
- v-model="selectValue"
|
|
|
- placeholder="请选择"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="item in timeoptions"
|
|
|
- :key="item.value"
|
|
|
- :label="item.label"
|
|
|
- :value="item.value"
|
|
|
- >
|
|
|
- </el-option>
|
|
|
- </el-select>
|
|
|
- </div>
|
|
|
- <multiple-y-line-chart-normal
|
|
|
- height="500px"
|
|
|
- :list="Analysis"
|
|
|
- :yAxises="AnalysisYAxises"
|
|
|
- :showLegend="true"
|
|
|
- />
|
|
|
- </el-dialog>
|
|
|
- <el-dialog :title="dialogTitleFX" v-model="dialogVisibleFX" width="70%" top="10vh" custom-class="modal" :close-on-click-modal="false" :destroy-on-close='true'>
|
|
|
- <FX :date='startdate' :wpid='wpvalue'/>
|
|
|
- </el-dialog>
|
|
|
- </div>
|
|
|
+ <div class="alarm-center-1">
|
|
|
+ <div class="action-bar">
|
|
|
+ <div class="query mg-b-16">
|
|
|
+ <div class="query-items">
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">风场：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-select v-model="wpvalue" clearable placeholder="请选择" popper-class="select">
|
|
|
+ <el-option v-for="item in wpoptions" :key="item.id" :label="item.name" :value="item.id">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">开始日期：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-date-picker v-model="startdate" type="date" placeholder="选择日期"
|
|
|
+ popper-class="date-select">
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">结束日期：</div>
|
|
|
+ <div class="search-input">
|
|
|
+ <el-date-picker v-model="enddate" type="date" placeholder="选择日期" popper-class="date-select">
|
|
|
+ </el-date-picker>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-item">
|
|
|
+ <div class="lable">规则：</div>
|
|
|
+ <el-cascader style="width: 240px" size="mini" popper-class="search-select"
|
|
|
+ :options="cascaderOptions" :props="cascaderProps" v-model="cascaderSel" collapse-tags
|
|
|
+ :clearable="true"></el-cascader>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="query-actions">
|
|
|
+ <button class="btn green" @click="searchData">搜索</button>
|
|
|
+ <button class="btn green" @click="searchTree">筛选</button>
|
|
|
+ <button class="btn green" @click="fx">分析</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <panel-3 class="table-panel">
|
|
|
+ <table-3 :data="tableData" :height="'85vh'">
|
|
|
+ <template v-for="(item, i) in column" :key="i" #[item]="scope">
|
|
|
+ <div class="bar" @click="showChart(scope)">
|
|
|
+ <div class="bar-percent" :style="{ width: scope?.data?.countStyle }"> </div>
|
|
|
+ <span class="value">{{ scope?.data?.count }} 次数</span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="bar" @click="showChart(scope)">
|
|
|
+ <div class="bar-percent" :style="{ width: scope?.data?.timeStyle}"></div>
|
|
|
+ <span class="value">{{scope?.data?.time }} 分钟</span>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </table-3>
|
|
|
+ </panel-3>
|
|
|
+ <el-dialog :title="dialogTitle" v-model="dialogVisible" width="70%" top="10vh" custom-class="modal"
|
|
|
+ :close-on-click-modal="false">
|
|
|
+ <div class="searchForm">
|
|
|
+ <div class="choose">
|
|
|
+ <button class="btn green">等间隔</button>
|
|
|
+ <!-- <button :class="chooseStatus?'btn green':'btn'" @click="switchChange(1,'original')">原始数据</button> -->
|
|
|
+ </div>
|
|
|
+ <el-select v-if="!chooseStatus" @change="switchChange(selectValue)" class="inputs" v-model="selectValue"
|
|
|
+ placeholder="请选择">
|
|
|
+ <el-option v-for="item in timeoptions" :key="item.value" :label="item.label" :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <multiple-y-line-chart-normal height="500px" :list="Analysis" :yAxises="AnalysisYAxises"
|
|
|
+ :showLegend="true" />
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog :title="dialogTitleFX" v-model="dialogVisibleFX" width="70%" top="10vh" custom-class="modal"
|
|
|
+ :close-on-click-modal="false" :destroy-on-close='true'>
|
|
|
+ <FX :date='startdate' :wpid='wpvalue' />
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import Panel3 from "../../components/coms/panel/panel3.vue";
|
|
|
-import Table3 from "../../components/coms/table/table3.vue";
|
|
|
-import MultipleYLineChartNormal from "./multiple-y-line-chart-normal.vue";
|
|
|
-import FX from "./alarm-center-yjfx.vue";
|
|
|
-import BASE from '@tools/basicTool.js';
|
|
|
-export default {
|
|
|
- components: { Panel3, Table3, MultipleYLineChartNormal,FX },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- dialogTitleFX: "",
|
|
|
- dialogVisibleFX: false,
|
|
|
- dialogTitle: "",
|
|
|
- chooseStatus: false,
|
|
|
- dialogVisible: false,
|
|
|
- chooseTime: [],
|
|
|
- wpvalue: "",
|
|
|
- wpid: "",
|
|
|
- wtId: "",
|
|
|
- descName: "",
|
|
|
- AnalysisName: "",
|
|
|
- AnalysisUnit: "",
|
|
|
- Analysis: [
|
|
|
- {
|
|
|
- title: "",
|
|
|
- yAxisIndex: 0, // 使用单位
|
|
|
- value: [],
|
|
|
- },
|
|
|
- ],
|
|
|
- AnalysisYAxises: [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: "",
|
|
|
- max: "",
|
|
|
- unit: "",
|
|
|
- position: "left",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: "",
|
|
|
- max: "",
|
|
|
- unit: "",
|
|
|
- position: "right",
|
|
|
- },
|
|
|
- ],
|
|
|
- selectValue: "60",
|
|
|
- timeoptions: [
|
|
|
- {
|
|
|
- value: "60",
|
|
|
- label: "一分钟",
|
|
|
- },
|
|
|
- {
|
|
|
- value: "300",
|
|
|
- label: "五分钟",
|
|
|
- },
|
|
|
- {
|
|
|
- value: "600",
|
|
|
- label: "十分钟",
|
|
|
- },
|
|
|
- {
|
|
|
- value: "1800",
|
|
|
- label: "三十分钟",
|
|
|
- },
|
|
|
- {
|
|
|
- value: "3600",
|
|
|
- label: "一小时",
|
|
|
- },
|
|
|
- {
|
|
|
- value: "86400",
|
|
|
- label: "一天",
|
|
|
- },
|
|
|
- ],
|
|
|
- wpoptions: "",
|
|
|
- options: [],
|
|
|
- cascaderOptions: [],
|
|
|
- cascaderSel: [],
|
|
|
- cascaderProps: { multiple: true },
|
|
|
- column: [
|
|
|
- "风机偏航过程震动",
|
|
|
- "齿轮箱轴承温升超过40度",
|
|
|
- "三相电流不平衡",
|
|
|
- "断轴或联轴器打滑",
|
|
|
- "风速突变",
|
|
|
- ],
|
|
|
- columnObj: [
|
|
|
- {
|
|
|
- name: "风机编号",
|
|
|
- field: "name",
|
|
|
- width: "100px",
|
|
|
- minWidth: "100px",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "风机偏航过程震动",
|
|
|
- field: "风机偏航过程震动",
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "齿轮箱轴承温升超过40度",
|
|
|
- field: "齿轮箱轴承温升超过40度",
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "三相电流不平衡",
|
|
|
- field: "三相电流不平衡",
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "断轴或联轴器打滑",
|
|
|
- field: "断轴或联轴器打滑",
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "风速突变",
|
|
|
- align: "left",
|
|
|
- field: "风速突变",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- },
|
|
|
- ],
|
|
|
- startdate: new Date(
|
|
|
- new Date(new Date().setDate(new Date().getDate() - 1))
|
|
|
- ).formatDate("yyyy-MM-dd"),
|
|
|
- enddate: new Date(new Date()).formatDate("yyyy-MM-dd"),
|
|
|
- tableData: {
|
|
|
- column: [
|
|
|
- { name: "风机编号", field: "name" },
|
|
|
- {
|
|
|
- name: "主轴温度温差大于8度",
|
|
|
- field: "v1",
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- },
|
|
|
- { name: "浆叶角过小", field: "v2", align: "left", slot: true },
|
|
|
- ],
|
|
|
- data: [{ name: "MG01_01", v1: { count: 12, time: 0 } }],
|
|
|
- },
|
|
|
- };
|
|
|
- },
|
|
|
- created() {
|
|
|
- this.$nextTick(() => {
|
|
|
- this.search();
|
|
|
- });
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //对比
|
|
|
- showChart(column) {
|
|
|
- console.log(column.column.name)
|
|
|
- let that = this;
|
|
|
- that.dialogTitle = column.column.name;
|
|
|
- that.wtId = column.row.name;
|
|
|
- that.descName = column.column.name;
|
|
|
-
|
|
|
- that.requestDetailData(
|
|
|
- that.wpvalue,
|
|
|
- that.startdate,
|
|
|
- that.enddate,
|
|
|
- 60,
|
|
|
- column.row.name,
|
|
|
- column.column.name
|
|
|
- );
|
|
|
- },
|
|
|
- requestDetailData(station, startTs, endTs, interval, wtId, name) {
|
|
|
- let that = this;
|
|
|
- BASE.showLoading();
|
|
|
- that.API.requestData({
|
|
|
- method: "GET",
|
|
|
- subUrl: "/analysis/detail",
|
|
|
- data: {
|
|
|
- // station: that.wpvalue,
|
|
|
- // startTs: new Date(that.startdate).getTime(),
|
|
|
- // endTs: new Date(that.enddate).getTime(),
|
|
|
- // // interval: 360,
|
|
|
- // interval:1,
|
|
|
- // wtId: column.row.name,
|
|
|
- // name: column.column.name,
|
|
|
- station: station,
|
|
|
- startTs: new Date(new Date(startTs).formatDate("yyyy/MM/dd")).getTime(),
|
|
|
- endTs: new Date(new Date(endTs).formatDate("yyyy/MM/dd")).getTime(),
|
|
|
- interval: interval,
|
|
|
- wtId: wtId,
|
|
|
- name: name,
|
|
|
- },
|
|
|
- success(res) {
|
|
|
- if (res.data.length == 1) {
|
|
|
- that.dialogVisible = true;
|
|
|
- BASE.closeLoading();
|
|
|
- let yaxises = [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: 0,
|
|
|
- max: null,
|
|
|
- unit: "",
|
|
|
- position: "left",
|
|
|
- },
|
|
|
- ];
|
|
|
- // yaxises.name = res.data[0].name;
|
|
|
- yaxises.unit = res.data[0].unit;
|
|
|
- that.AnalysisYAxises = yaxises;
|
|
|
- let aKey1 = ["doubleValue"];
|
|
|
- let aList1 = [
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- ];
|
|
|
- aKey1.forEach((keyEle, keyIndex) => {
|
|
|
- aList1[keyIndex].title = res.data[keyIndex].name;
|
|
|
- res.data[keyIndex].data.forEach((rEle) => {
|
|
|
- aList1[keyIndex].value.push({
|
|
|
- text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
- value: rEle.doubleValue,
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- that.Analysis = aList1;
|
|
|
- } else if (res.data.length == 2) {
|
|
|
- that.dialogVisible = true;
|
|
|
- BASE.closeLoading();
|
|
|
- let aKey2 = ["doubleValue", "doubleValue"];
|
|
|
- let aList2 = [
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- ];
|
|
|
- let yaxises1 = [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: 0,
|
|
|
- max: null,
|
|
|
- unit: "",
|
|
|
- position: "left",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: 0,
|
|
|
- max: null,
|
|
|
- unit: "",
|
|
|
- position: "right",
|
|
|
- },
|
|
|
- ];
|
|
|
- yaxises1.forEach((aEle, aIndex) => {
|
|
|
- res.data.forEach((rEle) => {
|
|
|
- // aEle.name = rEle.name;
|
|
|
- aEle.unit = rEle.unit;
|
|
|
- });
|
|
|
- });
|
|
|
- that.AnalysisYAxises = yaxises1;
|
|
|
- aKey2.forEach((keyEle, keyIndex) => {
|
|
|
- aList2[keyIndex].title = res.data[keyIndex].name;
|
|
|
- res.data[keyIndex].data.forEach((rEle) => {
|
|
|
- aList2[keyIndex].value.push({
|
|
|
- text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
- value: rEle.doubleValue,
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- // res.data.forEach((rEle,rIndex)=>{
|
|
|
- // })
|
|
|
- // aKey2.forEach((keyEle, keyIndex) => {
|
|
|
- // res.data.forEach((rEle) => {
|
|
|
- // // alist2[keyIndex].yAxisIndex = keyIndex;
|
|
|
- // aList2[keyIndex].title = res.data[keyIndex].name;
|
|
|
- // rEle.data.forEach((tEle,tIndex) => {
|
|
|
- // aList2[keyIndex].value.push({
|
|
|
- // text: new Date(tEle.ts).formatDate("hh:mm"),
|
|
|
- // // value: tEle[keyEle],
|
|
|
- // // value:res.data[keyIndex].data[tIndex].doubleValue
|
|
|
+ import Panel3 from "../../components/coms/panel/panel3.vue";
|
|
|
+ import Table3 from "../../components/coms/table/table3.vue";
|
|
|
+ import MultipleYLineChartNormal from "./multiple-y-line-chart-normal.vue";
|
|
|
+ import FX from "./alarm-center-yjfx.vue";
|
|
|
+ import BASE from '@tools/basicTool.js';
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ Panel3,
|
|
|
+ Table3,
|
|
|
+ MultipleYLineChartNormal,
|
|
|
+ FX
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogTitleFX: "",
|
|
|
+ dialogVisibleFX: false,
|
|
|
+ dialogTitle: "",
|
|
|
+ chooseStatus: false,
|
|
|
+ dialogVisible: false,
|
|
|
+ chooseTime: [],
|
|
|
+ wpvalue: "",
|
|
|
+ wpid: "",
|
|
|
+ wtId: "",
|
|
|
+ descName: "",
|
|
|
+ AnalysisName: "",
|
|
|
+ AnalysisUnit: "",
|
|
|
+ Analysis: [{
|
|
|
+ title: "",
|
|
|
+ yAxisIndex: 0, // 使用单位
|
|
|
+ value: [],
|
|
|
+ }, ],
|
|
|
+ AnalysisYAxises: [{
|
|
|
+ name: "",
|
|
|
+ min: "",
|
|
|
+ max: "",
|
|
|
+ unit: "",
|
|
|
+ position: "left",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ min: "",
|
|
|
+ max: "",
|
|
|
+ unit: "",
|
|
|
+ position: "right",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ selectValue: "60",
|
|
|
+ timeoptions: [{
|
|
|
+ value: "60",
|
|
|
+ label: "一分钟",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "300",
|
|
|
+ label: "五分钟",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "600",
|
|
|
+ label: "十分钟",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "1800",
|
|
|
+ label: "三十分钟",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "3600",
|
|
|
+ label: "一小时",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value: "86400",
|
|
|
+ label: "一天",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ wpoptions: "",
|
|
|
+ options: [],
|
|
|
+ cascaderOptions: [],
|
|
|
+ cascaderSel: [],
|
|
|
+ cascaderProps: {
|
|
|
+ multiple: true
|
|
|
+ },
|
|
|
+ column: [
|
|
|
+ "风机偏航过程震动",
|
|
|
+ "齿轮箱轴承温升超过40度",
|
|
|
+ "三相电流不平衡",
|
|
|
+ "断轴或联轴器打滑",
|
|
|
+ "风速突变",
|
|
|
+ ],
|
|
|
+ columnObj: [{
|
|
|
+ name: "风机编号",
|
|
|
+ field: "name",
|
|
|
+ width: "100px",
|
|
|
+ minWidth: "100px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "风机偏航过程震动",
|
|
|
+ field: "风机偏航过程震动",
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "齿轮箱轴承温升超过40度",
|
|
|
+ field: "齿轮箱轴承温升超过40度",
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "三相电流不平衡",
|
|
|
+ field: "三相电流不平衡",
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "断轴或联轴器打滑",
|
|
|
+ field: "断轴或联轴器打滑",
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "风速突变",
|
|
|
+ align: "left",
|
|
|
+ field: "风速突变",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ startdate: new Date(
|
|
|
+ new Date(new Date().setDate(new Date().getDate() - 1))
|
|
|
+ ).formatDate("yyyy-MM-dd"),
|
|
|
+ enddate: new Date(new Date()).formatDate("yyyy-MM-dd"),
|
|
|
+ tableData: {
|
|
|
+ column: [{
|
|
|
+ name: "风机编号",
|
|
|
+ field: "name"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "主轴温度温差大于8度",
|
|
|
+ field: "v1",
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "浆叶角过小",
|
|
|
+ field: "v2",
|
|
|
+ align: "left",
|
|
|
+ slot: true
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ data: [{
|
|
|
+ name: "MG01_01",
|
|
|
+ v1: {
|
|
|
+ count: 12,
|
|
|
+ time: 0
|
|
|
+ }
|
|
|
+ }],
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ this.$nextTick(() => {
|
|
|
+ this.search();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //对比
|
|
|
+ showChart(column) {
|
|
|
+ let that = this;
|
|
|
+ that.dialogTitle = column.column.name;
|
|
|
+ that.wtId = column.row.name;
|
|
|
+ that.descName = column.column.name;
|
|
|
|
|
|
- // });
|
|
|
- // });
|
|
|
- // });
|
|
|
- // });
|
|
|
+ that.requestDetailData(
|
|
|
+ that.wpvalue,
|
|
|
+ that.startdate,
|
|
|
+ that.enddate,
|
|
|
+ 60,
|
|
|
+ column.row.name,
|
|
|
+ column.column.name
|
|
|
+ );
|
|
|
+ },
|
|
|
+ requestDetailData(station, startTs, endTs, interval, wtId, name) {
|
|
|
+ let that = this;
|
|
|
+ BASE.showLoading();
|
|
|
+ that.API.requestData({
|
|
|
+ method: "GET",
|
|
|
+ subUrl: "/analysis/detail",
|
|
|
+ data: {
|
|
|
+ // station: that.wpvalue,
|
|
|
+ // startTs: new Date(that.startdate).getTime(),
|
|
|
+ // endTs: new Date(that.enddate).getTime(),
|
|
|
+ // // interval: 360,
|
|
|
+ // interval:1,
|
|
|
+ // wtId: column.row.name,
|
|
|
+ // name: column.column.name,
|
|
|
+ station: station,
|
|
|
+ startTs: new Date(new Date(startTs).formatDate("yyyy/MM/dd")).getTime(),
|
|
|
+ endTs: new Date(new Date(endTs).formatDate("yyyy/MM/dd")).getTime(),
|
|
|
+ interval: interval,
|
|
|
+ wtId: wtId,
|
|
|
+ name: name,
|
|
|
+ },
|
|
|
+ success(res) {
|
|
|
+ if (res.data.length == 1) {
|
|
|
+ that.dialogVisible = true;
|
|
|
+ BASE.closeLoading();
|
|
|
+ let yaxises = [{
|
|
|
+ name: "",
|
|
|
+ min: 0,
|
|
|
+ max: null,
|
|
|
+ unit: "",
|
|
|
+ position: "left",
|
|
|
+ }, ];
|
|
|
+ // yaxises.name = res.data[0].name;
|
|
|
+ yaxises.unit = res.data[0].unit;
|
|
|
+ that.AnalysisYAxises = yaxises;
|
|
|
+ let aKey1 = ["doubleValue"];
|
|
|
+ let aList1 = [{
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ }, ];
|
|
|
+ aKey1.forEach((keyEle, keyIndex) => {
|
|
|
+ aList1[keyIndex].title = res.data[keyIndex].name;
|
|
|
+ res.data[keyIndex].data.forEach((rEle) => {
|
|
|
+ aList1[keyIndex].value.push({
|
|
|
+ text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
+ value: rEle.doubleValue,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ that.Analysis = aList1;
|
|
|
+ } else if (res.data.length == 2) {
|
|
|
+ that.dialogVisible = true;
|
|
|
+ BASE.closeLoading();
|
|
|
+ let aKey2 = ["doubleValue", "doubleValue"];
|
|
|
+ let aList2 = [{
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ let yaxises1 = [{
|
|
|
+ name: "",
|
|
|
+ min: 0,
|
|
|
+ max: null,
|
|
|
+ unit: "",
|
|
|
+ position: "left",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ min: 0,
|
|
|
+ max: null,
|
|
|
+ unit: "",
|
|
|
+ position: "right",
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ yaxises1.forEach((aEle, aIndex) => {
|
|
|
+ res.data.forEach((rEle) => {
|
|
|
+ // aEle.name = rEle.name;
|
|
|
+ aEle.unit = rEle.unit;
|
|
|
+ });
|
|
|
+ });
|
|
|
+ that.AnalysisYAxises = yaxises1;
|
|
|
+ aKey2.forEach((keyEle, keyIndex) => {
|
|
|
+ aList2[keyIndex].title = res.data[keyIndex].name;
|
|
|
+ res.data[keyIndex].data.forEach((rEle) => {
|
|
|
+ aList2[keyIndex].value.push({
|
|
|
+ text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
+ value: rEle.doubleValue,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ // res.data.forEach((rEle,rIndex)=>{
|
|
|
+ // })
|
|
|
+ // aKey2.forEach((keyEle, keyIndex) => {
|
|
|
+ // res.data.forEach((rEle) => {
|
|
|
+ // // alist2[keyIndex].yAxisIndex = keyIndex;
|
|
|
+ // aList2[keyIndex].title = res.data[keyIndex].name;
|
|
|
+ // rEle.data.forEach((tEle,tIndex) => {
|
|
|
+ // aList2[keyIndex].value.push({
|
|
|
+ // text: new Date(tEle.ts).formatDate("hh:mm"),
|
|
|
+ // // value: tEle[keyEle],
|
|
|
+ // // value:res.data[keyIndex].data[tIndex].doubleValue
|
|
|
|
|
|
- that.Analysis = aList2;
|
|
|
- } else if (res.data.length == 4) {
|
|
|
- that.dialogVisible = true;
|
|
|
- BASE.closeLoading();
|
|
|
- let aKey4 = [
|
|
|
- "doubleValue",
|
|
|
- "doubleValue",
|
|
|
- "doubleValue",
|
|
|
- "doubleValue",
|
|
|
- ];
|
|
|
- let aList4 = [
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- {
|
|
|
- title: "",
|
|
|
- // yAxisIndex:"",
|
|
|
- smooth: true,
|
|
|
- value: [],
|
|
|
- },
|
|
|
- ];
|
|
|
- let yaxises2 = [
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: 0,
|
|
|
- max: null,
|
|
|
- unit: "",
|
|
|
- position: "left",
|
|
|
- },
|
|
|
- {
|
|
|
- name: "",
|
|
|
- min: 0,
|
|
|
- max: null,
|
|
|
- unit: "",
|
|
|
- position: "right",
|
|
|
- },
|
|
|
- ];
|
|
|
- yaxises2.forEach((aEle, aIndex) => {
|
|
|
- res.data.forEach((rEle) => {
|
|
|
- // aEle.name = rEle.name;
|
|
|
- aEle.unit = rEle.unit;
|
|
|
- });
|
|
|
- });
|
|
|
- that.AnalysisYAxises = yaxises2;
|
|
|
- aKey4.forEach((keyEle, keyIndex) => {
|
|
|
- aList4[keyIndex].title = res.data[keyIndex].name;
|
|
|
- res.data[keyIndex].data.forEach((rEle) => {
|
|
|
- aList4[keyIndex].value.push({
|
|
|
- text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
- value: rEle.doubleValue,
|
|
|
- });
|
|
|
- });
|
|
|
- });
|
|
|
- that.Analysis = aList4;
|
|
|
- } else if (res.data.length == 0) {
|
|
|
- that.dialogVisible = false;
|
|
|
- BASE.closeLoading();
|
|
|
- that.BASE.showMsg({
|
|
|
- type: "warning",
|
|
|
- msg: "暂无数据",
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
- //切换数据类型
|
|
|
- switchChange(interval,status) {
|
|
|
- if(status === 'interval') {
|
|
|
- this.chooseStatus = false
|
|
|
- this.selectValue = '60'
|
|
|
- }else if(status === 'original'){
|
|
|
- this.chooseStatus = true
|
|
|
- }
|
|
|
- this.requestDetailData(
|
|
|
- this.wpvalue,
|
|
|
- this.startdate,
|
|
|
- this.enddate,
|
|
|
- interval,
|
|
|
- this.wtId,
|
|
|
- this.descName
|
|
|
- );
|
|
|
- },
|
|
|
+ // });
|
|
|
+ // });
|
|
|
+ // });
|
|
|
+ // });
|
|
|
|
|
|
- async search() {
|
|
|
- const { data } = await this.API.requestData({
|
|
|
- subUrl: "powercompare/windfarmAjax",
|
|
|
- });
|
|
|
- this.wpoptions = data.data;
|
|
|
- this.wpvalue = data.data[0].id;
|
|
|
- this.searchData();
|
|
|
- },
|
|
|
+ that.Analysis = aList2;
|
|
|
+ } else if (res.data.length == 4) {
|
|
|
+ that.dialogVisible = true;
|
|
|
+ BASE.closeLoading();
|
|
|
+ let aKey4 = [
|
|
|
+ "doubleValue",
|
|
|
+ "doubleValue",
|
|
|
+ "doubleValue",
|
|
|
+ "doubleValue",
|
|
|
+ ];
|
|
|
+ let aList4 = [{
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: "",
|
|
|
+ // yAxisIndex:"",
|
|
|
+ smooth: true,
|
|
|
+ value: [],
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ let yaxises2 = [{
|
|
|
+ name: "",
|
|
|
+ min: 0,
|
|
|
+ max: null,
|
|
|
+ unit: "",
|
|
|
+ position: "left",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "",
|
|
|
+ min: 0,
|
|
|
+ max: null,
|
|
|
+ unit: "",
|
|
|
+ position: "right",
|
|
|
+ },
|
|
|
+ ];
|
|
|
+ yaxises2.forEach((aEle, aIndex) => {
|
|
|
+ res.data.forEach((rEle) => {
|
|
|
+ // aEle.name = rEle.name;
|
|
|
+ aEle.unit = rEle.unit;
|
|
|
+ });
|
|
|
+ });
|
|
|
+ that.AnalysisYAxises = yaxises2;
|
|
|
+ aKey4.forEach((keyEle, keyIndex) => {
|
|
|
+ aList4[keyIndex].title = res.data[keyIndex].name;
|
|
|
+ res.data[keyIndex].data.forEach((rEle) => {
|
|
|
+ aList4[keyIndex].value.push({
|
|
|
+ text: new Date(rEle.ts).formatDate("hh:mm"),
|
|
|
+ value: rEle.doubleValue,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ });
|
|
|
+ that.Analysis = aList4;
|
|
|
+ } else if (res.data.length == 0) {
|
|
|
+ that.dialogVisible = false;
|
|
|
+ BASE.closeLoading();
|
|
|
+ that.BASE.showMsg({
|
|
|
+ type: "warning",
|
|
|
+ msg: "暂无数据",
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //切换数据类型
|
|
|
+ switchChange(interval, status) {
|
|
|
+ if (status === 'interval') {
|
|
|
+ this.chooseStatus = false
|
|
|
+ this.selectValue = '60'
|
|
|
+ } else if (status === 'original') {
|
|
|
+ this.chooseStatus = true
|
|
|
+ }
|
|
|
+ this.requestDetailData(
|
|
|
+ this.wpvalue,
|
|
|
+ this.startdate,
|
|
|
+ this.enddate,
|
|
|
+ interval,
|
|
|
+ this.wtId,
|
|
|
+ this.descName
|
|
|
+ );
|
|
|
+ },
|
|
|
|
|
|
- async searchTree() {
|
|
|
- let arr = [];
|
|
|
- let columnObj = [
|
|
|
- {
|
|
|
- name: "风机编号",
|
|
|
- field: "name",
|
|
|
- minWidth: "100px",
|
|
|
- },
|
|
|
- ];
|
|
|
- this.cascaderSel.forEach((e) => {
|
|
|
- let obj = {
|
|
|
- name: e[1],
|
|
|
- field: e[1],
|
|
|
- align: "left",
|
|
|
- slot: true,
|
|
|
- sortable: true,
|
|
|
- minWidth: "200px",
|
|
|
- };
|
|
|
- columnObj.push(obj);
|
|
|
+ async search() {
|
|
|
+ const {
|
|
|
+ data
|
|
|
+ } = await this.API.requestData({
|
|
|
+ subUrl: "powercompare/windfarmAjax",
|
|
|
+ });
|
|
|
+ this.wpoptions = data.data;
|
|
|
+ this.wpvalue = data.data[0].id;
|
|
|
+ this.searchData();
|
|
|
+ },
|
|
|
|
|
|
- arr.push(e[1]);
|
|
|
- });
|
|
|
- this.columnObj = columnObj;
|
|
|
- this.column = arr;
|
|
|
- this.searchData();
|
|
|
- },
|
|
|
+ async searchTree() {
|
|
|
+ let arr = [];
|
|
|
+ let columnObj = [{
|
|
|
+ name: "风机编号",
|
|
|
+ field: "name",
|
|
|
+ minWidth: "100px",
|
|
|
+ }, ];
|
|
|
+ this.cascaderSel.forEach((e) => {
|
|
|
+ let obj = {
|
|
|
+ name: e[1],
|
|
|
+ field: e[1],
|
|
|
+ align: "left",
|
|
|
+ slot: true,
|
|
|
+ sortable: true,
|
|
|
+ minWidth: "200px",
|
|
|
+ };
|
|
|
+ columnObj.push(obj);
|
|
|
|
|
|
- async searchData() {
|
|
|
- const { data } = await this.API.requestData({
|
|
|
- baseURL: "http://192.168.1.18:8075/",
|
|
|
- subUrl: "alarm/count/query/new2",
|
|
|
- data: {
|
|
|
- stationid: this.wpvalue,
|
|
|
- startdate: new Date(this.startdate).formatDate("yyyy-MM-dd"),
|
|
|
- enddate: new Date(this.enddate).formatDate("yyyy-MM-dd"),
|
|
|
- },
|
|
|
- });
|
|
|
- ////////
|
|
|
- const resData = data.data;
|
|
|
- // const resData =this.resdata;
|
|
|
- const column = this.columnObj;
|
|
|
- let dataAll = []; // 总数据集合
|
|
|
- resData.forEach((e) => {
|
|
|
- let obj = {
|
|
|
- name: Object.keys(e)[0],
|
|
|
- };
|
|
|
- let wpid = Object.keys(e)[0];
|
|
|
- this.wpid = wpid;
|
|
|
+ arr.push(e[1]);
|
|
|
+ });
|
|
|
+ this.columnObj = columnObj;
|
|
|
+ this.column = arr;
|
|
|
+ this.searchData();
|
|
|
+ },
|
|
|
|
|
|
- e[wpid].forEach((k) => {
|
|
|
- column.forEach((c) => {
|
|
|
- if (k.alertText == c.name) {
|
|
|
- let obj1 = {
|
|
|
- count: k.count,
|
|
|
- time: k.time,
|
|
|
- };
|
|
|
- obj[k.alertText] = obj1;
|
|
|
- }
|
|
|
- });
|
|
|
- });
|
|
|
- dataAll.push(obj);
|
|
|
- });
|
|
|
- this.tableData.column = column;
|
|
|
- this.tableData.data = dataAll;
|
|
|
- ///////////////////// 获取规则list
|
|
|
- const map = {};
|
|
|
- var windNum = [];
|
|
|
- for (let i in resData) {
|
|
|
- for (let k in resData[i]) {
|
|
|
- map[k] = resData[i][k];
|
|
|
- }
|
|
|
- }
|
|
|
- // nmap为新的map 整理数据结构
|
|
|
- const nmap = {};
|
|
|
- for (let kv in map) {
|
|
|
- var nchildMap = {};
|
|
|
- var childrenMap = map[kv];
|
|
|
- for (var ckv in childrenMap) {
|
|
|
- var cckey = childrenMap[ckv].alertText;
|
|
|
- var ccvalue = childrenMap[ckv];
|
|
|
- nchildMap[cckey] = ccvalue;
|
|
|
- }
|
|
|
- nmap[kv] = nchildMap;
|
|
|
- }
|
|
|
- windNum = Object.keys(nmap);
|
|
|
- var cascaderOptions = [];
|
|
|
- var root = {}; // 原始根节点
|
|
|
- var clumnsOnes = nmap[windNum[0]];
|
|
|
- for (let k in clumnsOnes) {
|
|
|
- let f = clumnsOnes[k].relatePartsText
|
|
|
- ? clumnsOnes[k].relatePartsText
|
|
|
- : "其他";
|
|
|
- let fvalue = clumnsOnes[k].relateParts ? clumnsOnes[k].relateParts : "";
|
|
|
+ async searchData() {
|
|
|
+ const {
|
|
|
+ data
|
|
|
+ } = await this.API.requestData({
|
|
|
+ showLoading:true,
|
|
|
+ baseURL: "http://192.168.1.18:8075/",
|
|
|
+ subUrl: "alarm/count/query/new2",
|
|
|
+ data: {
|
|
|
+ stationid: this.wpvalue,
|
|
|
+ startdate: new Date(this.startdate).formatDate("yyyy-MM-dd"),
|
|
|
+ enddate: new Date(this.enddate).formatDate("yyyy-MM-dd"),
|
|
|
+ },
|
|
|
+ });
|
|
|
+ ////////
|
|
|
+ this.tableData = [];
|
|
|
+ const resData = data.data;
|
|
|
+ // const resData =this.resdata;
|
|
|
+ const column = this.columnObj;
|
|
|
+ let dataAll = []; // 总数据集合
|
|
|
+ resData.forEach((e) => {
|
|
|
+ let obj = {
|
|
|
+ name: Object.keys(e)[0],
|
|
|
+ };
|
|
|
+ let wpid = Object.keys(e)[0];
|
|
|
+ this.wpid = wpid;
|
|
|
|
|
|
- if (root[f]) {
|
|
|
- // 已经存在此子节点
|
|
|
- if (!root[f].children[k]) {
|
|
|
- // 不存在子节点
|
|
|
- root[f].children[k] = {};
|
|
|
- root[f].children[k].value = root[f].children[k].label = k;
|
|
|
- root[f].fobj.children.push(root[f].children[k]);
|
|
|
- }
|
|
|
- } // 不存在子节点
|
|
|
- else {
|
|
|
- root[f] = {};
|
|
|
- // root[f].value = fvalue;
|
|
|
- // root[f].label = f;
|
|
|
- root[f].children = {};
|
|
|
- root[f].children[k] = {};
|
|
|
- root[f].children[k].value = root[f].children[k].label = k;
|
|
|
+ e[wpid].forEach((k) => {
|
|
|
+ column.forEach((c) => {
|
|
|
+ if (k.alertText == c.name) {
|
|
|
+ let obj1 = {
|
|
|
+ count: k.count,
|
|
|
+ countStyle:((k.count / (k.count + k.time)) * 100) + 'px',
|
|
|
+ time: k.time,
|
|
|
+ timeStyle:((k.time / (k.count + k.time)) * 100) + 'px'
|
|
|
+ };
|
|
|
+ obj[k.alertText] = obj1;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ dataAll.push(obj);
|
|
|
+ });
|
|
|
+
|
|
|
+ this.tableData.column = column;
|
|
|
+ this.tableData.data = dataAll;
|
|
|
+
|
|
|
+ ///////////////////// 获取规则list
|
|
|
+ const map = {};
|
|
|
+ var windNum = [];
|
|
|
+ for (let i in resData) {
|
|
|
+ for (let k in resData[i]) {
|
|
|
+ map[k] = resData[i][k];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // nmap为新的map 整理数据结构
|
|
|
+ const nmap = {};
|
|
|
+ for (let kv in map) {
|
|
|
+ var nchildMap = {};
|
|
|
+ var childrenMap = map[kv];
|
|
|
+ for (var ckv in childrenMap) {
|
|
|
+ var cckey = childrenMap[ckv].alertText;
|
|
|
+ var ccvalue = childrenMap[ckv];
|
|
|
+ nchildMap[cckey] = ccvalue;
|
|
|
+ }
|
|
|
+ nmap[kv] = nchildMap;
|
|
|
+ }
|
|
|
+ windNum = Object.keys(nmap);
|
|
|
+ var cascaderOptions = [];
|
|
|
+ var root = {}; // 原始根节点
|
|
|
+ var clumnsOnes = nmap[windNum[0]];
|
|
|
+ for (let k in clumnsOnes) {
|
|
|
+ let f = clumnsOnes[k].relatePartsText ?
|
|
|
+ clumnsOnes[k].relatePartsText :
|
|
|
+ "其他";
|
|
|
+ let fvalue = clumnsOnes[k].relateParts ? clumnsOnes[k].relateParts : "";
|
|
|
|
|
|
- // 将对象放入 cascaderOptions
|
|
|
- let childrenArray = [];
|
|
|
- childrenArray.push(root[f].children[k]);
|
|
|
- let fobj = {};
|
|
|
- fobj.value = fvalue;
|
|
|
- fobj.label = f;
|
|
|
- fobj.children = childrenArray;
|
|
|
- cascaderOptions.push(fobj);
|
|
|
- root[f].fobj = fobj;
|
|
|
- }
|
|
|
- }
|
|
|
- this.cascaderOptions = cascaderOptions;
|
|
|
- },
|
|
|
- fx(){
|
|
|
- this.startdate=new Date(this.startdate).formatDate("yyyy-MM-dd");
|
|
|
- this.dialogTitleFX= "预警分析";
|
|
|
- this.dialogVisibleFX= true;
|
|
|
- }
|
|
|
- },
|
|
|
-};
|
|
|
+ if (root[f]) {
|
|
|
+ // 已经存在此子节点
|
|
|
+ if (!root[f].children[k]) {
|
|
|
+ // 不存在子节点
|
|
|
+ root[f].children[k] = {};
|
|
|
+ root[f].children[k].value = root[f].children[k].label = k;
|
|
|
+ root[f].fobj.children.push(root[f].children[k]);
|
|
|
+ }
|
|
|
+ } // 不存在子节点
|
|
|
+ else {
|
|
|
+ root[f] = {};
|
|
|
+ // root[f].value = fvalue;
|
|
|
+ // root[f].label = f;
|
|
|
+ root[f].children = {};
|
|
|
+ root[f].children[k] = {};
|
|
|
+ root[f].children[k].value = root[f].children[k].label = k;
|
|
|
+
|
|
|
+ // 将对象放入 cascaderOptions
|
|
|
+ let childrenArray = [];
|
|
|
+ childrenArray.push(root[f].children[k]);
|
|
|
+ let fobj = {};
|
|
|
+ fobj.value = fvalue;
|
|
|
+ fobj.label = f;
|
|
|
+ fobj.children = childrenArray;
|
|
|
+ cascaderOptions.push(fobj);
|
|
|
+ root[f].fobj = fobj;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.cascaderOptions = cascaderOptions;
|
|
|
+ },
|
|
|
+ fx() {
|
|
|
+ this.startdate = new Date(this.startdate).formatDate("yyyy-MM-dd");
|
|
|
+ this.dialogTitleFX = "预警分析";
|
|
|
+ this.dialogVisibleFX = true;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
-.alarm-center-1 {
|
|
|
- .action-bar {
|
|
|
- display: flex;
|
|
|
+ .alarm-center-1 {
|
|
|
+ .action-bar {
|
|
|
+ display: flex;
|
|
|
+
|
|
|
+ .query {
|
|
|
+ justify-content: flex-start;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .query {
|
|
|
- justify-content: flex-start;
|
|
|
- }
|
|
|
- }
|
|
|
+ .table-panel {
|
|
|
+ width: 100%;
|
|
|
+ background: transparent;
|
|
|
+ padding: 0;
|
|
|
|
|
|
- .table-panel {
|
|
|
- width: 100%;
|
|
|
- background: transparent;
|
|
|
- padding: 0;
|
|
|
+ .bar {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ height: 16px;
|
|
|
+ margin: 8px 0;
|
|
|
|
|
|
- .bar {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- height: 16px;
|
|
|
- margin: 8px 0;
|
|
|
+ .bar-percent {
|
|
|
+ height: 100%;
|
|
|
+ background: @green;
|
|
|
+ margin-right: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .bar-percent {
|
|
|
- height: 100%;
|
|
|
- background: @green;
|
|
|
- margin-right: 8px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .searchForm {
|
|
|
- display: flex;
|
|
|
- margin-left: 36px;
|
|
|
- flex-direction: row-reverse;
|
|
|
- .inputs {
|
|
|
- width: 15%;
|
|
|
- margin-right: 18px;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
+ .searchForm {
|
|
|
+ display: flex;
|
|
|
+ margin-left: 36px;
|
|
|
+ flex-direction: row-reverse;
|
|
|
+
|
|
|
+ .inputs {
|
|
|
+ width: 15%;
|
|
|
+ margin-right: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
Koishi