cbvirtua 1.0.56 → 1.0.58

package/src/packages/table/src/filter-panel.vue

@@ -1,194 +0,0 @@
-<template>
-  <transition name="el-zoom-in-top">
-    <div
-      class="el-table-filter"
-      v-if="multiple"
-      v-clickoutside="handleOutsideClick"
-      v-show="showPopper">
-      <div class="el-table-filter__content">
-        <el-scrollbar wrap-class="el-table-filter__wrap">
-          <el-checkbox-group class="el-table-filter__checkbox-group" v-model="filteredValue">
-            <el-checkbox
-              v-for="filter in filters"
-              :key="filter.value"
-              :label="filter.value">{{ filter.text }}</el-checkbox>
-          </el-checkbox-group>
-        </el-scrollbar>
-      </div>
-      <div class="el-table-filter__bottom">
-        <button @click="handleConfirm"
-          :class="{ 'is-disabled': filteredValue.length === 0 }"
-          :disabled="filteredValue.length === 0">{{ t('el.table.confirmFilter') }}</button>
-        <button @click="handleReset">{{ t('el.table.resetFilter') }}</button>
-      </div>
-    </div>
-    <div
-      class="el-table-filter"
-      v-else
-      v-clickoutside="handleOutsideClick"
-      v-show="showPopper">
-      <ul class="el-table-filter__list">
-        <li class="el-table-filter__list-item"
-            :class="{ 'is-active': filterValue === undefined || filterValue === null }"
-            @click="handleSelect(null)">{{ t('el.table.clearFilter') }}</li>
-        <li class="el-table-filter__list-item"
-            v-for="filter in filters"
-            :label="filter.value"
-            :key="filter.value"
-            :class="{ 'is-active': isActive(filter) }"
-            @click="handleSelect(filter.value)" >{{ filter.text }}</li>
-      </ul>
-    </div>
-  </transition>
-</template>
-
-<script type="text/babel">
-  import Popper from 'element-ui/src/utils/vue-popper';
-  import { PopupManager } from 'element-ui/src/utils/popup';
-  import Locale from 'element-ui/src/mixins/locale';
-  import Clickoutside from 'element-ui/src/utils/clickoutside';
-  import Dropdown from './dropdown';
-  import ElCheckbox from 'element-ui/packages/checkbox';
-  import ElCheckboxGroup from 'element-ui/packages/checkbox-group';
-  import ElScrollbar from 'element-ui/packages/scrollbar';
-
-  export default {
-    name: 'ElTableFilterPanel',
-
-    mixins: [Popper, Locale],
-
-    directives: {
-      Clickoutside
-    },
-
-    components: {
-      ElCheckbox,
-      ElCheckboxGroup,
-      ElScrollbar
-    },
-
-    props: {
-      placement: {
-        type: String,
-        default: 'bottom-end'
-      }
-    },
-
-    methods: {
-      isActive(filter) {
-        return filter.value === this.filterValue;
-      },
-
-      handleOutsideClick() {
-        setTimeout(() => {
-          this.showPopper = false;
-        }, 16);
-      },
-
-      handleConfirm() {
-        this.confirmFilter(this.filteredValue);
-        this.handleOutsideClick();
-      },
-
-      handleReset() {
-        this.filteredValue = [];
-        this.confirmFilter(this.filteredValue);
-        this.handleOutsideClick();
-      },
-
-      handleSelect(filterValue) {
-        this.filterValue = filterValue;
-
-        if ((typeof filterValue !== 'undefined') && (filterValue !== null)) {
-          this.confirmFilter(this.filteredValue);
-        } else {
-          this.confirmFilter([]);
-        }
-
-        this.handleOutsideClick();
-      },
-
-      confirmFilter(filteredValue) {
-        this.table.store.commit('filterChange', {
-          column: this.column,
-          values: filteredValue
-        });
-        this.table.store.updateAllSelected();
-      }
-    },
-
-    data() {
-      return {
-        table: null,
-        cell: null,
-        column: null
-      };
-    },
-
-    computed: {
-      filters() {
-        return this.column && this.column.filters;
-      },
-
-      filterValue: {
-        get() {
-          return (this.column.filteredValue || [])[0];
-        },
-        set(value) {
-          if (this.filteredValue) {
-            if ((typeof value !== 'undefined') && (value !== null)) {
-              this.filteredValue.splice(0, 1, value);
-            } else {
-              this.filteredValue.splice(0, 1);
-            }
-          }
-        }
-      },
-
-      filteredValue: {
-        get() {
-          if (this.column) {
-            return this.column.filteredValue || [];
-          }
-          return [];
-        },
-        set(value) {
-          if (this.column) {
-            this.column.filteredValue = value;
-          }
-        }
-      },
-
-      multiple() {
-        if (this.column) {
-          return this.column.filterMultiple;
-        }
-        return true;
-      }
-    },
-
-    mounted() {
-      this.popperElm = this.$el;
-      this.referenceElm = this.cell;
-      this.table.bodyWrapper.addEventListener('scroll', () => {
-        this.updatePopper();
-      });
-
-      this.$watch('showPopper', (value) => {
-        if (this.column) this.column.filterOpened = value;
-        if (value) {
-          Dropdown.open(this);
-        } else {
-          Dropdown.close(this);
-        }
-      });
-    },
-    watch: {
-      showPopper(val) {
-        if (val === true && parseInt(this.popperJS._popper.style.zIndex, 10) < PopupManager.zIndex) {
-          this.popperJS._popper.style.zIndex = PopupManager.nextZIndex();
-        }
-      }
-    }
-  };
-</script>

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

