dtable-ui-component 6.0.29-beta9 → 6.0.30

package/lib/{DepartmentSingleSelectEditor/pc-editor → Department-editor}/index.css

@@ -22,8 +22,6 @@
   font-size: 14px;
   display: inline-block;
   color: #666666;
-  padding: 10px;
-  overflow: auto;
 }
 
 .dtable-ui.department-editor-list .department-item-left-content {
@@ -70,24 +68,19 @@
   color: #212529;
 }
 
-.dtable-ui.department-editor-list .editor-department-container .dtable-icon-down3 {
+.dtable-ui.department-editor-list .editor-department-container .expand {
   color: #b5b5b5;
   font-size: 12px;
-  transform: scale(0.8) rotate(-90deg);
-  
+  transform: scale(0.8);
   cursor: pointer;
   display: inline-block;
   margin-left: 0px !important;
 }
 
-.dtable-ui.department-editor-list .editor-department-container .dtable-icon-down3:hover {
+.dtable-ui.department-editor-list .editor-department-container .expand:hover {
   color: #555;
 }
 
-.dtable-ui.department-editor-list .editor-department-container .dtable-icon-down3.expand {
-  transform: scale(0.8);
-}
-
 .selected-departments.dtable-ui {
   background-color: #f6f6f6;
   padding: 5px;

package/lib/{DepartmentSingleSelectEditor/pc-editor → Department-editor}/index.js

@@ -7,20 +7,23 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _DTablePopover = _interopRequireDefault(require("../../DTablePopover"));
+var _DTablePopover = _interopRequireDefault(require("../DTablePopover"));
+var _constants = require("./constants");
 var _departmentSingleSelect = _interopRequireDefault(require("./department-single-select"));
+var _lang = require("../lang");
 require("./index.css");
-class PCDepartmentSingleSelectEditor extends _react.Component {
+class DepartmentSingleSelectEditor extends _react.Component {
   constructor(props) {
     super(props);
     this.onCommit = value => {
       const {
-        onCommit
+        onCommit,
+        column
       } = this.props;
       this.setState({
         value
       }, () => {
-        this.isRowExpand ? onCommit(value) : onCommit();
+        this.isRowExpand ? onCommit(this.getValue(), column) : onCommit();
       });
     };
     this.getValue = () => {
@@ -28,14 +31,28 @@ class PCDepartmentSingleSelectEditor extends _react.Component {
       updated[this.props.column.key] = this.state.value;
       return updated;
     };
+    this.createSpecificDepartments = () => {
+      return _constants.DEPARTMENT_SELECT_RANGE_OPTIONS.slice(0, 2).map(option => {
+        const {
+          type,
+          name
+        } = option;
+        return {
+          value: type,
+          label: /*#__PURE__*/_react.default.createElement("span", {
+            className: "text-truncate department-name"
+          }, (0, _lang.getLocale)(name))
+        };
+      });
+    };
     const {
-      column,
+      column: _column,
       isInModal,
       value: _value,
       height
     } = props;
-    const editorWidth = column.width > 300 ? column.width : 300;
-    const data = column.data || {};
+    const editorWidth = _column.width > 300 ? _column.width : 300;
+    const data = _column.data || {};
     this.state = {
       value: _value || '',
       menuStyle: isInModal ? {} : {
@@ -86,4 +103,4 @@ class PCDepartmentSingleSelectEditor extends _react.Component {
     }, dom)) : dom;
   }
 }
-var _default = exports.default = PCDepartmentSingleSelectEditor;
+var _default = exports.default = DepartmentSingleSelectEditor;

package/lib/{SelectedDepartments → Department-editor/selected-departments}/index.css

@@ -1,3 +1,4 @@
+
 .selected-departments.dtable-ui .remove-container {
   width: 16px;
   text-align: right;

package/lib/{SelectedDepartments → Department-editor/selected-departments}/index.js

@@ -7,8 +7,8 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _dtableUtils = require("dtable-utils");
-var _departments = require("../constants/departments");
-var _lang = require("../lang");
+var _constants = require("../constants");
+var _lang = require("../../lang");
 require("./index.css");
 function SelectedDepartments(_ref) {
   let {
@@ -26,7 +26,7 @@ function SelectedDepartments(_ref) {
   }, [departments]);
   const dom = Array.isArray(value) ? value.map((content, index) => {
     if ([_dtableUtils.DEPARTMENT_SELECT_RANGE_MAP.CURRENT_USER_DEPARTMENT, _dtableUtils.DEPARTMENT_SELECT_RANGE_MAP.CURRENT_USER_DEPARTMENT_AND_SUB].includes(content)) {
-      const name = (0, _lang.getLocale)(_departments.DEPARTMENT_SELECT_RANGE_OPTIONS.find(option => option.type === content).name);
+      const name = (0, _lang.getLocale)(_constants.DEPARTMENT_SELECT_RANGE_OPTIONS.find(option => option.type === content).name);
       return /*#__PURE__*/_react.default.createElement("div", {
         key: "department-".concat(index),
         className: "department mr-1"

package/lib/DigitalSignEditor/index.js

@@ -7,28 +7,175 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
-var _reactResponsive = _interopRequireDefault(require("react-responsive"));
-var _pcEditor = _interopRequireDefault(require("./pc-editor"));
-var _mbEditor = _interopRequireDefault(require("./mb-editor"));
-const DigitalSignEditor = /*#__PURE__*/(0, _react.forwardRef)((_ref, ref) => {
-  let {
-    isMobile,
-    ...props
-  } = _ref;
-  if (isMobile === false) return /*#__PURE__*/_react.default.createElement(_pcEditor.default, Object.assign({}, props, {
-    ref: ref
-  }));
-  if (isMobile === true) return /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
-    ref: ref
-  }));
-  return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(min-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_pcEditor.default, Object.assign({}, props, {
-    ref: ref
-  }))), /*#__PURE__*/_react.default.createElement(_reactResponsive.default, {
-    query: "(max-width: 768px)"
-  }, /*#__PURE__*/_react.default.createElement(_mbEditor.default, Object.assign({}, props, {
-    ref: ref
-  }))));
-});
+var _reactstrap = require("reactstrap");
+var _DTableCustomFooter = _interopRequireDefault(require("../DTableCustomFooter"));
+var _signatureBoard = _interopRequireDefault(require("./signature-board"));
+var _service = _interopRequireDefault(require("./service"));
+var _utils = _interopRequireDefault(require("./utils"));
+var _url = require("../utils/url");
+var _toaster = _interopRequireDefault(require("../toaster"));
+var _lang = require("../lang");
+var _utils2 = require("../utils/utils");
+require("./index.css");
+class DigitalSignEditor extends _react.Component {
+  constructor(props) {
+    super(props);
+    this.setPosition = () => {
+      if (!this.editor) return;
+      const {
+        offsetLeft,
+        offsetTop
+      } = this.editor.parentNode;
+      const {
+        offsetWidth: editorWidth,
+        offsetHeight: editorHeight
+      } = this.editor;
+      let editorLeft = offsetLeft - editorWidth;
+      let editorTop = offsetTop;
+      if (this.props.isInModal) {
+        const innerHeight = window.innerHeight;
+        const offsetTop = this.editor.parentNode.getBoundingClientRect().y;
+        editorTop = offsetTop;
+        editorTop = editorHeight + editorTop > innerHeight ? innerHeight - editorHeight - 30 : editorTop;
+        editorLeft = -30;
+      } else {
+        if (offsetLeft < editorWidth) {
+          editorLeft = offsetLeft + this.props.column.width;
+        }
+        if (editorLeft + editorWidth > window.innerWidth) {
+          editorLeft = window.innerWidth - editorWidth;
+        }
+        if (offsetTop + editorHeight > window.innerHeight) {
+          editorTop = window.innerHeight - editorHeight - 10;
+        }
+      }
+      this.setState({
+        editorPosition: {
+          top: editorTop,
+          left: editorLeft
+        }
+      });
+    };
+    this.getValue = () => {
+      const updated = {
+        [this.props.column.key]: this.value
+      };
+      return updated;
+    };
+    this.saveSignature = () => {
+      if (!this.signatureBoard || this.state.saving) return;
+      if (!this.signatureBoard.checkHasChanged()) {
+        this.props.onCommitCancel();
+        return;
+      }
+      this.signatureBoard.convert2BlobPNG(signBlob => {
+        if (!signBlob) {
+          if (!this.props.value) {
+            this.props.onCommitCancel();
+            return;
+          }
+
+          // clear the old dtable-ui-digital-sign
+          this.value = null;
+          this.props.onCommit(this.value);
+          return;
+        }
+        this.setState({
+          saving: true
+        });
+        this.digitalService.uploadSignImage(signBlob, {
+          successCallback: signature => {
+            this.value = signature;
+            this.setState({
+              saving: false
+            }, () => {
+              this.props.onCommit(Object.assign({}, this.value));
+            });
+          },
+          failedCallback: error => {
+            const errMsg = (0, _utils2.getErrorMsg)(error, true);
+            if (!error.response || error.response.status !== 403) {
+              _toaster.default.danger((0, _lang.getLocale)(errMsg));
+            }
+            this.setState({
+              saving: false
+            });
+          }
+        });
+      });
+    };
+    this.clearSignature = () => {
+      this.signatureBoard.clear();
+    };
+    this.state = {
+      editorPosition: {},
+      saving: false
+    };
+    const {
+      uploadFile,
+      config,
+      value
+    } = props;
+    const {
+      username
+    } = config || {};
+    this.value = value || {};
+    this.digitalService = new _service.default({
+      uploadFile,
+      username
+    });
+  }
+  componentDidMount() {
+    this.setPosition();
+  }
+  render() {
+    const {
+      value,
+      config
+    } = this.props;
+    const {
+      editorPosition,
+      saving
+    } = this.state;
+    const signImageUrl = (0, _url.generateCurrentBaseImageUrl)({
+      ...config,
+      partUrl: _utils.default.getSignImageUrl(value)
+    });
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-digital-sign-editor-container",
+      ref: ref => this.editor = ref,
+      style: {
+        ...editorPosition,
+        zIndex: 1000
+      }
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-digital-sign-editor-header"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-digital-sign-editor-logo"
+    }, /*#__PURE__*/_react.default.createElement("i", {
+      className: "dtable-font dtable-icon-handwritten-signature"
+    }), /*#__PURE__*/_react.default.createElement("span", {
+      className: "ml-2 dtable-ui-digital-sign-editor-title"
+    }, (0, _lang.getLocale)('Digital_signature'))), /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-digital-sign-editor-operations"
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: "btn-clear-dtable-ui-digital-sign",
+      onClick: this.clearSignature
+    }, /*#__PURE__*/_react.default.createElement("i", {
+      className: "dtable-font dtable-icon-clear-format"
+    }), /*#__PURE__*/_react.default.createElement("span", null, (0, _lang.getLocale)('Re-sign'))))), /*#__PURE__*/_react.default.createElement("div", {
+      className: "dtable-ui-digital-sign-panel"
+    }, /*#__PURE__*/_react.default.createElement(_signatureBoard.default, {
+      ref: ref => this.signatureBoard = ref,
+      signImageUrl: signImageUrl
+    })), /*#__PURE__*/_react.default.createElement(_DTableCustomFooter.default, null, /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
+      onClick: this.props.onCommitCancel,
+      color: "secondary"
+    }, (0, _lang.getLocale)('Cancel')), /*#__PURE__*/_react.default.createElement(_reactstrap.Button, {
+      onClick: this.saveSignature,
+      color: "primary",
+      disabled: saving
+    }, (0, _lang.getLocale)(saving ? 'Saving' : 'Save'))));
+  }
+}
 var _default = exports.default = DigitalSignEditor;

