牵头单位例行监测搜索框样式调整

src/components/jc/routineMonitorqt.vue

@@ -7,40 +7,41 @@
 					<el-breadcrumb-item>首页</el-breadcrumb-item>
 					<el-breadcrumb-item>牵头单位</el-breadcrumb-item>
 					<el-breadcrumb-item>任务列表</el-breadcrumb-item>
-
 				</el-breadcrumb>
 			</div>
 			<!-- 头部搜索栏 -->
-			<el-row :gutter="50" style="margin-right: 0px;">
-				<el-form style="display: flex; flex-direction: row;">
-					<el-form-item label="年度" class="select">
-						<el-date-picker v-model="queryInfo.year" style="width: 110px;" value-format="yyyy"
-							type="year" clearable />
-					</el-form-item>
-					<el-form-item label="任务状态" class="select">
-						<el-select v-model="queryInfo.ispublic" style="width: 110px;">
-							<el-option v-for="item in taskstatus" :key="item.value" :label="item.label"
-								:value="item.value">
-							</el-option>
-						</el-select>
-					</el-form-item>
-					<el-form-item label="任务时间" class="select">
-						<el-date-picker v-model="queryInfo.starttime" style="width: 180px;" align="right" type="date"
-							:picker-options="pickerOptions" clearable />
-					</el-form-item>
-					<el-form-item label="--" class="select" style="margin-left: 10px; padding-left: 0px;">
-						<el-date-picker v-model="queryInfo.endtime" style="width: 180px;" align="right" type="date"
-							:picker-options="pickerOptions" clearable />
-					</el-form-item>
-					<el-form-item label="任务名称" class="select">
-						<el-input v-model="queryInfo.task_name"></el-input>
-					</el-form-item>
-					<!-- 查询 -->
-					<el-button style="height: 40px;margin-left: 10px;" type="success"  size="mini" @click="searchData()">查询</el-button>
-					<!-- 重置 -->
-					<el-button style="height: 40px;margin-left: 5px;" type="success"  size="mini" @click="reset()">重置</el-button>
-				</el-form>
-			</el-row>
+			<div class="form">
+				<el-row :gutter="50" style="margin-right: 0px;">
+					<el-form style="display: flex; flex-flow: row nowrap;">
+						<el-form-item label="年度" class="select" style="margin-left: -0.3%;">
+							<el-date-picker v-model="queryInfo.year" value-format="yyyy"
+								type="year" clearable />
+						</el-form-item>
+						<el-form-item label="任务状态" class="select">
+							<el-select v-model="queryInfo.ispublic">
+								<el-option v-for="item in taskstatus" :key="item.value" :label="item.label"
+									:value="item.value">
+								</el-option>
+							</el-select>
+						</el-form-item>
+						<el-form-item label="任务时间" class="select">
+							<el-date-picker v-model="queryInfo.starttime" align="right" type="date"
+								:picker-options="pickerOptions" lable clearable />
+						</el-form-item>
+						<el-form-item label="--" class="select" style="margin-left: -3.5%;">
+							<el-date-picker v-model="queryInfo.endtime" align="right" type="date"
+								:picker-options="pickerOptions" clearable />
+						</el-form-item>
+						<el-form-item label="任务名称" class="select">
+							<el-input v-model="queryInfo.task_name"></el-input>
+						</el-form-item>
+						<!-- 查询 -->
+						<el-button style="height: 2.5rem;margin-left: 1%;" type="success"  size="mini" @click="searchData()">查询</el-button>
+						<!-- 重置 -->
+						<el-button style="height: 2.5rem;margin-left: 0.5%;" type="success"  size="mini" @click="reset()">重置</el-button>
+					</el-form>
+				</el-row>
+			</div>
 			<!--  头部钮区域-->
 			<!-- <el-row :gutter="90" style="margin-right: 0px;">
 				<div style="display: flex;flex-direction: row;float: right;">
@@ -323,37 +324,39 @@
 	// }
 
 	.el-select {
-		width: 210px;
+		// width: 210px;
 		height: 100%;
 	}
 
 	.select {
 		display: flex;
 		flex-direction: row;
-		margin-left: 10px;
+		margin-left: 0.6%;
 	}
 
 	.dialogItem /deep/ .el-dialog__body {
 		padding: 15px 12px 0;
 		color: #606266;
-		font-size: 14px;
+		font-size: .875rem;
 		word-break: break-all;
 	}
 
-	.el-form-item {
-		margin-bottom: 30px;
-		padding-left: 18px;
-	}
+	// .el-form-item {
+	// 	margin-left: 0.8%;
+	// }
+	
 
-	.labelItem /deep/ .el-form-item__label {
-		// width: 80px;
-		text-align: center;
+	// .labelItem /deep/ 
+	/deep/ .el-form-item__label {
+		width: 5.625rem;
+		margin-right: -1%;
+		text-align: right;
 		vertical-align: middle;
-		float: left;
-		font-size: 13px;
+		// float: left;
+		font-size: .8125rem;
 		color: #606266;
 		// line-height: 40px;
-		padding: 0 2px 0 0;
+		padding: 0% 4% 0% 0%;
 		-webkit-box-sizing: border-box;
 		box-sizing: border-box;
 	}
@@ -364,10 +367,18 @@
 	}
 	
 	.footer {
-		padding: 10px;
+		padding: 1%;
 		text-align: center;
 	}
 
+	.el-form{
+		width: 80%;
+	}
+
+
+	.el-date-editor.el-input, .el-date-editor.el-input__inner{
+		width:100%;
+	}
 	// .el-form-item__content{
 	// 	margin-left: 0;
 	// }