drip-public/iview
5
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed #3124

Browse source
This commit is contained in:
huanghong 2018-03-20 10:46:48 +08:00
parent 224a79e7ca
commit 8e171de8e0
2 changed files with 15 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

16
src/components/table/table.vue
View file

@ -23,12 +23,12 @@
:obj-data="objData"></table-body> :obj-data="objData"></table-body>
</div> </div>
<div <div
:class="[prefixCls + '-tip']" :class="[prefixCls + '-tip']" :style="bodyStyle" @scroll="handleBodyScroll"
v-show="((!!localeNoDataText && (!data || data.length === 0)) || (!!localeNoFilteredDataText && (!rebuildData || rebuildData.length === 0)))"> v-show="((!!localeNoDataText && (!data || data.length === 0)) || (!!localeNoFilteredDataText && (!rebuildData || rebuildData.length === 0)))">
<table cellspacing="0" cellpadding="0" border="0"> <table cellspacing="0" cellpadding="0" border="0">
<tbody> <tbody>
<tr> <tr>
<td :style="{ 'height': bodyStyle.height }"> <td :style="{'height':bodyStyle.height,'width':`${this.headerWidth}px`}">
<span v-html="localeNoDataText" v-if="!data || data.length === 0"></span> <span v-html="localeNoDataText" v-if="!data || data.length === 0"></span>
<span v-html="localeNoFilteredDataText" v-else></span> <span v-html="localeNoFilteredDataText" v-else></span>
</td> </td>
@ -188,6 +188,7 @@
currentContext: this.context, currentContext: this.context,
cloneData: deepCopy(this.data), // when Cell has a button to delete row data, clickCurrentRow will throw an error, so clone a data cloneData: deepCopy(this.data), // when Cell has a button to delete row data, clickCurrentRow will throw an error, so clone a data
showVerticalScrollBar:false, showVerticalScrollBar:false,
headerWidth:0
}; };
}, },
computed: { computed: {
@ -253,7 +254,7 @@
if (this.bodyHeight > this.bodyRealHeight) { if (this.bodyHeight > this.bodyRealHeight) {
width = this.tableWidth; width = this.tableWidth;
} else { } else {
width = this.tableWidth - this.scrollBarWidth; width = this.tableWidth - (this.showVerticalScrollBar?this.scrollBarWidth:0);
} }
} }
// const width = this.bodyHeight === 0 ? this.tableWidth : this.tableWidth - this.scrollBarWidth; // const width = this.bodyHeight === 0 ? this.tableWidth : this.tableWidth - this.scrollBarWidth;
@ -348,7 +349,12 @@
this.tableWidth = parseInt(getStyle(this.$el, 'width')) - 1; this.tableWidth = parseInt(getStyle(this.$el, 'width')) - 1;
} }
this.columnsWidth = {}; this.columnsWidth = {};
if (!this.$refs.tbody) return; this.fixedHeader();
this.headerWidth = this.$refs.header.childNodes[0].offsetWidth;
if (!this.$refs.tbody) {
this.showVerticalScrollBar = false;
return;
}
this.$nextTick(() => { this.$nextTick(() => {
let columnsWidth = {}; let columnsWidth = {};
let autoWidthIndex = -1; let autoWidthIndex = -1;
@ -358,7 +364,6 @@
const $tr = this.$refs.tbody.$el.querySelectorAll('tbody tr'); const $tr = this.$refs.tbody.$el.querySelectorAll('tbody tr');
if ($tr.length === 0) return; if ($tr.length === 0) return;
const $td = $tr[0].children; const $td = $tr[0].children;
for (let i = 0; i < $td.length; i++) { // can not use forEach in Firefox for (let i = 0; i < $td.length; i++) { // can not use forEach in Firefox
const column = this.cloneColumns[i]; const column = this.cloneColumns[i];
@ -375,7 +380,6 @@
}; };
} }
this.columnsWidth = columnsWidth; this.columnsWidth = columnsWidth;
this.fixedHeader();
if (this.$refs.tbody) { if (this.$refs.tbody) {
let bodyContentEl = this.$refs.tbody.$el; let bodyContentEl = this.$refs.tbody.$el;

5
src/styles/components/table.less
View file

@ -74,6 +74,11 @@
overflow: auto; overflow: auto;
//position: relative; //position: relative;
} }
&-tip{
overflow-x: auto;
overflow-y: hidden;
//position: relative;
}
&-with-fixed-top&-with-footer{ &-with-fixed-top&-with-footer{
.@{table-prefix-cls}-footer{ .@{table-prefix-cls}-footer{