fix:生产执行中日志界面任务添加隐藏显示功能

src/views/wpm_bx/index.vue

@@ -1,6 +1,6 @@
 <!-- 最新版生产执行页面 -->
 <template>
-	<el-container>
+	<el-container style="position: relative;">
 		<el-header>
 			<el-segmented
 				v-model="values"
@@ -15,14 +15,32 @@
 				:mgroupName="mgroupName"
 				:mgroupId="mgroupId"
 				:mgroup_code="mgroup_code"
-				style="height: 60%"
+				id="mlogs"
+				style="height: 100%"
 			></mlogs>
+			<!-- 隐藏任务 -->
+			<div v-if="values == '日志'&&componentsShow&&mtaskVisible"  class="iconWrap" @click="hiddenMtask">
+				<span class="iconSpan">
+					<el-icon>
+						<el-icon-arrow-down />
+					</el-icon>
+				</span>
+			</div>
+			<!-- 显示任务 -->
+			<div v-if="values == '日志'&&componentsShow&&!mtaskVisible" class="iconWrap iconWrapBottom" @click="showMtask">
+				<span class="iconSpan iconSpanBottom">
+					<el-icon>
+						<el-icon-arrow-up />
+					</el-icon>
+				</span>
+			</div>
 			<mtask
 				v-if="values == '日志'&&componentsShow"
 				:mgroupId="mgroupId"
 				:deptId = "mgroupDept"
 				:mgroupName="mgroupName"
-				style="height: 40%"
+				id="mtask"
+				style="height: 40%;display: none;"
 			></mtask>
 			<!-- 交接记录 -->
 			<handover
@@ -62,6 +80,7 @@ export default {
 			mgroup_code:'',
 			mgroupDept:'',
 			componentsShow:false,
+			mtaskVisible:false
 		};
 	},
 	mounted() {
@@ -90,8 +109,42 @@ export default {
 				that.componentsShow = true;
 			});
 		},
+		showMtask(){
+			let mtask = document.getElementById("mtask");
+			let mlogs = document.getElementById("mlogs");
+			mtask.style.height = '40%';
+			mlogs.style.height = '60%';
+			mtask.style.display = 'block';
+			this.mtaskVisible = true;
+		},
+		hiddenMtask(){
+			let mtask = document.getElementById("mtask");
+			let mlogs = document.getElementById("mlogs");
+			mtask.style.display = 'none';
+			mlogs.style.height = '100%';
+			this.mtaskVisible = false;
+		},
 	},
 };
 </script>
 <style scoped>
+.iconWrap {
+    position: absolute;
+	width: 30px;
+	height: 30px;
+	border-radius: 16px;
+	border: 1px solid #ccc;
+	top: 58%;
+	left: 50%;
+}
+.iconSpan{
+	display: inline-block;
+	width: 28px;
+	text-align: center;
+	line-height: 32px;
+	font-size: 20px;
+}
+.iconWrap.iconWrapBottom{
+	top: 95%;
+}
 </style>

src/views/wpm_bx/mtask.vue

@@ -1,6 +1,6 @@
 <template>
 	<el-container>
-		<el-main>
+		<el-main style="height: 100%;">
 			<scTable
 				ref="table"
 				:apiObj="apiObj"