重构代码:根据屏幕大小重新布局查询条件控件

This commit is contained in:
Argo-Lenovo 2017-05-28 12:33:20 +08:00
parent ead505cb29
commit a31b051c58
6 changed files with 20 additions and 20 deletions

View File

@ -21,7 +21,7 @@
<div class="panel-body"> <div class="panel-body">
<form class="form-inline" role="form"> <form class="form-inline" role="form">
<div class="row"> <div class="row">
<div class="form-group col-xs-12 col-sm-6 col-md-5 col-lg-5"> <div class="form-group col-lg-5">
<label class="control-label" for="txt_operate_start">起始时间</label> <label class="control-label" for="txt_operate_start">起始时间</label>
<div class="input-group date form_date"> <div class="input-group date form_date">
<input id="txt_operate_start" class="form-control" size="16" type="text" value="" readonly> <input id="txt_operate_start" class="form-control" size="16" type="text" value="" readonly>
@ -29,7 +29,7 @@
<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span> <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
</div> </div>
</div> </div>
<div class="form-group col-xs-12 col-sm-6 col-md-5 col-lg-5"> <div class="form-group col-lg-5">
<label class="control-label" for="txt_operate_end">终止时间</label> <label class="control-label" for="txt_operate_end">终止时间</label>
<div class="input-group date form_date"> <div class="input-group date form_date">
<input id="txt_operate_end" class="form-control" size="16" type="text" value="" readonly> <input id="txt_operate_end" class="form-control" size="16" type="text" value="" readonly>
@ -37,7 +37,7 @@
<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span> <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
</div> </div>
</div> </div>
<div class="form-group col-xs-12 col-sm-12 col-md-2 col-lg-2"> <div class="form-group col-lg-2">
<label class="sr-only"></label> <label class="sr-only"></label>
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>

View File

