only show avaliable

This commit is contained in:
2022-05-22 18:28:06 +08:00
parent 3f70ba379f
commit 7590dacbc0

View File

@@ -4,6 +4,9 @@ import {
Alert,
Snackbar,
Button,
FormGroup,
FormControlLabel,
Checkbox,
Stack,
Dialog,
DialogTitle,
@@ -36,6 +39,8 @@ export default function Time(props) {
const [token, setToken] = useState("");
const [stats, setStats] = useState({});
const [onlyShowAvaliable, setOnlyShowAvaliable] = useState(true);
const [modifyTime, setModifyTime] = useState({});
const router = useRouter();
@@ -324,6 +329,17 @@ export default function Time(props) {
>
Refresh
</Button>
<FormGroup>
<FormControlLabel
control={
<Checkbox
checked={onlyShowAvaliable}
onChange={(e) => setOnlyShowAvaliable(e.target.checked)}
/>
}
label="仅显示空余"
/>
</FormGroup>
<Typography>
当前每人数量上限: {limit}
<br />
@@ -340,43 +356,48 @@ export default function Time(props) {
</TableRow>
</TableHead>
<TableBody>
{ranges.map((range) => (
<TableRow key={range.id}>
<TableCell>{range.name}</TableCell>
<TableCell>{range.range}</TableCell>
<TableCell>
<Button
sx={{
userSelect: "none",
}}
disabled={range.username !== ""}
variant="contained"
color="primary"
onClick={() => updateUsername(range.id, props.username)}
>
{range.username ? range.username : "抢!"}
</Button>
{isAdmin() && (
<>
<Button
variant="contained"
color="secondary"
onClick={() => setModifyTime(range)}
>
修改
</Button>
<Button
variant="contained"
color="secondary"
onClick={() => deleteRange(range.id)}
>
删除
</Button>
</>
)}
</TableCell>
</TableRow>
))}
{ranges.map((range) => {
if (onlyShowAvaliable) {
return;
}
return (
<TableRow key={range.id}>
<TableCell>{range.name}</TableCell>
<TableCell>{range.range}</TableCell>
<TableCell>
<Button
sx={{
userSelect: "none",
}}
disabled={range.username !== ""}
variant="contained"
color="primary"
onClick={() => updateUsername(range.id, props.username)}
>
{range.username ? range.username : "抢!"}
</Button>
{isAdmin() && (
<>
<Button
variant="contained"
color="secondary"
onClick={() => setModifyTime(range)}
>
修改
</Button>
<Button
variant="contained"
color="secondary"
onClick={() => deleteRange(range.id)}
>
删除
</Button>
</>
)}
</TableCell>
</TableRow>
);
})}
</TableBody>
</Table>
</TableContainer>