@ecoding/components.antd 0.4.8 → 0.4.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.
- package/lib/core/async-transfer/index.d.ts +1 -0
- package/lib/core/async-transfer/index.js +1 -1
- package/lib/core/confirm/index.d.ts +1 -0
- package/lib/core/confirm/index.js +2 -2
- package/lib/core/form.list/index.js +2 -2
- package/lib/core/multiple-file-upload/index.d.ts +1 -0
- package/lib/core/multiple-file-upload/index.js +3 -3
- package/lib/core/multiple-img-upload/index.js +26 -33
- package/lib/core/multiple-single-img-upload/index.js +2 -2
- package/lib/core/single-file-upload/index.js +3 -3
- package/lib/core/single-img-upload/index.js +11 -11
- package/lib/core/table-pro/filters.horizontal.d.ts +1 -0
- package/lib/core/table-pro/filters.horizontal.js +13 -6
- package/lib/core/table-pro/index.d.ts +1 -0
- package/lib/core/table-pro/index.js +12 -6
- package/lib/core/tag.items/index.d.ts +1 -0
- package/lib/core/tag.items/index.js +9 -4
- package/package.json +2 -2
|
@@ -87,7 +87,7 @@ const AsyncTransfer = memo((props) => {
|
|
|
87
87
|
return option.label.join("").toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
|
88
88
|
}
|
|
89
89
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0;
|
|
90
|
-
}, oneWay: true, showSearch: true, showSelectAll: true, titles: ["选择源", "已选择"], render: (item) => item.label, locale: zhCN.Transfer, pagination: { pageSize: 10 } }, props, { listStyle: props.listStyle && JSON.stringify(props.listStyle) !== "{}"
|
|
90
|
+
}, oneWay: true, showSearch: true, showSelectAll: true, titles: [props.i18n ? props.i18n.$t("global.select.source", "选择源") : "选择源", props.i18n ? props.i18n.$t("global.selected", "已选择") : "已选择"], render: (item) => item.label, locale: zhCN.Transfer, pagination: { pageSize: 10 } }, props, { listStyle: props.listStyle && JSON.stringify(props.listStyle) !== "{}"
|
|
91
91
|
? props.listStyle
|
|
92
92
|
: {
|
|
93
93
|
width: props.width || 300,
|
|
@@ -36,7 +36,7 @@ const confirm = {
|
|
|
36
36
|
},
|
|
37
37
|
onCancel() {
|
|
38
38
|
if (loading) {
|
|
39
|
-
return Promise.reject("正在请求中,不可关闭");
|
|
39
|
+
return Promise.reject(opts.errorText || "正在请求中,不可关闭");
|
|
40
40
|
}
|
|
41
41
|
if (opts.onCancel) {
|
|
42
42
|
return opts.onCancel();
|
|
@@ -69,7 +69,7 @@ const confirm = {
|
|
|
69
69
|
},
|
|
70
70
|
onCancel() {
|
|
71
71
|
if (loading) {
|
|
72
|
-
return Promise.reject("正在请求中,不可关闭");
|
|
72
|
+
return Promise.reject(opts.errorText || "正在请求中,不可关闭");
|
|
73
73
|
}
|
|
74
74
|
if (opts.onCancel) {
|
|
75
75
|
return opts.onCancel();
|
|
@@ -141,7 +141,7 @@ const C = ({ columns, rules, tStyle, name, hideHeader, hideBottom, operation, i1
|
|
|
141
141
|
hideBottom || disabled ? null : (React.createElement("div", null,
|
|
142
142
|
React.createElement(Button, { icon: React.createElement(PlusCircleOutlined, null), type: "dashed", onClick: () => {
|
|
143
143
|
if (max && fields.length >= max) {
|
|
144
|
-
message.error(i18n ?
|
|
144
|
+
message.error(i18n ? `${i18n.$t("global.max.add", "最多可添加")} ${max}` : `最多可添加 ${max}`);
|
|
145
145
|
return;
|
|
146
146
|
}
|
|
147
147
|
add();
|
|
@@ -149,7 +149,7 @@ const C = ({ columns, rules, tStyle, name, hideHeader, hideBottom, operation, i1
|
|
|
149
149
|
tbodyRef.current.scrollTop = tbodyRef.current.scrollHeight;
|
|
150
150
|
}, 10);
|
|
151
151
|
afterAdd && afterAdd(fields.length);
|
|
152
|
-
} }, i18n ? i18n.$t("global.add", "
|
|
152
|
+
} }, i18n ? i18n.$t("global.add", "新增") : "新增")))));
|
|
153
153
|
}));
|
|
154
154
|
};
|
|
155
155
|
C.defaultProps = {
|
|
@@ -79,7 +79,7 @@ const MultipleUpload = (props) => {
|
|
|
79
79
|
mask: true,
|
|
80
80
|
title: response
|
|
81
81
|
? `${file.name}-${response.msg}` || `${file.name}-${response.message}`
|
|
82
|
-
: `${file.name}
|
|
82
|
+
: `${file.name}-${props.i18n ? props.i18n.$t('global.upload.error.file') : '服务出错,文件上传失败'}`
|
|
83
83
|
});
|
|
84
84
|
}
|
|
85
85
|
break;
|
|
@@ -89,7 +89,7 @@ const MultipleUpload = (props) => {
|
|
|
89
89
|
mask: true,
|
|
90
90
|
title: info.file.response
|
|
91
91
|
? `${info.file.name}-${(_a = info.file.response) === null || _a === void 0 ? void 0 : _a.msg}` || `${info.file.name}-${(_b = info.file.response) === null || _b === void 0 ? void 0 : _b.message}`
|
|
92
|
-
: `${info.file.name}
|
|
92
|
+
: `${info.file.name}-${props.i18n ? props.i18n.$t('global.upload.error.file') : '服务出错,文件上传失败'}`
|
|
93
93
|
});
|
|
94
94
|
props.onError && props.onError(info.file);
|
|
95
95
|
break;
|
|
@@ -108,7 +108,7 @@ const MultipleUpload = (props) => {
|
|
|
108
108
|
// }
|
|
109
109
|
const fileExtension = file.name && file.name.split('.').pop().toLowerCase();
|
|
110
110
|
if (fileExtension && props.type.indexOf(fileExtension) === -1) {
|
|
111
|
-
message.error(`请上传 ${props.type} 格式的文件!`);
|
|
111
|
+
message.error(props.i18n ? props.i18n.$t('global.total.item', { type: props.type }) : `请上传 ${props.type} 格式的文件!`);
|
|
112
112
|
reject();
|
|
113
113
|
return;
|
|
114
114
|
}
|
|
@@ -84,12 +84,14 @@ const MultipleImgUpload = (props) => {
|
|
|
84
84
|
}
|
|
85
85
|
return buildURL(props.action(), props.actionParams);
|
|
86
86
|
}, [props.actionParams, props.action]);
|
|
87
|
-
const getBase64 = (file) =>
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
87
|
+
const getBase64 = (file) => {
|
|
88
|
+
return new Promise((resolve, reject) => {
|
|
89
|
+
const reader = new FileReader();
|
|
90
|
+
reader.readAsDataURL(file);
|
|
91
|
+
reader.onload = () => resolve(reader.result);
|
|
92
|
+
reader.onerror = (error) => reject(error);
|
|
93
|
+
});
|
|
94
|
+
};
|
|
93
95
|
const handlePreview = (file) => __awaiter(void 0, void 0, void 0, function* () {
|
|
94
96
|
if (!file.url && !file.preview) {
|
|
95
97
|
file.preview = yield getBase64(file.originFileObj);
|
|
@@ -137,56 +139,47 @@ const MultipleImgUpload = (props) => {
|
|
|
137
139
|
ary.push("gif");
|
|
138
140
|
}
|
|
139
141
|
if (ary.indexOf(file.type.toLowerCase().replace(/image\//g, "")) === -1) {
|
|
140
|
-
message.error(
|
|
141
|
-
|
|
142
|
-
return;
|
|
142
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.support') : '支持图片格式为'} ${ary.join(",")}`);
|
|
143
|
+
return Upload.LIST_IGNORE;
|
|
143
144
|
}
|
|
144
145
|
const isLt2M = file.size / 1024 / 1024 < (props.opts.size || 1);
|
|
145
146
|
if (!isLt2M) {
|
|
146
|
-
message.error(
|
|
147
|
-
|
|
148
|
-
return;
|
|
147
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.size') : '图片大小必须小于'} ${props.opts.size} MB`);
|
|
148
|
+
return Upload.LIST_IGNORE;
|
|
149
149
|
}
|
|
150
150
|
const base64 = yield getBase64(file);
|
|
151
151
|
const wh = yield getImgwh(base64);
|
|
152
152
|
if (props.opts.w && props.opts.w !== wh.w) {
|
|
153
|
-
message.error(
|
|
154
|
-
|
|
155
|
-
return;
|
|
153
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.width') : '图片宽度不符合'} ${props.opts.w}px`);
|
|
154
|
+
return Upload.LIST_IGNORE;
|
|
156
155
|
}
|
|
157
156
|
if (props.opts.h && props.opts.h !== wh.h) {
|
|
158
|
-
message.error(
|
|
159
|
-
|
|
160
|
-
return;
|
|
157
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.height') : '图片高度不符合'} ${props.opts.h}px`);
|
|
158
|
+
return Upload.LIST_IGNORE;
|
|
161
159
|
}
|
|
162
160
|
if (props.opts.maxH && props.opts.maxH < wh.h) {
|
|
163
|
-
message.error(
|
|
164
|
-
|
|
165
|
-
return;
|
|
161
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.max.height') : '图片高度不能大于'} ${props.opts.maxH}px`);
|
|
162
|
+
return Upload.LIST_IGNORE;
|
|
166
163
|
}
|
|
167
164
|
if (props.opts.minH && props.opts.minH > wh.h) {
|
|
168
|
-
message.error(
|
|
169
|
-
|
|
170
|
-
return;
|
|
165
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.min.height') : '图片高度不能小于'} ${props.opts.minH}px`);
|
|
166
|
+
return Upload.LIST_IGNORE;
|
|
171
167
|
}
|
|
172
168
|
if (props.opts.maxW && props.opts.maxW < wh.w) {
|
|
173
|
-
message.error(
|
|
174
|
-
|
|
175
|
-
return;
|
|
169
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.max.width') : '图片宽度不能大于'} ${props.opts.maxW}px`);
|
|
170
|
+
return Upload.LIST_IGNORE;
|
|
176
171
|
}
|
|
177
172
|
if (props.opts.minW && props.opts.minW > wh.w) {
|
|
178
|
-
message.error(
|
|
179
|
-
|
|
180
|
-
return;
|
|
173
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.min.width') : '图片宽度不能小于'} ${props.opts.minW}px`);
|
|
174
|
+
return Upload.LIST_IGNORE;
|
|
181
175
|
}
|
|
182
176
|
if (props.opts.ratioW && props.opts.ratioH) {
|
|
183
177
|
// 保留2位小数进行比例计算
|
|
184
178
|
const ratio = Number((wh.w / wh.h).toFixed(2));
|
|
185
179
|
const targetRatio = Number((props.opts.ratioW / props.opts.ratioH).toFixed(2));
|
|
186
180
|
if (ratio !== targetRatio) {
|
|
187
|
-
message.error(
|
|
188
|
-
|
|
189
|
-
return;
|
|
181
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.ratio') : '图片宽度与高度比例必须是'} ${props.opts.ratioW} x ${props.opts.ratioH}`);
|
|
182
|
+
return Upload.LIST_IGNORE;
|
|
190
183
|
}
|
|
191
184
|
}
|
|
192
185
|
resolve();
|
|
@@ -6,7 +6,7 @@ import { arrayMove, SortableContext, horizontalListSortingStrategy, useSortable
|
|
|
6
6
|
import { CSS } from '@dnd-kit/utilities';
|
|
7
7
|
import ImgUpload from '../single-img-upload';
|
|
8
8
|
const SortableItem = (props) => {
|
|
9
|
-
const { index, items, updateItems } = props;
|
|
9
|
+
const { index, items, updateItems, i18n } = props;
|
|
10
10
|
const { attributes, listeners, setNodeRef, transform, transition } = useSortable({
|
|
11
11
|
id: props.id
|
|
12
12
|
});
|
|
@@ -46,7 +46,7 @@ const SortableItem = (props) => {
|
|
|
46
46
|
fontSize: '12px',
|
|
47
47
|
background: 'rgba(0,0,0,0.1)',
|
|
48
48
|
zIndex: 2
|
|
49
|
-
} },
|
|
49
|
+
} }, props.i18n ? props.i18n.$t('global.main.img', '主图') : '主图')) : null,
|
|
50
50
|
React.createElement(ImgUpload, Object.assign({}, props, { value: props.value, onChange: handleChange }))));
|
|
51
51
|
};
|
|
52
52
|
const MultiPileImgUpload = (props) => {
|
|
@@ -44,7 +44,7 @@ const SingleFileUpload = (props) => {
|
|
|
44
44
|
setLoading(false);
|
|
45
45
|
Toast.error({
|
|
46
46
|
mask: true,
|
|
47
|
-
title: info.file.response ? info.file.response.msg || info.file.response.message :
|
|
47
|
+
title: info.file.response ? info.file.response.msg || info.file.response.message : `${props.i18n ? props.i18n.$t('global.upload.error.file') : '服务出错,文件上传失败'}`
|
|
48
48
|
});
|
|
49
49
|
}
|
|
50
50
|
break;
|
|
@@ -52,7 +52,7 @@ const SingleFileUpload = (props) => {
|
|
|
52
52
|
setLoading(false);
|
|
53
53
|
Toast.error({
|
|
54
54
|
mask: true,
|
|
55
|
-
title: info.file.response ? info.file.response.msg || info.file.response.message :
|
|
55
|
+
title: info.file.response ? info.file.response.msg || info.file.response.message : `${props.i18n ? props.i18n.$t('global.upload.error.file') : '服务出错,文件上传失败'}`
|
|
56
56
|
});
|
|
57
57
|
props.onError && props.onError(info.file);
|
|
58
58
|
break;
|
|
@@ -71,7 +71,7 @@ const SingleFileUpload = (props) => {
|
|
|
71
71
|
// }
|
|
72
72
|
const fileExtension = file.name && file.name.split(".").pop().toLowerCase();
|
|
73
73
|
if (fileExtension && props.type.indexOf(fileExtension) === -1) {
|
|
74
|
-
message.error(`请上传 ${props.type} 格式的文件!`);
|
|
74
|
+
message.error(props.i18n ? props.i18n.$t('global.total.item', { type: props.type }) : `请上传 ${props.type} 格式的文件!`);
|
|
75
75
|
reject();
|
|
76
76
|
return;
|
|
77
77
|
}
|
|
@@ -64,14 +64,14 @@ const ImgUpload = (props) => {
|
|
|
64
64
|
else {
|
|
65
65
|
Toast.error({
|
|
66
66
|
mask: true,
|
|
67
|
-
title: info.file.response ? info.file.response.msg || info.file.response.message :
|
|
67
|
+
title: info.file.response ? info.file.response.msg || info.file.response.message : `${props.i18n ? props.i18n.$t('global.upload.error.img') : '服务出错,图片上传失败'}`
|
|
68
68
|
});
|
|
69
69
|
}
|
|
70
70
|
break;
|
|
71
71
|
case "error":
|
|
72
72
|
Toast.error({
|
|
73
73
|
mask: true,
|
|
74
|
-
title: info.file.response ? info.file.response.msg || info.file.response.message :
|
|
74
|
+
title: info.file.response ? info.file.response.msg || info.file.response.message : `${props.i18n ? props.i18n.$t('global.upload.error.img') : '服务出错,图片上传失败'}`
|
|
75
75
|
});
|
|
76
76
|
setLoading(false);
|
|
77
77
|
break;
|
|
@@ -91,45 +91,45 @@ const ImgUpload = (props) => {
|
|
|
91
91
|
ary.push("gif");
|
|
92
92
|
}
|
|
93
93
|
if (ary.indexOf(file.type.toLowerCase().replace(/image\//g, "")) === -1) {
|
|
94
|
-
message.error(
|
|
94
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.support') : '支持图片格式为'} ${ary.join(",")}`);
|
|
95
95
|
reject();
|
|
96
96
|
return;
|
|
97
97
|
}
|
|
98
98
|
const isLt2M = file.size / 1024 / 1024 < (props.opts.size || 1);
|
|
99
99
|
if (!isLt2M) {
|
|
100
|
-
message.error(
|
|
100
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.size') : '图片大小必须小于'} ${props.opts.size} MB`);
|
|
101
101
|
reject();
|
|
102
102
|
return;
|
|
103
103
|
}
|
|
104
104
|
const base64 = yield getBase64(file);
|
|
105
105
|
const wh = yield getImgwh(base64);
|
|
106
106
|
if (props.opts.w && props.opts.w !== wh.w) {
|
|
107
|
-
message.error(
|
|
107
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.width') : '图片宽度不符合'} ${props.opts.w}px`);
|
|
108
108
|
reject();
|
|
109
109
|
return;
|
|
110
110
|
}
|
|
111
111
|
if (props.opts.h && props.opts.h !== wh.h) {
|
|
112
|
-
message.error(
|
|
112
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.height') : '图片高度不符合'} ${props.opts.h}px`);
|
|
113
113
|
reject();
|
|
114
114
|
return;
|
|
115
115
|
}
|
|
116
116
|
if (props.opts.maxH && props.opts.maxH < wh.h) {
|
|
117
|
-
message.error(
|
|
117
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.max.height') : '图片高度不能大于'} ${props.opts.maxH}px`);
|
|
118
118
|
reject();
|
|
119
119
|
return;
|
|
120
120
|
}
|
|
121
121
|
if (props.opts.minH && props.opts.minH > wh.h) {
|
|
122
|
-
message.error(
|
|
122
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.min.height') : '图片高度不能小于'} ${props.opts.minH}px`);
|
|
123
123
|
reject();
|
|
124
124
|
return;
|
|
125
125
|
}
|
|
126
126
|
if (props.opts.maxW && props.opts.maxW < wh.w) {
|
|
127
|
-
message.error(
|
|
127
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.max.width') : '图片宽度不能大于'} ${props.opts.maxW}px`);
|
|
128
128
|
reject();
|
|
129
129
|
return;
|
|
130
130
|
}
|
|
131
131
|
if (props.opts.minW && props.opts.minW > wh.w) {
|
|
132
|
-
message.error(
|
|
132
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.min.width') : '图片宽度不能小于'} ${props.opts.minW}px`);
|
|
133
133
|
reject();
|
|
134
134
|
return;
|
|
135
135
|
}
|
|
@@ -138,7 +138,7 @@ const ImgUpload = (props) => {
|
|
|
138
138
|
const ratio = Number((wh.w / wh.h).toFixed(2));
|
|
139
139
|
const targetRatio = Number((props.opts.ratioW / props.opts.ratioH).toFixed(2));
|
|
140
140
|
if (ratio !== targetRatio) {
|
|
141
|
-
message.error(
|
|
141
|
+
message.error(`${props.i18n ? props.i18n.$t('global.img.ratio') : '图片宽度与高度比例必须是'} ${props.opts.ratioW} x ${props.opts.ratioH}`);
|
|
142
142
|
reject();
|
|
143
143
|
return;
|
|
144
144
|
}
|
|
@@ -9,7 +9,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
|
|
|
9
9
|
};
|
|
10
10
|
import React, { useRef, useEffect, useState, useMemo, memo } from 'react';
|
|
11
11
|
import { Button, Form, Row, Col, Space } from 'antd';
|
|
12
|
-
|
|
12
|
+
import { DownOutlined, UpOutlined } from '@ant-design/icons';
|
|
13
|
+
const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts, searchText, resetText, i18n }) => {
|
|
13
14
|
const [form] = Form.useForm(); // 该组件内form全局变量
|
|
14
15
|
const ref = useRef(null);
|
|
15
16
|
const refInitY = useRef(undefined);
|
|
@@ -38,6 +39,12 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts
|
|
|
38
39
|
}, 50);
|
|
39
40
|
}
|
|
40
41
|
};
|
|
42
|
+
const searchTextStr = useMemo(() => {
|
|
43
|
+
return searchText ? searchText : i18n ? i18n.$t('global.search') : '搜索';
|
|
44
|
+
}, []);
|
|
45
|
+
const resetTextStr = useMemo(() => {
|
|
46
|
+
return resetText ? resetText : i18n ? i18n.$t('global.reset') : '筛选';
|
|
47
|
+
}, []);
|
|
41
48
|
const colProps = useMemo(() => {
|
|
42
49
|
const colProps = colOpts ? colOpts : { span: 6 };
|
|
43
50
|
return colProps;
|
|
@@ -78,12 +85,12 @@ const FiltersHorizontal = ({ items, onFinish, onClear, y, setY, overMax, colOpts
|
|
|
78
85
|
return (React.createElement(Col, Object.assign({}, colProps), item));
|
|
79
86
|
}),
|
|
80
87
|
isOpShowAfter ? (React.createElement(Col, Object.assign({}, colProps, { style: { paddingTop: 4 } }),
|
|
81
|
-
React.createElement(Button, { type: "primary", className: 'mr10', size: 'small', htmlType: "submit" },
|
|
82
|
-
React.createElement(Button, { size: 'small', onClick: clear },
|
|
88
|
+
React.createElement(Button, { type: "primary", style: { minWidth: 60 }, className: 'mr10', size: 'small', htmlType: "submit" }, searchTextStr),
|
|
89
|
+
React.createElement(Button, { size: 'small', style: { minWidth: 60 }, onClick: clear }, resetTextStr))) : null),
|
|
83
90
|
!isOpShowAfter ? (React.createElement(Space, { size: "small", direction: isLineAfter ? undefined : "vertical", style: Object.assign({ width: 90, textAlign: "right" }, isLineAfter ? { width: 130, margin: "4px 0 0 12px" } : {}) },
|
|
84
|
-
React.createElement(Button, { type: "primary", size: 'small', htmlType: "submit" },
|
|
85
|
-
React.createElement(Button, { size: 'small', onClick: clear },
|
|
86
|
-
showMore ? (React.createElement(Button, { type: 'link', onClick: switchShow, style: { fontSize: 12, position: "absolute", bottom: -10, left: '50%', transform: "translateX(-50%)" }, size: 'small' }, moreFlag ?
|
|
91
|
+
React.createElement(Button, { type: "primary", style: { minWidth: 60 }, size: 'small', htmlType: "submit" }, searchTextStr),
|
|
92
|
+
React.createElement(Button, { size: 'small', style: { minWidth: 60 }, onClick: clear }, resetTextStr))) : null),
|
|
93
|
+
showMore ? (React.createElement(Button, { iconPosition: 'end', icon: moreFlag ? React.createElement(UpOutlined, null) : React.createElement(DownOutlined, null), type: 'link', onClick: switchShow, style: { fontSize: 12, position: "absolute", bottom: -10, left: '50%', transform: "translateX(-50%)" }, size: 'small' }, moreFlag ? i18n ? i18n.$t('global.collapse') : '收起' : i18n ? i18n.$t('global.expand') : '展开')) : null));
|
|
87
94
|
};
|
|
88
95
|
FiltersHorizontal.defaultProps = {
|
|
89
96
|
items: [],
|
|
@@ -36,6 +36,7 @@ interface IProps {
|
|
|
36
36
|
columnsTitle?: string;
|
|
37
37
|
selectType?: "checkbox" | "radio";
|
|
38
38
|
selectChangeHandler?: any;
|
|
39
|
+
i18n?: any;
|
|
39
40
|
locale?: TableLocale;
|
|
40
41
|
}
|
|
41
42
|
declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<IProps & React.RefAttributes<TableProRef>>>;
|
|
@@ -4,7 +4,7 @@ import { FilterOutlined, MenuOutlined } from '@ant-design/icons';
|
|
|
4
4
|
import TableProColumns from "./columns";
|
|
5
5
|
import { getDelateTargetByClassName } from "../../helpers/dom";
|
|
6
6
|
import FilterHorizontal from "./filters.horizontal";
|
|
7
|
-
const TablePro = ({ className, header, buttonArea, filterArea, filters, searchInputArea, loading, rowKey, dataSource, pagination, offsetY, columns, operationColumn, bordered = false, selectChangeHandler, selectType, onChange, expandable, columnsTitle
|
|
7
|
+
const TablePro = ({ className, header, buttonArea, filterArea, filters, searchInputArea, loading, rowKey, dataSource, pagination, offsetY, columns, operationColumn, bordered = false, selectChangeHandler, selectType, onChange, expandable, columnsTitle, filterTitle, locale, scrollY = '100%', scrollX, i18n, }, ref) => {
|
|
8
8
|
const tableRef = useRef(null);
|
|
9
9
|
const disColumnRef = useRef([]);
|
|
10
10
|
const [y, setY] = useState(scrollY);
|
|
@@ -23,6 +23,12 @@ const TablePro = ({ className, header, buttonArea, filterArea, filters, searchIn
|
|
|
23
23
|
};
|
|
24
24
|
const [openFilter, setOpenFilter] = useState(false);
|
|
25
25
|
const [openColumnFilter, setOpenColumnFilter] = useState(false);
|
|
26
|
+
const columnsTitleStr = useMemo(() => {
|
|
27
|
+
return columnsTitle ? columnsTitle : i18n ? i18n.$t('global.filter') : '显示列';
|
|
28
|
+
}, []);
|
|
29
|
+
const filterTitleStr = useMemo(() => {
|
|
30
|
+
return filterTitle ? filterTitle : i18n ? i18n.$t('global.column') : '筛选';
|
|
31
|
+
}, []);
|
|
26
32
|
const hideOpenFilter = () => {
|
|
27
33
|
setOpenFilter(false);
|
|
28
34
|
};
|
|
@@ -112,19 +118,19 @@ const TablePro = ({ className, header, buttonArea, filterArea, filters, searchIn
|
|
|
112
118
|
}));
|
|
113
119
|
return (React.createElement("div", { style: flexColumnStyle, className: className || '' },
|
|
114
120
|
header ? header : null,
|
|
115
|
-
filters ? (React.createElement(FilterHorizontal, Object.assign({ y: y, setY: setY }, filters))) : null,
|
|
121
|
+
filters ? (React.createElement(FilterHorizontal, Object.assign({ y: y, setY: setY }, filters, { i18n: i18n }))) : null,
|
|
116
122
|
React.createElement("div", { style: operationWrap },
|
|
117
123
|
buttonArea ? React.createElement("div", null, buttonArea) : React.createElement("div", null),
|
|
118
124
|
React.createElement("div", null,
|
|
119
125
|
searchInputArea ? searchInputArea : null,
|
|
120
|
-
filterArea ? (React.createElement(Popover, { placement: "leftBottom", title: React.createElement(Typography.Title, { level: 5 },
|
|
126
|
+
filterArea ? (React.createElement(Popover, { placement: "leftBottom", title: React.createElement(Typography.Title, { level: 5 }, filterTitleStr), content: React.cloneElement(filterArea, { hide: hideOpenFilter }), trigger: "click", open: openFilter, onOpenChange: (newOpen) => {
|
|
121
127
|
setOpenFilter(newOpen);
|
|
122
128
|
} },
|
|
123
|
-
React.createElement(Button, { type: "text", icon: React.createElement(FilterOutlined, null) },
|
|
124
|
-
innerColumns ? (React.createElement(Popover, { placement: "leftBottom", title: React.createElement(Typography.Title, { level: 5 },
|
|
129
|
+
React.createElement(Button, { type: "text", icon: React.createElement(FilterOutlined, null) }, filterTitleStr))) : null,
|
|
130
|
+
innerColumns ? (React.createElement(Popover, { placement: "leftBottom", title: React.createElement(Typography.Title, { level: 5 }, columnsTitleStr), content: React.createElement(TableProColumns, { disColumnRef: disColumnRef, columns: innerColumns, setColumns: setColumns }), trigger: "click", open: openColumnFilter, onOpenChange: (newOpen) => {
|
|
125
131
|
setOpenColumnFilter(newOpen);
|
|
126
132
|
} },
|
|
127
|
-
React.createElement(Button, { type: "text", icon: React.createElement(MenuOutlined, null) },
|
|
133
|
+
React.createElement(Button, { type: "text", icon: React.createElement(MenuOutlined, null) }, columnsTitleStr))) : null)),
|
|
128
134
|
dataSource ? (React.createElement("div", { style: { height: '100%', overflow: 'hidden' }, ref: tableRef },
|
|
129
135
|
React.createElement(Table, { rowSelection: selectType ? rowSelection : undefined, locale: locale ? locale : undefined, onRow: (record, index) => {
|
|
130
136
|
return {
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useEffect, useRef, useState } from 'react';
|
|
1
|
+
import React, { useEffect, useRef, useState, useMemo } from 'react';
|
|
2
2
|
import { PlusOutlined } from '@ant-design/icons';
|
|
3
3
|
import { isEqual } from "@ecoding/helper.is";
|
|
4
4
|
import { Flex, Input, message, Tag, theme, Tooltip } from 'antd';
|
|
@@ -39,6 +39,7 @@ const C = (props) => {
|
|
|
39
39
|
setInputValue(e.target.value.trim());
|
|
40
40
|
};
|
|
41
41
|
const handleInputConfirm = (e) => {
|
|
42
|
+
var _a;
|
|
42
43
|
if (inputValue) {
|
|
43
44
|
if (!tags.includes(inputValue.trim())) {
|
|
44
45
|
const values = [...tags, inputValue.trim()];
|
|
@@ -46,7 +47,7 @@ const C = (props) => {
|
|
|
46
47
|
props.onChange && props.onChange(values && values.length > 0 ? values : undefined);
|
|
47
48
|
}
|
|
48
49
|
else {
|
|
49
|
-
message.error(props.multipleError || '标签已存在');
|
|
50
|
+
message.error(props.multipleError || props.i18n ? (_a = props.i18n) === null || _a === void 0 ? void 0 : _a.$t('global.tag.exists') : '标签已存在');
|
|
50
51
|
}
|
|
51
52
|
}
|
|
52
53
|
setInputVisible(false);
|
|
@@ -57,6 +58,7 @@ const C = (props) => {
|
|
|
57
58
|
setEditInputValue(v);
|
|
58
59
|
};
|
|
59
60
|
const handleEditInputConfirm = (e) => {
|
|
61
|
+
var _a;
|
|
60
62
|
const newTags = [...(tags || [])];
|
|
61
63
|
if (!newTags.includes(editInputValue)) {
|
|
62
64
|
newTags[editInputIndex] = editInputValue;
|
|
@@ -65,7 +67,7 @@ const C = (props) => {
|
|
|
65
67
|
}
|
|
66
68
|
else {
|
|
67
69
|
if (newTags[editInputIndex] != editInputValue) {
|
|
68
|
-
message.error(props.multipleError || '标签已存在');
|
|
70
|
+
message.error(props.multipleError || props.i18n ? (_a = props.i18n) === null || _a === void 0 ? void 0 : _a.$t('global.tag.exists') : '标签已存在');
|
|
69
71
|
}
|
|
70
72
|
}
|
|
71
73
|
setEditInputIndex(-1);
|
|
@@ -82,6 +84,9 @@ const C = (props) => {
|
|
|
82
84
|
borderStyle: 'dashed',
|
|
83
85
|
color: token.colorTextDisabled
|
|
84
86
|
};
|
|
87
|
+
const addTagTextStr = useMemo(() => {
|
|
88
|
+
return props.addTagText ? props.addTagText : props.i18n ? props.i18n.$t('global.add') : '新增';
|
|
89
|
+
}, []);
|
|
85
90
|
useEffect(() => {
|
|
86
91
|
if (props.value && !isEqual(props.value, tags)) {
|
|
87
92
|
setTags(props.value);
|
|
@@ -106,7 +111,7 @@ const C = (props) => {
|
|
|
106
111
|
} }, isLongTag ? `${tag.slice(0, 20)}...` : tag)));
|
|
107
112
|
return isLongTag ? (React.createElement(Tooltip, { title: tag, key: tag }, tagElem)) : (tagElem);
|
|
108
113
|
}),
|
|
109
|
-
props.disabled ? (React.createElement(Tag, { style: tagDisabledPlusStyle, icon: React.createElement(PlusOutlined, null) },
|
|
114
|
+
props.disabled ? (React.createElement(Tag, { style: tagDisabledPlusStyle, icon: React.createElement(PlusOutlined, null) }, addTagTextStr)) : inputVisible ? (React.createElement(Input, { ref: inputRef, type: "text", size: "small", style: tagInputStyle, value: inputValue, onChange: handleInputChange, onBlur: handleInputConfirm, onPressEnter: handleInputConfirm })) : (React.createElement(Tag, { style: tagPlusStyle, icon: React.createElement(PlusOutlined, null), onClick: showInput }, addTagTextStr))));
|
|
110
115
|
};
|
|
111
116
|
C.defaultProps = {
|
|
112
117
|
disabled: false,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@ecoding/components.antd",
|
|
3
|
-
"version": "0.4.
|
|
3
|
+
"version": "0.4.10",
|
|
4
4
|
"author": "cxc",
|
|
5
5
|
"homepage": "",
|
|
6
6
|
"license": "MIT",
|
|
@@ -47,5 +47,5 @@
|
|
|
47
47
|
"antd": "5.27.0",
|
|
48
48
|
"axios": "^1.1.2"
|
|
49
49
|
},
|
|
50
|
-
"gitHead": "
|
|
50
|
+
"gitHead": "5dbebb1bdb179383358acbd1e860ac05f4affb15"
|
|
51
51
|
}
|