szld-libs 0.2.42 → 0.2.44

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/dist/szld-components.es.js +771 -771
  2. package/dist/szld-components.umd.js +21 -21
  3. package/es/hooks/useRowSelection.d.ts +8 -1
  4. package/es/hooks/useRowSelection.js +2 -2
  5. package/es/index.js +29 -57
  6. package/lib/hooks/useRowSelection.d.ts +8 -1
  7. package/lib/hooks/useRowSelection.js +2 -2
  8. package/lib/index.js +28 -56
  9. package/package.json +1 -1
package/es/hooks/useRowSelection.d.ts CHANGED
@@ -1,6 +1,13 @@
1
+ /// <reference types="react" />
1
2
  interface RowSelectionProps {
2
3
  dataSource: any[];
3
4
  rowKey: string;
5
+ defaultRows?: any[];
6
+ }
7
+ interface RowSelectionReturnProps {
8
+ selectedRows: any[];
9
+ selectedKeys: any[];
10
+ setSelectedKeys: React.Dispatch<React.SetStateAction<any[]>>;
4
11
  }
5
12
  /**
6
13
  * 表格跨页面多选
@@ -9,5 +16,5 @@ interface RowSelectionProps {
9
16
  * @param {RowSelectionProps} props
10
17
  * @return {*}
11
18
  */
12
- export default function useRowSelection(props: RowSelectionProps): any;
19
+ export default function useRowSelection(props: RowSelectionProps): RowSelectionReturnProps;
13
20
  export {};
package/es/hooks/useRowSelection.js CHANGED
@@ -1,7 +1,7 @@
1
1
  import { useRef, useState, useEffect } from "react";
