123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977 |
- <template>
- <div class="global-variable">
- <div class="head">
- <div class="headleft">
- <div @click="generate('1')" class="picture">
- <img src="@/assets/analyse/03.png" alt="" />
- <p>时域图</p>
- </div>
- <div @click="generate('2')" class="picture">
- <img src="@/assets/analyse/04.png" alt="" />
- <p>频谱图</p>
- </div>
- <div @click="generate('3')" class="picture">
- <img src="@/assets/analyse/01.png" alt="" />
- <p>包络谱图</p>
- </div>
- <div @click="tendency" class="picture">
- <img src="@/assets/analyse/02.png" alt="" />
- <p>趋势图</p>
- </div>
- </div>
- <div class="headright">
- <img src="@/assets/analyse/07.png" alt="全部缩小" @click="suoxiao" />
- <img src="@/assets/analyse/05.png" alt="全部展开" @click="zhankai" />
- <img src="@/assets/analyse/06.png" alt="全部关闭" @click="guanbi" />
- </div>
- </div>
- <div class="searchbox">
- <p>
- 单位:
- <selecttree
- size="small"
- style="width: 180px"
- placeholder="请选择所属公司"
- :list="parentOpt"
- type="1"
- v-model="companyCode"
- @change="parentChange"
- :defaultParentProps="{
- children: 'children',
- label: 'companyName',
- value: 'codeNumber',
- }"
- >
- </selecttree>
- </p>
- <p>
- 风机:
- <el-select
- style="width: 150px"
- v-model="unitvalue"
- @change="getchedian"
- placeholder="请选择"
- size="small"
- >
- <el-option
- v-for="item in unitoptions"
- :key="item.engineCode"
- :label="item.engineName"
- :value="item.engineCode"
- >
- </el-option>
- </el-select>
- </p>
- <p>
- 测点:
- <el-select
- v-model="monitoringvalue"
- clearable
- size="small"
- placeholder="请选择"
- >
- <el-option
- v-for="item in monitoringoptions"
- :key="item.itemKey"
- :label="item.itemValue"
- :value="item.itemKey"
- >
- </el-option>
- </el-select>
- </p>
- <p>
- 时间:
- <el-date-picker
- v-model="timevalue"
- type="datetimerange"
- range-separator="至"
- start-placeholder="开始日期"
- end-placeholder="结束日期"
- size="small"
- >
- </el-date-picker>
- </p>
- <el-button type="primary" size="small" @click="conditions"
- >查询</el-button
- >
- <el-button size="small" @click="outputFile">导出</el-button>
- </div>
- <div class="main-body">
- <div class="data-map">
- <div
- class="chart-area"
- v-for="(item, index) in fourList"
- :key="item.index"
- @mouseover="setCurrent(item.rowData)"
- @mouseleave="setCurrent(oldCurrentRow)"
- >
- <div class="dialog-actions">
- <p>{{ item.name }}</p>
- <span>
- <i
- class="el-icon-minus"
- @click="lessen(index)"
- style="cursor: pointer; margin-right: 10px"
- ></i>
- <i
- class="el-icon-full-screen"
- @click="amplifier(index)"
- style="cursor: pointer; margin-right: 10px"
- ></i>
- <i
- class="el-icon-close"
- @click="close(index)"
- style="cursor: pointer"
- ></i>
- </span>
- </div>
- <div
- class="subject"
- :class="{
- minimized: item.isMinimized,
- }"
- v-loading="item.loading"
- >
- <!-- {{ item.rowData }} -->
- <p v-if="item.name != '趋势图'">
- 测点路径:{{
- NewgetDetectionPointCn(item?.rowData?.mesurePointName)
- }}-{{ item?.rowData?.windTurbineNumber }}
- <span>采样频率: {{ item?.rowData?.samplingFrequency }}(Hz)</span>
- <span
- >发电机转速: {{ item?.rowData?.rotationalSpeed }}(rpm)
- </span>
- <span>采样时间: {{ item?.rowData?.timeStamp }} </span>
- <!-- <span>有效值: {{XrmsValue}} (m/s2)</span> -->
- </p>
- <!-- {{ samplingTime }} -->
- <div v-if="item.name === '时域图'">
- <timedomaincharts
- :timeListTwo="item.timeListTwo"
- :currentIndex="currentIndex"
- :activeIndex="index"
- :tableDataList="tableDataList"
- :ids="[currentRow.id]"
- :currentRow="currentRow"
- :windCode="windCode"
- @update:currentIndex="handleCurrentIndexUpdate"
- @update-previous-row="goToPreviousRow"
- @update-next-row="goToNextRow"
- @handleLoading="handleLoading"
- ></timedomaincharts>
- </div>
- <div v-if="item.name === '频谱图'">
- <spectrogramcharts
- @updateXrms="handleXrmsUpdate"
- :spectrumListTwo="item.spectrumListTwo"
- :currentIndex="currentIndex"
- :tableDataList="tableDataList"
- :activeIndex="index"
- :ids="[currentRow.id]"
- :currentRow="currentRow"
- :windCode="windCode"
- @update:currentIndex="handleCurrentIndexUpdate"
- @update-previous-row="goToPreviousRow"
- @update-next-row="goToNextRow"
- @handleLoading="handleLoading"
- ></spectrogramcharts>
- </div>
- <div v-if="item.name === '包络谱图'">
- <envelopecharts
- @updateXrms="handleXrmsUpdate"
- :envelopeListTwo="item.envelopeListTwo"
- :currentIndex="currentIndex"
- :tableDataList="tableDataList"
- :activeIndex="index"
- :currentRow="currentRow"
- :ids="[currentRow.id]"
- :windCode="windCode"
- @update:currentIndex="handleCurrentIndexUpdate"
- @update-previous-row="goToPreviousRow"
- @update-next-row="goToNextRow"
- @update:modelValue="handleModelUpdate"
- @handleLoading="handleLoading"
- ></envelopecharts>
- </div>
- <div v-if="item.name === '趋势图'">
- <tendencycharts
- :qsList="qsList"
- :activeIndex="index"
- ></tendencycharts>
- </div>
- </div>
- </div>
- </div>
- <div class="data-origin">
- <el-table
- height="600"
- ref="singleTable"
- :data="tableDataList"
- :current-row-key="currentIndex"
- @current-change="handleCurrentChange"
- highlight-current-row
- style="width: 100%"
- :row-class-name="tableRowClassName"
- id="Table1"
- >
- <el-table-column type="index" label="排序" fixed> </el-table-column>
- <el-table-column prop="timeStamp" label="采样时间" width="180px">
- </el-table-column>
- <el-table-column label="测点名称" width="150px">
- <template slot-scope="scope">
- {{
- pointNameMap[scope.row.mesurePointName] ||
- scope.row.mesurePointName
- }}
- </template>
- </el-table-column>
- <!-- <el-table-column prop="companyName" label="场站">
- {{ getCompanyLabel(scope.row.companyCode) }}
-
- </el-table-column> -->
- <el-table-column prop="windTurbineNumber" label="风机" width="120px">
- </el-table-column>
- <el-table-column
- prop="samplingFrequency"
- label="采样频率(Hz)"
- align="center"
- width="120px"
- >
- </el-table-column>
- <el-table-column
- prop="rotationalSpeed"
- label="发电机转速(rpm)"
- align="center"
- width="150px"
- >
- </el-table-column>
- </el-table>
- </div>
- </div>
- </div>
- </template>
- <script>
- import * as FileSaver from "file-saver";
- import * as XLSX from "xlsx";
- import {
- getSysOrganizationAuthTreeByRoleId,
- windEngineGrouPage,
- queryDetectionDic,
- } from "@/api/ledger.js";
- import selecttree from "../../components/selecttree.vue";
- import envelopecharts from "./components/envelopecharts.vue";
- import spectrogramcharts from "./components/spectrogramcharts.vue";
- import tendencycharts from "./components/tendencycharts.vue";
- import timedomaincharts from "./components/timedomaincharts.vue";
- import axios from "axios";
- // 放在 <script> 外部
- export default {
- components: {
- envelopecharts,
- spectrogramcharts,
- tendencycharts,
- timedomaincharts,
- selecttree,
- },
- data() {
- return {
- chartData: [],
- chartLabels: [],
- unitvale: "",
- company: "",
- companyoptions: [],
- unitvalue: "",
- unitoptions: [],
- monitoringvalue: "",
- monitoringoptions: [
- // {
- // detectionPointEn: "name",
- // detectionPointCn: "中文",
- // },
- ],
- fourList: [],
- currentRow: null, // 用于存储当前选中的行
- currentIndex: 0,
- isChartVisible: false,
- parentOpt: [],
- defaultdata: {},
- companyCode: "",
- windCode: "",
- maplist: {},
- timevalue: [], // 绑定 el-date-picker 的值
- startTime: "", // 开始时间
- endTime: "", // 结束时间
- tableDataList: [],
- samplingTime: "", // 采样时间
- timeListTwo: {},
- spectrumList: {},
- envelopeList: {},
- qsList: {},
- CdNamw: "",
- chartsData: {},
- shuju: {},
- spectrumListTwo: {},
- envelopeListTwo: {},
- oldCurrentRow: {},
- XrmsValue: 0, // 默认值
- pointNameMap: {
- main_bearing_radial_vertical_vibration: "主轴承径向垂直振动",
- main_bearing_radial_vibration: "主轴承径向振动",
- main_bearing_radial_horizontal_vibration: "主轴承径向水平振动",
- main_bearing_axial_vibration: "主轴承轴向振动",
- front_main_bearing_radial_vertical_vibration: "前主轴承径向垂直振动",
- front_main_bearing_radial_vibration: "前主轴承径向振动",
- front_main_bearing_radial_horizontal_vibration: "前主轴承径向水平振动",
- front_main_bearing_axial_vibration: "前主轴承轴向振动",
- generator_radial_1_vibration: "发电机径向1振动",
- generator_radial_2_vibration: "发电机径向2振动",
- generator_speed: "发电机转速",
- generator_non_drive_end_radial_vibration: "发电机非驱动端径向振动",
- generator_drive_end_radial_vibration: "发电机驱动端径向振动",
- rear_main_bearing_radial_vertical_vibration: "后主轴承径向垂直振动",
- rear_main_bearing_radial_vibration: "后主轴承径向振动",
- rear_main_bearing_radial_horizontal_vibration: "后主轴承径向水平振动",
- rear_main_bearing_axial_vibration: "后主轴承轴向振动",
- stator_radial_horizontal_vibration: "定子径向水平振动",
- gearbox_first_stage_planet_large_ring_radial_vibration:
- "齿轮箱一级行星级大齿圈径向振动",
- gearbox_first_stage_planet_radial_vibration: "齿轮箱一级行星级径向振动",
- gearbox_third_stage_planet_radial_vibration: "齿轮箱三级行星级径向振动",
- gearbox_second_stage_planet_large_ring_radial_vibration:
- "齿轮箱二级行星级大齿圈径向振动",
- gearbox_second_stage_planet_radial_vibration:
- "齿轮箱二级行星级径向振动",
- gearbox_second_stage_planet_axial_vibration: "齿轮箱二级行星级轴向振动",
- gearbox_low_speed_shaft_output_end_radial_vibration:
- "齿轮箱低速轴输出端径向振动",
- gearbox_input_end_radial_vibration: "齿轮箱输入端径向振动",
- gearbox_output_shaft_axial_vibration: "齿轮箱输出轴轴向振动",
- gearbox_high_speed_shaft_output_end_radial_vibration:
- "齿轮箱高速轴输出端径向振动",
- gearbox_high_speed_shaft_output_end_axial_vibration:
- "齿轮箱高速轴输出端轴向振动",
- },
- };
- },
- created() {
- this.GETtree();
- },
- watch: {
- // 监听 timeList 的变化
- currentRow(newVal, oldVal) {
- if (newVal) {
- // console.log(newVal, oldVal);
- this.oldCurrentRow = oldVal;
- } else {
- console.error("currentRow is undefined or null");
- }
- },
- },
- methods: {
- handleXrmsUpdate(value) {
- this.XrmsValue = value; // 更新有效值
- },
- handleLoading(currentRow, loading, activeIndex, params) {
- if (loading) {
- this.$set(this.fourList[activeIndex], "loading", loading);
- return;
- }
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(this.fourList[activeIndex], "loading", false);
- },
- onRowClick(row) {
- this.currentRow = row; // 选中行数据
- },
- getDetectionPointCn(detectionPointEn) {
- const point = this.monitoringoptions?.find(
- (option) => option.detectionPointEn === detectionPointEn
- );
- return point ? point?.detectionPointCn : null; // 如果没有找到对应项,返回 null
- },
- NewgetDetectionPointCn(key) {
- return this.pointNameMap[key] || key;
- },
- getCompanyLabel(companyCode) {
- const selectedOption = this.parentOpt?.find(
- (option) => option.codeNumber === companyCode
- );
- return selectedOption ? selectedOption.companyName : ""; // Return companyName or empty string if not found
- },
- // 获取风场
- async GETtree() {
- const res = await getSysOrganizationAuthTreeByRoleId();
- const treedata = res.data;
- const processedData = this.processTreeData(treedata);
- this.parentOpt = processedData;
- this.defaultdata = res.data[0];
- },
- parentChange(data) {
- this.maplist = data;
- this.maplistArr = data;
- let paramsData = {
- fieldCode: this.maplist.codeNumber,
- pageNum: 1,
- pageSize: 99,
- };
- this.unitvalue = "";
- this.monitoringvalue = "";
- // 获取风机
- windEngineGrouPage(paramsData).then((res) => {
- this.unitoptions = res.data.list;
- this.windCode = this.companyCode;
- });
- if (data.codeType === "field") {
- if (this.parseCoordinates(data.longitudeAndLatitudeString).length > 0) {
- return;
- }
- } else {
- const dataMapList = data.children;
- dataMapList.forEach((element) => {
- if (
- this.parseCoordinates(element.longitudeAndLatitudeString).length >
- 0 &&
- element.codeType === "field"
- ) {
- return;
- }
- });
- }
- },
- processTreeData(treeData) {
- const processedData = [];
- function processNode(node) {
- if (node.codeType === "field") {
- node.companyName = node.fieldName;
- }
- if (node.children && node.children.length > 0) {
- node.children.forEach((child) => {
- processNode(child);
- });
- }
- }
- treeData.forEach((root) => {
- processNode(root);
- processedData.push(root);
- });
- return processedData;
- },
- parseCoordinates(input) {
- if (input && typeof input === "string") {
- return input.split(",").map(Number);
- }
- // debugger;
- return [];
- },
- // 获取测点
- getchedian(value) {
- axios
- .post(
- `/ETLapi/waveData/getAllMesurePointName/${this.companyCode}/${value}`
- )
- .then((res) => {
- this.monitoringvalue = "";
- if (res.data.code === 500) {
- this.monitoringoptions = []; // 清空旧数据
- this.$message({
- message: res.data.message || "未知错误",
- type: "warning",
- });
- return;
- }
- if (res.data.code === 200) {
- const datas = Array.isArray(res.data.datas) ? res.data.datas : [];
- this.monitoringoptions = datas;
- if (datas.length === 0) {
- this.$message({
- message: "暂无数据",
- type: "warning",
- });
- }
- }
- })
- .catch((err) => {
- console.error("请求失败", err);
- this.monitoringoptions = []; // 防止报错后保持旧数据
- });
- },
- handleModelUpdate(data) {
- // 将子组件的值作为查询参数传递给查询接口
- this.xiaoval = data.xiaoval;
- this.daval = data.daval;
- },
- // 上一条数据
- goToPreviousRow(type, activeIndex) {
- if (this.tableDataList.length === 0) return;
- // 更新当前索引,向前循环
- this.currentIndex =
- this.currentIndex === 0
- ? this.tableDataList.length - 1
- : this.currentIndex - 1;
- const currentRow = this.tableDataList[this.currentIndex];
- this.setCurrent(currentRow);
- const params = {
- ids: currentRow.id,
- windCode: this.companyCode,
- // windCode: "SKF001",
- };
- // 根据type加载不同的数据
- if (type === 1) {
- // Type 1: 加载时域数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "time";
- axios
- .post("/AnalysisMulti/analysis/time", params)
- .then((res) => {
- const timeListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(this.fourList[activeIndex], "timeListTwo", timeListTwo);
- })
- .catch((error) => {
- console.error("Error fetching time domain data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- } else if (type === 2) {
- // Type 2: 加载频域数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "frequency";
- axios
- .post("/AnalysisMulti/analysis/frequency", params)
- .then((res) => {
- const spectrumListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(
- this.fourList[activeIndex],
- "spectrumListTwo",
- spectrumListTwo
- );
- })
- .catch((error) => {
- console.error("Error fetching frequency domain data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- } else if (type === 3) {
- // Type 3: 加载包络分析数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "envelope";
- params.fmin = this.xiaoval; // 最小频率参数
- params.fmax = this.daval; // 最大频率参数
- axios
- .post("/AnalysisMulti/analysis/envelope", params)
- .then((res) => {
- const envelopeListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(
- this.fourList[activeIndex],
- "envelopeListTwo",
- envelopeListTwo
- );
- })
- .catch((error) => {
- console.error("Error fetching envelope analysis data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- } else {
- console.warn("Unknown type provided:", type);
- }
- },
- // 下一条数据,向后循环
- goToNextRow(type, activeIndex) {
- if (this.tableDataList.length === 0) return;
- // 更新当前索引
- this.currentIndex =
- this.currentIndex === this.tableDataList.length - 1
- ? 0
- : this.currentIndex + 1;
- const currentRow = this.tableDataList[this.currentIndex];
- this.setCurrent(currentRow);
- const params = {
- ids: currentRow.id,
- // windCode: "SKF001",
- windCode: this.companyCode,
- };
- // 根据type加载不同的数据
- if (type === 1) {
- // Type 1: 加载时域数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "time";
- axios
- .post("/AnalysisMulti/analysis/time", params)
- .then((res) => {
- const timeListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(this.fourList[activeIndex], "timeListTwo", timeListTwo);
- })
- .catch((error) => {
- console.error("Error fetching time data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- } else if (type === 2) {
- // Type 2: 加载频域数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "frequency";
- axios
- .post("/AnalysisMulti/analysis/frequency", params)
- .then((res) => {
- const spectrumListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(
- this.fourList[activeIndex],
- "spectrumListTwo",
- spectrumListTwo
- );
- })
- .catch((error) => {
- console.error("Error fetching frequency data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- } else if (type === 3) {
- // Type 3: 加载包络分析数据
- this.$set(this.fourList[activeIndex], "loading", true);
- params.analysisType = "envelope";
- params.fmin = this.xiaoval; // 最小频率
- params.fmax = this.daval; // 最大频率
- axios
- .post("/AnalysisMulti/analysis/envelope", params)
- .then((res) => {
- const envelopeListTwo = JSON.parse(res.data);
- this.$set(this.fourList[activeIndex], "rowData", currentRow);
- this.$set(
- this.fourList[activeIndex],
- "envelopeListTwo",
- envelopeListTwo
- );
- })
- .catch((error) => {
- console.error("Error fetching envelope analysis data:", error);
- })
- .finally(() => {
- this.$set(this.fourList[activeIndex], "loading", false);
- });
- }
- },
- // 更新父组件的 currentIndex
- handleCurrentIndexUpdate(newIndex) {
- this.currentIndex = newIndex;
- this.handleCurrentChange(newIndex);
- },
- tableRowClassName({ row }) {
- if (row === this.currentRow) {
- return "current-row-highlight"; // 自定义的高亮类名
- }
- return "";
- },
- // setCurrent(row) {
- // this.currentRow = row; // 设置当前行
- // },
- // 当前所在行高亮提示
- setCurrent(row) {
- if (!row) {
- return false;
- }
- this.$refs.singleTable.setCurrentRow(row);
- },
- // 当前单选
- handleCurrentChange(val) {
- this.currentRow = val;
- const index = this.tableDataList.indexOf(val);
- this.currentIndex = index; // 更新当前索引
- },
- generate(type) {
- if (!this.currentRow) {
- this.$message.warning("请先选择数据");
- return;
- }
- const nameMap = {
- 1: "时域图", // Time Domain Chart
- 2: "频谱图", // Spectrogram Chart
- 3: "包络谱图", // Envelope Spectrum Chart
- };
- const chartName = nameMap[type];
- if (chartName) {
- const newItem = {
- name: chartName,
- isMinimized: false,
- id: `chart-${Date.now()}`,
- };
- this.fourList.push(newItem);
- }
- },
- tendency() {
- if (this.tableDataList.length === 0) {
- this.$message.warning("数据为空,无法生成图表");
- return;
- }
- const newItem = {
- name: "趋势图",
- isMinimized: false,
- id: `chart-${Date.now()}`,
- };
- const params = {
- ids: this.tableDataList.map((item) => item.id),
- // windCode: "SKF001",
- windCode: this.companyCode,
- analysisType: "trend",
- };
- axios
- .post("/AnalysisMulti/analysis/trend", params)
- .then((res) => {
- let jsonStr = res.data;
- // ① 仅字符串才处理
- if (typeof jsonStr === "string") {
- // ② 将 "NaN" 或裸 NaN 替换为 null(更安全的方式)
- jsonStr = jsonStr.replace(/\bNaN\b/g, "null"); // 替换裸 NaN
- }
- // ③ 再解析为对象
- this.qsList = JSON.parse(jsonStr);
- this.fourList.push(newItem);
- })
- .catch((error) => {
- console.error("趋势图接口报错:", error);
- });
- },
- conditions() {
- const params = {
- windCode: this.maplist.codeNumber,
- windTurbineNumberList: [this.unitvalue],
- mesureNameList: [this.monitoringvalue],
- startTime: this.$formatDateTWO(this.timevalue[0]),
- endTime: this.$formatDateTWO(this.timevalue[1]),
- };
- // const params = {
- // endTime: "2024-07-02 00:00:00",
- // mesureNameList: ["gearbox_input_end_radial_vibration"],
- // startTime: "2024-07-01 00:00:00",
- // windCode: "SKF001",
- // windTurbineNumberList: ["F004"],
- // };
- const areParamsValid = (params) => {
- return (
- params.endTime &&
- params.startTime &&
- params.mesureNameList?.length > 0 &&
- params.windCode &&
- params.windTurbineNumberList?.length > 0
- );
- };
- if (areParamsValid(params)) {
- axios
- .post("/ETLapi/waveData/getMesureData", params)
- .then((res) => {
- this.tableDataList = res.data.datas;
- })
- .catch((error) => {
- console.error("Error:", error);
- // Handle the error here
- });
- } else {
- this.$message({
- message: "请填写全部条件",
- type: "warning",
- });
- }
- },
- // 缩小
- lessen(index) {
- if (!this.fourList[index].isMinimized) {
- this.fourList[index].isMinimized = true;
- }
- },
- // 放大
- amplifier(index) {
- const item = this.fourList[index];
- if (item.isMinimized) {
- item.isMinimized = false;
- }
- },
- // 关闭
- close(index) {
- this.fourList.splice(index, 1);
- },
- zhankai() {
- this.fourList.forEach((item) => {
- item.isMinimized = false;
- });
- },
- suoxiao() {
- this.fourList.forEach((item) => {
- item.isMinimized = true;
- });
- },
- guanbi() {
- this.fourList = [];
- },
- outputFile() {
- var ws1 = XLSX.utils.table_to_book(document.querySelector("#Table1")); //对应要导出的表格id
- var wbOut = XLSX.write(ws1, {
- bookType: "xlsx",
- bookSST: true,
- type: "array",
- });
- try {
- FileSaver.saveAs(
- new Blob([wbOut], { type: "application/octet-stream" }),
- "demo.xlsx"
- );
- } catch (e) {
- if (typeof console !== "undefined") console.log(e, wbOut);
- }
- return wbOut;
- },
- },
- };
- </script>
- <style lang="scss" scoped>
- .head {
- // border-top: 5px solid #088080;
- // border-bottom: 5px solid #088080;
- padding: 5px 0;
- display: flex;
- justify-content: space-between;
- .headleft {
- display: flex;
- .picture {
- cursor: pointer;
- display: inline-block;
- text-align: center;
- margin: 0 20px;
- font-size: 12px;
- img {
- width: 50px;
- height: 20px;
- }
- }
- }
- .headright {
- line-height: 38px;
- img {
- width: 20px;
- height: 20px;
- margin: 0 10px;
- cursor: pointer;
- }
- }
- }
- .searchbox {
- display: flex;
- margin: 10px 0;
- p {
- margin-right: 10px;
- }
- .el-select {
- width: 180px;
- }
- }
- .dialog-actions {
- text-align: right;
- padding: 0 10px;
- display: flex;
- justify-content: space-between;
- position: relative;
- }
- .subject {
- height: 350px;
- // overflow: hidden;
- // overflow-y: auto;
- transition: all 0.3s ease;
- padding: 0 10px;
- p {
- font-size: 10px;
- }
- }
- .main-body {
- display: flex;
- justify-content: space-between;
- align-items: flex-start;
- .data-map {
- width: 60%;
- .chart-area {
- margin-bottom: 10px;
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
- &:hover {
- box-shadow: 0 2px 4px rgb(8, 128, 128, 0.13),
- 0 0 6px rgb(8, 128, 128, 0.11);
- // border: 1px solid #088080;
- }
- }
- }
- .data-map::-webkit-scrollbar {
- display: none; /* 隐藏滚动条 */
- }
- .data-origin {
- width: 39%;
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
- }
- }
- .subject.minimized {
- height: 0px; /* Adjust height when minimized */
- overflow: hidden;
- }
- // ::v-deep .current-row td {
- // background-color: rgba(147, 226, 226, 0.2) !important; /* 高亮的背景颜色 */
- // color: #088080;
- // font-weight: 600;
- // }
- .el-input__inner {
- width: 340px;
- }
- </style>
|