@@ -1,68 +0,0 @@
-export default {
-  created() {
-    this.tableLayout.addObserver(this);
-  },
-
-  destroyed() {
-    this.tableLayout.removeObserver(this);
-  },
-
-  computed: {
-    tableLayout() {
-      let layout = this.layout;
-      if (!layout && this.table) {
-        layout = this.table.layout;
-      }
-      if (!layout) {
-        throw new Error('Can not find table layout.');
-      }
-      return layout;
-    }
-  },
-
-  mounted() {
-    this.onColumnsChange(this.tableLayout);
-    this.onScrollableChange(this.tableLayout);
-  },
-
-  updated() {
-    if (this.__updated__) return;
-    this.onColumnsChange(this.tableLayout);
-    this.onScrollableChange(this.tableLayout);
-    this.__updated__ = true;
-  },
-
-  methods: {
-    onColumnsChange(layout) {
-      const cols = this.$el.querySelectorAll('colgroup > col');
-      if (!cols.length) return;
-      const flattenColumns = layout.getFlattenColumns();
-      const columnsMap = {};
-      flattenColumns.forEach((column) => {
-        columnsMap[column.id] = column;
-      });
-      for (let i = 0, j = cols.length; i < j; i++) {
-        const col = cols[i];
-        const name = col.getAttribute('name');
-        const column = columnsMap[name];
-        if (column) {
-          col.setAttribute('width', column.realWidth || column.width);
-        }
-      }
-    },
-
-    onScrollableChange(layout) {
-      const cols = this.$el.querySelectorAll('colgroup > col[name=gutter]');
-      for (let i = 0, j = cols.length; i < j; i++) {
-        const col = cols[i];
-        col.setAttribute('width', layout.scrollY ? layout.gutterWidth : '0');
-      }
-      const ths = this.$el.querySelectorAll('th.gutter');
-      for (let i = 0, j = ths.length; i < j; i++) {
-        const th = ths[i];
-        th.style.width = layout.scrollY ? layout.gutterWidth + 'px' : '0';
-        th.style.display = layout.scrollY ? '' : 'none';
-      }
-    }
-  }
-};

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

