@hzab/hierarchical-statistics 0.0.6 → 1.0.0-beta1

package/CHANGELOG.md

@@ -1,3 +1,5 @@
+# @hzab/component-boilerplate@0.1.0
+- fix: 删掉@hzab/list-render-mobile
 # @hzab/component-boilerplate@0.0.6
 - fix: 修复跳转同路由，listRender参数依赖没有更新问题
 # @hzab/component-boilerplate@0.0.5

package/README.md

@@ -11,8 +11,8 @@
 ## 示例
 
 ```jsx
-import InfiniteListUIPc from "@hzab/hierarchical-statistics/src/components/InfiniteListUiPc";
-      <InfiniteListUIPc
+import InfiniteListUi from "@hzab/hierarchical-statistics/src/components/InfiniteListUi";
+      <InfiniteListUi
         ref={listRef}
         style={{
           maxWidth: "400px",
@@ -47,7 +47,7 @@ import InfiniteListUIPc from "@hzab/hierarchical-statistics/src/components/Infin
           dynamicHeightMode: true,
           noMoreComponent: <div>没有更多数据了</div>,
         }}
-      ></InfiniteListUIPc>
+      ></InfiniteListUi>
 ```
 
 ## API
@@ -58,7 +58,7 @@ import InfiniteListUIPc from "@hzab/hierarchical-statistics/src/components/Infin
 | -------------------- | ------------------------------| ----- | --------- | ----------------------------------- |
 | listModal            | Object                        | 是    | -         | 列表数据模型DataModel，必须包含getListApi |
 | breadModel           | Object                        | 否    | -        | 回显数据模型DataModel，必须包含getApi |
-| showHome             | boolean                       | 否    | -         | 是否显示面包屑首页            |
+| showHome             | Boolean                       | 否    | -         | 是否显示面包屑首页            |
 | onNodeClick          | function(item)                | 否    | -         | item点击事件        |
 | onNodeSelect         | function(item)                | 否    | -         | item选中事件        |
 | onBreadcrumbClick    | function(item)                | 否    | -         | 回显点击事件        |
@@ -70,13 +70,11 @@ import InfiniteListUIPc from "@hzab/hierarchical-statistics/src/components/Infin
 | listStyle            | CSSProperties                 | 否    | -         | 列表外层样式     |
 | readcrumbStyle       | CSSProperties                 | 否    | -         | 面包屑外层样式    |
 | separatorStyle       | CSSProperties                 | 否    | -         | 面包屑分割符样式    |
-| listRenderProps      | Object                        | 否    | -         | list-render-mobile 配置    |
 | virtualPagedListProps| Object                        | 否    | -         | virtualPagedList 配置    |
 | separator            | string                        | 否    | -         | 分隔符 默认"-"     |
 | Slots                | Object                        | 是    | -         | 插槽              |
 
 
-
 ### Slots
 
 | 参数                 | 类型                | 必填  | 默认值   | 说明                                |

package/package.json

@@ -1,11 +1,12 @@
 {
   "name": "@hzab/hierarchical-statistics",
-  "version": "0.0.6",
+  "version": "1.0.0-beta1",
   "description": "",
   "main": "src",
   "scripts": {
     "dev": "webpack serve -c ./config/webpack.config.js --env local",
     "build": "webpack -c ./config/webpack.config.js --env production",
+    "publish-beta": "npm publish --beta",
     "publish-patch": "npm version patch && npm publish --access public",
     "publish-minor": "npm version minor && npm publish --access public",
     "publish-major": "npm version major && npm publish --access public",
@@ -48,7 +49,6 @@
   },
   "peerDependencies": {
     "@hzab/data-model": ">=1.7.5",
-    "@hzab/headless-components": ">=0.0.3",
-    "@hzab/list-render-mobile": ">=1.1.7"
+    "@hzab/headless-components": ">=0.0.3"
   }
 }

package/src/components/Breadcrumb/index.tsx

