extjs中grid可编辑行中添加combo联动显示加上移、下移。。。

{
                    text: '部门',
                    width: 250,
                    align: 'center',
                    menuDisabled: true,
                    dataIndex: 'deptname',
                    editor: {
                        xtype: 'treepicker',
                        editable: false,
                        containerScroll: true,
                        forceSelection: true,
                        name: 'deptname',
                        reference: 'deptname',
                        store: Ext.create('JsApp.store.currency.DepartmentalSourceStore', {
                            id: 'departmentalsource-store'
                        }),
                        listeners: {
                            'select': 'onSelectDataSourceColumnClick'
                        },
                        margin: '0 5 0 0',
                        displayField: 'text',
                        valueField: 'id'
                    },
                    renderer: 'renderCirculationDeptField'
                },
                {
                    text: '办理人员',
                    width: 480,
                    align: 'center',
                    dataIndex: 'userName',
                    editor: {
                        xtype: 'combo',
                        editable: false,
                        queryMode: 'local',
                        multiSelect: true,
                        name: 'userName',
                        reference: 'combouserName',
                        store: Ext.create('JsApp.store.currency.UserSourceStore', {
                            id: 'usersource-store'
                        }),
                        margin: '0 5 0 0',
                        displayField: 'userName',
                        valueField: 'userUid',
                        listConfig: {
                            itemTpl: Ext.create('Ext.XTemplate', '<input type=checkbox>{[values.userName]}'),
                            //设置默认值
                            onItemSelect: function (record) {
                                var node = this.getNode(record);
                                if (node) {
                                    Ext.fly(node).addCls(this.selectedItemCls);
                                    var checkboxs = node.getElementsByTagName("input");
                                    if (checkboxs != null) {
                                        var checkbox = checkboxs[0];
                                        checkbox.checked = true;
                                    }
                                }
                            },
                            listeners: {
                                itemclick: 'selectUserName'
                            }
                        }
                    },
                    listeners: {
                        click: 'onClickCell'
                    },
                    renderer: 'renderCirculationUserField'
                }
            ],
            tbar: ['->',
                {
                    text: '置顶',
                    iconCls: 'fas fa-arrow-circle-up',
                    handler: 'onTopclick'
                },
                {
                    text: '上移',
                    iconCls: 'fas fa-arrow-up',
                    handler: 'onUpclick'
                }, {
                    text: '下移',
                    iconCls: 'fas fa-arrow-down',
                    handler: 'onDownclick'
                }, {
                    text: '置底',
                    iconCls: 'fas fa-arrow-circle-down',
                    handler: 'onBottomclick'
                }]

 

 

 /*
     * 选择不同的部门
     */
    onSelectDataSourceColumnClick: function (combo, record, eOpts) {
        var me = this,
            refs = me.getReferences(),
            grid = refs["CirculationDeptGridForm"],
            store = grid.getStore();
        var isSelection = store.find('deptcode', combo.value);
        if (isSelection == -1) {
            var editline = grid.getSelectionModel().getSelection();//获取目前编辑的行
            if (editline.length < 1) {
                return;
            }
            editColumnRecord = editline[0];
            if (editColumnRecord != null) {
                editColumnRecord.set('deptcode', record.data.id);//写入行数据
            }
        }
        else {
            combo.setValue(null);
            me.toastOk("已经存在该字段");
            return;
        }
    },

 

 /**
     * 渲染部门字段
     */
    renderCirculationDeptField: function (value, record, dataIndex, cell, column, gridStore) {
        var me = this,
            store = Ext.StoreManager.get('departmentalsource-store');
        try {
            return store.getAt(store.find('id', value)).get('text');
        }
        catch (e) { }
    },

//选择办理人
    selectUserName: function (view, record, item, index, e, eOpts) {
        var me = this,
            form = me.view,
            refs = me.getReferences(),
            combo = refs["combouserName"],
            AllCheckBox = {//factory全选框的userUid和userName要与数据源（store）中的一致
                userName: "全选",
                userUid: "all"
            },
            newValues = [],
            selectclass = item.classList;
        if (item.innerText == AllCheckBox.userName) {
            var isSelected = item.getElementsByTagName("input")[0].checked;//全选框是否选中 true false
            var itemselected = selectclass.contains('x-boundlist-selected');
            if (isSelected && !itemselected) {
                Ext.each(record.store.data.items, function (item) {
                    if (item.data.userUid != "all") {
                        newValues.push(item.data.userUid);
                    }
                });
                combo.setValue(newValues);
            }
            else {
                if (!itemselected) {
                    Ext.each(record.store.data.items, function (item) {
                        if (item.data.userUid != "all") {
                            newValues.push(item.data.userUid);
                        }
                    });
                }
                else {
                    Ext.each(view.all.elements, function (item) {
                        item.getElementsByTagName("input")[0].checked = false;
                    });
                    newValues.push("all");
                }
                combo.setValue(newValues);
            }
        }
        else {
            var index = combo.getValue().indexOf('all');
            if (index > -1) {
                combo.getValue().splice(index, 1);
                combo.setValue(combo.getValue());
                var input = view.all.elements[0];
                if (input.innerText == "全选") {
                    input.getElementsByTagName("input")[0].checked = false;
                    item.getElementsByTagName("input")[0].checked = false;
                }
            }
            else {
                item.getElementsByTagName("input")[0].checked = false;
            }
        }

    },

