import '../style/ProFormCard.less'
// import { setFormItemStyle } from '@/utils/util'
export default {
    name: 'ProFormCard',
    props: {
        bodyStyle: Object,
        colNum: {
            type: [Number, String],
            default: () => 3
        },
        sidebarId: {             //侧边栏跳转id
            type: String,
            default: ''
        }
    },
    beforeUpdate () {
        // setFormItemStyle();
    },
    render () {
        let that = this;
        let header = ''
        that.$slots.default().forEach(attr => {
            if (attr.type == 'template' && attr.props.slot === 'header') {
                header = attr.children
            }
        })
        return (
            <div class={`dhc-proFormCard ${this.$attrs.class ? this.$attrs.class : ''}`} id={this.sidebarId}>
                {/* 头部 */}
                {header ? <div class="dhc-proFormCard-heard">{header}</div> : null}
                {/* 内容体 */}
                <div class="dhc-proFormCard-body" style={that.bodyStyle}>
                    <a-row gutter={24}>
                        {(() => {
                            let result = [];
                            if (that.$slots.default().length > 0) {
                                that.$slots.default().forEach(attr => {
                                    if (attr.children == null || (attr.type == 'template' && attr.props.slot === 'header')) {
                                        return;
                                    }
                                    for (let i = 0; i < attr.children.length; i++) {
                                        let item = attr.children[i]
                                        let span = 24 / that.colNum;
                                        //设置跨行
                                        if (item?.props?.col >= 0 && item?.props?.col <= that.colNum) {
                                            span = span * item.props.col
                                        }
                                        // if (item.tag == undefined) { //v-if为false的列
                                        //     span = 0
                                        // } else
                                        if (item?.type?.name == 'AFormItem') { //为a-form-item的组件
                                            item?.dirs?.forEach(item => {
                                                if ((item.dir.name == 'show' || item.dir.name == 'v-show') && item.value == false) {
                                                    span = 0
                                                }
                                            })
                                        } else { //非el-form-item组件直接占整行
                                            span = 24
                                        }
                                        result.push(
                                            <a-col span={span} >
                                                {item}
                                            </a-col>
                                        )
                                    }
                                })

                            }
                            return result;
                        })()}
                    </a-row>
                </div>
            </div>
        )
    }
}
