feat: add create and edit modals for firearms management
This commit is contained in:
@@ -0,0 +1,58 @@
|
||||
import { useState } from "react"
|
||||
import { App, Form, Modal } from "antd"
|
||||
import { FirearmApi } from "@/api"
|
||||
import FirearmForm from "@/components/firearm-form"
|
||||
import { AddFirearmRequest, Firearm } from "@/types"
|
||||
|
||||
interface FirearmCreateModalProps {
|
||||
open: boolean
|
||||
onCancel: () => void
|
||||
onSuccess: (firearm: Firearm) => void
|
||||
}
|
||||
|
||||
function normalizeRequest(values: AddFirearmRequest): AddFirearmRequest {
|
||||
return {
|
||||
...values,
|
||||
review: values.review?.trim() || null,
|
||||
}
|
||||
}
|
||||
|
||||
export default function FirearmCreateModal({ open, onCancel, onSuccess }: FirearmCreateModalProps) {
|
||||
const { message } = App.useApp()
|
||||
const [form] = Form.useForm<AddFirearmRequest>()
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
async function onFinish(values: AddFirearmRequest) {
|
||||
setLoading(true)
|
||||
try {
|
||||
const firearm = await FirearmApi.addFirearm(normalizeRequest(values))
|
||||
message.success("武器创建成功")
|
||||
form.resetFields()
|
||||
onSuccess(firearm)
|
||||
} catch {
|
||||
message.error("武器创建失败,请稍后重试")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title="新建武器"
|
||||
open={open}
|
||||
onCancel={onCancel}
|
||||
onOk={() => form.submit()}
|
||||
okText="创建"
|
||||
cancelText="取消"
|
||||
confirmLoading={loading}
|
||||
destroyOnHidden
|
||||
afterOpenChange={(visible) => {
|
||||
if (!visible) {
|
||||
form.resetFields()
|
||||
}
|
||||
}}>
|
||||
<FirearmForm form={form} onFinish={onFinish} />
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,67 @@
|
||||
import { useEffect, useState } from "react"
|
||||
import { App, Form, Modal } from "antd"
|
||||
import { FirearmApi } from "@/api"
|
||||
import FirearmForm from "@/components/firearm-form"
|
||||
import { AddFirearmRequest, Firearm } from "@/types"
|
||||
|
||||
interface FirearmEditModalProps {
|
||||
open: boolean
|
||||
firearm: Firearm | null
|
||||
onCancel: () => void
|
||||
onSuccess: (firearm: Firearm) => void
|
||||
}
|
||||
|
||||
function normalizeRequest(values: AddFirearmRequest): AddFirearmRequest {
|
||||
return {
|
||||
...values,
|
||||
review: values.review?.trim() || null,
|
||||
}
|
||||
}
|
||||
|
||||
export default function FirearmEditModal({ open, firearm, onCancel, onSuccess }: FirearmEditModalProps) {
|
||||
const { message } = App.useApp()
|
||||
const [form] = Form.useForm<AddFirearmRequest>()
|
||||
const [loading, setLoading] = useState(false)
|
||||
|
||||
useEffect(() => {
|
||||
if (!open || !firearm) {
|
||||
return
|
||||
}
|
||||
|
||||
const { id: _id, ...editableValues } = firearm
|
||||
form.setFieldsValue(editableValues)
|
||||
}, [open, firearm, form])
|
||||
|
||||
async function onFinish(values: AddFirearmRequest) {
|
||||
if (!firearm) {
|
||||
return
|
||||
}
|
||||
|
||||
setLoading(true)
|
||||
try {
|
||||
const updated = await FirearmApi.editFirearm(firearm.id, normalizeRequest(values))
|
||||
message.success("武器更新成功")
|
||||
onSuccess(updated)
|
||||
} catch {
|
||||
message.error("武器更新失败,请稍后重试")
|
||||
} finally {
|
||||
setLoading(false)
|
||||
}
|
||||
}
|
||||
|
||||
return (
|
||||
<Modal
|
||||
title="编辑武器"
|
||||
open={open}
|
||||
onCancel={onCancel}
|
||||
onOk={() => form.submit()}
|
||||
okText="保存"
|
||||
cancelText="取消"
|
||||
confirmLoading={loading}
|
||||
destroyOnHidden
|
||||
>
|
||||
<FirearmForm form={form} onFinish={onFinish} />
|
||||
</Modal>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -0,0 +1,91 @@
|
||||
import { Form, Input, InputNumber, Select } from "antd"
|
||||
import { AddFirearmRequest, FirearmType } from "@/types"
|
||||
|
||||
const firearmTypeText: Record<FirearmType, string> = {
|
||||
RIFLE: "步枪",
|
||||
SUB_MACHINE_GUN: "冲锋枪",
|
||||
SHOTGUN: "霰弹枪",
|
||||
LIGHT_MACHINE_GUN: "轻机枪",
|
||||
DESIGNATED_MARKSMAN_RIFLE: "射手步枪",
|
||||
SNIPER_RIFLE: "狙击步枪",
|
||||
PISTOL: "手枪",
|
||||
SPECIAL: "特殊",
|
||||
}
|
||||
|
||||
interface FirearmFormProps {
|
||||
form: ReturnType<typeof Form.useForm<AddFirearmRequest>>[0]
|
||||
onFinish: (values: AddFirearmRequest) => void
|
||||
}
|
||||
|
||||
export default function FirearmForm({ form, onFinish }: FirearmFormProps) {
|
||||
return (
|
||||
<Form<AddFirearmRequest> form={form} layout="vertical" onFinish={onFinish} requiredMark={false}>
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="name"
|
||||
label="武器名称"
|
||||
rules={[{ required: true, message: "请输入武器名称" }]}
|
||||
>
|
||||
<Input placeholder="请输入武器名称" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="type"
|
||||
label="武器类型"
|
||||
rules={[{ required: true, message: "请选择武器类型" }]}
|
||||
>
|
||||
<Select
|
||||
placeholder="请选择武器类型"
|
||||
options={Object.entries(firearmTypeText).map(([value, label]) => ({
|
||||
value,
|
||||
label,
|
||||
}))}
|
||||
/>
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="level"
|
||||
label="武器输出等级"
|
||||
rules={[{ required: true, message: "请输入武器输出等级" }]}
|
||||
>
|
||||
<Input placeholder="例如:T0" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="calibre"
|
||||
label="子弹口径"
|
||||
rules={[{ required: true, message: "请输入子弹口径" }]}
|
||||
>
|
||||
<Input placeholder="例如:5.56x45mm" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="fireRate"
|
||||
label="射速(每分钟发数)"
|
||||
rules={[{ required: true, message: "请输入射速" }]}
|
||||
>
|
||||
<InputNumber className="w-full" min={1} precision={0} placeholder="请输入射速" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="armourDamage"
|
||||
label="甲伤"
|
||||
rules={[{ required: true, message: "请输入甲伤" }]}
|
||||
>
|
||||
<InputNumber className="w-full" min={0} precision={0} placeholder="请输入甲伤" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest>
|
||||
name="bodyDamage"
|
||||
label="肉伤"
|
||||
rules={[{ required: true, message: "请输入肉伤" }]}
|
||||
>
|
||||
<InputNumber className="w-full" min={0} precision={0} placeholder="请输入肉伤" />
|
||||
</Form.Item>
|
||||
|
||||
<Form.Item<AddFirearmRequest> name="review" label="描述">
|
||||
<Input.TextArea rows={4} placeholder="可选:补充武器特点或使用建议" />
|
||||
</Form.Item>
|
||||
</Form>
|
||||
)
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user