@pisell/materials 1.0.4 → 1.0.6

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

@@ -0,0 +1,53 @@
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/Table/fields/text/Edit/index.tsx
+var Edit_exports = {};
+__export(Edit_exports, {
+  default: () => Edit_default
+});
+module.exports = __toCommonJS(Edit_exports);
+var import_react = require("react");
+var import_input = __toESM(require("../../../../../input"));
+var Edit = (props, ref) => {
+  const { value, onChange, onPressEnter, onBlur, style, bordered } = props;
+  return /* @__PURE__ */ React.createElement(
+    import_input.default,
+    {
+      bordered,
+      ref,
+      value,
+      onChange,
+      style,
+      onBlur,
+      onPressEnter,
+      onClick: (e) => e.stopPropagation()
+    }
+  );
+};
+var Edit_default = (0, import_react.forwardRef)(Edit);

package/lib/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/lib/components/table/Table/fields/text/Show/index.js

@@ -0,0 +1,37 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/Table/fields/text/Show/index.tsx
+var Show_exports = {};
+__export(Show_exports, {
+  default: () => Show_default
+});
+module.exports = __toCommonJS(Show_exports);
+var Show = (props) => {
+  const {
+    title,
+    editable,
+    dataIndex,
+    field_type,
+    record,
+    handleSave,
+    ...restProps
+  } = props;
+  return /* @__PURE__ */ React.createElement("div", { className: "" }, record[dataIndex]);
+};
+var Show_default = Show;

package/lib/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/lib/components/table/Table/fields/text/Sort/index.js

@@ -0,0 +1,28 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/Table/fields/text/Sort/index.tsx
+var Sort_exports = {};
+__export(Sort_exports, {
+  default: () => Sort_default
+});
+module.exports = __toCommonJS(Sort_exports);
+var Sort = () => {
+  return /* @__PURE__ */ React.createElement("div", null);
+};
+var Sort_default = Sort;

package/lib/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/lib/components/table/Table/fields/text/index.js

@@ -32,8 +32,10 @@ __export(text_exports, {
   default: () => text_default
 });
 module.exports = __toCommonJS(text_exports);
-var import_Editor = __toESM(require("./Editor"));
-var import_Preview = __toESM(require("./Preview"));
+var import_Config = __toESM(require("./Config"));
+var import_Edit = __toESM(require("./Edit"));
+var import_Show = __toESM(require("./Show"));
+var import_Sort = __toESM(require("./Sort"));
 var field = {
   field_icon: "pi-a-Property3Singlelinetext",
   field_name: "Single line text",
@@ -42,6 +44,8 @@ var field = {
 };
 var text_default = {
   field,
-  Preview: import_Preview.default,
-  Editor: import_Editor.default
+  config: import_Config.default,
+  edit: import_Edit.default,
+  sort: import_Sort.default,
+  show: import_Show.default
 };

package/lib/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/lib/components/table/Table/fields/types/index.js

@@ -0,0 +1,17 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/components/table/Table/fields/types/index.tsx
+var types_exports = {};
+module.exports = __toCommonJS(types_exports);

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

@@ -35,25 +35,17 @@ module.exports = __toCommonJS(Table_exports);
 var import_hooks = require("../../../hooks");
 var import_antd = require("antd");
 var import_react = __toESM(require("react"));
+var import_ahooks = require("ahooks");
 var import_model = require("../model");
-var import_iconfont = __toESM(require("../../iconfont"));
 var import_index = require("./index.less");
 var import_SortRow = __toESM(require("./tableConfig/SortRow"));
 var import_body = __toESM(require("./tableConfig/body"));
 var import_header = __toESM(require("./tableConfig/header"));
-var itemRender = (_, type, originalElement) => {
-  if (type === "prev") {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: "paginator-page-btn left" }, /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "icona-iconArrowsLine", className: "icon" }), "Pre");
-  }
-  if (type === "next") {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: "paginator-page-btn right" }, "Next", /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: "icona-iconArrowsLine", className: "icon" }));
-  }
-  return originalElement;
-};
+var import_Pagination = require("../Pagination");
 var GridViewTable = ({ tableProps }) => {
   const { state, dispatch } = (0, import_hooks.useSharedState)(import_model.Context);
   const { dataSource, defaultColumns } = state;
-  const handleSave = (row) => {
+  const handleSave = (0, import_ahooks.useMemoizedFn)((row) => {
     const newData = [...dataSource];
     const index = newData.findIndex((item2) => row.key === item2.key);
     const item = newData[index];
@@ -65,7 +57,7 @@ var GridViewTable = ({ tableProps }) => {
       type: "setDataSource",
       payload: newData
     });
-  };
+  });
   const handleResize = (index) => (e, { size }) => {
     const nextColumns = [...defaultColumns];
     nextColumns[index] = {
@@ -105,13 +97,16 @@ var GridViewTable = ({ tableProps }) => {
       };
     });
   }, [defaultColumns]);
