fineui/src/core/logic/logic.layout.js

import { Logic } from "./logic";
import { isNotNull, each, pickBy } from "../2.base";

/**
 * guy
 * 上下布局逻辑
 * 上下布局的时候要考虑到是动态布局还是静态布局
 */
export class VerticalLayoutLogic extends Logic {
    props() {
        return {
            dynamic: false,
            scrollable: null,
            scrolly: false,
            scrollx: false,
            items: [],
            hgap: 0,
            vgap: 0,
            lgap: 0,
            rgap: 0,
            tgap: 0,
            bgap: 0,
            innerVgap: 0,
            innerHgap: 0,
        };
    }

    createLogic() {
        let layout;
        const o = this.options;
        if (o.dynamic) {
            layout = "bi.vertical";
        } else {
            layout = "bi.vtape";
        }
        
        return pickBy({
            type: layout,
            scrollable: o.scrollable,
            scrolly: o.scrolly,
            scrollx: o.scrollx,
            hgap: o.hgap,
            vgap: o.vgap,
            lgap: o.lgap,
            rgap: o.rgap,
            tgap: o.tgap,
            bgap: o.bgap,
            innerHgap: o.innerHgap,
            innerVgap: o.innerVgap,
            items: o.items,
            horizontalAlign: o.horizontalAlign,
            verticalAlign: o.verticalAlign,
            columnSize: o.columnSize,
            rowSize: o.rowSize,
        }, isNotNull);
    }
}


/**
 * guy
 * 左右布局逻辑
 * 左右布局的时候要考虑到是动态布局还是静态布局
 */
export class HorizontalLayoutLogic extends Logic {
    props() {
        return {
            dynamic: false,
            scrollable: null,
            scrolly: false,
            scrollx: false,
            items: [],
            hgap: 0,
            vgap: 0,
            lgap: 0,
            rgap: 0,
            tgap: 0,
            bgap: 0,
            innerVgap: 0,
            innerHgap: 0,
        };
    }

    createLogic() {
        let layout;
        const o = this.options;
        if (o.dynamic) {
            layout = "bi.vertical_adapt";
        } else {
            layout = "bi.htape";
        }
        
        return pickBy({
            type: layout,
            scrollable: o.scrollable,
            scrolly: o.scrolly,
            scrollx: o.scrollx,
            hgap: o.hgap,
            vgap: o.vgap,
            lgap: o.lgap,
            rgap: o.rgap,
            tgap: o.tgap,
            bgap: o.bgap,
            innerHgap: o.innerHgap,
            innerVgap: o.innerVgap,
            items: o.items,
            horizontalAlign: o.horizontalAlign,
            verticalAlign: o.verticalAlign,
            columnSize: o.columnSize,
            rowSize: o.rowSize,
        }, isNotNull);
    }
}

/**
 * guy
 * 表格布局逻辑
 * 表格布局的时候要考虑到是动态布局还是静态布局
 */
export class TableLayoutLogic extends Logic {
    props() {
        return {
            dynamic: false,
            scrollable: null,
            scrolly: false,
            scrollx: false,
            columns: 0,
            rows: 0,
            columnSize: [],
            rowSize: [],
            hgap: 0,
            vgap: 0,
            items: [],
        };
    }

    createLogic() {
        let layout;
        const o = this.options;
        if (o.dynamic) {
            layout = "bi.table";
        } else {
            layout = "bi.window";
        }
        
        return pickBy({
            type: layout,
            scrollable: o.scrollable,
            scrolly: o.scrolly,
            scrollx: o.scrollx,
            columns: o.columns,
            rows: o.rows,
            hgap: o.hgap,
            vgap: o.vgap,
            items: o.items,
            horizontalAlign: o.horizontalAlign,
            verticalAlign: o.verticalAlign,
            columnSize: o.columnSize,
            rowSize: o.rowSize,
        }, isNotNull);
    }
}

/**
 * guy
 * 左右充满布局逻辑
 */
export class HorizontalFillLayoutLogic extends Logic {
    props() {
        return {
            dynamic: false,
            scrollable: null,
            scrolly: false,
            scrollx: false,
            items: [],
            hgap: 0,
            vgap: 0,
            lgap: 0,
            rgap: 0,
            tgap: 0,
            bgap: 0,
            innerVgap: 0,
            innerHgap: 0,
        };
    }

    createLogic() {
        let layout;
        const o = this.options;
        const columnSize = [];
        each(o.items, (i, item) => {
            columnSize.push(item.width || 0);
        });
        if (o.dynamic) {
            layout = "bi.horizontal_fill";
        } else {
            layout = "bi.htape";
        }
        
        return pickBy({
            type: layout,
            scrollable: o.scrollable,
            scrolly: o.scrolly,
            scrollx: o.scrollx,
            hgap: o.hgap,
            vgap: o.vgap,
            lgap: o.lgap,
            rgap: o.rgap,
            tgap: o.tgap,
            bgap: o.bgap,
            innerHgap: o.innerHgap,
            innerVgap: o.innerVgap,
            items: o.items,
            horizontalAlign: o.horizontalAlign,
            verticalAlign: o.verticalAlign,
            columnSize,
            rowSize: o.rowSize,
        }, isNotNull);
    }
}