feat: add user-based conditional rendering for firearms and mod codes pages
This commit is contained in:
@@ -1,6 +1,7 @@
|
|||||||
import { useEffect, useState } from "react"
|
import { useEffect, useState } from "react"
|
||||||
import { Link } from "react-router-dom"
|
import { Link } from "react-router-dom"
|
||||||
import { FirearmApi } from "@/api"
|
import { FirearmApi } from "@/api"
|
||||||
|
import { useAppSelector } from "@/store"
|
||||||
import { Firearm, FirearmType } from "@/types"
|
import { Firearm, FirearmType } from "@/types"
|
||||||
import { Button, Card, Col, Pagination, Row, Select, Tag, Typography } from "antd"
|
import { Button, Card, Col, Pagination, Row, Select, Tag, Typography } from "antd"
|
||||||
|
|
||||||
@@ -23,6 +24,7 @@ function asDps(fireRate: number, damage: number) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export default function FirearmsPage() {
|
export default function FirearmsPage() {
|
||||||
|
const user = useAppSelector((state) => state.auth.user)
|
||||||
const [page, setPage] = useState<number>(1)
|
const [page, setPage] = useState<number>(1)
|
||||||
const [typeFilter, setTypeFilter] = useState<FirearmTypeFilter>(allTypeValue)
|
const [typeFilter, setTypeFilter] = useState<FirearmTypeFilter>(allTypeValue)
|
||||||
const [firearms, setFirearms] = useState<Firearm[]>([])
|
const [firearms, setFirearms] = useState<Firearm[]>([])
|
||||||
@@ -66,6 +68,13 @@ export default function FirearmsPage() {
|
|||||||
<Col key={firearm.id} xs={24} md={12} lg={8}>
|
<Col key={firearm.id} xs={24} md={12} lg={8}>
|
||||||
<Card
|
<Card
|
||||||
title={firearm.name}
|
title={firearm.name}
|
||||||
|
extra={
|
||||||
|
user ? (
|
||||||
|
<Button type="link" size="small">
|
||||||
|
编辑
|
||||||
|
</Button>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
styles={{
|
styles={{
|
||||||
header: { minHeight: 56 },
|
header: { minHeight: 56 },
|
||||||
|
|||||||
@@ -2,11 +2,13 @@ import { useEffect, useMemo, useState } from "react"
|
|||||||
import { Link, useSearchParams } from "react-router-dom"
|
import { Link, useSearchParams } from "react-router-dom"
|
||||||
import { Button, Card, Col, Pagination, Row, Select, Space, Tag, Typography } from "antd"
|
import { Button, Card, Col, Pagination, Row, Select, Space, Tag, Typography } from "antd"
|
||||||
import { ModificationApi, TagApi } from "@/api"
|
import { ModificationApi, TagApi } from "@/api"
|
||||||
|
import { useAppSelector } from "@/store"
|
||||||
import { Modification } from "@/types"
|
import { Modification } from "@/types"
|
||||||
|
|
||||||
const pageSize = 12
|
const pageSize = 12
|
||||||
|
|
||||||
export default function ModCodesPage() {
|
export default function ModCodesPage() {
|
||||||
|
const user = useAppSelector((state) => state.auth.user)
|
||||||
const [searchParams] = useSearchParams()
|
const [searchParams] = useSearchParams()
|
||||||
const firearmId = useMemo(() => searchParams.get("firearmId") || undefined, [searchParams])
|
const firearmId = useMemo(() => searchParams.get("firearmId") || undefined, [searchParams])
|
||||||
|
|
||||||
@@ -47,10 +49,11 @@ export default function ModCodesPage() {
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="mb-4 flex items-center justify-between gap-4">
|
<div className="mb-4 flex items-start justify-between gap-4">
|
||||||
<Typography.Title level={4} className="mb-0!">
|
<Typography.Title level={4} className="mb-0!">
|
||||||
改枪码列表
|
改枪码列表
|
||||||
</Typography.Title>
|
</Typography.Title>
|
||||||
|
<div className="flex flex-wrap items-center justify-end gap-3">
|
||||||
<Space wrap>
|
<Space wrap>
|
||||||
<span>标签:</span>
|
<span>标签:</span>
|
||||||
<Select<string[]>
|
<Select<string[]>
|
||||||
@@ -79,6 +82,8 @@ export default function ModCodesPage() {
|
|||||||
</Link>
|
</Link>
|
||||||
)}
|
)}
|
||||||
</Space>
|
</Space>
|
||||||
|
{user && <Button type="primary">添加改装</Button>}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="mb-6">
|
<div className="mb-6">
|
||||||
@@ -87,6 +92,13 @@ export default function ModCodesPage() {
|
|||||||
<Col key={modification.id} xs={24} md={12} lg={8}>
|
<Col key={modification.id} xs={24} md={12} lg={8}>
|
||||||
<Card
|
<Card
|
||||||
title={modification.name}
|
title={modification.name}
|
||||||
|
extra={
|
||||||
|
user ? (
|
||||||
|
<Button type="link" size="small">
|
||||||
|
编辑
|
||||||
|
</Button>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
variant="outlined"
|
variant="outlined"
|
||||||
styles={{
|
styles={{
|
||||||
header: { minHeight: 56 },
|
header: { minHeight: 56 },
|
||||||
|
|||||||
Reference in New Issue
Block a user