@pisell/materials 1.0.4 → 1.0.6

package/es/components/table/Table/fields/rangePicker/index.js

@@ -0,0 +1,17 @@
+import Config from "./Config";
+import Edit from "./Edit";
+import Show from "./Show";
+import Sort from "./Sort";
+var field = {
+  field_icon: 'pi-a-Property3Singlelinetext',
+  field_name: 'RangePicker',
+  field_type: 'rangePicker',
+  default_value: 'RangePicker'
+};
+export default {
+  field: field,
+  config: Config,
+  edit: Edit,
+  sort: Sort,
+  show: Show
+};

package/es/components/table/Table/fields/select/Config/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Config: () => JSX.Element;
+export default Config;

package/es/components/table/Table/fields/select/Config/index.js

@@ -0,0 +1,4 @@
+var Config = function Config() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Config;

package/es/components/table/Table/fields/select/Edit/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { EditPropsType } from "../../types";
+declare const _default: import("react").ForwardRefExoticComponent<Omit<EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+export default _default;

package/es/components/table/Table/fields/select/Edit/index.js

@@ -0,0 +1,23 @@
+import { forwardRef } from "react";
+import Select from "../../../../../select";
+var Edit = function Edit(props, ref) {
+  var value = props.value,
+    onChange = props.onChange,
+    onBlur = props.onBlur,
+    style = props.style,
+    bordered = props.bordered,
+    options = props.options;
+  return /*#__PURE__*/React.createElement(Select, {
+    options: options || [],
+    bordered: bordered,
+    ref: ref,
+    value: value,
+    onChange: onChange,
+    style: style,
+    onBlur: onBlur,
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  });
+};
+export default /*#__PURE__*/forwardRef(Edit);

package/es/components/table/Table/fields/select/Show/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { FieldPropsType } from "../../types";
+declare const Show: (props: FieldPropsType) => JSX.Element;
+export default Show;

package/es/components/table/Table/fields/select/Show/index.js

