Концепция ролей и прав ExtJS
У меня есть приложение с системой ролей и прав. В основном мне нужно показывать и скрывать вещи в зависимости от настроек роли и прав.
Например, у меня есть сетка со статическими полями (видимыми для всех пользователей независимо от роли и права собственности):
var grid_results_columns = [
{ text: 'CompanyName', dataIndex: 'CompanyName', flex: 1 },
{ text: 'Address', dataIndex: 'Address', flex: 1 },
{ text: 'System ID', dataIndex: 'SID', flex: 1 }
];
И если я хочу показать/скрыть столбец, я делаю это так:
if (settings.rights[0].HasShowAdminColumn) {
grid_results_columns.push({ text: 'AdminSetting', dataIndex: 'AdminSetting' });
}
settings — это JSON, который я получаю от серверной части с помощью AJAX. Он имеет массив прав, и одним из элементов массива является HasShowAdminColumn, который может быть истинным или ложным (1 или 0).
Есть так много ролей, прав и сеток, которые нужно изменить. Есть ли какой-либо автоматизированный процесс, чтобы справиться с этим проще и менее болезненно? В противном случае я получаю тысячу строк кода, где мне пришлось бы проверять каждую роль и право и нажимать столбцы в зависимости от статуса прав.
ExtJS 6, но без CMD.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
Я бы сделал это с привязкой к скрытому столбцу. Вы можете загрузить настройки в основное свойство данных модели представления и наследовать их полностью. Или вы можете создавать конфигурации настроек в дочерних компонентах, явно привязывать их к внешней модели представления и на крючке обновления настраивать ее во внутренней модели представления.
Ext.define('MyGrid', {
extend: 'Ext.grid.Panel',
xtype: 'MyGrid',
viewModel: {
},
store: {
data: [{
name: 'Foo',
admin: 'Admin foo'
}]
},
columns: [{
dataIndex: 'name',
flex: 1,
text: 'name'
}, {
dataIndex: 'admin',
flex: 1,
text: 'admin',
hidden: true,
bind: {
hidden: '{!rights.showAdmin}'
}
}]
});
Ext.define('Main', {
extend: 'Ext.Container',
viewModel: {
rights: {}
},
controller: {
init: function() {
var vm = this.getViewModel();
//mimick ajax load
setTimeout(function(){
vm.set('rights', {showAdmin: true});
},3000);
}
},
layout: 'fit',
items: [{
xtype: 'MyGrid'
}]
});
Ext.application({
name : 'Fiddle',
launch : function() {
Ext.create('Main', {
width: 200,
height: 200,
renderTo: Ext.getBody()
});
}
});
Какую версию ExtJS вы используете?