@fesjs/fes-design/es/table/column.js

fes-design for PC

import { defineComponent, inject, getCurrentInstance, onBeforeMount, onBeforeUnmount, Fragment, h } from 'vue';
import { TABLE_COLUMN_NAME, provideKey, TABLE_NAME } from './const';

const columnProps = {
  label: String,
  prop: String,
  type: {
    type: String,
    default: 'default'
  },
  // 默认多选，仅在type = 'selection'生效
  multiple: {
    type: Boolean,
    default: true
  },
  align: {
    type: String,
    default: 'left'
  },
  width: Number,
  minWidth: Number,
  colClassName: [Function, String, Array, Object],
  colStyle: [Function, Object],
  fixed: {
    type: [Boolean, String]
  },
  formatter: Function,
  resizable: {
    type: Boolean,
    default: false
  },
  sortable: {
    type: Boolean,
    default: false
  },
  sortDirections: {
    type: Array,
    default: ['descend', 'ascend']
  },
  sortOrder: {
    type: [String, Boolean],
    default: false
  },
  sorter: {
    type: [Function, String],
    default: 'default'
  },
  selectable: Function,
  action: [Object, Array],
  ellipsis: {
    type: [Boolean, Object],
    default: false
  },
  visible: {
    type: Boolean,
    default: true
  }
};
const getDefaultColProps = () => {
  const values = {};
  Object.keys(columnProps).forEach(key => {
    const val = columnProps[key].default;
    values[key] = val;
  });
  return values;
};
var column = defineComponent({
  name: TABLE_COLUMN_NAME,
  props: columnProps,
  setup(props, ctx) {
    const table = inject(provideKey, null);
    if (!table) {
      return console.error(`[${TABLE_COLUMN_NAME}]: ${TABLE_COLUMN_NAME} 须搭配 ${TABLE_NAME} 组件使用！`);
    }
    const instance = getCurrentInstance();
    const parentInstance = instance.parent;
    const {
      addColumn,
      removeColumn
    } = table;
    onBeforeMount(() => {
      addColumn({
        id: instance.uid,
        props,
        slots: ctx.slots,
        parentId: parentInstance.uid || null
      });
    });
    onBeforeUnmount(() => {
      removeColumn(instance.uid);
    });
  },
  render() {
    let children = [];
    try {
      var _this$$slots$default, _this$$slots;
      const renderDefault = (_this$$slots$default = (_this$$slots = this.$slots).default) === null || _this$$slots$default === void 0 ? void 0 : _this$$slots$default.call(_this$$slots, {
        row: {},
        rowIndex: -1,
        column: {},
        columnIndex: -1,
        cellValue: null
      });
      if (Array.isArray(renderDefault)) {
        renderDefault.forEach(childNode => {
          var _childNode$type;
          if (((_childNode$type = childNode.type) === null || _childNode$type === void 0 ? void 0 : _childNode$type.name) === TABLE_COLUMN_NAME || childNode.shapeFlag !== 36) {
            children.push(childNode);
          } else if (childNode.type === Fragment && Array.isArray(childNode.children)) {
            children.push(...childNode.children);
          }
        });
      }
    } catch (_unused) {
      children = [];
    }
    return h('div', children);
  }
});

export { columnProps, column as default, getDefaultColProps };