引入 sqleditor

dist/yvan-ext.js

@@ -1,4 +1,4 @@
-define(['exports'], function (exports) { 'use strict';
+define(['exports', 'sql-formatter'], function (exports, sqlFormatter) { 'use strict';
 
     var labelWidth = 80;
     var windows = {
@@ -133158,6 +133158,141 @@ define(['exports'], function (exports) { 'use strict';
         });
     }
 
+    function initSqlEditor () {
+        Ext.define('com.yvan.studio.SqlEditor', {
+            extend: 'Ext.panel.Panel',
+            alias: 'widget.sqleditor',
+            xtype: 'sqleditor',
+            layout: 'fit',
+            border: false,
+            html: "<div class=\"editor\"/>",
+            config: {
+                value: ''
+            },
+            codeChange: undefined,
+            isChangeFromOuter: false,
+            setCode: function (value) {
+                var _this = this;
+                this.code = value;
+                this.value = value;
+                lodash.defer(function () {
+                    _this.isChangeFromOuter = true;
+                    if (_this.editor) {
+                        _this.editor.setValue(value);
+                    }
+                });
+            },
+            getCode: function () {
+                return this.getValue();
+            },
+            updateOptions: function (options) {
+                if (this.editor && options) {
+                    this.editor.updateOptions(options);
+                }
+            },
+            getValue: function () {
+                if (!this.editor) {
+                    return this.code;
+                }
+                return this.editor.getValue();
+            },
+            applyPosition: function () {
+                var _this = this;
+                if (this.autoFocusMethod) {
+                    if (this.editor) {
+                        lodash.defer(function () {
+                            if (_this.autoFocusStartLine) {
+                                _this.editor.setPosition({
+                                    lineNumber: _this.autoFocusStartLine,
+                                    column: _this.autoFocusStartColumn
+                                });
+                                _this.editor.revealLine(_this.autoFocusStartLine); //滚动到特定行
+                            }
+                            _this.editor.focus();
+                        });
+                        delete this.autoFocusMethod;
+                    }
+                }
+                this.editor.layout();
+            },
+            setValue: function (value, fromEditor) {
+                this.setCode(value);
+                var me = this;
+                if (me.value === value) {
+                    // 值相等，不需要变化
+                    return;
+                }
+                if (fromEditor !== true && me.editor) {
+                    // 不是来源于编辑器的变化，才设置编辑器的值
+                    me.editor.setValue(value);
+                }
+                // 通知mixins setValue
+                me.value = value;
+                me.fireEvent('change', value);
+            },
+            initComponent: function () {
+                var that = this;
+                this.superclass.initComponent.call(this);
+                that.on({
+                    resize: function () {
+                        if (that.editor) {
+                            that.editor.layout();
+                        }
+                    },
+                    destory: function () {
+                        if (that.editor) {
+                            that.editor.dispose();
+                            delete that.editor;
+                        }
+                    },
+                    afterrender: function (sender) {
+                        var $dom = $(that.el.dom).find('.editor');
+                        attach_2($dom[0], {
+                            value: that.code
+                        }).then(function (editor) {
+                            that.editor = editor;
+                            that.applyPosition();
+                            that.editor.onDidChangeModelContent(function (e) {
+                                that.fireEvent('change', that.editor, e);
+                                if (typeof that.codeChange === "function" && !that.isChangeFromOuter) {
+                                    that.codeChange(that.editor.getValue(), that.name, e);
+                                }
+                                that.isChangeFromOuter = false;
+                            });
+                        });
+                    }
+                });
+            }
+        });
+        function attach_2(element, opts) {
+            if (!window['monaco']) {
+                return;
+            }
+            var monaco = window['monaco'];
+            return new Promise(function (resolve) {
+                var editor = monaco.editor.create(element, __assign(__assign({}, opts), { language: 'sql', minimap: {
+                        enabled: false
+                    } }));
+                editor.addCommand(monaco.KeyMod.Shift | monaco.KeyMod.Alt | monaco.KeyCode.KeyF, function () {
+                    var sql = editor.getValue();
+                    if (lodash.trim(sql).length > 0) {
+                        editor.setValue(sqlFormatter.format(sql, {
+                            indent: '    ',
+                            uppercase: true,
+                        }));
+                    }
+                });
+                editor.onKeyUp(function (e) {
+                    // console.log(e)
+                    if ( /*e.code === 'Enter'||*/e.code === 'Quote') {
+                        editor.trigger('随便写点儿啥', 'editor.action.triggerSuggest', {});
+                    }
+                });
+                resolve(editor);
+            });
+        }
+    }
+
     var FixClass = /** @class */ (function () {
         function FixClass() {
         }
@@ -133400,7 +133535,7 @@ define(['exports'], function (exports) { 'use strict';
         initComboGridMulti();
         initIframe();
         initBpmn();
-        //initSqlEditor()
+        initSqlEditor();
     }
 
     exports.Defaults = Defaults;