merge
This commit is contained in:
izbz wh
commit
7a9d0929cb
42
CHANGELOG.md
42
CHANGELOG.md
|
|
@ -1,46 +1,20 @@
|
||||||
<a name="2.0.6"></a>
|
<a name="2.0.9"></a>
|
||||||
## [2.0.6](https://github.com/tinper-bee/bee-table/compare/v2.0.5...v2.0.6) (2019-03-15)
|
## [2.0.9](https://github.com/tinper-bee/bee-table/compare/v2.0.0...v2.0.9) (2019-03-27)
|
||||||
|
|
||||||
|
|
||||||
### Bug Fixes
|
### Bug Fixes
|
||||||
|
|
||||||
* **行过滤、checkbox样式:** 1、行过滤点击已选的无效2、checkbox在Table中的样式 ([1a628a4](https://github.com/tinper-bee/bee-table/commit/1a628a4))
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<a name="2.0.5"></a>
|
|
||||||
## [2.0.5](https://github.com/tinper-bee/bee-table/compare/v2.0.4...v2.0.5) (2019-03-14)
|
|
||||||
|
|
||||||
|
|
||||||
### Bug Fixes
|
|
||||||
|
|
||||||
* 参照场景中表格首次渲染最后一列没有撑开bug ([c705539](https://github.com/tinper-bee/bee-table/commit/c705539))
|
|
||||||
* **Table.js:** 参照场景中第一次加载表格不撑满问题 ([a9530a4](https://github.com/tinper-bee/bee-table/commit/a9530a4))
|
* **Table.js:** 参照场景中第一次加载表格不撑满问题 ([a9530a4](https://github.com/tinper-bee/bee-table/commit/a9530a4))
|
||||||
|
* **行过滤、checkbox样式:** 1、行过滤点击已选的无效2、checkbox在Table中的样式 ([1a628a4](https://github.com/tinper-bee/bee-table/commit/1a628a4))
|
||||||
|
* Table 拖拽后同步表格整体宽度 ([ee40deb](https://github.com/tinper-bee/bee-table/commit/ee40deb))
|
||||||
|
* 参照场景中表格首次渲染最后一列没有撑开bug ([c705539](https://github.com/tinper-bee/bee-table/commit/c705539))
|
||||||
<a name="2.0.4"></a>
|
|
||||||
## [2.0.4](https://github.com/tinper-bee/bee-table/compare/v2.0.3...v2.0.4) (2019-03-07)
|
|
||||||
|
|
||||||
|
|
||||||
### Bug Fixes
|
|
||||||
|
|
||||||
* 含有右侧固定列场景中，内容过少不需要滚动条bug ([37b9806](https://github.com/tinper-bee/bee-table/commit/37b9806))
|
* 含有右侧固定列场景中，内容过少不需要滚动条bug ([37b9806](https://github.com/tinper-bee/bee-table/commit/37b9806))
|
||||||
|
* 表格key警告问题 ([6977e2f](https://github.com/tinper-bee/bee-table/commit/6977e2f))
|
||||||
|
|
||||||
|
|
||||||
<a name="2.0.3"></a>
|
|
||||||
## [2.0.3](https://github.com/tinper-bee/bee-table/compare/v2.0.0...v2.0.3) (2019-03-05)
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<a name="2.0.0"></a>
|
<a name="2.0.0"></a>
|
||||||
# [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.44...v2.0.0) (2019-03-01)
|
# [2.0.0](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v2.0.0) (2019-03-01)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<a name="1.6.44"></a>
|
|
||||||
## [1.6.44](https://github.com/tinper-bee/bee-table/compare/v1.6.43...v1.6.44) (2019-02-26)
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -335,7 +309,7 @@
|
||||||
|
|
||||||
|
|
||||||
<a name="1.5.1"></a>
|
<a name="1.5.1"></a>
|
||||||
## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-19)
|
## [1.5.1](https://github.com/tinper-bee/bee-table/compare/v1.5.0...v1.5.1) (2018-11-18)
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
180
build/Table.css
180
build/Table.css
|
|
@ -1,168 +1,8 @@
|
||||||
@charset "UTF-8";
|
|
||||||
/* FormGroup */
|
/* FormGroup */
|
||||||
/* Navlayout */
|
/* Navlayout */
|
||||||
/* FormGroup */
|
|
||||||
/* Navlayout */
|
|
||||||
/**
|
|
||||||
* 加载背景
|
|
||||||
*/
|
|
||||||
/**
|
|
||||||
* 文字
|
|
||||||
*/
|
|
||||||
.u-loading-desc {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #000;
|
|
||||||
text-align: center; }
|
|
||||||
|
|
||||||
/**
|
|
||||||
* default样式 单个圆圈加载
|
|
||||||
*/
|
|
||||||
.u-loading.u-loading-rotate > div {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 100%;
|
|
||||||
margin: 2px;
|
|
||||||
-webkit-animation-fill-mode: both;
|
|
||||||
animation-fill-mode: both;
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -22px;
|
|
||||||
margin-top: -22px;
|
|
||||||
background: transparent !important;
|
|
||||||
display: inline-block;
|
|
||||||
-webkit-animation: rotate 1.5s 0s linear infinite;
|
|
||||||
animation: rotate 1.5s 0s linear infinite;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 40px; }
|
|
||||||
.u-loading.u-loading-rotate > div > .uf {
|
|
||||||
color: #0084ff;
|
|
||||||
font-size: 40px;
|
|
||||||
padding: 0; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-lg > div {
|
|
||||||
margin-left: -35px;
|
|
||||||
margin-top: -35px;
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
line-height: 60px; }
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-lg > div > .uf {
|
|
||||||
font-size: 60px; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-sm > div {
|
|
||||||
margin-left: -15px;
|
|
||||||
margin-top: -15px;
|
|
||||||
width: 25px;
|
|
||||||
height: 25px;
|
|
||||||
line-height: 25px; }
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-sm > div > .uf {
|
|
||||||
font-size: 25px; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-primary > div > .uf {
|
|
||||||
color: #3f51b5; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-success > div > .uf {
|
|
||||||
color: #4caf50; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-warning > div > .uf {
|
|
||||||
color: #ff9800; }
|
|
||||||
|
|
||||||
.u-loading-backdrop {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 1900;
|
|
||||||
opacity: .7;
|
|
||||||
filter: blur(0.5px);
|
|
||||||
background-color: #fff; }
|
|
||||||
.u-loading-backdrop.full-screen {
|
|
||||||
position: fixed; }
|
|
||||||
|
|
||||||
@keyframes rotate {
|
|
||||||
0% {
|
|
||||||
-webkit-transform: rotate(0deg) scale(1);
|
|
||||||
transform: rotate(0deg) scale(1); }
|
|
||||||
50% {
|
|
||||||
-webkit-transform: rotate(180deg) scale(1);
|
|
||||||
transform: rotate(180deg) scale(1); }
|
|
||||||
100% {
|
|
||||||
-webkit-transform: rotate(360deg) scale(1);
|
|
||||||
transform: rotate(360deg) scale(1); } }
|
|
||||||
|
|
||||||
.u-loading.u-loading-line {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
margin-top: -30px;
|
|
||||||
margin-left: -25px; }
|
|
||||||
.u-loading.u-loading-line > div {
|
|
||||||
background-color: #C2C3C5;
|
|
||||||
width: 6px;
|
|
||||||
height: 50px;
|
|
||||||
border-radius: 2px;
|
|
||||||
margin: 2px;
|
|
||||||
-webkit-animation-fill-mode: both;
|
|
||||||
animation-fill-mode: both;
|
|
||||||
display: inline-block; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-lg {
|
|
||||||
margin-top: -50px;
|
|
||||||
margin-left: -30px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-lg > div {
|
|
||||||
width: 8px;
|
|
||||||
height: 90px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-sm {
|
|
||||||
margin-top: -22px;
|
|
||||||
margin-left: -20px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-sm > div {
|
|
||||||
width: 4px;
|
|
||||||
height: 35px; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(1) {
|
|
||||||
-webkit-animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #F44336; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(2) {
|
|
||||||
-webkit-animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #7ED321; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(3) {
|
|
||||||
-webkit-animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #0084FF; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(4) {
|
|
||||||
-webkit-animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #FF9800; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(5) {
|
|
||||||
-webkit-animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #D0021B; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-primary > div {
|
|
||||||
background-color: #3f51b5; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-success > div {
|
|
||||||
background-color: #4caf50; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-warning > div {
|
|
||||||
background-color: #ff9800; }
|
|
||||||
|
|
||||||
@keyframes line-scale {
|
|
||||||
0% {
|
|
||||||
-webkit-transform: scaley(1);
|
|
||||||
transform: scaley(1); }
|
|
||||||
50% {
|
|
||||||
-webkit-transform: scaley(0.4);
|
|
||||||
transform: scaley(0.4); }
|
|
||||||
100% {
|
|
||||||
-webkit-transform: scaley(1);
|
|
||||||
transform: scaley(1); } }
|
|
||||||
|
|
||||||
.u-table {
|
.u-table {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #666;
|
color: #212121;
|
||||||
position: relative;
|
position: relative;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
overflow: hidden; }
|
overflow: hidden; }
|
||||||
|
|
@ -179,7 +19,7 @@
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
text-align: left; }
|
text-align: left; }
|
||||||
.u-table th {
|
.u-table th {
|
||||||
font-weight: bold;
|
font-weight: normal;
|
||||||
text-align: left; }
|
text-align: left; }
|
||||||
.u-table th[colspan] {
|
.u-table th[colspan] {
|
||||||
text-align: center; }
|
text-align: center; }
|
||||||
|
|
@ -231,8 +71,13 @@
|
||||||
overflow: hidden; }
|
overflow: hidden; }
|
||||||
.u-table-header {
|
.u-table-header {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
<<<<<<< HEAD
|
||||||
background: rgb(223, 225, 230);
|
background: rgb(223, 225, 230);
|
||||||
color: rgb(102, 102, 102); }
|
color: rgb(102, 102, 102); }
|
||||||
|
=======
|
||||||
|
background: rgb(241, 242, 245);
|
||||||
|
color: rgb(33, 33, 33); }
|
||||||
|
>>>>>>> d22d3eedc74d2580946a0e615dff0a862b240889
|
||||||
.u-table.fixed-height td {
|
.u-table.fixed-height td {
|
||||||
padding: 0px 8px; }
|
padding: 0px 8px; }
|
||||||
.u-table-fixed-header .u-table-body {
|
.u-table-fixed-header .u-table-body {
|
||||||
|
|
@ -356,14 +201,19 @@
|
||||||
.u-table-thead .filter-wrap .filter-btns {
|
.u-table-thead .filter-wrap .filter-btns {
|
||||||
min-width: 58px; }
|
min-width: 58px; }
|
||||||
.u-table-thead th {
|
.u-table-thead th {
|
||||||
|
<<<<<<< HEAD
|
||||||
background: rgb(223, 225, 230);
|
background: rgb(223, 225, 230);
|
||||||
color: rgb(102, 102, 102);
|
color: rgb(102, 102, 102);
|
||||||
|
=======
|
||||||
|
background: rgb(241, 242, 245);
|
||||||
|
color: rgb(33, 33, 33);
|
||||||
|
>>>>>>> d22d3eedc74d2580946a0e615dff0a862b240889
|
||||||
background-clip: padding-box;
|
background-clip: padding-box;
|
||||||
-moz-user-select: -moz-none;
|
-moz-user-select: -moz-none;
|
||||||
-khtml-user-select: none;
|
-khtml-user-select: none;
|
||||||
-webkit-user-select: none;
|
-webkit-user-select: none;
|
||||||
/*
|
/*
|
||||||
Introduced in IE 10.
|
Introduced in IE 10.
|
||||||
*/
|
*/
|
||||||
-ms-user-select: none;
|
-ms-user-select: none;
|
||||||
user-select: none; }
|
user-select: none; }
|
||||||
|
|
@ -453,7 +303,7 @@
|
||||||
height: 25px;
|
height: 25px;
|
||||||
line-height: 25px;
|
line-height: 25px;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
background: #f7f7f7; }
|
background: rgb(241, 242, 245); }
|
||||||
.u-table-filter-column-filter-iconi.uf {
|
.u-table-filter-column-filter-iconi.uf {
|
||||||
padding: 0px; }
|
padding: 0px; }
|
||||||
.u-table-filter-column-pop-cont-item {
|
.u-table-filter-column-pop-cont-item {
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
Object.defineProperty(exports, "__esModule", {
|
Object.defineProperty(exports, "__esModule", {
|
||||||
value: true
|
value: true
|
||||||
});
|
});
|
||||||
|
|
||||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||||
|
|
@ -36,137 +36,137 @@ var cloneDeep = require('lodash.clonedeep');
|
||||||
|
|
||||||
function dragColumn(Table) {
|
function dragColumn(Table) {
|
||||||
|
|
||||||
return function (_Component) {
|
return function (_Component) {
|
||||||
_inherits(DragColumn, _Component);
|
_inherits(DragColumn, _Component);
|
||||||
|
|
||||||
function DragColumn(props) {
|
function DragColumn(props) {
|
||||||
_classCallCheck(this, DragColumn);
|
_classCallCheck(this, DragColumn);
|
||||||
|
|
||||||
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
|
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
|
||||||
|
|
||||||
_this.setColumOrderByIndex = function (_column) {
|
_this.setColumOrderByIndex = function (_column) {
|
||||||
_column.forEach(function (da, i) {
|
_column.forEach(function (da, i) {
|
||||||
da.dragIndex = i;
|
da.dragIndex = i;
|
||||||
da.drgHover = false;
|
da.drgHover = false;
|
||||||
});
|
});
|
||||||
return _column;
|
return _column;
|
||||||
};
|
};
|
||||||
|
|
||||||
_this.onDrop = function (event, data) {
|
_this.onDrop = function (event, data) {
|
||||||
var dragSource = data.dragSource,
|
var dragSource = data.dragSource,
|
||||||
dragTarg = data.dragTarg;
|
dragTarg = data.dragTarg;
|
||||||
var columns = _this.state.columns;
|
var columns = _this.state.columns;
|
||||||
|
|
||||||
var sourceIndex = -1,
|
var sourceIndex = -1,
|
||||||
targetIndex = -1;
|
targetIndex = -1;
|
||||||
|
|
||||||
sourceIndex = columns.findIndex(function (da, i) {
|
sourceIndex = columns.findIndex(function (da, i) {
|
||||||
return da.key == dragSource.key;
|
return da.key == dragSource.key;
|
||||||
});
|
});
|
||||||
targetIndex = columns.findIndex(function (da, i) {
|
targetIndex = columns.findIndex(function (da, i) {
|
||||||
return da.key == dragTarg.key;
|
return da.key == dragTarg.key;
|
||||||
});
|
});
|
||||||
// for (let index = 0; index < columns.length; index++) {
|
// for (let index = 0; index < columns.length; index++) {
|
||||||
// const da = columns[index];
|
// const da = columns[index];
|
||||||
// if(da.key === dragSource.key){
|
// if(da.key === dragSource.key){
|
||||||
// columns[index] = dragTargColum;
|
// columns[index] = dragTargColum;
|
||||||
// }
|
// }
|
||||||
// if(da.key === dragTarg.key){
|
// if(da.key === dragTarg.key){
|
||||||
// columns[index] = dragSourceColum;
|
// columns[index] = dragSourceColum;
|
||||||
// }
|
// }
|
||||||
// }
|
// }
|
||||||
// 向前移动
|
// 向前移动
|
||||||
if (targetIndex < sourceIndex) {
|
if (targetIndex < sourceIndex) {
|
||||||
targetIndex = targetIndex + 1;
|
targetIndex = targetIndex + 1;
|
||||||
|
}
|
||||||
|
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
|
||||||
|
_this.setState({
|
||||||
|
columns: cloneDeep(columns)
|
||||||
|
});
|
||||||
|
if (_this.props.onDrop) {
|
||||||
|
_this.props.onDrop(event, data, columns);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
_this.getTarget = function (evt) {
|
||||||
|
return evt.target || evt.srcElement;
|
||||||
|
};
|
||||||
|
|
||||||
|
_this.state = {
|
||||||
|
columns: _this.setColumOrderByIndex(props.columns)
|
||||||
|
};
|
||||||
|
return _this;
|
||||||
}
|
}
|
||||||
columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
|
|
||||||
_this.setState({
|
DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
|
||||||
columns: cloneDeep(columns)
|
if (nextProps.columns != this.props.columns) {
|
||||||
|
this.setState({
|
||||||
|
columns: this.setColumOrderByIndex(nextProps.columns)
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
|
||||||
|
if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
|
||||||
|
return obj;
|
||||||
|
}
|
||||||
|
var resultData = {};
|
||||||
|
return this.recursion(obj, resultData);
|
||||||
|
};
|
||||||
|
|
||||||
|
DragColumn.prototype.recursion = function (_recursion) {
|
||||||
|
function recursion(_x) {
|
||||||
|
return _recursion.apply(this, arguments);
|
||||||
|
}
|
||||||
|
|
||||||
|
recursion.toString = function () {
|
||||||
|
return _recursion.toString();
|
||||||
|
};
|
||||||
|
|
||||||
|
return recursion;
|
||||||
|
}(function (obj) {
|
||||||
|
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
||||||
|
|
||||||
|
for (key in obj) {
|
||||||
|
if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
|
||||||
|
data[key] = recursion(obj[key]);
|
||||||
|
} else {
|
||||||
|
data[key] = obj[key];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return data;
|
||||||
});
|
});
|
||||||
if (_this.props.onDrop) {
|
|
||||||
_this.props.onDrop(event, data, columns);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
_this.getTarget = function (evt) {
|
DragColumn.prototype.render = function render() {
|
||||||
return evt.target || evt.srcElement;
|
var _props = this.props,
|
||||||
};
|
data = _props.data,
|
||||||
|
dragborder = _props.dragborder,
|
||||||
|
draggable = _props.draggable,
|
||||||
|
className = _props.className,
|
||||||
|
columns = _props.columns,
|
||||||
|
onDragStart = _props.onDragStart,
|
||||||
|
onDragEnter = _props.onDragEnter,
|
||||||
|
onDragOver = _props.onDragOver,
|
||||||
|
onDrop = _props.onDrop,
|
||||||
|
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
|
||||||
|
|
||||||
_this.state = {
|
var key = new Date().getTime();
|
||||||
columns: _this.setColumOrderByIndex(props.columns)
|
return _react2["default"].createElement(Table, _extends({}, others, {
|
||||||
};
|
columns: this.state.columns,
|
||||||
return _this;
|
data: data,
|
||||||
}
|
className: className + ' u-table-drag-border',
|
||||||
|
onDragStart: this.onDragStart,
|
||||||
|
onDragOver: this.onDragOver,
|
||||||
|
onDrop: this.onDrop,
|
||||||
|
onDragEnter: this.onDragEnter,
|
||||||
|
draggable: draggable,
|
||||||
|
dragborder: dragborder
|
||||||
|
// dragborder={false}
|
||||||
|
, dragborderKey: key
|
||||||
|
}));
|
||||||
|
};
|
||||||
|
|
||||||
DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
|
return DragColumn;
|
||||||
if (nextProps.columns != this.props.columns) {
|
}(_react.Component);
|
||||||
this.setState({
|
|
||||||
columns: this.setColumOrderByIndex(nextProps.columns)
|
|
||||||
});
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
|
|
||||||
if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
|
|
||||||
return obj;
|
|
||||||
}
|
|
||||||
var resultData = {};
|
|
||||||
return this.recursion(obj, resultData);
|
|
||||||
};
|
|
||||||
|
|
||||||
DragColumn.prototype.recursion = function (_recursion) {
|
|
||||||
function recursion(_x) {
|
|
||||||
return _recursion.apply(this, arguments);
|
|
||||||
}
|
|
||||||
|
|
||||||
recursion.toString = function () {
|
|
||||||
return _recursion.toString();
|
|
||||||
};
|
|
||||||
|
|
||||||
return recursion;
|
|
||||||
}(function (obj) {
|
|
||||||
var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
|
|
||||||
|
|
||||||
for (key in obj) {
|
|
||||||
if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
|
|
||||||
data[key] = recursion(obj[key]);
|
|
||||||
} else {
|
|
||||||
data[key] = obj[key];
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return data;
|
|
||||||
});
|
|
||||||
|
|
||||||
DragColumn.prototype.render = function render() {
|
|
||||||
var _props = this.props,
|
|
||||||
data = _props.data,
|
|
||||||
dragborder = _props.dragborder,
|
|
||||||
draggable = _props.draggable,
|
|
||||||
className = _props.className,
|
|
||||||
columns = _props.columns,
|
|
||||||
onDragStart = _props.onDragStart,
|
|
||||||
onDragEnter = _props.onDragEnter,
|
|
||||||
onDragOver = _props.onDragOver,
|
|
||||||
onDrop = _props.onDrop,
|
|
||||||
others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
|
|
||||||
|
|
||||||
var key = new Date().getTime();
|
|
||||||
return _react2["default"].createElement(Table, _extends({}, others, {
|
|
||||||
columns: this.state.columns,
|
|
||||||
data: data,
|
|
||||||
className: className + ' u-table-drag-border',
|
|
||||||
onDragStart: this.onDragStart,
|
|
||||||
onDragOver: this.onDragOver,
|
|
||||||
onDrop: this.onDrop,
|
|
||||||
onDragEnter: this.onDragEnter,
|
|
||||||
draggable: draggable,
|
|
||||||
dragborder: dragborder
|
|
||||||
// dragborder={false}
|
|
||||||
, dragborderKey: key
|
|
||||||
}));
|
|
||||||
};
|
|
||||||
|
|
||||||
return DragColumn;
|
|
||||||
}(_react.Component);
|
|
||||||
}
|
}
|
||||||
module.exports = exports['default'];
|
module.exports = exports['default'];
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
'use strict';
|
'use strict';
|
||||||
|
|
||||||
Object.defineProperty(exports, "__esModule", {
|
Object.defineProperty(exports, "__esModule", {
|
||||||
value: true
|
value: true
|
||||||
});
|
});
|
||||||
|
|
||||||
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
|
||||||
|
|
@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
|
||||||
*/
|
*/
|
||||||
|
|
||||||
function sortBy(arr, prop, desc) {
|
function sortBy(arr, prop, desc) {
|
||||||
var props = [],
|
var props = [],
|
||||||
ret = [],
|
ret = [],
|
||||||
i = 0,
|
i = 0,
|
||||||
len = arr.length;
|
len = arr.length;
|
||||||
if (typeof prop == 'string') {
|
if (typeof prop == 'string') {
|
||||||
for (; i < len; i++) {
|
for (; i < len; i++) {
|
||||||
var oI = arr[i];
|
var oI = arr[i];
|
||||||
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
|
(props[i] = new String(oI && oI[prop] || ''))._obj = oI;
|
||||||
}
|
|
||||||
} else if (typeof prop == 'function') {
|
|
||||||
for (; i < len; i++) {
|
|
||||||
var _oI = arr[i];
|
|
||||||
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
throw '参数类型错误';
|
|
||||||
}
|
}
|
||||||
props.sort();
|
} else if (typeof prop == 'function') {
|
||||||
for (i = 0; i < len; i++) {
|
for (; i < len; i++) {
|
||||||
ret[i] = props[i]._obj;
|
var _oI = arr[i];
|
||||||
|
(props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
|
||||||
}
|
}
|
||||||
if (desc) ret.reverse();
|
} else {
|
||||||
return ret;
|
throw '参数类型错误';
|
||||||
|
}
|
||||||
|
props.sort();
|
||||||
|
for (i = 0; i < len; i++) {
|
||||||
|
ret[i] = props[i]._obj;
|
||||||
|
}
|
||||||
|
if (desc) ret.reverse();
|
||||||
|
return ret;
|
||||||
};
|
};
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
|
||||||
* @param {} property
|
* @param {} property
|
||||||
*/
|
*/
|
||||||
function compare(property) {
|
function compare(property) {
|
||||||
return function (a, b) {
|
return function (a, b) {
|
||||||
var value1 = a[property];
|
var value1 = a[property];
|
||||||
var value2 = b[property];
|
var value2 = b[property];
|
||||||
return value1 - value2;
|
return value1 - value2;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -63,17 +63,17 @@ function compare(property) {
|
||||||
* @param {*} obj 要拷贝的对象
|
* @param {*} obj 要拷贝的对象
|
||||||
*/
|
*/
|
||||||
function ObjectAssign(obj) {
|
function ObjectAssign(obj) {
|
||||||
var b = obj instanceof Array;
|
var b = obj instanceof Array;
|
||||||
var tagObj = b ? [] : {};
|
var tagObj = b ? [] : {};
|
||||||
if (b) {
|
if (b) {
|
||||||
//数组
|
//数组
|
||||||
obj.forEach(function (da) {
|
obj.forEach(function (da) {
|
||||||
var _da = {};
|
var _da = {};
|
||||||
_extends(_da, da);
|
_extends(_da, da);
|
||||||
tagObj.push(_da);
|
tagObj.push(_da);
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
_extends(tagObj, obj);
|
_extends(tagObj, obj);
|
||||||
}
|
}
|
||||||
return tagObj;
|
return tagObj;
|
||||||
}
|
}
|
||||||
|
|
@ -6,7 +6,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import {Button,Tooltip} from "tinper-bee";
|
import {Button,Tooltip,Popconfirm} from "tinper-bee";
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
|
|
@ -37,15 +37,11 @@ const columns = [
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<div style={{ position: 'relative' }} title={text} >
|
<div style={{ position: 'relative' }} title={text} >
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="javascript:;"
|
<a href="javascript:;" tooltip={text}>
|
||||||
tooltip={text}
|
一些操作
|
||||||
onClick={() => {
|
</a>
|
||||||
alert('这是第' + index + '列，内容为:' + text);
|
</Popconfirm>
|
||||||
}}
|
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -75,8 +71,8 @@ class Demo1 extends Component {
|
||||||
columns={columns}
|
columns={columns}
|
||||||
data={data}
|
data={data}
|
||||||
parentNodeId='parent'
|
parentNodeId='parent'
|
||||||
height={43}
|
height={40}
|
||||||
headerHeight={42}
|
headerHeight={40}
|
||||||
onRowClick={(record, index, indent) => {
|
onRowClick={(record, index, indent) => {
|
||||||
this.setState({
|
this.setState({
|
||||||
selectedRowIndex: index
|
selectedRowIndex: index
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
import {Button} from "tinper-bee";
|
import {Button,Popconfirm} from "tinper-bee";
|
||||||
|
|
||||||
const columns17 = [
|
const columns17 = [
|
||||||
{ title: "用户名", dataIndex: "a", key: "a", width: 100 },
|
{ title: "用户名", dataIndex: "a", key: "a", width: 100 },
|
||||||
|
|
@ -19,14 +19,11 @@ const columns17 = [
|
||||||
key: "d",
|
key: "d",
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="#"
|
<a href="javascript:;">
|
||||||
onClick={() => {
|
一些操作
|
||||||
alert('这是第'+index+'列，内容为:'+text);
|
</a>
|
||||||
}}
|
</Popconfirm>
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
|
import {Popconfirm} from 'tinper-bee';
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
import BigData from "../../src/lib/bigData";
|
import BigData from "../../src/lib/bigData";
|
||||||
const BigDataTable = BigData(Table);
|
const BigDataTable = BigData(Table);
|
||||||
|
|
@ -17,14 +18,11 @@ const outColumns = [
|
||||||
width:200,
|
width:200,
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="#"
|
<a href="javascript:;">
|
||||||
onClick={() => {
|
一些操作
|
||||||
alert("这是第" + index + "列，内容为:" + text);
|
</a>
|
||||||
}}
|
</Popconfirm>
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -41,14 +39,11 @@ const innerColumns = [
|
||||||
width:200,
|
width:200,
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="#"
|
<a href="javascript:;">
|
||||||
onClick={() => {
|
一些操作
|
||||||
alert("这是第" + index + "列，内容为:" + text);
|
</a>
|
||||||
}}
|
</Popconfirm>
|
||||||
>
|
|
||||||
{'一些操作'+index}
|
|
||||||
</a>
|
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -7,7 +7,7 @@
|
||||||
|
|
||||||
|
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import {Icon,Checkbox,Popover} from "tinper-bee";
|
import {Icon,Checkbox,Popover,Popconfirm} from "tinper-bee";
|
||||||
|
|
||||||
import Table from '../../src';
|
import Table from '../../src';
|
||||||
import filterColumn from '../../src/lib/filterColumn';
|
import filterColumn from '../../src/lib/filterColumn';
|
||||||
|
|
@ -63,19 +63,11 @@ class Demo21 extends Component {
|
||||||
render(text, record, index){
|
render(text, record, index){
|
||||||
return (
|
return (
|
||||||
<div title={text} >
|
<div title={text} >
|
||||||
<a href="#"
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
tooltip={text}
|
<a href="javascript:;" tooltip={text} >
|
||||||
onClick={() => {
|
一些操作
|
||||||
alert('这是第'+index+'列，内容为:'+text);
|
</a>
|
||||||
}}
|
</Popconfirm>
|
||||||
// style={{
|
|
||||||
// position: 'absolute',
|
|
||||||
// top: 5,
|
|
||||||
// left: 0
|
|
||||||
// }}
|
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import {Tooltip,Button} from "tinper-bee";
|
import {Tooltip,Button,Popconfirm} from "tinper-bee";
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
|
|
||||||
const columns = [
|
const columns = [
|
||||||
|
|
@ -36,15 +36,11 @@ const columns = [
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<div style={{ position: 'relative' }} title={text} >
|
<div style={{ position: 'relative' }} title={text} >
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="javascript:;"
|
<a href="javascript:;" tooltip={text} >
|
||||||
tooltip={text}
|
一些操作
|
||||||
onClick={() => {
|
</a>
|
||||||
alert('这是第' + index + '列，内容为:' + text);
|
</Popconfirm>
|
||||||
}}
|
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
@ -89,8 +85,8 @@ class Demo35 extends Component {
|
||||||
columns={columns}
|
columns={columns}
|
||||||
data={data}
|
data={data}
|
||||||
parentNodeId='parent'
|
parentNodeId='parent'
|
||||||
height={43}
|
height={40}
|
||||||
headerHeight={42}
|
headerHeight={40}
|
||||||
hoverContent={this.getHoverContent}
|
hoverContent={this.getHoverContent}
|
||||||
onRowHover={this.onRowHover}
|
onRowHover={this.onRowHover}
|
||||||
onRowClick={(record, index, indent) => {
|
onRowClick={(record, index, indent) => {
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from 'react';
|
import React, { Component } from 'react';
|
||||||
import {Icon,Checkbox,Popover} from "tinper-bee";
|
import {Icon,Checkbox,Popover,Popconfirm} from "tinper-bee";
|
||||||
|
|
||||||
import Table from '../../src';
|
import Table from '../../src';
|
||||||
import multiSelect from '../../src/lib/multiSelect';
|
import multiSelect from '../../src/lib/multiSelect';
|
||||||
|
|
@ -85,14 +85,11 @@ function getCloumns(){
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<div className='operation-btn'>
|
<div className='operation-btn'>
|
||||||
<a href="#"
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
tooltip={text}
|
<a href="javascript:;" tooltip={text} >
|
||||||
onClick={() => {
|
一些操作
|
||||||
alert('这是第'+index+'列，内容为:'+text);
|
</a>
|
||||||
}}
|
</Popconfirm>
|
||||||
>
|
|
||||||
一些操作
|
|
||||||
</a>
|
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
|
import { Popconfirm } from 'tinper-bee';
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
import dragColumn from '../../src/lib/dragColumn';
|
import dragColumn from '../../src/lib/dragColumn';
|
||||||
const DragColumnTable = dragColumn(Table);
|
const DragColumnTable = dragColumn(Table);
|
||||||
|
|
@ -17,14 +18,11 @@ const columns16 = [
|
||||||
width:200,
|
width:200,
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="#"
|
<a href="javascript:;" tooltip={text} >
|
||||||
onClick={() => {
|
|
||||||
alert("这是第" + index + "列，内容为:" + text);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
一些操作
|
一些操作
|
||||||
</a>
|
</a>
|
||||||
|
</Popconfirm>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -41,14 +39,11 @@ const columns17 = [
|
||||||
width:200,
|
width:200,
|
||||||
render(text, record, index) {
|
render(text, record, index) {
|
||||||
return (
|
return (
|
||||||
<a
|
<Popconfirm trigger="click" placement="right" content={'这是第' + index + '行，内容为:' + text}>
|
||||||
href="#"
|
<a href="javascript:;" tooltip={text} >
|
||||||
onClick={() => {
|
|
||||||
alert("这是第" + index + "列，内容为:" + text);
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
一些操作
|
一些操作
|
||||||
</a>
|
</a>
|
||||||
|
</Popconfirm>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -1,154 +1,8 @@
|
||||||
@charset "UTF-8";
|
|
||||||
/* FormGroup */
|
/* FormGroup */
|
||||||
/* Navlayout */
|
/* Navlayout */
|
||||||
/* FormGroup */
|
|
||||||
/* Navlayout */
|
|
||||||
/**
|
|
||||||
* 加载背景
|
|
||||||
*/
|
|
||||||
/**
|
|
||||||
* 文字
|
|
||||||
*/
|
|
||||||
.u-loading-desc {
|
|
||||||
position: absolute;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #000;
|
|
||||||
text-align: center; }
|
|
||||||
|
|
||||||
/**
|
|
||||||
* default样式 单个圆圈加载
|
|
||||||
*/
|
|
||||||
.u-loading.u-loading-rotate > div {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 100%;
|
|
||||||
margin: 2px;
|
|
||||||
animation-fill-mode: both;
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
margin-left: -22px;
|
|
||||||
margin-top: -22px;
|
|
||||||
background: transparent !important;
|
|
||||||
display: inline-block;
|
|
||||||
animation: rotate 1.5s 0s linear infinite;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 40px; }
|
|
||||||
.u-loading.u-loading-rotate > div > .uf {
|
|
||||||
color: #0084ff;
|
|
||||||
font-size: 40px;
|
|
||||||
padding: 0; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-lg > div {
|
|
||||||
margin-left: -35px;
|
|
||||||
margin-top: -35px;
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
line-height: 60px; }
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-lg > div > .uf {
|
|
||||||
font-size: 60px; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-sm > div {
|
|
||||||
margin-left: -15px;
|
|
||||||
margin-top: -15px;
|
|
||||||
width: 25px;
|
|
||||||
height: 25px;
|
|
||||||
line-height: 25px; }
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-sm > div > .uf {
|
|
||||||
font-size: 25px; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-primary > div > .uf {
|
|
||||||
color: #3f51b5; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-success > div > .uf {
|
|
||||||
color: #4caf50; }
|
|
||||||
|
|
||||||
.u-loading.u-loading-rotate.u-loading-rotate-warning > div > .uf {
|
|
||||||
color: #ff9800; }
|
|
||||||
|
|
||||||
.u-loading-backdrop {
|
|
||||||
position: absolute;
|
|
||||||
top: 0;
|
|
||||||
right: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
z-index: 1900;
|
|
||||||
opacity: .7;
|
|
||||||
filter: blur(0.5px);
|
|
||||||
background-color: #fff; }
|
|
||||||
.u-loading-backdrop.full-screen {
|
|
||||||
position: fixed; }
|
|
||||||
|
|
||||||
@keyframes rotate {
|
|
||||||
0% {
|
|
||||||
transform: rotate(0deg) scale(1); }
|
|
||||||
50% {
|
|
||||||
transform: rotate(180deg) scale(1); }
|
|
||||||
100% {
|
|
||||||
transform: rotate(360deg) scale(1); } }
|
|
||||||
|
|
||||||
.u-loading.u-loading-line {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 50%;
|
|
||||||
margin-top: -30px;
|
|
||||||
margin-left: -25px; }
|
|
||||||
.u-loading.u-loading-line > div {
|
|
||||||
background-color: #C2C3C5;
|
|
||||||
width: 6px;
|
|
||||||
height: 50px;
|
|
||||||
border-radius: 2px;
|
|
||||||
margin: 2px;
|
|
||||||
animation-fill-mode: both;
|
|
||||||
display: inline-block; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-lg {
|
|
||||||
margin-top: -50px;
|
|
||||||
margin-left: -30px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-lg > div {
|
|
||||||
width: 8px;
|
|
||||||
height: 90px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-sm {
|
|
||||||
margin-top: -22px;
|
|
||||||
margin-left: -20px; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-sm > div {
|
|
||||||
width: 4px;
|
|
||||||
height: 35px; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(1) {
|
|
||||||
animation: line-scale 1s 0.1s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #F44336; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(2) {
|
|
||||||
animation: line-scale 1s 0.2s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #7ED321; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(3) {
|
|
||||||
animation: line-scale 1s 0.3s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #0084FF; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(4) {
|
|
||||||
animation: line-scale 1s 0.4s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #FF9800; }
|
|
||||||
.u-loading.u-loading-line div:nth-child(5) {
|
|
||||||
animation: line-scale 1s 0.5s infinite cubic-bezier(0.2, 0.68, 0.18, 1.08);
|
|
||||||
background-color: #D0021B; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-primary > div {
|
|
||||||
background-color: #3f51b5; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-success > div {
|
|
||||||
background-color: #4caf50; }
|
|
||||||
.u-loading.u-loading-line.u-loading-line-warning > div {
|
|
||||||
background-color: #ff9800; }
|
|
||||||
|
|
||||||
@keyframes line-scale {
|
|
||||||
0% {
|
|
||||||
transform: scaley(1); }
|
|
||||||
50% {
|
|
||||||
transform: scaley(0.4); }
|
|
||||||
100% {
|
|
||||||
transform: scaley(1); } }
|
|
||||||
|
|
||||||
.u-table {
|
.u-table {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: #666;
|
color: #212121;
|
||||||
position: relative;
|
position: relative;
|
||||||
line-height: 1.5;
|
line-height: 1.5;
|
||||||
overflow: hidden; }
|
overflow: hidden; }
|
||||||
|
|
@ -165,7 +19,7 @@
|
||||||
border-collapse: collapse;
|
border-collapse: collapse;
|
||||||
text-align: left; }
|
text-align: left; }
|
||||||
.u-table th {
|
.u-table th {
|
||||||
font-weight: bold;
|
font-weight: normal;
|
||||||
text-align: left; }
|
text-align: left; }
|
||||||
.u-table th[colspan] {
|
.u-table th[colspan] {
|
||||||
text-align: center; }
|
text-align: center; }
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "bee-table",
|
"name": "bee-table",
|
||||||
"version": "2.0.8",
|
"version": "2.0.9",
|
||||||
"description": "Table ui component for react",
|
"description": "Table ui component for react",
|
||||||
"keywords": [
|
"keywords": [
|
||||||
"react",
|
"react",
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
@import "../node_modules/tinper-bee-core/scss/minxin-variables";
|
@import "../node_modules/tinper-bee-core/scss/minxin-variables";
|
||||||
@import "../node_modules/tinper-bee-core/scss/minxin-mixins";
|
@import "../node_modules/tinper-bee-core/scss/minxin-mixins";
|
||||||
@import "../node_modules/bee-loading/src/Loading";
|
// @import "../node_modules/bee-loading/src/Loading";
|
||||||
|
|
||||||
$text-color: #666;
|
$text-color: $font-color-base;
|
||||||
$font-size-base: 12px;
|
$font-size-base: 12px;
|
||||||
$line-height: 1.5;
|
$line-height: 1.5;
|
||||||
// 主题定制border：
|
// 主题定制border：
|
||||||
|
|
@ -44,7 +44,7 @@ $checkbox-height:16px;
|
||||||
|
|
||||||
th {
|
th {
|
||||||
// background: $table-head-background-color;
|
// background: $table-head-background-color;
|
||||||
font-weight: bold;
|
font-weight: normal;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
// transition: background 0.3s ease;
|
// transition: background 0.3s ease;
|
||||||
&[colspan] {
|
&[colspan] {
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue