表单引擎 - grid_dialog

dist/yvan-ext.js

@@ -130156,7 +130156,23 @@ define(['exports'], function (exports) { 'use strict';
             height: 450,
             bind: __assign({ title: '{_editType}' }, ((_c = detailDialog.bind) !== null && _c !== void 0 ? _c : {})),
         });
-        vjson.items.push(buildForm(grid1));
+        if (lodash.isPlainObject(detailDialog.tabpanel)) {
+            var tabpanel = __assign({ xtype: 'tabpanel' }, lodash.cloneDeep(detailDialog.tabpanel));
+            vjson.items.push(tabpanel);
+            if (tabpanel) {
+                // 有多个选项卡，按每个选项卡进行过滤
+                lodash.forEach(tabpanel.items, function (tab) {
+                    var tabColumns = lodash.filter(config.columns, function (c) { var _a; return ((_a = c.form) === null || _a === void 0 ? void 0 : _a.tab) === tab.title; });
+                    if (tabColumns.length > 0) {
+                        var tabVjson = buildForm(tabColumns, undefined, detailDialog);
+                        lodash.extend(tab, tabVjson);
+                    }
+                });
+            }
+        }
+        else {
+            vjson.items.push(buildForm(config.columns, undefined, detailDialog));
+        }
         var model = {
             data: {
                 _edit: isEdit,
@@ -130174,6 +130190,7 @@ define(['exports'], function (exports) { 'use strict';
             }
             model.data[key] = value;
         });
+        console.log(vjson);
         var scope = new Scope({ vjson: vjson, model: model, });
         //@ts-ignore
         scope.commit = function () {
@@ -130194,9 +130211,7 @@ define(['exports'], function (exports) { 'use strict';
         };
         scope.showDialog(grid1, {}, {});
     }
-    function buildForm(grid, record, isEdit) {
-        var config = grid._originVJson;
-        var detailDialog = config.detailDialog;
+    function buildForm(columns, tabpanel, detailDialog) {
         var vjson = __assign({ border: false, layout: {
                 type: 'vbox',
                 pack: 'start',
@@ -130208,7 +130223,7 @@ define(['exports'], function (exports) { 'use strict';
             }, scrollable: true, items: [] }, detailDialog.form);
         var emptyFieldset = [];
         var fieldsetList = [];
-        var columns = lodash.sortBy(config.columns, function (c) { var _a; return (_a = lodash.get(c, 'form.order')) !== null && _a !== void 0 ? _a : 1; });
+        columns = lodash.sortBy(columns, function (c) { var _a; return (_a = lodash.get(c, 'form.order')) !== null && _a !== void 0 ? _a : 1; });
         lodash.forEach(columns, function (c) {
             var fieldset = lodash.get(c, 'form.fieldset');
             if (fieldset) {
@@ -134672,6 +134687,334 @@ define(['exports'], function (exports) { 'use strict';
     }
     //# sourceMappingURL=SqlComplex.js.map
 
+    function initParamComplex () {
+        Ext.define('Yvan.ParamComplex', {
+            extend: 'Ext.panel.Panel',
+            xtype: 'paramcomplex',
+            alias: 'widget.paramcomplex',
+            getSqlExpress: function () {
+            },
+            constructor: function (config) {
+                var reference = config.reference;
+                var me = this;
+                var newConfig = __assign(__assign({}, config), { layout: 'border', items: [
+                        {
+                            region: 'west',
+                            width: 280,
+                            border: false,
+                            split: true,
+                            reference: reference + '_tree',
+                            xtype: 'yvtree',
+                            hideRefresh: true,
+                            hideExpand: true,
+                            hideCollapse: true,
+                            listeners: {
+                                itemdblclick: function (sender, record, item, index, e) {
+                                    var field = record.get('field');
+                                    var defaultValue = record.get('defaultValue');
+                                    if (!field) {
+                                        return;
+                                    }
+                                    var tabExpress = me.down('tabpanel');
+                                    var sqleditor = me.down('sqleditor');
+                                    var expressGrid = me.down('yvgrid');
+                                    if (tabExpress.getActiveTab().key !== 'grid') {
+                                        // SQL 模式
+                                        sqleditor.insertText(field + '=');
+                                    }
+                                    else {
+                                        // 表格模式
+                                        expressGrid.appendEditRow({
+                                            field: field,
+                                            operator: '=',
+                                            value: defaultValue,
+                                            remark: '',
+                                        });
+                                        lodash.defer(function () {
+                                            gridChanged(me, expressGrid);
+                                        });
+                                    }
+                                }
+                            },
+                        },
+                        {
+                            region: 'center',
+                            xtype: 'tabpanel',
+                            reference: reference + '_tab',
+                            tabPosition: 'bottom',
+                            listeners: {
+                                afterrender: function (sender) {
+                                    var scope = lookupScope(me);
+                                    var value = scope.viewModel.get(me.config.bindValue);
+                                    // sql 转换为 grid
+                                    try {
+                                        var list_1 = parseParamToGrid(value);
+                                        lodash.defer(function () {
+                                            var grid = me.down('yvgrid');
+                                            grid.setData(list_1);
+                                        });
+                                    }
+                                    catch (e) {
+                                        console.error(e);
+                                        msg$1('无法解析SQL语法! 目前只能以 SQL 模式打开，如果在表格中做修改，将会覆盖原语句!');
+                                        var tabSql = sender.down('sqleditor');
+                                        sender.setActiveTab(tabSql);
+                                    }
+                                },
+                                beforetabchange: function (sender, newCard, oldCard, eOpts) {
+                                    var scope = lookupScope(me);
+                                    var value = scope.viewModel.get(me.config.bindValue);
+                                    if (newCard.key === 'grid') {
+                                        // sql 转换为 grid
+                                        try {
+                                            var list_2 = parseParamToGrid(value);
+                                            lodash.defer(function () {
+                                                var grid = me.down('yvgrid');
+                                                grid.setData(list_2);
+                                            });
+                                            return true;
+                                        }
+                                        catch (e) {
+                                            msg$1('无法解析 SQL 语法! 表格模式只适用于简单语法');
+                                            console.error(e);
+                                            return false;
+                                        }
+                                    }
+                                    else if (newCard.key === 'sql') {
+                                        // grid 转换为 sql
+                                        lodash.defer(function () {
+                                            var editor = me.down('sqleditor');
+                                            editor.setValue(value);
+                                        });
+                                        return true;
+                                    }
+                                }
+                            },
+                            items: [
+                                {
+                                    title: '表格模式',
+                                    key: 'grid',
+                                    xtype: 'yvgrid',
+                                    _mode: 'select',
+                                    reference: reference + '_grid',
+                                    hideFootbar: true,
+                                    pagination: false,
+                                    tbar: [
+                                        {
+                                            xtype: 'button',
+                                            text: '删除',
+                                            iconCls: 'x-fa fa-minus-circle',
+                                            cls: 'ext-btn-danger',
+                                            bind: {
+                                                disabled: '{!' + reference + '_grid.selection}',
+                                            },
+                                            listeners: {
+                                                click: function (sender) {
+                                                    var grid = sender.up('yvgrid');
+                                                    removeGridRow(grid);
+                                                    gridChanged(me, grid);
+                                                }
+                                            },
+                                        },
+                                    ],
+                                    store: {},
+                                    listeners: {
+                                        editfinish: function (sender) {
+                                            gridChanged(me, sender);
+                                        },
+                                    },
+                                    columns: [
+                                        {
+                                            dataIndex: 'field',
+                                            header: '字段', sortable: false, menuDisabled: true,
+                                            width: 190,
+                                            renderer: function (value, context, record, rowIdx, colIdx, store, view) {
+                                                var column = context.column;
+                                                var propertyConfig = me.config.propertyConfig;
+                                                // 找到 propertyConfig 对应 propertyName 名称的 dict 字典的 dict.text 值
+                                                var field = record.get('field');
+                                                if (field) {
+                                                    var idx = lodash.findIndex(propertyConfig, function (p) { return p.field === field; });
+                                                    if (idx >= 0) {
+                                                        var meta = propertyConfig[idx];
+                                                        return meta.text;
+                                                    }
+                                                }
+                                                return value;
+                                            }
+                                        },
+                                        {
+                                            dataIndex: 'value',
+                                            header: '值', sortable: false, menuDisabled: true,
+                                            flex: 1,
+                                            getEditor: function (record) {
+                                                var column = this;
+                                                var grid = lodash.get(column, 'ownerCt.grid.ownerGrid');
+                                                var propertyConfig = me.config.propertyConfig;
+                                                var field = record.get('field');
+                                                if (!field) {
+                                                    // 没有填 propertyName
+                                                    return;
+                                                }
+                                                var idx = lodash.findIndex(propertyConfig, function (p) { return p.field === field; });
+                                                if (idx < 0) {
+                                                    console.error('没有找到 field=' + field + ". propertyConfig");
+                                                    return;
+                                                }
+                                                var meta = propertyConfig[idx];
+                                                if ((record.get('operator') === 'in' || record.get('operator') === 'notIn') && meta.editor.xtype === 'combo') {
+                                                    return new Ext.grid.CellEditor({
+                                                        field: __assign(__assign({ dict: meta.dict }, meta.editor), { xtype: 'tagfield' })
+                                                    });
+                                                }
+                                                return new Ext.grid.CellEditor({
+                                                    field: __assign({ dict: meta.dict }, meta.editor)
+                                                });
+                                            },
+                                            renderer: function (valueList, context, record, rowIdx, colIdx, store, view) {
+                                                var column = context.column;
+                                                var grid = lodash.get(view, 'ownerGrid');
+                                                var propertyConfig = me.config.propertyConfig;
+                                                // 找到 propertyConfig 对应 propertyName 名称的 dict 字典的 dict.text 值
+                                                var field = record.get('field');
+                                                if (field) {
+                                                    var idx = lodash.findIndex(propertyConfig, function (p) { return (p.field) === field; });
+                                                    if (idx >= 0) {
+                                                        var meta = propertyConfig[idx];
+                                                        var dictName = lodash.get(meta, 'dict');
+                                                        if (dictName && window['DICT_CACHE'][dictName]) {
+                                                            var dict_1 = window['DICT_CACHE'][dictName];
+                                                            var valueText_1 = [];
+                                                            lodash.forEach(lodash.split(valueList, ','), function (value) {
+                                                                var idxKv = lodash.findIndex(dict_1, function (kv) { return lodash.toString(kv.id) === lodash.toString(value); });
+                                                                if (idxKv >= 0) {
+                                                                    valueText_1.push(dict_1[idxKv].text);
+                                                                }
+                                                                else {
+                                                                    valueText_1.push(value);
+                                                                }
+                                                            });
+                                                            return valueText_1.join(',');
+                                                        }
+                                                    }
+                                                }
+                                                return valueList;
+                                            },
+                                        },
+                                    ]
+                                },
+                                {
+                                    title: '文本模式',
+                                    key: 'sql',
+                                    xtype: 'sqleditor',
+                                    reference: reference + '_sql',
+                                    listeners: {
+                                        change: function (sender) {
+                                            var scope = lookupScope(me);
+                                            // 保存 editor 写入的值
+                                            scope.viewModel.set(me.config.bindValue, sender.getValue());
+                                        }
+                                    }
+                                },
+                            ]
+                        }
+                    ] });
+                this.superclass.constructor.call(this, newConfig);
+            },
+            initComponent: function () {
+                // 货位条件树
+                var me = this;
+                me.superclass.initComponent.apply(this, arguments);
+                var tree = this.down('yvtree');
+                var config = me.config;
+                tree.setRootNode(buildConfigTree(config.propertyConfig));
+            },
+        });
+        function gridChanged(me, grid) {
+            var data = grid.getDataRows();
+            var propertyConfig = me.config.propertyConfig;
+            var bindValue = me.config.bindValue;
+            var scope = lookupScope(me);
+            var sql = parseGridToParam(data);
+            scope.viewModel.set(bindValue, sql);
+        }
+        /**
+         * 用于从 propertyConfig 解析出树形结构
+         * { text: '库别分类', field: 'loc_classify', operator: '=', category: '库位属性', editor: {xtype: 'combo'}, dict: 'AREA_CLASSIFY', },
+         * ->
+         * {text: '库别分类', field: 'loc_classify', operator: '=', leaf: true},
+         */
+        function buildConfigTree(propertyConfig) {
+            var root = {
+                expanded: true,
+                leaf: false,
+                children: []
+            };
+            var categoryObj = {};
+            var cfgList = propertyConfig;
+            lodash.forEach(cfgList, function (cfg) {
+                var cateNode = categoryObj[cfg.category];
+                if (!cateNode) {
+                    cateNode = {
+                        text: cfg.category, expanded: true, leaf: false,
+                        children: []
+                    };
+                    categoryObj[cfg.category] = cateNode;
+                    root.children.push(cateNode);
+                }
+                cateNode.children.push({
+                    text: cfg.text,
+                    field: cfg.field,
+                    operator: cfg.operator,
+                    defaultValue: cfg.defaultValue,
+                    leaf: true,
+                });
+            });
+            return root;
+        }
+        /**
+         * 将表格变成参数语句 [
+         * {field: 'f1', value: 1}
+         * {field: 'f2', value: 2}
+         * {field: 'f3', value: '3'}
+         * {field: 'f4', value: 4}
+         * ]
+         * ->
+         * f1=v1, f2=v2
+         */
+        function parseGridToParam(list) {
+            var sqls = [];
+            lodash.forEach(list, function (i) {
+                sqls.push(i.field + '=' + (i.value));
+            });
+            return sqls.join('; ');
+        }
+        /**
+         * 将 分号分割的的参数设置 变成表格
+         * @param param a=1; b=2; c='3'
+         * @return [
+         {field: 'a', value: 1}
+         {field: 'b', value: 2}
+         {field: 'c', value: '3'}
+         ]
+         */
+        function parseParamToGrid(param) {
+            if (!param || !lodash.trim(param)) {
+                return [];
+            }
+            var ret = [];
+            var sp = lodash.split(param, ';');
+            lodash.forEach(sp, function (v) {
+                var vi = lodash.indexOf(v, '=');
+                var field = lodash.trim(v.substr(0, vi));
+                var value = eval(v.substr(vi + 1));
+                ret.push({ field: field, value: value });
+            });
+            return ret;
+        }
+    }
+    //# sourceMappingURL=ParamComplex.js.map
+
     function initSqlEditor () {
         Ext.define('com.yvan.studio.SqlEditor', {
             extend: 'Ext.panel.Panel',
@@ -135072,6 +135415,7 @@ define(['exports'], function (exports) { 'use strict';
         initBpmn();
         initSqlEditor();
         initSqlComplex();
+        initParamComplex();
     }
     //# sourceMappingURL=init.js.map