import { ModelTool, Util } from 'ibiz-core';
import { Component, Emit } from 'vue-property-decorator';
import { VueLifeCycleProcessing } from '../../../decorators';
import { EditorBase } from '../editor-base/editor-base';
// import { AppCodeEditor } from 'ibiz-plugin';

/**
 * 代码编辑器
 *
 * @export
 * @class TextboxEditor
 * @extends {EditorBase}
 */
@Component({})
@VueLifeCycleProcessing()
export default class CodeEditor extends EditorBase {
    /**
     * 编辑器change事件
     *
     * @param {*} value
     * @memberof EditorBase
     */
    @Emit('change')
    public editorChange(value: any): void { }

    /**
     * 编辑器change事件
     *
     * @param {*} value
     * @memberof TextboxEditor
     */
    public handleChange($event: any) {
        this.editorChange({ name: this.editorInstance.name, value: $event });
    }

    /**
     * 编辑器enter事件
     *
     * @param {*} value
     * @memberof TextboxEditor
     */
    public handleEnter($event: any) {
        this.$emit('enter', arguments);
    }

    /**
     * @description 处理自定义参数
     * @param {*} params
     * @return {*} 
     * @memberof CodeEditor
     */
    public handleParams(params: any) {
        const param: any = {};
        if (params.isReadOnly) {
            param.isReadOnly = this.handleBoolean(params.isReadOnly);
        }
        if (params.isMinimap) {
            param.isMinimap = this.handleBoolean(params.isMinimap);
        }
        if (params.isChangeLanguage) {
            param.isChangeLanguage = this.handleBoolean(params.isChangeLanguage);
        }
        return Object.assign(params, param);
    }

    /**
     * 绘制内容
     *
     * @returns {*}
     * @memberof TextboxEditor
     */
    public render(): any {
        return this.$createElement(this.editorComponentName, {
            props: {
                name: this.editorInstance.name,
                value: this.value,
                disabled: this.disabled,
                ...this.handleParams(this.customProps),
            },
            on: {
                change: this.handleChange,
                enter: this.handleEnter,
                blur: this.editorBlur
            },
            style: this.customStyle,
        });
    }
}
