解决了switch问题

This commit is contained in:
cw 2019-08-07 10:32:05 +08:00
parent d067cce97b
commit 4165143767
14 changed files with 1299 additions and 1016 deletions

View File

@ -42,7 +42,7 @@ var ColumnManager = function () {
title: "",
key: "dragHandle",
dataIndex: "dragHandle",
fixed: "left",
// fixed:"left",
width: 49,
render: function render() {
return _react2["default"].createElement(_beeIcon2["default"], { type: 'uf-navmenu' });

View File

@ -209,6 +209,8 @@
color: #1565c0; }
.u-table td a:active {
color: #1565c0; }
.u-table td .u-switch-span {
display: inline-block; }
.u-table thead tr:last-child {
border-bottom: 1px solid #C1C7D0; }
.u-table thead tr > th:last-child {

View File

@ -239,7 +239,7 @@ var Table = function (_Component) {
console.log('向上拖');
arr.splice(index2 + 1, 0, value1);
}
// arr[index1] = arr.splice(index2, 1, arr[index1])[0];
return arr;
};

View File

@ -160,21 +160,28 @@ var TableRow = function (_Component) {
};
_this.onTouchStart = function (e) {
e.stopPropagation();
var onDragRowStart = _this.props.onDragRowStart;
var event = _utils.Event.getEvent(e),
_target = _utils.Event.getTarget(event),
target = _target.parentNode;
while (target.tagName != 'TR') {
target = target.parentNode;
}
_this.currentIndex = target.getAttribute("data-row-key");
if (target.tagName === 'TR') {
onDragRowStart && onDragRowStart(_this.currentIndex);
_this.currentIndex = target.getAttribute("data-row-key");
onDragRowStart && onDragRowStart(_this.currentIndex);
} else {
_this.canBeTouch = false;
}
};
_this.onTouchMove = function (e) {
if (!_this.canBeTouch) return;
e.stopPropagation();
var event = _utils.Event.getEvent(e);
event.preventDefault();
var touchTarget = _this.getTouchDom(event),
@ -191,6 +198,13 @@ var TableRow = function (_Component) {
};
_this.onTouchEnd = function (e) {
if (!_this.canBeTouch) {
_this.canBeTouch = true;
return;
}
e.stopPropagation();
var onDragRow = _this.props.onDragRow;
var event = _utils.Event.getEvent(e),
@ -321,6 +335,7 @@ var TableRow = function (_Component) {
_this.expandHeight = 0;
_this.event = false;
_this.cacheCurrentIndex = null;
_this.canBeTouch = true; //受否允许拖动该行
return _this;
}

View File

@ -8,11 +8,12 @@
import React, { Component } from "react";
import Table from "../../src";
import Switch from 'bee-switch';
const columns = [
{ title: "员工编号", dataIndex: "a", key: "a", width: 150 },
{ title: "员工姓名", dataIndex: "b", key: "b", width:200 },
{ title: "性别", dataIndex: "c", key: "c", width: 500 },
{ title: "系统权限", dataIndex: "c", key: "c", width: 200,render:()=>{return(<Switch size="sm" />)}},
{ title: "部门", dataIndex: "d", key: "d", width: 100 },
{ title: "职级", dataIndex: "e", key: "e", width: 100 }
];

File diff suppressed because one or more lines are too long

2
dist/demo.css vendored
View File

@ -194,6 +194,8 @@
color: #1565c0; }
.u-table td a:active {
color: #1565c0; }
.u-table td .u-switch-span {
display: inline-block; }
.u-table thead tr:last-child {
border-bottom: 1px solid #C1C7D0; }
.u-table thead tr > th:last-child {

2
dist/demo.css.map vendored

File diff suppressed because one or more lines are too long

2045
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

@ -1,96 +1,97 @@
{
"name": "bee-table",
"version": "2.1.9",
"description": "Table ui component for react",
"keywords": [
"react",
"react-component",
"bee-table",
"iuap-design",
"tinper-bee",
"Table"
],
"engines": {
"node": ">=6.0.0"
},
"jest": {
"moduleFileExtensions": [
"js",
"jsx"
"name": "bee-table",
"version": "2.2.0-alpha.0",
"description": "Table ui component for react",
"keywords": [
"react",
"react-component",
"bee-table",
"iuap-design",
"tinper-bee",
"Table"
],
"transform": {
"^.+\\.js$": "babel-jest"
"engines": {
"node": ">=6.0.0"
},
"jest": {
"moduleFileExtensions": [
"js",
"jsx"
],
"transform": {
"^.+\\.js$": "babel-jest"
}
},
"homepage": "https://github.com/tinper-bee/bee-table.git",
"author": "Yonyou FED",
"repository": "http://github.com/tinper-bee/bee-table",
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
"license": "MIT",
"main": "./build/index.js",
"config": {
"port": 3000,
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"scripts": {
"dev": "bee-tools run start",
"build": "bee-tools run build",
"lint": "bee-tools run lint",
"test": "jest",
"chrome": "bee-tools run chrome",
"coveralls": "jest",
"browsers": "bee-tools run browsers",
"pub": "bee-tools run pub",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
},
"dependencies": {
"bee-button": "latest",
"bee-checkbox": "latest",
"bee-datepicker": "^2.0.28",
"bee-dropdown": "^2.0.4",
"bee-form-control": "latest",
"bee-icon": "latest",
"bee-input-number": "^2.0.7",
"bee-loading": "1.1.2",
"bee-locale": "0.0.14",
"bee-menus": "^2.0.6",
"bee-radio": "^2.0.14",
"bee-select": "^2.0.11",
"classnames": "^2.2.5",
"component-classes": "^1.2.6",
"lodash.clonedeep": "^4.5.0",
"object-path": "^0.11.3",
"shallowequal": "^1.0.2",
"throttle-debounce": "^2.0.1",
"tinper-bee-core": "latest",
"warning": "^3.0.0"
},
"peerDependencies": {
"react": "^15.3.0 || ^16.0",
"react-dom": "^15.3.0 || ^16.0",
"prop-types": "^15.6.0"
},
"devDependencies": {
"babel-jest": "^22.0.4",
"bee-clipboard": "^2.0.0",
"bee-drawer": "0.0.2",
"bee-layout": "latest",
"bee-pagination": "^2.0.5",
"bee-panel": "latest",
"bee-popover": "^3.0.2",
"bee-switch": "^2.0.6",
"chai": "^3.5.0",
"console-polyfill": "~0.2.1",
"cz-conventional-changelog": "^2.1.0",
"enzyme": "^2.9.1",
"es5-shim": "~4.1.10",
"jest": "^22.0.4",
"react": "^16.6.3",
"react-addons-test-utils": "^15.5.0",
"react-dom": "^16.6.3",
"ref-tree": "2.0.1-beta.1",
"reqwest": "^2.0.5",
"tinper-bee": "latest"
}
},
"homepage": "https://github.com/tinper-bee/bee-table.git",
"author": "Yonyou FED",
"repository": "http://github.com/tinper-bee/bee-table",
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
"license": "MIT",
"main": "./build/index.js",
"config": {
"port": 3000,
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"scripts": {
"dev": "bee-tools run start",
"build": "bee-tools run build",
"lint": "bee-tools run lint",
"test": "jest",
"chrome": "bee-tools run chrome",
"coveralls": "jest",
"browsers": "bee-tools run browsers",
"pub": "bee-tools run pub",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
},
"dependencies": {
"bee-button": "latest",
"bee-checkbox": "latest",
"bee-datepicker": "^2.0.28",
"bee-dropdown": "^2.0.4",
"bee-form-control": "latest",
"bee-icon": "latest",
"bee-input-number": "^2.0.7",
"bee-loading": "1.1.2",
"bee-locale": "0.0.14",
"bee-menus": "^2.0.6",
"bee-radio": "^2.0.14",
"bee-select": "^2.0.11",
"classnames": "^2.2.5",
"component-classes": "^1.2.6",
"lodash.clonedeep": "^4.5.0",
"object-path": "^0.11.3",
"shallowequal": "^1.0.2",
"throttle-debounce": "^2.0.1",
"tinper-bee-core": "latest",
"warning": "^3.0.0"
},
"peerDependencies": {
"react": "^15.3.0 || ^16.0",
"react-dom": "^15.3.0 || ^16.0",
"prop-types": "^15.6.0"
},
"devDependencies": {
"babel-jest": "^22.0.4",
"bee-clipboard": "^2.0.0",
"bee-drawer": "0.0.2",
"bee-layout": "latest",
"bee-pagination": "^2.0.5",
"bee-panel": "latest",
"bee-popover": "^3.0.2",
"chai": "^3.5.0",
"console-polyfill": "~0.2.1",
"cz-conventional-changelog": "^2.1.0",
"enzyme": "^2.9.1",
"es5-shim": "~4.1.10",
"jest": "^22.0.4",
"react": "^16.6.3",
"react-addons-test-utils": "^15.5.0",
"react-dom": "^16.6.3",
"ref-tree": "2.0.1-beta.1",
"reqwest": "^2.0.5",
"tinper-bee": "latest"
}
}
}

View File

@ -15,8 +15,8 @@ export default class ColumnManager {
title: "",
key: "dragHandle",
dataIndex: "dragHandle",
fixed:"left",
width: 49,
// fixed:"left",
width: 49,
render: () => {
return <Icon type="uf-navmenu" />
}
@ -64,11 +64,11 @@ export default class ColumnManager {
);
});
}
centerColumns() {
return this._cache('centerColumns', () => {
return this.groupedColumns().filter(
column => !column.fixed
column => !column.fixed
);
});
}
@ -235,7 +235,7 @@ export default class ColumnManager {
//todo 含有children的宽度计算
_leafColumns(columns) {
const leafColumns = [];
columns.forEach(column => {
if (!column.children) {

View File

@ -78,6 +78,9 @@ $icon-color:#505F79;
color: #1565c0;
}
}
.u-switch-span{
display: inline-block
}
}
thead{
tr:last-child{

View File

@ -62,6 +62,7 @@ class TableRow extends Component{
this.expandHeight = 0;
this.event = false;
this.cacheCurrentIndex = null;
this.canBeTouch = true //受否允许拖动该行
}
@ -194,20 +195,28 @@ class TableRow extends Component{
* 开始调整交换行的事件
*/
onTouchStart = (e) => {
e.stopPropagation()
let {onDragRowStart} = this.props;
let event = Event.getEvent(e) ,
_target = Event.getTarget(event),
target = _target.parentNode;
while (target.tagName != 'TR') {
target = target.parentNode
if (target.tagName === 'TR') {
this.currentIndex = target.getAttribute("data-row-key");
onDragRowStart && onDragRowStart(this.currentIndex);
}else{
this.canBeTouch = false
}
this.currentIndex = target.getAttribute("data-row-key");
onDragRowStart && onDragRowStart(this.currentIndex);
}
onTouchMove = (e) => {
if (!this.canBeTouch) return;
e.stopPropagation()
let event = Event.getEvent(e);
event.preventDefault();
let touchTarget = this.getTouchDom(event),
@ -226,6 +235,13 @@ class TableRow extends Component{
* 手指移开时触发
*/
onTouchEnd = (e) => {
if(!this.canBeTouch){
this.canBeTouch = true
return
}
e.stopPropagation()
let {onDragRow} = this.props;
let event = Event.getEvent(e),
currentKey = this.currentIndex, //拖拽行的key