nd-autosize-elementui 2.15.14 → 2.15.16

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

@@ -1,249 +0,0 @@
-import Vue from 'vue';
-import scrollbarWidth from 'element-ui/src/utils/scrollbar-width';
-import { parseHeight } from './util';
-
-class TableLayout {
-  constructor(options) {
-    this.observers = [];
-    this.table = null;
-    this.store = null;
-    this.columns = null;
-    this.fit = true;
-    this.showHeader = true;
-
-    this.height = null;
-    this.scrollX = false;
-    this.scrollY = false;
-    this.bodyWidth = null;
-    this.fixedWidth = null;
-    this.rightFixedWidth = null;
-    this.tableHeight = null;
-    this.headerHeight = 44; // Table Header Height
-    this.appendHeight = 0; // Append Slot Height
-    this.footerHeight = 44; // Table Footer Height
-    this.viewportHeight = null; // Table Height - Scroll Bar Height
-    this.bodyHeight = null; // Table Height - Table Header Height
-    this.fixedBodyHeight = null; // Table Height - Table Header Height - Scroll Bar Height
-    this.gutterWidth = scrollbarWidth();
-
-    for (let name in options) {
-      if (options.hasOwnProperty(name)) {
-        this[name] = options[name];
-      }
-    }
-
-    if (!this.table) {
-      throw new Error('table is required for Table Layout');
-    }
-    if (!this.store) {
-      throw new Error('store is required for Table Layout');
-    }
-  }
-
-  updateScrollY() {
-    const height = this.height;
-    if (height === null) return false;
-    const bodyWrapper = this.table.bodyWrapper;
-    if (this.table.$el && bodyWrapper) {
-      const body = bodyWrapper.querySelector('.el-table__body');
-      const prevScrollY = this.scrollY;
-      const scrollY = body.offsetHeight > this.bodyHeight;
-      this.scrollY = scrollY;
-      return prevScrollY !== scrollY;
-    }
-    return false;
-  }
-
-  setHeight(value, prop = 'height') {
-    if (Vue.prototype.$isServer) return;
-    const el = this.table.$el;
-    value = parseHeight(value);
-    this.height = value;
-
-    if (!el && (value || value === 0)) return Vue.nextTick(() => this.setHeight(value, prop));
-
-    if (typeof value === 'number') {
-      el.style[prop] = value + 'px';
-      this.updateElsHeight();
-    } else if (typeof value === 'string') {
-      el.style[prop] = value;
-      this.updateElsHeight();
-    }
-  }
-
-  setMaxHeight(value) {
-    this.setHeight(value, 'max-height');
-  }
-
-  getFlattenColumns() {
-    const flattenColumns = [];
-    const columns = this.table.columns;
-    columns.forEach((column) => {
-      if (column.isColumnGroup) {
-        flattenColumns.push.apply(flattenColumns, column.columns);
-      } else {
-        flattenColumns.push(column);
-      }
-    });
-
-    return flattenColumns;
-  }
-
-  updateElsHeight() {
-    if (!this.table.$ready) return Vue.nextTick(() => this.updateElsHeight());
-    const { headerWrapper, appendWrapper, footerWrapper } = this.table.$refs;
-    this.appendHeight = appendWrapper ? appendWrapper.offsetHeight : 0;
-
-    if (this.showHeader && !headerWrapper) return;
-
-    // fix issue (https://github.com/ElemeFE/element/pull/16956)
-    const headerTrElm = headerWrapper ? headerWrapper.querySelector('.el-table__header tr') : null;
-    const noneHeader = this.headerDisplayNone(headerTrElm);
-
-    const headerHeight = this.headerHeight = !this.showHeader ? 0 : headerWrapper.offsetHeight;
-    if (this.showHeader && !noneHeader && headerWrapper.offsetWidth > 0 && (this.table.columns || []).length > 0 && headerHeight < 2) {
-      return Vue.nextTick(() => this.updateElsHeight());
-    }
-    const tableHeight = this.tableHeight = this.table.$el.clientHeight;
-    const footerHeight = this.footerHeight = footerWrapper ? footerWrapper.offsetHeight : 0;
-    if (this.height !== null) {
-      this.bodyHeight = tableHeight - headerHeight - footerHeight + (footerWrapper ? 1 : 0);
-    }
-    this.fixedBodyHeight = this.scrollX ? (this.bodyHeight - this.gutterWidth) : this.bodyHeight;
-
-    const noData = !(this.store.states.data && this.store.states.data.length);
-    this.viewportHeight = this.scrollX ? tableHeight - (noData ? 0 : this.gutterWidth) : tableHeight;
-    this.updateScrollY();
-    this.notifyObservers('scrollable');
-  }
-
-  headerDisplayNone(elm) {
-    if (!elm) return true;
-    let headerChild = elm;
-    while (headerChild.tagName !== 'DIV') {
-      if (getComputedStyle(headerChild).display === 'none') {
-        return true;
-      }
-      headerChild = headerChild.parentElement;
-    }
-    return false;
-  }
-
-  updateColumnsWidth() {
-    if (Vue.prototype.$isServer) return;
-    const fit = this.fit;
-    const bodyWidth = this.table.$el.clientWidth;
-    let bodyMinWidth = 0;
-
-    const flattenColumns = this.getFlattenColumns();
-    let flexColumns = flattenColumns.filter((column) => typeof column.width !== 'number');
-
-    flattenColumns.forEach((column) => { // Clean those columns whose width changed from flex to unflex
-      if (typeof column.width === 'number' && column.realWidth) column.realWidth = null;
-    });
-
-    if (flexColumns.length > 0 && fit) {
-      flattenColumns.forEach((column) => {
-        bodyMinWidth += column.width || column.minWidth || 80;
-      });
-
-      const scrollYWidth = this.scrollY ? this.gutterWidth : 0;
-
-      if (bodyMinWidth <= bodyWidth - scrollYWidth) { // DON'T HAVE SCROLL BAR
-        this.scrollX = false;
-
-        const totalFlexWidth = bodyWidth - scrollYWidth - bodyMinWidth;
-
-        if (flexColumns.length === 1) {
-          flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth;
-        } else {
-          const allColumnsWidth = flexColumns.reduce((prev, column) => prev + (column.minWidth || 80), 0);
-          const flexWidthPerPixel = totalFlexWidth / allColumnsWidth;
-          let noneFirstWidth = 0;
-
-          flexColumns.forEach((column, index) => {
-            if (index === 0) return;
-            const flexWidth = Math.floor((column.minWidth || 80) * flexWidthPerPixel);
-            noneFirstWidth += flexWidth;
-            column.realWidth = (column.minWidth || 80) + flexWidth;
-          });
-
-          flexColumns[0].realWidth = (flexColumns[0].minWidth || 80) + totalFlexWidth - noneFirstWidth;
-        }
-      } else { // HAVE HORIZONTAL SCROLL BAR
-        this.scrollX = true;
-        flexColumns.forEach(function(column) {
-          column.realWidth = column.minWidth;
-        });
-      }
-
-      this.bodyWidth = Math.max(bodyMinWidth, bodyWidth);
-      this.table.resizeState.width = this.bodyWidth;
-    } else {
-      flattenColumns.forEach((column) => {
-        if (!column.width && !column.minWidth) {
-          column.realWidth = 80;
-        } else {
-          column.realWidth = column.width || column.minWidth;
-        }
-
-        bodyMinWidth += column.realWidth;
-      });
-      this.scrollX = bodyMinWidth > bodyWidth;
-
-      this.bodyWidth = bodyMinWidth;
-    }
-
-    const fixedColumns = this.store.states.fixedColumns;
-
-    if (fixedColumns.length > 0) {
-      let fixedWidth = 0;
-      fixedColumns.forEach(function(column) {
-        fixedWidth += column.realWidth || column.width;
-      });
-
-      this.fixedWidth = fixedWidth;
-    }
-
-    const rightFixedColumns = this.store.states.rightFixedColumns;
-    if (rightFixedColumns.length > 0) {
-      let rightFixedWidth = 0;
-      rightFixedColumns.forEach(function(column) {
-        rightFixedWidth += column.realWidth || column.width;
-      });
-
-      this.rightFixedWidth = rightFixedWidth;
-    }
-
-    this.notifyObservers('columns');
-  }
-
-  addObserver(observer) {
-    this.observers.push(observer);
-  }
-
-  removeObserver(observer) {
-    const index = this.observers.indexOf(observer);
-    if (index !== -1) {
-      this.observers.splice(index, 1);
-    }
-  }
-
-  notifyObservers(event) {
-    const observers = this.observers;
-    observers.forEach((observer) => {
-      switch (event) {
-        case 'columns':
-          observer.onColumnsChange(this);
-          break;
-        case 'scrollable':
-          observer.onScrollableChange(this);
-          break;
-        default:
-          throw new Error(`Table Layout don't have event ${event}.`);
-      }
-    });
-  }
-}
-
-export default TableLayout;

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