2
2
  function useRowSelection(props) {
3
- const { dataSource, rowKey } = props;
4
- const dataSourceRef = useRef([]);
3
+ const { dataSource, rowKey, defaultRows = [] } = props;
4
+ const dataSourceRef = useRef(defaultRows);
5
5
  const [selectedRows, setSelectedRows] = useState([]);
6
6
  const [selectedKeys, setSelectedKeys] = useState([]);
7
7
  useEffect(() => {
package/es/index.js CHANGED
@@ -4,7 +4,7 @@ import ReactDOM from "react-dom/client";
4
4
  import { BrowserRouter } from "react-router-dom";
5
5
  import { Table, Button } from "antd";
6
6
  import useConfig from "./hooks/useConfig";
7
- import { LoopSlide, SearchTable } from "./main";
7
+ import { useRowSelection, SearchTable } from "./main";
8
8
  let key = "U2FsdGVkX1/dG1NSXNR9hnp3Ech/v6Gh8CDDJxgBm1EPFQel12ySIf84ARXCPwTae7TzwgPvjOyE3S5rAEzl/wAZmId6pbezpFeFcJqxdmIl3FeluYHFxJzQHDETTvrr3G/REvv00kHptOVwg6ecjPH6yk7PNit0sWTBLorROxLxMD8lVDmOA66p7Zp4QnYzqScYJGFbutmfHYXfBRBe1Q2UKummJ798svNY5SIwEwl4spzgyWmhARtuyq4zhysFrj/xODuNDjtwitA6XfX566WcZkj3F+2P+mkYzDYOhXXaomnlybjrZ2hEHfcczQhUfJd89O8PNIuEWo24wjYRgMdKlw5CWSeocFCqV7ZJ/CV/7vNRcaO4awKlFNobLikkwDznxpcX+4UEej+ED+pgfmPQLsKedcfEscStkSAZXaD5pBRTiFU9xGLfDt6seUrEnMBeXkpMIY9j1SZDDK18/G7lSHjDQMZYZP6sfLdBdwY=";
9
9
  const Demo = () => {
10
10
  useConfig(key);
@@ -27,30 +27,13 @@ const Demo = () => {
27
27
  title: "c"
28
28
  }
29
29
  ];
30
- const [list, setList] = useState([]);
31
- const creditsData = [
32
- {
33
- title: "主演",
34
- people: [
35
- { name: "张三", role: "男主角" },
36
- { name: "李四", role: "女主角" }
37
- ]
38
- },
39
- {
40
- title: "制作团队",
41
- people: [
42
- { name: "王五", role: "导演" },
43
- { name: "赵六", role: "编剧" }
44
- ]
45
- },
46
- {
47
- title: "演员",
48
- people: [
49
- { name: "田七", role: "演员1" },
50
- { name: "如果需要使用其样式重置能力如果需要使用其样式重置能力", role: "演员2" }
51
- ]
52
- }
53
- ];
30
+ const [list, setList] = useState(Array(10).fill(0).map((v, i) => ({ id: i })));
31
+ const [current, setCurrent] = useState(1);
32
+ const data = [{ id: 1 }, { id: 12 }, { id: 21 }];
33
+ const { selectedKeys, selectedRows, setSelectedKeys } = useRowSelection({ dataSource: list, rowKey: "id", defaultRows: data });
34
+ useEffect(() => {
35
+ setSelectedKeys([1, 12, 21]);
36
+ }, []);
54
37
  return /* @__PURE__ */ jsxs("div", { style: { height: "100vh" }, children: [
55
38
  /* @__PURE__ */ jsx(Button, { onClick: () => setList(columns), children: "test" }),
56
39
  /* @__PURE__ */ jsx(
@@ -60,46 +43,38 @@ const Demo = () => {
60
43
  height: "400px",
61
44
  border: "1px solid #333",
62
45
  margin: "20px"
63
- },
64
- children: /* @__PURE__ */ jsx(LoopSlide, { speed: 6, height: "100%", mouseControl: true, children: /* @__PURE__ */ jsx("div", { style: { padding: "0px", textAlign: "center" }, children: creditsData.map((section, i) => /* @__PURE__ */ jsxs("div", { children: [
65
- /* @__PURE__ */ jsx(
66
- "h2",
67
- {
68
- onClick: () => void 0,
69
- style: { fontSize: "40px", marginBottom: "20px", fontWeight: "normal" },
70
- children: section.title
71
- }
72
- ),
73
- section.people.map((person, j) => /* @__PURE__ */ jsxs("div", { children: [
74
- /* @__PURE__ */ jsx("p", { style: { fontSize: "15px", margin: "5px 0" }, children: person.name }),
75
- person.role && /* @__PURE__ */ jsx("p", { style: { fontSize: "12px", color: "#aaa", marginBottom: "15px" }, children: person.role })
76
- ] }, j))
77
- ] }, i)) }) })
46
+ }
78
47
  }
79
48
  ),
80
49
  /* @__PURE__ */ jsx(
81
50
  SearchTable,
82
51
  {
83
52
  tableProps: {
84
- columns: list,
85
- dataSource: [
86
- { a: 1, b: 2, c: 3, id: 1 },
87
- { a: 1, b: 2, c: 3, id: 2 },
88
- { a: 1, b: 2, c: 3, id: 3 }
53
+ columns: [
54
+ {
55
+ dataIndex: "id",
56
+ title: "ID"
57
+ }
89
58
  ],
59
+ dataSource: list,
90
60
  resizeable: true,
91
61
  rowKey: "id",
92
- rowSelection: {},
93
- expandable: {
94
- expandedRowRender: () => {
95
- return /* @__PURE__ */ jsx("div", { children: "123" });
62
+ rowSelection: {
63
+ selectedRowKeys: selectedKeys,
64
+ preserveSelectedRowKeys: true,
65
+ onChange(keys) {
66
+ setSelectedKeys(keys);
96
67
  }
97
68
  },
98
- tableId: "demo1",
99
- storageKey: "szld-libs-test",
100
- components: {
101
- body: {
102
- cell: CustomCell
69
+ pagination: {
70
+ total: 25,
71
+ current,
72
+ pageSize: 10,
73
+ onChange(page, pageSize) {
74
+ const index = (page - 1) * 10;
75
+ const arr = Array(10).fill(0).map((v, i) => ({ id: i + index }));
76
+ setList(arr);
77
+ setCurrent(page);
103
78
  }
104
79
  }
105
80
  }
@@ -107,9 +82,6 @@ const Demo = () => {
107
82
  )
108
83
  ] });
109
84
  };
110
- const CustomCell = (props) => {
111
- return /* @__PURE__ */ jsx("td", { ...props, className: "tdtdtdtd", children: props.children });
112
- };
113
85
  ReactDOM.createRoot(document.getElementById("root")).render(
114
86
  /* @__PURE__ */ jsx(BrowserRouter, { children: /* @__PURE__ */ jsx(Demo, {}) })
115
87
  );
package/lib/hooks/useRowSelection.d.ts CHANGED
@@ -1,6 +1,13 @@
1
+ /// <reference types="react" />
1
2
  interface RowSelectionProps {
2
3
  dataSource: any[];
3
4
  rowKey: string;
5
+ defaultRows?: any[];
6
+ }
7
+ interface RowSelectionReturnProps {
8
+ selectedRows: any[];
9
+ selectedKeys: any[];
10
+ setSelectedKeys: React.Dispatch<React.SetStateAction<any[]>>;
4
11
  }
5
12
  /**
6
13
  * 表格跨页面多选
@@ -9,5 +16,5 @@ interface RowSelectionProps {
9
16
  * @param {RowSelectionProps} props
10
17
  * @return {*}
11
18
  */
12
- export default function useRowSelection(props: RowSelectionProps): any;
19
+ export default function useRowSelection(props: RowSelectionProps): RowSelectionReturnProps;
13
20
  export {};
package/lib/hooks/useRowSelection.js CHANGED
@@ -1,8 +1,8 @@
1
1
  "use strict";
2
2
  const react = require("react");
3
3
  function useRowSelection(props) {
4
- const { dataSource, rowKey } = props;
5
- const dataSourceRef = react.useRef([]);
4
+ const { dataSource, rowKey, defaultRows = [] } = props;
5
+ const dataSourceRef = react.useRef(defaultRows);
6
6
  const [selectedRows, setSelectedRows] = react.useState([]);
7
7
  const [selectedKeys, setSelectedKeys] = react.useState([]);
8
8
  react.useEffect(() => {
package/lib/index.js CHANGED
@@ -28,30 +28,13 @@ const Demo = () => {
28
28
  title: "c"
29
29
  }
30
30
  ];
31
- const [list, setList] = react.useState([]);
32
- const creditsData = [
33
- {
34
- title: "主演",
35
- people: [
36
- { name: "张三", role: "男主角" },
37
- { name: "李四", role: "女主角" }
38
- ]
39
- },
40
- {
41
- title: "制作团队",
42
- people: [
43
- { name: "王五", role: "导演" },
44
- { name: "赵六", role: "编剧" }
45
- ]
46
- },
47
- {
48
- title: "演员",
49
- people: [
50
- { name: "田七", role: "演员1" },
51
- { name: "如果需要使用其样式重置能力如果需要使用其样式重置能力", role: "演员2" }
52
- ]
53
- }
54
- ];
31
+ const [list, setList] = react.useState(Array(10).fill(0).map((v, i) => ({ id: i })));
32
+ const [current, setCurrent] = react.useState(1);
33
+ const data = [{ id: 1 }, { id: 12 }, { id: 21 }];
34
+ const { selectedKeys, selectedRows, setSelectedKeys } = main.useRowSelection({ dataSource: list, rowKey: "id", defaultRows: data });
35
+ react.useEffect(() => {
36
+ setSelectedKeys([1, 12, 21]);
37
+ }, []);
55
38
  return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { height: "100vh" }, children: [
56
39
  /* @__PURE__ */ jsxRuntime.jsx(antd.Button, { onClick: () => setList(columns), children: "test" }),
57
40
  /* @__PURE__ */ jsxRuntime.jsx(
@@ -61,46 +44,38 @@ const Demo = () => {
61
44
  height: "400px",
62
45
  border: "1px solid #333",
63
46
  margin: "20px"
64
- },
65
- children: /* @__PURE__ */ jsxRuntime.jsx(main.LoopSlide, { speed: 6, height: "100%", mouseControl: true, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { padding: "0px", textAlign: "center" }, children: creditsData.map((section, i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
66
- /* @__PURE__ */ jsxRuntime.jsx(
67
- "h2",
68
- {
69
- onClick: () => void 0,
70
- style: { fontSize: "40px", marginBottom: "20px", fontWeight: "normal" },
71
- children: section.title
72
- }
73
- ),
74
- section.people.map((person, j) => /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
75
- /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "15px", margin: "5px 0" }, children: person.name }),
76
- person.role && /* @__PURE__ */ jsxRuntime.jsx("p", { style: { fontSize: "12px", color: "#aaa", marginBottom: "15px" }, children: person.role })
77
- ] }, j))
78
- ] }, i)) }) })
47
+ }
79
48
  }