@@ -1,8 +1,8 @@
 import "../index.less";
 const BreadcrumbUI = (props: any) => {
-  const { readcrumbStyle, separatorStyle, separator, breadcrumbData, terminal, handleBreadcrumbClick } = props;
+  const { readcrumbStyle, separatorStyle, separator, breadcrumbData, handleBreadcrumbClick } = props;
   return (
-    <div className={`breadcrumb-box ${terminal !== "pc" ? "breadcrumb-box-mobile" : ""}`} style={readcrumbStyle}>
+    <div className={`breadcrumb-box`} style={readcrumbStyle}>
       {breadcrumbData.map((item, index) => (
         <div className="breadcrumb-item" key={index}>
           <span

package/src/components/{InfiniteListUiPc → InfiniteListUi}/index.tsx

@@ -5,7 +5,7 @@ import { useInfiniteList } from "../../use-infinite-list";
 import Breadcrumb from "../Breadcrumb";
 import { InfiniteListProps, InfiniteListInstance } from "../../type";
 import "../index.less";
-const InfiniteListUIPc = (props: InfiniteListProps, ref: ForwardedRef<InfiniteListInstance>) => {
+const InfiniteListUi = (props: InfiniteListProps, ref: ForwardedRef<InfiniteListInstance>) => {
   const {
     states: {
       listModal,
@@ -24,8 +24,8 @@ const InfiniteListUIPc = (props: InfiniteListProps, ref: ForwardedRef<InfiniteLi
       className,
       refreshKey,
     },
-    actions: { handleSelectId, handleNodeClick, handleBreadcrumbClick, fetchBreadData },
-  } = useInfiniteList({ ...props, terminal: "pc" });
+    actions: { handleSelectId, handleNodeClick, handleBreadcrumbClick, fetchBreadData, handleListRefresh },
+  } = useInfiniteList({ ...props });
 
   useImperativeHandle(ref, () => ({
     handleNodeClick,
@@ -35,6 +35,7 @@ const InfiniteListUIPc = (props: InfiniteListProps, ref: ForwardedRef<InfiniteLi
     breadModel,
     fetchBreadData,
     breadcrumbData,
+    handleListRefresh,
   }));
 
   const loadData = async (pageNum) => {
@@ -46,13 +47,13 @@ const InfiniteListUIPc = (props: InfiniteListProps, ref: ForwardedRef<InfiniteLi
       isMore: res?.pagination?.total > (pageNum - 1) * listModal.query.pageSize + res?.list?.length ? true : false,
     };
   };
+
   return (
     <div className={`infinite-level-box ${className || ""}`} style={style}>
       <Spin spinning={loading}>
         {/* 面包屑导航 */}
         <div className="infinite-level-breadcrumb-position">
           <Breadcrumb
-            terminal="pc"
             readcrumbStyle={readcrumbStyle}
             separatorStyle={separatorStyle}
             separator={separator}
@@ -75,4 +76,4 @@ const InfiniteListUIPc = (props: InfiniteListProps, ref: ForwardedRef<InfiniteLi
   );
 };
 
-export default forwardRef<InfiniteListInstance, InfiniteListProps>(InfiniteListUIPc);
+export default forwardRef<InfiniteListInstance, InfiniteListProps>(InfiniteListUi);

package/src/type.d.ts

@@ -29,6 +29,8 @@ export interface InfiniteListInstance {
   breadcrumbData?: any;
   /** 面包屑数据请求方法 */
   fetchBreadData?: () => Promise<void>;
+  /** 列表刷新 */
+  handleListRefresh?: () => void;
 }
 export interface InfiniteListProps {
   /** 添加外层类名 */
@@ -58,8 +60,6 @@ export interface InfiniteListProps {
   separatorStyle?: object;
   /** 面包屑外层 自定义css 样式 */
   readcrumbStyle?: object;
-  /** 设备是pc,还是mobile */
-  terminal?: string;
   /** 列表外层 css 样式 */
   listStyle?: object;
   /** list modal */

package/src/use-infinite-list.ts

@@ -111,6 +111,11 @@ export function useInfiniteList(props: InfiniteListProps) {
       setLoading(false);
     }
   };
+  /** 列表刷新  */
+  const handleListRefresh = async () => {
+    listModal.query = { ...listModal.query, pageNum: 1 };
+    setRefreshKey((pre) => pre + 1);
+  };
 
   useEffect(() => {
     fetchBreadData();
@@ -141,6 +146,7 @@ export function useInfiniteList(props: InfiniteListProps) {
       handleNodeClick,
       handleBreadcrumbClick,
       fetchBreadData,
+      handleListRefresh,
     },
   };
 }

package/src/components/InfiniteListUiMobile/index.tsx

@@ -1,69 +0,0 @@
-import { ForwardedRef, forwardRef, useImperativeHandle, useRef } from "react";
-import { ConfigProvider, Spin } from "antd";
-import ListRender from "@hzab/list-render-mobile";
-import { useInfiniteList } from "../../use-infinite-list";
-import { InfiniteListProps, InfiniteListInstance } from "../../type";
-import Breadcrumb from "../Breadcrumb";
-import "../index.less";
-const InfiniteListUIMobile = (props: InfiniteListProps, ref: ForwardedRef<InfiniteListInstance>) => {
-  const {
-    states: {
-      readcrumbStyle,
-      separatorStyle,
-      separator,
-      listRenderProps,
-      style,
-      listModal,
-      breadcrumbData,
-      Slots,
-      loading,
-      listRef,
-      listStyle,
-      breadModel,
-      className,
-      refreshKey,
-    },
-    actions: { fetchBreadData, handleSelectId, handleNodeClick, handleBreadcrumbClick },
-  } = useInfiniteList({ ...props, terminal: "mobile" });
-  useImperativeHandle(ref, () => ({
-    handleNodeClick,
-    handleSelectId,
-    listRef: listRef?.current,
-    listModal,
-    breadModel,
-    fetchBreadData,
-    breadcrumbData,
-  }));
-  return (
-    <div className={`infinite-level-box ${className || ""}`} style={style}>
-      <Spin spinning={loading}>
-        {/* 面包屑导航 */}
-        <div className="infinite-level-breadcrumb-position">
-          <Breadcrumb
-            terminal="mobile"
-            readcrumbStyle={readcrumbStyle}
-            separatorStyle={separatorStyle}
-            separator={separator}
-            breadcrumbData={breadcrumbData}
-            handleBreadcrumbClick={handleBreadcrumbClick}
-            Slots={Slots}
-          ></Breadcrumb>
-          {Slots?.fixRenderCenter && <Slots.fixRenderCenter></Slots.fixRenderCenter>}
-        </div>
-
-        <div className="infinite-level-list-box" style={listStyle}>
-          {/* 移动端 */}
-          <ListRender
-            key={refreshKey}
-            ref={listRef}
-            model={listModal}
-            {...listRenderProps}
-            ItemRender={Slots.renderItem}
-          />
-        </div>
-      </Spin>
-    </div>
-  );
-};
-
-export default forwardRef<InfiniteListInstance, InfiniteListProps>(InfiniteListUIMobile);