@@ -1,101 +0,0 @@
-import ElCheckbox from 'element-ui/packages/checkbox';
-export default {
-  name: 'ElTableRow',
-  props: [
-    'columns',
-    'row',
-    'index',
-    'isSelected',
-    'isExpanded',
-    'store',
-    'context',
-    'firstDefaultColumnIndex',
-    'treeRowData',
-    'treeIndent',
-    'columnsHidden',
-    'getSpan',
-    'getColspanRealWidth',
-    'getCellStyle',
-    'getCellClass',
-    'handleCellMouseLeave',
-    'handleCellMouseEnter',
-    'fixed'
-  ],
-  components: {
-    ElCheckbox
-  },
-  render() {
-    const {
-      columns,
-      row,
-      index: $index,
-      store,
-      context,
-      firstDefaultColumnIndex,
-      treeRowData,
-      treeIndent,
-      columnsHidden = [],
-      isSelected,
-      isExpanded
-    } = this;
-
-    return (
-      <tr>
-        {
-          columns.map((column, cellIndex) => {
-            const { rowspan, colspan } = this.getSpan(row, column, $index, cellIndex);
-            if (!rowspan || !colspan) {
-              return null;
-            }
-            const columnData = { ...column };
-            columnData.realWidth = this.getColspanRealWidth(columns, colspan, cellIndex);
-            const data = {
-              store,
-              isSelected,
-              isExpanded,
-              _self: context,
-              column: columnData,
-              row,
-              $index
-            };
-            if (cellIndex === firstDefaultColumnIndex && treeRowData) {
-              data.treeNode = {
-                indent: treeRowData.level * treeIndent,
-                level: treeRowData.level
-              };
-              if (typeof treeRowData.expanded === 'boolean') {
-                data.treeNode.expanded = treeRowData.expanded;
-                // 表明是懒加载
-                if ('loading' in treeRowData) {
-                  data.treeNode.loading = treeRowData.loading;
-                }
-                if ('noLazyChildren' in treeRowData) {
-                  data.treeNode.noLazyChildren = treeRowData.noLazyChildren;
-                }
-              }
-            }
-            return (
-              <td
-                style={this.getCellStyle($index, cellIndex, row, column)}
-                class={this.getCellClass($index, cellIndex, row, column)}
-                rowspan={rowspan}
-                colspan={colspan}
-                on-mouseenter={($event) => this.handleCellMouseEnter($event, row)}
-                on-mouseleave={this.handleCellMouseLeave}
-              >
-                {
-                  column.renderCell.call(
-                    this._renderProxy,
-                    this.$createElement,
-                    data,
-                    columnsHidden[cellIndex]
-                  )
-                }
-              </td>
-            );
-          })
-        }
-      </tr>
-    );
-  }
-};