diff --git a/src/components/table/cell.vue b/src/components/table/cell.vue
index c2a61a2d..fa668920 100644
--- a/src/components/table/cell.vue
+++ b/src/components/table/cell.vue
@@ -19,7 +19,10 @@
naturalIndex: Number, // index of rebuildData
index: Number, // _index of data
checked: Boolean,
- fixed: Boolean
+ fixed: {
+ type: [Boolean, String],
+ default: false
+ }
},
data () {
return {
diff --git a/src/components/table/mixin.js b/src/components/table/mixin.js
index 189d1f3f..f477259e 100644
--- a/src/components/table/mixin.js
+++ b/src/components/table/mixin.js
@@ -1,7 +1,15 @@
export default {
methods: {
alignCls (column) {
- return column.align ? `${this.prefixCls}-column-${column.align}` : '';
+ return [
+ {
+ [`${this.prefixCls}-column-${column.align}`]: column.align,
+ [`${this.prefixCls}-hidden`]: (this.fixed === 'left' && column.fixed !== 'left') || (this.fixed === 'right' && column.fixed !== 'right') || (!this.fixed && column.fixed && (column.fixed === 'left' || column.fixed === 'right'))
+ }
+ ]
+ },
+ isPopperShow (column) {
+ return column.filters && ((!this.fixed && !column.fixed) || (this.fixed === 'left' && column.fixed === 'left') || (this.fixed === 'right' && column.fixed === 'right'));
}
}
}
\ No newline at end of file
diff --git a/src/components/table/table-body.vue b/src/components/table/table-body.vue
index bb1f6e72..df540458 100644
--- a/src/components/table/table-body.vue
+++ b/src/components/table/table-body.vue
@@ -37,7 +37,10 @@
columns: Array,
data: Array, // rebuildData
objData: Object,
- fixed: Boolean
+ fixed: {
+ type: [Boolean, String],
+ default: false
+ }
},
methods: {
rowClasses (_index) {
diff --git a/src/components/table/table-head.vue b/src/components/table/table-head.vue
index 5d26f58a..8c1e3f72 100644
--- a/src/components/table/table-head.vue
+++ b/src/components/table/table-head.vue
@@ -15,7 +15,7 @@
@@ -69,7 +69,10 @@
columns: Array,
objData: Object,
data: Array, // rebuildData
- fixed: Boolean
+ fixed: {
+ type: [Boolean, String],
+ default: false
+ }
},
computed: {
isSelectAll () {
diff --git a/src/components/table/table.vue b/src/components/table/table.vue
index 9ce296eb..4f0e4868 100644
--- a/src/components/table/table.vue
+++ b/src/components/table/table.vue
@@ -19,10 +19,10 @@
:data="rebuildData"
:obj-data="objData">
-
+
-
+
a + b);
+ let width = 0;
+ this.leftFixedColumns.forEach((col) => {
+ if (col.fixed && col.fixed === 'left') width += col.width;
+ });
+ style.width = `${width}px`;
return style;
},
fixedRightTableStyle () {
let style = {};
- if (this.rightFixedColumns.length) style.width = this.rightFixedColumns.reduce((a, b) => a + b);
+ let width = 0;
+ this.rightFixedColumns.forEach((col) => {
+ if (col.fixed && col.fixed === 'right') width += col.width;
+ });
+ style.width = `${width}px`;
return style;
},
bodyStyle () {
@@ -188,21 +196,27 @@
},
leftFixedColumns () {
let left = [];
+ let other = [];
this.cloneColumns.forEach((col) => {
if (col.fixed && col.fixed === 'left') {
left.push(col);
+ } else {
+ other.push(col);
}
});
- return left;
+ return left.concat(other);
},
rightFixedColumns () {
let right = [];
+ let other = [];
this.cloneColumns.forEach((col) => {
if (col.fixed && col.fixed === 'right') {
right.push(col);
+ } else {
+ other.push(col);
}
});
- return right;
+ return right.concat(other);
}
},
methods: {
@@ -457,6 +471,10 @@
} else {
column._filterMultiple = true;
}
+ if ('filteredValue' in column) {
+ column._filterChecked = column.filteredValue;
+ column._isFiltered = true;
+ }
if (column.fixed && column.fixed === 'left') {
left.push(column);
@@ -472,6 +490,7 @@
compiled () {
this.showSlotHeader = this.$els.title.innerHTML.replace(/\n/g, '').replace(//gmi, '') !== '';
this.showSlotFooter = this.$els.footer.innerHTML.replace(/\n/g, '').replace(//gmi, '') !== '';
+ this.rebuildData = this.makeDataWithSortAndFilter();
},
ready () {
this.handleResize();
diff --git a/src/styles/components/table.less b/src/styles/components/table.less
index 30378a64..bde0fa97 100644
--- a/src/styles/components/table.less
+++ b/src/styles/components/table.less
@@ -206,7 +206,6 @@
position: absolute;
top: 0;
left: 0;
- //box-shadow: @shadow-right;
box-shadow: 2px 0 6px -2px rgba(0, 0, 0, 0.2);
&::before {
@@ -224,13 +223,10 @@
top: 0;
left: auto;
right: 0;
- //box-shadow: @shadow-left;
box-shadow: -2px 0 6px -2px rgba(0, 0, 0, 0.2);
}
&-fixed-header{
overflow: hidden;
- //position: relative;
- //z-index: 3;
}
&-fixed-body{
overflow: hidden;
diff --git a/test/routers/table.vue b/test/routers/table.vue
index 981bb452..bbc6987e 100644
--- a/test/routers/table.vue
+++ b/test/routers/table.vue
@@ -8,7 +8,7 @@
${row.tag}`;
@@ -129,7 +130,7 @@
title: '地址',
key: 'address',
align: 'center',
-// fixed: 'right',
+// fixed: 'left',
width: 100,
// render (row, column, index) {
// if (row.edit) {
@@ -142,17 +143,35 @@
{
title: '操作',
key: 'action',
- fixed: 'right',
- width: 120,
+// fixed: 'right',
+ width: 250,
render (row, column, index) {
return `${row.name}${index}`;
- return `${row.name}`;
+// return `${row.name}`;
+ },
+ filters: [
+ {
+ label: '两个字',
+ value: 1
+ },
+ {
+ label: '三个字',
+ value: 2
+ }
+ ],
+ filterMultiple: false,
+ filterMethod (value, row) {
+ if (value === 1) {
+ return row.name.length == 2;
+ } else if (value === 2) {
+ return row.name.length == 3;
+ }
}
}
],
data: [
{
- name: '梁灏',
+ name: '梁灏梁灏梁灏梁灏梁灏梁灏梁灏',
age: 25,
address: '北京市朝阳区',
edit: false,