imacat/lucia-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Conformance: fix ConformanceResults show or not Time Trend.

Browse Source
This commit is contained in:
chiayin
2023-09-04 12:26:16 +08:00
parent 60182c3148
commit 9c53e298be
2 changed files with 45 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
src/components/Discover/Conformance/ConformanceResults.vue
View File

@@ -132,7 +132,7 @@
<p class="h2 text-base">Non-conformance Issues</p>
<div class="flex gap-4 w-full">
<!-- Issues chart -->
<div class="border rounded border-neutral-300 p-2 bg-neutral-10 w-full" >
<div v-if="data.timeTrend.chart !== null" class="border rounded border-neutral-300 p-2 bg-neutral-10 w-full" >
<!-- v-if="data.timeTrend.chart == null" -->
<p class="h2 pl-2 flex justify-between items-center">
<span>Time Trend<span class="material-symbols-outlined text-sm align-middle ml-2">info</span></span>
@@ -377,17 +377,25 @@ export default {
timeTrend: {
not_conforming: getNumberLabel(data.counts.not_conforming),
total: getNumberLabel(sum),
chart: setLineChartData(data.charts.time.data, data.charts.time.x_axis.max, data.charts.time.x_axis.min, false, data.charts.time.y_axis.max, data.charts.time.y_axis.min),
xMax: data.charts.time.x_axis.max,
xMin: data.charts.time.x_axis.min,
yMax: data.charts.time.y_axis.max,
yMin: data.charts.time.y_axis.min,
chart: null,
xMax: null,
xMin: null,
yMax: null,
yMin: null,
}
};
if (data.charts.time) {
result.timeTrend.chart = setLineChartData(data.charts.time.data, data.charts.time.x_axis.max, data.charts.time.x_axis.min, false, data.charts.time.y_axis.max, data.charts.time.y_axis.min);
result.timeTrend.xMax = data.charts.time.x_axis.max;
result.timeTrend.xMin = data.charts.time.x_axis.min;
result.timeTrend.yMax = data.charts.time.y_axis.max;
result.timeTrend.yMin = data.charts.time.y_axis.min;
}
this.setRateChartData(result.charts.rate.data); // 建立圖表 Rate Chart.js
this.setCasesChartData(result.charts.cases.data.conforming, result.charts.cases.data.not_conforming, data.charts.cases.x_axis.max, data.charts.cases.x_axis.min); // 建立圖表 Cases Chart.js
this.setTimeChartData(result.timeTrend.chart, result.timeTrend.xMax, result.timeTrend.xMin, result.timeTrend.yMax, result.timeTrend.yMax, result.timeTrend.yMin); // 建立圖表 Time Chart.js
if(data.charts.time) this.setTimeChartData(result.timeTrend.chart, result.timeTrend.xMax, result.timeTrend.xMin, result.timeTrend.yMax, result.timeTrend.yMax, result.timeTrend.yMin); // 建立圖表 Time Chart.js
return result;
},
/**
@@ -480,10 +488,10 @@ export default {
},
/**
* set Cases Chart Data
* @param {object} data new cases chart conforming data
* @param {object} data new cases chart not conforming data
* @param {strin} data new cases chart xMax
* @param {string} data new cases chart xMin
* @param {array} data new cases chart conforming data
* @param {array} data new cases chart not conforming data
* @param {number} data new cases chart xMax
* @param {number} data new cases chart xMin
*/
setCasesChartData(conformingData, notConformingData, xMax, xMin){
this.casesChartData = {
@@ -568,7 +576,12 @@ export default {
};
},
/**
* time chart
* set Time Trend chart data
* @param {array} data Time Trend chart conforming data
* @param {number} xMax Time Trend xMax
* @param {number} xMin Time Trend xMin
* @param {number} yMax Time Trend yMax
* @param {number} yMin Time Trend yMin
*/
setTimeChartData(data, xMax, xMin, yMax, yMin) {
let max = yMax * 1.1;
@@ -665,6 +678,7 @@ export default {
this.$emitter.on('coverPlate', boolean => {
this.isCoverPlate = boolean;
});
// 取得 selectTimeTange 給 Tiem Trend 使用
this.$emitter.on('timeRangeMaxMin', data => this.selectDurationTime = data);
},
}

37
src/module/setChartData.js
View File

@@ -66,7 +66,6 @@ export function setBarChartData(baseData) {
y: i.y
}
})
// console.log(data);
return data
};
/**
@@ -119,7 +118,7 @@ export function yTimeRange(data, yAmount, yMax) {
if(yRange.length < yAmount) {
let len = yAmount - yRange.length;
for (let i = 0; i < len; i++) {
yRange.push(yMax)
yRange.push(yRange[yRange.length - 1]);
}
}
else if(yRange.length > yAmount) {
@@ -160,22 +159,24 @@ export function getXIndex(data, xValue) {
* @returns {string}
*/
export function formatTime(seconds) {
const days = Math.floor(seconds / (3600 * 24));
const hours = Math.floor((seconds % (3600 * 24)) / 3600);
const minutes = Math.floor((seconds % 3600) / 60);
const remainingSeconds = seconds % 60;
if(!isNaN(seconds)) {
const remainingSeconds = seconds % 60;
const minutes = (Math.floor(seconds - remainingSeconds) / 60) % 60;
const hours = (Math.floor(seconds / 3600)) % 24;
const days = Math.floor(seconds / (3600 * 24));
let result = '';
if (days > 0) {
result += `${days}d`;
}
if (hours > 0) {
result += `${hours}h`;
}
if (minutes > 0) {
result += `${minutes}m`;
}
result += `${remainingSeconds}s`;
let result = '';
if (days > 0) {
result += `${days}d`;
}
if (hours > 0) {
result += `${hours}h`;
}
if (minutes > 0) {
result += `${minutes}m`;
}
result += `${remainingSeconds}s`;
return result.trim(); // 去除最后一个空格
return result.trim(); // 去除最后一个空格
} else return null;
}