style(综合查询):查询表单样式修改

 <template>
+    <el-row>
+        <el-col :span="18">
+            <el-row>
+                <el-col :span="22">
                     <el-form :inline="true" :model="formData" class="demo-form-inline">
-		<el-form-item label="宗地编码">
+                        <el-form-item label="宗地编码:">
                             <el-input v-model="formData.zdbm" placeholder="输入宗地编码"></el-input>
                         </el-form-item>
-		<el-form-item label="坐落">
+                        <el-form-item label="坐落:">
                             <el-input v-model="formData.zl" placeholder="输入坐落地址"></el-input>
                         </el-form-item>
-		<el-form-item label="不动产单元号">
+                    </el-form>
+                </el-col>
+                <el-col :span="2">
+                    <el-button type="primary" @click="onSubmit">查询</el-button>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="22">
+                    <el-form :inline="true" :model="formData" class="demo-form-inline">
+                        <el-form-item label="不动产单元号:">
                             <el-input
                                     v-model="formData.bdcdyh"
                                     placeholder="输入不动产单元号"
                             ></el-input>
                         </el-form-item>
-		<el-form-item>
-			<el-button type="primary" @click="onSubmit">查询</el-button>
-			<el-button type="warning" @click="onSubmit">重置</el-button>
-			<el-button type="primary" class="moreSearchBtn" @click="onSubmit"
-				>更多查询</el-button
-			>
-		</el-form-item>
-		<el-form-item class="db" label="查询范围">
+                        <el-form-item class="demo-form-inline" label="单元类型:">
                             <el-checkbox-group v-model="formData.type">
                                 <el-checkbox label="宗地" name="type"></el-checkbox>
                                 <el-checkbox label="自然幢" name="type"></el-checkbox>
@@ -30,15 +36,44 @@
                             </el-checkbox-group>
                         </el-form-item>
                     </el-form>
+                </el-col>
+                <el-col :span="2">
+                    <el-button type="warning" @click="onSubmit">重置</el-button>
+                </el-col>
+            </el-row>
+            <el-row>
+                <el-col :span="22" v-show="ismore">
+                    <el-form :inline="true" :model="formData" class="demo-form-inline">
+                        <el-form-item label="权利人名称:">
+                            <el-input placeholder="输入权利人名称"></el-input>
+                        </el-form-item>
+                        <el-form-item label="项目名称:">
+                            <el-input placeholder="输入项目名称"></el-input>
+                        </el-form-item>
+                        <el-form-item label="不动产权证号:">
+                            <el-input placeholder="输入不动产权证号"></el-input>
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+                <el-col :span="2" :offset="offset">
+                    <el-button type="primary" class="moreSearchBtn" @click="more">更多查询
+                    </el-button>
+                </el-col>
+            </el-row>
+        </el-col>
+    </el-row>
+
 </template>
 
 <script>
-export default {
+    export default {
         name: "",
         components: {},
         props: {},
         data() {
             return {
+                offset: 22,
+                ismore: false,
                 formData: {
                     zdbm: "",
                     zl: "",
@@ -49,7 +84,7 @@ export default {
         },
         created() {
             let self = this;
-		document.onkeydown = function(e) {
+            document.onkeydown = function (e) {
                 //按下回车提交
                 let key = window.event.keyCode;
                 //事件中keycode=13为回车事件
@@ -58,8 +93,17 @@ export default {
                 }
             };
         },
-	mounted() {},
+        mounted() {
+        },
         methods: {
+            more() {
+                this.ismore = !this.ismore
+                if (this.ismore){
+                    this.offset=0
+                } else {
+                    this.offset=22
+                }
+            },
             onSubmit() {
                 //子组件点击查询时将表单数据发送给父组件
                 this.$emit("getSearchCondition", this.formData);
@@ -67,6 +111,10 @@ export default {
         },
         computed: {},
         watch: {},
-};
+    };
 </script>
-<style scoped lang="less"></style>
+<style scoped lang="less">
+    .el-button {
+        width: 100px;
+    }
+</style>