kanban-parent/kanban-console/src/main/webapp/resources/app/view/desktop/BoardManageRightPanel.js

Ext.QuickTips.init();
Ext.define('erp.view.desktop.BoardManageRightPanel',{
    extend: 'Ext.panel.Panel',
    alias:'widget.manageright',
    id:'manageright',
    border: 0,
    layout:'fit',
    autoScroll: true,
    hideBorders: true,
    initComponent:function(){
        var me = this;

        var enabledStore = Ext.create('Ext.data.Store', {
            fields: ['value', 'name'],
            data: [
                { "value": true, "name": "是" },
                { "value": false, "name": "否" }
            ]
        });
        var enabledCombo = new Ext.form.ComboBox({
            store: enabledStore,
            valueField: 'value',
            displayField: 'name',
            mode: 'local',
            forceSelection: true,
            editable: false,
            triggerAction: 'all',
            selectOnFocus: true
        });
        me.items = [{
            xtype: 'grid',
            id:'tplGrid',
            selectedIndex: 1,
            store : Ext.create('Ext.data.Store', {
                fields : ['code', 'content', 'enabled', 'description', 'name','title','panelCode'],
                data: []
            }),
            columnLines:true,
            columns: [
                { text: 'ID', dataIndex: 'code', hidden: true },
                { text: '看板名称', dataIndex: 'name', flex: 1, editor:{
					xtype:'textfield',
					regex: /^[A-Za-z0-9_\-\u4e00-\u9fa5]+$/,
					regexText: '包含特殊符号'
				}, renderer: function (v, metadata, record, rowIndex, columnIndex, store) {
                    metadata.tdAttr = 'data-qtip="' + (v || '') + '"';
                    return v;
                }
                },
                { text: '备注', dataIndex: 'description', flex: 1, editor: 'textfield', renderer: function (v, metadata, record, rowIndex, columnIndex, store) {
                    metadata.tdAttr = 'data-qtip="' + (v || '') + '"';
                    return v;
                }
                },
                {
                    text: '是否生效', dataIndex: 'enabled', width: 100, editor: enabledCombo, renderer: function(value) {
                    return value ? '是' : '否'
                }
                },
                { xtype: 'actioncolumn', align: 'center', items: [{
                    iconCls: 'save',
                    tooltip: '保存',
                    handler: function(th, rowIndex, colIndex) {
                        var grid =this.up('grid');
                        var rec = grid.getStore().getAt(rowIndex);
                        var data = Object.assign({}, rec.data);
                        data.get = function(key) {
                            return this[key]
                        }
                        data.set = function(key, value) {
                            this[key] = value;
                        }
                        delete data.content;
                        delete data.title;
                        var record = {
                            code: data.code,
                            panelCode: data.panelCode,
                            description: data.description,
                            enabled: data.enabled,
                            name: data.name,
                            get: data.get,
                            set: data.set
                        }
                        grid.saveModel(record);
                    }
                }, '-', {
                    iconCls: 'edit',
                    tooltip: '看板配置',
                    handler: function(grid, rowIndex, colIndex, th, eOpts, record) {
                        var code = record.get('code');
                        if(!code) {
                            showErrorMsg('提示', '请先保存该看板！');
                            return;
                        }
                        var panelRecord = Ext.getCmp('managemain').initRecord;
                        window.open(basePath+'board?code=' + code + '&name=' + record.get('name') + '&panelCode=' + record.get('panelCode') + '&panelName=' + panelRecord.get('name'), code);
                    }
                }] }
            ],
            tbar: [{
                xtype: 'button',
                text: '添加看板',
                disabled: true,
                handler: function() {
                    if(!Ext.getCmp('managemain').initRecord.get('code')) {
                        showErrorMsg('提示', '请先保存面板再执行添加看板操作!');
                        return;
                    }
                    var grid = this.up('grid');
                    var record = {
                        name: '新看板',
                        description: '',
                        content: '<content></content>',
                        panelCode: Ext.getCmp('managemain').initRecord.get('code'),
                        enabled: true
                    }
                    grid.addModel(record);
                }
            }, {
                xtype: 'button',
                text: '删除看板',
                disabled: true,
                handler: function() {
                    var grid = this.up('grid');
                    var record = grid.getSelectionModel().getSelection()[0];
                    if(record) {
                        Ext.Msg.confirm('提示','是否确定删除看板 ' + record.get('name') + ' ?',function(btn){
                            if(btn=='yes'){
                                grid.deleteModel(record, grid.getStore().indexOf(record));
                            }
                        });
                    }
                }
            }],
            plugins: [
                Ext.create('Ext.grid.plugin.CellEditing', {
                    clicksToEdit: 2
                })
            ],
            loadGridData: function() {
                var grid = this;
                var panelRecord = Ext.getCmp('managemain').initRecord;
                grid.getEl().mask('loading...');
                Ext.Ajax.request({
                    url:'kanban/get/byPanel/' + panelRecord.get('code'),
                    method:'POST',
                    callback:function(options,success,response){
                        grid.getEl().unmask();
                        if(response.responseText == '') return;
                        var res = JSON.parse(response.responseText);
                        if(success) {
                            grid.selectedIndex = 1;
                            res = res instanceof Array ? res : [res];
                            grid.getStore().loadData(res);
                            grid.getStore().sort('enabled', 'DESC');
                        }else {
                            showErrorMsg('失败', res.message);
                        }
                    }
                });
            },
            addModel: function(record) {
                var grid = this;
                grid.getStore().insert(grid.getStore().getCount(), record);
                grid.getPlugin().startEditByPosition({ row: grid.getStore().getCount() - 1, column: 0 });
            },
            saveModel: function(record) {
                var grid = this;
                var type = record.get('code') ? 'updatePart' : 'savePart';
                grid.getEl().mask('loading...');
                Ext.Ajax.request({
                    url:'kanban/' + type,
                    method:'POST',
                    params:{
                        json:Ext.encode(record)
                    },
                    callback:function(options,success,response){
                        grid.getEl().unmask();
                        var res = JSON.parse(response.responseText);
                        if(success) {
                            if(grid) {
                                grid.loadGridData();
                                showErrorMsg('成功', '已更新');
                            }
                        }else {
                            showErrorMsg('失败', res.message);
                        }
                    }
                });
            },
            deleteModel: function (record) {
                var grid = this;
                if (record.get('code')) {
                    Ext.Ajax.request({
                        url: 'kanban/delete/' + record.get('code'),
                        method: 'POST',
                        callback: function (options, success, response) {
                            var res = JSON.parse(response.responseText);
                            if (success) {
                                if (grid) {
                                    grid.loadGridData();
                                }
                            } else {
                                showErrorMsg('失败', res.message);
                            }
                        }
                    });
                } else {
                    grid.getStore().remove(record);
                }
            }
        }];
        this.callParent(arguments);
    },
    setButtonDisabled: function(isDisabled) {
        var grid = this.down('grid');
        var buttons = grid.dockedItems.items[1].items.items;
        Ext.Array.each(buttons,function(btn){
            if(btn.xtype=='button'&&btn.disabled!=isDisabled){
                btn.setDisabled(isDisabled);
            }
        });
    },
    selectModel:function(data){
        var me = this;
        grid.selectedIndex = 1;
        var grid = Ext.getCmp('tplGrid');
        var store = grid.getStore();
        var records = new Array();
        Ext.Array.each(store.data.items,function(rec,index){
            Ext.Array.each(data,function(item){
                if(rec.get('code')==item.code){
                    records.push(rec);
                }
            });
        });
        grid.getSelectionModel().select(records);
    }
});