update 检测统计数据

src/views/quality/monitoring/qualityStatistics/graphPage.vue

@@ -11,10 +11,7 @@
 			<TotalGraph :summary-list="summaryList" />
 		</DetailGraph>
 		<DetailGraph id="dg2" key="dg2" ref="dg2" title="检测内容数据">
-			<LineGraph
-				:x-props="lineData.xProps"
-				:legend="legend"
-				:series="lineData.list.map(buildSeries)" />
+			<LineGraph :x-props="lineData.xProps" :legend="legend" :series="series" />
 		</DetailGraph>
 		<!-- <DetailGraph id="dg3" key="dg3" ref="dg3" />
 		<DetailGraph id="dg4" key="dg4" ref="dg4" /> -->
@@ -42,35 +39,40 @@ export default {
 	data() {
 		return {
 			legend: [],
+			series: [],
 		};
 	},
-	computed: {},
+	mounted() {
+		this.buildLegend();
+
+		this.$nextTick(() => {
+			this.series = this.lineData.list.map(this.buildSeries);
+			console.log('this.series', this.series);
+		});
+	},
 	methods: {
 		buildSeries(item) {
-			if (!this.legend.length) this.buildLegend();
-			const data = [];
-			this.legend.forEach((key) => {
-				console.log('key item.key', item, key, item[key]);
-				if (item[key] == null) item[key] = null;
-				data.push(item[key]);
-			});
-			console.log('buildSeries', {
+			console.log('this.list', this.lineData.list, this.lineData.xProps);
+			const seriesItem = {
 				name: item.inspectionContent,
 				type: 'line',
-				data: data,
-			});
-			return {
-				name: item.inspectionContent,
-				type: 'line',
-				data: data,
+				data: [],
 			};
+
+			this.lineData.xProps.forEach((prop) => {
+				if (prop in item) {
+					seriesItem.data.push(item[prop]);
+				} else {
+					seriesItem.data.push(null);
+				}
+			});
+
+			return seriesItem;
 		},
 		buildLegend() {
 			this.legend = this.lineData.list
 				.map((item) => item.inspectionContent)
 				.sort();
-			// this.legend.push('检测总数', '比例%')
-			console.log('buliding legend', this.legend);
 		},
 	},
 };