dtable-ui-component 0.3.0 → 0.3.2-alpha1

package/lib/editor-formatter.js

@@ -0,0 +1,369 @@
+import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
+import _createClass from "@babel/runtime/helpers/esm/createClass";
+import _inherits from "@babel/runtime/helpers/esm/inherits";
+import _createSuper from "@babel/runtime/helpers/esm/createSuper";
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+
+var _emptyTypeMap;
+
+import React, { Fragment } from 'react';
+import { CellType } from 'dtable-store';
+import { TextFormatter, NumberFormatter, CheckboxFormatter, DateFormatter, SingleSelectFormatter, MultipleSelectFormatter, CollaboratorFormatter, SimpleLongTextFormatter, GeolocationFormatter, LinkFormatter, CTimeFormatter, CreatorFormatter, LastModifierFormatter, MTimeFormatter, AutoNumberFormatter, UrlFormatter, EmailFormatter, DurationFormatter, RateFormatter, ButtonFormatter, ImageFormatter, RowExpandFileFormatter // LongTextFormatter,
+// FormulaFormatter,
+} from './index';
+import { COLLABORATORS } from './data/dtable-value';
+var emptyTypeMap = (_emptyTypeMap = {}, _defineProperty(_emptyTypeMap, CellType.TEXT, true), _defineProperty(_emptyTypeMap, CellType.LONG_TEXT, true), _defineProperty(_emptyTypeMap, CellType.GEOLOCATION, true), _defineProperty(_emptyTypeMap, CellType.SINGLE_SELECT, true), _defineProperty(_emptyTypeMap, CellType.MULTIPLE_SELECT, true), _defineProperty(_emptyTypeMap, CellType.CTIME, true), _defineProperty(_emptyTypeMap, CellType.MTIME, true), _defineProperty(_emptyTypeMap, CellType.DATE, true), _defineProperty(_emptyTypeMap, CellType.AUTO_NUMBER, true), _defineProperty(_emptyTypeMap, CellType.URL, true), _defineProperty(_emptyTypeMap, CellType.EMAIL, true), _defineProperty(_emptyTypeMap, CellType.DURATION, true), _defineProperty(_emptyTypeMap, CellType.IMAGE, true), _defineProperty(_emptyTypeMap, CellType.FILE, true), _emptyTypeMap);
+
+var noop = function noop() {};
+
+var EditorFormatter = /*#__PURE__*/function (_React$Component) {
+  _inherits(EditorFormatter, _React$Component);
+
+  var _super = _createSuper(EditorFormatter);
+
+  function EditorFormatter(props) {
+    var _this;
+
+    _classCallCheck(this, EditorFormatter);
+
+    _this = _super.call(this, props);
+
+    _this.renderEmptyFormatter = function () {
+      var emptyFormatter = /*#__PURE__*/React.createElement("span", {
+        className: "row-cell-empty d-inline-block"
+      });
+
+      if (_this.props.type === 'row_title') {
+        emptyFormatter = /*#__PURE__*/React.createElement("span", null, "\u672A\u547D\u540D\u884C");
+      }
+
+      return emptyFormatter;
+    };
+
+    _this.renderFormatter = function () {
+      var _this$props = _this.props,
+          column = _this$props.column,
+          row = _this$props.row,
+          CellType = _this$props.CellType,
+          className = _this$props.className;
+      var columnType = column.type;
+      var collaborators = _this.state.collaborators;
+      var containerClassName = "dtable-".concat(columnType, "-formatter ").concat(className || '');
+      var cellValue = row[column.key];
+
+      if (!cellValue && emptyTypeMap[columnType]) {
+        return _this.renderEmptyFormatter();
+      }
+
+      switch (columnType) {
+        case CellType.TEXT:
+          {
+            return /*#__PURE__*/React.createElement(TextFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.COLLABORATOR:
+          {
+            if (!cellValue || cellValue.length === 0) {
+              return _this.renderEmptyFormatter();
+            }
+
+            var collaboratorFormatter = /*#__PURE__*/React.createElement(CollaboratorFormatter, {
+              value: cellValue,
+              collaborators: collaborators,
+              containerClassName: containerClassName
+            });
+            return collaboratorFormatter;
+          }
+
+        case CellType.LONG_TEXT:
+          {
+            var longTextFormatter = /*#__PURE__*/React.createElement(SimpleLongTextFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              longTextFormatter = _this.renderEmptyFormatter();
+            }
+
+            return longTextFormatter;
+          }
+
+        case CellType.IMAGE:
+          {
+            var imageFormatter = /*#__PURE__*/React.createElement(ImageFormatter, {
+              value: cellValue
+            });
+
+            if (!cellValue || cellValue.length === 0) {
+              imageFormatter = _this.renderEmptyFormatter();
+            }
+
+            return imageFormatter;
+          }
+
+        case CellType.GEOLOCATION:
+          {
+            var geolocationFormatter = /*#__PURE__*/React.createElement(GeolocationFormatter, {
+              value: cellValue,
+              data: column.data,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              geolocationFormatter = _this.renderEmptyFormatter();
+            }
+
+            return geolocationFormatter;
+          }
+
+        case CellType.NUMBER:
+          {
+            var numberFormatter = /*#__PURE__*/React.createElement(NumberFormatter, {
+              value: cellValue,
+              data: column.data,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              numberFormatter = _this.renderEmptyFormatter();
+            }
+
+            return numberFormatter;
+          }
+
+        case CellType.DATE:
+          {
+            var dateFormatter = /*#__PURE__*/React.createElement(DateFormatter, {
+              value: cellValue,
+              format: column.data.format,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              dateFormatter = _this.renderEmptyFormatter();
+            }
+
+            return dateFormatter;
+          }
+
+        case CellType.MULTIPLE_SELECT:
+          {
+            var options = column.data ? column.data.options : [];
+            var multipleSelectFormatter = /*#__PURE__*/React.createElement(MultipleSelectFormatter, {
+              value: cellValue,
+              options: options,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue || cellValue.length === 0) {
+              multipleSelectFormatter = _this.renderEmptyFormatter();
+            }
+
+            return multipleSelectFormatter;
+          }
+
+        case CellType.SINGLE_SELECT:
+          {
+            var _options = column.data ? column.data.options : [];
+
+            var singleSelectFormatter = /*#__PURE__*/React.createElement(SingleSelectFormatter, {
+              value: cellValue,
+              options: _options,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              singleSelectFormatter = _this.renderEmptyFormatter();
+            }
+
+            return singleSelectFormatter;
+          }
+
+        case CellType.FILE:
+          {
+            var fileFormatter = /*#__PURE__*/React.createElement(RowExpandFileFormatter, {
+              value: cellValue,
+              column: column,
+              downloadFile: noop,
+              deleteFile: noop,
+              readOnly: false
+            });
+
+            if (!cellValue || cellValue.length === 0) {
+              fileFormatter = _this.renderEmptyFormatter();
+            }
+
+            return fileFormatter;
+          }
+
+        case CellType.CHECKBOX:
+          {
+            return /*#__PURE__*/React.createElement(CheckboxFormatter, {
+              value: cellValue
+            });
+          }
+
+        case CellType.CTIME:
+          {
+            var cTimeFormatter = /*#__PURE__*/React.createElement(CTimeFormatter, {
+              value: row._ctime,
+              containerClassName: containerClassName
+            });
+
+            if (!row._ctime) {
+              cTimeFormatter = _this.renderEmptyFormatter();
+            }
+
+            return cTimeFormatter;
+          }
+
+        case CellType.MTIME:
+          {
+            var mTimeFormatter = /*#__PURE__*/React.createElement(MTimeFormatter, {
+              value: row._mtime,
+              containerClassName: containerClassName
+            });
+
+            if (!row._mtime) {
+              mTimeFormatter = _this.renderEmptyFormatter();
+            }
+
+            return mTimeFormatter;
+          }
+
+        case CellType.CREATOR:
+          {
+            if (!cellValue) return _this.renderEmptyFormatter();
+            var creatorFormatter = /*#__PURE__*/React.createElement(CreatorFormatter, {
+              collaborators: collaborators,
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+            return creatorFormatter;
+          }
+
+        case CellType.LAST_MODIFIER:
+          {
+            if (!cellValue) return _this.renderEmptyFormatter();
+            var lastModifierFormatter = /*#__PURE__*/React.createElement(LastModifierFormatter, {
+              collaborators: collaborators,
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+            return lastModifierFormatter;
+          }
+
+        case CellType.FORMULA:
+        case CellType.LINK_FORMULA:
+          {
+            var textFormatter = /*#__PURE__*/React.createElement(TextFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+
+            if (!cellValue) {
+              textFormatter = _this.renderEmptyFormatter();
+            }
+
+            return textFormatter;
+          }
+
+        case CellType.LINK:
+          {
+            if (!Array.isArray(cellValue) || cellValue.length === 0) return _this.renderEmptyFormatter();
+            return /*#__PURE__*/React.createElement(LinkFormatter, {
+              value: cellValue,
+              column: column,
+              collaborators: collaborators,
+              containerClassName: 'map-app-link-formatter',
+              renderEmptyFormatter: _this.renderEmptyFormatter,
+              getOptionColors: _this.props.getOptionColors,
+              getUserCommonInfo: function getUserCommonInfo() {},
+              CellType: CellType
+            });
+          }
+
+        case CellType.AUTO_NUMBER:
+          {
+            return /*#__PURE__*/React.createElement(AutoNumberFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.URL:
+          {
+            return /*#__PURE__*/React.createElement(UrlFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.EMAIL:
+          {
+            return /*#__PURE__*/React.createElement(EmailFormatter, {
+              value: cellValue,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.DURATION:
+          {
+            return /*#__PURE__*/React.createElement(DurationFormatter, {
+              value: cellValue,
+              format: column.data.duration_format,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.RATE:
+          {
+            return /*#__PURE__*/React.createElement(RateFormatter, {
+              value: cellValue,
+              data: column.data,
+              containerClassName: containerClassName
+            });
+          }
+
+        case CellType.BUTTON:
+          {
+            var _column$data = column.data,
+                data = _column$data === void 0 ? {} : _column$data;
+            var buttonFormatter = /*#__PURE__*/React.createElement(ButtonFormatter, {
+              data: data,
+              containerClassName: containerClassName
+            });
+
+            if (!data.button_name) {
+              buttonFormatter = _this.renderEmptyFormatter();
+            }
+
+            return buttonFormatter;
+          }
+
+        default:
+          return null;
+      }
+    };
+
+    _this.state = {
+      collaborators: COLLABORATORS
+    };
+    return _this;
+  }
+
+  _createClass(EditorFormatter, [{
+    key: "render",
+    value: function render() {
+      return /*#__PURE__*/React.createElement(Fragment, null, this.renderFormatter());
+    }
+  }]);
+
+  return EditorFormatter;
+}(React.Component);
+
+export default EditorFormatter;

package/lib/index.js

@@ -32,7 +32,11 @@ export { default as RateFormatter } from './RateFormatter';
 export { default as ButtonFormatter } from './ButtonFormatter';
 export { default as ImagePreviewerLightbox } from './ImagePreviewerLightbox';
 export { default as CollaboratorItem } from './CollaboratorItem';
-export { default as FileItemFormatter } from './FileItemFormatter'; // editor
+export { default as FileItemFormatter } from './FileItemFormatter';
+export { default as DigitalSignFormatter } from './DigitalSignFormatter';
+export { default as SimpleLongTextFormatter } from './SimpleLongTextFormatter'; // row expand formatter
+
+export { default as RowExpandFileFormatter } from './FileFormatter/row-expand-file-formatter'; // editor
 
 export { default as TextEditor } from './TextEditor';
 export { default as NumberEditor } from './NumberEditor';

package/lib/lang/index.js

@@ -9,7 +9,7 @@ var langData = {
   'zh-cn': zh_CN
 };
 var LANGUAGE = 'en';
-var LANGUAGE_MAP = {};
+var LANGUAGE_MAP = langData[LANGUAGE];
 export function setLocale(args) {
   var lang = typeof args === 'string' ? args : LANGUAGE;
   LANGUAGE_MAP = langData[lang] || langData[LANGUAGE];

package/lib/locals/en.js

@@ -1,17 +1,20 @@
 var en = {
-  Add_an_option: "Add an option",
-  Find_an_option: "Find a option",
-  No_options_available: "No options available",
-  Current_option: "Current option",
-  No_option: "No option",
-  Choose_an_option: "Choose an option",
-  Add_a_collaborator: "Add a collaborator",
-  Find_a_collaborator: "Find a collaborator",
-  No_collaborators_available: "No collaborators available",
+  Add_an_option: 'Add an option',
+  Find_an_option: 'Find a option',
+  No_options_available: 'No options available',
+  Current_option: 'Current option',
+  No_option: 'No option',
+  Choose_an_option: 'Choose an option',
+  Add_a_collaborator: 'Add a collaborator',
+  Find_a_collaborator: 'Find a collaborator',
+  No_collaborators_available: 'No collaborators available',
   Done: 'Done',
-  Choose_a_collaborator: "Choose a collaborator",
-  Please_input: "Please input",
-  Please_select: "Please select",
-  Clear: "Clear"
+  Choose_a_collaborator: 'Choose a collaborator',
+  Please_input: 'Please input',
+  Please_select: 'Please select',
+  Clear: 'Clear',
+  Are_you_sure_you_want_to_delete_this_file: 'Are you sure you want to delete this file?',
+  Cancel: 'Cancel',
+  Delete: 'Delete'
 };
 export default en;

package/lib/locals/zh-CN.js

@@ -1,17 +1,20 @@
 var zh_CN = {
   Add_an_option: '添加一个选项',
-  Find_an_option: "查找标签",
-  No_options_available: "没有找到标签。",
-  Current_option: "当前标签",
-  No_option: "没有标签",
-  Choose_an_option: "选择一个标签",
-  Add_a_collaborator: "添加协作者",
-  Find_a_collaborator: "查找协作者",
-  No_collaborators_available: "没有找到协作者",
+  Find_an_option: '查找标签',
+  No_options_available: '没有找到标签。',
+  Current_option: '当前标签',
+  No_option: '没有标签',
+  Choose_an_option: '选择一个标签',
+  Add_a_collaborator: '添加协作者',
+  Find_a_collaborator: '查找协作者',
+  No_collaborators_available: '没有找到协作者',
   Done: '完成',
-  Choose_a_collaborator: "选择一个协作者",
-  Please_input: "请输入",
-  Please_select: "请选择",
-  Clear: "清空"
+  Choose_a_collaborator: '选择一个协作者',
+  Please_input: '请输入',
+  Please_select: '请选择',
+  Clear: '清空',
+  Are_you_sure_you_want_to_delete_this_file: '你确定要删除此文件吗？',
+  Cancel: '取消',
+  Delete: '删除'
 };
 export default zh_CN;

package/lib/utils/utils.js

@@ -41,4 +41,17 @@ export var isMac = function isMac() {
   var platform = navigator.platform; // eslint-disable-next-line eqeqeq
 
   return platform == 'Mac68K' || platform == 'MacPPC' || platform == 'Macintosh' || platform == 'MacIntel';
+};
+export var downloadFile = function downloadFile(downloadUrl) {
+  var downloadFrame = document.getElementById('dtableUiComponentDownloadFrame');
+
+  if (downloadFrame != null) {
+    document.body.removeChild(downloadFrame);
+  }
+
+  var iframe = document.createElement('iframe');
+  iframe.setAttribute('id', 'dtableUiComponentDownloadFrame');
+  iframe.style.display = 'none';
+  iframe.src = downloadUrl;
+  document.body.appendChild(iframe);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dtable-ui-component",
-  "version": "0.3.0",
+  "version": "0.3.2-alpha1",
   "main": "./lib/index.js",
   "dependencies": {
     "@seafile/react-image-lightbox": "0.0.9",
@@ -9,8 +9,10 @@
     "antd-mobile": "^2.3.3",
     "astro-classname": "^2.1.0",
     "bail": "1.0.5",
+    "classnames": "^2.3.2",
     "dayjs": "1.10.7",
     "deepmerge": "^2.1.0",
+    "dtable-store": "4.1.0",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.2",
     "glamor": "^2.20.40",
@@ -38,6 +40,7 @@
     "xtend": "^4.0.1"
   },
   "scripts": {
+    "lint": "./node_modules/.bin/eslint ./src/ --fix",
     "clean:esm": "rm -rf es && mkdir es",
     "clean:lib": "rm -rf lib && mkdir lib",
     "clean:dist": "rm -rf dist && mkdir dist",