|
|
@@ -7,8 +7,7 @@
|
|
|
:key="item.component"
|
|
|
:label="item.name"
|
|
|
:name="item.component"
|
|
|
- >
|
|
|
- </el-tab-pane>
|
|
|
+ />
|
|
|
</el-tabs>
|
|
|
|
|
|
<!-- 查询条件 -->
|
|
|
@@ -19,9 +18,9 @@
|
|
|
size="small"
|
|
|
style="width: 180px"
|
|
|
placeholder="请选择所属公司"
|
|
|
- :list="parentOpt"
|
|
|
+ :list="tabConditions[activeTab].parentOpt"
|
|
|
type="1"
|
|
|
- v-model="companyCode"
|
|
|
+ v-model="tabConditions[activeTab].companyCode"
|
|
|
@change="parentChange"
|
|
|
:defaultParentProps="{
|
|
|
children: 'children',
|
|
|
@@ -35,12 +34,12 @@
|
|
|
<el-select
|
|
|
size="small"
|
|
|
style="width: 150px"
|
|
|
- v-model="unitvalue"
|
|
|
+ v-model="tabConditions[activeTab].unitvalue"
|
|
|
@change="getchedian"
|
|
|
placeholder="请选择"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in unitoptions"
|
|
|
+ v-for="item in tabConditions[activeTab].unitoptions"
|
|
|
:key="item.engineCode"
|
|
|
:label="item.engineName"
|
|
|
:value="item.engineCode"
|
|
|
@@ -50,29 +49,32 @@
|
|
|
<p>
|
|
|
测点:
|
|
|
<el-select
|
|
|
- v-model="monitoringvalue"
|
|
|
+ v-model="tabConditions[activeTab].monitoringvalue"
|
|
|
size="small"
|
|
|
clearable
|
|
|
placeholder="请选择"
|
|
|
+ :disabled="activeTab === 'Temperature'"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in monitoringoptions"
|
|
|
+ v-for="item in tabConditions[activeTab].monitoringoptions"
|
|
|
:key="item.itemKey"
|
|
|
:label="item.itemValue"
|
|
|
:value="item.itemKey"
|
|
|
/>
|
|
|
</el-select>
|
|
|
</p>
|
|
|
+
|
|
|
<p>
|
|
|
采样频率:
|
|
|
<el-select
|
|
|
- v-model="frequencyvalue"
|
|
|
+ v-model="tabConditions[activeTab].frequencyvalue"
|
|
|
size="small"
|
|
|
clearable
|
|
|
placeholder="请选择"
|
|
|
+ :disabled="activeTab === 'Temperature'"
|
|
|
>
|
|
|
<el-option
|
|
|
- v-for="item in frequencyoptions"
|
|
|
+ v-for="item in tabConditions[activeTab].frequencyoptions"
|
|
|
:key="item"
|
|
|
:label="item"
|
|
|
:value="item"
|
|
|
@@ -83,17 +85,18 @@
|
|
|
时间:
|
|
|
<el-date-picker
|
|
|
size="small"
|
|
|
- v-model="timevalue"
|
|
|
+ v-model="tabConditions[activeTab].timevalue"
|
|
|
type="datetimerange"
|
|
|
range-separator="至"
|
|
|
start-placeholder="开始日期"
|
|
|
end-placeholder="结束日期"
|
|
|
/>
|
|
|
+ <!-- :picker-options="datePickerOptions" -->
|
|
|
</p>
|
|
|
<el-button
|
|
|
type="primary"
|
|
|
size="small"
|
|
|
- @click="conditions(1)"
|
|
|
+ @click="onSearchClick"
|
|
|
class="search-btn"
|
|
|
>查询</el-button
|
|
|
>
|
|
|
@@ -104,9 +107,16 @@
|
|
|
<keep-alive>
|
|
|
<component
|
|
|
:is="activeTab"
|
|
|
- :codedata="codedata"
|
|
|
- :totalCount="totalCount"
|
|
|
- :totalPage="totalPage"
|
|
|
+ :codedata="tabData[activeTab].codedata"
|
|
|
+ v-bind="
|
|
|
+ activeTab === 'Temperature'
|
|
|
+ ? { echartsdata: tabData.Temperature.echartsdata }
|
|
|
+ : {}
|
|
|
+ "
|
|
|
+ :totalCount="tabData[activeTab].totalCount"
|
|
|
+ :totalPage="tabData[activeTab].totalPage"
|
|
|
+ :fieldCode="tabConditions[activeTab].companyCode"
|
|
|
+ :windTurbineNumber="tabConditions[activeTab].unitvalue"
|
|
|
@updatePage="handlePageChange"
|
|
|
/>
|
|
|
</keep-alive>
|
|
|
@@ -144,8 +154,7 @@ export default {
|
|
|
data() {
|
|
|
return {
|
|
|
activeTab: "Bearing",
|
|
|
- activeName: "Bearing", // el-tabs 控制当前 tab
|
|
|
-
|
|
|
+ activeName: "Bearing",
|
|
|
menuItems: [
|
|
|
{
|
|
|
name: "轴承诊断",
|
|
|
@@ -178,102 +187,129 @@ export default {
|
|
|
component: "Temperature",
|
|
|
},
|
|
|
],
|
|
|
-
|
|
|
- unitvalue: "",
|
|
|
- unitoptions: [],
|
|
|
- companyCode: "",
|
|
|
- parentOpt: [],
|
|
|
- timevalue: [],
|
|
|
- startTime: "",
|
|
|
- endTime: "",
|
|
|
- monitoringvalue: "",
|
|
|
- monitoringoptions: [],
|
|
|
- frequencyvalue: "",
|
|
|
- frequencyoptions: [],
|
|
|
- codedata: [],
|
|
|
- totalCount: 0,
|
|
|
- totalPage: 0,
|
|
|
- page: "",
|
|
|
+ tabConditions: {
|
|
|
+ Bearing: {},
|
|
|
+ Gear: {},
|
|
|
+ Dissymmetry: {},
|
|
|
+ Misalignment: {},
|
|
|
+ Loose: {},
|
|
|
+ Temperature: {},
|
|
|
+ },
|
|
|
+ tabData: {
|
|
|
+ Bearing: { codedata: [], totalCount: 0, totalPage: 0 },
|
|
|
+ Gear: { codedata: [], totalCount: 0, totalPage: 0 },
|
|
|
+ Dissymmetry: { codedata: [], totalCount: 0, totalPage: 0 },
|
|
|
+ Misalignment: { codedata: [], totalCount: 0, totalPage: 0 },
|
|
|
+ Loose: { codedata: [], totalCount: 0, totalPage: 0 },
|
|
|
+ Temperature: {
|
|
|
+ codedata: [],
|
|
|
+ totalCount: 0,
|
|
|
+ totalPage: 0,
|
|
|
+ echartsdata: {},
|
|
|
+ },
|
|
|
+ },
|
|
|
+ datePickerOptions: {
|
|
|
+ onPick: ({ minDate, maxDate }) => {
|
|
|
+ if (minDate && !maxDate) {
|
|
|
+ const maxTime = new Date(
|
|
|
+ minDate.getTime() + 30 * 24 * 60 * 60 * 1000
|
|
|
+ );
|
|
|
+ this.datePickerOptions.disabledDate = (time) => {
|
|
|
+ return (
|
|
|
+ time.getTime() < minDate.getTime() ||
|
|
|
+ time.getTime() > maxTime.getTime()
|
|
|
+ );
|
|
|
+ };
|
|
|
+ } else {
|
|
|
+ this.datePickerOptions.disabledDate = () => false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ disabledDate: () => false,
|
|
|
+ },
|
|
|
};
|
|
|
},
|
|
|
created() {
|
|
|
+ for (const key in this.tabConditions) {
|
|
|
+ this.tabConditions[key] = this.defaultCondition();
|
|
|
+ }
|
|
|
this.GETtree();
|
|
|
},
|
|
|
methods: {
|
|
|
+ defaultCondition() {
|
|
|
+ return {
|
|
|
+ unitvalue: "",
|
|
|
+ unitoptions: [],
|
|
|
+ companyCode: "",
|
|
|
+ parentOpt: [],
|
|
|
+ timevalue: [],
|
|
|
+ monitoringvalue: "",
|
|
|
+ monitoringoptions: [],
|
|
|
+ frequencyvalue: "",
|
|
|
+ frequencyoptions: [],
|
|
|
+ };
|
|
|
+ },
|
|
|
handleClick(tab) {
|
|
|
this.activeTab = tab.name;
|
|
|
},
|
|
|
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;
|
|
|
+ const processed = this.processTreeData(treedata);
|
|
|
|
|
|
- if (!this.maplist?.codeNumber) {
|
|
|
- console.error("codeNumber 不存在!");
|
|
|
- return;
|
|
|
+ for (const key in this.tabConditions) {
|
|
|
+ this.tabConditions[key].parentOpt = processed;
|
|
|
}
|
|
|
+ },
|
|
|
+ parentChange(data) {
|
|
|
+ const condition = this.tabConditions[this.activeTab];
|
|
|
+ if (!data?.codeNumber) return;
|
|
|
+ condition.unitvalue = "";
|
|
|
+ condition.monitoringvalue = "";
|
|
|
+ condition.frequencyvalue = "";
|
|
|
|
|
|
- const paramsData = {
|
|
|
- fieldCode: this.maplist.codeNumber,
|
|
|
+ windEngineGrouPage({
|
|
|
+ fieldCode: data.codeNumber,
|
|
|
pageNum: 1,
|
|
|
pageSize: 99,
|
|
|
- };
|
|
|
-
|
|
|
- this.unitvalue = "";
|
|
|
- this.monitoringvalue = "";
|
|
|
- this.frequencyvalue = "";
|
|
|
+ }).then((res) => {
|
|
|
+ condition.unitoptions = res.data.list;
|
|
|
+ });
|
|
|
|
|
|
- windEngineGrouPage(paramsData)
|
|
|
+ axios
|
|
|
+ .get(`/ETLapi/waveData/getAllSamplingFrequency/${data.codeNumber}`)
|
|
|
.then((res) => {
|
|
|
- this.unitoptions = res.data.list;
|
|
|
- this.windCode = this.companyCode;
|
|
|
- })
|
|
|
- .catch((err) => {
|
|
|
- console.error("windEngineGrouPage 失败:", err);
|
|
|
+ condition.frequencyoptions = res.data.datas;
|
|
|
});
|
|
|
|
|
|
- let shouldSkip = false;
|
|
|
- try {
|
|
|
- if (data.codeType === "field") {
|
|
|
- if (
|
|
|
- this.parseCoordinates(data.longitudeAndLatitudeString).length > 0
|
|
|
- ) {
|
|
|
- shouldSkip = true;
|
|
|
- }
|
|
|
- } else {
|
|
|
- data.children?.forEach((element) => {
|
|
|
- if (
|
|
|
- element.codeType === "field" &&
|
|
|
- this.parseCoordinates(element.longitudeAndLatitudeString).length >
|
|
|
- 0
|
|
|
- ) {
|
|
|
- shouldSkip = true;
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- } catch (err) {
|
|
|
- console.error("解析坐标出错:", err);
|
|
|
- }
|
|
|
-
|
|
|
- if (shouldSkip) {
|
|
|
- console.log("坐标已存在,跳过部分逻辑");
|
|
|
- }
|
|
|
+ condition.companyCode = data.codeNumber;
|
|
|
+ },
|
|
|
+ getchedian(value) {
|
|
|
+ const condition = this.tabConditions[this.activeTab];
|
|
|
+ const companyCode = condition.companyCode;
|
|
|
|
|
|
axios
|
|
|
- .get(
|
|
|
- `/ETLapi/waveData/getAllSamplingFrequency/${this.maplist.codeNumber}`
|
|
|
- )
|
|
|
+ .post(`/ETLapi/waveData/getAllMesurePointName/${companyCode}/${value}`)
|
|
|
.then((res) => {
|
|
|
- this.frequencyoptions = res.data.datas;
|
|
|
+ condition.monitoringvalue = "";
|
|
|
+ if (res.data.code === 500) {
|
|
|
+ condition.monitoringoptions = [];
|
|
|
+ this.$message({
|
|
|
+ message: "当前风场不存在测点和采样频率数据" || "未知错误",
|
|
|
+ type: "warning",
|
|
|
+ });
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (res.data.code === 200) {
|
|
|
+ const datas = Array.isArray(res.data.datas) ? res.data.datas : [];
|
|
|
+ condition.monitoringoptions = datas;
|
|
|
+ if (datas.length === 0) {
|
|
|
+ this.$message({ message: "暂无数据", type: "warning" });
|
|
|
+ }
|
|
|
+ }
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
- console.error("第二个请求失败:", err);
|
|
|
+ console.error("测点请求失败:", err);
|
|
|
+ condition.monitoringoptions = [];
|
|
|
});
|
|
|
},
|
|
|
processTreeData(treeData) {
|
|
|
@@ -283,9 +319,7 @@ export default {
|
|
|
node.companyName = node.fieldName;
|
|
|
}
|
|
|
if (node.children && node.children.length > 0) {
|
|
|
- node.children.forEach((child) => {
|
|
|
- processNode(child);
|
|
|
- });
|
|
|
+ node.children.forEach(processNode);
|
|
|
}
|
|
|
}
|
|
|
treeData.forEach((root) => {
|
|
|
@@ -294,69 +328,130 @@ export default {
|
|
|
});
|
|
|
return processedData;
|
|
|
},
|
|
|
- parseCoordinates(input) {
|
|
|
- if (input && typeof input === "string") {
|
|
|
- return input.split(",").map(Number);
|
|
|
- }
|
|
|
- return [];
|
|
|
+ onSearchClick() {
|
|
|
+ this.conditions(1, false); // 主动查询,第一页,非分页触发
|
|
|
},
|
|
|
- getchedian(value) {
|
|
|
- axios
|
|
|
- .post(
|
|
|
- `/ETLapi/waveData/getAllMesurePointName/${this.companyCode}/${value}`
|
|
|
- )
|
|
|
+ handlePageChange(page) {
|
|
|
+ this.conditions(page, true); // true 表示分页触发
|
|
|
+ },
|
|
|
+
|
|
|
+ conditions(page, isPageChange = false) {
|
|
|
+ const tab = this.activeTab;
|
|
|
+ const condition = this.tabConditions[tab];
|
|
|
+
|
|
|
+ if (tab === "Temperature") {
|
|
|
+ const temperature = {
|
|
|
+ windCode: condition.companyCode,
|
|
|
+ windTurbineNumberList: [condition.unitvalue],
|
|
|
+ startTime: this.$formatDateTWO(condition.timevalue[0]),
|
|
|
+ endTime: this.$formatDateTWO(condition.timevalue[1]),
|
|
|
+ pageNo: page,
|
|
|
+ pageSize: 500,
|
|
|
+ }
|
|
|
+
|
|
|
+ const loading = this.$loading({
|
|
|
+ lock: true,
|
|
|
+ text: "温度诊断数据加载中,请稍候…",
|
|
|
+ spinner: "el-icon-loading",
|
|
|
+ background: "rgba(0, 0, 0, 0.8)",
|
|
|
+ })
|
|
|
+
|
|
|
+ const emptyEchartsData = {
|
|
|
+ gearbox_oil: { timestamps: [], values: [] },
|
|
|
+ generator_drive_end: { timestamps: [], values: [] },
|
|
|
+ generator_nondrive_end: { timestamps: [], values: [] },
|
|
|
+ main_bearing: { timestamps: [], values: [] },
|
|
|
+ }
|
|
|
+
|
|
|
+ const trendRequest = () => {
|
|
|
+ const trendStart = performance.now()
|
|
|
+ return axios
|
|
|
+ .post("/WJJdiag/SPRT/trend", temperature)
|
|
|
+ .then((res) => {
|
|
|
+ const trendEnd = performance.now()
|
|
|
+ console.log(
|
|
|
+ `温度诊断 trend 接口耗时: ${(
|
|
|
+ (trendEnd - trendStart) /
|
|
|
+ 1000
|
|
|
+ ).toFixed(2)}s`
|
|
|
+ )
|
|
|
+ const echartsdata = res.data.data || {}
|
|
|
+ this.tabData[tab].echartsdata = echartsdata
|
|
|
+ })
|
|
|
+ .catch((err) => {
|
|
|
+ console.error("趋势图请求失败:", err)
|
|
|
+ this.$message.error("温度趋势图数据请求失败,请稍后再试")
|
|
|
+ })
|
|
|
+ }
|
|
|
+
|
|
|
+ const thresholdStart = performance.now()
|
|
|
+ const thresholdReq = axios
|
|
|
+ .post("/WJJdiag/temperature/threshold", temperature)
|
|
|
.then((res) => {
|
|
|
- this.monitoringvalue = "";
|
|
|
- if (res.data.code === 500) {
|
|
|
- this.monitoringoptions = []; // 清空旧数据
|
|
|
- this.$message({
|
|
|
- message: res.data.message || "未知错误",
|
|
|
- type: "warning",
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
+ const thresholdEnd = performance.now()
|
|
|
+ console.log(
|
|
|
+ `温度诊断 threshold 接口耗时: ${(
|
|
|
+ (thresholdEnd - thresholdStart) /
|
|
|
+ 1000
|
|
|
+ ).toFixed(2)}s`
|
|
|
+ )
|
|
|
|
|
|
- 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",
|
|
|
- });
|
|
|
- }
|
|
|
+ const data = res.data.data.records || []
|
|
|
+ this.tabData[tab].codedata = data
|
|
|
+ this.tabData[tab].totalCount = res.data.data.totalSize || 0
|
|
|
+
|
|
|
+ if (!data.length) {
|
|
|
+ this.$message.warning("暂无诊断数据")
|
|
|
+ // 清空echartsdata为固定空结构
|
|
|
+ this.tabData[tab].echartsdata = emptyEchartsData
|
|
|
+ return Promise.resolve("skip trend")
|
|
|
}
|
|
|
+
|
|
|
+ // 有数据时,根据是否分页决定是否请求趋势图
|
|
|
+ return isPageChange ? Promise.resolve() : trendRequest()
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
- console.error("请求失败", err);
|
|
|
- this.monitoringoptions = []; // 防止报错后保持旧数据
|
|
|
- });
|
|
|
- },
|
|
|
- handlePageChange(page) {
|
|
|
- this.conditions(page);
|
|
|
- },
|
|
|
- conditions(page) {
|
|
|
- const params = {
|
|
|
- samplingFrequency: this.frequencyvalue,
|
|
|
- windCode: this.maplist.codeNumber,
|
|
|
- windTurbineNumberList: [this.unitvalue],
|
|
|
- mesureNameList: [this.monitoringvalue],
|
|
|
- startTime: this.$formatDateTWO(this.timevalue[0]),
|
|
|
- endTime: this.$formatDateTWO(this.timevalue[1]),
|
|
|
- pageNo: page,
|
|
|
- pageSize: 10,
|
|
|
- };
|
|
|
+ console.error("温度诊断请求失败:", err)
|
|
|
+ this.$message.error("温度诊断数据请求失败,请稍后再试")
|
|
|
+ })
|
|
|
|
|
|
- axios.post(`/ETLapi/waveData/getMesureDataWithSF`, params).then((res) => {
|
|
|
- this.codedata = res.data.datas;
|
|
|
- this.totalCount = res.data.totalCount;
|
|
|
- this.totalPage = res.data.totalPage;
|
|
|
- });
|
|
|
+ Promise.resolve(thresholdReq).finally(() => {
|
|
|
+ loading.close()
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ const params = {
|
|
|
+ samplingFrequency: condition.frequencyvalue,
|
|
|
+ windCode: condition.companyCode,
|
|
|
+ windTurbineNumberList: [condition.unitvalue],
|
|
|
+ mesureNameList: [condition.monitoringvalue],
|
|
|
+ startTime: this.$formatDateTWO(condition.timevalue[0]),
|
|
|
+ endTime: this.$formatDateTWO(condition.timevalue[1]),
|
|
|
+ pageNo: page,
|
|
|
+ pageSize: 10,
|
|
|
+ };
|
|
|
+
|
|
|
+ const startTime = performance.now();
|
|
|
+ axios
|
|
|
+ .post("/ETLapi/waveData/getMesureDataWithSF", params)
|
|
|
+ .then((res) => {
|
|
|
+ const endTime = performance.now();
|
|
|
+ console.log(
|
|
|
+ `其他 tab 接口请求耗时: ${(endTime - startTime).toFixed(2)}ms`
|
|
|
+ );
|
|
|
+
|
|
|
+ const data = res.data || {};
|
|
|
+ this.tabData[tab].codedata = data.datas || [];
|
|
|
+ this.tabData[tab].totalCount = data.totalCount || 0;
|
|
|
+ this.tabData[tab].totalPage = data.totalPage || 0;
|
|
|
+ });
|
|
|
+ }
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
-
|
|
|
+
|
|
|
+
|
|
|
+
|
|
|
<style lang="scss" scoped>
|
|
|
.global-variable {
|
|
|
padding: 10px;
|
|
|
@@ -452,4 +547,16 @@ export default {
|
|
|
.el-range-editor.el-input__inner {
|
|
|
width: 370px;
|
|
|
}
|
|
|
+
|
|
|
+/* 放在你的组件 <style scoped> 或全局样式里 */
|
|
|
+.custom-loading-style .el-loading-spinner i {
|
|
|
+ font-size: 26px;
|
|
|
+ color: #409eff; /* Element UI 主色调,更柔和 */
|
|
|
+}
|
|
|
+
|
|
|
+.custom-loading-style .el-loading-text {
|
|
|
+ font-size: 14px;
|
|
|
+ color: #303133;
|
|
|
+ letter-spacing: 0.5px;
|
|
|
+}
|
|
|
</style>
|