package/lib/Drawer/index.css

@@ -0,0 +1,144 @@
+@import url('../css/am.css');
+
+.am-drawer {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: hidden;
+}
+
+.am-drawer-sidebar {
+  z-index: 4;
+  position: absolute;
+  -webkit-transition: -webkit-transform 0.3s ease-out;
+  transition: -webkit-transform 0.3s ease-out;
+  transition: transform 0.3s ease-out;
+  transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out;
+  will-change: transform;
+  overflow-y: auto;
+}
+
+.am-drawer-draghandle {
+  z-index: 1;
+  position: absolute;
+  background-color: rgba(50, 50, 50, 0.1);
+}
+
+.am-drawer-overlay {
+  z-index: 3;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  opacity: 0;
+  visibility: hidden;
+  -webkit-transition: opacity 0.5s ease-out;
+  transition: opacity 0.5s ease-out;
+  background-color: rgba(0, 0, 0, 0.4);
+}
+
+.am-drawer-content {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: auto;
+  -webkit-transition: left 0.3s ease-out, right 0.3s ease-out;
+  transition: left 0.3s ease-out, right 0.3s ease-out;
+}
+
+.am-drawer.am-drawer-left .am-drawer-sidebar,
+.am-drawer.am-drawer-right .am-drawer-sidebar,
+.am-drawer.am-drawer-left .am-drawer-draghandle,
+.am-drawer.am-drawer-right .am-drawer-draghandle {
+  top: 0;
+  bottom: 0;
+}
+
+.am-drawer.am-drawer-left .am-drawer-draghandle,
+.am-drawer.am-drawer-right .am-drawer-draghandle {
+  width: 10px;
+  height: 100%;
+}
+
+.am-drawer.am-drawer-top .am-drawer-sidebar,
+.am-drawer.am-drawer-bottom .am-drawer-sidebar,
+.am-drawer.am-drawer-top .am-drawer-draghandle,
+.am-drawer.am-drawer-bottom .am-drawer-draghandle {
+  left: 0;
+  right: 0;
+}
+
+.am-drawer.am-drawer-top .am-drawer-draghandle,
+.am-drawer.am-drawer-bottom .am-drawer-draghandle {
+  width: 100%;
+  height: 10px;
+}
+
+.am-drawer.am-drawer-left .am-drawer-sidebar {
+  left: 0;
+  -webkit-transform: translateX(-100%);
+  -ms-transform: translateX(-100%);
+  transform: translateX(-100%);
+}
+
+.am-drawer-open.am-drawer.am-drawer-left .am-drawer-sidebar {
+  -webkit-box-shadow: 1PX 1PX 2px rgba(0, 0, 0, 0.15);
+  box-shadow: 1PX 1PX 2px rgba(0, 0, 0, 0.15);
+}
+
+.am-drawer.am-drawer-left .am-drawer-draghandle {
+  left: 0;
+}
+
+.am-drawer.am-drawer-right .am-drawer-sidebar {
+  right: 0;
+  -webkit-transform: translateX(100%);
+  -ms-transform: translateX(100%);
+  transform: translateX(100%);
+}
+
+.am-drawer-open.am-drawer.am-drawer-right .am-drawer-sidebar {
+  -webkit-box-shadow: -1PX 1PX 2px rgba(0, 0, 0, 0.15);
+  box-shadow: -1PX 1PX 2px rgba(0, 0, 0, 0.15);
+}
+
+.am-drawer.am-drawer-right .am-drawer-draghandle {
+  right: 0;
+}
+
+.am-drawer.am-drawer-top .am-drawer-sidebar {
+  top: 0;
+  -webkit-transform: translateY(-100%);
+  -ms-transform: translateY(-100%);
+  transform: translateY(-100%);
+}
+
+.am-drawer-open.am-drawer.am-drawer-top .am-drawer-sidebar {
+  -webkit-box-shadow: 1PX 1PX 2px rgba(0, 0, 0, 0.15);
+  box-shadow: 1PX 1PX 2px rgba(0, 0, 0, 0.15);
+}
+
+.am-drawer.am-drawer-top .am-drawer-draghandle {
+  top: 0;
+}
+
+.am-drawer.am-drawer-bottom .am-drawer-sidebar {
+  bottom: 0;
+  -webkit-transform: translateY(100%);
+  -ms-transform: translateY(100%);
+  transform: translateY(100%);
+}
+
+.am-drawer-open.am-drawer.am-drawer-bottom .am-drawer-sidebar {
+  -webkit-box-shadow: 1PX -1PX 2px rgba(0, 0, 0, 0.15);
+  box-shadow: 1PX -1PX 2px rgba(0, 0, 0, 0.15);
+}
+
+.am-drawer.am-drawer-bottom .am-drawer-draghandle {
+  bottom: 0;
+}