-  const pagination = (0, import_react.useMemo)(() => {
-    return tableProps.pagination === false ? false : {
-      className: "materials-grid-paginator",
-      itemRender,
-      ...tableProps.pagination
-    };
-  }, [tableProps.pagination]);
+  const showTotal = (0, import_react.useCallback)(
+    (total, range) => {
+      let start = range[0] - 1;
+      let _current = start / tableProps.pagination.pageSize + 1;
+      return `Page ${_current} of ${Math.ceil(
+        total / tableProps.pagination.pageSize
+      )}`;
+    },
+    [tableProps.pagination.pageSize]
+  );
   return /* @__PURE__ */ import_react.default.createElement("div", { className: "materials-grid-table-wrap" }, /* @__PURE__ */ import_react.default.createElement(import_SortRow.default, null, /* @__PURE__ */ import_react.default.createElement(
     import_antd.Table,
     {
@@ -132,7 +127,11 @@ var GridViewTable = ({ tableProps }) => {
       scroll: {
         x: "max-content"
       },
-      pagination
+      pagination: tableProps.pagination === false ? false : {
+        ...import_Pagination.paginationConfig,
+        ...tableProps.pagination,
+        showTotal
+      }
     }
   )));
 };

package/lib/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/lib/components/table/Table/tableConfig/body/CellProvider/index.js

