import { DataViewControlBase } from '../../../widgets';

/**
 * 数据视图部件基类
 *
 * @export
 * @class AppDataViewBase
 * @extends {DataViewControlBase}
 */
export class AppDataViewBase extends DataViewControlBase {
  /**
   * 绘制
   *
   * @memberof AppDataViewBase
   */
  render(h: any) {
    if (!this.controlIsLoaded) {
      return null;
    }
    const { controlClassNames } = this.renderOptions;
    return (
      <div class={{ ...controlClassNames, 'app-data-view': true }} style='height: 100%;'>
        {this.renderSortBar(h)}
        <row v-show={this.items.length > 0} class='data-view-container' gutter={20} type='flex' justify='start' style='margin:0px;'>
          {this.renderDataViewContent(h)}
          {this.renderBatchToolbar()}
        </row>
        {this.isControlLoaded ? this.renderEmptyDataTip() : this.renderLoadDataTip()}
        <el-backtop target='.content-container .app-data-view'></el-backtop>
      </div>
    );
  }
}