@ -9,15 +9,15 @@
@section query { @section query {
<form class="form-inline" role="form"> <form class="form-inline" role="form">
<div class="row"> <div class="row">
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_search_name">部门名称</label> <label class="control-label" for="txt_search_name">部门名称</label>
<input type="text" class="form-control" id="txt_search_name" /> <input type="text" class="form-control" id="txt_search_name" />
</div> </div>
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_group_desc">部门描述</label> <label class="control-label" for="txt_group_desc">部门描述</label>
<input type="text" class="form-control" id="txt_group_desc" /> <input type="text" class="form-control" id="txt_group_desc" />
</div> </div>
<div class="form-group col-lg-2"> <div class="form-group col-md-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>
</div> </div>

View File

@ -26,7 +26,7 @@
</div> </div>
</div> </div>
<div class="row"> <div class="row">
<div class="form-group col-xs-12 col-sm-6 col-md-5"> <div class="form-group col-sm-6 col-lg-5">
<label class="control-label" for="txt_operate_start">起始时间</label> <label class="control-label" for="txt_operate_start">起始时间</label>
<div class="input-group date form_date"> <div class="input-group date form_date">
<input id="txt_operate_start" class="form-control" size="16" type="text" value="" readonly> <input id="txt_operate_start" class="form-control" size="16" type="text" value="" readonly>
@ -34,7 +34,7 @@
<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span> <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
</div> </div>
</div> </div>
<div class="form-group col-xs-12 col-sm-6 col-md-5"> <div class="form-group col-sm-6 col-lg-5">
<label class="control-label" for="txt_operate_end">终止时间</label> <label class="control-label" for="txt_operate_end">终止时间</label>
<div class="input-group date form_date"> <div class="input-group date form_date">
<input id="txt_operate_end" class="form-control" size="16" type="text" value="" readonly> <input id="txt_operate_end" class="form-control" size="16" type="text" value="" readonly>
@ -42,7 +42,7 @@
<span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span> <span class="input-group-addon"><span class="glyphicon glyphicon-th"></span></span>
</div> </div>
</div> </div>
<div class="form-group col-xs-12 col-sm-12 col-md-2"> <div class="form-group col-lg-2">
<label class="sr-only"></label> <label class="sr-only"></label>
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>

View File

@ -14,15 +14,15 @@
@section query { @section query {
<form class="form-inline" role="form"> <form class="form-inline" role="form">
<div class="row"> <div class="row">
<div class="form-group col-sm-6 col-md-3"> <div class="form-group col-sm-12 col-md-6 col-lg-5">
<label class="control-label" for="txt_menus_name">菜单名称</label> <label class="control-label" for="txt_menus_name">菜单名称</label>
<input type="text" class="form-control" id="txt_menus_name" /> <input type="text" class="form-control" id="txt_menus_name" />
</div> </div>
<div class="form-group col-sm-6 col-md-3"> <div class="form-group col-sm-12 col-md-6 col-lg-5">
<label class="control-label" for="txt_parent_menus_name">父级菜单</label> <label class="control-label" for="txt_parent_menus_name">父级菜单</label>
<input type="text" class="form-control" id="txt_parent_menus_name" /> <input type="text" class="form-control" id="txt_parent_menus_name" />
</div> </div>
<div class="form-group col-sm-6 col-md-2"> <div class="form-group col-sm-6 col-md-6 col-lg-5">
<label class="control-label" for="sel_menus_category">菜单类别</label> <label class="control-label" for="sel_menus_category">菜单类别</label>
<div class="dropdown lgbDropdown"> <div class="dropdown lgbDropdown">
<a id="sel_menus_category" class="btn btn-success" data-toggle="dropdown"> <a id="sel_menus_category" class="btn btn-success" data-toggle="dropdown">
@ -37,7 +37,7 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="form-group col-sm-6 col-md-2"> <div class="form-group col-sm-6 col-md-6 col-lg-5">
<label class="control-label" for="sel_menus_category">菜单类型</label> <label class="control-label" for="sel_menus_category">菜单类型</label>
<div class="dropdown lgbDropdown"> <div class="dropdown lgbDropdown">
<a id="sel_menus_res" class="btn btn-success" data-toggle="dropdown"> <a id="sel_menus_res" class="btn btn-success" data-toggle="dropdown">
@ -52,7 +52,7 @@
</ul> </ul>
</div> </div>
</div> </div>
<div class="form-group col-xs-12 col-sm-1"> <div class="form-group col-lg-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>
</div> </div>

View File

@ -15,15 +15,15 @@
@section query { @section query {
<form class="form-inline" role="form"> <form class="form-inline" role="form">
<div class="row"> <div class="row">
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_search_name">角色名称</label> <label class="control-label" for="txt_search_name">角色名称</label>
<input type="text" class="form-control" id="txt_search_name" /> <input type="text" class="form-control" id="txt_search_name" />
</div> </div>
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_role_desc">角色描述</label> <label class="control-label" for="txt_role_desc">角色描述</label>
<input type="text" class="form-control" id="txt_role_desc" /> <input type="text" class="form-control" id="txt_role_desc" />
</div> </div>
<div class="form-group col-lg-2"> <div class="form-group col-md-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>
</div> </div>

View File

@ -9,15 +9,15 @@
@section query { @section query {
<form class="form-inline" role="form"> <form class="form-inline" role="form">
<div class="row"> <div class="row">
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_search_name">登陆名称</label> <label class="control-label" for="txt_search_name">登陆名称</label>
<input type="text" class="form-control" id="txt_search_name" /> <input type="text" class="form-control" id="txt_search_name" />
</div> </div>
<div class="form-group col-lg-5"> <div class="form-group col-md-5">
<label class="control-label" for="txt_display_name">显示名称</label> <label class="control-label" for="txt_display_name">显示名称</label>
<input type="text" class="form-control" id="txt_display_name" /> <input type="text" class="form-control" id="txt_display_name" />
</div> </div>
<div class="form-group col-lg-2"> <div class="form-group col-md-2">
<button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button> <button type="button" id="btn_query" class="btn btn-primary form-control"><i class="fa fa-search" aria-hidden="true"></i><span>查询</span></button>
</div> </div>
</div> </div>