表格
<div>
<v-data-table
height="500px"
:headers="btnHeaders"
:items="btnDesserts"
show-select
hide-default-footer
class="elevation-1 mt-2"
:loading="loading"
loading-text="加载中... 请稍等"
@input="selectBtn"
:value="btnSelectDesserts"
>
</v-data-table>
</div>
//列名
btnHeaders: [
{
text: '按钮名称',
align: 'center',
sortable: false,
value: 'buttonName',
},
{
text: '按钮标识',
align: 'center',
sortable: false,
value: 'buttonKey',
},
{
text: '描述',
align: 'center',
sortable: false,
value: 'description',
}
],
//列值
btnDesserts:[],
//选中的数据
btnSelectDesserts:[],
//已选中的数据
selectBtnList:[],
//选中方法
selectBtn(row){
this.selectBtnList=row
},
//赋值
getBtnList(){
this.loading=true
this.$api.system.role.listByMenu({roleId:this.roleId,menuId:this.selectMenuId}).then((res) => {
if (res.code == 200) {
this.btnDesserts=res.data.allList
this.btnSelectDesserts=res.data.ownList
this.loading=false
}
})
.catch((err) => {
this.loading=false
console.log(err);
});
},