saas-platform/frontend/saas-web/app/view/sys/power/TreePanel.js

Ext.define('saas.view.sys.power.TreePanel', {
    extend: 'Ext.tree.Panel',
    xtype: 'sys-power-treepanel',

    dataUrl:'/api/account/role/list',
    deleteUrl:'/api/account/role/delete/',
    focusable:false,

    initComponent: function () {
        var me = this;
        me.store = Ext.create('Ext.data.TreeStore', {
            fields : ['name', 'id', 'description','code'],
            autoLoad:false,
            root : {
                text : 'Root',
                id : 0,
                expanded : true
            }
        }),
        me.columns =[{
            xtype: 'treecolumn',
            dataIndex: 'text',
            flex: 1
        }, {
            xtype: 'actioncolumn',
            width: 28,
            iconCls: 'x-hidden icon x-fa fa-plus',
            getClass: function(v, meta, rec) {
                if(rec.get('code')=='ROLE_ADMIN'){
                    return 'x-hidden icon x-fa fa-key';
                }else if(rec.get('leaf')){
                     return 'x-hidden icon x-fa fa-pencil';
                }else{
                     return 'x-hidden icon x-fa fa-plus';
                }
            },
            handler: function(treeview, rowIdx, colIdx, e) {
                var record = treeview.store.data.getAt(rowIdx);
                me.addItem(record);
            }
        }, {
            xtype: 'actioncolumn',
            width: 36,
            iconCls: 'x-hidden icon x-fa fa-trash-o',
            getClass: function(v, meta, rec) {
                if(rec.get('code')=='ROLE_ADMIN'){
                    return '';
                }else if(rec.get('leaf')){
                     return 'x-hidden icon x-fa fa-trash-o';
                }else {
                    return '';
                }
            },
            handler: function(treeview, rowIdx, colIdx, e) {
                var record = treeview.store.data.getAt(rowIdx);
                me.deleteItem(record);
            }
        }];
        me.setTree();
        me.callParent(arguments);
    },
    listeners: {
		itemmouseenter: function(th, record, item, index, e, eOpts) {
			var imgs = item.getElementsByClassName('icon x-fa');
			Ext.Array.each(imgs, function(img) {
				img.classList.remove('x-hidden');
			});
		},
		itemmouseleave: function(th, record, item, index, e, eOpts) {
			var imgs = item.getElementsByClassName('icon x-fa');
			Ext.Array.each(imgs, function(img) {
				img.classList.add('x-hidden');
			});
        },
        itemclick:function(view,record,index,d,e){
            if(!record.get('leaf')){
                return;
            }
            var classList = e.target.classList;
            var clickIcon = false;
            Ext.Array.each(classList, function(item) {
				if(item.indexOf('x-action-col')>-1){
                    clickIcon = true;
                }
            });
            if(clickIcon){return;}
            //加载右边的grid
            var id = record.get('id');
            if(id&&id!=0){
                var grid = view.ownerCt.ownerCt.query('power-grid')[0];
                grid.initId = id;
                grid.store.load();
            }
        }
    },
    getData:function(){
        var me = this;
        var data = [];
        Ext.Ajax.request({
            url: me.dataUrl,
            params: '',
            method: 'GET',
            async:false,
            success: function(response, opts) {
                var _data = Ext.decode(response.responseText);
                if(_data&&_data.data){
                    _data = _data.data;
                    for (let index = 0; index < _data.length; index++) {
                        var o = {
                            code:_data[index].code,
                            id: _data[index].id,
                            text: _data[index].name,
                            name:_data[index].name,
                            description:_data[index].description,
                            leaf:true,
                            iconCls: 'x-fa fa-user',
                        }
                        data.push(o);
                    }
                }
            },
            failure: function(response, opts) {}
        }); 
        return data; 
    },
    setTree:function(){
        var me = this;
        var data = me.getData();
        me.getStore().setRootNode({
            text: '角色列表',
            id: '0',
            iconCls: 'x-fa fa-list',
            expanded: true,
            children: data
        });
    },
    addItem:function(rec){
        var me=this;
        var isleaf = rec.get('leaf');
        var record = isleaf?rec:null;
        var view = this.ownerCt.getController().getView();
        this.dialog = view.add({
            xtype: 'sys-power-window',
            bind: {
                title: (record?'修改':'新增')+'角色'
            },
            _parent:this,
            record:record,
            session: true,
        });
        this.dialog.show();
    },
    deleteItem:function(rec){
        if(rec&&(rec.get('code')=='ROLE_ADMIN'||!rec.get('leaf'))){
            return;
        }
        var me = this;
        saas.util.BaseUtil.deleteWarn('确定要删除该角色？',function(btn){
            if(btn == 'yes'){
                me.setLoading(true);
                saas.util.BaseUtil.request({
                    url: me.deleteUrl + rec.get('id'),
                    params: '',
                    method: 'POST'
                })
                .then(function(localJson) {
                    me.setLoading(false);
                    if(localJson.success){
                        saas.util.BaseUtil.showSuccessToast('删除成功');
                        me.setTree();
                    }
                })
                .catch(function(res) {
                    me.setLoading(false);
                    console.error(res);
                    saas.util.BaseUtil.showErrorToast('删除失败: ' + res.message);
                });
            }
        });
    }
});