1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
| <template>
| <div class="search-bar-compontent">
| <div class="form-view"><slot></slot></div>
| <div class="btns-view">
| <el-button type="primary" @click.stop="onSearch"><el-icon class="btn-left-icon"><search /></el-icon>搜索</el-button>
| <el-button @click.stop="onReset"><el-icon class="btn-left-icon"><refresh-left /></el-icon>重置</el-button>
| </div>
| </div>
| </template>
|
| <script>
| import {Search,RefreshLeft} from '@element-plus/icons'
| export default {
| name:'searchBarCompontent',
| components:{Search,RefreshLeft},
| methods:{
| onSearch(e){
| this.$emit('search',e)
| },
| onReset(e){
| this.$emit('reset',e)
| }
| }
| }
| </script>
|
| <style scoped lang="scss">
| .search-bar-compontent{
| display: flex;
| .form-view{
| flex: 1;
| }
| .btns-view{
| width: 210px;
| text-align: right;
| flex-shrink: 0;
| }
| }
| </style>
|
|
