cbvirtua 1.0.56 → 1.0.58

package/src/packages/table/src/store/tree.js

@@ -1,209 +0,0 @@
-import { walkTreeNode, getRowIdentity } from '../util';
-
-export default {
-  data() {
-    return {
-      states: {
-        // defaultExpandAll 存在于 expand.js 中，这里不重复添加
-        // 在展开行中，expandRowKeys 会被转化成 expandRows，expandRowKeys 这个属性只是记录了 TreeTable 行的展开
-        // TODO: 拆分为独立的 TreeTable，统一用法
-        expandRowKeys: [],
-        treeData: {},
-        indent: 16,
-        lazy: false,
-        lazyTreeNodeMap: {},
-        lazyColumnIdentifier: 'hasChildren',
-        childrenColumnName: 'children'
-      }
-    };
-  },
-
-  computed: {
-    // 嵌入型的数据，watch 无法是检测到变化 https://github.com/ElemeFE/element/issues/14998
-    // TODO: 使用 computed 解决该问题，是否会造成性能问题？
-    // @return { id: { level, children } }
-    normalizedData() {
-      if (!this.states.rowKey) return {};
-      const data = this.states.data || [];
-      return this.normalize(data);
-    },
-    // @return { id: { children } }
-    // 针对懒加载的情形，不处理嵌套数据
-    normalizedLazyNode() {
-      const { rowKey, lazyTreeNodeMap, lazyColumnIdentifier } = this.states;
-      const keys = Object.keys(lazyTreeNodeMap);
-      const res = {};
-      if (!keys.length) return res;
-      keys.forEach(key => {
-        if (lazyTreeNodeMap[key].length) {
-          const item = { children: [] };
-          lazyTreeNodeMap[key].forEach(row => {
-            const currentRowKey = getRowIdentity(row, rowKey);
-            item.children.push(currentRowKey);
-            if (row[lazyColumnIdentifier] && !res[currentRowKey]) {
-              res[currentRowKey] = { children: [] };
-            }
-          });
-          res[key] = item;
-        }
-      });
-      return res;
-    }
-  },
-
-  watch: {
-    normalizedData: 'updateTreeData',
-    normalizedLazyNode: 'updateTreeData'
-  },
-
-  methods: {
-    normalize(data) {
-      const {
-        childrenColumnName,
-        lazyColumnIdentifier,
-        rowKey,
-        lazy
-      } = this.states;
-      const res = {};
-      walkTreeNode(
-        data,
-        (parent, children, level) => {
-          const parentId = getRowIdentity(parent, rowKey);
-          if (Array.isArray(children)) {
-            res[parentId] = {
-              children: children.map(row => getRowIdentity(row, rowKey)),
-              level
-            };
-          } else if (lazy) {
-            // 当 children 不存在且 lazy 为 true，该节点即为懒加载的节点
-            res[parentId] = {
-              children: [],
-              lazy: true,
-              level
-            };
-          }
-        },
-        childrenColumnName,
-        lazyColumnIdentifier
-      );
-      return res;
-    },
-
-    updateTreeData() {
-      const nested = this.normalizedData;
-      const normalizedLazyNode = this.normalizedLazyNode;
-      const keys = Object.keys(nested);
-      const newTreeData = {};
-      if (keys.length) {
-        const {
-          treeData: oldTreeData,
-          defaultExpandAll,
-          expandRowKeys,
-          lazy
-        } = this.states;
-        const rootLazyRowKeys = [];
-        const getExpanded = (oldValue, key) => {
-          const included =
-            defaultExpandAll ||
-            (expandRowKeys && expandRowKeys.indexOf(key) !== -1);
-          return !!((oldValue && oldValue.expanded) || included);
-        };
-        // 合并 expanded 与 display，确保数据刷新后，状态不变
-        keys.forEach(key => {
-          const oldValue = oldTreeData[key];
-          const newValue = { ...nested[key] };
-          newValue.expanded = getExpanded(oldValue, key);
-          if (newValue.lazy) {
-            const { loaded = false, loading = false } = oldValue || {};
-            newValue.loaded = !!loaded;
-            newValue.loading = !!loading;
-            rootLazyRowKeys.push(key);
-          }
-          newTreeData[key] = newValue;
-        });
-        // 根据懒加载数据更新 treeData
-        const lazyKeys = Object.keys(normalizedLazyNode);
-        if (lazy && lazyKeys.length && rootLazyRowKeys.length) {
-          lazyKeys.forEach(key => {
-            const oldValue = oldTreeData[key];
-            const lazyNodeChildren = normalizedLazyNode[key].children;
-            if (rootLazyRowKeys.indexOf(key) !== -1) {
-              // 懒加载的 root 节点，更新一下原有的数据，原来的 children 一定是空数组
-              if (newTreeData[key].children.length !== 0) {
-                throw new Error('[ElTable]children must be an empty array.');
-              }
-              newTreeData[key].children = lazyNodeChildren;
-            } else {
-              const { loaded = false, loading = false } = oldValue || {};
-              newTreeData[key] = {
-                lazy: true,
-                loaded: !!loaded,
-                loading: !!loading,
-                expanded: getExpanded(oldValue, key),
-                children: lazyNodeChildren,
-                level: ''
-              };
-            }
-          });
-        }
-      }
-      this.states.treeData = newTreeData;
-      this.updateTableScrollY();
-    },
-
-    updateTreeExpandKeys(value) {
-      this.states.expandRowKeys = value;
-      this.updateTreeData();
-    },
-
-    toggleTreeExpansion(row, expanded) {
-      this.assertRowKey();
-
-      const { rowKey, treeData } = this.states;
-      const id = getRowIdentity(row, rowKey);
-      const data = id && treeData[id];
-      if (id && data && ('expanded' in data)) {
-        const oldExpanded = data.expanded;
-        expanded = typeof expanded === 'undefined' ? !data.expanded : expanded;
-        treeData[id].expanded = expanded;
-        if (oldExpanded !== expanded) {
-          this.table.$emit('expand-change', row, expanded);
-        }
-        this.updateTableScrollY();
-      }
-    },
-
-    loadOrToggle(row) {
-      this.assertRowKey();
-      const { lazy, treeData, rowKey } = this.states;
-      const id = getRowIdentity(row, rowKey);
-      const data = treeData[id];
-      if (lazy && data && 'loaded' in data && !data.loaded) {
-        this.loadData(row, id, data);
-      } else {
-        this.toggleTreeExpansion(row);
-      }
-    },
-
-    loadData(row, key, treeNode) {
-      const { load } = this.table;
-      const { treeData: rawTreeData } = this.states;
-      if (load && !rawTreeData[key].loaded) {
-        rawTreeData[key].loading = true;
-        load(row, treeNode, data => {
-          if (!Array.isArray(data)) {
-            throw new Error('[ElTable] data must be an array');
-          }
-          const { lazyTreeNodeMap, treeData } = this.states;
-          treeData[key].loading = false;
-          treeData[key].loaded = true;
-          treeData[key].expanded = true;
-          if (data.length) {
-            this.$set(lazyTreeNodeMap, key, data);
-          }
-          this.table.$emit('expand-change', row, true);
-        });
-      }
-    }
-  }
-};

