seeder-st2110-components 1.3.4 → 1.3.6
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/index.esm.js +218 -739
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +214 -736
- package/dist/index.js.map +1 -1
- package/package.json +1 -4
package/dist/index.js
CHANGED
|
@@ -7,6 +7,70 @@ var jsxRuntime = require('react/jsx-runtime');
|
|
|
7
7
|
var icons = require('@ant-design/icons');
|
|
8
8
|
var axios = require('axios');
|
|
9
9
|
|
|
10
|
+
function _defineProperty(e, r, t) {
|
|
11
|
+
return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
|
|
12
|
+
value: t,
|
|
13
|
+
enumerable: !0,
|
|
14
|
+
configurable: !0,
|
|
15
|
+
writable: !0
|
|
16
|
+
}) : e[r] = t, e;
|
|
17
|
+
}
|
|
18
|
+
function ownKeys(e, r) {
|
|
19
|
+
var t = Object.keys(e);
|
|
20
|
+
if (Object.getOwnPropertySymbols) {
|
|
21
|
+
var o = Object.getOwnPropertySymbols(e);
|
|
22
|
+
r && (o = o.filter(function (r) {
|
|
23
|
+
return Object.getOwnPropertyDescriptor(e, r).enumerable;
|
|
24
|
+
})), t.push.apply(t, o);
|
|
25
|
+
}
|
|
26
|
+
return t;
|
|
27
|
+
}
|
|
28
|
+
function _objectSpread2(e) {
|
|
29
|
+
for (var r = 1; r < arguments.length; r++) {
|
|
30
|
+
var t = null != arguments[r] ? arguments[r] : {};
|
|
31
|
+
r % 2 ? ownKeys(Object(t), !0).forEach(function (r) {
|
|
32
|
+
_defineProperty(e, r, t[r]);
|
|
33
|
+
}) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) {
|
|
34
|
+
Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r));
|
|
35
|
+
});
|
|
36
|
+
}
|
|
37
|
+
return e;
|
|
38
|
+
}
|
|
39
|
+
function _objectWithoutProperties(e, t) {
|
|
40
|
+
if (null == e) return {};
|
|
41
|
+
var o,
|
|
42
|
+
r,
|
|
43
|
+
i = _objectWithoutPropertiesLoose(e, t);
|
|
44
|
+
if (Object.getOwnPropertySymbols) {
|
|
45
|
+
var n = Object.getOwnPropertySymbols(e);
|
|
46
|
+
for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]);
|
|
47
|
+
}
|
|
48
|
+
return i;
|
|
49
|
+
}
|
|
50
|
+
function _objectWithoutPropertiesLoose(r, e) {
|
|
51
|
+
if (null == r) return {};
|
|
52
|
+
var t = {};
|
|
53
|
+
for (var n in r) if ({}.hasOwnProperty.call(r, n)) {
|
|
54
|
+
if (-1 !== e.indexOf(n)) continue;
|
|
55
|
+
t[n] = r[n];
|
|
56
|
+
}
|
|
57
|
+
return t;
|
|
58
|
+
}
|
|
59
|
+
function _toPrimitive(t, r) {
|
|
60
|
+
if ("object" != typeof t || !t) return t;
|
|
61
|
+
var e = t[Symbol.toPrimitive];
|
|
62
|
+
if (void 0 !== e) {
|
|
63
|
+
var i = e.call(t, r || "default");
|
|
64
|
+
if ("object" != typeof i) return i;
|
|
65
|
+
throw new TypeError("@@toPrimitive must return a primitive value.");
|
|
66
|
+
}
|
|
67
|
+
return ("string" === r ? String : Number)(t);
|
|
68
|
+
}
|
|
69
|
+
function _toPropertyKey(t) {
|
|
70
|
+
var i = _toPrimitive(t, "string");
|
|
71
|
+
return "symbol" == typeof i ? i : i + "";
|
|
72
|
+
}
|
|
73
|
+
|
|
10
74
|
const useHardwareWebSocket = socketUrl => {
|
|
11
75
|
// cpu_percent cpu使用率
|
|
12
76
|
// cpu_freq.current cpu频率
|
|
@@ -24,9 +88,7 @@ const useHardwareWebSocket = socketUrl => {
|
|
|
24
88
|
const handleMessage = react.useCallback(message => {
|
|
25
89
|
try {
|
|
26
90
|
if (message) {
|
|
27
|
-
setSystemStatus(prev => ({
|
|
28
|
-
...prev,
|
|
29
|
-
...message,
|
|
91
|
+
setSystemStatus(prev => _objectSpread2(_objectSpread2(_objectSpread2({}, prev), message), {}, {
|
|
30
92
|
lastUpdated: Date.now() // 添加更新时间戳
|
|
31
93
|
}));
|
|
32
94
|
}
|
|
@@ -37,7 +99,7 @@ const useHardwareWebSocket = socketUrl => {
|
|
|
37
99
|
|
|
38
100
|
// 监听消息 如果latestMessage变化,说明有新消息
|
|
39
101
|
react.useEffect(() => {
|
|
40
|
-
if (!latestMessage
|
|
102
|
+
if (!(latestMessage !== null && latestMessage !== void 0 && latestMessage.data)) return;
|
|
41
103
|
try {
|
|
42
104
|
const parsedMessage = JSON.parse(latestMessage.data);
|
|
43
105
|
handleMessage(parsedMessage);
|
|
@@ -45,7 +107,7 @@ const useHardwareWebSocket = socketUrl => {
|
|
|
45
107
|
console.error('Message parsing error:', error);
|
|
46
108
|
console.debug('Raw message:', latestMessage.data);
|
|
47
109
|
}
|
|
48
|
-
}, [latestMessage
|
|
110
|
+
}, [latestMessage === null || latestMessage === void 0 ? void 0 : latestMessage.data, handleMessage]);
|
|
49
111
|
return {
|
|
50
112
|
ps_status: systemStatus
|
|
51
113
|
};
|
|
@@ -54,7 +116,7 @@ var useHardwareWebSocket$1 = useHardwareWebSocket;
|
|
|
54
116
|
|
|
55
117
|
const formatBytes = function (bytes) {
|
|
56
118
|
let decimals = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
|
|
57
|
-
if (bytes === 0 || !bytes) return '0 Bytes';
|
|
119
|
+
if (bytes === 0 || !bytes || bytes < 0) return '0 Bytes';
|
|
58
120
|
const k = 1024;
|
|
59
121
|
const dm = decimals < 0 ? 0 : decimals;
|
|
60
122
|
const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
|
@@ -80,7 +142,7 @@ const UsageItem = /*#__PURE__*/react.memo(_ref => {
|
|
|
80
142
|
children: /*#__PURE__*/jsxRuntime.jsxs(antd.Space, {
|
|
81
143
|
size: 4,
|
|
82
144
|
children: [/*#__PURE__*/jsxRuntime.jsx("i", {
|
|
83
|
-
className:
|
|
145
|
+
className: "iconfont ".concat(iconClass, " text-xl")
|
|
84
146
|
}), /*#__PURE__*/jsxRuntime.jsx("span", {
|
|
85
147
|
className: "inline-block w-10 text-center",
|
|
86
148
|
children: children
|
|
@@ -92,7 +154,10 @@ var UsageItem$1 = UsageItem;
|
|
|
92
154
|
|
|
93
155
|
const getMaxNicTemp = function (sensors) {
|
|
94
156
|
let priorityFields = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : ["i350bb", "r8169_0_8300:00"];
|
|
95
|
-
const temps = priorityFields.flatMap(field =>
|
|
157
|
+
const temps = priorityFields.flatMap(field => {
|
|
158
|
+
var _sensors$field;
|
|
159
|
+
return (sensors === null || sensors === void 0 || (_sensors$field = sensors[field]) === null || _sensors$field === void 0 ? void 0 : _sensors$field.map(item => item.current)) || [];
|
|
160
|
+
}).filter(temp => typeof temp === 'number');
|
|
96
161
|
return temps.length ? Math.max(...temps) : null;
|
|
97
162
|
};
|
|
98
163
|
|
|
@@ -102,6 +167,7 @@ const getMaxSensorTemp = sensorData => {
|
|
|
102
167
|
return temps.length ? Math.max(...temps) : null;
|
|
103
168
|
};
|
|
104
169
|
const getDetail = function () {
|
|
170
|
+
var _sensors_temperatures, _sensors_temperatures2, _mem$total, _mem$percent, _getMaxNicTemp, _gpu_stats$0$utilizat, _gpu_stats$, _gpu_stats$0$temperat, _gpu_stats$2;
|
|
105
171
|
let status = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
106
172
|
const {
|
|
107
173
|
cpu_percent,
|
|
@@ -110,15 +176,15 @@ const getDetail = function () {
|
|
|
110
176
|
gpu_stats
|
|
111
177
|
} = status;
|
|
112
178
|
return {
|
|
113
|
-
cpu_usage: cpu_percent
|
|
114
|
-
cpu_temp: sensors_temperatures
|
|
115
|
-
mem_total: mem
|
|
116
|
-
mem_usage: mem
|
|
117
|
-
mem_temp: getMaxSensorTemp(sensors_temperatures
|
|
118
|
-
nic_temp: getMaxNicTemp(sensors_temperatures)
|
|
119
|
-
hd_temp: getMaxSensorTemp(sensors_temperatures
|
|
120
|
-
gpu_usage: gpu_stats
|
|
121
|
-
gpu_temp: gpu_stats
|
|
179
|
+
cpu_usage: cpu_percent !== null && cpu_percent !== void 0 ? cpu_percent : null,
|
|
180
|
+
cpu_temp: (_sensors_temperatures = sensors_temperatures === null || sensors_temperatures === void 0 || (_sensors_temperatures2 = sensors_temperatures.coretemp) === null || _sensors_temperatures2 === void 0 || (_sensors_temperatures2 = _sensors_temperatures2[0]) === null || _sensors_temperatures2 === void 0 ? void 0 : _sensors_temperatures2.current) !== null && _sensors_temperatures !== void 0 ? _sensors_temperatures : null,
|
|
181
|
+
mem_total: (_mem$total = mem === null || mem === void 0 ? void 0 : mem.total) !== null && _mem$total !== void 0 ? _mem$total : null,
|
|
182
|
+
mem_usage: (_mem$percent = mem === null || mem === void 0 ? void 0 : mem.percent) !== null && _mem$percent !== void 0 ? _mem$percent : null,
|
|
183
|
+
mem_temp: getMaxSensorTemp(sensors_temperatures === null || sensors_temperatures === void 0 ? void 0 : sensors_temperatures.spd5118),
|
|
184
|
+
nic_temp: (_getMaxNicTemp = getMaxNicTemp(sensors_temperatures)) !== null && _getMaxNicTemp !== void 0 ? _getMaxNicTemp : null,
|
|
185
|
+
hd_temp: getMaxSensorTemp(sensors_temperatures === null || sensors_temperatures === void 0 ? void 0 : sensors_temperatures.nvme),
|
|
186
|
+
gpu_usage: (_gpu_stats$0$utilizat = gpu_stats === null || gpu_stats === void 0 || (_gpu_stats$ = gpu_stats[0]) === null || _gpu_stats$ === void 0 ? void 0 : _gpu_stats$["utilization.gpu"]) !== null && _gpu_stats$0$utilizat !== void 0 ? _gpu_stats$0$utilizat : null,
|
|
187
|
+
gpu_temp: (_gpu_stats$0$temperat = gpu_stats === null || gpu_stats === void 0 || (_gpu_stats$2 = gpu_stats[0]) === null || _gpu_stats$2 === void 0 ? void 0 : _gpu_stats$2["temperature.gpu"]) !== null && _gpu_stats$0$temperat !== void 0 ? _gpu_stats$0$temperat : null
|
|
122
188
|
};
|
|
123
189
|
};
|
|
124
190
|
|
|
@@ -128,7 +194,7 @@ const createMetricItem = (title, iconClass, value, unit) => {
|
|
|
128
194
|
return {
|
|
129
195
|
title,
|
|
130
196
|
iconClass,
|
|
131
|
-
valueString:
|
|
197
|
+
valueString: "".concat(numValue).concat(unit),
|
|
132
198
|
value: numValue
|
|
133
199
|
};
|
|
134
200
|
};
|
|
@@ -141,10 +207,9 @@ const getItems = details => {
|
|
|
141
207
|
items.push(createMetricItem('CPU Temperature', 'icon-CPUwendu', details.cpu_temp, '℃'));
|
|
142
208
|
}
|
|
143
209
|
if (details.mem_usage !== null && details.mem_usage !== undefined) {
|
|
144
|
-
items.push({
|
|
145
|
-
...createMetricItem('Memory Usage', 'icon-shiyongshuai', details.mem_usage, '%'),
|
|
210
|
+
items.push(_objectSpread2(_objectSpread2({}, createMetricItem('Memory Usage', 'icon-shiyongshuai', details.mem_usage, '%')), {}, {
|
|
146
211
|
memTotal: details.mem_total
|
|
147
|
-
});
|
|
212
|
+
}));
|
|
148
213
|
}
|
|
149
214
|
if (details.mem_temp !== null && details.mem_temp !== undefined) {
|
|
150
215
|
items.push(createMetricItem('Memory Temperature', 'icon-wendu', details.mem_temp, '℃'));
|
|
@@ -214,7 +279,7 @@ const AuthorizationModal = _ref => {
|
|
|
214
279
|
onOk(trimmedCode);
|
|
215
280
|
};
|
|
216
281
|
const statusAlert = isActivated ? /*#__PURE__*/jsxRuntime.jsx(antd.Alert, {
|
|
217
|
-
message:
|
|
282
|
+
message: "".concat(statusMessage, ", will expire on ").concat(expiresTime),
|
|
218
283
|
type: "success",
|
|
219
284
|
showIcon: true
|
|
220
285
|
}) : /*#__PURE__*/jsxRuntime.jsx(antd.Alert, {
|
|
@@ -303,7 +368,7 @@ const useAuth = options => {
|
|
|
303
368
|
try {
|
|
304
369
|
setLoading(true);
|
|
305
370
|
const result = await fetchAuthInfo();
|
|
306
|
-
if (result
|
|
371
|
+
if (result !== null && result !== void 0 && result.commands) {
|
|
307
372
|
const commands = result.commands;
|
|
308
373
|
setAuthData(commands);
|
|
309
374
|
setIsRegistered(commands.accredit_status);
|
|
@@ -329,10 +394,10 @@ const useAuth = options => {
|
|
|
329
394
|
license_data: code
|
|
330
395
|
}
|
|
331
396
|
});
|
|
332
|
-
if (result
|
|
397
|
+
if (result !== null && result !== void 0 && result.commands) {
|
|
333
398
|
const commands = result.commands;
|
|
334
399
|
// type accredit_message
|
|
335
|
-
if (commands
|
|
400
|
+
if (commands !== null && commands !== void 0 && commands.accredit_status) {
|
|
336
401
|
setIsRegistered(true);
|
|
337
402
|
setAuthData(commands);
|
|
338
403
|
closeModal();
|
|
@@ -459,7 +524,7 @@ const useUpgrade = _ref => {
|
|
|
459
524
|
if (onMenuClick) {
|
|
460
525
|
onMenuClick(key);
|
|
461
526
|
} else {
|
|
462
|
-
console.warn(
|
|
527
|
+
console.warn("Unknown menu key: ".concat(key, " and no onMenuClick provided"));
|
|
463
528
|
}
|
|
464
529
|
}
|
|
465
530
|
};
|
|
@@ -472,7 +537,7 @@ const useUpgrade = _ref => {
|
|
|
472
537
|
try {
|
|
473
538
|
const res = await downloadFiles();
|
|
474
539
|
if (res.status !== 200) {
|
|
475
|
-
throw new Error(
|
|
540
|
+
throw new Error("Unexpected status code: ".concat(res.status));
|
|
476
541
|
}
|
|
477
542
|
|
|
478
543
|
// 默认值,兼容接口响应头没有定义文件名
|
|
@@ -482,7 +547,7 @@ const useUpgrade = _ref => {
|
|
|
482
547
|
// 获取接口响应的content-disposition字段值,以便获取到文件名
|
|
483
548
|
if (contentDisposition) {
|
|
484
549
|
const filenameMatch = contentDisposition.match(/filename\s*=\s*"?([^";]+)"?/i);
|
|
485
|
-
if (filenameMatch
|
|
550
|
+
if (filenameMatch !== null && filenameMatch !== void 0 && filenameMatch[1]) {
|
|
486
551
|
fileName = decodeURIComponent(filenameMatch[1]); // 处理编码后的文件名(如 %20 转空格)
|
|
487
552
|
}
|
|
488
553
|
}
|
|
@@ -511,7 +576,7 @@ const useUpgrade = _ref => {
|
|
|
511
576
|
}
|
|
512
577
|
};
|
|
513
578
|
const onUpload = () => {
|
|
514
|
-
if (inputRef
|
|
579
|
+
if (inputRef !== null && inputRef !== void 0 && inputRef.current) {
|
|
515
580
|
inputRef.current.click();
|
|
516
581
|
}
|
|
517
582
|
};
|
|
@@ -522,7 +587,8 @@ const useUpgrade = _ref => {
|
|
|
522
587
|
return;
|
|
523
588
|
}
|
|
524
589
|
try {
|
|
525
|
-
|
|
590
|
+
var _event$target$files;
|
|
591
|
+
const file = (_event$target$files = event.target.files) === null || _event$target$files === void 0 ? void 0 : _event$target$files[0];
|
|
526
592
|
if (!file) return;
|
|
527
593
|
showLoader();
|
|
528
594
|
setCurrentStatus('Uploading...');
|
|
@@ -570,7 +636,7 @@ const useUpgrade = _ref => {
|
|
|
570
636
|
const response = await upgradeStatus({
|
|
571
637
|
cancelToken: statusCancelToken.current.token
|
|
572
638
|
});
|
|
573
|
-
if (response
|
|
639
|
+
if ((response === null || response === void 0 ? void 0 : response.status) === 200) {
|
|
574
640
|
const {
|
|
575
641
|
code,
|
|
576
642
|
message: statusMessage
|
|
@@ -658,7 +724,7 @@ const useUpgrade = _ref => {
|
|
|
658
724
|
},
|
|
659
725
|
spin: true
|
|
660
726
|
}),
|
|
661
|
-
tip: currentStatus === "Uploading..." ?
|
|
727
|
+
tip: currentStatus === "Uploading..." ? "".concat(currentStatus, " ").concat(uploadProgress, "%") : currentStatus,
|
|
662
728
|
size: "large",
|
|
663
729
|
fullscreen: true
|
|
664
730
|
})]
|
|
@@ -683,7 +749,7 @@ const useSystemOperations = function () {
|
|
|
683
749
|
try {
|
|
684
750
|
AntdModal.confirm({
|
|
685
751
|
icon: /*#__PURE__*/jsxRuntime.jsx(icons.ExclamationCircleFilled, {}),
|
|
686
|
-
title:
|
|
752
|
+
title: "".concat(confirmTitle, " ").concat(action, "?"),
|
|
687
753
|
cancelText,
|
|
688
754
|
okText,
|
|
689
755
|
onOk: () => {
|
|
@@ -700,7 +766,7 @@ const useSystemOperations = function () {
|
|
|
700
766
|
}
|
|
701
767
|
});
|
|
702
768
|
} catch (error) {
|
|
703
|
-
console.error(
|
|
769
|
+
console.error("".concat(action.toUpperCase(), " ERROR: "), error);
|
|
704
770
|
}
|
|
705
771
|
}, [AntdModal, confirmTitle, cancelText, okText, onPowerOff, onRestart]);
|
|
706
772
|
const getMenuItems = react.useCallback(() => [{
|
|
@@ -723,585 +789,20 @@ const useSystemOperations = function () {
|
|
|
723
789
|
};
|
|
724
790
|
var useSystemOperations$1 = useSystemOperations;
|
|
725
791
|
|
|
726
|
-
const
|
|
727
|
-
let {
|
|
728
|
-
onClose,
|
|
729
|
-
onConfirm
|
|
730
|
-
} = _ref;
|
|
731
|
-
const [value, setValue] = react.useState('');
|
|
732
|
-
const handleConfirm = react.useCallback(() => {
|
|
733
|
-
onConfirm(value, () => setValue(''));
|
|
734
|
-
}, [confirm, value]);
|
|
735
|
-
const handleKeyDown = react.useCallback(e => {
|
|
736
|
-
if (e.key === 'Enter') {
|
|
737
|
-
handleConfirm();
|
|
738
|
-
}
|
|
739
|
-
}, [handleConfirm]);
|
|
740
|
-
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
741
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
|
|
742
|
-
label: "Folder Name",
|
|
743
|
-
style: {
|
|
744
|
-
marginBottom: 8
|
|
745
|
-
},
|
|
746
|
-
children: /*#__PURE__*/jsxRuntime.jsx(antd.Input, {
|
|
747
|
-
ref: ref,
|
|
748
|
-
value: value,
|
|
749
|
-
onChange: e => setValue(e.target.value),
|
|
750
|
-
onKeyDown: handleKeyDown,
|
|
751
|
-
size: "small",
|
|
752
|
-
style: {
|
|
753
|
-
width: 120
|
|
754
|
-
},
|
|
755
|
-
autoFocus: true
|
|
756
|
-
})
|
|
757
|
-
}), /*#__PURE__*/jsxRuntime.jsxs(antd.Flex, {
|
|
758
|
-
justify: "flex-end",
|
|
759
|
-
gap: "small",
|
|
760
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Button, {
|
|
761
|
-
type: "default",
|
|
762
|
-
size: "small",
|
|
763
|
-
onClick: onClose,
|
|
764
|
-
children: "Close"
|
|
765
|
-
}), /*#__PURE__*/jsxRuntime.jsx(antd.Button, {
|
|
766
|
-
type: "primary",
|
|
767
|
-
size: "small",
|
|
768
|
-
onClick: handleConfirm,
|
|
769
|
-
children: "OK"
|
|
770
|
-
})]
|
|
771
|
-
})]
|
|
772
|
-
});
|
|
773
|
-
});
|
|
774
|
-
const EditablePopover = _ref2 => {
|
|
775
|
-
let {
|
|
776
|
-
children,
|
|
777
|
-
add
|
|
778
|
-
} = _ref2;
|
|
779
|
-
const inputRef = react.useRef(null);
|
|
780
|
-
const [open, setOpen] = react.useState(false);
|
|
781
|
-
react.useEffect(() => {
|
|
782
|
-
if (open && inputRef.current) {
|
|
783
|
-
const timer = setTimeout(() => {
|
|
784
|
-
inputRef.current?.focus();
|
|
785
|
-
}, 100);
|
|
786
|
-
return () => clearTimeout(timer);
|
|
787
|
-
}
|
|
788
|
-
}, [open]);
|
|
789
|
-
|
|
790
|
-
// 使用 open 属性控制浮层显示
|
|
791
|
-
const hide = react.useCallback(() => {
|
|
792
|
-
setOpen(false);
|
|
793
|
-
}, []);
|
|
794
|
-
const handleConfirm = react.useCallback((newTitle, callback) => {
|
|
795
|
-
add(newTitle);
|
|
796
|
-
callback?.();
|
|
797
|
-
hide();
|
|
798
|
-
}, [add, hide]);
|
|
799
|
-
const handleOpenChange = react.useCallback(newOpen => {
|
|
800
|
-
setOpen(newOpen);
|
|
801
|
-
}, []);
|
|
802
|
-
return /*#__PURE__*/jsxRuntime.jsx(antd.Popover, {
|
|
803
|
-
content: /*#__PURE__*/jsxRuntime.jsx(PopoverContent, {
|
|
804
|
-
ref: inputRef,
|
|
805
|
-
onClose: hide,
|
|
806
|
-
onConfirm: handleConfirm
|
|
807
|
-
}),
|
|
808
|
-
trigger: "click",
|
|
809
|
-
open: open,
|
|
810
|
-
onOpenChange: handleOpenChange,
|
|
811
|
-
destroyOnHidden: true,
|
|
812
|
-
children: children
|
|
813
|
-
});
|
|
814
|
-
};
|
|
815
|
-
var EditablePopover$1 = /*#__PURE__*/react.memo(EditablePopover);
|
|
816
|
-
|
|
817
|
-
const EditableContext = /*#__PURE__*/react.createContext(null);
|
|
818
|
-
const TreeTitle = _ref => {
|
|
819
|
-
let {
|
|
820
|
-
...props
|
|
821
|
-
} = _ref;
|
|
822
|
-
const [form] = antd.Form.useForm();
|
|
823
|
-
return /*#__PURE__*/jsxRuntime.jsx(antd.Form, {
|
|
824
|
-
form: form,
|
|
825
|
-
component: false,
|
|
826
|
-
children: /*#__PURE__*/jsxRuntime.jsx(EditableContext.Provider, {
|
|
827
|
-
value: form,
|
|
828
|
-
children: /*#__PURE__*/jsxRuntime.jsx(TreeTitleNode, {
|
|
829
|
-
...props
|
|
830
|
-
})
|
|
831
|
-
})
|
|
832
|
-
});
|
|
833
|
-
};
|
|
834
|
-
const TreeTitleNode = _ref2 => {
|
|
835
|
-
let {
|
|
836
|
-
title,
|
|
837
|
-
nodeData,
|
|
838
|
-
handleSave,
|
|
839
|
-
handleDel,
|
|
840
|
-
handleAdd
|
|
841
|
-
} = _ref2;
|
|
842
|
-
const [editing, setEditing] = react.useState(false);
|
|
843
|
-
const inputRef = react.useRef(null);
|
|
844
|
-
const form = react.useContext(EditableContext);
|
|
845
|
-
react.useEffect(() => {
|
|
846
|
-
if (editing) {
|
|
847
|
-
inputRef.current?.focus();
|
|
848
|
-
}
|
|
849
|
-
}, [editing]);
|
|
850
|
-
const toggleEdit = react.useCallback(() => {
|
|
851
|
-
setEditing(prev => !prev);
|
|
852
|
-
form.setFieldsValue({
|
|
853
|
-
[nodeData.title]: nodeData.title
|
|
854
|
-
});
|
|
855
|
-
}, [form, nodeData.title]);
|
|
856
|
-
const save = react.useCallback(async () => {
|
|
857
|
-
try {
|
|
858
|
-
const values = await form.validateFields();
|
|
859
|
-
toggleEdit();
|
|
860
|
-
handleSave({
|
|
861
|
-
...nodeData,
|
|
862
|
-
title: values[nodeData.title]
|
|
863
|
-
});
|
|
864
|
-
} catch (errInfo) {
|
|
865
|
-
console.error('Save failed:', errInfo);
|
|
866
|
-
}
|
|
867
|
-
}, [form, toggleEdit, handleSave, nodeData]);
|
|
868
|
-
|
|
869
|
-
// 新建文件夹
|
|
870
|
-
// 修改文件/文件夹
|
|
871
|
-
// 删除文件/文件夹
|
|
872
|
-
const renderIconNode = react.useCallback(() => {
|
|
873
|
-
return /*#__PURE__*/jsxRuntime.jsxs("span", {
|
|
874
|
-
className: "flex",
|
|
875
|
-
onClick: e => e.stopPropagation(),
|
|
876
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(EditablePopover$1, {
|
|
877
|
-
add: newTitle => handleAdd(nodeData, newTitle),
|
|
878
|
-
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
879
|
-
className: "px-1",
|
|
880
|
-
title: "create",
|
|
881
|
-
children: /*#__PURE__*/jsxRuntime.jsx("i", {
|
|
882
|
-
className: "iconfont icon-jia"
|
|
883
|
-
})
|
|
884
|
-
})
|
|
885
|
-
}), !nodeData.isRoot && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
886
|
-
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
887
|
-
className: "px-1",
|
|
888
|
-
onClick: toggleEdit,
|
|
889
|
-
title: "edit",
|
|
890
|
-
children: /*#__PURE__*/jsxRuntime.jsx("i", {
|
|
891
|
-
className: "iconfont icon-bianji"
|
|
892
|
-
})
|
|
893
|
-
}), /*#__PURE__*/jsxRuntime.jsx(antd.Popconfirm, {
|
|
894
|
-
title: "Confirm deletion?",
|
|
895
|
-
onConfirm: () => handleDel(nodeData),
|
|
896
|
-
okText: "Yes",
|
|
897
|
-
cancelText: "No",
|
|
898
|
-
children: /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
899
|
-
className: "px-1",
|
|
900
|
-
title: "delete",
|
|
901
|
-
children: /*#__PURE__*/jsxRuntime.jsx("i", {
|
|
902
|
-
className: "iconfont icon-jian"
|
|
903
|
-
})
|
|
904
|
-
})
|
|
905
|
-
})]
|
|
906
|
-
})]
|
|
907
|
-
});
|
|
908
|
-
}, [handleAdd, nodeData, title, toggleEdit, handleDel]);
|
|
909
|
-
const renderChildNode = react.useCallback(() => {
|
|
910
|
-
return editing ? /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
|
|
911
|
-
style: {
|
|
912
|
-
margin: 0,
|
|
913
|
-
width: "100%"
|
|
914
|
-
},
|
|
915
|
-
name: nodeData.title,
|
|
916
|
-
children: /*#__PURE__*/jsxRuntime.jsx(antd.Input, {
|
|
917
|
-
ref: inputRef,
|
|
918
|
-
onPressEnter: save,
|
|
919
|
-
onBlur: save,
|
|
920
|
-
autoComplete: "off",
|
|
921
|
-
size: "small"
|
|
922
|
-
})
|
|
923
|
-
}) : /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
924
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Typography.Text, {
|
|
925
|
-
ellipsis: true,
|
|
926
|
-
style: {
|
|
927
|
-
width: "75%"
|
|
928
|
-
},
|
|
929
|
-
children: title
|
|
930
|
-
}), renderIconNode()]
|
|
931
|
-
});
|
|
932
|
-
}, [editing, nodeData.title, save, title, renderIconNode]);
|
|
933
|
-
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
934
|
-
className: "tree-title",
|
|
935
|
-
children: renderChildNode()
|
|
936
|
-
});
|
|
937
|
-
};
|
|
938
|
-
var TreeTitle$1 = /*#__PURE__*/react.memo(TreeTitle);
|
|
939
|
-
|
|
940
|
-
const replaceRootPath = path => {
|
|
941
|
-
if (typeof path !== 'string') return '';
|
|
942
|
-
return path.startsWith('root/') ? path.slice(5) : path;
|
|
943
|
-
};
|
|
944
|
-
|
|
945
|
-
/**
|
|
946
|
-
* 递归转换目录结构为树形结构
|
|
947
|
-
* @param {Array} data - 原始数据
|
|
948
|
-
* @param {string} [basePath='0'] - 基础路径
|
|
949
|
-
* @param {string} [parentRoute] - 父级路由路径
|
|
950
|
-
* @returns {Array} 转换后的树形结构
|
|
951
|
-
*/
|
|
952
|
-
const buildDirectoryTree = function (data) {
|
|
953
|
-
let basePath = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '0';
|
|
954
|
-
let parentRoute = arguments.length > 2 ? arguments[2] : undefined;
|
|
955
|
-
if (!Array.isArray(data)) return [];
|
|
956
|
-
return data.reduce((acc, item, index) => {
|
|
957
|
-
// 跳过文件类型,只处理目录
|
|
958
|
-
if (item.type === 'file') return acc;
|
|
959
|
-
const title = parentRoute ? item.name : item.sd_index || item.name;
|
|
960
|
-
const key = `${basePath}-${index}`;
|
|
961
|
-
const currentPath = parentRoute ? `${parentRoute}/${title}` : item.path || title;
|
|
962
|
-
const treeNode = {
|
|
963
|
-
title,
|
|
964
|
-
// 文件/文件夹名称
|
|
965
|
-
key,
|
|
966
|
-
icon: _ref => {
|
|
967
|
-
let {
|
|
968
|
-
expanded
|
|
969
|
-
} = _ref;
|
|
970
|
-
return expanded ? /*#__PURE__*/jsxRuntime.jsx(icons.FolderOpenOutlined, {}) : /*#__PURE__*/jsxRuntime.jsx(icons.FolderOutlined, {});
|
|
971
|
-
},
|
|
972
|
-
children: [],
|
|
973
|
-
isLeaf: false,
|
|
974
|
-
isRoot: Boolean(item.sd_index),
|
|
975
|
-
path: currentPath,
|
|
976
|
-
contents: (item.contents || []).filter(content => content.type === 'file'),
|
|
977
|
-
rawData: item // 保留原始数据
|
|
978
|
-
};
|
|
979
|
-
|
|
980
|
-
// 递归处理子目录
|
|
981
|
-
if (Array.isArray(item.contents) && item.contents.length > 0) {
|
|
982
|
-
treeNode.children = buildDirectoryTree(item.contents.filter(content => content.type !== 'file'), key, currentPath);
|
|
983
|
-
}
|
|
984
|
-
acc.push(treeNode);
|
|
985
|
-
return acc;
|
|
986
|
-
}, []);
|
|
987
|
-
};
|
|
988
|
-
|
|
989
|
-
/**
|
|
990
|
-
* 查找树中指定key的节点
|
|
991
|
-
* @param {Array} treeData - 树数据
|
|
992
|
-
* @param {string} targetKey - 要查找的key
|
|
993
|
-
* @returns {Array} 包含匹配节点的数组
|
|
994
|
-
*/
|
|
995
|
-
const findTreeNode = (treeData, targetKey) => {
|
|
996
|
-
if (!Array.isArray(treeData) || typeof targetKey !== 'string') return [];
|
|
997
|
-
const result = [];
|
|
998
|
-
const stack = [...treeData];
|
|
999
|
-
while (stack.length) {
|
|
1000
|
-
const node = stack.pop();
|
|
1001
|
-
if (node.key === targetKey) {
|
|
1002
|
-
result.push(node);
|
|
1003
|
-
// 如果只需要第一个匹配项,可以在这里break
|
|
1004
|
-
}
|
|
1005
|
-
if (Array.isArray(node.children)) {
|
|
1006
|
-
stack.push(...node.children);
|
|
1007
|
-
}
|
|
1008
|
-
}
|
|
1009
|
-
return result;
|
|
1010
|
-
};
|
|
1011
|
-
|
|
1012
|
-
/**
|
|
1013
|
-
* 获取树中所有节点的keys
|
|
1014
|
-
* @param {Array} treeData - 树数据
|
|
1015
|
-
* @returns {Array} 包含所有节点keys的数组
|
|
1016
|
-
*/
|
|
1017
|
-
const getAllNodeKeys = treeData => {
|
|
1018
|
-
if (!Array.isArray(treeData)) return [];
|
|
1019
|
-
const keys = [];
|
|
1020
|
-
const stack = [...treeData];
|
|
1021
|
-
while (stack.length) {
|
|
1022
|
-
const node = stack.pop();
|
|
1023
|
-
if (node.key != null) {
|
|
1024
|
-
keys.push(node.key);
|
|
1025
|
-
}
|
|
1026
|
-
if (Array.isArray(node.children)) {
|
|
1027
|
-
stack.push(...node.children);
|
|
1028
|
-
}
|
|
1029
|
-
}
|
|
1030
|
-
return keys;
|
|
1031
|
-
};
|
|
1032
|
-
|
|
1033
|
-
const useDirectoryTree = _ref => {
|
|
1034
|
-
let {
|
|
1035
|
-
getFolderData,
|
|
1036
|
-
createFolder,
|
|
1037
|
-
removeFolderFile,
|
|
1038
|
-
renameFolderFile,
|
|
1039
|
-
height = 760,
|
|
1040
|
-
theme = {
|
|
1041
|
-
components: {
|
|
1042
|
-
Tree: {
|
|
1043
|
-
titleHeight: 30
|
|
1044
|
-
}
|
|
1045
|
-
}
|
|
1046
|
-
}
|
|
1047
|
-
} = _ref;
|
|
1048
|
-
const [treeState, setTreeState] = react.useState({
|
|
1049
|
-
data: [],
|
|
1050
|
-
selectedKeys: [],
|
|
1051
|
-
expandedKeys: [],
|
|
1052
|
-
currentPath: "",
|
|
1053
|
-
contents: [],
|
|
1054
|
-
loading: false
|
|
1055
|
-
});
|
|
1056
|
-
const [originTreeData, setOriginTreeData] = react.useState([]);
|
|
1057
|
-
const updateTreeState = partialState => {
|
|
1058
|
-
setTreeState(prev => ({
|
|
1059
|
-
...prev,
|
|
1060
|
-
...partialState
|
|
1061
|
-
}));
|
|
1062
|
-
};
|
|
1063
|
-
|
|
1064
|
-
// 错误处理
|
|
1065
|
-
const handleError = (error, operation) => {
|
|
1066
|
-
console.error(`${operation} ERROR`, error);
|
|
1067
|
-
// 可以添加通知等统一错误处理
|
|
1068
|
-
};
|
|
1069
|
-
|
|
1070
|
-
// 路径处理工具
|
|
1071
|
-
const pathUtils = {
|
|
1072
|
-
replaceRoot: path => replaceRootPath(path),
|
|
1073
|
-
getNewPath: (node, newTitle) => {
|
|
1074
|
-
const arr = node.path.split('/');
|
|
1075
|
-
arr[arr.length - 1] = newTitle;
|
|
1076
|
-
return arr.join('/');
|
|
1077
|
-
},
|
|
1078
|
-
isSamePath: (path1, path2) => {
|
|
1079
|
-
return pathUtils.replaceRoot(path1) === pathUtils.replaceRoot(path2);
|
|
1080
|
-
}
|
|
1081
|
-
};
|
|
1082
|
-
|
|
1083
|
-
// 节点查找工具
|
|
1084
|
-
const nodeUtils = {
|
|
1085
|
-
findNode: (treeData, key) => {
|
|
1086
|
-
return findTreeNode(treeData, key);
|
|
1087
|
-
}
|
|
1088
|
-
};
|
|
1089
|
-
|
|
1090
|
-
// 获取文件夹数据 文件夹名称为空时返回根目录数据
|
|
1091
|
-
const fetchFolderData = react.useCallback(async function () {
|
|
1092
|
-
let initialization = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
1093
|
-
try {
|
|
1094
|
-
const data = await getFolderData({
|
|
1095
|
-
folder: ""
|
|
1096
|
-
});
|
|
1097
|
-
if (!data?.directoryTree) {
|
|
1098
|
-
return null;
|
|
1099
|
-
}
|
|
1100
|
-
setOriginTreeData(data.directoryTree);
|
|
1101
|
-
|
|
1102
|
-
// 构建根节点并生成树结构
|
|
1103
|
-
const rootNode = {
|
|
1104
|
-
name: 'root',
|
|
1105
|
-
type: 'directory',
|
|
1106
|
-
contents: data.directoryTree
|
|
1107
|
-
};
|
|
1108
|
-
// 递归生成treenodes
|
|
1109
|
-
const treeNodes = buildDirectoryTree([rootNode]);
|
|
1110
|
-
const rootChildren = treeNodes[0]?.children || [];
|
|
1111
|
-
if (!rootChildren.length) {
|
|
1112
|
-
return null;
|
|
1113
|
-
}
|
|
1114
|
-
const firstChild = rootChildren[0];
|
|
1115
|
-
const newState = {
|
|
1116
|
-
data: rootChildren,
|
|
1117
|
-
...(initialization && {
|
|
1118
|
-
selectedKeys: [firstChild?.key],
|
|
1119
|
-
expandedKeys: getAllNodeKeys(rootChildren),
|
|
1120
|
-
currentPath: firstChild?.path,
|
|
1121
|
-
contents: firstChild?.contents || []
|
|
1122
|
-
})
|
|
1123
|
-
};
|
|
1124
|
-
updateTreeState(newState);
|
|
1125
|
-
return rootChildren;
|
|
1126
|
-
} catch (error) {
|
|
1127
|
-
handleError(error, 'GET FOLDER DATA');
|
|
1128
|
-
}
|
|
1129
|
-
}, []);
|
|
1130
|
-
|
|
1131
|
-
// 初始化数据
|
|
1132
|
-
react.useEffect(() => {
|
|
1133
|
-
fetchFolderData(true);
|
|
1134
|
-
}, [fetchFolderData]);
|
|
1135
|
-
|
|
1136
|
-
// 创建文件夹
|
|
1137
|
-
const handleCreate = react.useCallback(async (node, newTitle) => {
|
|
1138
|
-
if (!newTitle?.trim()) return false;
|
|
1139
|
-
try {
|
|
1140
|
-
const path = pathUtils.replaceRoot(`${node.path}/${newTitle}`);
|
|
1141
|
-
await createFolder({
|
|
1142
|
-
path
|
|
1143
|
-
});
|
|
1144
|
-
const newTreeData = await fetchFolderData();
|
|
1145
|
-
|
|
1146
|
-
// 找到新增节点的父节点
|
|
1147
|
-
const parentNode = nodeUtils.findNode(newTreeData, node.key);
|
|
1148
|
-
if (parentNode?.[0]?.children) {
|
|
1149
|
-
// 通过 path 找到新增节点,得到新增节点的key
|
|
1150
|
-
const addedNode = parentNode[0].children.find(ch => pathUtils.isSamePath(ch.path, `root/${newTitle}`));
|
|
1151
|
-
if (addedNode) {
|
|
1152
|
-
updateTreeState({
|
|
1153
|
-
expandedKeys: [...treeState.expandedKeys, addedNode.key, parentNode[0].key]
|
|
1154
|
-
});
|
|
1155
|
-
}
|
|
1156
|
-
}
|
|
1157
|
-
} catch (error) {
|
|
1158
|
-
handleError(error, 'CREATE FOLDER');
|
|
1159
|
-
}
|
|
1160
|
-
}, [fetchFolderData, treeState.expandedKeys]);
|
|
1161
|
-
|
|
1162
|
-
// 删除文件/文件夹
|
|
1163
|
-
const handleRemove = react.useCallback(async node => {
|
|
1164
|
-
if (!node.path) return;
|
|
1165
|
-
try {
|
|
1166
|
-
await removeFolderFile({
|
|
1167
|
-
paths: [{
|
|
1168
|
-
path: pathUtils.replaceRoot(node.path)
|
|
1169
|
-
}]
|
|
1170
|
-
});
|
|
1171
|
-
// 如果删除的是当前选中节点,则重新初始化
|
|
1172
|
-
const shouldReinitialize = treeState.selectedKeys[0] === node.key;
|
|
1173
|
-
await fetchFolderData(shouldReinitialize);
|
|
1174
|
-
} catch (error) {
|
|
1175
|
-
handleError(error, 'REMOVE FOLDER/FILE');
|
|
1176
|
-
}
|
|
1177
|
-
}, [fetchFolderData, treeState.selectedKeys]);
|
|
1178
|
-
|
|
1179
|
-
// 修改文件/文件夹
|
|
1180
|
-
const handleRename = react.useCallback(async node => {
|
|
1181
|
-
const newPath = pathUtils.getNewPath(node, node.title);
|
|
1182
|
-
if (pathUtils.isSamePath(node.path, newPath)) return false;
|
|
1183
|
-
try {
|
|
1184
|
-
await renameFolderFile({
|
|
1185
|
-
old_path: pathUtils.replaceRoot(node.path),
|
|
1186
|
-
new_path: pathUtils.replaceRoot(newPath)
|
|
1187
|
-
});
|
|
1188
|
-
await fetchFolderData();
|
|
1189
|
-
} catch (error) {
|
|
1190
|
-
handleError(error, 'RENAME FOLDER/FILE');
|
|
1191
|
-
}
|
|
1192
|
-
}, [fetchFolderData]);
|
|
1193
|
-
|
|
1194
|
-
// 选择节点
|
|
1195
|
-
const onSelect = react.useCallback(async (keys, info) => {
|
|
1196
|
-
if (!keys.length || keys[0] === treeState.selectedKeys[0] && pathUtils.isSamePath(info.node.path, treeState.currentPath)) return;
|
|
1197
|
-
updateTreeState({
|
|
1198
|
-
selectedKeys: keys,
|
|
1199
|
-
currentPath: info.node.path,
|
|
1200
|
-
loading: true
|
|
1201
|
-
});
|
|
1202
|
-
try {
|
|
1203
|
-
// 模拟延迟加载
|
|
1204
|
-
// eslint-disable-next-line no-promise-executor-return
|
|
1205
|
-
await new Promise(resolve => setTimeout(resolve, 300));
|
|
1206
|
-
updateTreeState({
|
|
1207
|
-
contents: info.node.contents,
|
|
1208
|
-
loading: false
|
|
1209
|
-
});
|
|
1210
|
-
} catch (error) {
|
|
1211
|
-
handleError(error, 'SELECT NODE');
|
|
1212
|
-
updateTreeState({
|
|
1213
|
-
loading: false
|
|
1214
|
-
});
|
|
1215
|
-
}
|
|
1216
|
-
}, [treeState.selectedKeys, treeState.currentPath]);
|
|
1217
|
-
|
|
1218
|
-
// 展开节点
|
|
1219
|
-
const onExpand = react.useCallback(keys => {
|
|
1220
|
-
updateTreeState({
|
|
1221
|
-
expandedKeys: keys
|
|
1222
|
-
});
|
|
1223
|
-
}, []);
|
|
1224
|
-
|
|
1225
|
-
// 上传右侧文件或删除右侧文件 成功后的回调函数
|
|
1226
|
-
const updateFileContents = react.useCallback(async () => {
|
|
1227
|
-
// 找到当前选中的节点,更新当前节点的 contents
|
|
1228
|
-
const newTreeData = await fetchFolderData();
|
|
1229
|
-
const selectedNode = nodeUtils.findNode(newTreeData, treeState.selectedKeys[0]);
|
|
1230
|
-
if (selectedNode?.[0]) {
|
|
1231
|
-
updateTreeState({
|
|
1232
|
-
contents: selectedNode[0].contents
|
|
1233
|
-
});
|
|
1234
|
-
}
|
|
1235
|
-
}, [fetchFolderData, treeState.selectedKeys]);
|
|
1236
|
-
|
|
1237
|
-
// 删除文件
|
|
1238
|
-
const removeFile = react.useCallback(async url => {
|
|
1239
|
-
try {
|
|
1240
|
-
await removeFolderFile({
|
|
1241
|
-
path: url
|
|
1242
|
-
});
|
|
1243
|
-
await updateFileContents();
|
|
1244
|
-
} catch (error) {
|
|
1245
|
-
handleError(error, 'REMOVE FILE');
|
|
1246
|
-
}
|
|
1247
|
-
}, [updateFileContents]);
|
|
1248
|
-
const MemoizedTree = react.useMemo(() => {
|
|
1249
|
-
if (!treeState.data?.length) {
|
|
1250
|
-
return /*#__PURE__*/jsxRuntime.jsx(antd.Empty, {
|
|
1251
|
-
image: antd.Empty.PRESENTED_IMAGE_SIMPLE
|
|
1252
|
-
});
|
|
1253
|
-
}
|
|
1254
|
-
return /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
1255
|
-
style: {
|
|
1256
|
-
paddingTop: 16
|
|
1257
|
-
},
|
|
1258
|
-
children: /*#__PURE__*/jsxRuntime.jsx(antd.ConfigProvider, {
|
|
1259
|
-
theme: theme,
|
|
1260
|
-
children: /*#__PURE__*/jsxRuntime.jsx(antd.Tree, {
|
|
1261
|
-
blockNode: true,
|
|
1262
|
-
showIcon: true,
|
|
1263
|
-
selectedKeys: treeState.selectedKeys,
|
|
1264
|
-
expandedKeys: treeState.expandedKeys,
|
|
1265
|
-
onSelect: onSelect,
|
|
1266
|
-
onExpand: onExpand,
|
|
1267
|
-
treeData: treeState.data,
|
|
1268
|
-
titleRender: nodeData => /*#__PURE__*/jsxRuntime.jsx(TreeTitle$1, {
|
|
1269
|
-
title: nodeData.title,
|
|
1270
|
-
nodeData: nodeData,
|
|
1271
|
-
handleSave: handleRename,
|
|
1272
|
-
handleDel: handleRemove,
|
|
1273
|
-
handleAdd: handleCreate
|
|
1274
|
-
}),
|
|
1275
|
-
height: height
|
|
1276
|
-
})
|
|
1277
|
-
})
|
|
1278
|
-
}, "folder-directory");
|
|
1279
|
-
}, [treeState.data, treeState.selectedKeys, treeState.expandedKeys]);
|
|
1280
|
-
return {
|
|
1281
|
-
directoryTree: MemoizedTree,
|
|
1282
|
-
contents: treeState.contents,
|
|
1283
|
-
currentPath: treeState.currentPath,
|
|
1284
|
-
loading: treeState.loading,
|
|
1285
|
-
originTreeData,
|
|
1286
|
-
updateFileContents,
|
|
1287
|
-
removeFile
|
|
1288
|
-
};
|
|
1289
|
-
};
|
|
1290
|
-
var useDirectoryTree$1 = useDirectoryTree;
|
|
1291
|
-
|
|
792
|
+
const _excluded = ["menuItems", "onMenuClick", "downloadFiles", "upgradeExecute", "upgradeStatus", "acceptFileTypes", "uploadCompleteDelay", "statusPollingInterval", "children"];
|
|
1292
793
|
const UpgradeManager = _ref => {
|
|
1293
794
|
let {
|
|
1294
|
-
|
|
1295
|
-
|
|
1296
|
-
|
|
1297
|
-
|
|
1298
|
-
|
|
1299
|
-
|
|
1300
|
-
|
|
1301
|
-
|
|
1302
|
-
|
|
1303
|
-
|
|
1304
|
-
|
|
795
|
+
menuItems = [],
|
|
796
|
+
onMenuClick,
|
|
797
|
+
downloadFiles,
|
|
798
|
+
upgradeExecute,
|
|
799
|
+
upgradeStatus,
|
|
800
|
+
acceptFileTypes = "application/octet-stream",
|
|
801
|
+
uploadCompleteDelay = 3000,
|
|
802
|
+
statusPollingInterval = 1000,
|
|
803
|
+
children
|
|
804
|
+
} = _ref,
|
|
805
|
+
dropdownProps = _objectWithoutProperties(_ref, _excluded);
|
|
1305
806
|
const [upgradeElement] = useUpgrade$1({
|
|
1306
807
|
menuItems,
|
|
1307
808
|
onMenuClick,
|
|
@@ -1317,11 +818,9 @@ const UpgradeManager = _ref => {
|
|
|
1317
818
|
const dropdownElement = upgradeElement.props.children[0];
|
|
1318
819
|
const otherElements = upgradeElement.props.children.slice(1);
|
|
1319
820
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
1320
|
-
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Dropdown, {
|
|
1321
|
-
...dropdownProps,
|
|
1322
|
-
...dropdownElement.props,
|
|
821
|
+
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Dropdown, _objectSpread2(_objectSpread2(_objectSpread2({}, dropdownProps), dropdownElement.props), {}, {
|
|
1323
822
|
children: children
|
|
1324
|
-
}), otherElements]
|
|
823
|
+
})), otherElements]
|
|
1325
824
|
});
|
|
1326
825
|
}
|
|
1327
826
|
|
|
@@ -2559,7 +2058,7 @@ const SystemOperations = _ref => {
|
|
|
2559
2058
|
try {
|
|
2560
2059
|
AntdModal.confirm({
|
|
2561
2060
|
icon: /*#__PURE__*/jsxRuntime.jsx(icons.ExclamationCircleFilled, {}),
|
|
2562
|
-
title:
|
|
2061
|
+
title: "".concat(confirmTitle, " ").concat(action, "?"),
|
|
2563
2062
|
cancelText,
|
|
2564
2063
|
okText,
|
|
2565
2064
|
onOk: () => {
|
|
@@ -2576,7 +2075,7 @@ const SystemOperations = _ref => {
|
|
|
2576
2075
|
}
|
|
2577
2076
|
});
|
|
2578
2077
|
} catch (error) {
|
|
2579
|
-
console.error(
|
|
2078
|
+
console.error("".concat(action.toUpperCase(), " ERROR: "), error);
|
|
2580
2079
|
}
|
|
2581
2080
|
};
|
|
2582
2081
|
const handleMenuClick = _ref2 => {
|
|
@@ -2717,12 +2216,12 @@ function convertPtpStatusToArray(ptpStatus, fieldConfigs, fieldOrder) {
|
|
|
2717
2216
|
formType: 'text'
|
|
2718
2217
|
};
|
|
2719
2218
|
const value = ptpStatus[key];
|
|
2720
|
-
return {
|
|
2219
|
+
return _objectSpread2(_objectSpread2({
|
|
2721
2220
|
key,
|
|
2722
|
-
value
|
|
2723
|
-
|
|
2221
|
+
value
|
|
2222
|
+
}, config), {}, {
|
|
2724
2223
|
rawData: ptpStatus
|
|
2725
|
-
};
|
|
2224
|
+
});
|
|
2726
2225
|
});
|
|
2727
2226
|
}
|
|
2728
2227
|
const PtpModal = _ref => {
|
|
@@ -2744,7 +2243,7 @@ const PtpModal = _ref => {
|
|
|
2744
2243
|
react.useEffect(() => {
|
|
2745
2244
|
if (open) {
|
|
2746
2245
|
getPtpInfo().then(data => {
|
|
2747
|
-
if (data
|
|
2246
|
+
if (data !== null && data !== void 0 && data[0]) {
|
|
2748
2247
|
setPtpStatus(data[0]);
|
|
2749
2248
|
form.setFieldsValue(data[0]);
|
|
2750
2249
|
}
|
|
@@ -2757,8 +2256,7 @@ const PtpModal = _ref => {
|
|
|
2757
2256
|
}, [ptpStatus]);
|
|
2758
2257
|
const handleValueChange = changedValues => {
|
|
2759
2258
|
if ('t1_domain_number' in changedValues) {
|
|
2760
|
-
setPtpStatus(prev => ({
|
|
2761
|
-
...prev,
|
|
2259
|
+
setPtpStatus(prev => _objectSpread2(_objectSpread2({}, prev), {}, {
|
|
2762
2260
|
t1_domain_number: changedValues.t1_domain_number
|
|
2763
2261
|
}));
|
|
2764
2262
|
}
|
|
@@ -2778,6 +2276,7 @@ const PtpModal = _ref => {
|
|
|
2778
2276
|
}
|
|
2779
2277
|
};
|
|
2780
2278
|
const renderFormItem = item => {
|
|
2279
|
+
var _item$statusMap, _item$min, _item$max;
|
|
2781
2280
|
switch (item.formType) {
|
|
2782
2281
|
case 'select':
|
|
2783
2282
|
return /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
|
|
@@ -2788,7 +2287,7 @@ const PtpModal = _ref => {
|
|
|
2788
2287
|
return /*#__PURE__*/jsxRuntime.jsx(antd.Switch, {});
|
|
2789
2288
|
case 'badge':
|
|
2790
2289
|
const normalizedValue = typeof item.value === 'boolean' ? item.value ? 1 : 0 : item.value;
|
|
2791
|
-
const status = item.statusMap
|
|
2290
|
+
const status = ((_item$statusMap = item.statusMap) === null || _item$statusMap === void 0 ? void 0 : _item$statusMap[normalizedValue]) || {
|
|
2792
2291
|
text: 'Unknown',
|
|
2793
2292
|
color: 'gray'
|
|
2794
2293
|
};
|
|
@@ -2810,8 +2309,8 @@ const PtpModal = _ref => {
|
|
|
2810
2309
|
disabled: item.readOnly,
|
|
2811
2310
|
controls: false,
|
|
2812
2311
|
keyboard: false,
|
|
2813
|
-
min: item.min
|
|
2814
|
-
max: item.max
|
|
2312
|
+
min: (_item$min = item.min) !== null && _item$min !== void 0 ? _item$min : Number.MIN_SAFE_INTEGER,
|
|
2313
|
+
max: (_item$max = item.max) !== null && _item$max !== void 0 ? _item$max : Number.MAX_SAFE_INTEGER
|
|
2815
2314
|
});
|
|
2816
2315
|
default:
|
|
2817
2316
|
return /*#__PURE__*/jsxRuntime.jsx(antd.Input, {
|
|
@@ -2822,19 +2321,18 @@ const PtpModal = _ref => {
|
|
|
2822
2321
|
if (!open || !ptpStatus) return null;
|
|
2823
2322
|
|
|
2824
2323
|
// 合并默认模态框属性和传入的属性
|
|
2825
|
-
const mergedModalProps = {
|
|
2324
|
+
const mergedModalProps = _objectSpread2({
|
|
2826
2325
|
title: "PTP",
|
|
2827
2326
|
width: 650,
|
|
2828
2327
|
open,
|
|
2829
2328
|
okText: "Apply",
|
|
2830
2329
|
cancelText: "Close",
|
|
2831
2330
|
onCancel: onClose,
|
|
2832
|
-
onOk: handleSubmit
|
|
2833
|
-
|
|
2834
|
-
};
|
|
2331
|
+
onOk: handleSubmit
|
|
2332
|
+
}, modalProps);
|
|
2835
2333
|
|
|
2836
2334
|
// 合并默认表单属性和传入的属性
|
|
2837
|
-
const mergedFormProps = {
|
|
2335
|
+
const mergedFormProps = _objectSpread2({
|
|
2838
2336
|
form: form,
|
|
2839
2337
|
name: "ptpForm",
|
|
2840
2338
|
labelCol: {
|
|
@@ -2844,25 +2342,23 @@ const PtpModal = _ref => {
|
|
|
2844
2342
|
span: 16
|
|
2845
2343
|
},
|
|
2846
2344
|
autoComplete: "off",
|
|
2847
|
-
onValuesChange: handleValueChange
|
|
2848
|
-
|
|
2849
|
-
}
|
|
2850
|
-
|
|
2851
|
-
...mergedModalProps,
|
|
2852
|
-
children: /*#__PURE__*/jsxRuntime.jsx(antd.Form, {
|
|
2853
|
-
...mergedFormProps,
|
|
2345
|
+
onValuesChange: handleValueChange
|
|
2346
|
+
}, formProps);
|
|
2347
|
+
return /*#__PURE__*/jsxRuntime.jsx(antd.Modal, _objectSpread2(_objectSpread2({}, mergedModalProps), {}, {
|
|
2348
|
+
children: /*#__PURE__*/jsxRuntime.jsx(antd.Form, _objectSpread2(_objectSpread2({}, mergedFormProps), {}, {
|
|
2854
2349
|
children: ptpStatusArray.map(item => /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
|
|
2855
2350
|
label: item.label,
|
|
2856
2351
|
name: item.key,
|
|
2857
2352
|
initialValue: item.value,
|
|
2858
2353
|
children: renderFormItem(item)
|
|
2859
2354
|
}, item.key))
|
|
2860
|
-
})
|
|
2861
|
-
});
|
|
2355
|
+
}))
|
|
2356
|
+
}));
|
|
2862
2357
|
};
|
|
2863
2358
|
var PtpModal$1 = /*#__PURE__*/react.memo(PtpModal);
|
|
2864
2359
|
|
|
2865
2360
|
const NetworkFieldGroup = _ref => {
|
|
2361
|
+
var _fieldConfig$netmask$, _fieldConfig$netmask;
|
|
2866
2362
|
let {
|
|
2867
2363
|
prefix,
|
|
2868
2364
|
interfaces,
|
|
@@ -2883,14 +2379,12 @@ const NetworkFieldGroup = _ref => {
|
|
|
2883
2379
|
enabled: true
|
|
2884
2380
|
}
|
|
2885
2381
|
};
|
|
2886
|
-
const mergedFieldConfig = {
|
|
2887
|
-
...defaultFieldConfig,
|
|
2888
|
-
...fieldConfig,
|
|
2382
|
+
const mergedFieldConfig = _objectSpread2(_objectSpread2(_objectSpread2({}, defaultFieldConfig), fieldConfig), {}, {
|
|
2889
2383
|
netmask: {
|
|
2890
2384
|
label: "Netmask",
|
|
2891
|
-
enabled: fieldConfig.netmask
|
|
2385
|
+
enabled: (_fieldConfig$netmask$ = (_fieldConfig$netmask = fieldConfig.netmask) === null || _fieldConfig$netmask === void 0 ? void 0 : _fieldConfig$netmask.enabled) !== null && _fieldConfig$netmask$ !== void 0 ? _fieldConfig$netmask$ : defaultFieldConfig.netmask.enabled // 合并 enabled
|
|
2892
2386
|
}
|
|
2893
|
-
};
|
|
2387
|
+
});
|
|
2894
2388
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
2895
2389
|
children: [/*#__PURE__*/jsxRuntime.jsx(antd.Typography.Title, {
|
|
2896
2390
|
level: 5,
|
|
@@ -2961,24 +2455,20 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
2961
2455
|
hasInitialized: false
|
|
2962
2456
|
});
|
|
2963
2457
|
const preparedFieldConfig = react.useMemo(() => {
|
|
2964
|
-
const config = {
|
|
2965
|
-
...fieldConfig
|
|
2966
|
-
};
|
|
2458
|
+
const config = _objectSpread2({}, fieldConfig);
|
|
2967
2459
|
|
|
2968
2460
|
// 确保LAN和QSFP的配置存在
|
|
2969
2461
|
config.LAN = config.LAN || {};
|
|
2970
2462
|
config.QSFP = config.QSFP || {};
|
|
2971
2463
|
if (sections.includes('LAN')) {
|
|
2972
|
-
config.LAN.netmask = {
|
|
2973
|
-
...(config.LAN.netmask || {}),
|
|
2464
|
+
config.LAN.netmask = _objectSpread2(_objectSpread2({}, config.LAN.netmask || {}), {}, {
|
|
2974
2465
|
enabled: showNetmask.LAN
|
|
2975
|
-
};
|
|
2466
|
+
});
|
|
2976
2467
|
}
|
|
2977
2468
|
if (sections.includes('QSFP')) {
|
|
2978
|
-
config.QSFP.netmask = {
|
|
2979
|
-
...(config.QSFP.netmask || {}),
|
|
2469
|
+
config.QSFP.netmask = _objectSpread2(_objectSpread2({}, config.QSFP.netmask || {}), {}, {
|
|
2980
2470
|
enabled: showNetmask.QSFP
|
|
2981
|
-
};
|
|
2471
|
+
});
|
|
2982
2472
|
}
|
|
2983
2473
|
return config;
|
|
2984
2474
|
}, [fieldConfig, showNetmask, sections]);
|
|
@@ -3046,28 +2536,23 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3046
2536
|
const initialValues = react.useMemo(() => {
|
|
3047
2537
|
const values = {};
|
|
3048
2538
|
if (sections.includes('LAN') && lanConfigs.length > 0) {
|
|
3049
|
-
values.LAN = lanConfigs.map(config => ({
|
|
2539
|
+
values.LAN = lanConfigs.map(config => _objectSpread2({
|
|
3050
2540
|
connection_id: config.connection_id,
|
|
3051
2541
|
display_name: config.display_name,
|
|
3052
|
-
ip_address: config.ip_address
|
|
3053
|
-
|
|
3054
|
-
|
|
3055
|
-
|
|
3056
|
-
}));
|
|
2542
|
+
ip_address: config.ip_address
|
|
2543
|
+
}, showNetmask.LAN ? {
|
|
2544
|
+
netmask: config.netmask
|
|
2545
|
+
} : {}));
|
|
3057
2546
|
}
|
|
3058
2547
|
if (sections.includes('QSFP') && st2110Interfaces.length > 0) {
|
|
3059
|
-
values.QSFP = st2110Interfaces.map(iface => ({
|
|
3060
|
-
|
|
3061
|
-
|
|
3062
|
-
id: iface.id
|
|
3063
|
-
}),
|
|
2548
|
+
values.QSFP = st2110Interfaces.map(iface => _objectSpread2(_objectSpread2({}, iface.id !== undefined && {
|
|
2549
|
+
id: iface.id
|
|
2550
|
+
}), {}, {
|
|
3064
2551
|
display_name: iface.display_name,
|
|
3065
|
-
ip_address: iface.ip_address || iface.ip
|
|
3066
|
-
|
|
3067
|
-
|
|
3068
|
-
|
|
3069
|
-
} : {})
|
|
3070
|
-
}));
|
|
2552
|
+
ip_address: iface.ip_address || iface.ip
|
|
2553
|
+
}, showNetmask.QSFP ? {
|
|
2554
|
+
netmask: iface.netmask
|
|
2555
|
+
} : {}));
|
|
3071
2556
|
}
|
|
3072
2557
|
return values;
|
|
3073
2558
|
}, [lanConfigs, st2110Interfaces, sections, showNetmask]);
|
|
@@ -3129,32 +2614,32 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3129
2614
|
|
|
3130
2615
|
// 更新LAN配置
|
|
3131
2616
|
if (sections.includes('LAN') && values.LAN) {
|
|
3132
|
-
const lanData = values.LAN.map((item, index) =>
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
|
|
2617
|
+
const lanData = values.LAN.map((item, index) => {
|
|
2618
|
+
var _lanConfigs$index;
|
|
2619
|
+
return _objectSpread2({
|
|
2620
|
+
connection_id: (_lanConfigs$index = lanConfigs[index]) === null || _lanConfigs$index === void 0 ? void 0 : _lanConfigs$index.connection_id,
|
|
2621
|
+
ip_address: item.ip_address
|
|
2622
|
+
}, showNetmask.LAN ? {
|
|
3136
2623
|
netmask: item.netmask
|
|
3137
|
-
} : {})
|
|
3138
|
-
})
|
|
2624
|
+
} : {});
|
|
2625
|
+
});
|
|
3139
2626
|
updatePromises.push(updateLanConfig(lanData));
|
|
3140
2627
|
}
|
|
3141
2628
|
|
|
3142
2629
|
// 更新QSFP配置
|
|
3143
2630
|
if (sections.includes('QSFP') && values.QSFP) {
|
|
3144
|
-
const interfacesData = values.QSFP.map((item, index) =>
|
|
3145
|
-
|
|
3146
|
-
|
|
3147
|
-
id: st2110Interfaces
|
|
3148
|
-
}),
|
|
3149
|
-
...(st2110Interfaces?.[index]?.ip !== undefined ? {
|
|
2631
|
+
const interfacesData = values.QSFP.map((item, index) => {
|
|
2632
|
+
var _st2110Interfaces$ind, _st2110Interfaces$ind2, _st2110Interfaces$ind3;
|
|
2633
|
+
return _objectSpread2(_objectSpread2(_objectSpread2({}, (st2110Interfaces === null || st2110Interfaces === void 0 || (_st2110Interfaces$ind = st2110Interfaces[index]) === null || _st2110Interfaces$ind === void 0 ? void 0 : _st2110Interfaces$ind.id) !== undefined && {
|
|
2634
|
+
id: st2110Interfaces === null || st2110Interfaces === void 0 || (_st2110Interfaces$ind2 = st2110Interfaces[index]) === null || _st2110Interfaces$ind2 === void 0 ? void 0 : _st2110Interfaces$ind2.id
|
|
2635
|
+
}), (st2110Interfaces === null || st2110Interfaces === void 0 || (_st2110Interfaces$ind3 = st2110Interfaces[index]) === null || _st2110Interfaces$ind3 === void 0 ? void 0 : _st2110Interfaces$ind3.ip) !== undefined ? {
|
|
3150
2636
|
ip: item.ip_address
|
|
3151
2637
|
} : {
|
|
3152
2638
|
ip_address: item.ip_address
|
|
3153
|
-
}),
|
|
3154
|
-
...(showNetmask.QSFP ? {
|
|
2639
|
+
}), showNetmask.QSFP ? {
|
|
3155
2640
|
netmask: item.netmask
|
|
3156
|
-
} : {})
|
|
3157
|
-
})
|
|
2641
|
+
} : {});
|
|
2642
|
+
});
|
|
3158
2643
|
const st2110Data = st2110Interfaces.some(iface => 'id' in iface) ? {
|
|
3159
2644
|
st2110_interfaces: interfacesData
|
|
3160
2645
|
} : {
|
|
@@ -3180,7 +2665,7 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3180
2665
|
}, [form, sections, lanConfigs, st2110Interfaces, updateLanConfig, updateSysConfig, handleSuccess, message]);
|
|
3181
2666
|
|
|
3182
2667
|
// 合并默认模态框属性和传入的属性
|
|
3183
|
-
const mergedModalProps = {
|
|
2668
|
+
const mergedModalProps = _objectSpread2({
|
|
3184
2669
|
title: "Network Settings",
|
|
3185
2670
|
width: 650,
|
|
3186
2671
|
open,
|
|
@@ -3190,21 +2675,19 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3190
2675
|
okText: "Apply",
|
|
3191
2676
|
cancelText: "Close",
|
|
3192
2677
|
centered: true,
|
|
3193
|
-
styles: {
|
|
2678
|
+
styles: _objectSpread2({
|
|
3194
2679
|
body: {
|
|
3195
2680
|
padding: "16px 24px 8px 24px"
|
|
3196
|
-
}
|
|
3197
|
-
|
|
3198
|
-
|
|
3199
|
-
|
|
3200
|
-
|
|
3201
|
-
|
|
3202
|
-
|
|
3203
|
-
...modalProps
|
|
3204
|
-
};
|
|
2681
|
+
}
|
|
2682
|
+
}, restartRemark !== null && {
|
|
2683
|
+
footer: {
|
|
2684
|
+
paddingBottom: 28
|
|
2685
|
+
}
|
|
2686
|
+
})
|
|
2687
|
+
}, modalProps);
|
|
3205
2688
|
|
|
3206
2689
|
// 合并默认表单属性和传入的属性
|
|
3207
|
-
const mergedFormProps = {
|
|
2690
|
+
const mergedFormProps = _objectSpread2({
|
|
3208
2691
|
form: form,
|
|
3209
2692
|
labelCol: {
|
|
3210
2693
|
span: 6
|
|
@@ -3212,13 +2695,10 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3212
2695
|
wrapperCol: {
|
|
3213
2696
|
span: 18
|
|
3214
2697
|
},
|
|
3215
|
-
autoComplete: "off"
|
|
3216
|
-
|
|
3217
|
-
}
|
|
3218
|
-
|
|
3219
|
-
...mergedModalProps,
|
|
3220
|
-
children: [/*#__PURE__*/jsxRuntime.jsxs(antd.Form, {
|
|
3221
|
-
...mergedFormProps,
|
|
2698
|
+
autoComplete: "off"
|
|
2699
|
+
}, formProps);
|
|
2700
|
+
return /*#__PURE__*/jsxRuntime.jsxs(antd.Modal, _objectSpread2(_objectSpread2({}, mergedModalProps), {}, {
|
|
2701
|
+
children: [/*#__PURE__*/jsxRuntime.jsxs(antd.Form, _objectSpread2(_objectSpread2({}, mergedFormProps), {}, {
|
|
3222
2702
|
children: [sections.includes('LAN') && lanConfigs.length > 0 && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|
|
3223
2703
|
children: [/*#__PURE__*/jsxRuntime.jsx(NetworkFieldGroup, {
|
|
3224
2704
|
prefix: "LAN",
|
|
@@ -3230,8 +2710,8 @@ const NetworkSettingsModal = _ref2 => {
|
|
|
3230
2710
|
interfaces: st2110Interfaces,
|
|
3231
2711
|
fieldConfig: preparedFieldConfig.QSFP
|
|
3232
2712
|
})]
|
|
3233
|
-
}), restartRemark]
|
|
3234
|
-
});
|
|
2713
|
+
})), restartRemark]
|
|
2714
|
+
}));
|
|
3235
2715
|
};
|
|
3236
2716
|
var NetworkSettingsModal$1 = /*#__PURE__*/react.memo(NetworkSettingsModal);
|
|
3237
2717
|
|
|
@@ -3257,7 +2737,7 @@ const LeftList = /*#__PURE__*/react.memo(_ref => {
|
|
|
3257
2737
|
className: "list-container",
|
|
3258
2738
|
children: /*#__PURE__*/jsxRuntime.jsx(antd.List, {
|
|
3259
2739
|
header: /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
3260
|
-
className:
|
|
2740
|
+
className: "grid ".concat(gridColumns, " w-full list-header"),
|
|
3261
2741
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
3262
2742
|
children: "Name"
|
|
3263
2743
|
}), /*#__PURE__*/jsxRuntime.jsx("div", {
|
|
@@ -3269,13 +2749,13 @@ const LeftList = /*#__PURE__*/react.memo(_ref => {
|
|
|
3269
2749
|
dataSource: dataSource,
|
|
3270
2750
|
rowKey: "id",
|
|
3271
2751
|
renderItem: item => /*#__PURE__*/jsxRuntime.jsx(antd.List.Item, {
|
|
3272
|
-
className:
|
|
2752
|
+
className: "list-item ".concat(selectedPresetId === item.id ? 'selected' : ''),
|
|
3273
2753
|
style: {
|
|
3274
2754
|
padding: "9px 24px"
|
|
3275
2755
|
},
|
|
3276
2756
|
onClick: () => onSelectPreset(item),
|
|
3277
2757
|
children: /*#__PURE__*/jsxRuntime.jsxs("div", {
|
|
3278
|
-
className:
|
|
2758
|
+
className: "grid ".concat(gridColumns, " w-full text-text-normal"),
|
|
3279
2759
|
children: [/*#__PURE__*/jsxRuntime.jsx("div", {
|
|
3280
2760
|
title: item.name,
|
|
3281
2761
|
children: item.name || "Untitled Preset"
|
|
@@ -3392,10 +2872,9 @@ const RightDetailForm = /*#__PURE__*/react.memo(_ref3 => {
|
|
|
3392
2872
|
return fields.category_list.options.map(category => {
|
|
3393
2873
|
const isInitiallySelected = initialSelected.includes(category.name);
|
|
3394
2874
|
const shouldDisable = isEditing ? !isInitiallySelected : false;
|
|
3395
|
-
return {
|
|
3396
|
-
...category,
|
|
2875
|
+
return _objectSpread2(_objectSpread2({}, category), {}, {
|
|
3397
2876
|
disabled: shouldDisable
|
|
3398
|
-
};
|
|
2877
|
+
});
|
|
3399
2878
|
});
|
|
3400
2879
|
}, [initialSelected, isEditing, hasCategoryList, fields.category_list]);
|
|
3401
2880
|
return /*#__PURE__*/jsxRuntime.jsxs(antd.Flex, {
|
|
@@ -3454,13 +2933,13 @@ const RightDetailForm = /*#__PURE__*/react.memo(_ref3 => {
|
|
|
3454
2933
|
disabled: isEditing
|
|
3455
2934
|
})
|
|
3456
2935
|
})]
|
|
3457
|
-
}), isEditing ? /*#__PURE__*/jsxRuntime.jsx(SubmitButton, {
|
|
3458
|
-
action: onLoad
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
|
|
2936
|
+
}), isEditing ? /*#__PURE__*/jsxRuntime.jsx(SubmitButton, _objectSpread2(_objectSpread2({
|
|
2937
|
+
action: onLoad
|
|
2938
|
+
}, hasCategoryList && {
|
|
2939
|
+
disabled: !currentSelected.length
|
|
2940
|
+
}), {}, {
|
|
3462
2941
|
children: texts.loadButton
|
|
3463
|
-
}) : /*#__PURE__*/jsxRuntime.jsx(SubmitButton, {
|
|
2942
|
+
})) : /*#__PURE__*/jsxRuntime.jsx(SubmitButton, {
|
|
3464
2943
|
action: onSave,
|
|
3465
2944
|
loading: isLoading,
|
|
3466
2945
|
children: texts.saveButton
|
|
@@ -3518,7 +2997,7 @@ const Preset = _ref => {
|
|
|
3518
2997
|
const fetchPresetList = react.useCallback(async () => {
|
|
3519
2998
|
try {
|
|
3520
2999
|
const data = await getPresetList();
|
|
3521
|
-
const presets = data
|
|
3000
|
+
const presets = (data === null || data === void 0 ? void 0 : data.preset_list) || data || [];
|
|
3522
3001
|
setPresetList(presets);
|
|
3523
3002
|
} catch (error) {
|
|
3524
3003
|
console.error('Failed to fetch preset list:', error);
|
|
@@ -3530,6 +3009,7 @@ const Preset = _ref => {
|
|
|
3530
3009
|
// setPresetChanged(prev => prev + 1); // 触发更新
|
|
3531
3010
|
}, [form]);
|
|
3532
3011
|
const handleAddNew = react.useCallback(() => {
|
|
3012
|
+
var _fields$category_list;
|
|
3533
3013
|
const unsavedPreset = presetList.find(item => !item.id);
|
|
3534
3014
|
if (unsavedPreset) {
|
|
3535
3015
|
AntdMessage.warning('Existing unsaved preset detected.');
|
|
@@ -3543,7 +3023,7 @@ const Preset = _ref => {
|
|
|
3543
3023
|
}, {});
|
|
3544
3024
|
|
|
3545
3025
|
// 特殊处理 category_list
|
|
3546
|
-
if (fields.category_list
|
|
3026
|
+
if ((_fields$category_list = fields.category_list) !== null && _fields$category_list !== void 0 && _fields$category_list.options) {
|
|
3547
3027
|
newPreset.category_list = fields.category_list.options.map(item => item.name);
|
|
3548
3028
|
}
|
|
3549
3029
|
setPresetList([...presetList, newPreset]);
|
|
@@ -3559,7 +3039,7 @@ const Preset = _ref => {
|
|
|
3559
3039
|
try {
|
|
3560
3040
|
AntdModal.confirm({
|
|
3561
3041
|
icon: /*#__PURE__*/jsxRuntime.jsx(icons.ExclamationCircleFilled, {}),
|
|
3562
|
-
title:
|
|
3042
|
+
title: "".concat(texts.deleteConfirm, " \"").concat(presetName, "\"?"),
|
|
3563
3043
|
cancelText: 'No',
|
|
3564
3044
|
okText: 'Yes',
|
|
3565
3045
|
onOk: async () => {
|
|
@@ -3584,7 +3064,7 @@ const Preset = _ref => {
|
|
|
3584
3064
|
}
|
|
3585
3065
|
}, [selectedPreset, form, AntdModal, AntdMessage, fetchPresetList, texts]);
|
|
3586
3066
|
const handleLoadPreset = react.useCallback(async () => {
|
|
3587
|
-
if (!selectedPreset
|
|
3067
|
+
if (!(selectedPreset !== null && selectedPreset !== void 0 && selectedPreset.id)) return;
|
|
3588
3068
|
|
|
3589
3069
|
// 显示加载模态框
|
|
3590
3070
|
const modalInstance = antd.Modal.info({
|
|
@@ -3601,12 +3081,11 @@ const Preset = _ref => {
|
|
|
3601
3081
|
}
|
|
3602
3082
|
});
|
|
3603
3083
|
try {
|
|
3604
|
-
await loadPreset({
|
|
3605
|
-
id: selectedPreset.id
|
|
3606
|
-
|
|
3607
|
-
|
|
3608
|
-
|
|
3609
|
-
});
|
|
3084
|
+
await loadPreset(_objectSpread2({
|
|
3085
|
+
id: selectedPreset.id
|
|
3086
|
+
}, selectedPreset.category_list && {
|
|
3087
|
+
category_list: selectedPreset.category_list
|
|
3088
|
+
}));
|
|
3610
3089
|
// 成功时延迟关闭
|
|
3611
3090
|
setTimeout(() => {
|
|
3612
3091
|
modalInstance.destroy();
|
|
@@ -3645,13 +3124,13 @@ const Preset = _ref => {
|
|
|
3645
3124
|
title: texts.title,
|
|
3646
3125
|
width: width,
|
|
3647
3126
|
open: open,
|
|
3648
|
-
wrapClassName:
|
|
3127
|
+
wrapClassName: "preset-management ".concat(className),
|
|
3649
3128
|
footer: null,
|
|
3650
3129
|
onCancel: onClose,
|
|
3651
3130
|
centered: true,
|
|
3652
3131
|
styles: {
|
|
3653
3132
|
body: {
|
|
3654
|
-
height:
|
|
3133
|
+
height: "".concat(height, "px")
|
|
3655
3134
|
}
|
|
3656
3135
|
},
|
|
3657
3136
|
children: /*#__PURE__*/jsxRuntime.jsxs(antd.Row, {
|
|
@@ -3662,7 +3141,7 @@ const Preset = _ref => {
|
|
|
3662
3141
|
className: "h-full",
|
|
3663
3142
|
children: /*#__PURE__*/jsxRuntime.jsx(LeftList, {
|
|
3664
3143
|
dataSource: presetList,
|
|
3665
|
-
selectedPresetId: selectedPreset
|
|
3144
|
+
selectedPresetId: selectedPreset === null || selectedPreset === void 0 ? void 0 : selectedPreset.id,
|
|
3666
3145
|
onSelectPreset: handleSelectPreset,
|
|
3667
3146
|
onAddNew: handleAddNew,
|
|
3668
3147
|
onRemove: handleRemove,
|
|
@@ -3681,7 +3160,7 @@ const Preset = _ref => {
|
|
|
3681
3160
|
onSave: handleSave,
|
|
3682
3161
|
onLoad: handleLoadPreset,
|
|
3683
3162
|
isLoading: loading,
|
|
3684
|
-
isEditing: !!selectedPreset
|
|
3163
|
+
isEditing: !!(selectedPreset !== null && selectedPreset !== void 0 && selectedPreset.id),
|
|
3685
3164
|
fields: fields,
|
|
3686
3165
|
texts: {
|
|
3687
3166
|
loadButton: texts.loadButton,
|
|
@@ -3711,7 +3190,6 @@ exports.PtpModal = PtpModal$1;
|
|
|
3711
3190
|
exports.SystemOperations = SystemOperations$1;
|
|
3712
3191
|
exports.UpgradeManager = UpgradeManager$1;
|
|
3713
3192
|
exports.useAuth = useAuth;
|
|
3714
|
-
exports.useDirectoryTree = useDirectoryTree$1;
|
|
3715
3193
|
exports.useHardwareUsage = useHardwareUsage$1;
|
|
3716
3194
|
exports.useHardwareWebSocket = useHardwareWebSocket$1;
|
|
3717
3195
|
exports.useSystemOperations = useSystemOperations$1;
|