@@ -1,76 +0,0 @@
-import { arrayFind } from 'element-ui/src/utils/util';
-import { getRowIdentity } from '../util';
-
-export default {
-  data() {
-    return {
-      states: {
-        // 不可响应的，设置 currentRowKey 时，data 不一定存在，也许无法算出正确的 currentRow
-        // 把该值缓存一下，当用户点击修改 currentRow 时，把该值重置为 null
-        _currentRowKey: null,
-        currentRow: null
-      }
-    };
-  },
-
-  methods: {
-    setCurrentRowKey(key) {
-      this.assertRowKey();
-      this.states._currentRowKey = key;
-      this.setCurrentRowByKey(key);
-    },
-
-    restoreCurrentRowKey() {
-      this.states._currentRowKey = null;
-    },
-
-    setCurrentRowByKey(key) {
-      const { states } = this;
-      const { data = [], rowKey } = states;
-      let currentRow = null;
-      if (rowKey) {
-        currentRow = arrayFind(data, item => getRowIdentity(item, rowKey) === key);
-      }
-      states.currentRow = currentRow;
-    },
-
-    updateCurrentRow(currentRow) {
-      const { states, table } = this;
-      const oldCurrentRow = states.currentRow;
-      if (currentRow && currentRow !== oldCurrentRow) {
-        states.currentRow = currentRow;
-        table.$emit('current-change', currentRow, oldCurrentRow);
-        return;
-      }
-      if (!currentRow && oldCurrentRow) {
-        states.currentRow = null;
-        table.$emit('current-change', null, oldCurrentRow);
-      }
-    },
-
-    updateCurrentRowData() {
-      const { states, table } = this;
-      const { rowKey, _currentRowKey } = states;
-      // data 为 null 时，解构时的默认值会被忽略
-      const data = states.data || [];
-      const oldCurrentRow = states.currentRow;
-
-      // 当 currentRow 不在 data 中时尝试更新数据
-      if (data.indexOf(oldCurrentRow) === -1 && oldCurrentRow) {
-        if (rowKey) {
-          const currentRowKey = getRowIdentity(oldCurrentRow, rowKey);
-          this.setCurrentRowByKey(currentRowKey);
-        } else {
-          states.currentRow = null;
-        }
-        if (states.currentRow === null) {
-          table.$emit('current-change', null, oldCurrentRow);
-        }
-      } else if (_currentRowKey) {
-        // 把初始时下设置的 rowKey 转化成 rowData
-        this.setCurrentRowByKey(_currentRowKey);
-        this.restoreCurrentRowKey();
-      }
-    }
-  }
-};

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

@@ -1,65 +0,0 @@
-import { toggleRowStatus, getKeysMap, getRowIdentity } from '../util';
-
-export default {
-  data() {
-    return {
-      states: {
-        defaultExpandAll: false,
-        expandRows: []
-      }
-    };
-  },
-
-  methods: {
-    updateExpandRows() {
-      const { data = [], rowKey, defaultExpandAll, expandRows } = this.states;
-      if (defaultExpandAll) {
-        this.states.expandRows = data.slice();
-      } else if (rowKey) {
-        // TODO：这里的代码可以优化
-        const expandRowsMap = getKeysMap(expandRows, rowKey);
-        this.states.expandRows = data.reduce((prev, row) => {
-          const rowId = getRowIdentity(row, rowKey);
-          const rowInfo = expandRowsMap[rowId];
-          if (rowInfo) {
-            prev.push(row);
-          }
-          return prev;
-        }, []);
-      } else {
-        this.states.expandRows = [];
-      }
-    },
-
-    toggleRowExpansion(row, expanded) {
-      const changed = toggleRowStatus(this.states.expandRows, row, expanded);
-      if (changed) {
-        this.table.$emit('expand-change', row, this.states.expandRows.slice());
-        this.scheduleLayout();
-      }
-    },
-
-    setExpandRowKeys(rowKeys) {
-      this.assertRowKey();
-      // TODO：这里的代码可以优化
-      const { data, rowKey } = this.states;
-      const keysMap = getKeysMap(data, rowKey);
-      this.states.expandRows = rowKeys.reduce((prev, cur) => {
-        const info = keysMap[cur];
-        if (info) {
-          prev.push(info.row);
-        }
-        return prev;
-      }, []);
-    },
-
-    isRowExpanded(row) {
-      const { expandRows = [], rowKey } = this.states;
-      if (rowKey) {
-        const expandMap = getKeysMap(expandRows, rowKey);
-        return !!expandMap[getRowIdentity(row, rowKey)];
-      }
-      return expandRows.indexOf(row) !== -1;
-    }
-  }
-};

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

@@ -1,41 +0,0 @@
-import Store from './index';
-import debounce from 'throttle-debounce/debounce';
-
-export function createStore(table, initialState = {}) {
-  if (!table) {
-    throw new Error('Table is required.');
-  }
-
-  const store = new Store();
-  store.table = table;
-  // fix https://github.com/ElemeFE/element/issues/14075
-  // related pr https://github.com/ElemeFE/element/pull/14146
-  store.toggleAllSelection = debounce(10, store._toggleAllSelection);
-  Object.keys(initialState).forEach(key => {
-    store.states[key] = initialState[key];
-  });
-  return store;
-}
-
-export function mapStates(mapper) {
-  const res = {};
-  Object.keys(mapper).forEach(key => {
-    const value = mapper[key];
-    let fn;
-    if (typeof value === 'string') {
-      fn = function() {
-        return this.store.states[value];
-      };
-    } else if (typeof value === 'function') {
-      fn = function() {
-        return value.call(this, this.store.states);
-      };
-    } else {
-      console.error('invalid value type');
-    }
-    if (fn) {
-      res[key] = fn;
-    }
-  });
-  return res;
-};

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

