给商品列表的列设置增加恢复默认按钮

This commit is contained in:
季圣华
2023-08-09 21:31:53 +08:00
parent 8de438b0e1
commit c539e4c982

View File

@@ -108,7 +108,7 @@
</a-dropdown> </a-dropdown>
<a-popover trigger="click" placement="right"> <a-popover trigger="click" placement="right">
<template slot="content"> <template slot="content">
<a-checkbox-group @change="onColChange" v-model="settingColumns" :defaultValue="settingColumns"> <a-checkbox-group @change="onColChange" v-model="settingDataIndex" :defaultValue="settingDataIndex">
<a-row style="width: 500px"> <a-row style="width: 500px">
<template v-for="(item,index) in defColumns"> <template v-for="(item,index) in defColumns">
<template> <template>
@@ -120,6 +120,11 @@
</template> </template>
</template> </template>
</a-row> </a-row>
<a-row style="padding-top: 10px;">
<a-col>
恢复默认列配置:<a-button @click="handleRestDefault" type="link" size="small">恢复默认</a-button>
</a-col>
</a-row>
</a-checkbox-group> </a-checkbox-group>
</template> </template>
<a-button icon="setting">列设置</a-button> <a-button icon="setting">列设置</a-button>
@@ -237,12 +242,14 @@
ipagination:{ ipagination:{
pageSizeOptions: ['10', '20', '30', '50', '100', '200'] pageSizeOptions: ['10', '20', '30', '50', '100', '200']
}, },
// 实际表头 // 实际索引
settingDataIndex:[],
// 实际列
columns:[], columns:[],
// 初始化设置的表头 // 默认索引
settingColumns:['mBarCode','name','standard','model','color','categoryName','materialOther','unit', 'stock', defDataIndex:['action','mBarCode','name','standard','model','color','categoryName','materialOther','unit', 'stock',
'purchaseDecimal','commodityDecimal','wholesaleDecimal','lowDecimal','enabled','enableSerialNumber','enableBatchNumber','action'], 'purchaseDecimal','commodityDecimal','wholesaleDecimal','lowDecimal','enabled','enableSerialNumber','enableBatchNumber'],
// 默认 // 默认列
defColumns: [ defColumns: [
{ {
title: '操作', title: '操作',
@@ -312,26 +319,27 @@
initColumnsSetting(){ initColumnsSetting(){
let columnsStr = Vue.ls.get('materialColumns') let columnsStr = Vue.ls.get('materialColumns')
if(columnsStr && columnsStr.indexOf(',')>-1) { if(columnsStr && columnsStr.indexOf(',')>-1) {
this.settingColumns = columnsStr.split(',') this.settingDataIndex = columnsStr.split(',')
} else {
this.settingDataIndex = this.defDataIndex
} }
this.columns = this.defColumns.filter(item => { this.columns = this.defColumns.filter(item => {
if (this.settingColumns.includes(item.dataIndex)) { return this.settingDataIndex.includes(item.dataIndex)
return true
}
return false
}) })
}, },
//列设置更改事件 //列设置更改事件
onColChange (checkedValues) { onColChange (checkedValues) {
this.columns = this.defColumns.filter(item => { this.columns = this.defColumns.filter(item => {
if (checkedValues.includes(item.dataIndex)) { return checkedValues.includes(item.dataIndex)
return true
}
return false
}) })
let columnsStr = checkedValues.join() let columnsStr = checkedValues.join()
Vue.ls.set('materialColumns', columnsStr) Vue.ls.set('materialColumns', columnsStr)
}, },
//恢复默认
handleRestDefault() {
Vue.ls.remove('materialColumns')
this.initColumnsSetting()
},
loadTreeData(){ loadTreeData(){
let that = this; let that = this;
let params = {}; let params = {};