publish 2.0.16

build/Table.css

@@ -310,7 +310,7 @@
   .u-table-filter-column-pop-cont {
     margin: 0px;
     max-height: 300px;
-    overflow-y: scroll;
+    overflow-y: auto;
     color: #212121; }
   .u-table-filter-column-clear-setting {
     cursor: pointer;
@@ -384,6 +384,11 @@
     display: none; }
   .u-table ::-webkit-scrollbar-track-piece {
     display: none; }
+  .u-table .row-dragg-able {
+    cursor: move; }
+  .u-table .u-table-drag-hidden-cont {
+    width: 100px;
+    height: 40px; }
 
 .u-table:focus {
   outline: none;
@@ -617,3 +622,21 @@
 .u-table-drag-hidden-cont {
   position: absolute;
   top: -1000px; }
+
+.u-editable-table .u-table .u-table-row-hover .editable-cell-text-wrapper {
+  padding-left: 4px;
+  border: 1px solid #c1c7d0; }
+
+.u-editable-table .u-table .editable-cell-text-wrapper:hover {
+  padding-left: 4px;
+  border: 1px solid #a5adba; }
+
+.u-editable-table .u-table .editable-cell-input-wrapper:focus {
+  outline: none; }
+
+.u-editable-table-tp .tooltip-arrow {
+  top: 1px !important;
+  border-bottom-color: #F44336 !important; }
+
+.u-editable-table-tp .tooltip-inner {
+  border-color: #F44336 !important; }

build/Table.js

@@ -173,14 +173,33 @@ var Table = function (_Component) {
       });
     };
 
-    _this.onDragRow = function (currentIndex, targetIndex) {
-      var data = _this.state.data,
-          currentObj = data[currentIndex],
-          targetObj = data[targetIndex];
+    _this.getTableUID = function () {
+      var uid = "_table_uid_" + new Date().getTime();
+      _this.tableUid = uid;
+      var div = document.createElement("div");
+      // div.className = "u-table-drag-hidden-cont";
+      div.className = "u-table-drag-hidden-cont";
+      div.id = uid;
+      _this.contentTable.appendChild(div);
+    };
 
-      console.log(currentIndex + " ----------onRowDragEnd-------- " + targetIndex);
+    _this.onDragRow = function (currentKey, targetKey) {
+      var data = _this.state.data,
+          currentIndex = void 0,
+          targetIndex = void 0;
+      data.forEach(function (da, i) {
+        if (da.key == currentKey) {
+          currentIndex = i;
+        }
+        if (da.key == targetKey) {
+          targetIndex = i;
+        }
+      });
+      if (currentIndex < targetIndex) {
         data.splice(targetIndex, 0, data.splice(currentIndex, 1).shift());
-      console.log(" _data---- ", data);
+      } else {
+        data.splice(targetIndex + 1, 0, data.splice(currentIndex, 1).shift());
+      }
       _this.setState({
         data: data
       });
@@ -283,10 +302,12 @@ var Table = function (_Component) {
     _this.handleRowHover = _this.handleRowHover.bind(_this);
     _this.computeTableWidth = _this.computeTableWidth.bind(_this);
     _this.onBodyMouseLeave = _this.onBodyMouseLeave.bind(_this);
+    _this.tableUid = null;
     return _this;
   }
 
   Table.prototype.componentDidMount = function componentDidMount() {
+    this.getTableUID();
     _utils.EventUtil.addHandler(this.contentTable, 'keydown', this.onKeyDown);
     _utils.EventUtil.addHandler(this.contentTable, 'focus', this.onFocus);
     setTimeout(this.resetScrollX, 300);
@@ -786,7 +807,7 @@ var Table = function (_Component) {
         indent: indent,
         indentSize: props.indentSize,
         needIndentSpaced: needIndentSpaced,
-        className: className,
+        className: className + ' ' + (this.props.rowDraggAble ? ' row-dragg-able ' : ''),
         record: record,
         expandIconAsCell: expandIconAsCell,
         onDestroy: this.onRowDestroy,
@@ -820,7 +841,8 @@ var Table = function (_Component) {
         bodyDisplayInRow: props.bodyDisplayInRow,
         rowDraggAble: this.props.rowDraggAble,
         onDragRow: this.onDragRow,
-        contentTable: this.contentTable
+        contentTable: this.contentTable,
+        tableUid: this.tableUid
       })));
       this.treeRowIndex++;
       var subVisible = visible && isRowExpanded;

build/TableRow.js

@@ -102,6 +102,11 @@ var TableRow = function (_Component) {
           target = _utils.Event.getTarget(event);
       _this.currentIndex = target.getAttribute("data-row-key");
       _this._dragCurrent = target;
+
+      //TODO 自定义图像后续需要增加。
+      //  let crt = this.synchronizeTableTrShadow(); 
+      //  document.getElementById(this.props.tableUid).appendChild(crt);
+      // event.dataTransfer.setDragImage(crt, 0, 0);
       event.dataTransfer.effectAllowed = "move";
       event.dataTransfer.setData("Text", _this.currentIndex);
     };
@@ -119,15 +124,37 @@ var TableRow = function (_Component) {
       var event = _utils.Event.getEvent(e),
           _target = _utils.Event.getTarget(event),
           target = _target.parentNode;
-      var currentIndex = target.getAttribute("data-row-key");
-      if (!currentIndex || currentIndex === _this.currentIndex) return;
+
+      var currentKey = event.dataTransfer.getData("text");
+      var targetKey = target.getAttribute("data-row-key");
+
+      if (!targetKey || targetKey === currentKey) return;
       if (target.nodeName.toUpperCase() === "TR") {
-        _this.synchronizeTableTr(_this.currentIndex, null);
+        _this.synchronizeTableTr(currentKey, null);
+        _this.synchronizeTableTr(targetKey, null);
         // target.setAttribute("style","");
         // this.synchronizeTrStyle(this.currentIndex,false);
       }
-      var _currentIndex = event.dataTransfer.getData("text");
-      onDragRow && onDragRow(parseInt(_this.currentIndex--), parseInt(currentIndex--));
+      onDragRow && onDragRow(currentKey, targetKey);
+    };
+
+    _this.synchronizeTableTrShadow = function () {
+      var _this$props2 = _this.props,
+          contentTable = _this$props2.contentTable,
+          index = _this$props2.index;
+
+
+      var _table_cont = contentTable.querySelector('.u-table-scroll table tbody').getElementsByTagName("tr")[index],
+          _table_trs = _table_cont.getBoundingClientRect(),
+          _table_fixed_left_trs = contentTable.querySelector('.u-table-fixed-left table tbody').getElementsByTagName("tr")[index].getBoundingClientRect(),
+          _table_fixed_right_trs = contentTable.querySelector('.u-table-fixed-right table tbody').getElementsByTagName("tr")[index].getBoundingClientRect();
+
+      var div = document.createElement("div");
+      var style = "wdith:" + (_table_trs.width + _table_fixed_left_trs.width + _table_fixed_right_trs.width) + "px";
+      style += "height:" + _table_trs.height + "px";
+      style += "classname:" + _table_cont.className;
+      div.setAttribute("style", style);
+      return div;
     };
 
     _this.synchronizeTableTr = function (currentIndex, type) {
@@ -274,6 +301,12 @@ var TableRow = function (_Component) {
    */
 
 
+  /**
+   *同步当前拖拽到阴影
+   * @memberof TableRow
+   */
+
+
   /**
    * 同步自己,也需要同步当前行的行显示
    */

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bee-table",
-  "version": "2.0.15",
+ "version": "2.0.16",
  "description": "Table ui component for react",
  "keywords": [
   "react",