fix(frontend): simplify speed limit selector UX

This commit is contained in:
sagitchu
2026-02-27 19:53:19 +08:00
parent a9eac6d01f
commit 975948dcf6
+16 -22
View File
@@ -1170,7 +1170,7 @@ export default function UserPage() {
classNames={{ classNames={{
trigger: "min-h-10 h-10", trigger: "min-h-10 h-10",
}} }}
placeholder="请选择限速规则" placeholder="不限速"
selectedKeys={ selectedKeys={
batchTunnelSelections.get(tunnel.id) !== batchTunnelSelections.get(tunnel.id) !==
null && null &&
@@ -1181,32 +1181,29 @@ export default function UserPage() {
.get(tunnel.id)! .get(tunnel.id)!
.toString(), .toString(),
] ]
: ["null"] : []
} }
size="sm" size="sm"
onClick={(e) => e.stopPropagation()} onClick={(e) => e.stopPropagation()}
onSelectionChange={(keys) => { onSelectionChange={(keys) => {
const value = Array.from(keys)[0] as string; const selectedKey = Array.from(keys)[0] as
| string
| undefined;
updateTunnelSpeedLimit( updateTunnelSpeedLimit(
tunnel.id, tunnel.id,
value === "null" ? null : Number(value), selectedKey ? Number(selectedKey) : null,
); );
}} }}
> >
{[ {tunnelSpeedLimits.map((sl) => (
<SelectItem key="null" textValue="不限速">
不限速
</SelectItem>,
...tunnelSpeedLimits.map((sl) => (
<SelectItem <SelectItem
key={sl.id.toString()} key={sl.id.toString()}
textValue={sl.name} textValue={sl.name}
> >
{sl.name} {sl.name}
</SelectItem> </SelectItem>
)), ))}
]}
</Select> </Select>
</div> </div>
)} )}
@@ -1429,38 +1426,35 @@ export default function UserPage() {
<Select <Select
label="限速规则" label="限速规则"
placeholder="请选择限速规则" placeholder="不限速"
selectedKeys={ selectedKeys={
editTunnelSelectedSpeedId !== null editTunnelSelectedSpeedId !== null
? [editTunnelSelectedSpeedId.toString()] ? [editTunnelSelectedSpeedId.toString()]
: ["null"] : []
} }
onSelectionChange={(keys) => { onSelectionChange={(keys) => {
const value = Array.from(keys)[0] as string; const selectedKey = Array.from(keys)[0] as
| string
| undefined;
setEditTunnelForm((prev) => setEditTunnelForm((prev) =>
prev prev
? { ? {
...prev, ...prev,
speedId: value === "null" ? null : Number(value), speedId: selectedKey ? Number(selectedKey) : null,
} }
: null, : null,
); );
}} }}
> >
{[ {editAvailableSpeedLimits.map((speedLimit) => (
<SelectItem key="null" textValue="不限速">
不限速
</SelectItem>,
...editAvailableSpeedLimits.map((speedLimit) => (
<SelectItem <SelectItem
key={speedLimit.id.toString()} key={speedLimit.id.toString()}
textValue={speedLimit.name} textValue={speedLimit.name}
> >
{speedLimit.name} {speedLimit.name}
</SelectItem> </SelectItem>
)), ))}
]}
</Select> </Select>
<Select <Select