import { CreateElement } from 'vue';
import { throttle } from '@ibizstudio/runtime';
import { WFDynaActionViewBase } from '../../../view';
import { AppLayoutService } from '../../../app-service';

/**
 * 应用实体工作流动态操作视图基类
 *
 * @export
 * @class AppWFDynaActionViewBase
 * @extends {WFDynaActionViewBase}
 */
export class AppWFDynaActionViewBase extends WFDynaActionViewBase {
  /**
   * 编辑视图渲染
   *
   * @memberof AppWFDynaActionViewBase
   */
  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.renderToolBar(),
        this.renderMainContent(),
        <card slot='button' dis-hover bordered={false} class='footer'>
          <row style=' text-align: right '>
            <i-button type='primary' on-click={(...params: any[]) => throttle(this.onClickOk, params, this)} loading={this.viewLoadingService.isLoading}>
              {this.$t('app.commonwords.ok')}
            </i-button>
            &nbsp;&nbsp;
            <i-button on-click={(...params: any[]) => throttle(this.onClickCancel, params, this)} loading={this.viewLoadingService.isLoading}>
              {this.$t('app.commonwords.cancel')}
            </i-button>
          </row>
        </card>,
      ],
    );
  }
}