import { IPSAppDEACMode, IPSAutoComplete, IPSDEACModeDataItem } from '@ibizstudio/runtime';
import { ModelTool } from '@ibizstudio/runtime';
import { Component, Prop } from 'vue-property-decorator';
import { PluginService } from '../../../app-service';
import { VueLifeCycleProcessing } from '../../../decorators';
import { EditorBase } from '../editor-base/editor-base';

/**
 * 自动完成编辑器
 *
 * @export
 * @class AutocompleteEditor
 * @extends {EditorBase}
 */
@Component({})
@VueLifeCycleProcessing()
export default class AutocompleteEditor extends EditorBase {
    /**
     * @description 自填项插件
     * @type {*}
     * @memberof AutocompleteEditor
     */
    acItemPlugin: any;

    /**
     * @description 插件工厂
     * @type {PluginService}
     * @memberof AutocompleteEditor
     */
    PluginFactory: PluginService = PluginService.getInstance();

    /**
     * 编辑器模型
     *
     * @type {*}
     * @memberof EditorBase
     */
    @Prop() declare editorInstance: IPSAutoComplete;

    /**
     * 编辑器初始化
     *
     * @memberof AutocompleteEditor
     */
    async initEditor() {
        await super.initEditor();
        if (this.editorInstance.getPSAppDEACMode() &&
            (this.editorInstance.getPSAppDEACMode() as IPSAppDEACMode).getPSDEACModeDataItems() &&
            ((this.editorInstance.getPSAppDEACMode() as IPSAppDEACMode).getPSDEACModeDataItems() as IPSDEACModeDataItem[]).length > 0) {
            this.customProps.dataItems = (this.editorInstance.getPSAppDEACMode() as IPSAppDEACMode).getPSDEACModeDataItems();
        }
        this.customProps.acParams = ModelTool.getAcParams(this.editorInstance);
        this.customProps.deMajorField = ModelTool.getEditorMajorName(this.editorInstance);
        this.customProps.deKeyField = ModelTool.getEditorKeyName(this.editorInstance);
        this.acItemPlugin = ModelTool.getAcItemPlugin(this.editorInstance);
    }

    /**
     * 绘制内容
     *
     * @returns {*}
     * @memberof AutocompleteEditor
     */
    render(): any {
        if (!this.editorIsLoaded) {
            return null;
        }
        return this.$createElement(this.editorComponentName, {
            props: {
                name: this.editorInstance.name,
                value: this.value,
                disabled: this.disabled,
                data: this.contextData,
                service: this.service,
                context: this.context,
                editorType: this.editorInstance.editorType,
                viewparams: this.viewparams,
                acItemPlugin: this.acItemPlugin ? true : false,
                valueitem: this.parentItem?.valueItemName || '',
                ...this.customProps,
            },
            on: { formitemvaluechange: this.editorChange },
            style: this.customStyle,
            scopedSlots: {
                acItemPlugin: ({ item }: any) => {
                  if (this.acItemPlugin) {
                    const pluginInstance: any = this.PluginFactory.getPluginInstance('DEACMODE', this.acItemPlugin.pluginCode);
                    if (pluginInstance) {
                      return pluginInstance.renderAcItem(this.$createElement, item, this.value, this);
                    }
                  }
                }
              }
        })
    }
}