@@ -41,7 +41,7 @@ var import_fields = require("../../../fields");
 var import__ = require("../index");
 var import_index = require("./index.less");
 var CellProvider = (props) => {
-  var _a;
+  var _a, _b;
   const {
     title,
     editable,
@@ -57,12 +57,13 @@ var CellProvider = (props) => {
   const { state, dispatch } = (0, import_hooks.useSharedState)(import_model.Context);
   const KEY = `${dataIndex}-${record == null ? void 0 : record.key}`;
   (0, import_react.useEffect)(() => {
+    var _a2, _b2;
     if (editing) {
-      inputRef.current.focus();
+      (_b2 = (_a2 = inputRef.current) == null ? void 0 : _a2.focus) == null ? void 0 : _b2.call(_a2);
     }
   }, [editing]);
   const toggleEdit = () => {
-    if (field_type !== "text") {
+    if (!import_fields.fieldMaps[field_type]) {
       return;
     }
     setEditing(!editing);
@@ -78,7 +79,20 @@ var CellProvider = (props) => {
     }
   };
   let childNode = children;
-  const Com = (_a = (0, import_fields.getFieldByType)(field_type)) == null ? void 0 : _a.Preview;
+  const Com = (_a = (0, import_fields.getFieldByType)(field_type)) == null ? void 0 : _a.show;
+  const EditCom = (_b = (0, import_fields.getFieldByType)(field_type)) == null ? void 0 : _b.edit;
+  const editComRender = (0, import_react.useMemo)(() => {
+    const NewEditCom = EditCom || import_antd.Input;
+    return /* @__PURE__ */ import_react.default.createElement(
+      NewEditCom,
+      {
+        ref: inputRef,
+        onBlur: save,
+        style: { height: "100%" },
+        bordered: false
+      }
+    );
+  }, [EditCom, save]);
   if (editable) {
     childNode = editing ? /* @__PURE__ */ import_react.default.createElement(
       import_antd.Form.Item,
@@ -92,16 +106,7 @@ var CellProvider = (props) => {
           }
         ]
       },
-      /* @__PURE__ */ import_react.default.createElement(
-        import_antd.Input,
-        {
-          ref: inputRef,
-          onPressEnter: save,
-          onBlur: save,
-          style: { height: "100%" },
-          bordered: false
-        }
-      )
+      editComRender
     ) : /* @__PURE__ */ import_react.default.createElement("div", { className: (0, import_classnames.default)("editable-cell-value-wrap") }, Com ? /* @__PURE__ */ import_react.default.createElement(Com, { ...props }) : children);
   }
   const focus = (0, import_react.useMemo)(() => {

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

@@ -32,18 +32,16 @@ __export(CellProvider_exports, {
   default: () => CellProvider_default
 });
 module.exports = __toCommonJS(CellProvider_exports);
-var import_iconfont = __toESM(require("../../../../../iconfont"));
 var import_hooks = require("../../../../../../hooks");
 var import_model = require("../../../../model");
 var import_fields = require("../../../fields");
 var import_react = __toESM(require("react"));
 var import_index = require("./index.less");
 var CustomHeaderCell = (props) => {
-  var _a, _b;
   const { field_type, lock } = props;
   const { state, dispatch } = (0, import_hooks.useSharedState)(import_model.Context);
   const isCheckbox = !props.record;
   const field = (0, import_fields.getFieldByType)(field_type);
-  return isCheckbox ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, props.children) : /* @__PURE__ */ import_react.default.createElement("div", { className: "header-cell" }, ((_a = field == null ? void 0 : field.field) == null ? void 0 : _a.field_icon) ? /* @__PURE__ */ import_react.default.createElement(import_iconfont.default, { type: (_b = field == null ? void 0 : field.field) == null ? void 0 : _b.field_icon, className: "field-icon" }) : null, /* @__PURE__ */ import_react.default.createElement("div", { className: "content" }, props.children));
+  return isCheckbox ? /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, props.children) : /* @__PURE__ */ import_react.default.createElement("div", { className: "header-cell" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "content" }, props.children));
 };
 var CellProvider_default = CustomHeaderCell;

package/lib/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/lib/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;

package/lib/components/table/index.js

@@ -33,27 +33,49 @@ __export(table_exports, {
 });
 module.exports = __toCommonJS(table_exports);
 var import_react = __toESM(require("react"));
+var import_antd = require("antd");
+var import_Header = __toESM(require("./Header"));
 var import_Actions = __toESM(require("./Actions"));
+var import_Summary = __toESM(require("./Summary"));
 var import_Table = __toESM(require("./Table"));
 var import_hooks = require("../../hooks");
 var import_index = require("./index.less");
 var import_model = require("./model");
-var GridView = (props) => {
+var GridView = (0, import_model.Provider)((props) => {
   const modal = (0, import_hooks.useSharedState)(import_model.Context);
-  const { dataSource, columns, dispatch, style, filter, buttons, ...other } = props;
+  const [form] = import_antd.Form.useForm();
+  const {
+    dataSource,
+    columns,
+    dispatch,
+    style,
+    filter,
+    sort,
+    buttons,
+    title,
+    summary,
+    onValuesChange,
+    // pagination,
+    ...other
+  } = props;
   (0, import_react.useEffect)(() => {
     modal.dispatch({
       type: "setDefaultColumns",
       payload: columns
     });
   }, [columns]);
-  console.log("wzw", other);
   (0, import_react.useEffect)(() => {
     modal.dispatch({
       type: "setDataSource",
       payload: dataSource
     });
   }, [dataSource]);
-  return /* @__PURE__ */ import_react.default.createElement("div", { className: "materials-grid", style }, /* @__PURE__ */ import_react.default.createElement(import_Actions.default, { filter, buttons }), /* @__PURE__ */ import_react.default.createElement(import_Table.default, { tableProps: other }));
-};
-var table_default = (0, import_model.Provider)(GridView);
+  (0, import_react.useEffect)(() => {
+    modal.dispatch({
+      type: "setQuickFilter",
+      payload: filter.list
+    });
+  }, [filter]);
+  return /* @__PURE__ */ import_react.default.createElement(import_antd.Form, { form, layout: "vertical", onValuesChange }, /* @__PURE__ */ import_react.default.createElement("div", { className: "materials-grid", style }, /* @__PURE__ */ import_react.default.createElement(import_Header.default, { title, buttons }), /* @__PURE__ */ import_react.default.createElement(import_Actions.default, { filter, sort }), /* @__PURE__ */ import_react.default.createElement(import_Summary.default, { summary }), /* @__PURE__ */ import_react.default.createElement(import_Table.default, { tableProps: other })));
+});
+var table_default = GridView;

package/lib/components/table/model.d.ts

@@ -1,9 +1,12 @@
 /// <reference types="react" />
+import { FilterItemProps } from "./Actions/Filter/Dropdown";
 interface FormState {
     dataSource: any[];
     defaultColumns: any[];
     currentCell: any;
     setting: any;
+    quickFilter: FilterItemProps[];
+    otherFilter: FilterItemProps[];
 }
 export declare const Provider: (ComponentUi: any) => (props: any) => JSX.Element, Context: import("react").Context<{
     state: FormState;

package/lib/components/table/model.js

@@ -87,6 +87,8 @@ var defaultState = {
     }
   ],
   currentCell: null,
+  quickFilter: [],
+  otherFilter: [],
   setting: {
     field: {
       edit: 0
@@ -111,6 +113,18 @@ var { Provider, Context } = (0, import_miniRedux.default)({
     },
     setCurrentCell(state, payload) {
       return { ...state, currentCell: payload };
+    },
+    setQuickFilter(state, payload) {
+      return { ...state, quickFilter: payload };
+    },
+    syncStorage(state, payload) {
+      return { ...state };
+    },
+    init(state, payload) {
+      return { ...state };
+    },
+    setOtherFilter(state, payload) {
+      return { ...state, otherFilter: payload };
     }
   }
 });

package/lib/utils/hoc.js

@@ -37,6 +37,7 @@ __export(hoc_exports, {
 module.exports = __toCommonJS(hoc_exports);
 var import_react = __toESM(require("react"));
 var import_lodash = require("lodash");
+var import_dayjs = __toESM(require("dayjs"));
 function convertProps(props, list, mapper) {
   const out = {};
   list.forEach((key) => {
@@ -84,9 +85,9 @@ function withMomentProps(Comp, needsConvert = ["value", "defaultValue"]) {
     const convertedProps = convertProps(props, needsConvert, (prop) => {
       if (prop) {
         if (Array.isArray(prop)) {
-          return prop.map((v) => moment.isMoment(v) ? v : moment(v));
+          return prop.map((v) => import_dayjs.default.isDayjs(v) ? v : (0, import_dayjs.default)(v));
         }
-        return moment.isMoment(prop) ? prop : moment(prop);
+        return import_dayjs.default.isDayjs(prop) ? prop : (0, import_dayjs.default)(prop);
       }
     });
     return /* @__PURE__ */ import_react.default.createElement(Comp, { ...props, ...convertedProps });