|  |  |  | 
|---|
|  |  |  | <template> | 
|---|
|  |  |  | <div class="search-form-collapse" :class="{'collapse__hidden': !showMore}"> | 
|---|
|  |  |  | <slot></slot> | 
|---|
|  |  |  | <el-button v-if="!showMore" class="collapse__switch" @click="showMore = true">更多查询...</el-button> | 
|---|
|  |  |  | <el-button v-else class="collapse__switch" @click="showMore = false">收起</el-button> | 
|---|
|  |  |  | <el-button  v-if="needMore && !showMore" class="collapse__switch" @click="showMore = true">更多查询...</el-button> | 
|---|
|  |  |  | <el-button v-else-if="needMore && showMore" class="collapse__switch" @click="showMore = false">收起</el-button> | 
|---|
|  |  |  | </div> | 
|---|
|  |  |  | </template> | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <script> | 
|---|
|  |  |  | export default { | 
|---|
|  |  |  | name: 'SearchFormCollapse', | 
|---|
|  |  |  | props: { | 
|---|
|  |  |  | needMore: { | 
|---|
|  |  |  | type: Boolean, | 
|---|
|  |  |  | required: false, | 
|---|
|  |  |  | default: () => true | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | data () { | 
|---|
|  |  |  | return { | 
|---|
|  |  |  | showMore: false | 
|---|