<script lang='tsx'>
import { Prop, Provide, Emit, Watch } from 'vue-property-decorator';
import { Subject } from 'rxjs';
import { IndexViewBase } from '@/crm-core';

/**
 * IBizEAM基类
 *
 * @export
 * @class AppIndexBase
 * @extends {IndexViewBase}
 */
export default class AppIndexBase extends IndexViewBase {

	/**
	 * 视图标识
	 *
	 * @type {string}
     * @protected
	 * @memberof AppIndexBase
	 */
	protected viewtag: string = 'b9b3c2b39c97ba3485d12d9c376d7d33';

    /**
     * 视图模型数据
     *
     * @type {*}
     * @memberof AppIndexBase
     */
    public model: any = {
        srfTitle: 'IBizEAM',
        srfCaption: 'app.views.appindex.caption',
        srfSubCaption: '',
        dataInfo: ''
    }

    /**
     * 容器模型
     *
     * @type {*}
     * @memberof AppIndexBase
     */
    public containerModel: any = {
        view_appmenu: { name: 'appmenu', type: 'APPMENU' },
    };


    public render(): any {
        return (<div class="app-container">
            <app-layout viewName="appindex" viewTitle="IBizEAM" className={{ index_view: true }}>
        <template slot="headerLeft">
          <div class="app-header-left">
            <img class="logo" src="./assets/img/logo.png" />
            <div class="app-name">{this.$t(this.model.srfCaption)}</div>
          </div>
        </template>
        <template slot="headerRight">
          <div class="app-header-right">
            <app-header-menus menus={this.topMenus} on-menu-click={(e: any) => this.topMenuClick(e)}/>
          </div>
        </template>
        <template slot="content">
          <div class="crm-app-content">
            <div class="inedx-app-menus">
          <view_appmenu
            viewState={this.viewState}
            viewparams={this.viewparams}
            context={this.context}
            showBusyIndicator={true}
            on-menus-change={(menus: any[]) => this.appMenusChange(menus)}
            name="appmenu"
            ref="appmenu"
          />
            </div>
            <div class="content" style="width: calc(100% - 240px)">
              <router-view></router-view>
            </div>
          </div>
        </template>
      </app-layout>
        </div>);
    }
}
</script>

<style lang='less'>
@import './app-index.less';
</style>