@@ -0,0 +1,27 @@
+var _excluded = ["title", "editable", "dataIndex", "field_type", "record", "handleSave", "options"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { useMemo } from "react";
+var Show = function Show(props) {
+  var title = props.title,
+    editable = props.editable,
+    dataIndex = props.dataIndex,
+    field_type = props.field_type,
+    record = props.record,
+    handleSave = props.handleSave,
+    options = props.options,
+    restProps = _objectWithoutProperties(props, _excluded);
+  var text = useMemo(function () {
+    return record[dataIndex];
+  }, [record, dataIndex]);
+  var showValue = useMemo(function () {
+    var optionDetail = options === null || options === void 0 ? void 0 : options.find(function (item) {
+      return item.value === text;
+    });
+    return (optionDetail === null || optionDetail === void 0 ? void 0 : optionDetail.label) || text;
+  }, [options, text]);
+  return /*#__PURE__*/React.createElement("div", {
+    className: ""
+  }, showValue);
+};
+export default Show;

package/es/components/table/Table/fields/select/Sort/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Sort: () => JSX.Element;
+export default Sort;

package/es/components/table/Table/fields/select/Sort/index.js

@@ -0,0 +1,4 @@
+var Sort = function Sort() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Sort;

package/es/components/table/Table/fields/select/index.d.ts

@@ -0,0 +1,14 @@
+/// <reference types="react" />
+declare const _default: {
+    field: {
+        field_icon: string;
+        field_name: string;
+        field_type: string;
+        default_value: string;
+    };
+    config: () => JSX.Element;
+    edit: import("react").ForwardRefExoticComponent<Omit<import("../types").EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+    sort: () => JSX.Element;
+    show: (props: import("../types").FieldPropsType) => JSX.Element;
+};
+export default _default;

package/es/components/table/Table/fields/select/index.js

@@ -0,0 +1,17 @@
+import Config from "./Config";
+import Edit from "./Edit";
+import Show from "./Show";
+import Sort from "./Sort";
+var field = {
+  field_icon: 'pi-a-Property3Singlelinetext',
+  field_name: 'Select',
+  field_type: 'select',
+  default_value: 'select'
+};
+export default {
+  field: field,
+  config: Config,
+  edit: Edit,
+  sort: Sort,
+  show: Show
+};

package/es/components/table/Table/fields/text/Config/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Config: () => JSX.Element;
+export default Config;

package/es/components/table/Table/fields/text/Config/index.js

@@ -0,0 +1,4 @@
+var Config = function Config() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Config;

package/es/components/table/Table/fields/text/Edit/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { EditPropsType } from "../../types";
+declare const _default: import("react").ForwardRefExoticComponent<Omit<EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+export default _default;

package/es/components/table/Table/fields/text/Edit/index.js

@@ -0,0 +1,23 @@
+import { forwardRef } from "react";
+import Input from "../../../../../input";
+var Edit = function Edit(props, ref) {
+  var value = props.value,
+    onChange = props.onChange,
+    onPressEnter = props.onPressEnter,
+    onBlur = props.onBlur,
+    style = props.style,
+    bordered = props.bordered;
+  return /*#__PURE__*/React.createElement(Input, {
+    bordered: bordered,
+    ref: ref,
+    value: value,
+    onChange: onChange,
+    style: style,
+    onBlur: onBlur,
+    onPressEnter: onPressEnter,
+    onClick: function onClick(e) {
+      return e.stopPropagation();
+    }
+  });
+};
+export default /*#__PURE__*/forwardRef(Edit);

package/es/components/table/Table/fields/text/Show/index.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { FieldPropsType } from "../../types";
+declare const Show: (props: FieldPropsType) => JSX.Element;
+export default Show;

package/es/components/table/Table/fields/text/Show/index.js

@@ -0,0 +1,16 @@
+var _excluded = ["title", "editable", "dataIndex", "field_type", "record", "handleSave"];
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var Show = function Show(props) {
+  var title = props.title,
+    editable = props.editable,
+    dataIndex = props.dataIndex,
+    field_type = props.field_type,
+    record = props.record,
+    handleSave = props.handleSave,
+    restProps = _objectWithoutProperties(props, _excluded);
+  return /*#__PURE__*/React.createElement("div", {
+    className: ""
+  }, record[dataIndex]);
+};
+export default Show;

package/es/components/table/Table/fields/text/Sort/index.d.ts

@@ -0,0 +1,3 @@
+/// <reference types="react" />
+declare const Sort: () => JSX.Element;
+export default Sort;

package/es/components/table/Table/fields/text/Sort/index.js

@@ -0,0 +1,4 @@
+var Sort = function Sort() {
+  return /*#__PURE__*/React.createElement("div", null);
+};
+export default Sort;

package/es/components/table/Table/fields/text/index.d.ts

@@ -6,7 +6,9 @@ declare const _default: {
         field_type: string;
         default_value: string;
     };
-    Preview: (props: any) => JSX.Element;
-    Editor: () => JSX.Element;
+    config: () => JSX.Element;
+    edit: import("react").ForwardRefExoticComponent<Omit<import("../types").EditPropsType, "ref"> & import("react").RefAttributes<any>>;
+    sort: () => JSX.Element;
+    show: (props: import("../types").FieldPropsType) => JSX.Element;
 };
 export default _default;

package/es/components/table/Table/fields/text/index.js