//点击行
    onClickCell: function (view, rowIndex, colIndex, item, e, record, row) {
        var me = this,
            refs = me.getReferences(),
            combo = refs["combouserName"];
        var UserSourceStore = Ext.StoreManager.get('usersource-store');
        UserSourceStore.load({
            params: {
                deptid: record.data.deptname
            },
            callback: function (records, option, success) {
                if (records.length - 1 == record.data.userName.length) {
                    record.data.userName.push("all");
                }
                if (record.data.userName.length > 0 && combo != undefined) {
                    combo.setValue(record.data.userName);
                }
            }
        });
    },

 

/**
     * 渲染办理人员字段
     */
    renderCirculationUserField: function (value, record, cell, dataIndex, column, gridStore) {
        var me = this,
            store = Ext.StoreManager.get('usersource-store');
        store.load({
            params: {
                sign: "all"
            }
        });
        var text = new Array(value.length);
        try {
            for (var i = 0; i < value.length; i++) {
                text[i] = store.getAt(store.find('userUid', value[i])).get('userName');
            }
            return text;
        }
        catch (e) { }
    },

 

//上移
    onUpclick: function () {
        var me = this,
            refs = me.getReferences(),
            grid = refs["CirculationDeptGridForm"],
            store = Ext.StoreManager.get('usersource-store'),
            rowSelectionModel = grid.getSelectionModel();
        if (rowSelectionModel.hasSelection()) {
            var record = rowSelectionModel.getSelected().getAt(0);
            store.load({
                params: {
                    deptid: record.data.deptname
                },
                callback: function (records, option, success) {
                    var index = grid.store.indexOf(record);
                    if (index > 0) {
                        grid.store.removeAt(index);
                        grid.store.insert(index - 1, record);
                        grid.getSelectionModel().select(index - 1);
                    }
                }
            });
        } else {
            Ext.Msg.alert('提示', '请选择要移动的行!');
        }
    },
    //下移
    onDownclick: function () {
        var me = this,
            refs = me.getReferences(),
            grid = refs["CirculationDeptGridForm"],
            store = Ext.StoreManager.get('usersource-store'),
            rowSelectionModel = grid.getSelectionModel();
        if (rowSelectionModel.hasSelection()) {
            var record = rowSelectionModel.getSelected().getAt(0);
            store.load({
                params: {
                    deptid: record.data.deptname
                },
                callback: function (records, option, success) {
                    var index = grid.store.indexOf(record);
                    if (index < grid.store.getCount() - 1) {
                        grid.store.removeAt(index);
                        grid.store.insert(index + 1, record);
                        grid.getSelectionModel().select(index + 1);

                    }
                }
            });
        } else {
            Ext.Msg.alert('提示', '请选择要移动的行!');
        }
    },
    //置顶
    onTopclick: function () {
        var me = this,
            refs = me.getReferences(),
            grid = refs["CirculationDeptGridForm"],
            store = Ext.StoreManager.get('usersource-store'),
            rowSelectionModel = grid.getSelectionModel();
        if (rowSelectionModel.hasSelection()) {
            var record = rowSelectionModel.getSelected().getAt(0);
            store.load({
                params: {
                    deptid: record.data.deptname
                },
                callback: function (records, option, success) {
                    var index = grid.store.indexOf(record);
                    if (index > 0) {
                        grid.store.removeAt(index);
                        grid.store.insert(0, record);
                        grid.getSelectionModel().select(0);
                    }
                }
            });
        } else {
            Ext.Msg.alert('提示', '请选择要移动的行!');
        }
    },
    //置底
    onBottomclick: function () {
        var me = this,
            refs = me.getReferences(),
            grid = refs["CirculationDeptGridForm"],
            store = Ext.StoreManager.get('usersource-store'),
            rowSelectionModel = grid.getSelectionModel();
        if (rowSelectionModel.hasSelection()) {
            var record = rowSelectionModel.getSelected().getAt(0);
            store.load({
                params: {
                    deptid: record.data.deptname
                },
                callback: function (records, option, success) {
                    var index = grid.store.indexOf(record);
                    if (index < grid.store.getCount() - 1) {
                        grid.store.removeAt(index);
                        grid.store.insert(grid.store.getCount(), record);
                        grid.getSelectionModel().select(grid.store.getCount() - 1);
                    }
                }
            });
        } else {
            Ext.Msg.alert('提示', '请选择要移动的行!');
        }
    },