优化页面-手机端响应式
This commit is contained in:
		| @@ -1,64 +1,67 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form | ||||
|       :model="queryParams" | ||||
|       ref="queryForm" | ||||
|       :inline="true" | ||||
|       label-width="68px" | ||||
|     > | ||||
|       <el-form-item label="幼儿姓名" prop="name"> | ||||
|         <el-input | ||||
|           v-model="queryParams.name" | ||||
|           placeholder="请输入幼儿姓名" | ||||
|           clearable | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="幼儿性别" prop="xb"> | ||||
|         <el-select | ||||
|           v-model="queryParams.xb" | ||||
|           placeholder="请选择幼儿性别" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in sexOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="当前状态" prop="status"> | ||||
|         <el-select | ||||
|           v-model="queryParams.status" | ||||
|           placeholder="请选择当前状态" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in statusOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button | ||||
|           type="primary" | ||||
|           icon="el-icon-search" | ||||
|           size="mini" | ||||
|           @click="handleQuery" | ||||
|           >搜索</el-button | ||||
|         > | ||||
|         <el-button icon="el-icon-refresh" size="mini" @click="resetQuery" | ||||
|           >重置</el-button | ||||
|         > | ||||
|       </el-form-item> | ||||
|     <el-form :model="queryParams" ref="queryForm" label-width="70px"> | ||||
|       <el-row :gutter="10"> | ||||
|         <el-col :xs="24" :ms="12" :md="5"> | ||||
|           <el-form-item label="幼儿姓名" prop="name"> | ||||
|             <el-input | ||||
|               v-model="queryParams.name" | ||||
|               placeholder="请输入幼儿姓名" | ||||
|               clearable | ||||
|               size="small" | ||||
|               @keyup.enter.native="handleQuery" | ||||
|             /> | ||||
|           </el-form-item> | ||||
|         </el-col> | ||||
|         <el-col :xs="24" :ms="12" :md="5"> | ||||
|           <el-form-item label="幼儿性别" prop="xb"> | ||||
|             <el-select | ||||
|               v-model="queryParams.xb" | ||||
|               placeholder="请选择幼儿性别" | ||||
|               clearable | ||||
|               size="small" | ||||
|             > | ||||
|               <el-option | ||||
|                 v-for="dict in sexOptions" | ||||
|                 :key="dict.dictValue" | ||||
|                 :label="dict.dictLabel" | ||||
|                 :value="dict.dictValue" | ||||
|               /> | ||||
|             </el-select> | ||||
|           </el-form-item> | ||||
|         </el-col> | ||||
|         <el-col :xs="24" :ms="12" :md="5"> | ||||
|           <el-form-item label="当前状态" prop="status"> | ||||
|             <el-select | ||||
|               v-model="queryParams.status" | ||||
|               placeholder="请选择当前状态" | ||||
|               clearable | ||||
|               size="small" | ||||
|             > | ||||
|               <el-option | ||||
|                 v-for="dict in statusOptions" | ||||
|                 :key="dict.dictValue" | ||||
|                 :label="dict.dictLabel" | ||||
|                 :value="dict.dictValue" | ||||
|               /> | ||||
|             </el-select> | ||||
|           </el-form-item> | ||||
|         </el-col> | ||||
|         <el-col :xs="24" :ms="12" :md="4"> | ||||
|           <el-form-item class="no-margin"> | ||||
|             <el-button | ||||
|               type="primary" | ||||
|               icon="el-icon-search" | ||||
|               size="mini" | ||||
|               @click="handleQuery" | ||||
|               >搜索</el-button | ||||
|             > | ||||
|             <el-button icon="el-icon-refresh" size="mini" @click="resetQuery" | ||||
|               >重置</el-button | ||||
|             > | ||||
|           </el-form-item> | ||||
|         </el-col> | ||||
|       </el-row> | ||||
|     </el-form> | ||||
|  | ||||
|     <div class="mb8 btn-list"> | ||||
| @@ -1118,7 +1121,7 @@ export default { | ||||
|     submitForm_tb: function () { | ||||
|       this.$refs["form"].validate((valid) => { | ||||
|         if (valid) { | ||||
|           console.log(this.ids + "---" + this.form.classid); | ||||
|           // console.log(this.ids + "---" + this.form.classid); | ||||
|           updateChild_tb(this.form, this.ids).then((response) => { | ||||
|             if (response.code === 200) { | ||||
|               this.msgSuccess("调班成功"); | ||||
| @@ -1232,3 +1235,20 @@ export default { | ||||
|   }, | ||||
| }; | ||||
| </script> | ||||
| <style lang="scss" scoped> | ||||
| .el-select { | ||||
|   width: 100%; | ||||
| } | ||||
| .my-date-picker { | ||||
|   width: 100%; | ||||
| } | ||||
| .edit-btns { | ||||
|   .el-button { | ||||
|     display: block; | ||||
|     margin: 0 auto; | ||||
|   } | ||||
| } | ||||
| .no-margin ::v-deep.el-form-item__content { | ||||
|   margin: 0 !important; | ||||
| } | ||||
| </style> | ||||
		Reference in New Issue
	
	Block a user