package/src/packages/table/src/store/watcher.js

@@ -1,381 +0,0 @@
-import Vue from 'vue';
-import merge from 'element-ui/src/utils/merge';
-import { getKeysMap, getRowIdentity, getColumnById, getColumnByKey, orderBy, toggleRowStatus } from '../util';
-import expand from './expand';
-import current from './current';
-import tree from './tree';
-
-const sortData = (data, states) => {
-  const sortingColumn = states.sortingColumn;
-  if (!sortingColumn || typeof sortingColumn.sortable === 'string') {
-    return data;
-  }
-  return orderBy(data, states.sortProp, states.sortOrder, sortingColumn.sortMethod, sortingColumn.sortBy);
-};
-
-const doFlattenColumns = (columns) => {
-  const result = [];
-  columns.forEach((column) => {
-    if (column.children) {
-      result.push.apply(result, doFlattenColumns(column.children));
-    } else {
-      result.push(column);
-    }
-  });
-  return result;
-};
-
-export default Vue.extend({
-  data() {
-    return {
-      states: {
-        // 3.0 版本后要求必须设置该属性
-        rowKey: null,
-
-        // 渲染的数据来源，是对 table 中的 data 过滤排序后的结果
-        data: [],
-
-        // 是否包含固定列
-        isComplex: false,
-
-        // 列
-        _columns: [], // 不可响应的
-        originColumns: [],
-        columns: [],
-        fixedColumns: [],
-        rightFixedColumns: [],
-        leafColumns: [],
-        fixedLeafColumns: [],
-        rightFixedLeafColumns: [],
-        leafColumnsLength: 0,
-        fixedLeafColumnsLength: 0,
-        rightFixedLeafColumnsLength: 0,
-
-        // 选择
-        isAllSelected: false,
-        selection: [],
-        reserveSelection: false,
-        selectOnIndeterminate: false,
-        selectable: null,
-
-        // 过滤
-        filters: {}, // 不可响应的
-        filteredData: null,
-
-        // 排序
-        sortingColumn: null,
-        sortProp: null,
-        sortOrder: null,
-
-        hoverRow: null
-      }
-    };
-  },
-
-  mixins: [expand, current, tree],
-
-  methods: {
-    // 检查 rowKey 是否存在
-    assertRowKey() {
-      const rowKey = this.states.rowKey;
-      if (!rowKey) throw new Error('[ElTable] prop row-key is required');
-    },
-
-    // 更新列
-    updateColumns() {
-      const states = this.states;
-      const _columns = states._columns || [];
-      states.fixedColumns = _columns.filter((column) => column.fixed === true || column.fixed === 'left');
-      states.rightFixedColumns = _columns.filter((column) => column.fixed === 'right');
-
-      if (states.fixedColumns.length > 0 && _columns[0] && _columns[0].type === 'selection' && !_columns[0].fixed) {
-        _columns[0].fixed = true;
-        states.fixedColumns.unshift(_columns[0]);
-      }
-
-      const notFixedColumns = _columns.filter(column => !column.fixed);
-      states.originColumns = [].concat(states.fixedColumns).concat(notFixedColumns).concat(states.rightFixedColumns);
-
-      const leafColumns = doFlattenColumns(notFixedColumns);
-      const fixedLeafColumns = doFlattenColumns(states.fixedColumns);
-      const rightFixedLeafColumns = doFlattenColumns(states.rightFixedColumns);
-
-      states.leafColumnsLength = leafColumns.length;
-      states.fixedLeafColumnsLength = fixedLeafColumns.length;
-      states.rightFixedLeafColumnsLength = rightFixedLeafColumns.length;
-
-      states.columns = [].concat(fixedLeafColumns).concat(leafColumns).concat(rightFixedLeafColumns);
-      states.isComplex = states.fixedColumns.length > 0 || states.rightFixedColumns.length > 0;
-    },
-
-    // 更新 DOM
-    scheduleLayout(needUpdateColumns) {
-      if (needUpdateColumns) {
-        this.updateColumns();
-      }
-      this.table.debouncedUpdateLayout();
-    },
-
-    // 选择
-    isSelected(row) {
-      const { selection = [] } = this.states;
-      return selection.indexOf(row) > -1;
-    },
-
-    clearSelection() {
-      const states = this.states;
-      states.isAllSelected = false;
-      const oldSelection = states.selection;
-      if (oldSelection.length) {
-        states.selection = [];
-        this.table.$emit('selection-change', []);
-      }
-    },
-
-    cleanSelection() {
-      const states = this.states;
-      const { data, rowKey, selection } = states;
-      let deleted;
-      if (rowKey) {
-        deleted = [];
-        const selectedMap = getKeysMap(selection, rowKey);
-        const dataMap = getKeysMap(data, rowKey);
-        for (let key in selectedMap) {
-          if (selectedMap.hasOwnProperty(key) && !dataMap[key]) {
-            deleted.push(selectedMap[key].row);
-          }
-        }
-      } else {
-        deleted = selection.filter(item => data.indexOf(item) === -1);
-      }
-      if (deleted.length) {
-        const newSelection = selection.filter(item => deleted.indexOf(item) === -1);
-        states.selection = newSelection;
-        this.table.$emit('selection-change', newSelection.slice());
-      }
-    },
-
-    toggleRowSelection(row, selected, emitChange = true) {
-      const changed = toggleRowStatus(this.states.selection, row, selected);
-      if (changed) {
-        const newSelection = (this.states.selection || []).slice();
-        // 调用 API 修改选中值，不触发 select 事件
-        if (emitChange) {
-          this.table.$emit('select', newSelection, row);
-        }
-        this.table.$emit('selection-change', newSelection);
-      }
-    },
-
-    _toggleAllSelection() {
-      const states = this.states;
-      const { data = [], selection } = states;
-      // when only some rows are selected (but not all), select or deselect all of them
-      // depending on the value of selectOnIndeterminate
-      const value = states.selectOnIndeterminate
-        ? !states.isAllSelected
-        : !(states.isAllSelected || selection.length);
-      states.isAllSelected = value;
-
-      let selectionChanged = false;
-      data.forEach((row, index) => {
-        if (states.selectable) {
-          if (states.selectable.call(null, row, index) && toggleRowStatus(selection, row, value)) {
-            selectionChanged = true;
-          }
-        } else {
-          if (toggleRowStatus(selection, row, value)) {
-            selectionChanged = true;
-          }
-        }
-      });
-
-      if (selectionChanged) {
-        this.table.$emit('selection-change', selection ? selection.slice() : []);
-      }
-      this.table.$emit('select-all', selection);
-    },
-
-    updateSelectionByRowKey() {
-      const states = this.states;
-      const { selection, rowKey, data } = states;
-      const selectedMap = getKeysMap(selection, rowKey);
-      data.forEach(row => {
-        const rowId = getRowIdentity(row, rowKey);
-        const rowInfo = selectedMap[rowId];
-        if (rowInfo) {
-          selection[rowInfo.index] = row;
-        }
-      });
-    },
-
-    updateAllSelected() {
-      const states = this.states;
-      const { selection, rowKey, selectable } = states;
-      // data 为 null 时，解构时的默认值会被忽略
-      const data = states.data || [];
-      if (data.length === 0) {
-        states.isAllSelected = false;
-        return;
-      }
-
-      let selectedMap;
-      if (rowKey) {
-        selectedMap = getKeysMap(selection, rowKey);
-      }
-      const isSelected = function(row) {
-        if (selectedMap) {
-          return !!selectedMap[getRowIdentity(row, rowKey)];
-        } else {
-          return selection.indexOf(row) !== -1;
-        }
-      };
-      let isAllSelected = true;
-      let selectedCount = 0;
-      for (let i = 0, j = data.length; i < j; i++) {
-        const item = data[i];
-        const isRowSelectable = selectable && selectable.call(null, item, i);
-        if (!isSelected(item)) {
-          if (!selectable || isRowSelectable) {
-            isAllSelected = false;
-            break;
-          }
-        } else {
-          selectedCount++;
-        }
-      }
-
-      if (selectedCount === 0) isAllSelected = false;
-      states.isAllSelected = isAllSelected;
-    },
-
-    // 过滤与排序
-    updateFilters(columns, values) {
-      if (!Array.isArray(columns)) {
-        columns = [columns];
-      }
-      const states = this.states;
-      const filters = {};
-      columns.forEach(col => {
-        states.filters[col.id] = values;
-        filters[col.columnKey || col.id] = values;
-      });
-
-      return filters;
-    },
-
-    updateSort(column, prop, order) {
-      if (this.states.sortingColumn && this.states.sortingColumn !== column) {
-        this.states.sortingColumn.order = null;
-      }
-      this.states.sortingColumn = column;
-      this.states.sortProp = prop;
-      this.states.sortOrder = order;
-    },
-
-    execFilter() {
-      const states = this.states;
-      const { _data, filters } = states;
-      let data = _data;
-
-      Object.keys(filters).forEach((columnId) => {
-        const values = states.filters[columnId];
-        if (!values || values.length === 0) return;
-        const column = getColumnById(this.states, columnId);
-        if (column && column.filterMethod) {
-          data = data.filter((row) => {
-            return values.some(value => column.filterMethod.call(null, value, row, column));
-          });
-        }
-      });
-
-      states.filteredData = data;
-    },
-
-    execSort() {
-      const states = this.states;
-      states.data = sortData(states.filteredData, states);
-    },
-
-    // 根据 filters 与 sort 去过滤 data
-    execQuery(ignore) {
-      if (!(ignore && ignore.filter)) {
-        this.execFilter();
-      }
-      this.execSort();
-    },
-
-    clearFilter(columnKeys) {
-      const states = this.states;
-      const { tableHeader, fixedTableHeader, rightFixedTableHeader } = this.table.$refs;
-
-      let panels = {};
-      if (tableHeader) panels = merge(panels, tableHeader.filterPanels);
-      if (fixedTableHeader) panels = merge(panels, fixedTableHeader.filterPanels);
-      if (rightFixedTableHeader) panels = merge(panels, rightFixedTableHeader.filterPanels);
-
-      const keys = Object.keys(panels);
-      if (!keys.length) return;
-
-      if (typeof columnKeys === 'string') {
-        columnKeys = [columnKeys];
-      }
-
-      if (Array.isArray(columnKeys)) {
-        const columns = columnKeys.map(key => getColumnByKey(states, key));
-        keys.forEach(key => {
-          const column = columns.find(col => col.id === key);
-          if (column) {
-            // TODO: 优化这里的代码
-            panels[key].filteredValue = [];
-          }
-        });
-        this.commit('filterChange', {
-          column: columns,
-          values: [],
-          silent: true,
-          multi: true
-        });
-      } else {
-        keys.forEach(key => {
-          // TODO: 优化这里的代码
-          panels[key].filteredValue = [];
-        });
-
-        states.filters = {};
-        this.commit('filterChange', {
-          column: {},
-          values: [],
-          silent: true
-        });
-      }
-    },
-
-    clearSort() {
-      const states = this.states;
-      if (!states.sortingColumn) return;
-
-      this.updateSort(null, null, null);
-      this.commit('changeSortCondition', {
-        silent: true
-      });
-    },
-
-    // 适配层，expand-row-keys 在 Expand 与 TreeTable 中都有使用
-    setExpandRowKeysAdapter(val) {
-      // 这里会触发额外的计算，但为了兼容性，暂时这么做
-      this.setExpandRowKeys(val);
-      this.updateTreeExpandKeys(val);
-    },
-
-    // 展开行与 TreeTable 都要使用
-    toggleRowExpansionAdapter(row, expanded) {
-      const hasExpandColumn = this.states.columns.some(({ type }) => type === 'expand');
-      if (hasExpandColumn) {
-        this.toggleRowExpansion(row, expanded);
-      } else {
-        this.toggleTreeExpansion(row, expanded);
-      }
-    }
-  }
-});