@@ -1,5 +1,7 @@
-import Editor from "./Editor";
-import Preview from "./Preview";
+import Config from "./Config";
+import Edit from "./Edit";
+import Show from "./Show";
+import Sort from "./Sort";
 var field = {
   field_icon: "pi-a-Property3Singlelinetext",
   field_name: "Single line text",
@@ -8,6 +10,8 @@ var field = {
 };
 export default {
   field: field,
-  Preview: Preview,
-  Editor: Editor
+  config: Config,
+  edit: Edit,
+  sort: Sort,
+  show: Show
 };

package/es/components/table/Table/fields/types/index.d.ts

@@ -0,0 +1,27 @@
+/// <reference types="react" />
+export declare type FieldPropsType = {
+    title: React.ReactNode;
+    editable: boolean;
+    dataIndex: string;
+    field_type: FieldType;
+    record: Record<string, any>;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    handleSave: () => void;
+};
+export declare type FieldType = 'text' | 'image';
+export declare type EditPropsType = {
+    value: any;
+    onChange: (v: any) => void;
+    onPressEnter: () => void;
+    onBlur: () => void;
+    style: React.CSSProperties;
+    bordered: boolean;
+    options?: {
+        value: string;
+        label: string;
+    }[];
+    [key: string]: any;
+};

package/es/components/table/Table/fields/types/index.js

@@ -0,0 +1 @@
+export {};

package/es/components/table/Table/index.js

@@ -14,33 +14,15 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 import { useSharedState } from "../../../hooks";
 import { Table } from "antd";
 // import { Access } from '@umijs/max';
-import React, { useMemo } from "react";
+import React, { useCallback, useMemo } from "react";
+import { useMemoizedFn } from "ahooks";
 import { Context } from "../model";
 // import AddFieldModal from "./AddFieldModal";
-import Iconfont from "../../iconfont";
 import "./index.less";
 import SortRow from "./tableConfig/SortRow";
 import Body from "./tableConfig/body";
 import Header from "./tableConfig/header";
-var itemRender = function itemRender(_, type, originalElement) {
-  if (type === "prev") {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "paginator-page-btn left"
-    }, /*#__PURE__*/React.createElement(Iconfont, {
-      type: "icona-iconArrowsLine",
-      className: "icon"
-    }), "Pre");
-  }
-  if (type === "next") {
-    return /*#__PURE__*/React.createElement("div", {
-      className: "paginator-page-btn right"
-    }, "Next", /*#__PURE__*/React.createElement(Iconfont, {
-      type: "icona-iconArrowsLine",
-      className: "icon"
-    }));
-  }
-  return originalElement;
-};
+import { paginationConfig } from "../Pagination";
 var GridViewTable = function GridViewTable(_ref) {
   var tableProps = _ref.tableProps;
   var _useSharedState = useSharedState(Context),
@@ -48,7 +30,7 @@ var GridViewTable = function GridViewTable(_ref) {
     dispatch = _useSharedState.dispatch;
   var dataSource = state.dataSource,
     defaultColumns = state.defaultColumns;
-  var handleSave = function handleSave(row) {
+  var handleSave = useMemoizedFn(function (row) {
     var newData = _toConsumableArray(dataSource);
     var index = newData.findIndex(function (item) {
       return row.key === item.key;
@@ -59,7 +41,7 @@ var GridViewTable = function GridViewTable(_ref) {
       type: "setDataSource",
       payload: newData
     });
-  };
+  });
   var handleResize = function handleResize(index) {
     return function (e, _ref2) {
       var size = _ref2.size;
@@ -104,12 +86,11 @@ var GridViewTable = function GridViewTable(_ref) {
       });
     });
   }, [defaultColumns]);
-  var pagination = useMemo(function () {
-    return tableProps.pagination === false ? false : _objectSpread({
-      className: "materials-grid-paginator",
-      itemRender: itemRender
-    }, tableProps.pagination);
-  }, [tableProps.pagination]);
+  var showTotal = useCallback(function (total, range) {
+    var start = range[0] - 1;
+    var _current = start / tableProps.pagination.pageSize + 1;
+    return "Page ".concat(_current, " of ").concat(Math.ceil(total / tableProps.pagination.pageSize));
+  }, [tableProps.pagination.pageSize]);
   return /*#__PURE__*/React.createElement("div", {
     className: "materials-grid-table-wrap"
   }, /*#__PURE__*/React.createElement(SortRow, null, /*#__PURE__*/React.createElement(Table, _extends({
@@ -130,7 +111,9 @@ var GridViewTable = function GridViewTable(_ref) {
     scroll: {
       x: "max-content"
     },
-    pagination: pagination
+    pagination: tableProps.pagination === false ? false : _objectSpread(_objectSpread(_objectSpread({}, paginationConfig), tableProps.pagination), {}, {
+      showTotal: showTotal
+    })
   }))));
 };
 export default GridViewTable;

