import { throttle, Util } from '@ibizstudio/runtime';
import { DrbarControlBase } from '../../../widgets/drbar-control-base';
/**
 * 数据关系栏部件基类
 *
 * @export
 * @class AppDrbarBase
 * @extends {TabExpPanelBase}
 */
export class AppDrbarBase extends DrbarControlBase {
    /**
     * 绘制关系界面
     *
     * @return {*}
     * @memberof AppDrbarBase
     */
    renderDrView() {
        var _a, _b, _c;
        if (this.selection && this.selection.view && !this.selection.disabled) {
            let viewData = Util.deepCopy(this.context);
            let viewParam = Util.deepCopy(this.viewparams);
            if (this.selection.localContext) {
                Object.assign(viewData, this.selection.localContext);
            }
            if (this.selection.localViewParam) {
                Object.assign(viewParam, this.selection.localViewParam);
            }
            if ((_b = (_a = this.selection.view).getPSAppView) === null || _b === void 0 ? void 0 : _b.call(_a)) {
                Object.assign(viewData, { viewpath: (_c = this.selection.view.getPSAppView()) === null || _c === void 0 ? void 0 : _c.modelPath });
            }
            //  填充主视图标识参数
            if (this.appDeCodeName && viewData.hasOwnProperty(this.appDeCodeName.toLowerCase())) {
                Object.assign(viewData, { srfparentdename: this.appDeCodeName, srfparentkey: viewData[this.appDeCodeName.toLowerCase()] });
                Object.assign(viewParam, { srfparentdename: this.appDeCodeName, srfparentkey: viewData[this.appDeCodeName.toLowerCase()] });
            }
            return this.$createElement('app-view-shell', {
                props: {
                    staticProps: {
                        viewDefaultUsage: false,
                        appDeCodeName: this.appDeCodeName,
                    },
                    dynamicProps: {
                        viewdata: JSON.stringify(viewData),
                        viewparam: JSON.stringify(viewParam),
                    },
                },
                key: Util.createUUID(),
                class: 'viewcontainer2',
                on: {},
            });
        }
    }
    /**
     * @description 渲染菜单项
     * @param {any[]} items
     * @return {*}
     * @memberof AppDrbarBase
     */
    renderMenuItems(items) {
        const getGroupTitle = (item) => {
            if (this.showMode == 'DEFAULT') {
                return item.text;
            }
            if (this.selection && this.selection.groupCodeName == item.id) {
                return item.text + '-' + this.selection.text;
            }
            else {
                return item.text;
            }
        };
        return items.map((item, index) => {
            if (this.showMode == 'INDEXMODE' && item.id == this.formName) {
                return null;
            }
            if (item.items && item.items.length > 0) {
                return (<el-submenu class='drbar-menu-item drbar-menu-item--subitem' key={index} index={item.id} disabled={item.disabled}>
            <span class='drbar-menu-item--title' slot='title'>
              {item.icon ? <img src={item.icon} class='drbar-menu-item--icon'></img> : item.iconcls ? <i class={Object.assign(Object.assign({}, item.iconcls), { 'drbar-menu-item--icon': true })}></i> : null}
              {getGroupTitle(item)}
            </span>
            {this.renderMenuItems(item.items)}
          </el-submenu>);
            }
            else {
                return (<el-menu-item class='drbar-menu-item' key={index} index={item.id} disabled={item.disabled}>
            <span class='drbar-menu-item--title' slot='title'>
              {item.icon ? <img src={item.icon} class='drbar-menu-item--icon'></img> : item.iconcls ? <i class={Object.assign(Object.assign({}, item.iconcls), { 'drbar-menu-item--icon': true })}></i> : null}
              {item.text}
            </span>
            {item.counter && (item.counter.count || item.counter.count == 0) ? <span v-badge={item.counter} class='right-badge'></span> : null}
          </el-menu-item>);
            }
        });
    }
    /**
     * @description 渲染侧边栏
     * @return {*}
     * @memberof AppDrbarBase
     */
    renderSider() {
        var _a;
        return (<sider width={this.width}>
        <el-menu mode={this.menuDir} default-openeds={this.defaultOpeneds} default-active={(_a = this.selection) === null || _a === void 0 ? void 0 : _a.id} on-select={(event) => throttle(this.onSelect, [event], this)}>
          {this.renderMenuItems(this.menuItems)}
        </el-menu>
      </sider>);
    }
    /**
     * @description 渲染头部
     * @return {*}
     * @memberof AppDrbarBase
     */
    renderHeader() {
        var _a;
        return (<header>
        <el-menu mode={this.menuDir} default-openeds={this.defaultOpeneds} default-active={(_a = this.selection) === null || _a === void 0 ? void 0 : _a.id} on-select={(event) => throttle(this.onSelect, [event], this)}>
          {this.renderMenuItems(this.menuItems)}
        </el-menu>
      </header>);
    }
    /**
     * 绘制关系栏部件
     *
     * @returns {*}
     * @memberof AppDrbarBase
     */
    render() {
        if (!this.controlIsLoaded) {
            return null;
        }
        const { controlClassNames } = this.renderOptions;
        return (<layout class={Object.assign(Object.assign({}, controlClassNames), { 'app-dr-bar': true, [`drbar-${this.showMode.toLowerCase()}`]: true })}>
        {this.menuDir == 'horizontal' ? this.renderHeader() : this.renderSider()}
        <content style={[this.showMode == 'DEFAULT' && this.menuDir == 'vertical' ? `width: calc(100% - ${this.width + 1}px)` : '']}>
          {this.showMode == 'DEFAULT' ? (<div class='main-data' style={[this.selection && Object.is(this.selection.id, this.formName) ? '' : { display: 'none', visibility: 'visible' }]}>
              {this.$parent.$slots.mainform}
            </div>) : null}
          {this.renderDrView()}
        </content>
      </layout>);
    }
}
