Conformance: fix ConformanceResults show or not Time Trend.

src/components/Discover/Conformance/ConformanceResults.vue

@@ -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),
+          chart: null,
-          xMax: data.charts.time.x_axis.max,
+          xMax: null,
-          xMin: data.charts.time.x_axis.min,
+          xMin: null,
-          yMax: data.charts.time.y_axis.max,
+          yMax: null,
-          yMin: data.charts.time.y_axis.min,
+          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   {array} data new cases chart conforming data
-     * @param   {object} data new cases chart not conforming data
+     * @param   {array} data new cases chart not conforming data
-     * @param   {strin} data new cases chart xMax
+     * @param   {number} data new cases chart xMax
-     * @param   {string} data new cases chart xMin
+     * @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);
   },
 }

src/module/setChartData.js

@@ -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,10 +159,11 @@ export function getXIndex(data, xValue) {
  * @returns {string}
  */
 export function formatTime(seconds) {
-  const days = Math.floor(seconds / (3600 * 24));
+  if(!isNaN(seconds)) {
-  const hours = Math.floor((seconds % (3600 * 24)) / 3600);
-  const minutes = Math.floor((seconds % 3600) / 60);
     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) {
@@ -178,4 +178,5 @@ export function formatTime(seconds) {
     result += `${remainingSeconds}s`;
 
     return result.trim(); // 去除最后一个空格
+  } else return null;
 }