| | |
| | | <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 |
| | |
| | | height: 50px; |
| | | overflow: hidden; |
| | | padding-right: 250px; |
| | | /deep/ section { |
| | | ::v-deep section { |
| | | position: absolute; |
| | | top: 0; |
| | | right: 100px; |