whistle.mock-plugins 1.2.0-beta.7 → 1.2.0-beta.9
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/package.json
CHANGED
|
@@ -4,7 +4,7 @@ import AppLayout from '../components/AppLayout';
|
|
|
4
4
|
import {
|
|
5
5
|
Table, Button, Modal, Form, Input, Select, message, Switch,
|
|
6
6
|
Popconfirm, Alert, Space, Card, Badge, Tooltip, Row, Col,
|
|
7
|
-
Popover, Checkbox, Tag, Input as AntInput, Radio, Drawer
|
|
7
|
+
Popover, Checkbox, Tag, Input as AntInput, Radio, Drawer, Divider
|
|
8
8
|
} from 'antd';
|
|
9
9
|
import {
|
|
10
10
|
PlusOutlined, EditOutlined, DeleteOutlined,
|
|
@@ -64,6 +64,7 @@ const InterfaceManagement = () => {
|
|
|
64
64
|
const [groups, setGroups] = useState([]);
|
|
65
65
|
const [selectedGroup, setSelectedGroup] = useState(null);
|
|
66
66
|
const [groupActionLoading, setGroupActionLoading] = useState(false);
|
|
67
|
+
const [newGroupName, setNewGroupName] = useState('');
|
|
67
68
|
|
|
68
69
|
// 模态框状态
|
|
69
70
|
const [modalVisible, setModalVisible] = useState(false);
|
|
@@ -216,6 +217,17 @@ const InterfaceManagement = () => {
|
|
|
216
217
|
setSelectedGroup(null);
|
|
217
218
|
}
|
|
218
219
|
};
|
|
220
|
+
|
|
221
|
+
// 添加新分组
|
|
222
|
+
const addNewGroup = () => {
|
|
223
|
+
if (newGroupName.trim() && !groups.includes(newGroupName.trim())) {
|
|
224
|
+
const updatedGroups = [...groups, newGroupName.trim()].sort();
|
|
225
|
+
setGroups(updatedGroups);
|
|
226
|
+
setNewGroupName('');
|
|
227
|
+
return newGroupName.trim();
|
|
228
|
+
}
|
|
229
|
+
return null;
|
|
230
|
+
};
|
|
219
231
|
|
|
220
232
|
// 根据分组和搜索关键词筛选接口
|
|
221
233
|
const getFilteredInterfaces = () => {
|
|
@@ -1298,27 +1310,55 @@ const InterfaceManagement = () => {
|
|
|
1298
1310
|
tooltip="为接口设置分组，便于管理和批量操作"
|
|
1299
1311
|
>
|
|
1300
1312
|
<Select
|
|
1301
|
-
placeholder="
|
|
1313
|
+
placeholder="选择或输入新分组名称"
|
|
1302
1314
|
showSearch
|
|
1303
1315
|
allowClear
|
|
1304
1316
|
style={{ width: '100%' }}
|
|
1305
|
-
|
|
1306
|
-
|
|
1307
|
-
|
|
1308
|
-
|
|
1309
|
-
// 如果值是数组（tags模式），只取第一个元素
|
|
1310
|
-
if (Array.isArray(value) && value.length > 0) {
|
|
1311
|
-
// 如果第一个元素是空字符串，则设置为undefined
|
|
1312
|
-
const groupValue = value[0] === '' ? undefined : value[0];
|
|
1313
|
-
form.setFieldsValue({ group: groupValue });
|
|
1314
|
-
}
|
|
1315
|
-
}}
|
|
1317
|
+
dropdownMatchSelectWidth={false}
|
|
1318
|
+
filterOption={(input, option) =>
|
|
1319
|
+
option?.children?.toLowerCase()?.indexOf(input.toLowerCase()) >= 0
|
|
1320
|
+
}
|
|
1316
1321
|
onInputKeyDown={(e) => {
|
|
1317
1322
|
// 防止回车键提交表单
|
|
1318
1323
|
if (e.key === 'Enter') {
|
|
1319
1324
|
e.stopPropagation();
|
|
1320
1325
|
}
|
|
1321
1326
|
}}
|
|
1327
|
+
dropdownRender={(menu) => (
|
|
1328
|
+
<div>
|
|
1329
|
+
{menu}
|
|
1330
|
+
<Divider style={{ margin: '4px 0' }} />
|
|
1331
|
+
<div style={{ display: 'flex', flexWrap: 'nowrap', padding: 8 }}>
|
|
1332
|
+
<Input
|
|
1333
|
+
style={{ flex: 'auto' }}
|
|
1334
|
+
value={newGroupName}
|
|
1335
|
+
onChange={(e) => setNewGroupName(e.target.value)}
|
|
1336
|
+
placeholder="输入新分组名称"
|
|
1337
|
+
onPressEnter={(e) => {
|
|
1338
|
+
e.stopPropagation();
|
|
1339
|
+
const groupName = addNewGroup();
|
|
1340
|
+
if (groupName) {
|
|
1341
|
+
form.setFieldsValue({ group: groupName });
|
|
1342
|
+
}
|
|
1343
|
+
}}
|
|
1344
|
+
/>
|
|
1345
|
+
<Button
|
|
1346
|
+
type="text"
|
|
1347
|
+
icon={<PlusOutlined />}
|
|
1348
|
+
style={{ flex: 'none', padding: '4px 8px', cursor: 'pointer' }}
|
|
1349
|
+
onClick={(e) => {
|
|
1350
|
+
e.stopPropagation();
|
|
1351
|
+
const groupName = addNewGroup();
|
|
1352
|
+
if (groupName) {
|
|
1353
|
+
form.setFieldsValue({ group: groupName });
|
|
1354
|
+
}
|
|
1355
|
+
}}
|
|
1356
|
+
>
|
|
1357
|
+
添加
|
|
1358
|
+
</Button>
|
|
1359
|
+
</div>
|
|
1360
|
+
</div>
|
|
1361
|
+
)}
|
|
1322
1362
|
>
|
|
1323
1363
|
{Array.from(new Set(interfaces.map(item => item.group).filter(Boolean))).map(group => (
|
|
1324
1364
|
<Option key={group} value={group}>{group}</Option>
|
|
@@ -10,7 +10,7 @@ import AppLayout from '../components/AppLayout';
|
|
|
10
10
|
import {
|
|
11
11
|
Table, Button, Modal, Form, Input, Select, message, Switch,
|
|
12
12
|
Popconfirm, Alert, Space, Card, Badge, Tooltip, Row, Col,
|
|
13
|
-
Popover, Checkbox, Tag, Input as AntInput, Radio, Drawer, Dropdown, Menu, Collapse
|
|
13
|
+
Popover, Checkbox, Tag, Input as AntInput, Radio, Drawer, Dropdown, Menu, Collapse, Divider
|
|
14
14
|
} from 'antd';
|
|
15
15
|
import {
|
|
16
16
|
PlusOutlined, EditOutlined, DeleteOutlined,
|
|
@@ -70,6 +70,7 @@ const InterfaceManagement = () => {
|
|
|
70
70
|
const [groups, setGroups] = useState([]);
|
|
71
71
|
const [selectedGroup, setSelectedGroup] = useState(null);
|
|
72
72
|
const [groupActionLoading, setGroupActionLoading] = useState(false);
|
|
73
|
+
const [newGroupName, setNewGroupName] = useState('');
|
|
73
74
|
|
|
74
75
|
// 模态框状态
|
|
75
76
|
const [modalVisible, setModalVisible] = useState(false);
|
|
@@ -222,6 +223,17 @@ const InterfaceManagement = () => {
|
|
|
222
223
|
setSelectedGroup(null);
|
|
223
224
|
}
|
|
224
225
|
};
|
|
226
|
+
|
|
227
|
+
// 添加新分组
|
|
228
|
+
const addNewGroup = () => {
|
|
229
|
+
if (newGroupName.trim() && !groups.includes(newGroupName.trim())) {
|
|
230
|
+
const updatedGroups = [...groups, newGroupName.trim()].sort();
|
|
231
|
+
setGroups(updatedGroups);
|
|
232
|
+
setNewGroupName('');
|
|
233
|
+
return newGroupName.trim();
|
|
234
|
+
}
|
|
235
|
+
return null;
|
|
236
|
+
};
|
|
225
237
|
|
|
226
238
|
// 根据分组和搜索关键词筛选接口
|
|
227
239
|
const getFilteredInterfaces = () => {
|
|
@@ -1353,27 +1365,55 @@ const InterfaceManagement = () => {
|
|
|
1353
1365
|
tooltip="为接口设置分组，便于管理和批量操作"
|
|
1354
1366
|
>
|
|
1355
1367
|
<Select
|
|
1356
|
-
placeholder="
|
|
1368
|
+
placeholder="选择或输入新分组名称"
|
|
1357
1369
|
showSearch
|
|
1358
1370
|
allowClear
|
|
1359
1371
|
style={{ width: '100%' }}
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
// 如果值是数组（tags模式），只取第一个元素
|
|
1365
|
-
if (Array.isArray(value) && value.length > 0) {
|
|
1366
|
-
// 如果第一个元素是空字符串，则设置为undefined
|
|
1367
|
-
const groupValue = value[0] === '' ? undefined : value[0];
|
|
1368
|
-
form.setFieldsValue({ group: groupValue });
|
|
1369
|
-
}
|
|
1370
|
-
}}
|
|
1372
|
+
dropdownMatchSelectWidth={false}
|
|
1373
|
+
filterOption={(input, option) =>
|
|
1374
|
+
option?.children?.toLowerCase()?.indexOf(input.toLowerCase()) >= 0
|
|
1375
|
+
}
|
|
1371
1376
|
onInputKeyDown={(e) => {
|
|
1372
1377
|
// 防止回车键提交表单
|
|
1373
1378
|
if (e.key === 'Enter') {
|
|
1374
1379
|
e.stopPropagation();
|
|
1375
1380
|
}
|
|
1376
1381
|
}}
|
|
1382
|
+
dropdownRender={(menu) => (
|
|
1383
|
+
<div>
|
|
1384
|
+
{menu}
|
|
1385
|
+
<Divider style={{ margin: '4px 0' }} />
|
|
1386
|
+
<div style={{ display: 'flex', flexWrap: 'nowrap', padding: 8 }}>
|
|
1387
|
+
<Input
|
|
1388
|
+
style={{ flex: 'auto' }}
|
|
1389
|
+
value={newGroupName}
|
|
1390
|
+
onChange={(e) => setNewGroupName(e.target.value)}
|
|
1391
|
+
placeholder="输入新分组名称"
|
|
1392
|
+
onPressEnter={(e) => {
|
|
1393
|
+
e.stopPropagation();
|
|
1394
|
+
const groupName = addNewGroup();
|
|
1395
|
+
if (groupName) {
|
|
1396
|
+
form.setFieldsValue({ group: groupName });
|
|
1397
|
+
}
|
|
1398
|
+
}}
|
|
1399
|
+
/>
|
|
1400
|
+
<Button
|
|
1401
|
+
type="text"
|
|
1402
|
+
icon={<PlusOutlined />}
|
|
1403
|
+
style={{ flex: 'none', padding: '4px 8px', cursor: 'pointer' }}
|
|
1404
|
+
onClick={(e) => {
|
|
1405
|
+
e.stopPropagation();
|
|
1406
|
+
const groupName = addNewGroup();
|
|
1407
|
+
if (groupName) {
|
|
1408
|
+
form.setFieldsValue({ group: groupName });
|
|
1409
|
+
}
|
|
1410
|
+
}}
|
|
1411
|
+
>
|
|
1412
|
+
添加
|
|
1413
|
+
</Button>
|
|
1414
|
+
</div>
|
|
1415
|
+
</div>
|
|
1416
|
+
)}
|
|
1377
1417
|
>
|
|
1378
1418
|
{Array.from(new Set(interfaces.map(item => item.group).filter(Boolean))).map(group => (
|
|
1379
1419
|
<Option key={group} value={group}>{group}</Option>
|