|
@@ -2,7 +2,8 @@ import './by-table.scss'
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
-
|
|
|
+ sortFilterModal:false,
|
|
|
+ checkboxValue:[],
|
|
|
}
|
|
|
},
|
|
|
props: {
|
|
@@ -47,7 +48,10 @@ export default {
|
|
|
}
|
|
|
|
|
|
}
|
|
|
- }
|
|
|
+ },
|
|
|
+ searchMoreFn:{
|
|
|
+ type:Function
|
|
|
+ },
|
|
|
|
|
|
},
|
|
|
methods: {
|
|
@@ -85,7 +89,6 @@ export default {
|
|
|
{
|
|
|
this.columns.map(item => {
|
|
|
if (item.actions) {
|
|
|
- console.log(item.actions)
|
|
|
return this.renderActionColumn(h, item)
|
|
|
} else if (item.render) {
|
|
|
return <el-table-column
|
|
@@ -172,7 +175,9 @@ export default {
|
|
|
return this.renderDropDown(h, item)
|
|
|
})
|
|
|
}
|
|
|
- <div class='more-text'>更多 <i class="el-icon-arrow-right el-icon--right"></i></div>
|
|
|
+ <div class='more-text' onClick={
|
|
|
+ () => this.searchMoreFn ? this.searchMoreFn() : console.log('请配置searchMoreFn方法')
|
|
|
+ }>更多 <i class="el-icon-arrow-right"></i></div>
|
|
|
</div>
|
|
|
<div style='display: flex;'>
|
|
|
<el-input
|
|
@@ -181,7 +186,12 @@ export default {
|
|
|
size="mini"
|
|
|
value={this.req.keyword} onInput={$event => this.req.keyword = $event}>
|
|
|
</el-input>
|
|
|
- <div class='more-icon'><i class="el-icon-arrow-right el-icon--right"></i></div>
|
|
|
+ <div class='more-icon' onClick={
|
|
|
+ () => this.searchMoreFn ? this.searchMoreFn() : console.log('请配置searchMoreFn方法')
|
|
|
+ }><i class="el-icon-wind-power"></i></div>
|
|
|
+ <div class='more-icon'>
|
|
|
+ <i onClick={() =>this.openSortFilterModal()} class="el-icon-notebook-2"></i>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
},
|
|
@@ -191,6 +201,34 @@ export default {
|
|
|
console.log(item.labelCopy)
|
|
|
})
|
|
|
},
|
|
|
+ openSortFilterModal(){
|
|
|
+ const v = this
|
|
|
+ v.sortFilterModal = true
|
|
|
+ console.log(v.sortFilterModal)
|
|
|
+ },
|
|
|
+ renderFilter(h){
|
|
|
+ const v = this
|
|
|
+ return <el-dialog
|
|
|
+ title="设置筛选列"
|
|
|
+ visible={v.sortFilterModal}
|
|
|
+ width="30%"
|
|
|
+ >
|
|
|
+ <el-checkbox-group v-model={this.checkboxValue} >
|
|
|
+ {
|
|
|
+ v.columns.map(items => {
|
|
|
+ return <el-checkbox label={items.label}></el-checkbox>
|
|
|
+ })
|
|
|
+ }
|
|
|
+ </el-checkbox-group>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
+ <el-button onClick={()=> v.sortFilterModal = false}>取 消</el-button>
|
|
|
+ <el-button type="primary" onClick={()=> v.sortFilterSubmit()}>确 定</el-button>
|
|
|
+ </span>
|
|
|
+ </el-dialog>
|
|
|
+ },
|
|
|
+ sortFilterSubmit(){
|
|
|
+ console.log(this.checkboxValue)
|
|
|
+ },
|
|
|
},
|
|
|
created() {
|
|
|
this.renderSearchInit()
|
|
@@ -201,10 +239,12 @@ export default {
|
|
|
const search = this.renderSearch(h)
|
|
|
const table = this.renderTable(h)
|
|
|
const page = this.renderPage(h)
|
|
|
+ const filter = this.renderFilter(h)
|
|
|
return <div class='by-table'>
|
|
|
{search}
|
|
|
{table}
|
|
|
{page}
|
|
|
+ {filter}
|
|
|
</div>
|
|
|
},
|
|
|
}
|