修改高度控制

src/views/portal/case/Index.vue

@@ -32,7 +32,7 @@
                     <div style="flex:1;">
                     <el-radio-group v-model="queryCondition.orgDomain" size="mini" @change="search()">
                        <el-radio-button :label="null">全部</el-radio-button>
-                   
+
                     <el-radio-button v-for="item in domain" :key="item.code" :label="item.code"> {{ item.name}}</el-radio-button>
                   </el-radio-group>
                     </div>
@@ -59,7 +59,7 @@
                   </el-col>
                 </el-row>
               </div>
-              <div class="searBox" v-if="speciData.length > 15">
+              <div class="searBox" v-if="searchwd">
                  <el-button type="text"  id="closeSearchBtn" @click="closeSearch">
                       {{word}}
                      <i :class="showAll ? 'el-icon-arrow-up ': 'el-icon-arrow-down'"></i>
@@ -201,7 +201,7 @@
                   <!-- <el-tooltip :enterable="false" @click.native="jumpRouter(item)" effect="light" :content="item.title + '（' + item.authorName+ ')'" placement="bottom" :visible-arrow="false" popper-class="text-tooltip"> -->
                     <div :title="item.title+ '（' + item.authorName+ ')'">
                         <el-col :span="15" style="cursor: pointer;" class="title-line-ellipsis"> {{ item.title }}</el-col>
-                      
+
                     </div>
                   <!-- </el-tooltip> -->
                   <!-- <el-col class="center" style="color: #FF8E00;" :span="5">{{ item.score }}</el-col> -->
@@ -281,8 +281,9 @@ export default {
       speciData:[],
       moreState: 1, // 1 加载更多 2 加载中 3无数据
       isSeach: false,
-      searchwd: true,
+      searchwd: false,
       showAll: true, //是否展开全部
+      initHeight:40,//原始 高度
       searchRecords: [],
       caseList: {
         count: 0,
@@ -326,9 +327,9 @@ export default {
       this.queryCondition.orgDomain = null;
     };
     this.specialized();
-    this.$nextTick(function() {
+    // this.$nextTick(function() {
-      this.closeSearch();
+    //   this.closeSearch();
-    });
+    // });
     if (!this.portalCase.readProtocol) {
       this.protocolDialogVisible = true;
     }
@@ -345,7 +346,7 @@ export default {
     // this.getCaseData();
     this.search();
     window.addEventListener("scroll", this.handleScroll);
-    
+
   },
 
   watch: {
@@ -362,9 +363,14 @@ export default {
   },
   methods: {
   specialized(){
+    let $this=this;
     apiCase.majorTypes().then(res =>{
       if(res.status == 200){
-        this.speciData = res.result
+        this.speciData = res.result;
+        this.$nextTick(function() {
+          $this.initHeight = document.getElementById("searchBox").offsetHeight;
+          $this.closeSearch();
+        });
       }
     })
   },
@@ -399,17 +405,18 @@ export default {
     closeSearch() {
       this.showAll = !this.showAll;
       var searchBoxHeght = document.getElementById("searchBox");
-      var searchBoxWidth = document.getElementById("searchBox");
+      //console.log(this.initHeight,'this.initHeight');
-      if (searchBoxWidth.clientWidth > 950) {
+      if(this.initHeight>80){
-        this.searchwd = false;
+        this.searchwd = true;
       }
-      if (this.showAll == false) {
+      //console.log(het,'het');
-        searchBoxHeght.style.height = 40 + "px";
+      if(this.showAll){
-      } else {
+        //searchBoxHeght.style.height = "auto";
-        searchBoxHeght.style.height = "auto";
+        searchBoxHeght.style.maxHeight = this.initHeight + "px";
+      }else{
+        searchBoxHeght.style.maxHeight = 70 + "px";
       }
     },
-
     getAnkingData() {
       apiCase.usernameList(5).then(res => {
         if (res.status == 200) {
@@ -632,9 +639,9 @@ export default {
       }
     },
     tagsClose(tag, index) {
-      
+
       for (let i in this.queryCondition) {
-        
+
         if (tag.type === i) {
           if (i == "majorType") {
              this.queryCondition.majorType = '';
@@ -654,11 +661,11 @@ export default {
           if (i == "orgDomain") {
             this.queryCondition.orgDomain = null;
           }
-         
+
           this.getCaseData();
         }
       }
-      
+
     },
     getCaseUserData(caseList) {
       let ids = caseList.map((item, index) => {
@@ -714,7 +721,7 @@ export default {
               title:'',
              })
           }
-            
+
           }
         }
       });
@@ -755,14 +762,14 @@ export default {
   margin-right: 20px;
 }
 .clearfix:after{
-  content: "020"; 
+  content: "020";
-  display: block; 
+  display: block;
-  height: 0; 
+  height: 0;
-  clear: both; 
+  clear: both;
-  visibility: hidden;  
+  visibility: hidden;
   }
 .keyword-text {
-  
+
   div {
     padding:0px 7px;
     margin-top: 5px;
@@ -781,6 +788,7 @@ export default {
 }
 #searchBox {
   overflow: hidden;
+
 }
 .ranking-title {
   line-height: 34px;