cbvirtua 1.0.56 → 1.0.58

package/src/packages/table/src/table-column.js

@@ -1,319 +0,0 @@
-import { cellStarts, cellForced, defaultRenderCell, treeCellPrefix } from './config';
-import { mergeOptions, parseWidth, parseMinWidth, compose } from './util';
-import ElCheckbox from 'element-ui/packages/checkbox';
-
-let columnIdSeed = 1;
-
-export default {
-  name: 'ElTableColumn',
-
-  props: {
-    type: {
-      type: String,
-      default: 'default'
-    },
-    label: String,
-    className: String,
-    labelClassName: String,
-    property: String,
-    prop: String,
-    width: {},
-    minWidth: {},
-    renderHeader: Function,
-    sortable: {
-      type: [Boolean, String],
-      default: false
-    },
-    sortMethod: Function,
-    sortBy: [String, Function, Array],
-    resizable: {
-      type: Boolean,
-      default: true
-    },
-    columnKey: String,
-    align: String,
-    headerAlign: String,
-    showTooltipWhenOverflow: Boolean,
-    showOverflowTooltip: Boolean,
-    fixed: [Boolean, String],
-    formatter: Function,
-    selectable: Function,
-    reserveSelection: Boolean,
-    filterMethod: Function,
-    filteredValue: Array,
-    filters: Array,
-    filterPlacement: String,
-    filterMultiple: {
-      type: Boolean,
-      default: true
-    },
-    index: [Number, Function],
-    sortOrders: {
-      type: Array,
-      default() {
-        return ['ascending', 'descending', null];
-      },
-      validator(val) {
-        return val.every(order => ['ascending', 'descending', null].indexOf(order) > -1);
-      }
-    }
-  },
-
-  data() {
-    return {
-      isSubColumn: false,
-      columns: []
-    };
-  },
-
-  computed: {
-    owner() {
-      let parent = this.$parent;
-      while (parent && !parent.tableId) {
-        parent = parent.$parent;
-      }
-      return parent;
-    },
-
-    columnOrTableParent() {
-      let parent = this.$parent;
-      while (parent && !parent.tableId && !parent.columnId) {
-        parent = parent.$parent;
-      }
-      return parent;
-    },
-
-    realWidth() {
-      return parseWidth(this.width);
-    },
-
-    realMinWidth() {
-      return parseMinWidth(this.minWidth);
-    },
-
-    realAlign() {
-      return this.align ? 'is-' + this.align : null;
-    },
-
-    realHeaderAlign() {
-      return this.headerAlign ? 'is-' + this.headerAlign : this.realAlign;
-    }
-  },
-
-  methods: {
-    getPropsData(...props) {
-      return props.reduce((prev, cur) => {
-        if (Array.isArray(cur)) {
-          cur.forEach((key) => {
-            prev[key] = this[key];
-          });
-        }
-        return prev;
-      }, {});
-    },
-
-    getColumnElIndex(children, child) {
-      return [].indexOf.call(children, child);
-    },
-
-    setColumnWidth(column) {
-      if (this.realWidth) {
-        column.width = this.realWidth;
-      }
-      if (this.realMinWidth) {
-        column.minWidth = this.realMinWidth;
-      }
-      if (!column.minWidth) {
-        column.minWidth = 80;
-      }
-      column.realWidth = column.width === undefined ? column.minWidth : column.width;
-      return column;
-    },
-
-    setColumnForcedProps(column) {
-      // 对于特定类型的 column，某些属性不允许设置
-      const type = column.type;
-      const source = cellForced[type] || {};
-      Object.keys(source).forEach(prop => {
-        let value = source[prop];
-        if (value !== undefined) {
-          column[prop] = prop === 'className' ? `${column[prop]} ${value}` : value;
-        }
-      });
-      return column;
-    },
-
-    setColumnRenders(column) {
-      // renderHeader 属性不推荐使用。
-      if (this.renderHeader) {
-        console.warn('[Element Warn][TableColumn]Comparing to render-header, scoped-slot header is easier to use. We recommend users to use scoped-slot header.');
-      } else if (column.type !== 'selection') {
-        column.renderHeader = (h, scope) => {
-          const renderHeader = this.$scopedSlots.header;
-          return renderHeader ? renderHeader(scope) : column.label;
-        };
-      }
-
-      let originRenderCell = column.renderCell;
-      // TODO: 这里的实现调整
-      if (column.type === 'expand') {
-        // 对于展开行，renderCell 不允许配置的。在上一步中已经设置过，这里需要简单封装一下。
-        column.renderCell = (h, data) => (<div class="cell">
-          { originRenderCell(h, data) }
-        </div>);
-        this.owner.renderExpanded = (h, data) => {
-          return this.$scopedSlots.default
-            ? this.$scopedSlots.default(data)
-            : this.$slots.default;
-        };
-      } else {
-        originRenderCell = originRenderCell || defaultRenderCell;
-        // 对 renderCell 进行包装
-        column.renderCell = (h, data) => {
-          let children = null;
-          if (this.$scopedSlots.default) {
-            children = this.$scopedSlots.default(data);
-          } else {
-            children = originRenderCell(h, data);
-          }
-          const prefix = treeCellPrefix(h, data);
-          const props = {
-            class: 'cell',
-            style: {}
-          };
-          if (column.showOverflowTooltip) {
-            props.class += ' el-tooltip';
-            props.style = {width: (data.column.realWidth || data.column.width) - 1 + 'px'};
-          }
-          return (<div { ...props }>
-            { prefix }
-            { children }
-          </div>);
-        };
-      }
-      return column;
-    },
-
-    registerNormalWatchers() {
-      const props = ['label', 'property', 'filters', 'filterMultiple', 'sortable', 'index', 'formatter', 'className', 'labelClassName', 'showOverflowTooltip'];
-      // 一些属性具有别名
-      const aliases = {
-        prop: 'property',
-        realAlign: 'align',
-        realHeaderAlign: 'headerAlign',
-        realWidth: 'width'
-      };
-      const allAliases = props.reduce((prev, cur) => {
-        prev[cur] = cur;
-        return prev;
-      }, aliases);
-
-      Object.keys(allAliases).forEach(key => {
-        const columnKey = aliases[key];
-
-        this.$watch(key, (newVal) => {
-          this.columnConfig[columnKey] = newVal;
-        });
-      });
-    },
-
-    registerComplexWatchers() {
-      const props = ['fixed'];
-      const aliases = {
-        realWidth: 'width',
-        realMinWidth: 'minWidth'
-      };
-      const allAliases = props.reduce((prev, cur) => {
-        prev[cur] = cur;
-        return prev;
-      }, aliases);
-
-      Object.keys(allAliases).forEach(key => {
-        const columnKey = aliases[key];
-
-        this.$watch(key, (newVal) => {
-          this.columnConfig[columnKey] = newVal;
-          const updateColumns = columnKey === 'fixed';
-          this.owner.store.scheduleLayout(updateColumns);
-        });
-      });
-    }
-  },
-
-  components: {
-    ElCheckbox
-  },
-
-  beforeCreate() {
-    this.row = {};
-    this.column = {};
-    this.$index = 0;
-    this.columnId = '';
-  },
-
-  created() {
-    const parent = this.columnOrTableParent;
-    this.isSubColumn = this.owner !== parent;
-    this.columnId = (parent.tableId || parent.columnId) + '_column_' + columnIdSeed++;
-
-    const type = this.type || 'default';
-    const sortable = this.sortable === '' ? true : this.sortable;
-    const defaults = {
-      ...cellStarts[type],
-      id: this.columnId,
-      type: type,
-      property: this.prop || this.property,
-      align: this.realAlign,
-      headerAlign: this.realHeaderAlign,
-      showOverflowTooltip: this.showOverflowTooltip || this.showTooltipWhenOverflow,
-      // filter 相关属性
-      filterable: this.filters || this.filterMethod,
-      filteredValue: [],
-      filterPlacement: '',
-      isColumnGroup: false,
-      filterOpened: false,
-      // sort 相关属性
-      sortable: sortable,
-      // index 列
-      index: this.index
-    };
-
-    const basicProps = ['columnKey', 'label', 'className', 'labelClassName', 'type', 'renderHeader', 'formatter', 'fixed', 'resizable'];
-    const sortProps = ['sortMethod', 'sortBy', 'sortOrders'];
-    const selectProps = ['selectable', 'reserveSelection'];
-    const filterProps = ['filterMethod', 'filters', 'filterMultiple', 'filterOpened', 'filteredValue', 'filterPlacement'];
-
-    let column = this.getPropsData(basicProps, sortProps, selectProps, filterProps);
-    column = mergeOptions(defaults, column);
-
-    // 注意 compose 中函数执行的顺序是从右到左
-    const chains = compose(this.setColumnRenders, this.setColumnWidth, this.setColumnForcedProps);
-    column = chains(column);
-
-    this.columnConfig = column;
-
-    // 注册 watcher
-    this.registerNormalWatchers();
-    this.registerComplexWatchers();
-  },
-
-  mounted() {
-    const owner = this.owner;
-    const parent = this.columnOrTableParent;
-    const children = this.isSubColumn ? parent.$el.children : parent.$refs.hiddenColumns.children;
-    const columnIndex = this.getColumnElIndex(children, this.$el);
-
-    owner.store.commit('insertColumn', this.columnConfig, columnIndex, this.isSubColumn ? parent.columnConfig : null);
-  },
-
-  destroyed() {
-    if (!this.$parent) return;
-    const parent = this.$parent;
-    this.owner.store.commit('removeColumn', this.columnConfig, this.isSubColumn ? parent.columnConfig : null);
-  },
-
-  render(h) {
-    // slots 也要渲染，需要计算合并表头
-    return h('div', this.$slots.default);
-  }
-};

