import { IPSExpBar } from '@ibizstudio/runtime';
import { ExpViewInterface } from '@ibizstudio/runtime';
import { CreateElement, VNode } from 'vue';
import { AppLayoutService } from '../app-service';
import { MainViewBase } from './mainview-base';

/**
 * 导航视图基类
 *
 * @export
 * @class ExpViewBase
 * @extends {MainViewBase}
 * @implements {ExpViewInterface}
 */
export class ExpViewBase extends MainViewBase implements ExpViewInterface {
  /**
   * 视图唯一标识
   *
   * @type {string}
   * @memberof ExpViewBase
   */
  viewUID: string = '';

  /**
   * 导航栏实例
   *
   * @memberof ExpViewBase
   */
  declare expBarInstance: IPSExpBar;

  /**
   * 渲染视图主体内容区
   *
   * @memberof ExpViewBase
   */
  renderMainContent() {
    let { targetCtrlName, targetCtrlParam, targetCtrlEvent } = this.computeTargetCtrlData(this.expBarInstance);
    return this.$createElement(targetCtrlName, { props: targetCtrlParam, ref: this.expBarInstance?.name, on: targetCtrlEvent });
  }

  render(h: CreateElement): VNode | null {
    if (!this.viewIsLoaded) {
      return null;
    }
    const targetViewLayoutComponent: any = AppLayoutService.getLayoutComponent(`${this.viewInstance.viewType}-${this.viewInstance.viewStyle}`);
    return h(
      targetViewLayoutComponent,
      {
        props: { viewInstance: this.viewInstance, model: this.model, modelService: this.modelService, viewparams: this.viewparams, context: this.context },
      },
      [this.renderTopMessage(), this.renderToolBar(), this.renderBodyMessage(), this.renderMainContent(), this.renderBottomMessage()],
    );
  }
}