80
49
  ),
81
50
  /* @__PURE__ */ jsxRuntime.jsx(
82
51
  main.SearchTable,
83
52
  {
84
53
  tableProps: {
85
- columns: list,
86
- dataSource: [
87
- { a: 1, b: 2, c: 3, id: 1 },
88
- { a: 1, b: 2, c: 3, id: 2 },
89
- { a: 1, b: 2, c: 3, id: 3 }
54
+ columns: [
55
+ {
56
+ dataIndex: "id",
57
+ title: "ID"
58
+ }
90
59
  ],
60
+ dataSource: list,
91
61
  resizeable: true,
92
62
  rowKey: "id",
93
- rowSelection: {},
94
- expandable: {
95
- expandedRowRender: () => {
96
- return /* @__PURE__ */ jsxRuntime.jsx("div", { children: "123" });
63
+ rowSelection: {
64
+ selectedRowKeys: selectedKeys,
65
+ preserveSelectedRowKeys: true,
66
+ onChange(keys) {
67
+ setSelectedKeys(keys);
97
68
  }
98
69
  },
99
- tableId: "demo1",
100
- storageKey: "szld-libs-test",
101
- components: {
102
- body: {
103
- cell: CustomCell
70
+ pagination: {
71
+ total: 25,
72
+ current,
73
+ pageSize: 10,
74
+ onChange(page, pageSize) {
75
+ const index = (page - 1) * 10;
76
+ const arr = Array(10).fill(0).map((v, i) => ({ id: i + index }));
77
+ setList(arr);
78
+ setCurrent(page);
104
79
  }
105
80
  }
106
81
  }
@@ -108,9 +83,6 @@ const Demo = () => {
108
83
  )
109
84
  ] });
110
85
  };
111
- const CustomCell = (props) => {
112
- return /* @__PURE__ */ jsxRuntime.jsx("td", { ...props, className: "tdtdtdtd", children: props.children });
113
- };
114
86
  ReactDOM.createRoot(document.getElementById("root")).render(
115
87
  /* @__PURE__ */ jsxRuntime.jsx(reactRouterDom.BrowserRouter, { children: /* @__PURE__ */ jsxRuntime.jsx(Demo, {}) })
116
88
  );
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "szld-libs",
3
3
  "private": false,
4
- "version": "0.2.42",
4
+ "version": "0.2.44",
5
5
  "type": "module",
6
6
  "scripts": {
7
7
  "dev": "vite",