base-ui/src/component/b-table/mixin/common.js

A component library for Better Vue developmemt

/*
 * @Author: pengmeng@yangqianguan.com
 * @Date: 2019-06-12 11:39:53
 * @Last Modified by: pengmeng
 * @Last Modified time: 2020-05-08 19:03:28
 */

export default {
    props: {
        options: {
            type: Object,
            default: () => {}
        },

        fixed: {
            type: [String, Boolean],
            default: false
        },

        hoverIndex: {
            type: Number,
            default: null
        },

        rowsHeight: {
            type: Array,
            default: () => []
        },

        tdsWidth: {
            type: Array,
            default: () => []
        },

        foldMap: {
            type: Object,
            default: () => ({})
        },

        fixHeight: {
            type: Number,
            default: null
        }
    },

    computed: {
        enableSort() {
            const {
                options: {enableClientSort, enableServerSort}
            } = this;
            return enableClientSort || enableServerSort;
        },

        activeColDefs() {
            const vm = this;
            const {
                options: {colDefs},
                foldMap
            } = vm;
            let activeColDefs = [];
            colDefs.forEach((def) => {
                const {field, children = []} = def;
                activeColDefs = activeColDefs.concat(def, foldMap[field] ? children : []);
            });
            if (!vm.fixed) return activeColDefs;
            return activeColDefs.filter(item => vm.fixed === item.fixed);
        }
    },
    watch: {
        tdsWidth() {
            if (this.fixed) this.$forceUpdate();
        }
    },
    methods: {
        isShowSortIcon(field) {
            const {
                enableSort,
                sortInfo: {supportFields = []}
            } = this;
            if (!enableSort) return false;
            if (!supportFields.length) return true;

            return supportFields.includes(field);
        },

        getColStyle({minWidth, maxWidth, width}) {
            return {
                ...(minWidth ? {minWidth: `${minWidth}px`} : {}),
                ...(maxWidth ? {maxWidth: `${maxWidth}px`} : {}),
                ...(width ? {width: `${width}px`} : {})
            };
        },

        getFixedColStyle(index, tdsWidth, options, length, fixed) {
            const {enableSelection} = options;

            if (tdsWidth.length > 0 && enableSelection && fixed === 'left') {
                return {
                    ...(tdsWidth.length > 0 ? {width: `${tdsWidth[index + 1] - 20}px`} : {})
                };
            }

            if (fixed && fixed === 'right') {
                tdsWidth = tdsWidth.slice(-length);
            }

            return {
                ...(tdsWidth.length > 0 ? {width: `${tdsWidth[index] - 20}px`} : {})
            };
        },

        getCellStyle({minWidth, maxWidth}) {
            return {
                ...(minWidth ? {minWidth: `${minWidth}px`} : {}),
                ...(maxWidth ? {maxWidth: `${maxWidth}px`} : {})
            };
        },

        getRowStyle(index) {
            const {rowsHeight} = this;
            return {...(rowsHeight.length > 0 ? {height: `${rowsHeight[index]}px`} : {})};
        }
    }
};