@cqsjjb/jjb-react-admin-component 3.3.8 → 3.3.10
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.
|
@@ -5,45 +5,45 @@ import { isEqual } from 'lodash';
|
|
|
5
5
|
import SearchForm from '@cqsjjb/jjb-react-admin-component/SearchForm';
|
|
6
6
|
import ProTable from '@cqsjjb/jjb-react-admin-component/Table';
|
|
7
7
|
|
|
8
|
-
/**
|
|
9
|
-
* @component ListDataContainer
|
|
10
|
-
* @description 通用列表数据容器组件,提供搜索表单、数据表格、分页等功能的完整列表页面解决方案
|
|
11
|
-
*
|
|
12
|
-
* @props {Array} columns - 表格列配置,遵循Ant Design Table组件的columns规范
|
|
13
|
-
* @props {Function} fetchDataApi - 数据获取API函数,接收分页和搜索参数,返回包含list和total的对象
|
|
14
|
-
* @props {Array} searchFormConfig - 搜索表单配置数组
|
|
15
|
-
* @param {React.Component} searchFormConfig[].field - 表单项组件(如ControlWrapper.Select)
|
|
16
|
-
* @param {string} searchFormConfig[].name - 表单项字段名
|
|
17
|
-
* @param {string} searchFormConfig[].label - 表单项标签
|
|
18
|
-
* @param {Object} searchFormConfig[].fieldProps - 传递给字段组件的属性
|
|
19
|
-
* @param {Object} searchFormConfig[].itemProps - 传递给Form.Item的属性
|
|
20
|
-
* @param {React.ReactNode} searchFormConfig[].content - 字段组件的子元素(如Select.Option列表)
|
|
21
|
-
* @param {boolean} searchFormConfig[].required - 是否必填
|
|
22
|
-
* @props {string} rowKey - 表格行键值,默认为'id'
|
|
23
|
-
* @props {Object} initialPagination - 初始分页配置,包含current、pageSize等分页属性
|
|
24
|
-
* @props {Object} tableProps - 传递给Table组件的属性
|
|
25
|
-
* @props {Object} searchFormProps - 传递给SearchForm组件的属性
|
|
26
|
-
* @props {boolean} proTable - 是否使用ProTable组件,默认为false
|
|
27
|
-
* @example
|
|
28
|
-
* // 基础用法
|
|
29
|
-
* <ListDataContainer
|
|
30
|
-
* columns={tableColumns}
|
|
31
|
-
* fetchDataApi={getCourseList}
|
|
32
|
-
* searchFormConfig={[
|
|
33
|
-
* {
|
|
34
|
-
* field: Select,
|
|
35
|
-
* name: 'status',
|
|
36
|
-
* label: '状态',
|
|
37
|
-
* }
|
|
38
|
-
* {
|
|
39
|
-
* field: Input,
|
|
40
|
-
* name: 'name',
|
|
41
|
-
* label: '名称',
|
|
42
|
-
* required: true,
|
|
43
|
-
* }
|
|
44
|
-
* ]}
|
|
45
|
-
* />
|
|
46
|
-
*
|
|
8
|
+
/**
|
|
9
|
+
* @component ListDataContainer
|
|
10
|
+
* @description 通用列表数据容器组件,提供搜索表单、数据表格、分页等功能的完整列表页面解决方案
|
|
11
|
+
*
|
|
12
|
+
* @props {Array} columns - 表格列配置,遵循Ant Design Table组件的columns规范
|
|
13
|
+
* @props {Function} fetchDataApi - 数据获取API函数,接收分页和搜索参数,返回包含list和total的对象
|
|
14
|
+
* @props {Array} searchFormConfig - 搜索表单配置数组
|
|
15
|
+
* @param {React.Component} searchFormConfig[].field - 表单项组件(如ControlWrapper.Select)
|
|
16
|
+
* @param {string} searchFormConfig[].name - 表单项字段名
|
|
17
|
+
* @param {string} searchFormConfig[].label - 表单项标签
|
|
18
|
+
* @param {Object} searchFormConfig[].fieldProps - 传递给字段组件的属性
|
|
19
|
+
* @param {Object} searchFormConfig[].itemProps - 传递给Form.Item的属性
|
|
20
|
+
* @param {React.ReactNode} searchFormConfig[].content - 字段组件的子元素(如Select.Option列表)
|
|
21
|
+
* @param {boolean} searchFormConfig[].required - 是否必填
|
|
22
|
+
* @props {string} rowKey - 表格行键值,默认为'id'
|
|
23
|
+
* @props {Object} initialPagination - 初始分页配置,包含current、pageSize等分页属性
|
|
24
|
+
* @props {Object} tableProps - 传递给Table组件的属性
|
|
25
|
+
* @props {Object} searchFormProps - 传递给SearchForm组件的属性
|
|
26
|
+
* @props {boolean} proTable - 是否使用ProTable组件,默认为false
|
|
27
|
+
* @example
|
|
28
|
+
* // 基础用法
|
|
29
|
+
* <ListDataContainer
|
|
30
|
+
* columns={tableColumns}
|
|
31
|
+
* fetchDataApi={getCourseList}
|
|
32
|
+
* searchFormConfig={[
|
|
33
|
+
* {
|
|
34
|
+
* field: Select,
|
|
35
|
+
* name: 'status',
|
|
36
|
+
* label: '状态',
|
|
37
|
+
* }
|
|
38
|
+
* {
|
|
39
|
+
* field: Input,
|
|
40
|
+
* name: 'name',
|
|
41
|
+
* label: '名称',
|
|
42
|
+
* required: true,
|
|
43
|
+
* }
|
|
44
|
+
* ]}
|
|
45
|
+
* />
|
|
46
|
+
*
|
|
47
47
|
*/
|
|
48
48
|
|
|
49
49
|
const SELECT_COMPONENTS = ['Select', 'TreeSelect', 'Cascader', 'DatePicker', 'TimePicker', 'Checkbox', 'Radio', 'Switch', 'Slider', 'Upload'];
|
|
@@ -76,10 +76,10 @@ const ListDataContainer = /*#__PURE__*/forwardRef(({
|
|
|
76
76
|
return Component.displayName || Component.constructor.name;
|
|
77
77
|
};
|
|
78
78
|
|
|
79
|
-
/**
|
|
80
|
-
* 数据加载与刷新方法
|
|
81
|
-
* @param {Object} [overrideParams={}] - 可选,用于覆盖内部参数的键值对
|
|
82
|
-
* 若传入,会覆盖同名的表单参数和分页参数(如page、pageSize或搜索字段)
|
|
79
|
+
/**
|
|
80
|
+
* 数据加载与刷新方法
|
|
81
|
+
* @param {Object} [overrideParams={}] - 可选,用于覆盖内部参数的键值对
|
|
82
|
+
* 若传入,会覆盖同名的表单参数和分页参数(如page、pageSize或搜索字段)
|
|
83
83
|
*/
|
|
84
84
|
const loadDataSource = useCallback(async (overrideParams = {}) => {
|
|
85
85
|
if (!fetchDataApi) return;
|
package/PhoneBox/index.less
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
.phone-box {
|
|
2
2
|
display: flex;
|
|
3
|
+
justify-content: center;
|
|
3
4
|
gap: 12px;
|
|
4
5
|
position: relative;
|
|
5
6
|
z-index: 1;
|
|
@@ -7,7 +8,7 @@
|
|
|
7
8
|
.phone-content {
|
|
8
9
|
position: absolute;
|
|
9
10
|
top: 17px;
|
|
10
|
-
left:
|
|
11
|
+
left: calc(50% - 158px);
|
|
11
12
|
z-index: 2;
|
|
12
13
|
border-radius: 40px;
|
|
13
14
|
overflow: hidden;
|
|
@@ -53,7 +54,7 @@
|
|
|
53
54
|
.phone-box-action {
|
|
54
55
|
position: absolute;
|
|
55
56
|
top: 0;
|
|
56
|
-
left:
|
|
57
|
+
left: calc(100% - 88px);
|
|
57
58
|
display: flex;
|
|
58
59
|
flex-direction: column;
|
|
59
60
|
gap: 16px;
|