Blame view

node_modules/element-ui/packages/table/src/layout-observer.js 1.82 KB
2a09d1a4   liuqimichale   添加宜春 天水 宣化
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
  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() {
        const cols = this.$el.querySelectorAll('colgroup > col');
        if (!cols.length) return;
        const flattenColumns = this.tableLayout.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';
        }
      }
    }
  };