@@ -1,147 +0,0 @@
-import Vue from 'vue';
-import Watcher from './watcher';
-import { arrayFind } from 'element-ui/src/utils/util';
-
-Watcher.prototype.mutations = {
-  setData(states, data) {
-    const dataInstanceChanged = states._data !== data;
-    states._data = data;
-
-    this.execQuery();
-    // 数据变化，更新部分数据。
-    // 没有使用 computed，而是手动更新部分数据 https://github.com/vuejs/vue/issues/6660#issuecomment-331417140
-    this.updateCurrentRowData();
-    this.updateExpandRows();
-    if (states.reserveSelection) {
-      this.assertRowKey();
-      this.updateSelectionByRowKey();
-    } else {
-      if (dataInstanceChanged) {
-        this.clearSelection();
-      } else {
-        this.cleanSelection();
-      }
-    }
-    this.updateAllSelected();
-
-    this.updateTableScrollY();
-  },
-
-  insertColumn(states, column, index, parent) {
-    let array = states._columns;
-    if (parent) {
-      array = parent.children;
-      if (!array) array = parent.children = [];
-    }
-
-    if (typeof index !== 'undefined') {
-      array.splice(index, 0, column);
-    } else {
-      array.push(column);
-    }
-
-    if (column.type === 'selection') {
-      states.selectable = column.selectable;
-      states.reserveSelection = column.reserveSelection;
-    }
-
-    if (this.table.$ready) {
-      this.updateColumns(); // hack for dynamics insert column
-      this.scheduleLayout();
-    }
-  },
-
-  removeColumn(states, column, parent) {
-    let array = states._columns;
-    if (parent) {
-      array = parent.children;
-      if (!array) array = parent.children = [];
-    }
-    if (array) {
-      array.splice(array.indexOf(column), 1);
-    }
-
-    if (this.table.$ready) {
-      this.updateColumns(); // hack for dynamics remove column
-      this.scheduleLayout();
-    }
-  },
-
-  sort(states, options) {
-    const { prop, order, init } = options;
-    if (prop) {
-      const column = arrayFind(states.columns, column => column.property === prop);
-      if (column) {
-        column.order = order;
-        this.updateSort(column, prop, order);
-        this.commit('changeSortCondition', { init });
-      }
-    }
-  },
-
-  changeSortCondition(states, options) {
-    // 修复 pr https://github.com/ElemeFE/element/pull/15012 导致的 bug
-    const { sortingColumn: column, sortProp: prop, sortOrder: order } = states;
-    if (order === null) {
-      states.sortingColumn = null;
-      states.sortProp = null;
-    }
-    const ingore = { filter: true };
-    this.execQuery(ingore);
-
-    if (!options || !(options.silent || options.init)) {
-      this.table.$emit('sort-change', {
-        column,
-        prop,
-        order
-      });
-    }
-
-    this.updateTableScrollY();
-  },
-
-  filterChange(states, options) {
-    let { column, values, silent } = options;
-    const newFilters = this.updateFilters(column, values);
-
-    this.execQuery();
-
-    if (!silent) {
-      this.table.$emit('filter-change', newFilters);
-    }
-
-    this.updateTableScrollY();
-  },
-
-  toggleAllSelection() {
-    this.toggleAllSelection();
-  },
-
-  rowSelectedChanged(states, row) {
-    this.toggleRowSelection(row);
-    this.updateAllSelected();
-  },
-
-  setHoverRow(states, row) {
-    states.hoverRow = row;
-  },
-
-  setCurrentRow(states, row) {
-    this.updateCurrentRow(row);
-  }
-};
-
-Watcher.prototype.commit = function(name, ...args) {
-  const mutations = this.mutations;
-  if (mutations[name]) {
-    mutations[name].apply(this, [this.states].concat(args));
-  } else {
-    throw new Error(`Action not found: ${name}`);
-  }
-};
-
-Watcher.prototype.updateTableScrollY = function() {
-  Vue.nextTick(this.table.updateScrollY);
-};
-
-export default Watcher;