saas-platform/frontend/saas-web/app/util/FormUtil.js

Ext.define('saas.util.FormUtil', {

    statics: {

        // 主表允许自定义的配置名
        MAIN_ALLOW_CUS_FIELDS: ['fieldLabel', 'hidden', 'index', 'columnWidth', 'group'],
        // 从表允许自定义的配置名
        DETAIL_ALLOW_CUS_FIELDS: ['text', 'hidden', 'index', 'width'],

        setItems: function(form) {
            let me = this,
            defaultItems = form.defaultItems;

            saas.util.ViewUtil.getViewConfig(form.viewName)
            .then(function(cfg) {
                if(cfg) {
                    let items = [];

                    items = me.applyItemsGroup(defaultItems || []);
                    items = me.initItems(items);
                    items = me.applyCusMainItemConfig(items, cfg);
                    items = me.applyCusDetailItemConfig(items, cfg);

                    form.configItems = items;

                    items = me.applyDefaultItems(form, items);

                    form.removeAll();
                    return form.addItems(items);
                }else {
                    return []
                }
            })
            .then(function(items) {
                form.fireEvent('afterSetItems', form, items);
            })
            .then(function() {
                me.loadData(form);
            })
            .catch(function(response) {
                console.error(response);
            });

        },

        applyItemsGroup: function(items) {
            let groups = [],
            groupCount = 0,
            newItems = [];

            Ext.Array.each(items, function(it, index) {
                let item = Object.assign({}, it),
                groupName = item.group;
                if(!!groupName) {
                    let idx = groups.findIndex(function(g) {
                        return g.title == groupName;
                    }),group;

                    if(idx == -1) {
                        group = {
                            title: groupName,
                            count: 1
                        };
                        groups.push(group);
                    }else {
                        group = groups[idx];
                        group.count++;
                    }
                }
                newItems.push(item);
            });

            Ext.Array.sort(newItems, function(a, b) {
                let gs = groups.concat([{
                    title: '_nogroup'
                }]);
                a.group = a.group || '_nogroup';
                let v1 = gs.findIndex(function(g) {
                    return g.title == a.group;
                })
                let v2 = gs.findIndex(function(g) {
                    return g.title == b.group;
                })
                return v1 - v2;
            });

            Ext.Array.each(groups, function(g) {
                let idx = newItems.findIndex(function(i) {
                    return i.group == g.title;
                });
                g.index = idx;
            });

            Ext.Array.each(groups, function(group, index) {
                let formIndex = group.index;
                delete group.index;
                Ext.Array.insert(newItems, formIndex + index, [{
                    xtype: 'separatefield',
                    name: 'group' + (++groupCount),
                    html: group.title,
                    fieldLabel: group.title || '分组' + groupCount
                }]);
            });

            return newItems;
        },

        initItems: function(items) {
            let itemCount = detailCount = 1, newItems = [];
            Ext.Array.each(items, function(it, i) {
                let item = Object.assign({}, it);
                if(item.xtype == 'detailGridField') {
                    let columns = item.columns,
                    colCount = 1;
                    Ext.Array.each(columns, function(col, j) {
                        if((col.hidden || col.width == 0 || !col.dataIndex) && (!col.hasOwnProperty('initHidden') || col.initHidden)) {
                            Ext.applyIf(col, {
                                index: -1,
                                initHidden: true
                            });
                        }else {
                            Ext.applyIf(col, {
                                text: '',
                                hidden: false,
                                index: colCount++,
                                allowBlank: true,
                                width: 100,
                                initHidden: false
                            });
                        }
                    });
                    if(!columns[columns.length - 1].flex) {
                        columns.push({
                            dataIndex: '',
                            initHidden: true,
                            flex: 1,
                            allowBlank: true
                        });
                    }
                    Ext.applyIf(item, {
                        allowBlank: false,
                        columnWidth: 1,
                        gname: 'detail' + detailCount,
                        fieldLabel: '从表' + (detailCount++),
                    });
                }else if(item.xtype == 'hidden') {
                    Ext.applyIf(item, {
                        fieldLabel: '',
                        hidden: true,
                        initHidden: true,
                    });
                }else if(item.xtype == 'separatefield') {
                    Ext.applyIf(item, {
                        fieldLabel: item.html,
                        columnWidth: 1,
                    });
                }else {
                    Ext.applyIf(item, {
                        fieldLabel: '',
                        columnWidth: 0.25,
                    });
                }

                if(item.hidden) {
                    if(item.initHidden || !item.hasOwnProperty('initHidden')) {
                        Ext.applyIf(item, {
                            index: -1,
                            initHidden: true
                        });
                    }else {
                        Ext.applyIf(item, {
                            index: itemCount++,
                            initHidden: false
                        }); 
                    }
                }else {
                    Ext.applyIf(item, {
                        index: itemCount++,
                        initHidden: false
                    });
                }

                Ext.applyIf(item, {
                    name: 'item' + i,
                    hidden: false,
                    allowBlank: true,
                    group: undefined,
                });

                newItems.push(item);
            });

            Ext.Array.sort(newItems, function(a, b) {
                return a.index - b.index;
            });

            return newItems;
        },

        // 将自定义配置应用到默认items
        applyCusMainItemConfig: function(items, cfg) {
            let me = this,
            cusMainItems = cfg.main || [];

            Ext.Array.each(cusMainItems, function(cusItem) {
                let item = Ext.Array.findBy(items, function(item) {
                    return item.name == cusItem.name;
                });
                if(!!item) {
                    let keys = Ext.Object.getAllKeys(cusItem);
                    keys.map(function(k) {
                        if(me.MAIN_ALLOW_CUS_FIELDS.indexOf(k) != -1) {
                            if(k != 'hidden' || item.allowBlank) {
                                item['_init_' + k] = item.hasOwnProperty('_init_' + k) ? item['_init_' + k] : item[k]; 
                                item[k] = cusItem[k];
                            }
                        }
                    });
                    
                }
            });

            Ext.Array.sort(items, function(a, b) {
                return a.index - b.index;
            });

            return items;
        },

        // 将自定义配置应用到从表items
        applyCusDetailItemConfig: function(items, cfg) {
            let me = this,
            detailCount = 1;

            Ext.Array.each(items, function(item) {
                let gname = item.gname;

                if(item.xtype == 'detailGridField' && cfg.hasOwnProperty(gname)) {
                    let columns = item.columns,
                    cusColumns = cfg[gname] || [];

                    Ext.Array.each(cusColumns, function(cusCol) {
                        let col = Ext.Array.findBy(columns, function(col) {
                            return col.dataIndex == cusCol.dataIndex;
                        });
                        if(!!col) {
                            let keys = Ext.Object.getAllKeys(cusCol);
                            keys.map(function(k) {
                                if(me.DETAIL_ALLOW_CUS_FIELDS.indexOf(k) != -1) {
                                    if(k != 'hidden' || col.allowBlank) {
                                        col['_init_' + k] = col.hasOwnProperty('_init_' + k) ? col['_init_' + k] : col[k]; 
                                        col[k] = cusCol[k];
                                    }
                                }
                            });
                            
                        }
                    });

                    Ext.Array.sort(columns, function(a, b) {
                        return a.index - b.index;
                    });
                }
            });

            return items;
        },

        /**
         * 处理formitems的一些默认配置
         */
        applyDefaultItems: function(form, items) {
            let me = this,
            formModel = form.getViewModel();

            Ext.Array.each(items, function(item) {

                //　设置必填
                if(item.allowBlank==false){
                    // TODO 需要判断类型
                    item.beforeLabelTextTpl = "<font color=\"red\" style=\"position:relative; top:2px;right:2px; font-weight: bolder;\">*</font>";
                }

                if(item.xtype == 'textfield') {
                    Ext.applyIf(item, {
                        maxLength: 50
                    });
                }
                
                if(item.xtype == 'datefield') {
                    Ext.applyIf(item, {
                        editable: false,
                        format: 'Y-m-d'
                    });
                }

                if(item.xtype == 'numberfield') {
                    Ext.applyIf(item, {
                        hideTrigger: true, // 隐藏trigger
                        mouseWheelEnabled: false // 取消滚轮事件
                    });
                    // 设置默认值为0
                    formModel.set(item.name, 0);
                }

                // 如果是从表为其绑定store
                if(item.xtype == 'detailGridField') {
                    let index = form.detailCount;
                    let columns = item.columns,
                    cnames = columns.filter(function(c) {
                        return c.dataIndex && !c.ignore;
                    }).map(function(c) {
                        return c.dataIndex
                    }),
                    defaultValueColumns = {};

                    Ext.Array.each(columns, function(c) {

                        if(c.dataIndex && c.defaultValue) {
                            defaultValueColumns[c.dataIndex] = c.defaultValue;
                        }

                        // 不可锁定
                        Ext.applyIf(c, {
                            lockable: false,
                            width: 120
                        });

                        //必填
                        Ext.applyIf(c, {
                            allowBlank: true
                        });
                        if(!c.allowBlank){
                            c.cls = 'x-grid-necessary';
                        }

                        if(c.xtype == 'textfield') {
                            Ext.applyIf(c, {
                                maxLength: 50
                            });
                        }else if(c.xtype == 'datecolumn') {
                            Ext.applyIf(c, {
                                format: 'Y-m-d'
                            });
                        }else if(c.xtype == 'numbercolumn') {
                            Ext.applyIf(c, {
                                align: 'end'
                            });
                        }
                        
                        let editor = c.editor;
                        if(editor) {
                            Ext.applyIf(editor, {
                                selectOnFocus: true
                            });
                            if(editor.xtype == 'numberfield') {
                                Ext.applyIf(editor, {
                                    hideTrigger: true, // 隐藏trigger
                                    mouseWheelEnabled: false // 取消滚轮事件
                                });
                            }else if(editor.xtype == 'datefield') {
                                Ext.apply(editor, {
                                    format: 'Y-m-d'
                                });
                                Ext.applyIf(editor, {
                                    editable: false
                                });
                            }
                        }
                    });

                    cnames.push(item.detnoColumn);

                    formModel.set('detail' + index + '.detailBindFields', cnames);
                    item.bind = {
                        store: '{detail' + index + '.detailStore}'
                    };     
                    formModel.set('detail' + index + '.detailStore', Ext.create('Ext.data.Store', {
                        model:item.storeModel,
                        data: [],
                        listeners: {
                            datachanged: function(s, eOpts) {
                                let g = form.query('detailGridField')[index];
                                g.fireEvent('datachanged', g, s, eOpts);
                            },
                            // 为新增行设置默认值
                            add: function(store, records, index, eOpts) {
                                Ext.Array.each(records, function(r) {
                                    for(k in defaultValueColumns) {
                                        r.set(k, defaultValueColumns[k]);
                                    }
                                    r.commit();
                                });
                            }
                        }
                    }));

                    form.detailCount++;
                }
            });

            return items;
        },

        loadData: function(form) {
            let me = this;
            form.setLoading(true);
            if(form.initId && form.initId!=0) {
                let url = form._readUrl + '/' + form.initId;
                saas.util.BaseUtil.request({url })
                .then(function(res) {
                    form.setLoading(false);
                    if(res.success) {
                        let d = res.data;
                        let o = {
                            main: d.main
                        };
                        if(d.hasOwnProperty('items')) {
                            o.detail0 = d.items;
                        }else {
                            let idx = 1;
                            while(d.hasOwnProperty('items' + idx)) {
                                o['detail' + (idx - 1)] = d['items' + idx];
                                idx++;
                            }
                        }
                        form.initFormData(o);
                        form.fireEvent('load', form, o);
                    }
                })
                .catch(function(response) {
                    form.setLoading(false);
                    console.error(response);
                    saas.util.BaseUtil.showErrorToast(response.message);
                });
            }else{
                //取后台编号
                saas.util.BaseUtil.request({
                    url: '/api/commons/number/getMaxnumber',
                    headers: {
                        "Content-Type": 'application/x-www-form-urlencoded;charset=UTF-8'
                    },
                    params: {
                        caller:form.caller
                    },
                    method: 'POST',
                }).then(function(res) {
                    form.setLoading(false);
                    if(res.success){
                        let code = res.data;
                        let viewModel = form.getViewModel();
                        let detailGrids = form.query('detailGridField');

                        if(code){
                            let o = {};
                            o[form._codeField] = code;

                            let formData = {main: {}};
                            Ext.apply(formData.main, o);
                            Ext.Array.each(detailGrids, function(grid, index) {
                                let detno = 0;
                                let detnoColumn = grid.detnoColumn;
                                let datas = [];
                                let emptyRows = grid.emptyRows;
                                
                                Ext.Array.each(new Array(emptyRows), function() {
                                    detno += 1;
                                    let data = {};
                                    data[detnoColumn] = detno;
                                    datas.push(data);
                                })
                                formData['detail' + index] = datas;
                            });

                            return formData;
                        }else {
                            throw new Error('请求单据编号错误');
                        }
                    }else {
                        return {
                            main: {},
                        }
                    }
                }).then(function(formData) {
                    let initData = form.initData;
                    if(initData) {
                        Ext.apply(initData.main, formData.main);
                        form.setFormData(initData);
                        form.fireEvent('load', form, initData);
                    }else {
                        form.initFormData(formData);
                        form.fireEvent('load', form, formData);
                    }
                }).catch(function(res) {
                    form.clearDirty();
                    form.setLoading(false);
                    saas.util.BaseUtil.showErrorToast('请求单据编号错误: ' + res.message);
                })
            }
        }
    }
});