other / mew-iview

Commit c1e965c37166cb3a9d0e8bd17124a2e66beaaf31

Authored by 梁灏
1 parent 3f14387d

fixed-head

Showing 4 changed files with 37 additions and 27 deletions   Show diff stats
Inline Side-by-side
examples/routers/table.vue
  Show/Hide comments   View file @c1e965c
... ... @@ -3,7 +3,7 @@
3 3 <br><br><br><br><br>
4 4 <Table border :columns="columns1" height="500" :data="data1"></Table>
5 5 <br><br><br><br><br>
6   - <!--<Table width="550" height="200" border :columns="columns2" :data="data4"></Table>-->
  6 + <Table width="550" height="200" border :columns="columns2" :data="data4"></Table>
7 7 <br><br><br><br><br>
8 8 </div>
9 9 </template>
... ... @@ -84,8 +84,7 @@
84 84 key: 'gender',
85 85 align: 'center',
86 86 width: 200,
87   - fixed: 'right',
88   - // fixed: 'left'
  87 + fixed: 'right'
89 88 }
90 89 ],
91 90 columns2: [
... ...
src/components/table/table-head.vue
  Show/Hide comments   View file @c1e965c
... ... @@ -87,7 +87,8 @@
87 87 type: [Boolean, String],
88 88 default: false
89 89 },
90   - columnRows: Array
  90 + columnRows: Array,
  91 + fixedColumnRows: Array
91 92 },
92 93 computed: {
93 94 styles () {
... ... @@ -116,7 +117,11 @@
116 117 },
117 118 headRows () {
118 119 const isGroup = this.columnRows.length > 1;
119   - return isGroup ? this.columnRows : [this.columns];
  120 + if (isGroup) {
  121 + return this.fixed ? this.fixedColumnRows : this.columnRows;
  122 + } else {
  123 + return [this.columns];
  124 + }
120 125 }
121 126 },
122 127 methods: {
... ...
src/components/table/table.vue
  Show/Hide comments   View file @c1e965c
... ... @@ -45,6 +45,7 @@
45 45 :styleObject="fixedTableStyle"
46 46 :columns="leftFixedColumns"
47 47 :column-rows="columnRows"
  48 + :fixed-column-rows="leftFixedColumnRows"
48 49 :obj-data="objData"
49 50 :columns-width="columnsWidth"
50 51 :data="rebuildData"></table-head>
... ... @@ -68,6 +69,7 @@
68 69 :styleObject="fixedRightTableStyle"
69 70 :columns="rightFixedColumns"
70 71 :column-rows="columnRows"
  72 + :fixed-column-rows="rightFixedColumnRows"
71 73 :obj-data="objData"
72 74 :columns-width="columnsWidth"
73 75 :data="rebuildData"></table-head>
... ... @@ -184,7 +186,9 @@
184 186 objData: this.makeObjData(), // checkbox or highlight-row
185 187 rebuildData: [], // for sort or filter
186 188 cloneColumns: this.makeColumns(),
187   - columnRows: this.makeColumnRows(),
  189 + columnRows: this.makeColumnRows(false),
  190 + leftFixedColumnRows: this.makeColumnRows('left'),
  191 + rightFixedColumnRows: this.makeColumnRows('right'),
188 192 allColumns: getAllColumns(this.columns), // for multiple table-head, get columns that have no children
189 193 showSlotHeader: true,
190 194 showSlotFooter: true,
... ... @@ -779,8 +783,8 @@
779 783 return left.concat(center).concat(right);
780 784 },
781 785 // create a multiple table-head
782   - makeColumnRows () {
783   - return convertToRows(this.columns);
  786 + makeColumnRows (fixedType) {
  787 + return convertToRows(this.columns, fixedType);
784 788 },
785 789 exportCsv (params) {
786 790 if (params.filename) {
... ... @@ -858,7 +862,9 @@
858 862 // todo 这里有性能问题，可能是左右固定计算属性影响的
859 863 this.allColumns = getAllColumns(this.columns);
860 864 this.cloneColumns = this.makeColumns();
861   - this.columnRows = this.makeColumnRows();
  865 + this.columnRows = this.makeColumnRows(false);
  866 + this.leftFixedColumnRows = this.makeColumnRows('left');
  867 + this.rightFixedColumnRows = this.makeColumnRows('right');
862 868 this.rebuildData = this.makeDataWithSortAndFilter();
863 869 this.handleResize();
864 870 },
... ...
src/components/table/util.js
  Show/Hide comments   View file @c1e965c
1 1 import { deepCopy } from '../../utils/assist';
2 2  
  3 +const convertColumnOrder = (columns, fixedType) => {
  4 + let list = [];
  5 + let other = [];
  6 + columns.forEach((col) => {
  7 + if (col.fixed && col.fixed === fixedType) {
  8 + list.push(col);
  9 + } else {
  10 + other.push(col);
  11 + }
  12 + });
  13 + return list.concat(other);
  14 +};
  15 +
  16 +export {convertColumnOrder};
  17 +
3 18 // set forTableHead to true when convertToRows, false in normal cases like table.vue
4 19 const getAllColumns = (cols, forTableHead = false) => {
5 20 const columns = deepCopy(cols);
... ... @@ -17,8 +32,8 @@ const getAllColumns = (cols, forTableHead = false) =&gt; {
17 32  
18 33 export {getAllColumns};
19 34  
20   -const convertToRows = (columns) => {
21   - const originColumns = deepCopy(columns);
  35 +const convertToRows = (columns, fixedType = false) => {
  36 + const originColumns = fixedType ? fixedType === 'left' ? deepCopy(convertColumnOrder(columns, 'left')) : deepCopy(convertColumnOrder(columns, 'right')) : deepCopy(columns);
22 37 let maxLevel = 1;
23 38 const traverse = (column, parent) => {
24 39 if (parent) {
... ... @@ -63,19 +78,4 @@ const convertToRows = (columns) =&gt; {
63 78 return rows;
64 79 };
65 80  
66   -export {convertToRows};
67   -
68   -const convertColumnOrder = (columns, FixedType) => {
69   - let list = [];
70   - let other = [];
71   - columns.forEach((col) => {
72   - if (col.fixed && col.fixed === FixedType) {
73   - list.push(col);
74   - } else {
75   - other.push(col);
76   - }
77   - });
78   - return list.concat(other);
79   -};
80   -
81   -export {convertColumnOrder};
82 81 \ No newline at end of file
  82 +export {convertToRows};
83 83 \ No newline at end of file
... ...