Skip to content

Commit 6a31a2f

Browse files
author
黄书伟
committed
优化
1 parent 5c3240e commit 6a31a2f

File tree

5 files changed

+170
-146
lines changed

5 files changed

+170
-146
lines changed

libs/v-table/src/scroll-bar-control-mixin.js

Lines changed: 17 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,22 @@
33
Object.defineProperty(exports, "__esModule", {
44
value: true
55
});
6+
7+
var _utils = require('../../src/utils/utils.js');
8+
9+
var _utils2 = _interopRequireDefault(_utils);
10+
11+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
12+
613
exports.default = {
14+
data: function data() {
15+
16+
return {
17+
18+
scrollbarWidth: 0
19+
};
20+
},
21+
722

823
methods: {
924
controlScrollBar: function controlScrollBar() {
@@ -14,17 +29,9 @@ exports.default = {
1429
body.style.overflowX = 'hidden';
1530
}
1631
},
17-
hasBodyHorizontalScrollBar: function hasBodyHorizontalScrollBar() {
18-
19-
if (this.$el) {
20-
21-
var rightViewBody = this.$el.querySelector('.v-table-rightview .v-table-body'),
22-
rightColumnsWidth = Math.round(this.totalNoFrozenColumnsWidth);
23-
24-
return rightViewBody.clientWidth + 2 < rightColumnsWidth;
25-
}
32+
setScrollbarWidth: function setScrollbarWidth() {
2633

27-
return false;
34+
this.scrollbarWidth = _utils2.default.getScrollbarWidth();
2835
}
2936
}
3037

Lines changed: 78 additions & 90 deletions
Original file line numberDiff line numberDiff line change
@@ -1,137 +1,125 @@
11
'use strict';
22

33
Object.defineProperty(exports, "__esModule", {
4-
value: true
4+
value: true
55
});
66

77
var _deepClone = require('../../src/utils/deepClone.js');
88

99
var _deepClone2 = _interopRequireDefault(_deepClone);
1010

11-
var _utils = require('../../src/utils/utils.js');
12-
13-
var _utils2 = _interopRequireDefault(_utils);
14-
1511
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
1612

1713
exports.default = {
14+
data: function data() {
1815

19-
computed: {
20-
frozenFooterCols: function frozenFooterCols() {
21-
22-
var result = [];
23-
24-
if (this.initInternalFooter.length > 0) {
25-
26-
this.initInternalFooter.forEach(function (columns) {
27-
28-
result.push(columns.filter(function (col) {
29-
return col.isFrozen;
30-
}));
31-
});
32-
}
16+
return {
3317

34-
return result;
35-
},
36-
noFrozenFooterCols: function noFrozenFooterCols() {
37-
var result = [];
18+
footerTotalHeight: 0
19+
};
20+
},
3821

39-
if (this.initInternalFooter.length > 0) {
22+
computed: {
23+
frozenFooterCols: function frozenFooterCols() {
4024

41-
this.initInternalFooter.forEach(function (columns) {
25+
var result = [];
4226

43-
result.push(columns.filter(function (col) {
44-
return !col.isFrozen;
45-
}));
46-
});
47-
}
27+
if (this.initInternalFooter.length > 0) {
4828

49-
return result;
50-
},
51-
getFooterTotalRowHeight: function getFooterTotalRowHeight() {
29+
this.initInternalFooter.forEach(function (columns) {
5230

53-
if (Array.isArray(this.footer) && this.footer.length > 0) {
31+
result.push(columns.filter(function (col) {
32+
return col.isFrozen;
33+
}));
34+
});
35+
}
5436

55-
return this.footer.length * this.footerRowHeight;
56-
}
57-
return 0;
58-
},
59-
getFooterContainerHeight: function getFooterContainerHeight() {
37+
return result;
38+
},
39+
noFrozenFooterCols: function noFrozenFooterCols() {
40+
var result = [];
6041

61-
var result = 0;
62-
if (this.getFooterTotalRowHeight > 0) {
42+
if (this.initInternalFooter.length > 0) {
6343

64-
result = this.getFooterTotalRowHeight;
44+
this.initInternalFooter.forEach(function (columns) {
6545

66-
if (this.hasBodyHorizontalScrollBar()) {
46+
result.push(columns.filter(function (col) {
47+
return !col.isFrozen;
48+
}));
49+
});
50+
}
6751

68-
result += _utils2.default.getScrollbarWidth();
69-
}
70-
}
52+
return result;
53+
},
54+
getFooterTotalRowHeight: function getFooterTotalRowHeight() {
7155

72-
return result;
73-
},
74-
hasTableFooter: function hasTableFooter() {
56+
if (Array.isArray(this.footer) && this.footer.length > 0) {
7557

76-
return Array.isArray(this.footer) && this.footer.length;
77-
},
78-
initInternalFooter: function initInternalFooter() {
58+
return this.footer.length * this.footerRowHeight;
59+
}
60+
return 0;
61+
},
62+
hasTableFooter: function hasTableFooter() {
7963

80-
if (!(Array.isArray(this.footer) && this.footer.length > 0)) {
64+
return Array.isArray(this.footer) && this.footer.length;
65+
},
66+
initInternalFooter: function initInternalFooter() {
8167

82-
return [];
83-
}
68+
if (!(Array.isArray(this.footer) && this.footer.length > 0)) {
8469

85-
var result = [],
86-
resultRow = [],
87-
cloneInternalColumns;
70+
return [];
71+
}
8872

89-
cloneInternalColumns = (0, _deepClone2.default)(this.internalColumns);
73+
var result = [],
74+
resultRow = [],
75+
cloneInternalColumns;
9076

91-
cloneInternalColumns.sort(function (a, b) {
77+
cloneInternalColumns = (0, _deepClone2.default)(this.internalColumns);
9278

93-
if (a.isFrozen) {
79+
cloneInternalColumns.sort(function (a, b) {
9480

95-
return -1;
96-
} else if (b.isFrozen) {
81+
if (a.isFrozen) {
9782

98-
return 1;
99-
}
100-
return 0;
101-
});
83+
return -1;
84+
} else if (b.isFrozen) {
10285

103-
this.footer.forEach(function (items, rows) {
86+
return 1;
87+
}
88+
return 0;
89+
});
10490

105-
resultRow = [];
91+
this.footer.forEach(function (items, rows) {
10692

107-
items.forEach(function (value, index) {
93+
resultRow = [];
10894

109-
resultRow.push({
110-
content: value,
111-
width: cloneInternalColumns[index].width,
112-
align: cloneInternalColumns[index].columnAlign,
113-
isFrozen: cloneInternalColumns[index].isFrozen ? true : false
114-
});
115-
});
95+
items.forEach(function (value, index) {
11696

117-
result.push(resultRow);
118-
});
119-
return result;
120-
}
121-
},
97+
resultRow.push({
98+
content: value,
99+
width: cloneInternalColumns[index].width,
100+
align: cloneInternalColumns[index].columnAlign,
101+
isFrozen: cloneInternalColumns[index].isFrozen ? true : false
102+
});
103+
});
122104

123-
methods: {
124-
setFooterCellClassName: function setFooterCellClassName(isLeftView, rowIndex, colIndex, value) {
105+
result.push(resultRow);
106+
});
107+
return result;
108+
}
109+
},
125110

126-
var _colIndex = colIndex;
111+
methods: {
112+
setFooterCellClassName: function setFooterCellClassName(isLeftView, rowIndex, colIndex, value) {
127113

128-
if (!isLeftView && this.hasFrozenColumn) {
114+
var _colIndex = colIndex;
129115

130-
_colIndex += this.frozenCols.length;
131-
}
116+
if (!isLeftView && this.hasFrozenColumn) {
132117

133-
return this.footerCellClassName && this.footerCellClassName(rowIndex, _colIndex, value);
134-
}
118+
_colIndex += this.frozenCols.length;
135119
}
136120

121+
return this.footerCellClassName && this.footerCellClassName(rowIndex, _colIndex, value);
122+
}
123+
}
124+
137125
};

libs/v-table/src/table-resize-mixin.js

Lines changed: 57 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -38,30 +38,49 @@ exports.default = {
3838
this.initTotalColumnsWidth = this.totalColumnsWidth;
3939
this.getResizeColumns();
4040
},
41-
adjustHeight: function adjustHeight() {
42-
var _this = this;
41+
adjustHeight: function adjustHeight(hasScrollBar) {
4342

44-
setTimeout(function (x) {
43+
if (!this.$el || this.isVerticalResize) {
44+
return false;
45+
}
4546

46-
if (!_this.$el || _this.isVerticalResize) {
47-
return false;
48-
}
47+
var totalColumnsHeight = this.getTotalColumnsHeight(),
48+
scrollbarWidth = this.scrollbarWidth;
49+
50+
if (this.hasTableFooter) {
51+
52+
if (hasScrollBar) {
53+
54+
if (this.footerTotalHeight === this.getFooterTotalRowHeight) {
4955

50-
var totalColumnsHeight = _this.getTotalColumnsHeight(),
51-
scrollbarWidth = _utils2.default.getScrollbarWidth(),
52-
hasScrollBar = _this.hasBodyHorizontalScrollBar();
56+
this.footerTotalHeight += scrollbarWidth;
5357

54-
if (!(_this.height && _this.height > 0) || _this.height > totalColumnsHeight) {
58+
if (!(this.height && this.height > 0) || this.height > totalColumnsHeight) {
59+
this.internalHeight += scrollbarWidth;
60+
}
61+
}
62+
} else if (!hasScrollBar) {
63+
64+
if (this.footerTotalHeight > this.getFooterTotalRowHeight) {
65+
66+
this.footerTotalHeight -= scrollbarWidth;
67+
68+
if (!(this.height && this.height > 0) || this.height > totalColumnsHeight) {
69+
70+
this.internalHeight -= scrollbarWidth;
71+
}
72+
}
73+
}
74+
} else if (!(this.height && this.height > 0) || this.height > totalColumnsHeight) {
5575

56-
if (hasScrollBar && _this.internalHeight + 2 < totalColumnsHeight + scrollbarWidth) {
76+
if (hasScrollBar && this.internalHeight + 2 < totalColumnsHeight + scrollbarWidth) {
5777

58-
_this.internalHeight += scrollbarWidth;
78+
this.internalHeight += scrollbarWidth;
5979
} else if (!hasScrollBar) {
6080

61-
_this.internalHeight = totalColumnsHeight;
81+
this.internalHeight = this.getTotalColumnsHeight();
6282
}
6383
}
64-
});
6584
},
6685
tableResize: function tableResize() {
6786

@@ -92,20 +111,18 @@ exports.default = {
92111
}
93112

94113
if (self.isHorizontalResize && self.internalWidth && self.internalWidth > 0 && currentWidth > 0) {
114+
if (right <= 0 && currentWidth > minWidth || right >= 0 && currentWidth < maxWidth) {
95115

96-
var newTableWidth = this.$el.clientWidth;
97-
98-
if (right <= 0 && newTableWidth > minWidth || right >= 0 && newTableWidth < maxWidth) {
116+
currentWidth = currentWidth > maxWidth ? maxWidth : currentWidth;
117+
currentWidth = currentWidth < minWidth ? minWidth : currentWidth;
99118

100-
newTableWidth = newTableWidth > maxWidth ? maxWidth : newTableWidth;
101-
newTableWidth = newTableWidth < minWidth ? minWidth : newTableWidth;
102-
103-
self.internalWidth = newTableWidth;
104-
self.changeColumnsWidth(newTableWidth);
119+
self.internalWidth = currentWidth;
120+
self.changeColumnsWidth(currentWidth);
105121
}
106122
}
107123
},
108124
changeColumnsWidth: function changeColumnsWidth(currentWidth) {
125+
var _this = this;
109126

110127
var differ = currentWidth - this.totalColumnsWidth,
111128
initResizeWidths = this.initTotalColumnsWidth,
@@ -121,10 +138,12 @@ exports.default = {
121138

122139
rightViewBody.style.overflowX = 'scroll';
123140
}
141+
142+
this.adjustHeight(true);
124143
} else {
125144
if (this.getTotalColumnsHeight() > this.internalHeight) {
126145

127-
differ -= _utils2.default.getScrollbarWidth();
146+
differ -= this.scrollbarWidth;
128147
}
129148

130149
if (this.hasTableFooter) {
@@ -134,9 +153,14 @@ exports.default = {
134153

135154
rightViewBody.style.overflowX = 'hidden';
136155
}
156+
157+
this.adjustHeight(false);
137158
}
138159

139-
this.adjustHeight();
160+
if (this.hasFrozenColumn) {
161+
162+
differ -= 2;
163+
}
140164

141165
if (currentWidth >= initResizeWidths || differ > 0) {
142166

@@ -150,6 +174,15 @@ exports.default = {
150174

151175
return item;
152176
});
177+
} else {
178+
179+
this.columns.forEach(function (col, index) {
180+
181+
if (col.isResize) {
182+
183+
_this.internalColumns[index].width = col.width;
184+
}
185+
});
153186
}
154187
}
155188
},

0 commit comments

Comments
 (0)