overwrite 产线平衡分析

src/views/core/analysis/balanceAnalysis/index.vue

@@ -1,46 +1,56 @@
 <template>
-	<div class="app-container">
+	<div class="app-container" style="flex: 1; height: 1px">
 		<search-bar
 			:formConfigs="formConfig"
 			ref="searchBarForm"
 			@headBtnClick="handleSearchBarBtnClick" />
 
 		<!-- <div v-if="tableData.length"> -->
-		<el-tabs
-			v-model="activeName"
-			@tab-click="handleTabClick"
-			style="height: 100%">
-			<el-tab-pane :label="'\u2002数据列表\u2002'" name="table">
-				<base-table
-					v-if="activeName == 'table' && ready"
-					:span-method="mergeRow"
-					:page="1"
-					:limit="999"
-					:table-props="tableProps"
-					:table-data="tableData" />
-			</el-tab-pane>
-			<el-tab-pane :label="'\u3000产线平衡分析图\u3000'" name="graph">
-				<div class="graph" style="height: 100%">
-					<!-- graph  -->
-					<!-- <Graph
+		<div class="custom-tabs" style="">
+			<el-tabs
+				v-model="activeName"
+				@tab-click="handleTabClick"
+				style="height: 100%">
+				<el-tab-pane :label="'\u2002数据列表\u2002'" name="table">
+					<base-table
+						v-if="activeName == 'table' && ready"
+						:span-method="mergeRow"
+						:page="1"
+						:limit="999"
+						:table-props="tableProps"
+						:table-data="tableData" />
+					<div v-if="tableData.length == 0" class="no-data-bg"></div>
+				</el-tab-pane>
+				<el-tab-pane :label="'\u3000产线平衡分析图\u3000'" name="graph">
+					<div class="graph" style="height: 800px">
+						<!-- graph  -->
+						<AnalysisChart
+							v-if="activeName == 'graph'"
+							:table-data="tableData"
+							:daterange="dateArr"></AnalysisChart>
+						<!-- <div v-else class="no-data-bg"></div> -->
+						<!-- <Graph
 										v-if="list.length"
 										:equipment-list="list"
 										:render="renderKey" /> -->
-					<!-- <BalanceChart ref="lineChart" /> -->
-					<div v-if="list.length == 0" class="no-data-bg"></div>
-				</div>
-			</el-tab-pane>
-		</el-tabs>
+						<!-- <BalanceChart ref="lineChart" /> -->
+						<!-- <div v-if="list.length == 0" class="no-data-bg"></div> -->
+					</div>
+				</el-tab-pane>
+			</el-tabs>
+		</div>
 	</div>
 </template>
 
 <script>
 import BalanceChart from '../balanceChart';
 import basicPageMixin from '@/mixins/lb/basicPageMixin';
+import AnalysisChart from './chart.vue';
 
 export default {
 	components: {
 		BalanceChart,
+		AnalysisChart,
 	},
 	mixins: [basicPageMixin],
 	data() {
@@ -97,6 +107,8 @@ export default {
 			lastSection: null,
 			currRowIndex: 0,
 			spanArr: [],
+			// 保存时间列表
+			dateArr: [],
 			ready: false,
 		};
 	},
@@ -157,13 +169,18 @@ export default {
 			await this.buildProps(nameData);
 			await this.buildTableData(data);
 			this.tableData = this.tableData.sort((a, b) => {
-				if (a.sectionName < b.sectionName) return 1;
-				return -1;
+				if (a.sectionName < b.sectionName) return -1;
+				return 1;
 			});
+			// const p = this.tableProps
+			// const d = this.tableData
+			// debugger;
 			this.ready = true;
 		},
 
 		buildProps(nameData) {
+			this.initTableProps();
+			this.dateArr = [];
 			return new Promise((resolve, reject) => {
 				try {
 					const dateArr = Array.from(
@@ -202,7 +219,7 @@ export default {
 							],
 						});
 					});
-
+					this.dateArr = dateArr;
 					resolve();
 				} catch (err) {
 					reject(err);
@@ -211,19 +228,24 @@ export default {
 		},
 
 		async buildTableData(data) {
+			this.tableData = [];
 			const sectionArr = Array.from(
 				new Set(data.map((item) => item.sectionName))
 			).sort();
-			this.sectionMap = sectionArr.reduce(
+
+			const sectionMap = sectionArr.reduce(
 				(sum, curr) => ({ ...sum, [curr]: 0 }),
 				{}
 			);
-			this.spanArr = Array.from(sectionArr, () => 0);
+
+			console.log('sectionArr', sectionArr);
+			console.log('sectionMap', sectionMap);
+			let spanArr = Array.from(sectionArr, () => 0);
 
 			return new Promise((resolve, reject) => {
 				/** 处理 工段 分组  */
 				data.map((item) => {
-					this.sectionMap[item.sectionName]++;
+					sectionMap[item.sectionName]++;
 					/** 处理 设备  */
 					const row = {
 						equName: item.equName,
@@ -246,13 +268,16 @@ export default {
 				});
 
 				/** 生成span数组 */
-				const tmp = [0];
+				const tmp = [...spanArr];
 				for (const [index, key] of sectionArr.entries()) {
-					tmp[index + 1] = tmp[index] + this.sectionMap[key];
+					tmp[index + 1] = tmp[index] + sectionMap[key];
 				}
 
 				console.log('tep', tmp);
-				this.spanArr = tmp;
+				spanArr = tmp;
+
+				this.sectionMap = sectionMap;
+				this.spanArr = spanArr;
 				resolve();
 			});
 		},
@@ -407,3 +432,23 @@ export default {
 	},
 };
 </script>
+<style scoped>
+.custom-tabs >>> .el-tabs__header {
+	margin-bottom: 8px;
+	display: inline-block;
+	transform: translateY(-12px);
+}
+.custom-tabs >>> .el-tabs__item {
+	padding-left: 0px !important;
+	padding-right: 0px !important;
+	line-height: 36px !important;
+	height: 36px;
+}
+
+.custom-tabs >>> .el-tabs__content {
+	height: calc(100% - 42px);
+}
+.custom-tabs >>> .el-tab-pane {
+	height: 100%;
+}
+</style>