import { __decorate } from "tslib";
import { Vue, Component, Prop } from 'vue-property-decorator';
import { UIStateService } from '../../../../app-service';
import { LogUtil } from '@ibizstudio/runtime';
import './app-content-bottom-exp.less';
/**
 * 应用内容区底部导航区
 *
 * @export
 * @class AppContentBottomExp
 * @extends {Vue}
 */
let AppContentBottomExp = class AppContentBottomExp extends Vue {
    constructor() {
        super(...arguments);
        /**
         * UI状态服务
         *
         * @protected
         * @type {UIStateService}
         * @memberof AppContentBottomExp
         */
        this.uiState = new UIStateService();
        /**
         * 菜单数据
         *
         * @memberof AppContentBottomExp
         */
        this.menus = [];
        /**
         * 当前激活项下标
         *
         * @protected
         * @type {number}
         * @memberof AppContentBottomExp
         */
        this.activeIndex = -1;
    }
    /**
     * 组件创建完毕
     *
     * @memberof AppContentBottomExp
     */
    async created() {
        const i = this.uiState.layoutState.bottomExpActiveIndex;
        await this.replenishData(this.items);
        if (this.menus.length >= i + 1) {
            this.itemClick(this.menus[i], i);
        }
    }
    /**
     * 填充数据
     *
     * @memberof AppContentBottomExp
     */
    async replenishData(items) {
        this.menus = [];
        let menus = [...items];
        if (menus && menus.length > 0) {
            for (let i = 0; i < menus.length; i++) {
                if (menus[i].getPSAppFunc) {
                    const appFuncs = this.service.getAllFuncs();
                    const appFunc = appFuncs.find((element) => {
                        return element.appfunctag === menus[i].getPSAppFunc.codeName;
                    });
                    if (appFunc && Object.is(appFunc.appFuncType, 'APPVIEW')) {
                        if (appFunc.getPSAppView) {
                            await appFunc.getPSAppView.fill();
                            Object.assign(menus[i], { viewname: 'app-view-shell', viewModelData: appFunc.getPSAppView });
                        }
                    }
                }
            }
        }
        this.menus = menus;
    }
    /**
     * 激活分页
     *
     * @protected
     * @param {string} name
     * @memberof AppContentBottomExp
     */
    activeTab(name) {
        try {
            const item = this.menus[parseInt(name)];
            this.itemClick(item, parseInt(name));
        }
        catch (error) {
            LogUtil.warn(error);
        }
    }
    /**
     * 菜单项点击
     *
     * @protected
     * @param {*} item
     * @param {number} index
     * @memberof AppContentBottomExp
     */
    itemClick(item, index) {
        this.uiState.layoutState.bottomExpActiveIndex = index;
        this.activeIndex = index;
        this.activeItem = item;
        this.activeItem.isActivated = true;
    }
    /**
     * 绘制标题
     *
     * @protected
     * @param {*} h
     * @param {*} item
     * @returns {*}
     * @memberof AppContentBottomExp
     */
    renderTitle(h, item) {
        return (<div title={this.$tl(item.tooltipTag, item.tooltip)} class="tab-exp-title">
                <menu-icon item={item}/>
                {this.$tl(item.captionTag, item.caption)}
            </div>);
    }
    /**
     * 绘制内容
     *
     * @returns {*}
     * @memberof AppContentBottomExp
     */
    render() {
        return (<div class="app-content-bottom-exp">
                <tabs size="small" animated={false} value={this.activeIndex.toString()} on-on-click={(name) => this.activeTab(name)}>
                    {this.menus.map((item, i) => {
                if (item.hidden) {
                    return;
                }
                return (<tabPane label={(h) => this.renderTitle(h, item)} name={i.toString()}>
                                {item.isActivated ? (<div key={i} class="tab-exp-item-content">
                                        {this.$createElement(item.viewname, {
                            class: "view-container",
                            props: {
                                staticProps: {
                                    viewDefaultUsage: false,
                                    viewModelData: item.viewModelData
                                }
                            },
                        })}
                                    </div>) : null}
                            </tabPane>);
            })}
                </tabs>
            </div>);
    }
};
__decorate([
    Prop()
], AppContentBottomExp.prototype, "ctrlName", void 0);
__decorate([
    Prop()
], AppContentBottomExp.prototype, "service", void 0);
__decorate([
    Prop({ default: () => [] })
], AppContentBottomExp.prototype, "items", void 0);
__decorate([
    Prop()
], AppContentBottomExp.prototype, "modelService", void 0);
AppContentBottomExp = __decorate([
    Component({})
], AppContentBottomExp);
export { AppContentBottomExp };