import { CreateElement } from 'vue';
import { AppLayoutService } from '../../../app-service/common-service/app-layout-service';
import { DeIndexViewBase } from '../../../view';

/**
 * 应用实体首页视图
 *
 * @export
 * @class AppDEIndexViewBase
 * @extends {DeIndexViewBase}
 */
export class AppDEIndexViewBase extends DeIndexViewBase {
  /**
   * @description 渲染表单部件
   * @return {*}
   * @memberof AppDEIndexViewBase
   */
  renderForm() {
    if (!this.formInstance) {
      return;
    }
    const { targetCtrlName, targetCtrlParam, targetCtrlEvent } = this.computeTargetCtrlData(this.formInstance);
    return this.$createElement(targetCtrlName, { props: targetCtrlParam, ref: this.formInstance?.name, on: targetCtrlEvent });
  }

  /**
   * @description 渲染数据关系栏部件
   * @return {*}
   * @memberof AppDEIndexViewBase
   */
  renderDrBar() {
    if (!this.drBarInstance) {
      return;
    }
    const { targetCtrlName, targetCtrlParam, targetCtrlEvent } = this.computeTargetCtrlData(this.drBarInstance);
    Object.assign(targetCtrlParam.staticProps, {
      showMode: 'INDEXMODE',
    });
    return this.$createElement(targetCtrlName, { props: targetCtrlParam, ref: this.drBarInstance?.name, on: targetCtrlEvent });
  }

  /**
   * @description 渲染主体内容
   * @return {*}
   * @memberof AppDEIndexViewBase
   */
  renderMainContent() {
    return (
      <div slot='default' class='ctrl-container'>
        <div class='form-container'>{this.renderForm()}</div>
        <div class='drbar-container'>{this.renderDrBar()}</div>
      </div>
    );
  }

  /**
   * @description 渲染实体首页视图
   * @param {CreateElement} h
   * @return {*}
   * @memberof AppDEIndexViewBase
   */
  render(h: CreateElement) {
    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.renderDataPanelInfo(),
        this.renderTopMessage(),
        this.renderCaptionInfo(),
        this.renderBodyMessage(),
        this.renderToolBar(),
        this.renderMainContent(),
        this.renderBottomMessage(),
        ...this.renderViewControls(),
      ],
    );
  }
}