package/es/components/table/Table/index.less

@@ -5,100 +5,11 @@
   // flex-direction: column;
 
   .grid-view-table {
-    margin-top: 20px;
+    // margin-top: 20px;
     // width: max-content;
 
   }
 
 
 
-}
-
-.materials-grid-paginator {
-  margin: 0 !important;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  overflow: hidden;
-  height: 50px;
-  width: 100%;
-  background-color: #fff;
-  border-radius: 0 0 8px 8px;
-  border: 1px solid #f0f0f0;
-  border-top: none;
-
-  .ant-pagination-item {
-    position: relative;
-    border: none;
-  }
-
-  .ant-pagination-disabled {
-    opacity: 0.4;
-  }
-
-  .ant-pagination-item-active {
-    a {
-      font-weight: 450 !important;
-      color: rgba(0, 0, 0, 0.88) !important;
-
-    }
-
-    background-color: rgba(0, 0, 0, 0.06);
-  }
-
-  .ant-pagination-prev {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-right: auto;
-    min-width: auto;
-  }
-
-  .ant-pagination-item-active {}
-
-  .ant-pagination-next {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-left: auto;
-    min-width: auto;
-  }
-}
-
-.paginator-page-btn {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  border-radius: 4px 4px 4px 4px;
-  padding: 0 4px;
-  transition: 0.2s;
-  font-size: 12px;
-  font-weight: 400;
-  color: #6f6f6f;
-  cursor: pointer;
-  user-select: none;
-  height: 20px;
-
-  &:hover {
-    // background: #f2f2f2;
-  }
-
-  &.left {
-    margin-right: auto;
-
-    .icon {
-      font-size: 18px;
-      margin-right: 8px;
-    }
-  }
-
-  &.right {
-    margin-left: auto;
-
-    .icon {
-      font-size: 18px;
-      margin-left: 8px;
-      transform: rotate(180deg);
-    }
-  }
 }

package/es/components/table/Table/tableConfig/body/CellProvider/index.js

@@ -18,11 +18,11 @@ import { Form, Input } from "antd";
 import classNames from "classnames";
 import React, { useEffect, useMemo, useRef, useState } from "react";
 import { Context } from "../../../../model";