package/src/packages/table/src/table-footer.js

@@ -1,153 +0,0 @@
-import LayoutObserver from './layout-observer';
-import { mapStates } from './store/helper';
-
-export default {
-  name: 'ElTableFooter',
-
-  mixins: [LayoutObserver],
-
-  render(h) {
-    let sums = [];
-    if (this.summaryMethod) {
-      sums = this.summaryMethod({ columns: this.columns, data: this.store.states.data });
-    } else {
-      this.columns.forEach((column, index) => {
-        if (index === 0) {
-          sums[index] = this.sumText;
-          return;
-        }
-        const values = this.store.states.data.map(item => Number(item[column.property]));
-        const precisions = [];
-        let notNumber = true;
-        values.forEach(value => {
-          if (!isNaN(value)) {
-            notNumber = false;
-            let decimal = ('' + value).split('.')[1];
-            precisions.push(decimal ? decimal.length : 0);
-          }
-        });
-        const precision = Math.max.apply(null, precisions);
-        if (!notNumber) {
-          sums[index] = values.reduce((prev, curr) => {
-            const value = Number(curr);
-            if (!isNaN(value)) {
-              return parseFloat((prev + curr).toFixed(Math.min(precision, 20)));
-            } else {
-              return prev;
-            }
-          }, 0);
-        } else {
-          sums[index] = '';
-        }
-      });
-    }
-
-    return (
-      <table
-        class="el-table__footer"
-        cellspacing="0"
-        cellpadding="0"
-        border="0">
-        <colgroup>
-          {
-            this.columns.map(column => <col name={ column.id } key={column.id} />)
-          }
-          {
-            this.hasGutter ? <col name="gutter" /> : ''
-          }
-        </colgroup>
-        <tbody class={ [{ 'has-gutter': this.hasGutter }] }>
-          <tr>
-            {
-              this.columns.map((column, cellIndex) => <td
-                key={cellIndex}
-                colspan={ column.colSpan }
-                rowspan={ column.rowSpan }
-                class={ [...this.getRowClasses(column, cellIndex), 'el-table__cell'] }>
-                <div class={ ['cell', column.labelClassName] }>
-                  {
-                    sums[cellIndex]
-                  }
-                </div>
-              </td>)
-            }
-            {
-              this.hasGutter ? <th class="el-table__cell gutter"></th> : ''
-            }
-          </tr>
-        </tbody>
-      </table>
-    );
-  },
-
-  props: {
-    fixed: String,
-    store: {
-      required: true
-    },
-    summaryMethod: Function,
-    sumText: String,
-    border: Boolean,
-    defaultSort: {
-      type: Object,
-      default() {
-        return {
-          prop: '',
-          order: ''
-        };
-      }
-    }
-  },
-
-  computed: {
-    table() {
-      return this.$parent;
-    },
-
-    hasGutter() {
-      return !this.fixed && this.tableLayout.gutterWidth;
-    },
-
-    ...mapStates({
-      columns: 'columns',
-      isAllSelected: 'isAllSelected',
-      leftFixedLeafCount: 'fixedLeafColumnsLength',
-      rightFixedLeafCount: 'rightFixedLeafColumnsLength',
-      columnsCount: states => states.columns.length,
-      leftFixedCount: states => states.fixedColumns.length,
-      rightFixedCount: states => states.rightFixedColumns.length
-    })
-  },
-
-  methods: {
-    isCellHidden(index, columns, column) {
-      if (this.fixed === true || this.fixed === 'left') {
-        return index >= this.leftFixedLeafCount;
-      } else if (this.fixed === 'right') {
-        let before = 0;
-        for (let i = 0; i < index; i++) {
-          before += columns[i].colSpan;
-        }
-        return before < this.columnsCount - this.rightFixedLeafCount;
-      } else if (!this.fixed && column.fixed) { // hide cell when footer instance is not fixed and column is fixed
-        return true;
-      } else {
-        return (index < this.leftFixedCount) || (index >= this.columnsCount - this.rightFixedCount);
-      }
-    },
-
-    getRowClasses(column, cellIndex) {
-      const classes = [column.id, column.align, column.labelClassName];
-      if (column.className) {
-        classes.push(column.className);
-      }
-      if (this.isCellHidden(cellIndex, this.columns, column)) {
-        classes.push('is-hidden');
-      }
-      if (!column.children) {
-        classes.push('is-leaf');
-      }
-      return classes;
-    }
-  }
-};