最后一列不需要拖拽
This commit is contained in:
parent
50b18576a7
commit
0f3db7e24c
|
@ -76,7 +76,9 @@ $icon-color:#505F79;
|
||||||
tr:last-child{
|
tr:last-child{
|
||||||
border-bottom: 1px solid $table-th-bottom-border;
|
border-bottom: 1px solid $table-th-bottom-border;
|
||||||
}
|
}
|
||||||
|
tr>th:last-child{
|
||||||
|
border-right: none;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
tr {
|
tr {
|
||||||
// transition: all 0.3s ease;
|
// transition: all 0.3s ease;
|
||||||
|
|
|
@ -152,6 +152,7 @@ class TableHeader extends Component {
|
||||||
table.table = tableDome;
|
table.table = tableDome;
|
||||||
table.cols = tableDome.getElementsByTagName("col");
|
table.cols = tableDome.getElementsByTagName("col");
|
||||||
table.ths = tableDome.getElementsByTagName("th");
|
table.ths = tableDome.getElementsByTagName("th");
|
||||||
|
table.tr = tableDome.getElementsByTagName("tr");
|
||||||
}
|
}
|
||||||
|
|
||||||
table.fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header') ;
|
table.fixedLeftHeaderTable = contentTable.querySelector('.u-table-fixed-left .u-table-header') ;
|
||||||
|
@ -289,6 +290,10 @@ class TableHeader extends Component {
|
||||||
*/
|
*/
|
||||||
onLineMouseUp = (event) => {
|
onLineMouseUp = (event) => {
|
||||||
let width = this.drag.newWidth;
|
let width = this.drag.newWidth;
|
||||||
|
// const newTableWidth = this.drag.tableWidth + diff +'px';
|
||||||
|
// this.table.table.style.width = newTableWidth;//同步table的width
|
||||||
|
// this.table.innerTableBody.style.width = newTableWidth ;//同步改变table body 的width
|
||||||
|
// console.log(" --onLineMouseUp--- ");
|
||||||
this.clearDragBorder(event);
|
this.clearDragBorder(event);
|
||||||
this.props.onDropBorder && this.props.onDropBorder(event,width);
|
this.props.onDropBorder && this.props.onDropBorder(event,width);
|
||||||
};
|
};
|
||||||
|
@ -300,7 +305,7 @@ class TableHeader extends Component {
|
||||||
this.clearDragBorder(event);
|
this.clearDragBorder(event);
|
||||||
};
|
};
|
||||||
|
|
||||||
clearDragBorder(){
|
clearDragBorder(){
|
||||||
if(!this.drag || !this.drag.option)return;
|
if(!this.drag || !this.drag.option)return;
|
||||||
let {rows} = this.props;
|
let {rows} = this.props;
|
||||||
let data = {rows:rows[0],cols:this.table.cols,currIndex:this.drag.currIndex};
|
let data = {rows:rows[0],cols:this.table.cols,currIndex:this.drag.currIndex};
|
||||||
|
@ -593,8 +598,9 @@ class TableHeader extends Component {
|
||||||
let attr = dragborder ? { id: `u-table-drag-thead-${this.theadKey}` } : {};
|
let attr = dragborder ? { id: `u-table-drag-thead-${this.theadKey}` } : {};
|
||||||
return (
|
return (
|
||||||
<thead className={`${clsPrefix}-thead`} {...attr} data-theader-fixed='scroll' ref={_thead=>this._thead = _thead} >
|
<thead className={`${clsPrefix}-thead`} {...attr} data-theader-fixed='scroll' ref={_thead=>this._thead = _thead} >
|
||||||
{rows.map((row, index) => (
|
{rows.map((row, index) => {
|
||||||
<tr key={index} style={rowStyle} className={(filterable && index == rows.length - 1)?'filterable':''}>
|
let _rowLeng = (row.length-1);
|
||||||
|
return(<tr key={index} style={rowStyle} className={(filterable && index == rows.length - 1)?'filterable':''}>
|
||||||
{row.map((da, columIndex, arr) => {
|
{row.map((da, columIndex, arr) => {
|
||||||
let thHover = da.drgHover
|
let thHover = da.drgHover
|
||||||
? ` ${clsPrefix}-thead th-drag-hover`
|
? ` ${clsPrefix}-thead th-drag-hover`
|
||||||
|
@ -642,11 +648,10 @@ class TableHeader extends Component {
|
||||||
thClassName += ` ${clsPrefix}-thead-th ${canDotDrag}`;
|
thClassName += ` ${clsPrefix}-thead-th ${canDotDrag}`;
|
||||||
}
|
}
|
||||||
thClassName += ` ${fixedStyle}`;
|
thClassName += ` ${fixedStyle}`;
|
||||||
|
if(!da.fixed && columIndex != _rowLeng){
|
||||||
if(!da.fixed){
|
|
||||||
|
|
||||||
return (<th {...da} {...keyTemp} className={thClassName} data-th-fixed={da.fixed}
|
return (<th {...da} {...keyTemp} className={thClassName} data-th-fixed={da.fixed}
|
||||||
data-line-key={da.key} data-line-index={columIndex} data-th-width={da.width} >
|
data-line-key={da.key} data-line-index={columIndex} data-th-width={da.width} data-row-leng="1111111111111" >
|
||||||
{da.children}
|
{da.children}
|
||||||
{
|
{
|
||||||
dragborder ? <div ref={el => (this.gap = el)} data-line-key={da.key}
|
dragborder ? <div ref={el => (this.gap = el)} data-line-key={da.key}
|
||||||
|
@ -665,7 +670,7 @@ class TableHeader extends Component {
|
||||||
}
|
}
|
||||||
})}
|
})}
|
||||||
</tr>
|
</tr>
|
||||||
))}
|
)})}
|
||||||
</thead>
|
</thead>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,5 @@
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import {compare,ObjectAssign} from './util';
|
import {compare,ObjectAssign} from './util';
|
||||||
let cloneDeep = require('lodash.clonedeep');
|
|
||||||
/**
|
/**
|
||||||
* 参数: 列拖拽
|
* 参数: 列拖拽
|
||||||
* @param {*} Table
|
* @param {*} Table
|
||||||
|
@ -33,14 +32,6 @@ export default function dragColumn(Table) {
|
||||||
return _column;
|
return _column;
|
||||||
}
|
}
|
||||||
|
|
||||||
cloneDeep(obj){
|
|
||||||
if( typeof obj !== 'object' || Object.keys(obj).length === 0 ){
|
|
||||||
return obj
|
|
||||||
}
|
|
||||||
let resultData = {}
|
|
||||||
return this.recursion(obj, resultData)
|
|
||||||
}
|
|
||||||
|
|
||||||
recursion(obj, data={}){
|
recursion(obj, data={}){
|
||||||
for(key in obj){
|
for(key in obj){
|
||||||
if( typeof obj[key] == 'object' && Object.keys(obj[key].length>0 )){
|
if( typeof obj[key] == 'object' && Object.keys(obj[key].length>0 )){
|
||||||
|
@ -58,16 +49,7 @@ export default function dragColumn(Table) {
|
||||||
let sourceIndex = -1,targetIndex = -1;
|
let sourceIndex = -1,targetIndex = -1;
|
||||||
|
|
||||||
sourceIndex = columns.findIndex((da,i)=>da.key == dragSource.key);
|
sourceIndex = columns.findIndex((da,i)=>da.key == dragSource.key);
|
||||||
targetIndex = columns.findIndex((da,i)=>da.key == dragTarg.key);
|
targetIndex = columns.findIndex((da,i)=>da.key == dragTarg.key);
|
||||||
// for (let index = 0; index < columns.length; index++) {
|
|
||||||
// const da = columns[index];
|
|
||||||
// if(da.key === dragSource.key){
|
|
||||||
// columns[index] = dragTargColum;
|
|
||||||
// }
|
|
||||||
// if(da.key === dragTarg.key){
|
|
||||||
// columns[index] = dragSourceColum;
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// 向前移动
|
// 向前移动
|
||||||
if(targetIndex < sourceIndex){
|
if(targetIndex < sourceIndex){
|
||||||
targetIndex = targetIndex + 1;
|
targetIndex = targetIndex + 1;
|
||||||
|
@ -77,9 +59,6 @@ export default function dragColumn(Table) {
|
||||||
0,
|
0,
|
||||||
columns.splice(sourceIndex, 1)[0]
|
columns.splice(sourceIndex, 1)[0]
|
||||||
);
|
);
|
||||||
// this.setState({
|
|
||||||
// columns:cloneDeep(columns)
|
|
||||||
// });
|
|
||||||
let _newColumns = [];
|
let _newColumns = [];
|
||||||
columns.forEach((da,i)=>{
|
columns.forEach((da,i)=>{
|
||||||
let newDate = Object.assign(da,{});
|
let newDate = Object.assign(da,{});
|
||||||
|
@ -114,7 +93,6 @@ export default function dragColumn(Table) {
|
||||||
onDrop,
|
onDrop,
|
||||||
...others
|
...others
|
||||||
} = this.props;
|
} = this.props;
|
||||||
let key = new Date().getTime();
|
|
||||||
return (
|
return (
|
||||||
<Table
|
<Table
|
||||||
{...others}
|
{...others}
|
||||||
|
@ -128,7 +106,6 @@ export default function dragColumn(Table) {
|
||||||
draggable={draggable}
|
draggable={draggable}
|
||||||
dragborder={dragborder}
|
dragborder={dragborder}
|
||||||
// dragborder={false}
|
// dragborder={false}
|
||||||
dragborderKey={key}
|
|
||||||
/>)
|
/>)
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
Loading…
Reference in New Issue