zmdms-webui 0.0.148 → 0.0.149
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/dist/es/node_modules/@ant-design/icons/es/icons/CloseOutlined.js +15 -0
- package/dist/es/node_modules/@ant-design/icons-svg/es/asn/CloseOutlined.js +5 -0
- package/dist/es/select/hooks.js +4 -1
- package/dist/es/zttransfer/CheckedResult.js +20 -0
- package/dist/es/zttransfer/Container.js +33 -3
- package/dist/es/zttransfer/SearchResult.js +17 -3
- package/dist/es/zttransfer/SelectContainer.js +39 -4
- package/dist/es/zttransfer/ZtTransfer.js +2 -2
- package/dist/es/zttransfer/index.css +1 -1
- package/dist/es/zttransfer/interface.d.ts +5 -0
- package/dist/index.dark.css +1 -1
- package/dist/index.default.css +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
import _objectSpread2 from '../../../../@babel/runtime/helpers/esm/objectSpread2.js';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import CloseOutlinedSvg from '../../../icons-svg/es/asn/CloseOutlined.js';
|
|
4
|
+
import AntdIcon from '../components/AntdIcon.js';
|
|
5
|
+
|
|
6
|
+
var CloseOutlined = function CloseOutlined(props, ref) {
|
|
7
|
+
return /*#__PURE__*/React.createElement(AntdIcon, _objectSpread2(_objectSpread2({}, props), {}, {
|
|
8
|
+
ref: ref,
|
|
9
|
+
icon: CloseOutlinedSvg
|
|
10
|
+
}));
|
|
11
|
+
};
|
|
12
|
+
CloseOutlined.displayName = 'CloseOutlined';
|
|
13
|
+
var CloseOutlined$1 = /*#__PURE__*/React.forwardRef(CloseOutlined);
|
|
14
|
+
|
|
15
|
+
export { CloseOutlined$1 as default };
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
// This icon file is generated automatically.
|
|
2
|
+
var CloseOutlined = { "icon": { "tag": "svg", "attrs": { "fill-rule": "evenodd", "viewBox": "64 64 896 896", "focusable": "false" }, "children": [{ "tag": "path", "attrs": { "d": "M799.86 166.31c.02 0 .04.02.08.06l57.69 57.7c.04.03.05.05.06.08a.12.12 0 010 .06c0 .03-.02.05-.06.09L569.93 512l287.7 287.7c.04.04.05.06.06.09a.12.12 0 010 .07c0 .02-.02.04-.06.08l-57.7 57.69c-.03.04-.05.05-.07.06a.12.12 0 01-.07 0c-.03 0-.05-.02-.09-.06L512 569.93l-287.7 287.7c-.04.04-.06.05-.09.06a.12.12 0 01-.07 0c-.02 0-.04-.02-.08-.06l-57.69-57.7c-.04-.03-.05-.05-.06-.07a.12.12 0 010-.07c0-.03.02-.05.06-.09L454.07 512l-287.7-287.7c-.04-.04-.05-.06-.06-.09a.12.12 0 010-.07c0-.02.02-.04.06-.08l57.7-57.69c.03-.04.05-.05.07-.06a.12.12 0 01.07 0c.03 0 .05.02.09.06L512 454.07l287.7-287.7c.04-.04.06-.05.09-.06a.12.12 0 01.07 0z" } }] }, "name": "close", "theme": "outlined" };
|
|
3
|
+
var CloseOutlinedSvg = CloseOutlined;
|
|
4
|
+
|
|
5
|
+
export { CloseOutlinedSvg as default };
|
package/dist/es/select/hooks.js
CHANGED
|
@@ -72,6 +72,9 @@ function useRenderChildren(props) {
|
|
|
72
72
|
? [unescapeString(item[lineFeedKey])]
|
|
73
73
|
: [];
|
|
74
74
|
}
|
|
75
|
+
var joinTitleStr = Array.isArray(joinTitle)
|
|
76
|
+
? joinTitle === null || joinTitle === void 0 ? void 0 : joinTitle.join(joinStr)
|
|
77
|
+
: "";
|
|
75
78
|
if (Array.isArray(joinTitle)) {
|
|
76
79
|
joinTitle.unshift(title);
|
|
77
80
|
}
|
|
@@ -91,7 +94,7 @@ function useRenderChildren(props) {
|
|
|
91
94
|
// key={`${key}${index}`}
|
|
92
95
|
, __assign({ value: value,
|
|
93
96
|
// 原本传入需要显示的title
|
|
94
|
-
oldTitle: title, title: resultTitle, disabled: disabled }, { children: [resultTitle, Array.isArray(linefeedTitle) && linefeedTitle.length > 0 ? (jsx("div", __assign({ className: "ztxk-select--feed-item" }, { children: linefeedTitle === null || linefeedTitle === void 0 ? void 0 : linefeedTitle.join(lineFeedStr) }))) : ("")] }), key));
|
|
97
|
+
oldTitle: title, joinTitle: joinTitleStr, title: resultTitle, disabled: disabled }, { children: [resultTitle, Array.isArray(linefeedTitle) && linefeedTitle.length > 0 ? (jsx("div", __assign({ className: "ztxk-select--feed-item" }, { children: linefeedTitle === null || linefeedTitle === void 0 ? void 0 : linefeedTitle.join(lineFeedStr) }))) : ("")] }), key));
|
|
95
98
|
})] }));
|
|
96
99
|
}
|
|
97
100
|
return null;
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import { __assign } from '../_virtual/_tslib.js';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { memo } from 'react';
|
|
4
|
+
import CloseOutlined from '../node_modules/@ant-design/icons/es/icons/CloseOutlined.js';
|
|
5
|
+
|
|
6
|
+
// 搜索结果
|
|
7
|
+
// 分为单选搜索结果
|
|
8
|
+
// 多选搜索结果
|
|
9
|
+
var CheckedResult = function (_a) {
|
|
10
|
+
var dataList = _a.dataList, onClearIndex = _a.onClearIndex, parseCheckedItem = _a.parseCheckedItem;
|
|
11
|
+
return (jsx("div", __assign({ className: "checked-result--list" }, { children: dataList === null || dataList === void 0 ? void 0 : dataList.map(function (item, index) {
|
|
12
|
+
var newItem = parseCheckedItem ? parseCheckedItem(item, index) : item;
|
|
13
|
+
return (jsxs("div", __assign({ className: "checked-result--item" }, { children: [jsx("p", __assign({ className: "checked-result--item__title" }, { children: newItem.title })), jsx("p", __assign({ className: "checked-result--item__describe" }, { children: newItem.describe })), jsx(CloseOutlined, { className: "checked-reslt--item__clear", onClick: function () {
|
|
14
|
+
onClearIndex && onClearIndex(index, newItem);
|
|
15
|
+
} })] }), newItem.id));
|
|
16
|
+
}) })));
|
|
17
|
+
};
|
|
18
|
+
var CheckedResult$1 = memo(CheckedResult);
|
|
19
|
+
|
|
20
|
+
export { CheckedResult$1 as default };
|
|
@@ -1,11 +1,41 @@
|
|
|
1
1
|
import { __assign } from '../_virtual/_tslib.js';
|
|
2
2
|
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
3
|
+
import { useCallback } from 'react';
|
|
3
4
|
import SelectContainer from './SelectContainer.js';
|
|
4
|
-
import
|
|
5
|
+
import CheckedResult from './CheckedResult.js';
|
|
5
6
|
|
|
6
7
|
var Container = function (props) {
|
|
7
|
-
var _a = props.mode, mode = _a === void 0 ? "multiple" : _a, value = props.value, completeValue = props.completeValue, onChange = props.onChange, onSearch = props.onSearch, children = props.children;
|
|
8
|
-
|
|
8
|
+
var _a = props.mode, mode = _a === void 0 ? "multiple" : _a, value = props.value, completeValue = props.completeValue, onChange = props.onChange, onSearch = props.onSearch, parseCheckedItem = props.parseCheckedItem, parseSearchItem = props.parseSearchItem, children = props.children;
|
|
9
|
+
// 删除已选中
|
|
10
|
+
var onClearIndex = useCallback(function (index, item) {
|
|
11
|
+
var newValue = value.slice();
|
|
12
|
+
var newCompleteValue = completeValue.slice();
|
|
13
|
+
newValue.splice(index, 1);
|
|
14
|
+
newCompleteValue.splice(index, 1);
|
|
15
|
+
onChange && onChange(newValue, newCompleteValue);
|
|
16
|
+
}, [onChange, value, completeValue]);
|
|
17
|
+
//
|
|
18
|
+
var onSearchChange = useCallback(function (searchValue, searchCompleteValue, deleteValue) {
|
|
19
|
+
if (searchValue) {
|
|
20
|
+
if (mode === "single") {
|
|
21
|
+
onChange && onChange(searchValue, searchCompleteValue);
|
|
22
|
+
return;
|
|
23
|
+
}
|
|
24
|
+
// 从已选中过滤当前选中
|
|
25
|
+
var filterSearchValue_1 = searchValue.filter(function (id) { return !(value === null || value === void 0 ? void 0 : value.includes(id)); });
|
|
26
|
+
var filterSearchCompleteValue = searchCompleteValue.filter(function (item) { return filterSearchValue_1 === null || filterSearchValue_1 === void 0 ? void 0 : filterSearchValue_1.includes(item.id); });
|
|
27
|
+
var newValue = (value === null || value === void 0 ? void 0 : value.slice()) || [];
|
|
28
|
+
var newCompleteValue = (completeValue === null || completeValue === void 0 ? void 0 : completeValue.slice()) || [];
|
|
29
|
+
newValue = newValue.filter(function (item) { return !(deleteValue === null || deleteValue === void 0 ? void 0 : deleteValue.find(function (i) { return i.id === item; })); });
|
|
30
|
+
newCompleteValue = newCompleteValue.filter(function (item) { return !(deleteValue === null || deleteValue === void 0 ? void 0 : deleteValue.find(function (i) { return i.id === item.id; })); });
|
|
31
|
+
newValue.push.apply(newValue, filterSearchValue_1);
|
|
32
|
+
newCompleteValue.push.apply(newCompleteValue, filterSearchCompleteValue);
|
|
33
|
+
onChange && onChange(newValue, newCompleteValue);
|
|
34
|
+
}
|
|
35
|
+
}, [mode, value, completeValue, onChange]);
|
|
36
|
+
return (jsx("div", __assign({ className: "container" }, { children: mode === "multiple" ? (jsxs(Fragment, { children: [jsx(SelectContainer, __assign({ title: "\u53EF\u9009", onSearch: onSearch, parseSearchItem: parseSearchItem, value: value, onChange: onSearchChange, mode: mode }, { children: children ? (children({ value: value, completeValue: completeValue, onChange: onChange })) : (jsx("div", { children: "1" })) })), jsx(SelectContainer, __assign({ title: "\u5DF2\u9009", checkedLength: (value === null || value === void 0 ? void 0 : value.length) || 0, allowClear: true, onClear: function () {
|
|
37
|
+
onChange && onChange([], []);
|
|
38
|
+
} }, { children: jsx(CheckedResult, { dataList: completeValue, parseCheckedItem: parseCheckedItem, onClearIndex: onClearIndex }) }))] })) : (jsx(SelectContainer, __assign({ onSearch: onSearch, parseSearchItem: parseSearchItem, value: value, onChange: onSearchChange, mode: mode }, { children: children ? (children({ value: value, completeValue: completeValue, onChange: onChange })) : (jsx("div", { children: "1" })) }))) })));
|
|
9
39
|
};
|
|
10
40
|
|
|
11
41
|
export { Container as default };
|
|
@@ -1,13 +1,27 @@
|
|
|
1
1
|
import { __assign } from '../_virtual/_tslib.js';
|
|
2
|
-
import {
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
3
|
import { Radio, Checkbox } from 'antd';
|
|
4
4
|
|
|
5
5
|
// 搜索结果
|
|
6
6
|
// 分为单选搜索结果
|
|
7
7
|
// 多选搜索结果
|
|
8
8
|
var SearchResult = function (_a) {
|
|
9
|
-
var mode = _a.mode
|
|
10
|
-
return mode === "single" ? (
|
|
9
|
+
var mode = _a.mode, dataList = _a.dataList, value = _a.value, onChange = _a.onChange;
|
|
10
|
+
return mode === "single" ? (jsx(Radio.Group, __assign({ className: "search-result--list", value: Array.isArray(value) ? value[0] : undefined, onChange: function (e) {
|
|
11
|
+
var id = e.target.value;
|
|
12
|
+
var newValue = [id];
|
|
13
|
+
var completeValue = dataList === null || dataList === void 0 ? void 0 : dataList.find(function (item) { return item.id === id; });
|
|
14
|
+
onChange && onChange(newValue, [completeValue]);
|
|
15
|
+
} }, { children: dataList === null || dataList === void 0 ? void 0 : dataList.map(function (item, index) {
|
|
16
|
+
return (jsxs(Radio, __assign({ value: item.id, className: "search-result--item" }, { children: [jsx("p", __assign({ className: "search-result--item__title" }, { children: item.title })), jsx("p", __assign({ className: "search-result--item__describe" }, { children: item.describe }))] }), item.id));
|
|
17
|
+
}) }))) : (jsx(Checkbox.Group, __assign({ className: "search-result--list", value: value, onChange: function (e) {
|
|
18
|
+
var newValue = e;
|
|
19
|
+
var completeValue = dataList === null || dataList === void 0 ? void 0 : dataList.filter(function (item) { return e.includes(item.id); });
|
|
20
|
+
var deleteValue = dataList === null || dataList === void 0 ? void 0 : dataList.filter(function (item) { return !e.includes(item.id); });
|
|
21
|
+
onChange && onChange(newValue, completeValue, deleteValue);
|
|
22
|
+
} }, { children: dataList === null || dataList === void 0 ? void 0 : dataList.map(function (item, index) {
|
|
23
|
+
return (jsxs(Checkbox, __assign({ value: item.id, className: "search-result--item" }, { children: [jsx("p", __assign({ className: "search-result--item__title" }, { children: item.title })), jsx("p", __assign({ className: "search-result--item__describe" }, { children: item.describe }))] }), item.id));
|
|
24
|
+
}) })));
|
|
11
25
|
};
|
|
12
26
|
|
|
13
27
|
export { SearchResult as default };
|
|
@@ -1,11 +1,46 @@
|
|
|
1
|
-
import { __assign } from '../_virtual/_tslib.js';
|
|
2
|
-
import {
|
|
1
|
+
import { __assign, __awaiter, __generator } from '../_virtual/_tslib.js';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import { useState } from 'react';
|
|
4
|
+
import SearchResult from './SearchResult.js';
|
|
3
5
|
import ButtonCom from '../button/button.js';
|
|
4
6
|
import MemoInput from '../input/input.js';
|
|
7
|
+
import { Spin } from 'antd';
|
|
5
8
|
|
|
6
9
|
var SelectContainer = function (props) {
|
|
7
|
-
var title = props.title, allowClear = props.allowClear, onClear = props.onClear, onSearch = props.onSearch, contentPadding = props.contentPadding, children = props.children;
|
|
8
|
-
|
|
10
|
+
var title = props.title, checkedLength = props.checkedLength, allowClear = props.allowClear, onClear = props.onClear, onSearch = props.onSearch, contentPadding = props.contentPadding, children = props.children, value = props.value, onChange = props.onChange, mode = props.mode;
|
|
11
|
+
var _a = useState(), searchValue = _a[0], setSearchValue = _a[1];
|
|
12
|
+
var _b = useState(false), spinning = _b[0], setSpinning = _b[1];
|
|
13
|
+
var _c = useState(), searchResult = _c[0], setSearchResult = _c[1];
|
|
14
|
+
return (jsx("div", __assign({ className: "zt-transfer--container" }, { children: jsxs(Spin, __assign({ spinning: spinning }, { children: [title && (jsxs("div", __assign({ className: "title" }, { children: [jsxs("span", { children: [title, checkedLength ? " (".concat(checkedLength, ")") : null] }), allowClear && (jsx(ButtonCom, __assign({ type: "link", onClick: onClear }, { children: "\u6E05\u7A7A" })))] }))), jsxs("div", __assign({ className: "wrap" }, { children: [jsx(MemoInput.Search, { className: "search", placeholder: "\u8BF7\u8F93\u5165\u5173\u952E\u5B57\u641C\u7D22", onSearch: function (v) { return __awaiter(void 0, void 0, void 0, function () {
|
|
15
|
+
var data;
|
|
16
|
+
return __generator(this, function (_a) {
|
|
17
|
+
switch (_a.label) {
|
|
18
|
+
case 0:
|
|
19
|
+
if (!v) {
|
|
20
|
+
setSearchValue(v);
|
|
21
|
+
return [2 /*return*/];
|
|
22
|
+
}
|
|
23
|
+
if (!onSearch) return [3 /*break*/, 5];
|
|
24
|
+
setSpinning(true);
|
|
25
|
+
setSearchValue(v);
|
|
26
|
+
_a.label = 1;
|
|
27
|
+
case 1:
|
|
28
|
+
_a.trys.push([1, 3, , 4]);
|
|
29
|
+
return [4 /*yield*/, onSearch(v)];
|
|
30
|
+
case 2:
|
|
31
|
+
data = _a.sent();
|
|
32
|
+
setSearchResult(data);
|
|
33
|
+
return [3 /*break*/, 4];
|
|
34
|
+
case 3:
|
|
35
|
+
_a.sent();
|
|
36
|
+
return [3 /*break*/, 4];
|
|
37
|
+
case 4:
|
|
38
|
+
setSpinning(false);
|
|
39
|
+
_a.label = 5;
|
|
40
|
+
case 5: return [2 /*return*/];
|
|
41
|
+
}
|
|
42
|
+
});
|
|
43
|
+
}); }, allowClear: true }), jsxs("div", __assign({ className: "content", style: { padding: contentPadding ? 10 : 0 } }, { children: [jsx("div", __assign({ style: { display: searchValue ? "none" : "block" } }, { children: children })), searchValue && (jsx(SearchResult, { value: value, onChange: onChange, dataList: searchResult, mode: mode }))] }))] }))] })) })));
|
|
9
44
|
};
|
|
10
45
|
|
|
11
46
|
export { SelectContainer as default };
|
|
@@ -5,7 +5,7 @@ import MemoTabs from '../tabs/tabs.js';
|
|
|
5
5
|
|
|
6
6
|
// 入口组件
|
|
7
7
|
var ZtTransfer = function (_a) {
|
|
8
|
-
var resetProps = __rest(_a, []);
|
|
8
|
+
var style = _a.style, resetProps = __rest(_a, ["style"]);
|
|
9
9
|
var items = [
|
|
10
10
|
{
|
|
11
11
|
label: "组织结构",
|
|
@@ -13,7 +13,7 @@ var ZtTransfer = function (_a) {
|
|
|
13
13
|
children: jsx(Container, __assign({}, resetProps)),
|
|
14
14
|
},
|
|
15
15
|
];
|
|
16
|
-
return (jsx("div", __assign({ className: "zt-transfer" }, { children: jsx(MemoTabs, { items: items, nonBorder: true }) })));
|
|
16
|
+
return (jsx("div", __assign({ className: "zt-transfer", style: __assign({ width: resetProps.mode === "single" ? 300 : 750 }, style) }, { children: jsx(MemoTabs, { items: items, nonBorder: true }) })));
|
|
17
17
|
};
|
|
18
18
|
|
|
19
19
|
export { ZtTransfer as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zt-transfer{padding:10px}.zt-transfer .container{display:flex;justify-content:space-between}.zt-transfer--container{border:1px solid #dee9f6;border-radius:4px;width:300px}.zt-transfer--container .title{align-items:center;background-color:#fafafa;border-bottom:1px solid #dee9f6;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;justify-content:space-between;line-height:32px;padding:0 0 0 10px}.zt-transfer--container .title>button{padding:4px 10px}.zt-transfer--container .wrap{display:flex;flex-direction:column;height:400px}.zt-transfer--container .wrap .search{padding:10px}.zt-transfer--container .wrap .search .ant-input{height:30px}.zt-transfer--container .wrap .search .ant-btn{background-color:#fff;border-color:#d9d9d9}.zt-transfer--container .wrap .content{flex:1;height:350px;overflow:auto}.search-result--list{display:flex;flex-direction:column
|
|
1
|
+
.zt-transfer{padding:10px}.zt-transfer .container{display:flex;justify-content:space-between}.zt-transfer--container{border:1px solid #dee9f6;border-radius:4px;width:300px}.zt-transfer--container .title{align-items:center;background-color:#fafafa;border-bottom:1px solid #dee9f6;border-top-left-radius:4px;border-top-right-radius:4px;display:flex;justify-content:space-between;line-height:32px;padding:0 0 0 10px}.zt-transfer--container .title>button{padding:4px 10px}.zt-transfer--container .wrap{display:flex;flex-direction:column;height:400px}.zt-transfer--container .wrap .search{padding:10px}.zt-transfer--container .wrap .search .ant-input-affix-wrapper{height:30px;padding:0 10px}.zt-transfer--container .wrap .search .ant-input{height:29px}.zt-transfer--container .wrap .search .ant-btn{background-color:#fff;border-color:#d9d9d9}.zt-transfer--container .wrap .content{flex:1;height:350px;overflow:auto}.search-result--list{display:flex;flex-direction:column}.search-result--list>.search-result--item{border-bottom:1px solid #dee9f6;display:flex;margin-left:0;margin-right:0;overflow:hidden;padding:10px 0 10px 10px;width:100%}.search-result--list>.search-result--item:first-child{padding-top:0}.search-result--list>.search-result--item>span:last-child{flex:1;width:100px}.search-result--list>.search-result--item .search-result--item__describe,.search-result--list>.search-result--item .search-result--item__title{word-wrap:break-word;overflow:hidden;white-space:normal;word-break:break-all}.search-result--list>.search-result--item .search-result--item__describe{color:#888}.checked-result--list{display:flex;flex-direction:column}.checked-result--list>.checked-result--item{border-bottom:1px solid #dee9f6;display:flex;flex-direction:column;margin-left:0;margin-right:0;overflow:hidden;padding:10px 0 10px 10px;position:relative;width:100%}.checked-result--list>.checked-result--item:first-child{padding-top:0}.checked-result--list>.checked-result--item .checked-reslt--item__clear{color:#d9d9d9;cursor:pointer;margin-top:-10px;position:absolute;right:0;top:50%;width:20px}.checked-result--list>.checked-result--item .checked-result--item__describe,.checked-result--list>.checked-result--item .checked-result--item__title{word-wrap:break-word;overflow:hidden;padding-right:16px;white-space:normal;word-break:break-all}.checked-result--list>.checked-result--item .checked-result--item__describe{color:#888;width:90%}
|
|
@@ -9,6 +9,7 @@ interface IRenderProps {
|
|
|
9
9
|
onChange?: (value: any, completeValue: any) => void;
|
|
10
10
|
}
|
|
11
11
|
interface IZtTransferProps {
|
|
12
|
+
style?: React__default.CSSProperties;
|
|
12
13
|
/** 选择模式 默认多选 */
|
|
13
14
|
mode?: "multiple" | "single";
|
|
14
15
|
/** 当前选中的值(key) */
|
|
@@ -21,6 +22,10 @@ interface IZtTransferProps {
|
|
|
21
22
|
onSearch?: (value: string) => void;
|
|
22
23
|
/** 左侧自定义渲染 */
|
|
23
24
|
children?: (options: IRenderProps) => React__default.ReactNode;
|
|
25
|
+
/** 选中渲染逻辑 */
|
|
26
|
+
parseCheckedItem?: (item: any, index: number) => any;
|
|
27
|
+
/** 搜索渲染逻辑 */
|
|
28
|
+
parseSearchItem?: (item: any, index: number) => any;
|
|
24
29
|
}
|
|
25
30
|
|
|
26
31
|
export { IZtTransferProps };
|