@pisell/materials 1.0.12 → 1.0.13

package/{es/components/table → lib/components}/Pagination/index.less

@@ -148,4 +148,62 @@
       transform: rotate(180deg);
     }
   }
+}
+
+.materials-grid-paginator-mini {
+  display: flex;
+  justify-content: space-between;
+  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;
+  padding: 0 20px;
+  margin: 0 !important;
+
+  .paginator-page-btn {
+    padding: 8px;
+
+  }
+
+  .materials-grid-paginator-center {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    gap: 4px;
+
+    .materials-grid-paginator-center-text {
+      color: var(--gray-700, #344054);
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 400;
+    }
+
+    .materials-grid-paginator-center-value {
+      color: var(--gray-700, #344054);
+      font-size: 14px;
+      font-style: normal;
+      font-weight: 500;
+    }
+  }
+
+  .pisell-lowcode-pagination-prev,
+  .pisell-lowcode-pagination-next {
+    margin: 0;
+    border-radius: 8px;
+    border: 1px solid #D0D5DD;
+
+    .paginator-page-btn-left-icon {
+      margin-right: 0;
+    }
+
+    .paginator-page-btn-right-icon {
+      margin-left: 0;
+    }
+
+  }
+
 }

package/lib/components/table/Actions/Filter/Dropdown/index.js

@@ -39,10 +39,15 @@ var import_index = require("./index.less");
 var import_FilterItem = __toESM(require("../FilterItem"));
 var import_hooks = require("../../../../../hooks");
 var import_model = require("../../../model");
+var import_antd = require("antd");
 var titleMap = {
   quickFilter: "Quick Filter",
   otherFilter: "Filter"
 };
+var tooltipMap = {
+  quickFilter: "Enable quick filtering directly on the page for convenient filtering operations, with a maximum of three filters allowed.\n",
+  otherFilter: "Select filter criteria in the list to perform filtering operations and display corresponding results."
+};
 var DragItem = import_react.default.forwardRef((props, ref) => {
   const { attributes, listeners, setActivatorNodeRef, style } = props;
   return /* @__PURE__ */ import_react.default.createElement(
@@ -83,7 +88,7 @@ var Dropdown = (props) => {
     });
   };
   const renderContainer = (0, import_react.useCallback)(({ children, ref, id }) => {
-    return /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-container-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-container-title-wrap" }, /* @__PURE__ */ import_react.default.createElement("span", { className: "filter-dropdown-container-title" }, titleMap[id]), /* @__PURE__ */ import_react.default.createElement(import_icon.HelpCircle, { className: "filter-dropdown-container-icon-help" })), /* @__PURE__ */ import_react.default.createElement("div", { ref, className: "filter-dropdown-container-filter-wrap" }, children));
+    return /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-container-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-container-title-wrap" }, /* @__PURE__ */ import_react.default.createElement("span", { className: "filter-dropdown-container-title" }, titleMap[id]), /* @__PURE__ */ import_react.default.createElement(import_antd.Tooltip, { title: tooltipMap[id] }, /* @__PURE__ */ import_react.default.createElement(import_icon.HelpCircle, { className: "filter-dropdown-container-icon-help" }))), /* @__PURE__ */ import_react.default.createElement("div", { ref, className: "filter-dropdown-container-filter-wrap" }, children));
   }, []);
   return /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-wrap" }, /* @__PURE__ */ import_react.default.createElement("div", { className: "filter-dropdown-wrap-content" }, /* @__PURE__ */ import_react.default.createElement(
     import_MultipleContainersSortList.default,

package/lib/components/table/Actions/Filter/Dropdown/index.less

@@ -1,5 +1,7 @@
 .filter-dropdown-wrap {
   width: 400px;
+  max-width: calc(100vw - 24px);
+  min-width: 250px;
   padding: 4px;
   max-height: 400px;
   display: flex;

package/lib/components/table/BasicTable/index.d.ts

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

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

@@ -0,0 +1,74 @@
+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/BasicTable/index.tsx
+var BasicTable_exports = {};
+__export(BasicTable_exports, {
+  default: () => BasicTable_default
+});
+module.exports = __toCommonJS(BasicTable_exports);
+var import_antd = require("antd");
+var import_react = __toESM(require("react"));
+var import_Pagination = __toESM(require("../../Pagination"));
+var BasicTable = (props) => {
+  const { dataSource, pagination, ...other } = props;
+  const [currentPage, setCurrentPage] = (0, import_react.useState)(1);
+  const [pageSize, setPageSize] = (0, import_react.useState)(10);
+  const _dataSource = (0, import_react.useMemo)(() => {
+    let list = (dataSource == null ? void 0 : dataSource.list) || [];
+    let total2 = (dataSource == null ? void 0 : dataSource.total) || 0;
+    if (Array.isArray(dataSource)) {
+      list = dataSource;
+      total2 = list.length;
+    }
+    list = list.slice((currentPage - 1) * pageSize, currentPage * pageSize);
+    return {
+      list,
+      total: total2
+    };
+  }, [dataSource, currentPage, pageSize]);
+  const total = (0, import_react.useMemo)(() => {
+    return (pagination == null ? void 0 : pagination.total) || (_dataSource == null ? void 0 : _dataSource.total) || 0;
+  }, [dataSource, pagination]);
+  const onPaginationChange = (page, pageSize2) => {
+    setCurrentPage(page);
+    setPageSize(pageSize2);
+  };
+  return /* @__PURE__ */ import_react.default.createElement("div", null, /* @__PURE__ */ import_react.default.createElement(import_antd.Table, { ...other, pagination: false, dataSource: _dataSource == null ? void 0 : _dataSource.list }), /* @__PURE__ */ import_react.default.createElement(
+    import_Pagination.default,
+    {
+      ...pagination,
+      current: currentPage,
+      pageSize,
+      onShowSizeChange: onPaginationChange,
+      onChange: onPaginationChange,
+      total
+    }
+  ));
+};
+var BasicTable_default = BasicTable;

package/lib/components/table/Table/fields/date/Show/index.js

@@ -1,6 +1,8 @@
+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)
@@ -14,6 +16,14 @@ var __copyProps = (to, from, except, desc) => {
   }
   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/date/Show/index.tsx
@@ -22,6 +32,8 @@ __export(Show_exports, {
   default: () => Show_default
 });
 module.exports = __toCommonJS(Show_exports);
+var import_react = __toESM(require("react"));
+var import_utils = require("@pisell/utils");
 var Show = (props) => {
   const {
     title,
@@ -32,6 +44,6 @@ var Show = (props) => {
     handleSave,
     ...restProps
   } = props;
-  return /* @__PURE__ */ React.createElement("div", { className: "" }, record[dataIndex]);
+  return /* @__PURE__ */ import_react.default.createElement("div", { className: "" }, (0, import_utils.formatDate)(record[dataIndex]));
 };
 var Show_default = Show;

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

@@ -33,15 +33,15 @@ __export(Table_exports, {
 });
 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_index = require("./index.less");
+var import_BasicTable = __toESM(require("../BasicTable"));
 var import_SortRow = __toESM(require("./tableConfig/SortRow"));
 var import_body = __toESM(require("./tableConfig/body"));
 var import_header = __toESM(require("./tableConfig/header"));
-var import_Pagination = require("../Pagination");
+var import_Pagination = require("../../Pagination");
 var GridViewTable = ({ tableProps }) => {
   const responsive = (0, import_hooks.useResponsive)();
   const { state, dispatch } = (0, import_hooks.useSharedState)(import_model.Context);
@@ -112,12 +112,6 @@ var GridViewTable = ({ tableProps }) => {
     if (tableProps.pagination === false) {
       return false;
     }
-    if (responsive === "phone") {
-      return {
-        ...tableProps.pagination,
-        size: "small"
-      };
-    }
     return {
       ...import_Pagination.paginationConfig,
       ...tableProps.pagination,
@@ -125,7 +119,7 @@ var GridViewTable = ({ tableProps }) => {
     };
   }, [responsive, tableProps.pagination]);
   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,
+    import_BasicTable.default,
     {
       dataSource,
       columns,

package/lib/components/table/index.js

@@ -71,9 +71,14 @@ var GridView = (0, import_model.Provider)((props) => {
     });
   }, [dataSource]);
   (0, import_react.useEffect)(() => {
+    var _a, _b, _c, _d;
     modal.dispatch({
       type: "setQuickFilter",
-      payload: filter.list
+      payload: ((_b = (_a = filter == null ? void 0 : filter.list) == null ? void 0 : _a.slice) == null ? void 0 : _b.call(_a, 0, 3)) || []
+    });
+    modal.dispatch({
+      type: "setOtherFilter",
+      payload: ((_d = (_c = filter == null ? void 0 : filter.list) == null ? void 0 : _c.slice) == null ? void 0 : _d.call(_c, 3)) || []
     });
   }, [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 })));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pisell/materials",
-  "version": "1.0.12",
+  "version": "1.0.13",
   "main": "./lib/index.js",
   "module": "./es/index.js",
   "types": "./lib/index.d.ts",
@@ -23,7 +23,8 @@
     "@alilc/lowcode-react-renderer": "^1.1.7",
     "@alilc/lowcode-types": "1.1.7",
     "@svgr/webpack": "^5.5.0",
-    "url-loader": "^4.1.1"
+    "url-loader": "^4.1.1",
+    "@alilc/build-plugin-alt": "^1.3.3"
   },
   "publishConfig": {
     "access": "public"

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

@@ -1,45 +0,0 @@
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-import React, { useMemo } from "react";
-import { ArrowLeft, ArrowRight } from "@pisell/icon";
-import { Pagination as OriginPagination } from "antd";
-import classNames from "classnames";
-import "./index.less";
-var itemRender = function itemRender(_, type, originalElement) {
-  if (type === "prev") {
-    return /*#__PURE__*/React.createElement("div", {
-      className: classNames("paginator-page-btn", "left")
-    }, /*#__PURE__*/React.createElement(ArrowLeft, {
-      className: "paginator-page-btn-left-icon"
-    }), /*#__PURE__*/React.createElement("span", {
-      className: "paginator-page-btn-text"
-    }, "Previous"));
-  }
-  if (type === "next") {
-    return /*#__PURE__*/React.createElement("div", {
-      className: classNames("paginator-page-btn", "right")
-    }, /*#__PURE__*/React.createElement("span", {
-      className: "paginator-page-btn-text"
-    }, "Next"), /*#__PURE__*/React.createElement(ArrowRight, {
-      className: "paginator-page-btn-right-icon"
-    }));
-  }
-  return originalElement;
-};
-export var paginationConfig = {
-  className: "materials-grid-paginator",
-  defaultCurrent: 1,
-  showTotal: function showTotal(total, range) {
-    return "Page ".concat(range[0], " of ").concat(range[1]);
-  },
-  itemRender: itemRender,
-  responsive: true,
-  size: "small"
-};
-var Pagination = function Pagination(props) {
-  console.log(props);
-  var show = useMemo(function () {
-    return Object.keys(props).length;
-  }, [props]);
-  return show ? /*#__PURE__*/React.createElement(OriginPagination, _extends({}, paginationConfig, props)) : null;
-};
-export default Pagination;