package/lib/Drawer/index.js

@@ -0,0 +1,21 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _rmcDrawer = _interopRequireDefault(require("rmc-drawer"));
+var React = _interopRequireWildcard(require("react"));
+require("./index.css");
+class Drawer extends React.Component {
+  render() {
+    return /*#__PURE__*/React.createElement(_rmcDrawer.default, this.props);
+  }
+}
+exports.default = Drawer;
+Drawer.defaultProps = {
+  prefixCls: 'am-drawer',
+  enableDragHandle: false
+};

package/lib/FileEditor/addition-previewer/index.css

@@ -0,0 +1 @@
+@import url('../../ImageEditor/addition-previewer/index.css');

package/lib/FileEditor/{pc-editor/addition-previewer → addition-previewer}/index.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _localFileAddition = _interopRequireDefault(require("./local-file-addition"));
-var _lang = require("../../../lang");
+var _lang = require("../../lang");
 require("./index.css");
 class AdditionPreviewer extends _react.default.Component {
   constructor(props) {

package/lib/FileEditor/addition-previewer/local-file-addition/index.css

@@ -0,0 +1 @@
+@import url('../../../ImageEditor/addition-previewer/local-image-addition/index.css');

package/lib/FileEditor/{pc-editor/addition-previewer → addition-previewer}/local-file-addition/index.js

@@ -9,10 +9,10 @@ exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _classnames = _interopRequireDefault(require("classnames"));
 var _reactstrap = require("reactstrap");
-var _UploadProgress = _interopRequireDefault(require("../../../../UploadProgress"));
-var _url = require("../../../../utils/url");
-var _FileUploader = _interopRequireDefault(require("../../../../FileUploader"));
-var _lang = require("../../../../lang");
+var _UploadProgress = _interopRequireDefault(require("../../../UploadProgress"));
+var _url = require("../../../utils/url");
+var _FileUploader = _interopRequireDefault(require("../../../FileUploader"));
+var _lang = require("../../../lang");
 require("./index.css");
 class LocalFileAddition extends _react.default.Component {
   constructor(props) {

package/lib/FileEditor/files-previewer/{pc-previewer/file-previewer → file-previewer}/dropdown-menu.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
-var _lang = require("../../../../lang");
+var _lang = require("../../../lang");
 class FileDropdownMenu extends _react.default.Component {
   constructor(props) {
     super(props);

package/lib/FileEditor/files-previewer/{pc-previewer/file-previewer → file-previewer}/file-name-editor/index.js

@@ -7,7 +7,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.default = void 0;
 var _react = _interopRequireWildcard(require("react"));
 var _reactstrap = require("reactstrap");
-var _constants = require("../../../../../constants");
+var _constants = require("../../../../constants");
 require("./index.css");
 class FileNameEditor extends _react.Component {
   constructor(props) {

package/lib/FileEditor/files-previewer/{pc-previewer/file-previewer → file-previewer}/index.css

@@ -84,3 +84,5 @@
   color: #000;
   opacity: 0.75;
 }
+
+

package/lib/FileEditor/files-previewer/{pc-previewer/file-previewer → file-previewer}/index.js

@@ -9,8 +9,8 @@ var _react = _interopRequireDefault(require("react"));
 var _reactstrap = require("reactstrap");
 var _dropdownMenu = _interopRequireDefault(require("./dropdown-menu"));
 var _fileNameEditor = _interopRequireDefault(require("./file-name-editor"));
-var _utils = require("../../../utils");
-var _url = require("../../../../utils/url");
+var _utils = require("../../utils");
+var _url = require("../../../utils/url");
 require("./index.css");
 class FilePreviewer extends _react.default.Component {
   constructor(props) {