init

src/views/Customer/index.vue

@@ -1,5 +1,104 @@
 <template>
   <div class="box-center">
+    <div class="add-button">
+          <el-button type="primary">筛选</el-button>
+    </div>
+    <div class="booxtop">
+       <div class="app-topbox">
+           <div class="div-labox">
+              <div class="labeltext">楼盘选择：</div>
+              <el-select
+               class="div-inpbox"
+                v-model="searchForm.projectId"
+                @change="houseChange"
+                placeholder="请选择"
+                filterable
+              >
+                <el-option
+                  v-for="item in houseList"
+                  :key="item.id"
+                  :label="item.propertyName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+           </div>
+           <div class="div-labox">
+              <div class="labeltext">楼盘选择：</div>
+              <el-select
+               class="div-inpbox"
+                v-model="searchForm.projectId"
+                @change="houseChange"
+                placeholder="请选择"
+                filterable
+              >
+                <el-option
+                  v-for="item in houseList"
+                  :key="item.id"
+                  :label="item.propertyName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+           </div>
+                  <div class="div-labox">
+              <div class="labeltext">楼盘选择：</div>
+              <el-select
+               class="div-inpbox"
+                v-model="searchForm.projectId"
+                @change="houseChange"
+                placeholder="请选择"
+                filterable
+              >
+                <el-option
+                  v-for="item in houseList"
+                  :key="item.id"
+                  :label="item.propertyName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+           </div>
+                   <div class="div-labox">
+              <div class="labeltext">楼盘选择：</div>
+              <el-select
+               class="div-inpbox"
+                v-model="searchForm.projectId"
+                @change="houseChange"
+                placeholder="请选择"
+                filterable
+              >
+                <el-option
+                  v-for="item in houseList"
+                  :key="item.id"
+                  :label="item.propertyName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+           </div>
+                   <div class="div-labox">
+              <div class="labeltext">楼盘选择：</div>
+              <el-select
+               class="div-inpbox"
+                v-model="searchForm.projectId"
+                @change="houseChange"
+                placeholder="请选择"
+                filterable
+              >
+                <el-option
+                  v-for="item in houseList"
+                  :key="item.id"
+                  :label="item.propertyName"
+                  :value="item.id"
+                >
+                </el-option>
+              </el-select>
+           </div>
+       </div>
+    </div>
+
+
     <!-- 头 -->
     <div class="app-top">
       <div class="app-titel" v-if="orgType!=3">
@@ -295,6 +394,8 @@
         </el-pagination>
       </div>
     </div>
+
+
   </div>
 </template>
 
@@ -577,15 +678,57 @@ export default {
 
 <style scoped="scoped" lang="scss" >
 .box-center {
-  width: 100%;
-  padding: 15px;
+  width: 98%;
+  margin: 0 auto;
+  margin-top: 6px;
+  padding: 16px;
   min-width: 1000px;
-  padding-bottom: 100px;
+  padding-bottom: 20px;
+  background: #ffffff;
+  border-radius:4px;
+  font-size: 14px;
 }
+
+.booxtop{
+  width: 100%;
+  min-height: 80px;
+  padding-bottom: 20px;
+  background: #F7F8FA;
+  border-radius: 2px;
+  margin-top: 16px;
+  padding-left: 20px;
+  padding-right: 20px;
+  .app-topbox {
+    width: 100%;
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    .div-labox{
+      margin-right: 40px;
+      margin-top: 20px;
+      height: 32px;
+      display: flex;
+      align-items: center;
+      .labeltext{
+        line-height: 32px;
+      }
+      .div-inpbox{
+        width: 240px;
+      }
+    }
+  }
+}
+
+
+
+
+
+
+
 .cen-tab {
   width: 100%;
   padding: 15px;
-  background: #ffffff;
+  // background: #ffffff;
   margin-top: 15px;
 }
 .tophove {
@@ -594,8 +737,8 @@ export default {
 }
 .app-top {
   width: 100%;
-  background: #ffffff;
-  box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
+  // background: #ffffff;
+  // box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04);
   border-radius: 4px;
   padding-top: 15px;
   padding-bottom: 15px;