-import { getFieldByType } from "../../../fields";
+import { fieldMaps, getFieldByType } from "../../../fields";
 import { EditableContext } from "../index";
 import "./index.less";
 var CellProvider = function CellProvider(props) {
-  var _getFieldByType;
+  var _getFieldByType, _getFieldByType2;
   var title = props.title,
     editable = props.editable,
     children = props.children,
@@ -42,11 +42,12 @@ var CellProvider = function CellProvider(props) {
   var KEY = "".concat(dataIndex, "-").concat(record === null || record === void 0 ? void 0 : record.key);
   useEffect(function () {
     if (editing) {
-      inputRef.current.focus();
+      var _inputRef$current, _inputRef$current$foc;
+      (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 ? void 0 : (_inputRef$current$foc = _inputRef$current.focus) === null || _inputRef$current$foc === void 0 ? void 0 : _inputRef$current$foc.call(_inputRef$current);
     }
   }, [editing]);
   var toggleEdit = function toggleEdit() {
-    if (field_type !== "text") {
+    if (!fieldMaps[field_type]) {
       return;
     }
     setEditing(!editing);
@@ -82,7 +83,21 @@ var CellProvider = function CellProvider(props) {
     };
   }();
   var childNode = children;
-  var Com = (_getFieldByType = getFieldByType(field_type)) === null || _getFieldByType === void 0 ? void 0 : _getFieldByType.Preview;
+  var Com = (_getFieldByType = getFieldByType(field_type)) === null || _getFieldByType === void 0 ? void 0 : _getFieldByType.show;
+  var EditCom = (_getFieldByType2 = getFieldByType(field_type)) === null || _getFieldByType2 === void 0 ? void 0 : _getFieldByType2.edit;
+  var editComRender = useMemo(function () {
+    var NewEditCom = EditCom || Input;
+    return /*#__PURE__*/React.createElement(NewEditCom, {
+      ref: inputRef
+      // onPressEnter={save}
+      ,
+      onBlur: save,
+      style: {
+        height: '100%'
+      },
+      bordered: false
+    });
+  }, [EditCom, save]);
   if (editable) {
     childNode = editing ? /*#__PURE__*/React.createElement(Form.Item, {
       style: {
@@ -93,15 +108,7 @@ var CellProvider = function CellProvider(props) {
         required: true,
         message: "".concat(title, " is required.")
       }]
-    }, /*#__PURE__*/React.createElement(Input, {
-      ref: inputRef,
-      onPressEnter: save,
-      onBlur: save,
-      style: {
-        height: "100%"
-      },
-      bordered: false
-    })) : /*#__PURE__*/React.createElement("div", {
+    }, editComRender) : /*#__PURE__*/React.createElement("div", {
       className: classNames("editable-cell-value-wrap")
     }, Com ? /*#__PURE__*/React.createElement(Com, props) : children);
   }

package/es/components/table/Table/tableConfig/header/CellProvider/index.js

@@ -1,4 +1,3 @@
-import IconFont from "../../../../../iconfont";
 import { useSharedState } from "../../../../../../hooks";
 // import { Access } from '@umijs/max';
 import { Context } from "../../../../model";
@@ -6,7 +5,6 @@ import { getFieldByType } from "../../../fields";
 import React from "react";
 import "./index.less";
 var CustomHeaderCell = function CustomHeaderCell(props) {
-  var _field$field, _field$field2;
   var field_type = props.field_type,
     lock = props.lock;
   var _useSharedState = useSharedState(Context),
@@ -16,10 +14,7 @@ var CustomHeaderCell = function CustomHeaderCell(props) {
   var field = getFieldByType(field_type);
   return isCheckbox ? /*#__PURE__*/React.createElement(React.Fragment, null, props.children) : /*#__PURE__*/React.createElement("div", {
     className: "header-cell"
-  }, field !== null && field !== void 0 && (_field$field = field.field) !== null && _field$field !== void 0 && _field$field.field_icon ? /*#__PURE__*/React.createElement(IconFont, {
-    type: field === null || field === void 0 ? void 0 : (_field$field2 = field.field) === null || _field$field2 === void 0 ? void 0 : _field$field2.field_icon,
-    className: "field-icon"
-  }) : null, /*#__PURE__*/React.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "content"
   }, props.children));
 };

package/es/components/table/Table/tableConfig/header/CellProvider/index.less

@@ -10,7 +10,7 @@
   }
 
   .content {
-    padding: 0 10px;
+    padding-right: 10px;
     flex: auto;
     font-weight: 600;
     font-size: 14px;

package/es/components/table/index.d.ts

@@ -1,4 +1,17 @@
-/// <reference types="react" />
+import React from "react";
 import "./index.less";
-declare const _default: (props: any) => JSX.Element;
-export default _default;
+declare type GridViewProps = {
+    columns: any;
+    dataSource: any[];
+    dispatch: any;
+    style: any;
+    pagination: any;
+    filter: any;
+    buttons: any;
+    sort: any;
+    title: any;
+    onValuesChange: (changedValues: any, values: any) => void;
+    summary: any;
+};
+declare const GridView: React.FC<GridViewProps>;
+export default GridView;