From 9d4a8085150727416faf64c10d155759c86fc760 Mon Sep 17 00:00:00 2001
From: qq787203167 <787203167@qq.com>
Date: Fri, 11 Feb 2022 17:38:35 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=90=9C=E7=B4=A2=E6=9D=A1?=
 =?UTF-8?q?=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 jero-web/src/components/addForm/index.vue |   3 +-
 jero-web/src/components/search/index.vue  | 107 +++++++++++++++-------
 2 files changed, 78 insertions(+), 32 deletions(-)

diff --git a/jero-web/src/components/addForm/index.vue b/jero-web/src/components/addForm/index.vue
index fcbda1195..cac3635ea 100644
--- a/jero-web/src/components/addForm/index.vue
+++ b/jero-web/src/components/addForm/index.vue
@@ -58,7 +58,8 @@
                   <span :class="{'title-text-text':false}">{{item.name}}</span>
                 </div>
                 <a-form-model-item class="itemModel" :prop="item.attrModel">
-                  <a-range-picker class="box-input" v-model="formInline[item.attrModel]" @change="onChange"></a-range-picker>
+                  <a-range-picker class="box-input" v-model="formInline[item.attrModel]"
+                                  @change="onChange"></a-range-picker>
                 </a-form-model-item>
               </div>
             </a-col>
diff --git a/jero-web/src/components/search/index.vue b/jero-web/src/components/search/index.vue
index 3223bafc5..5fe5068ac 100644
--- a/jero-web/src/components/search/index.vue
+++ b/jero-web/src/components/search/index.vue
@@ -2,43 +2,85 @@
   <a-form layout="inline" @keyup.enter.native="searchQuery">
     <a-row :gutter="24">
       <a-col :md="6" :sm="8" v-for="(item,index) in searchList" :key="index" style="line-height: 48px">
-        <div class="box-title-text" v-if="item.field_show_type == 'text'">
-          <div class="title-text">
-            <span>{{item.db_field_en_name}}</span><br>
-            <span>{{item.db_field_txt}}</span>
+        <template v-if="index < 2">
+          <div class="box-title-text" v-if="item.field_show_type == 'text'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <a-input class="box-input" :placeholder="item.placeholder"
+                     v-model="queryParam[item.db_field_name]"></a-input>
           </div>
-          <a-input class="box-input" :placeholder="item.placeholder" v-model="queryParam[item.db_field_name]"></a-input>
-        </div>
-        <div class="box-title-text" v-else-if="item.field_show_type == 'list_multi'">
-          <div class="title-text">
-            <span>{{item.db_field_en_name}}</span><br>
-            <span>{{item.db_field_txt}}</span>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'list_multi'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
+                                :placeholder="$t('selectStatus')" :type="'select'"
+                                :triggerChange="false" :dictCode="item.dict_field"/>
           </div>
-          <j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
-                              :placeholder="$t('selectStatus')" :type="'select'"
-                              :triggerChange="false" :dictCode="item.dict_field"/>
-        </div>
-        <div class="box-title-text" v-else-if="item.field_show_type == 'date'">
-          <div class="title-text">
-            <span>{{item.db_field_en_name}}</span><br>
-            <span>{{item.db_field_txt}}</span>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'date'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <a-date-picker class="box-input" v-model="queryParam[item.db_field_name]"/>
           </div>
-          <a-date-picker class="box-input" v-model="queryParam[item.db_field_name]"/>
-        </div>
-        <div class="box-title-text" v-else-if="item.field_show_type == 'list'">
-          <div class="title-text">
-            <span>{{item.db_field_en_name}}</span><br>
-            <span>{{item.db_field_txt}}</span>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'list'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
+                               :placeholder="$t('selectStatus')" :type="'select'"
+                               :triggerChange="false" :dictCode="item.dict_field"/>
           </div>
-          <j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
-                             :placeholder="$t('selectStatus')" :type="'select'"
-                             :triggerChange="false" :dictCode="item.dict_field"/>
-        </div>
+        </template>
+        <template v-if="toggleSearchStatus && index >= 2">
+          <div class="box-title-text" v-if="item.field_show_type == 'text'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <a-input class="box-input" :placeholder="item.placeholder"
+                     v-model="queryParam[item.db_field_name]"></a-input>
+          </div>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'list_multi'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
+                                :placeholder="$t('selectStatus')" :type="'select'"
+                                :triggerChange="false" :dictCode="item.dict_field"/>
+          </div>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'date'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <a-date-picker class="box-input" v-model="queryParam[item.db_field_name]"/>
+          </div>
+          <div class="box-title-text" v-else-if="item.field_show_type == 'list'">
+            <div class="title-text">
+              <span>{{item.db_field_en_name}}</span><br>
+              <span>{{item.db_field_txt}}</span>
+            </div>
+            <j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
+                               :placeholder="$t('selectStatus')" :type="'select'"
+                               :triggerChange="false" :dictCode="item.dict_field"/>
+          </div>
+        </template>
       </a-col>
       <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
                <a-col :md="6" :sm="24">
                   <a-button class="box-button" type="primary" @click="searchQuery">{{$t('query')}}</a-button>
                   <a-button class="box-button" style="margin-left: 8px" @click="searchReset">{{$t('reset')}}</a-button>
+                  <a @click="handleToggleSearch" style="margin-left: 8px" v-if="searchList.length >= 2">
+                {{ toggleSearchStatus ? '收起' : '展开' }}
+                    <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
+                  </a>
                </a-col>
       </span>
     </a-row>
@@ -67,7 +109,8 @@
     },
     data() {
       return {
-        queryParam: {}
+        queryParam: {},
+        toggleSearchStatus:false,
       }
     },
     mounted() {
@@ -88,10 +131,12 @@
         getAction(this.url.seachList, params).then((res) => {
           if (res.success) {
             this.searchList = res.result
-            console.log('reList',this.searchList)
           }
         })
-      }
+      },
+      handleToggleSearch(){
+           this.toggleSearchStatus = !this.toggleSearchStatus
+      },
     }
   }
 </script>