import { __decorate } from "tslib";
import { Component, Prop } from 'vue-property-decorator';
import { message } from 'ant-design-vue';
import { VueLifeCycleProcessing } from '../../../decorators';
import { DesignContainerBase } from '../design-container-base/design-container-base';
import './design-group.less';
/**
 * 表单分组
 *
 * @export
 * @class DesignGroup
 * @extends {DragDesignItemBase}
 */
let DesignGroup = class DesignGroup extends DesignContainerBase {
    /**
     * @description 删除当前数据
     * @param {MouseEvent} e
     * @return {*}  {Promise<void>}
     * @memberof DesignGroup
     */
    async deleteHandle(e) {
        var _a;
        e.stopPropagation();
        if ((_a = this.ctrl) === null || _a === void 0 ? void 0 : _a.isDefaultLayout) {
            this.userOperationTips(e);
        }
        else {
            const event = this.ctrl.evt;
            if (event) {
                event.emit('removePanel', this.data);
            }
            const res = await this.service.RemoveTemp(this.ctx.context, this.data);
            if (res.ok === false) {
                message.error(res.statusText || '');
                return;
            }
            this.setSelect(this.parentData);
        }
    }
    /**
     * @description 绘制子项
     * @param {*} item
     * @return {*}
     * @memberof DesignGroup
     */
    renderChildItem(item) {
        if (item.isDefaultLayout || item.isCtrls) {
            return null;
        }
        return this.ctx.ctrl.renderChildItem(this.$createElement, this.ctx, item, this.data);
    }
    /**
     * @description 绘制拖拽区
     * @param {any[]} list
     * @param {*} [content]
     * @return {*}  {*}
     * @memberof DesignGroup
     */
    renderDraggable(list, content) {
        const h = this.$createElement;
        return h('draggable', {
            attrs: {
                handle: this.options.handle,
                group: this.options.group,
                animation: this.options.animation,
                list: list,
            },
            class: 'draggable-container',
            on: {
                change: (e) => this.change(e, list),
            },
        }, [
            h('transition-group', Object.assign({ attrs: {
                    type: 'transition',
                    name: 'flip-list',
                }, class: this.getDraggableClass() }, this.getDraggableOtherParams()), content),
        ]);
    }
    renderContent() {
        const { text, showcaption, showtitlebar } = this.data;
        const contentStyle = this.getContentStyle(this.data);
        const hiddenHeader = showcaption == 0 || showtitlebar == 0;
        return (<div class={{
                'ibz-design-group': true,
                'drag-item-container': true,
                active: this.active,
                'ibz-design-group-border-hidden': this.ctx.state.hidden,
            }}>
                {this.isGridContainerItem
                ? (<div class='grid-container-item'>
                                {`配比-${this.data.flexgrow ? this.data.flexgrow : "自适应"}`}
                            </div>)
                : hiddenHeader ? (<div class='drag-item-info' v-show={hiddenHeader && !this.ctx.state.hidden}>
                                <div class='drag-item-info-text'>{text}</div>
                            </div>) : (<div class='header' v-show={!hiddenHeader}>
                                <div class='title'>{text}</div>
                                <div class='arrow'>
                                    <a-icon type='caret-down'/>
                                </div>
                            </div>)}
                <div class='content' style={contentStyle}>
                    {this.renderDraggable(this.list, this.renderChild())}
                </div>
            </div>);
    }
};
__decorate([
    Prop()
], DesignGroup.prototype, "isGridContainerItem", void 0);
DesignGroup = __decorate([
    Component({}),
    VueLifeCycleProcessing()
], DesignGroup);
export { DesignGroup };