Compare commits
4 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
| 04a282dd5e | |||
| 9145fabb2b | |||
| f98737906f | |||
| 0f17374002 |
@@ -0,0 +1,95 @@
|
|||||||
|
name: Build and Deploy
|
||||||
|
|
||||||
|
on:
|
||||||
|
release:
|
||||||
|
types: [published]
|
||||||
|
|
||||||
|
jobs:
|
||||||
|
build:
|
||||||
|
name: Build release archive
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
|
steps:
|
||||||
|
- name: Checkout code
|
||||||
|
uses: actions/checkout@v4
|
||||||
|
|
||||||
|
- name: Setup Node
|
||||||
|
uses: actions/setup-node@v4
|
||||||
|
with:
|
||||||
|
node-version: 24
|
||||||
|
cache: pnpm
|
||||||
|
|
||||||
|
- name: Setup pnpm
|
||||||
|
uses: pnpm/action-setup@v4
|
||||||
|
with:
|
||||||
|
version: 11
|
||||||
|
|
||||||
|
- name: Install dependencies
|
||||||
|
run: pnpm install --frozen-lockfile
|
||||||
|
|
||||||
|
- name: Build release archive
|
||||||
|
run: pnpm build:tar
|
||||||
|
|
||||||
|
- name: Upload build artifact
|
||||||
|
uses: actions/upload-artifact@v4
|
||||||
|
with:
|
||||||
|
name: dist-archive
|
||||||
|
path: dist.tar.gz
|
||||||
|
retention-days: 1
|
||||||
|
|
||||||
|
upload-release-asset:
|
||||||
|
name: Upload to Gitea Release
|
||||||
|
needs: build
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
|
steps:
|
||||||
|
- name: Download build artifact
|
||||||
|
uses: actions/download-artifact@v4
|
||||||
|
with:
|
||||||
|
name: dist-archive
|
||||||
|
|
||||||
|
- name: Upload release asset
|
||||||
|
uses: https://gitea.com/actions/forgejo-release@v1
|
||||||
|
with:
|
||||||
|
direction: upload
|
||||||
|
files: dist.tar.gz
|
||||||
|
env:
|
||||||
|
FORGEJO_TOKEN: ${{ secrets.GITEA_TOKEN }}
|
||||||
|
|
||||||
|
deploy-to-server:
|
||||||
|
name: Deploy to onixbyte.cn
|
||||||
|
needs: build
|
||||||
|
runs-on: ubuntu-latest
|
||||||
|
|
||||||
|
steps:
|
||||||
|
- name: Download build artifact
|
||||||
|
uses: actions/download-artifact@v4
|
||||||
|
with:
|
||||||
|
name: dist-archive
|
||||||
|
|
||||||
|
- name: Upload archive to server
|
||||||
|
uses: appleboy/scp-action@v0.1.7
|
||||||
|
with:
|
||||||
|
host: ${{ vars.DEPLOY_HOST }}
|
||||||
|
username: ${{ vars.DEPLOY_USER }}
|
||||||
|
port: ${{ vars.DEPLOY_PORT }}
|
||||||
|
key: ${{ secrets.DEPLOY_SSH_KEY }}
|
||||||
|
source: "dist.tar.gz"
|
||||||
|
target: "/tmp/"
|
||||||
|
|
||||||
|
- name: Extract archive and set ownership
|
||||||
|
uses: appleboy/ssh-action@v1.0.3
|
||||||
|
with:
|
||||||
|
host: ${{ vars.DEPLOY_HOST }}
|
||||||
|
username: ${{ vars.DEPLOY_USER }}
|
||||||
|
port: ${{ vars.DEPLOY_PORT }}
|
||||||
|
key: ${{ secrets.DEPLOY_SSH_KEY }}
|
||||||
|
script_stop: true
|
||||||
|
script: |
|
||||||
|
set -e
|
||||||
|
DEPLOY_PATH="${{ vars.DEPLOY_PATH }}"
|
||||||
|
mkdir -p "$DEPLOY_PATH"
|
||||||
|
rm -rf "$DEPLOY_PATH"/*
|
||||||
|
tar -xzf /tmp/dist.tar.gz -C "$DEPLOY_PATH" --strip-components=1
|
||||||
|
chown -R caddy:caddy "$DEPLOY_PATH"
|
||||||
|
rm -f /tmp/dist.tar.gz
|
||||||
@@ -0,0 +1,33 @@
|
|||||||
|
image: node:24.15-trixie-slim
|
||||||
|
|
||||||
|
stages:
|
||||||
|
- build
|
||||||
|
- deploy
|
||||||
|
|
||||||
|
build:
|
||||||
|
stage: build
|
||||||
|
rules:
|
||||||
|
- if: $CI_RELEASE_DESCRIPTION
|
||||||
|
script:
|
||||||
|
- corepack enable
|
||||||
|
- corepack prepare pnpm --activate
|
||||||
|
- pnpm install --frozen-lockfile
|
||||||
|
- pnpm build
|
||||||
|
artifacts:
|
||||||
|
paths:
|
||||||
|
- dist/
|
||||||
|
expire_in: 7 days
|
||||||
|
|
||||||
|
deploy:
|
||||||
|
stage: deploy
|
||||||
|
rules:
|
||||||
|
- if: $CI_RELEASE_DESCRIPTION
|
||||||
|
needs:
|
||||||
|
- build
|
||||||
|
script:
|
||||||
|
- apt-get update -qq && apt-get install -y -qq openssh-client rsync
|
||||||
|
- mkdir -p ~/.ssh
|
||||||
|
- echo "$SSH_PRIVATE_KEY_BASE64" | base64 -d > ~/.ssh/id_rsa
|
||||||
|
- chmod 600 ~/.ssh/id_rsa
|
||||||
|
- ssh-keyscan -H "$DEPLOY_HOST" >> ~/.ssh/known_hosts
|
||||||
|
- rsync -avz --delete dist/ "${SSH_USER}@${DEPLOY_HOST}:${DEPLOY_PATH}"
|
||||||
+1
-1
@@ -9,5 +9,5 @@ export async function login(loginRequest: LoginRequest): Promise<User> {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export async function logout() {
|
export async function logout() {
|
||||||
await WebClient.post<void>("/auth/logout")
|
await WebClient.get<void>("/auth/logout")
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,9 +0,0 @@
|
|||||||
import { WebClient } from "@/shared/web-client"
|
|
||||||
import { DailyPasswordResponse, PasswordItem } from "@/types/DailyPasswordResponse"
|
|
||||||
|
|
||||||
|
|
||||||
export async function getDailyPassword(): Promise<PasswordItem[]> {
|
|
||||||
const { data } = await WebClient.get<DailyPasswordResponse>(`/daily-passwords`)
|
|
||||||
const allPasswords:PasswordItem[]=data.data.passwords
|
|
||||||
return allPasswords
|
|
||||||
}
|
|
||||||
@@ -2,4 +2,3 @@ export * as FirearmApi from "./firearm-api"
|
|||||||
export * as ModificationApi from "./modification-api"
|
export * as ModificationApi from "./modification-api"
|
||||||
export * as TagApi from "./tag-api"
|
export * as TagApi from "./tag-api"
|
||||||
export * as AuthApi from "./auth-api"
|
export * as AuthApi from "./auth-api"
|
||||||
export * as DailyPasswordApi from "./daily-password-api"
|
|
||||||
|
|||||||
@@ -1,133 +0,0 @@
|
|||||||
import { useEffect, useState } from "react"
|
|
||||||
import { Button, Form, Input, InputNumber, Modal, AutoComplete, Space } from "antd"
|
|
||||||
import slotNames from "@/constant/slots.json"
|
|
||||||
import tuningNames from "@/constant/tunings.json"
|
|
||||||
|
|
||||||
interface AccessoryType {
|
|
||||||
slotName: string
|
|
||||||
accessoryName: string
|
|
||||||
tunings: Array<{ tuningName: string; tuningValue: number }>
|
|
||||||
}
|
|
||||||
|
|
||||||
interface AccessoryFormModalProps {
|
|
||||||
open: boolean
|
|
||||||
onCancel: () => void
|
|
||||||
onOk: (values: AccessoryType) => void
|
|
||||||
initialData?: AccessoryType | null
|
|
||||||
editingIndex?: number | null
|
|
||||||
}
|
|
||||||
|
|
||||||
const slotOptions = slotNames.map((slotName) => ({ value: slotName }))
|
|
||||||
const tuningOptions = tuningNames.map((tuningName) => ({ value: tuningName }))
|
|
||||||
|
|
||||||
export default function AccessoryFormModal({
|
|
||||||
open,
|
|
||||||
onCancel,
|
|
||||||
onOk,
|
|
||||||
initialData,
|
|
||||||
editingIndex
|
|
||||||
}: AccessoryFormModalProps) {
|
|
||||||
const [form] = Form.useForm<AccessoryType>()
|
|
||||||
|
|
||||||
// 重置表单或回填数据
|
|
||||||
useEffect(() => {
|
|
||||||
if (open) {
|
|
||||||
if (initialData) {
|
|
||||||
// 编辑模式:回填数据
|
|
||||||
form.setFieldsValue(initialData)
|
|
||||||
} else {
|
|
||||||
// 新增模式:重置表单
|
|
||||||
form.resetFields()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}, [open, initialData, form])
|
|
||||||
|
|
||||||
const handleOk = async () => {
|
|
||||||
try {
|
|
||||||
const values = await form.validateFields()
|
|
||||||
onOk(values)
|
|
||||||
form.resetFields()
|
|
||||||
} catch (error) {
|
|
||||||
console.log("表单校验失败:", error)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
const handleCancel = () => {
|
|
||||||
form.resetFields()
|
|
||||||
onCancel()
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Modal
|
|
||||||
title={initialData ? `编辑配件 ${(editingIndex ?? 0) + 1}` : "添加配件"}
|
|
||||||
open={open}
|
|
||||||
onOk={handleOk}
|
|
||||||
onCancel={handleCancel}
|
|
||||||
width={600}
|
|
||||||
destroyOnClose
|
|
||||||
>
|
|
||||||
<Form form={form} layout="vertical" requiredMark={false}>
|
|
||||||
<Form.Item
|
|
||||||
name="slotName"
|
|
||||||
label="槽位"
|
|
||||||
rules={[{ required: true, message: "请选择或输入槽位" }]}
|
|
||||||
>
|
|
||||||
<AutoComplete options={slotOptions} placeholder="请选择或输入槽位" />
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item
|
|
||||||
name="accessoryName"
|
|
||||||
label="配件名称"
|
|
||||||
rules={[{ required: true, message: "请输入配件名称" }]}
|
|
||||||
>
|
|
||||||
<Input placeholder="请输入配件名称" />
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.List name="tunings">
|
|
||||||
{(tuningFields, { add: addTuning, remove: removeTuning }) => (
|
|
||||||
<div className="flex flex-col gap-3">
|
|
||||||
<div className="font-medium">精校配置</div>
|
|
||||||
{tuningFields.map((tuningField) => (
|
|
||||||
<Space key={tuningField.key} align="start" className="w-full" wrap>
|
|
||||||
<Form.Item
|
|
||||||
name={[tuningField.name, "tuningName"]}
|
|
||||||
label="精校属性"
|
|
||||||
rules={[{ required: true, message: "请选择或输入精校属性" }]}
|
|
||||||
>
|
|
||||||
<AutoComplete
|
|
||||||
options={tuningOptions}
|
|
||||||
placeholder="例如:后坐控制"
|
|
||||||
className="w-44"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name={[tuningField.name, "tuningValue"]}
|
|
||||||
label="精校值"
|
|
||||||
rules={[{ required: true, message: "请输入精校值" }]}
|
|
||||||
>
|
|
||||||
<InputNumber className="w-32" placeholder="例如:0.35" />
|
|
||||||
</Form.Item>
|
|
||||||
<Button
|
|
||||||
type="link"
|
|
||||||
danger
|
|
||||||
className="mt-8"
|
|
||||||
onClick={() => removeTuning(tuningField.name)}
|
|
||||||
>
|
|
||||||
删除
|
|
||||||
</Button>
|
|
||||||
</Space>
|
|
||||||
))}
|
|
||||||
<Button
|
|
||||||
type="dashed"
|
|
||||||
disabled={tuningFields.length >= 2}
|
|
||||||
onClick={() => addTuning({ tuningName: "", tuningValue: 0 })}
|
|
||||||
>
|
|
||||||
+ 添加精校
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</Form.List>
|
|
||||||
</Form>
|
|
||||||
</Modal>
|
|
||||||
)
|
|
||||||
}
|
|
||||||
@@ -1,100 +0,0 @@
|
|||||||
/* DisplayBoard.css - 荧光绿主题 + 紧凑导航栏样式 */
|
|
||||||
|
|
||||||
.display-board {
|
|
||||||
/* 横向排列,紧凑高度 */
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
gap: 12px;
|
|
||||||
height: 48px; /* 严格控制高度,适合导航栏 */
|
|
||||||
padding: 0 20px;
|
|
||||||
background-color: #ffffff00;
|
|
||||||
overflow-x: auto; /* 窄屏时允许滚动,保证所有项目可见 */
|
|
||||||
white-space: nowrap;
|
|
||||||
scrollbar-width: thin;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 自定义滚动条(可选,提升美观) */
|
|
||||||
.display-board::-webkit-scrollbar {
|
|
||||||
height: 4px;
|
|
||||||
}
|
|
||||||
.display-board::-webkit-scrollbar-track {
|
|
||||||
background: #f0f0f0;
|
|
||||||
}
|
|
||||||
.display-board::-webkit-scrollbar-thumb {
|
|
||||||
background: #10e28c;
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 每个内容卡片 - 轻量胶囊风格 */
|
|
||||||
.display-item {
|
|
||||||
border-radius: 2px;
|
|
||||||
display: inline-flex;
|
|
||||||
align-items: center;
|
|
||||||
gap: 8px;
|
|
||||||
background-color: #0b0f149d;
|
|
||||||
padding: 4px 14px;
|
|
||||||
transition: all 0.2s ease;
|
|
||||||
box-shadow: 0 1px 2px rgba(0,0,0,0.02);
|
|
||||||
}
|
|
||||||
|
|
||||||
.loading-placeholder{
|
|
||||||
color: #10e28c;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 名字样式 - 清晰易读 */
|
|
||||||
.item-name {
|
|
||||||
font-size: 13px;
|
|
||||||
font-weight: 500;
|
|
||||||
color: #a8a8a8;
|
|
||||||
letter-spacing: 0.3px;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 计算器风格数字板 —— 黑底、荧光绿字、等宽字体、内陷光感 */
|
|
||||||
.calculator-digit {
|
|
||||||
background: #0c0f0c;
|
|
||||||
border-radius: 6px;
|
|
||||||
min-width: 62px;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
font-size: 16px;
|
|
||||||
font-weight: 700;
|
|
||||||
letter-spacing: 1.5px;
|
|
||||||
color: #10e28c;
|
|
||||||
text-shadow: 0 0 3px #10e28c, 0 0 1px #73ff50;
|
|
||||||
box-shadow: inset 0 1px 4px #10e28c, 0 0 0 1px #73ff5046;
|
|
||||||
transition: all 0.1s linear;
|
|
||||||
display: grid;
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.calculator-digit div{
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 模拟计算器屏幕的额外“发光感” */
|
|
||||||
.calculator-digit:hover {
|
|
||||||
text-shadow: 0 0 5px #10e28c;
|
|
||||||
box-shadow: inset 0 1px 4px rgba(0,0,0,0.8), 0 0 2px #10e28c;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 响应式微调:当屏幕宽度小于500px时适当缩小间距和字体 */
|
|
||||||
@media (max-width: 560px) {
|
|
||||||
.display-board {
|
|
||||||
gap: 8px;
|
|
||||||
padding: 0 12px;
|
|
||||||
}
|
|
||||||
.display-item {
|
|
||||||
padding: 3px 10px;
|
|
||||||
gap: 5px;
|
|
||||||
}
|
|
||||||
.item-name {
|
|
||||||
font-size: 11px;
|
|
||||||
}
|
|
||||||
.calculator-digit {
|
|
||||||
font-size: 13px;
|
|
||||||
min-width: 54px;
|
|
||||||
padding: 2px 6px;
|
|
||||||
letter-spacing: 1px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -1,134 +0,0 @@
|
|||||||
import React, { useState, useEffect } from 'react';
|
|
||||||
import './DisplayBoard.css';
|
|
||||||
import { DailyPasswordApi } from '@/api';
|
|
||||||
import { DailyPasswordData,PasswordItem } from '@/types/DailyPasswordResponse';
|
|
||||||
|
|
||||||
// 单条数据接口
|
|
||||||
interface DisplayItem {
|
|
||||||
mapName: string;
|
|
||||||
password: number;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 组件 Props 接口(支持动态获取 + 静态传入)
|
|
||||||
interface DisplayBoardProps {
|
|
||||||
/** 可选:静态数据,若同时提供 fetchData,则静态数据仅作为初始值 */
|
|
||||||
items?: PasswordItem[];
|
|
||||||
/** 可选:异步获取数据的函数,返回值应为 DisplayItem[] */
|
|
||||||
fetchData?: () => Promise<PasswordItem[]>;
|
|
||||||
/** 可选:自动刷新间隔(毫秒),默认不自动刷新 */
|
|
||||||
refreshInterval?: number;
|
|
||||||
/** 可选:是否强制要求数组长度为 5(默认 true) */
|
|
||||||
enforceLength?: boolean;
|
|
||||||
}
|
|
||||||
|
|
||||||
/**
|
|
||||||
* 头部导航栏显示框组件
|
|
||||||
* - 支持静态数据传入
|
|
||||||
* - 支持动态数据获取(通过 fetchData 属性)
|
|
||||||
* - 自动处理加载状态(显示简短占位符)
|
|
||||||
* - 紧凑设计(高 48px),荧光绿主题,计算器风格密码
|
|
||||||
*/
|
|
||||||
const DisplayBoard: React.FC<DisplayBoardProps> = ({
|
|
||||||
items: staticItems,
|
|
||||||
fetchData,
|
|
||||||
refreshInterval,
|
|
||||||
enforceLength = true,
|
|
||||||
}) => {
|
|
||||||
const [items, setItems] = useState<PasswordItem[]>([]);
|
|
||||||
const [loading, setLoading] = useState<boolean>(!!fetchData);
|
|
||||||
|
|
||||||
const defaultItems: PasswordItem[] = [
|
|
||||||
{ mapName: 'Alex', password: '1234' },
|
|
||||||
{ mapName: 'Jamie', password: '5678' },
|
|
||||||
{ mapName: 'Taylor', password: '9012'},
|
|
||||||
{ mapName: 'Jordan', password: '3456' },
|
|
||||||
{ mapName: 'Casey', password: '7890' },
|
|
||||||
];
|
|
||||||
|
|
||||||
// 确保数组长度为 5(若 enforceLength 为 true)
|
|
||||||
const ensureLength = (data: PasswordItem[]): PasswordItem[] => {
|
|
||||||
if (!enforceLength) return data;
|
|
||||||
if (data.length === 5) return data;
|
|
||||||
if (data.length < 5) {
|
|
||||||
// 不足则用默认数据补齐,实际项目中可自定义补齐逻辑
|
|
||||||
return [...data, ...defaultItems.slice(data.length, 5)];
|
|
||||||
}
|
|
||||||
// 超过5个则截取前5个
|
|
||||||
return data.slice(0, 5);
|
|
||||||
};
|
|
||||||
|
|
||||||
// 加载数据的函数
|
|
||||||
const loadData = async () => {
|
|
||||||
if (DailyPasswordApi.getDailyPassword) {
|
|
||||||
setLoading(true);
|
|
||||||
try {
|
|
||||||
const dynamicData = await DailyPasswordApi.getDailyPassword();
|
|
||||||
const finalData = ensureLength(dynamicData);
|
|
||||||
setItems(finalData);
|
|
||||||
} catch (error) {
|
|
||||||
console.error('动态获取密码数据失败', error);
|
|
||||||
// 出错时使用静态数据或默认数据兜底
|
|
||||||
if (staticItems && staticItems.length > 0) {
|
|
||||||
setItems(ensureLength(staticItems));
|
|
||||||
} else {
|
|
||||||
setItems(defaultItems);
|
|
||||||
}
|
|
||||||
} finally {
|
|
||||||
setLoading(false);
|
|
||||||
}
|
|
||||||
} else if (staticItems) {
|
|
||||||
// 仅静态数据模式
|
|
||||||
setItems(ensureLength(staticItems));
|
|
||||||
} else {
|
|
||||||
// 无任何数据源,使用默认
|
|
||||||
setItems(defaultItems);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// 初次加载 & fetchData 变化时重新拉取
|
|
||||||
useEffect(() => {
|
|
||||||
loadData();
|
|
||||||
}, [fetchData]); // 注意:staticItems 变化不会自动触发重新拉取,如需可自行添加依赖
|
|
||||||
|
|
||||||
// 定时刷新逻辑
|
|
||||||
useEffect(() => {
|
|
||||||
if (!fetchData || !refreshInterval || refreshInterval <= 0) return;
|
|
||||||
const timer = setInterval(() => {
|
|
||||||
loadData();
|
|
||||||
}, refreshInterval);
|
|
||||||
return () => clearInterval(timer);
|
|
||||||
}, [fetchData, refreshInterval]);
|
|
||||||
|
|
||||||
// 辅助:格式化密码为四位数字(计算器风格)
|
|
||||||
const formatPassword = (pwd: string | number): string => {
|
|
||||||
const str = String(pwd).replace(/\D/g, '');
|
|
||||||
if (str.length >= 4) return str.slice(0, 4);
|
|
||||||
return str.padStart(4, '0');
|
|
||||||
};
|
|
||||||
|
|
||||||
// 加载状态时显示简洁的占位符(保持高度不变,避免布局抖动)
|
|
||||||
if (loading && items.length === 0) {
|
|
||||||
return (
|
|
||||||
<div className="display-board loading">
|
|
||||||
<div className="loading-placeholder">加载密码...</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="display-board">
|
|
||||||
{items.map((item, index) => (
|
|
||||||
<div className="display-item" key={`${item.mapName}-${index}`}>
|
|
||||||
<span className="item-name">{item.mapName}</span>
|
|
||||||
<div className="calculator-digit">
|
|
||||||
<div>
|
|
||||||
{formatPassword(item.password)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
export default DisplayBoard;
|
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
// ModCodes.tsx
|
// ModCodes.tsx
|
||||||
import { useEffect, useState, useCallback, useMemo } from "react";
|
import { useEffect, useState, useCallback, useMemo } from "react";
|
||||||
import { Card, Col, Pagination, Row, Tag, Typography, Button, Popconfirm, Space, Select, App, message } from "antd";
|
import { Card, Col, Pagination, Row, Tag, Typography, Button, Popconfirm, Space, Select, App } from "antd";
|
||||||
import { Link } from "react-router-dom";
|
import { Link } from "react-router-dom";
|
||||||
import { ModificationApi, TagApi } from "@/api";
|
import { ModificationApi, TagApi } from "@/api";
|
||||||
import { Modification } from "@/types";
|
import { Modification } from "@/types";
|
||||||
@@ -47,10 +47,9 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
page: page - 1,
|
page: page - 1,
|
||||||
size: pageSize,
|
size: pageSize,
|
||||||
sortBy: "id",
|
sortBy: "id",
|
||||||
direction: "DESC",
|
direction: "ASC",
|
||||||
firearmId: numericId, // 使用数字类型
|
firearmId: numericId, // 使用数字类型
|
||||||
tags: selectedTags,
|
tags: selectedTags,
|
||||||
|
|
||||||
});
|
});
|
||||||
setModifications(pagedData.items);
|
setModifications(pagedData.items);
|
||||||
setTotal(pagedData.totalElements);
|
setTotal(pagedData.totalElements);
|
||||||
@@ -93,14 +92,14 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
if (!parsedFirearmId) {
|
if (!parsedFirearmId) {
|
||||||
return <Typography.Text type="secondary">无效的武器 ID</Typography.Text>;
|
return <Typography.Text type="secondary">无效的武器 ID</Typography.Text>;
|
||||||
}
|
}
|
||||||
const tagColors = [
|
const tagColors = [
|
||||||
'#e28010', // 青绿
|
'#e28010', // 青绿
|
||||||
'#0EA5E9', // 天蓝
|
'#0EA5E9', // 天蓝
|
||||||
'#8B5CF6', // 紫色
|
'#8B5CF6', // 紫色
|
||||||
'#F59E0B', // 琥珀
|
'#F59E0B', // 琥珀
|
||||||
'#EF4444', // 红色
|
'#EF4444', // 红色
|
||||||
'#EC4899', // 粉红
|
'#EC4899', // 粉红
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -184,11 +183,11 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
<span>
|
<span>
|
||||||
<strong style={{
|
<strong style={{
|
||||||
color: '#10E28C',
|
color: '#10E28C',
|
||||||
fontWeight: 800
|
fontWeight:800
|
||||||
}}>改枪码:</strong>
|
}}>改枪码:</strong>
|
||||||
<code className="rounded" style={{
|
<code className="rounded" style={{
|
||||||
color: '#10E28C',
|
color: '#10E28C',
|
||||||
fontWeight: 600
|
fontWeight:600
|
||||||
}}>
|
}}>
|
||||||
{modification.code}
|
{modification.code}
|
||||||
</code>
|
</code>
|
||||||
@@ -196,14 +195,7 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
<Button
|
<Button
|
||||||
type="text"
|
type="text"
|
||||||
size="small"
|
size="small"
|
||||||
onClick={async () => {
|
onClick={() => navigator.clipboard.writeText(modification.code)}
|
||||||
try {
|
|
||||||
await navigator.clipboard.writeText(modification.code);
|
|
||||||
message.success('已复制到剪贴板'); // 绿色成功提示,2秒后自动消失
|
|
||||||
} catch {
|
|
||||||
message.error('复制失败,请重试'); // 红色错误提示
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
>
|
||||||
复制
|
复制
|
||||||
</Button>
|
</Button>
|
||||||
@@ -212,9 +204,9 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
{/* 作者 */}
|
{/* 作者 */}
|
||||||
<div className="flex items-center justify-between gap-2">
|
<div className="flex items-center justify-between gap-2">
|
||||||
<Typography.Text style={{
|
<Typography.Text style={{
|
||||||
color: '#B59728',
|
color:'#B59728',
|
||||||
fontWeight: 800
|
fontWeight:800
|
||||||
}}>
|
}}>
|
||||||
<strong>作者:</strong>
|
<strong>作者:</strong>
|
||||||
{modification.author || "未知"}
|
{modification.author || "未知"}
|
||||||
</Typography.Text>
|
</Typography.Text>
|
||||||
@@ -222,7 +214,7 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
{/* 标签列表 */}
|
{/* 标签列表 */}
|
||||||
{(modification.tags?.length || 0) > 0 && (
|
{(modification.tags?.length || 0) > 0 && (
|
||||||
<div className="flex flex-wrap gap-2">
|
<div className="flex flex-wrap gap-2">
|
||||||
{(modification.tags || []).map((tag, idx) => (
|
{(modification.tags || []).map((tag,idx) => (
|
||||||
<Tag key={`${modification.id}-${tag}`} style={{
|
<Tag key={`${modification.id}-${tag}`} style={{
|
||||||
background: tagColors[idx % tagColors.length],
|
background: tagColors[idx % tagColors.length],
|
||||||
font: '800'
|
font: '800'
|
||||||
@@ -237,7 +229,7 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
<Typography.Text strong>配件配置:</Typography.Text></div>
|
<Typography.Text strong>配件配置:</Typography.Text></div>
|
||||||
{(modification.accessories?.length || 0) > 0 ? (
|
{(modification.accessories?.length || 0) > 0 ? (
|
||||||
<div className="mt-2 overflow-x-auto">
|
<div className="mt-2 overflow-x-auto">
|
||||||
<div className="grid min-w-[275px] grid-cols-4 gap-2">
|
<div className="grid min-w-[275px] grid-cols-6 gap-2">
|
||||||
{(modification.accessories || []).map((accessory, accessoryIndex) => (
|
{(modification.accessories || []).map((accessory, accessoryIndex) => (
|
||||||
<div
|
<div
|
||||||
key={`${modification.id}-accessory-${accessoryIndex}`}
|
key={`${modification.id}-accessory-${accessoryIndex}`}
|
||||||
@@ -267,8 +259,7 @@ export default function ModCodes({ firearmId }: ModCodesProps) {
|
|||||||
<Tag
|
<Tag
|
||||||
key={`${modification.id}-${accessoryIndex}-tuning-${tuningIndex}`}
|
key={`${modification.id}-${accessoryIndex}-tuning-${tuningIndex}`}
|
||||||
style={{
|
style={{
|
||||||
background: '#EED177',
|
background: '#10E28C',
|
||||||
color: '#000000',
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{tuning.tuningName || "未命名"}: {tuning.tuningValue ?? "-"}
|
{tuning.tuningName || "未命名"}: {tuning.tuningValue ?? "-"}
|
||||||
|
|||||||
@@ -13,10 +13,7 @@ interface ModificationCreateModalProps {
|
|||||||
}
|
}
|
||||||
|
|
||||||
function normalizeRequest(values: ModificationRequest): ModificationRequest {
|
function normalizeRequest(values: ModificationRequest): ModificationRequest {
|
||||||
console.log(values);
|
|
||||||
return {
|
return {
|
||||||
|
|
||||||
|
|
||||||
firearmId: values.firearmId,
|
firearmId: values.firearmId,
|
||||||
name: values.name.trim(),
|
name: values.name.trim(),
|
||||||
code: values.code.trim(),
|
code: values.code.trim(),
|
||||||
@@ -67,11 +64,10 @@ export default function ModificationCreateModal({
|
|||||||
firearmId: lockedFirearmId ?? values.firearmId,
|
firearmId: lockedFirearmId ?? values.firearmId,
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
|
|
||||||
message.success("改枪码创建成功")
|
message.success("改枪码创建成功")
|
||||||
form.resetFields()
|
form.resetFields()
|
||||||
onSuccess(modification)
|
onSuccess(modification)
|
||||||
} catch{
|
} catch {
|
||||||
message.error("改枪码创建失败,请稍后重试")
|
message.error("改枪码创建失败,请稍后重试")
|
||||||
} finally {
|
} finally {
|
||||||
setLoading(false)
|
setLoading(false)
|
||||||
|
|||||||
@@ -1,535 +1,32 @@
|
|||||||
// import { useEffect, useMemo, useState } from "react"
|
import { useEffect, useMemo, useState } from "react"
|
||||||
// import { FirearmApi } from "@/api"
|
import { FirearmApi } from "@/api"
|
||||||
// import slotNames from "@/constant/slots.json"
|
import slotNames from "@/constant/slots.json"
|
||||||
// import tuningNames from "@/constant/tunings.json"
|
import tuningNames from "@/constant/tunings.json"
|
||||||
// import { Firearm, ModificationRequest } from "@/types"
|
import { Firearm, ModificationRequest } from "@/types"
|
||||||
// import { AutoComplete, Button, Card, Form, Input, InputNumber, Select, Space, Tag, message } from "antd"
|
import { AutoComplete, Button, Card, Form, Input, InputNumber, Select, Space } from "antd"
|
||||||
// import { EditOutlined, DeleteOutlined, PlusOutlined } from "@ant-design/icons"
|
|
||||||
// import AccessoryFormModal from "@/components/AccessoryFormModal"
|
|
||||||
|
|
||||||
// const slotOptions = slotNames.map((slotName) => ({ value: slotName }))
|
|
||||||
// const tuningOptions = tuningNames.map((tuningName) => ({ value: tuningName }))
|
|
||||||
|
|
||||||
// interface ModificationFormProps {
|
|
||||||
// form: ReturnType<typeof Form.useForm<ModificationRequest>>[0]
|
|
||||||
// onFinish: (values: ModificationRequest) => void
|
|
||||||
// lockFirearmId?: number
|
|
||||||
// }
|
|
||||||
|
|
||||||
// interface AccessoryType {
|
|
||||||
// slotName: string
|
|
||||||
// accessoryName: string
|
|
||||||
// tunings: Array<{ tuningName: string; tuningValue: number }>
|
|
||||||
// }
|
|
||||||
|
|
||||||
// export default function ModificationForm({ form, onFinish, lockFirearmId }: ModificationFormProps) {
|
|
||||||
// const [firearmOptions, setFirearmOptions] = useState<Array<{ value: number; label: string }>>([])
|
|
||||||
// const [firearmLoading, setFirearmLoading] = useState(false)
|
|
||||||
|
|
||||||
// // 配件弹窗相关状态
|
|
||||||
// const [accessoryModalOpen, setAccessoryModalOpen] = useState(false)
|
|
||||||
// const [editingAccessory, setEditingAccessory] = useState<AccessoryType | null>(null)
|
|
||||||
// const [editingAccessoryIndex, setEditingAccessoryIndex] = useState<number | null>(null)
|
|
||||||
|
|
||||||
// useEffect(() => {
|
|
||||||
// let active = true
|
|
||||||
|
|
||||||
// async function loadAllFirearms() {
|
|
||||||
// setFirearmLoading(true)
|
|
||||||
// try {
|
|
||||||
// const allFirearms: Firearm[] = []
|
|
||||||
// let page = 0
|
|
||||||
// let totalPages = 1
|
|
||||||
|
|
||||||
// while (page < totalPages) {
|
|
||||||
// const paged = await FirearmApi.getFirearms({
|
|
||||||
// page,
|
|
||||||
// size: 100,
|
|
||||||
// sortBy: "id",
|
|
||||||
// direction: "ASC",
|
|
||||||
// })
|
|
||||||
|
|
||||||
// allFirearms.push(...paged.items)
|
|
||||||
// totalPages = paged.totalPages
|
|
||||||
// page += 1
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (!active) {
|
|
||||||
// return
|
|
||||||
// }
|
|
||||||
|
|
||||||
// setFirearmOptions(
|
|
||||||
// allFirearms.map((firearm) => ({
|
|
||||||
// value: firearm.id,
|
|
||||||
// label: `${firearm.name}`,
|
|
||||||
// }))
|
|
||||||
// )
|
|
||||||
// } finally {
|
|
||||||
// if (active) {
|
|
||||||
// setFirearmLoading(false)
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// void loadAllFirearms()
|
|
||||||
|
|
||||||
// return () => {
|
|
||||||
// active = false
|
|
||||||
// }
|
|
||||||
// }, [])
|
|
||||||
|
|
||||||
// const mergedFirearmOptions = useMemo(() => {
|
|
||||||
// if (
|
|
||||||
// lockFirearmId === undefined ||
|
|
||||||
// firearmOptions.some((option) => option.value === lockFirearmId)
|
|
||||||
// ) {
|
|
||||||
// return firearmOptions
|
|
||||||
// }
|
|
||||||
|
|
||||||
// return [{ value: lockFirearmId, label: `武器 ID: ${lockFirearmId}` }, ...firearmOptions]
|
|
||||||
// }, [firearmOptions, lockFirearmId])
|
|
||||||
|
|
||||||
// // 打开添加配件弹窗
|
|
||||||
// const handleAddAccessory = () => {
|
|
||||||
// setEditingAccessory(null)
|
|
||||||
// setEditingAccessoryIndex(null)
|
|
||||||
// setAccessoryModalOpen(true)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // 打开编辑配件弹窗
|
|
||||||
// const handleEditAccessory = (index: number, accessory: AccessoryType) => {
|
|
||||||
// setEditingAccessory(accessory)
|
|
||||||
// setEditingAccessoryIndex(index)
|
|
||||||
// setAccessoryModalOpen(true)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // 删除配件
|
|
||||||
// const handleDeleteAccessory = (remove: (index: number) => void, index: number) => {
|
|
||||||
// remove(index)
|
|
||||||
// message.success("删除成功")
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // 配件弹窗确认回调
|
|
||||||
// const handleAccessoryModalOk = (values: AccessoryType) => {
|
|
||||||
// const accessories = form.getFieldValue("accessories") || []
|
|
||||||
|
|
||||||
// if (editingAccessoryIndex !== null) {
|
|
||||||
// // 编辑模式:更新指定索引的数据
|
|
||||||
// const updatedAccessories = [...accessories]
|
|
||||||
// updatedAccessories[editingAccessoryIndex] = values
|
|
||||||
// form.setFieldsValue({ accessories: updatedAccessories })
|
|
||||||
// message.success("修改成功")
|
|
||||||
// } else {
|
|
||||||
// // 新增模式:添加新数据
|
|
||||||
// form.setFieldsValue({ accessories: [...accessories, values] })
|
|
||||||
// message.success("添加成功")
|
|
||||||
// }
|
|
||||||
|
|
||||||
// setAccessoryModalOpen(false)
|
|
||||||
// setEditingAccessory(null)
|
|
||||||
// setEditingAccessoryIndex(null)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// // 配件弹窗取消回调
|
|
||||||
// const handleAccessoryModalCancel = () => {
|
|
||||||
// setAccessoryModalOpen(false)
|
|
||||||
// setEditingAccessory(null)
|
|
||||||
// setEditingAccessoryIndex(null)
|
|
||||||
// }
|
|
||||||
|
|
||||||
// return (
|
|
||||||
// <>
|
|
||||||
// <Form<ModificationRequest>
|
|
||||||
// form={form}
|
|
||||||
// layout="vertical"
|
|
||||||
// onFinish={() => {
|
|
||||||
// const allValues = form.getFieldsValue(true);
|
|
||||||
// console.log('完整数据:', allValues);
|
|
||||||
// onFinish(allValues);
|
|
||||||
// }}
|
|
||||||
// requiredMark={false}>
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="firearmId"
|
|
||||||
// label="武器"
|
|
||||||
// rules={[{ required: true, message: "请输入武器" }]}>
|
|
||||||
// <Select<number>
|
|
||||||
// className="w-full"
|
|
||||||
// placeholder="请选择武器"
|
|
||||||
// options={mergedFirearmOptions}
|
|
||||||
// loading={firearmLoading}
|
|
||||||
// disabled={lockFirearmId !== undefined}
|
|
||||||
// showSearch={{
|
|
||||||
// filterOption: (input, option) => {
|
|
||||||
// const labelText = String(option?.label ?? "")
|
|
||||||
// return labelText.toLowerCase().includes(input.toLowerCase())
|
|
||||||
// },
|
|
||||||
// }}
|
|
||||||
// />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="name"
|
|
||||||
// label="改装名称"
|
|
||||||
// rules={[{ required: true, message: "请输入改装名称" }]}>
|
|
||||||
// <Input placeholder="请输入改装名称" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="code"
|
|
||||||
// label="改枪码"
|
|
||||||
// rules={[{ required: true, message: "请输入改枪码" }]}>
|
|
||||||
// <Input placeholder="请输入改枪码" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="tags" label="标签">
|
|
||||||
// <Select mode="tags" tokenSeparators={[",", " "]} placeholder="可选:输入后回车" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="author" label="作者">
|
|
||||||
// <Input placeholder="可选:请输入作者" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="videoUrl" label="视频链接">
|
|
||||||
// <Input placeholder="可选:请输入视频链接" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="note" label="备注">
|
|
||||||
// <Input.TextArea rows={3} placeholder="可选:补充说明" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// {/* 改造后的配件列表 */}
|
|
||||||
// <div className="flex flex-col gap-4">
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> label="配件配置">
|
|
||||||
// <Form.List name="accessories">
|
|
||||||
// {(accessoryFields, { add, remove }) => (
|
|
||||||
// <div className="flex flex-col gap-3">
|
|
||||||
// {/* 配件标签列表 */}
|
|
||||||
// <div className="flex flex-wrap gap-2">
|
|
||||||
// {accessoryFields.length === 0 ? (
|
|
||||||
// <div className="text-gray-400 text-sm py-2">暂无配件,点击下方按钮添加</div>
|
|
||||||
// ) : (
|
|
||||||
// accessoryFields.map((accessoryField, index) => {
|
|
||||||
// const accessory = form.getFieldValue(["accessories", index]) as AccessoryType
|
|
||||||
// return (
|
|
||||||
// <Tag
|
|
||||||
// key={accessoryField.key}
|
|
||||||
// closable
|
|
||||||
// onClose={(e) => {
|
|
||||||
// e.preventDefault()
|
|
||||||
// handleDeleteAccessory(remove, accessoryField.name)
|
|
||||||
// }}
|
|
||||||
// closeIcon={<DeleteOutlined />}
|
|
||||||
// className="px-3 py-1.5 text-sm border hover:shadow-sm transition-all "
|
|
||||||
// style={{ marginRight: 8, marginBottom: 8 }}
|
|
||||||
// >
|
|
||||||
// <Space size={6}>
|
|
||||||
// <span className="font-medium text-[#2ee59d]">
|
|
||||||
// {accessory?.slotName || "?"}
|
|
||||||
// </span>
|
|
||||||
// <span className="text-gray-400">·</span>
|
|
||||||
// <span className="text-[#2ee59d]">
|
|
||||||
// {accessory?.accessoryName || "未命名"}
|
|
||||||
// </span>
|
|
||||||
// {accessory?.tunings && accessory.tunings.length > 0 && (
|
|
||||||
// <span className="text-blue-500 text-xs bg-blue-50 px-1.5 py-0.5 rounded">
|
|
||||||
// {accessory.tunings.length}项精校
|
|
||||||
// </span>
|
|
||||||
// )}
|
|
||||||
// <Button
|
|
||||||
// type="link"
|
|
||||||
// size="small"
|
|
||||||
// icon={<EditOutlined />}
|
|
||||||
// onClick={(e) => {
|
|
||||||
// e.stopPropagation()
|
|
||||||
// const currentAccessory = form.getFieldValue(["accessories", index])
|
|
||||||
// handleEditAccessory(index, currentAccessory)
|
|
||||||
// }}
|
|
||||||
// className="text-blue-500 hover:text-blue-700 p-0"
|
|
||||||
// style={{ marginLeft: 4 }}
|
|
||||||
// />
|
|
||||||
// </Space>
|
|
||||||
// </Tag>
|
|
||||||
// )
|
|
||||||
// })
|
|
||||||
// )}
|
|
||||||
// </div>
|
|
||||||
|
|
||||||
// {/* 添加按钮 */}
|
|
||||||
// <Button
|
|
||||||
// type="dashed"
|
|
||||||
// icon={<PlusOutlined />}
|
|
||||||
// onClick={handleAddAccessory}
|
|
||||||
// size="small"
|
|
||||||
// className="w-full"
|
|
||||||
// >
|
|
||||||
// 添加配件
|
|
||||||
// </Button>
|
|
||||||
// </div>
|
|
||||||
// )}
|
|
||||||
// </Form.List>
|
|
||||||
// </Form.Item>
|
|
||||||
// </div>
|
|
||||||
|
|
||||||
// </Form>
|
|
||||||
|
|
||||||
// {/* 配件编辑弹窗 */}
|
|
||||||
// <AccessoryFormModal
|
|
||||||
// open={accessoryModalOpen}
|
|
||||||
// onCancel={handleAccessoryModalCancel}
|
|
||||||
// onOk={handleAccessoryModalOk}
|
|
||||||
// initialData={editingAccessory}
|
|
||||||
// editingIndex={editingAccessoryIndex}
|
|
||||||
// />
|
|
||||||
// </>
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
// import { useEffect, useMemo, useState } from "react"
|
|
||||||
// import { FirearmApi } from "@/api"
|
|
||||||
// import slotNames from "@/constant/slots.json"
|
|
||||||
// import tuningNames from "@/constant/tunings.json"
|
|
||||||
// import { Firearm, ModificationRequest } from "@/types"
|
|
||||||
// import { AutoComplete, Button, Card, Form, Input, InputNumber, Select, Space } from "antd"
|
|
||||||
|
|
||||||
// interface ModificationFormProps {
|
|
||||||
// form: ReturnType<typeof Form.useForm<ModificationRequest>>[0]
|
|
||||||
// onFinish: (values: ModificationRequest) => void
|
|
||||||
// lockFirearmId?: number
|
|
||||||
// }
|
|
||||||
|
|
||||||
// const slotOptions = slotNames.map((slotName) => ({ value: slotName }))
|
|
||||||
// const tuningOptions = tuningNames.map((tuningName) => ({ value: tuningName }))
|
|
||||||
|
|
||||||
// export default function ModificationForm({ form, onFinish, lockFirearmId }: ModificationFormProps) {
|
|
||||||
// const [firearmOptions, setFirearmOptions] = useState<Array<{ value: number; label: string }>>([])
|
|
||||||
// const [firearmLoading, setFirearmLoading] = useState(false)
|
|
||||||
|
|
||||||
// useEffect(() => {
|
|
||||||
// let active = true
|
|
||||||
|
|
||||||
// async function loadAllFirearms() {
|
|
||||||
// setFirearmLoading(true)
|
|
||||||
// try {
|
|
||||||
// const allFirearms: Firearm[] = []
|
|
||||||
// let page = 0
|
|
||||||
// let totalPages = 1
|
|
||||||
|
|
||||||
// while (page < totalPages) {
|
|
||||||
// const paged = await FirearmApi.getFirearms({
|
|
||||||
// page,
|
|
||||||
// size: 100,
|
|
||||||
// sortBy: "id",
|
|
||||||
// direction: "ASC",
|
|
||||||
// })
|
|
||||||
|
|
||||||
// allFirearms.push(...paged.items)
|
|
||||||
// totalPages = paged.totalPages
|
|
||||||
// page += 1
|
|
||||||
// }
|
|
||||||
|
|
||||||
// if (!active) {
|
|
||||||
// return
|
|
||||||
// }
|
|
||||||
|
|
||||||
// setFirearmOptions(
|
|
||||||
// allFirearms.map((firearm) => ({
|
|
||||||
// value: firearm.id,
|
|
||||||
// label: `${firearm.name}`,
|
|
||||||
// }))
|
|
||||||
// )
|
|
||||||
// } finally {
|
|
||||||
// if (active) {
|
|
||||||
// setFirearmLoading(false)
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
// }
|
|
||||||
|
|
||||||
// void loadAllFirearms()
|
|
||||||
|
|
||||||
// return () => {
|
|
||||||
// active = false
|
|
||||||
// }
|
|
||||||
// }, [])
|
|
||||||
|
|
||||||
// const mergedFirearmOptions = useMemo(() => {
|
|
||||||
// if (
|
|
||||||
// lockFirearmId === undefined ||
|
|
||||||
// firearmOptions.some((option) => option.value === lockFirearmId)
|
|
||||||
// ) {
|
|
||||||
// return firearmOptions
|
|
||||||
// }
|
|
||||||
|
|
||||||
// return [{ value: lockFirearmId, label: `武器 ID: ${lockFirearmId}` }, ...firearmOptions]
|
|
||||||
// }, [firearmOptions, lockFirearmId])
|
|
||||||
|
|
||||||
// return (
|
|
||||||
// <Form<ModificationRequest>
|
|
||||||
// form={form}
|
|
||||||
// layout="vertical"
|
|
||||||
// onFinish={onFinish}
|
|
||||||
// requiredMark={false}>
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="firearmId"
|
|
||||||
// label="武器"
|
|
||||||
// rules={[{ required: true, message: "请输入武器" }]}>
|
|
||||||
// <Select<number>
|
|
||||||
// className="w-full"
|
|
||||||
// placeholder="请选择武器"
|
|
||||||
// options={mergedFirearmOptions}
|
|
||||||
// loading={firearmLoading}
|
|
||||||
// disabled={lockFirearmId !== undefined}
|
|
||||||
// showSearch={{
|
|
||||||
// filterOption: (input, option) => {
|
|
||||||
// const labelText = String(option?.label ?? "")
|
|
||||||
// return labelText.toLowerCase().includes(input.toLowerCase())
|
|
||||||
// },
|
|
||||||
// }}
|
|
||||||
// />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="name"
|
|
||||||
// label="改装名称"
|
|
||||||
// rules={[{ required: true, message: "请输入改装名称" }]}>
|
|
||||||
// <Input placeholder="请输入改装名称" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest>
|
|
||||||
// name="code"
|
|
||||||
// label="改枪码"
|
|
||||||
// rules={[{ required: true, message: "请输入改枪码" }]}>
|
|
||||||
// <Input placeholder="请输入改枪码" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="tags" label="标签">
|
|
||||||
// <Select mode="tags" tokenSeparators={[",", " "]} placeholder="可选:输入后回车" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="author" label="作者">
|
|
||||||
// <Input placeholder="可选:请输入作者" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="videoUrl" label="视频链接">
|
|
||||||
// <Input placeholder="可选:请输入视频链接" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item<ModificationRequest> name="note" label="备注">
|
|
||||||
// <Input.TextArea rows={3} placeholder="可选:补充说明" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.List name="accessories">
|
|
||||||
// {(accessoryFields, { add: addAccessory, remove: removeAccessory }) => (
|
|
||||||
// <div className="flex flex-col gap-4">
|
|
||||||
// {accessoryFields.map((accessoryField) => (
|
|
||||||
// <Card
|
|
||||||
// key={accessoryField.key}
|
|
||||||
// title={`配件 ${accessoryField.name + 1}`}
|
|
||||||
// size="small"
|
|
||||||
// extra={
|
|
||||||
// <Button
|
|
||||||
// danger
|
|
||||||
// type="link"
|
|
||||||
// size="small"
|
|
||||||
// onClick={() => removeAccessory(accessoryField.name)}>
|
|
||||||
// 删除配件
|
|
||||||
// </Button>
|
|
||||||
// }>
|
|
||||||
// <Form.Item
|
|
||||||
// name={[accessoryField.name, "slotName"]}
|
|
||||||
// label="槽位"
|
|
||||||
// rules={[{ required: true, message: "请选择或输入槽位" }]}>
|
|
||||||
// <AutoComplete options={slotOptions} placeholder="请选择或输入槽位" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.Item
|
|
||||||
// name={[accessoryField.name, "accessoryName"]}
|
|
||||||
// label="配件名称"
|
|
||||||
// rules={[{ required: true, message: "请输入配件名称" }]}>
|
|
||||||
// <Input placeholder="请输入配件名称" />
|
|
||||||
// </Form.Item>
|
|
||||||
|
|
||||||
// <Form.List name={[accessoryField.name, "tunings"]}>
|
|
||||||
// {(tuningFields, { add: addTuning, remove: removeTuning }) => (
|
|
||||||
// <div className="flex flex-col gap-3">
|
|
||||||
// {tuningFields.map((tuningField) => (
|
|
||||||
// <Space key={tuningField.key} align="start" className="w-full" wrap>
|
|
||||||
// <Form.Item
|
|
||||||
// name={[tuningField.name, "tuningName"]}
|
|
||||||
// label="精校属性"
|
|
||||||
// rules={[{ required: true, message: "请选择或输入精校属性" }]}>
|
|
||||||
// <AutoComplete
|
|
||||||
// options={tuningOptions}
|
|
||||||
// placeholder="例如:后坐控制"
|
|
||||||
// className="w-44"
|
|
||||||
// />
|
|
||||||
// </Form.Item>
|
|
||||||
// <Form.Item
|
|
||||||
// name={[tuningField.name, "tuningValue"]}
|
|
||||||
// label="精校值"
|
|
||||||
// rules={[{ required: true, message: "请输入精校值" }]}>
|
|
||||||
// <InputNumber className="w-32" placeholder="例如:0.35" />
|
|
||||||
// </Form.Item>
|
|
||||||
// <Button
|
|
||||||
// type="link"
|
|
||||||
// danger
|
|
||||||
// className="mt-8"
|
|
||||||
// onClick={() => removeTuning(tuningField.name)}>
|
|
||||||
// 删除
|
|
||||||
// </Button>
|
|
||||||
// </Space>
|
|
||||||
// ))}
|
|
||||||
// <Button
|
|
||||||
// type="dashed"
|
|
||||||
// disabled={tuningFields.length >= 2}
|
|
||||||
// onClick={() => addTuning({ tuningName: "", tuningValue: 0 })}>
|
|
||||||
// 添加精校
|
|
||||||
// </Button>
|
|
||||||
// </div>
|
|
||||||
// )}
|
|
||||||
// </Form.List>
|
|
||||||
// </Card>
|
|
||||||
// ))}
|
|
||||||
// <Button
|
|
||||||
// variant="solid"
|
|
||||||
// color="lime"
|
|
||||||
// onClick={() => addAccessory({ slotName: "", accessoryName: "", tunings: [] })}>
|
|
||||||
// 添加配件
|
|
||||||
// </Button>
|
|
||||||
// </div>
|
|
||||||
// )}
|
|
||||||
// </Form.List>
|
|
||||||
// </Form>
|
|
||||||
// )
|
|
||||||
// }
|
|
||||||
import { useEffect, useMemo, useState } from "react";
|
|
||||||
import { FirearmApi } from "@/api";
|
|
||||||
import slotNames from "@/constant/slots.json";
|
|
||||||
import tuningNames from "@/constant/tunings.json";
|
|
||||||
import { Firearm, ModificationRequest } from "@/types";
|
|
||||||
import { AutoComplete, Button, Card, Form, Input, InputNumber, Select, Space } from "antd";
|
|
||||||
|
|
||||||
interface ModificationFormProps {
|
interface ModificationFormProps {
|
||||||
form: ReturnType<typeof Form.useForm<ModificationRequest>>[0];
|
form: ReturnType<typeof Form.useForm<ModificationRequest>>[0]
|
||||||
onFinish: (values: ModificationRequest) => void;
|
onFinish: (values: ModificationRequest) => void
|
||||||
lockFirearmId?: number;
|
lockFirearmId?: number
|
||||||
}
|
}
|
||||||
|
|
||||||
const slotOptions = slotNames.map((slotName) => ({ value: slotName }));
|
const slotOptions = slotNames.map((slotName) => ({ value: slotName }))
|
||||||
const tuningOptions = tuningNames.map((tuningName) => ({ value: tuningName }));
|
const tuningOptions = tuningNames.map((tuningName) => ({ value: tuningName }))
|
||||||
|
|
||||||
export default function ModificationForm({ form, onFinish, lockFirearmId }: ModificationFormProps) {
|
export default function ModificationForm({ form, onFinish, lockFirearmId }: ModificationFormProps) {
|
||||||
const [firearmOptions, setFirearmOptions] = useState<Array<{ value: number; label: string }>>([]);
|
const [firearmOptions, setFirearmOptions] = useState<Array<{ value: number; label: string }>>([])
|
||||||
const [firearmLoading, setFirearmLoading] = useState(false);
|
const [firearmLoading, setFirearmLoading] = useState(false)
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
let active = true;
|
let active = true
|
||||||
|
|
||||||
async function loadAllFirearms() {
|
async function loadAllFirearms() {
|
||||||
setFirearmLoading(true);
|
setFirearmLoading(true)
|
||||||
try {
|
try {
|
||||||
const allFirearms: Firearm[] = [];
|
const allFirearms: Firearm[] = []
|
||||||
let page = 0;
|
let page = 0
|
||||||
let totalPages = 1;
|
let totalPages = 1
|
||||||
|
|
||||||
while (page < totalPages) {
|
while (page < totalPages) {
|
||||||
const paged = await FirearmApi.getFirearms({
|
const paged = await FirearmApi.getFirearms({
|
||||||
@@ -537,223 +34,184 @@ export default function ModificationForm({ form, onFinish, lockFirearmId }: Modi
|
|||||||
size: 100,
|
size: 100,
|
||||||
sortBy: "id",
|
sortBy: "id",
|
||||||
direction: "ASC",
|
direction: "ASC",
|
||||||
});
|
})
|
||||||
|
|
||||||
allFirearms.push(...paged.items);
|
allFirearms.push(...paged.items)
|
||||||
totalPages = paged.totalPages;
|
totalPages = paged.totalPages
|
||||||
page += 1;
|
page += 1
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!active) return;
|
if (!active) {
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
setFirearmOptions(
|
setFirearmOptions(
|
||||||
allFirearms.map((firearm) => ({
|
allFirearms.map((firearm) => ({
|
||||||
value: firearm.id,
|
value: firearm.id,
|
||||||
label: `${firearm.name}`,
|
label: `${firearm.name}`,
|
||||||
}))
|
}))
|
||||||
);
|
)
|
||||||
} finally {
|
} finally {
|
||||||
if (active) {
|
if (active) {
|
||||||
setFirearmLoading(false);
|
setFirearmLoading(false)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
void loadAllFirearms();
|
void loadAllFirearms()
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
active = false;
|
active = false
|
||||||
};
|
}
|
||||||
}, []);
|
}, [])
|
||||||
|
|
||||||
const mergedFirearmOptions = useMemo(() => {
|
const mergedFirearmOptions = useMemo(() => {
|
||||||
if (
|
if (
|
||||||
lockFirearmId === undefined ||
|
lockFirearmId === undefined ||
|
||||||
firearmOptions.some((option) => option.value === lockFirearmId)
|
firearmOptions.some((option) => option.value === lockFirearmId)
|
||||||
) {
|
) {
|
||||||
return firearmOptions;
|
return firearmOptions
|
||||||
}
|
}
|
||||||
|
|
||||||
return [{ value: lockFirearmId, label: `武器 ID: ${lockFirearmId}` }, ...firearmOptions];
|
return [{ value: lockFirearmId, label: `武器 ID: ${lockFirearmId}` }, ...firearmOptions]
|
||||||
}, [firearmOptions, lockFirearmId]);
|
}, [firearmOptions, lockFirearmId])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Form<ModificationRequest>
|
<Form<ModificationRequest>
|
||||||
form={form}
|
form={form}
|
||||||
layout="vertical"
|
layout="vertical"
|
||||||
onFinish={onFinish}
|
onFinish={onFinish}
|
||||||
requiredMark={false}
|
requiredMark={false}>
|
||||||
className="max-w-full mx-auto"
|
<Form.Item<ModificationRequest>
|
||||||
>
|
name="firearmId"
|
||||||
{/* 强制不换行,左右并排 */}
|
label="武器"
|
||||||
<div className="flex flex-nowrap gap-6">
|
rules={[{ required: true, message: "请输入武器" }]}>
|
||||||
{/* 左侧:主要字段,固定宽度,控件宽度收窄 */}
|
<Select<number>
|
||||||
<div className="flex-none w-[580px] space-y-4">
|
className="w-full"
|
||||||
<Form.Item<ModificationRequest>
|
placeholder="请选择武器"
|
||||||
name="firearmId"
|
options={mergedFirearmOptions}
|
||||||
label="武器"
|
loading={firearmLoading}
|
||||||
rules={[{ required: true, message: "请输入武器" }]}
|
disabled={lockFirearmId !== undefined}
|
||||||
>
|
showSearch={{
|
||||||
<Select<number>
|
filterOption: (input, option) => {
|
||||||
className="w-[580px]"
|
const labelText = String(option?.label ?? "")
|
||||||
placeholder="请选择武器"
|
return labelText.toLowerCase().includes(input.toLowerCase())
|
||||||
options={mergedFirearmOptions}
|
},
|
||||||
loading={firearmLoading}
|
}}
|
||||||
disabled={lockFirearmId !== undefined}
|
/>
|
||||||
showSearch={{
|
</Form.Item>
|
||||||
filterOption: (input, option) => {
|
|
||||||
const labelText = String(option?.label ?? "");
|
|
||||||
return labelText.toLowerCase().includes(input.toLowerCase());
|
|
||||||
},
|
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item<ModificationRequest>
|
<Form.Item<ModificationRequest>
|
||||||
name="name"
|
name="name"
|
||||||
label="改装名称"
|
label="改装名称"
|
||||||
rules={[{ required: true, message: "请输入改装名称" }]}
|
rules={[{ required: true, message: "请输入改装名称" }]}>
|
||||||
>
|
<Input placeholder="请输入改装名称" />
|
||||||
<Input className="w-[580px]" placeholder="请输入改装名称" />
|
</Form.Item>
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item<ModificationRequest>
|
<Form.Item<ModificationRequest>
|
||||||
name="code"
|
name="code"
|
||||||
label="改枪码"
|
label="改枪码"
|
||||||
rules={[{ required: true, message: "请输入改枪码" }]}
|
rules={[{ required: true, message: "请输入改枪码" }]}>
|
||||||
>
|
<Input placeholder="请输入改枪码" />
|
||||||
<Input className="w-[580px]" placeholder="请输入改枪码" />
|
</Form.Item>
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item<ModificationRequest> name="tags" label="标签">
|
<Form.Item<ModificationRequest> name="tags" label="标签">
|
||||||
<Select
|
<Select mode="tags" tokenSeparators={[",", " "]} placeholder="可选:输入后回车" />
|
||||||
mode="tags"
|
</Form.Item>
|
||||||
tokenSeparators={[",", " "]}
|
|
||||||
placeholder="可选:输入后回车"
|
|
||||||
className="w-[580px]"
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item<ModificationRequest> name="author" label="作者">
|
<Form.Item<ModificationRequest> name="author" label="作者">
|
||||||
<Input className="w-[580px]" placeholder="可选:请输入作者" />
|
<Input placeholder="可选:请输入作者" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
||||||
<Form.Item<ModificationRequest> name="videoUrl" label="视频链接">
|
<Form.Item<ModificationRequest> name="videoUrl" label="视频链接">
|
||||||
<Input className="w-[580px]" placeholder="可选:请输入视频链接" />
|
<Input placeholder="可选:请输入视频链接" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
|
|
||||||
<Form.Item<ModificationRequest> name="note" label="备注">
|
<Form.Item<ModificationRequest> name="note" label="备注">
|
||||||
<Input.TextArea className="w-[580px]" rows={3} placeholder="可选:补充说明" />
|
<Input.TextArea rows={3} placeholder="可选:补充说明" />
|
||||||
</Form.Item>
|
</Form.Item>
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 右侧:配件列表,固定宽度,卡片缩小,高度限制滚动 */}
|
<Form.List name="accessories">
|
||||||
<div className="flex-none w-[420px]">
|
{(accessoryFields, { add: addAccessory, remove: removeAccessory }) => (
|
||||||
<div className="max-h-[600px] overflow-y-auto pr-2 hide-scrollbar">
|
<div className="flex flex-col gap-4">
|
||||||
<Form.List name="accessories">
|
{accessoryFields.map((accessoryField) => (
|
||||||
{(accessoryFields, { add: addAccessory, remove: removeAccessory }) => (
|
<Card
|
||||||
<div className="flex flex-col gap-4">
|
key={accessoryField.key}
|
||||||
{accessoryFields.map((accessoryField) => (
|
title={`配件 ${accessoryField.name + 1}`}
|
||||||
<Card
|
size="small"
|
||||||
key={accessoryField.key}
|
extra={
|
||||||
title={`配件 ${accessoryField.name + 1}`}
|
|
||||||
size="small"
|
|
||||||
style={{backgroundColor:'#1f1f1f'}}
|
|
||||||
extra={
|
|
||||||
<Button
|
|
||||||
danger
|
|
||||||
type="link"
|
|
||||||
size="small"
|
|
||||||
onClick={() => removeAccessory(accessoryField.name)}
|
|
||||||
>
|
|
||||||
删除配件
|
|
||||||
</Button>
|
|
||||||
}
|
|
||||||
className="w-full [&_.ant-card-body]:!p-3" // 卡片内边距由默认24px缩小到12px
|
|
||||||
>
|
|
||||||
{/* 用容器控制表单项间距,由默认大间距缩小为4px */}
|
|
||||||
<div className="space-y-1">
|
|
||||||
<Form.Item
|
|
||||||
name={[accessoryField.name, "slotName"]}
|
|
||||||
label="槽位"
|
|
||||||
rules={[{ required: true, message: "请选择或输入槽位" }]}
|
|
||||||
className="!mb-1" // 表单项底部间距缩小
|
|
||||||
>
|
|
||||||
<AutoComplete options={slotOptions} placeholder="请选择或输入槽位" />
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.Item
|
|
||||||
name={[accessoryField.name, "accessoryName"]}
|
|
||||||
label="配件名称"
|
|
||||||
rules={[{ required: true, message: "请输入配件名称" }]}
|
|
||||||
className="!mb-1"
|
|
||||||
>
|
|
||||||
<Input placeholder="请输入配件名称" />
|
|
||||||
</Form.Item>
|
|
||||||
|
|
||||||
<Form.List name={[accessoryField.name, "tunings"]}>
|
|
||||||
{(tuningFields, { add: addTuning, remove: removeTuning }) => (
|
|
||||||
<div className="flex flex-col gap-2"> {/* 精校列表间距由3(12px)缩小为2(8px) */}
|
|
||||||
{tuningFields.map((tuningField) => (
|
|
||||||
<Space key={tuningField.key} align="start" className="w-full" size="small" wrap>
|
|
||||||
<Form.Item
|
|
||||||
name={[tuningField.name, "tuningName"]}
|
|
||||||
label="精校属性"
|
|
||||||
rules={[{ required: true, message: "请选择或输入精校属性" }]}
|
|
||||||
className="!mb-1"
|
|
||||||
>
|
|
||||||
<AutoComplete
|
|
||||||
options={tuningOptions}
|
|
||||||
placeholder="例如:后坐控制"
|
|
||||||
className="w-44" // 完全保留
|
|
||||||
/>
|
|
||||||
</Form.Item>
|
|
||||||
<Form.Item
|
|
||||||
name={[tuningField.name, "tuningValue"]}
|
|
||||||
label="精校值"
|
|
||||||
rules={[{ required: true, message: "请输入精校值" }]}
|
|
||||||
className="!mb-1"
|
|
||||||
>
|
|
||||||
<InputNumber className="w-32" placeholder="例如:0.35" /> {/* 完全保留 */}
|
|
||||||
</Form.Item>
|
|
||||||
<Button
|
|
||||||
type="link"
|
|
||||||
danger
|
|
||||||
className="mt-8" // 完全保留
|
|
||||||
onClick={() => removeTuning(tuningField.name)}
|
|
||||||
>
|
|
||||||
删除
|
|
||||||
</Button>
|
|
||||||
</Space>
|
|
||||||
))}
|
|
||||||
<Button
|
|
||||||
type="dashed"
|
|
||||||
disabled={tuningFields.length >= 2}
|
|
||||||
onClick={() => addTuning({ tuningName: "", tuningValue: 0 })}
|
|
||||||
>
|
|
||||||
添加精校
|
|
||||||
</Button>
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</Form.List>
|
|
||||||
</div>
|
|
||||||
</Card>
|
|
||||||
))}
|
|
||||||
{/* 添加配件按钮,保持在左侧(默认左对齐) */}
|
|
||||||
<Button
|
<Button
|
||||||
variant="solid"
|
danger
|
||||||
color="lime"
|
type="link"
|
||||||
className="self-start"
|
size="small"
|
||||||
onClick={() => addAccessory({ slotName: "", accessoryName: "", tunings: [] })}
|
onClick={() => removeAccessory(accessoryField.name)}>
|
||||||
>
|
删除配件
|
||||||
添加配件
|
|
||||||
</Button>
|
</Button>
|
||||||
</div>
|
}>
|
||||||
)}
|
<Form.Item
|
||||||
</Form.List>
|
name={[accessoryField.name, "slotName"]}
|
||||||
|
label="槽位"
|
||||||
|
rules={[{ required: true, message: "请选择或输入槽位" }]}>
|
||||||
|
<AutoComplete options={slotOptions} placeholder="请选择或输入槽位" />
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.Item
|
||||||
|
name={[accessoryField.name, "accessoryName"]}
|
||||||
|
label="配件名称"
|
||||||
|
rules={[{ required: true, message: "请输入配件名称" }]}>
|
||||||
|
<Input placeholder="请输入配件名称" />
|
||||||
|
</Form.Item>
|
||||||
|
|
||||||
|
<Form.List name={[accessoryField.name, "tunings"]}>
|
||||||
|
{(tuningFields, { add: addTuning, remove: removeTuning }) => (
|
||||||
|
<div className="flex flex-col gap-3">
|
||||||
|
{tuningFields.map((tuningField) => (
|
||||||
|
<Space key={tuningField.key} align="start" className="w-full" wrap>
|
||||||
|
<Form.Item
|
||||||
|
name={[tuningField.name, "tuningName"]}
|
||||||
|
label="精校属性"
|
||||||
|
rules={[{ required: true, message: "请选择或输入精校属性" }]}>
|
||||||
|
<AutoComplete
|
||||||
|
options={tuningOptions}
|
||||||
|
placeholder="例如:后坐控制"
|
||||||
|
className="w-44"
|
||||||
|
/>
|
||||||
|
</Form.Item>
|
||||||
|
<Form.Item
|
||||||
|
name={[tuningField.name, "tuningValue"]}
|
||||||
|
label="精校值"
|
||||||
|
rules={[{ required: true, message: "请输入精校值" }]}>
|
||||||
|
<InputNumber className="w-32" placeholder="例如:0.35" />
|
||||||
|
</Form.Item>
|
||||||
|
<Button
|
||||||
|
type="link"
|
||||||
|
danger
|
||||||
|
className="mt-8"
|
||||||
|
onClick={() => removeTuning(tuningField.name)}>
|
||||||
|
删除
|
||||||
|
</Button>
|
||||||
|
</Space>
|
||||||
|
))}
|
||||||
|
<Button
|
||||||
|
type="dashed"
|
||||||
|
disabled={tuningFields.length >= 2}
|
||||||
|
onClick={() => addTuning({ tuningName: "", tuningValue: 0 })}>
|
||||||
|
添加精校
|
||||||
|
</Button>
|
||||||
|
</div>
|
||||||
|
)}
|
||||||
|
</Form.List>
|
||||||
|
</Card>
|
||||||
|
))}
|
||||||
|
<Button
|
||||||
|
variant="solid"
|
||||||
|
color="lime"
|
||||||
|
onClick={() => addAccessory({ slotName: "", accessoryName: "", tunings: [] })}>
|
||||||
|
添加配件
|
||||||
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
)}
|
||||||
</div>
|
</Form.List>
|
||||||
</Form>
|
</Form>
|
||||||
);
|
)
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
[
|
[
|
||||||
"枪口",
|
"枪口",
|
||||||
"枪管",
|
"枪管",
|
||||||
"导轨脚架",
|
|
||||||
"贴片",
|
"贴片",
|
||||||
"瞄准镜",
|
"瞄准镜",
|
||||||
"战术设备",
|
"战术设备",
|
||||||
@@ -10,10 +9,11 @@
|
|||||||
"枪托",
|
"枪托",
|
||||||
"托腮板",
|
"托腮板",
|
||||||
"枪托套件",
|
"枪托套件",
|
||||||
|
"导轨脚架",
|
||||||
"前握把",
|
"前握把",
|
||||||
"弹匣",
|
|
||||||
"弹匣座",
|
|
||||||
"后握把",
|
"后握把",
|
||||||
"后握贴片",
|
"后握贴片",
|
||||||
"握把座"
|
"握把座",
|
||||||
|
"弹匣",
|
||||||
|
"弹匣座"
|
||||||
]
|
]
|
||||||
|
|||||||
@@ -201,22 +201,4 @@ body {
|
|||||||
|
|
||||||
.ant-collapse-body{
|
.ant-collapse-body{
|
||||||
background: #1e1e1e;
|
background: #1e1e1e;
|
||||||
}
|
|
||||||
|
|
||||||
.ant-modal-container{
|
|
||||||
width: 620px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.hide-scrollbar {
|
|
||||||
max-height: 500px; /* 限制高度,触发滚动 */
|
|
||||||
overflow-y: auto; /* 允许滚动 */
|
|
||||||
|
|
||||||
/* 隐藏滚动条(Firefox 和 IE) */
|
|
||||||
scrollbar-width: none; /* Firefox */
|
|
||||||
-ms-overflow-style: none; /* IE/Edge */
|
|
||||||
}
|
|
||||||
|
|
||||||
/* 隐藏滚动条(Chrome/Safari/Edge 新版) */
|
|
||||||
.hide-scrollbar::-webkit-scrollbar {
|
|
||||||
display: none;
|
|
||||||
}
|
}
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
import { Outlet, Link, NavLink, useNavigate } from "react-router-dom"
|
import { Outlet, Link, NavLink } from "react-router-dom"
|
||||||
import { useEffect, useMemo } from "react"
|
import { useMemo } from "react"
|
||||||
import dayjs from "dayjs"
|
import dayjs from "dayjs"
|
||||||
import { Dropdown } from "antd"
|
import { Dropdown } from "antd"
|
||||||
import {
|
import {
|
||||||
@@ -12,31 +12,17 @@ import { AuthApi } from "@/api"
|
|||||||
import { useAppDispatch, useAppSelector } from "@/hooks/store"
|
import { useAppDispatch, useAppSelector } from "@/hooks/store"
|
||||||
import { clearCurrentUser } from "@/store/auth-slice"
|
import { clearCurrentUser } from "@/store/auth-slice"
|
||||||
import { useState } from "react"
|
import { useState } from "react"
|
||||||
import { clearAutoLogout, scheduleAutoLogout } from "@/utils/autoLogout";
|
|
||||||
import DisplayBoard from '@/components/DisplayBoard';
|
|
||||||
/**
|
/**
|
||||||
* Main application component that serves as the root layout.
|
* Main application component that serves as the root layout.
|
||||||
* Uses React Router's Outlet to render child routes.
|
* Uses React Router's Outlet to render child routes.
|
||||||
*/
|
*/
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
export default function HeroLayout() {
|
export default function HeroLayout() {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const today = useMemo(() => dayjs(), [])
|
const today = useMemo(() => dayjs(), [])
|
||||||
const user = useAppSelector((state) => state.auth.user)
|
const user = useAppSelector((state) => state.auth.user)
|
||||||
const dispatch = useAppDispatch()
|
const dispatch = useAppDispatch()
|
||||||
const [isDropdownOpen, setIsDropdownOpen] = useState(false)
|
const [isDropdownOpen, setIsDropdownOpen] = useState(false)
|
||||||
|
|
||||||
// 统一登出函数:清除定时器、清除 Redux、跳转登录页
|
|
||||||
const performLogout = () => {
|
|
||||||
clearAutoLogout();
|
|
||||||
dispatch(clearCurrentUser());
|
|
||||||
};
|
|
||||||
|
|
||||||
async function handleLogout() {
|
async function handleLogout() {
|
||||||
try {
|
try {
|
||||||
await AuthApi.logout()
|
await AuthApi.logout()
|
||||||
@@ -45,24 +31,8 @@ export default function HeroLayout() {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
if (user?.expiration) {
|
|
||||||
const localDate = new Date(user.expiration.replace(' ', 'T'));
|
|
||||||
const targetTimestamp = localDate.getTime();
|
|
||||||
if (targetTimestamp > Date.now()) {
|
|
||||||
console.log("未到自动登出时间");
|
|
||||||
|
|
||||||
scheduleAutoLogout(targetTimestamp, performLogout);
|
|
||||||
} else {
|
|
||||||
// 已过期立即登出
|
|
||||||
performLogout();
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
clearAutoLogout();
|
|
||||||
}
|
|
||||||
}, [user]);
|
|
||||||
return (
|
return (
|
||||||
<div className="bg-[#1b252a] flex flex-col min-h-screen">
|
<div className="bg-[#1b252a] ">
|
||||||
{/* Navigation Header */}
|
{/* Navigation Header */}
|
||||||
<header className="bg-[#0b0f14] shadow-sm border-b">
|
<header className="bg-[#0b0f14] shadow-sm border-b">
|
||||||
<div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-10 h-full">
|
<div className="max-w-screen-2xl mx-auto px-4 sm:px-6 lg:px-10 h-full">
|
||||||
@@ -70,14 +40,12 @@ export default function HeroLayout() {
|
|||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<h1 className="text-xl font-semibold text-white">《三角洲》指南</h1>
|
<h1 className="text-xl font-semibold text-white">《三角洲》指南</h1>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<DisplayBoard />
|
|
||||||
</div>
|
|
||||||
<nav className="flex h-full">
|
<nav className="flex h-full">
|
||||||
<NavLink
|
<NavLink
|
||||||
to="/firearms"
|
to="/firearms"
|
||||||
className={({ isActive }) =>
|
className={({ isActive }) =>
|
||||||
`nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${isActive ? "active" : ""
|
`nav-item inline-flex items-center px-10 h-full text-base font-medium transition-all duration-200 ${
|
||||||
|
isActive ? "active" : ""
|
||||||
} text-gray-500 hover:text-white`
|
} text-gray-500 hover:text-white`
|
||||||
}>
|
}>
|
||||||
武器列表
|
武器列表
|
||||||
@@ -94,11 +62,10 @@ export default function HeroLayout() {
|
|||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</header>
|
</header>
|
||||||
|
|
||||||
{/* Main Content Area */}
|
{/* Main Content Area */}
|
||||||
<main className="flex-1 w-full max-w-screen-2xl mx-auto py-6 sm:px-6 lg:px-10">
|
<main className=" max-w-screen-2xl mx-auto py-6 sm:px-6 lg:px-10">
|
||||||
<div className="px-4 py-6 sm:px-0">
|
<div className="px-4 py-6 sm:px-0">
|
||||||
<Outlet />
|
<Outlet />
|
||||||
</div>
|
</div>
|
||||||
@@ -178,7 +145,7 @@ export default function HeroLayout() {
|
|||||||
},
|
},
|
||||||
],
|
],
|
||||||
}}>
|
}}>
|
||||||
<span className="inline-flex items-center px-10 h-full text-base font-medium text-gray-500 hover:text-white cursor-pointer">
|
<span className="nav-item inline-flex items-center px-10 h-full text-base font-medium text-gray-500 hover:text-white cursor-pointer">
|
||||||
{user.username}
|
{user.username}
|
||||||
</span>
|
</span>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
@@ -194,7 +161,7 @@ export default function HeroLayout() {
|
|||||||
|
|
||||||
<div className="border-t border-gray-800 my-6" />
|
<div className="border-t border-gray-800 my-6" />
|
||||||
<div className="text-center text-xs text-gray-500">
|
<div className="text-center text-xs text-gray-500">
|
||||||
<p>© 2024-{today.year()} OnixByte。湘ICP备2026000274号-1</p>
|
<p>© 2024-{today.year()} Zihlu Wang 和 OnixByte。使用 React 与 TypeScript 构建。</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
|
|||||||
+296
-356
@@ -1,15 +1,17 @@
|
|||||||
import { useCallback, useEffect, useState, useMemo } from "react"
|
import { useCallback, useEffect, useState } from "react"
|
||||||
|
import { Link } from "react-router-dom"
|
||||||
import { FirearmApi } from "@/api"
|
import { FirearmApi } from "@/api"
|
||||||
import FirearmCreateModal from "@/components/firearm-create-modal"
|
import FirearmCreateModal from "@/components/firearm-create-modal"
|
||||||
import FirearmEditModal from "@/components/firearm-edit-modal"
|
import FirearmEditModal from "@/components/firearm-edit-modal"
|
||||||
import ModCodes from "@/components/mod-codes"
|
import ModCodes from "@/components/mod-codes"
|
||||||
import { useAppSelector } from "@/hooks/store"
|
import { useAppSelector } from "@/hooks/store"
|
||||||
import { Firearm, FirearmType } from "@/types"
|
import { Firearm, FirearmType } from "@/types"
|
||||||
import { Button, Card, Col, Pagination, Popconfirm, Row, Select, Spin, Typography, App, Input, AutoComplete } from "antd"
|
import { Button, Card, Col, Pagination, Popconfirm, Row, Select, Tag, Typography, App } from "antd"
|
||||||
import { ConfigProvider, theme } from 'antd';
|
import { ConfigProvider, theme } from 'antd';
|
||||||
import type { AutoCompleteProps } from 'antd';
|
import type { CollapseProps } from 'antd';
|
||||||
import { Collapse } from 'antd';
|
import { Collapse } from 'antd';
|
||||||
|
|
||||||
|
|
||||||
const firearmTypeText: Record<FirearmType, string> = {
|
const firearmTypeText: Record<FirearmType, string> = {
|
||||||
RIFLE: "步枪",
|
RIFLE: "步枪",
|
||||||
SUB_MACHINE_GUN: "冲锋枪",
|
SUB_MACHINE_GUN: "冲锋枪",
|
||||||
@@ -21,8 +23,12 @@ const firearmTypeText: Record<FirearmType, string> = {
|
|||||||
SPECIAL: "特殊",
|
SPECIAL: "特殊",
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
const darkTheme = {
|
const darkTheme = {
|
||||||
algorithm: theme.darkAlgorithm,
|
algorithm: theme.darkAlgorithm,
|
||||||
|
|
||||||
|
// token: { colorPrimary: '#00b96b' },
|
||||||
};
|
};
|
||||||
|
|
||||||
const allTypeValue = "ALL"
|
const allTypeValue = "ALL"
|
||||||
@@ -39,76 +45,36 @@ export default function FirearmsPage() {
|
|||||||
const [typeFilter, setTypeFilter] = useState<FirearmTypeFilter>(allTypeValue)
|
const [typeFilter, setTypeFilter] = useState<FirearmTypeFilter>(allTypeValue)
|
||||||
const [firearms, setFirearms] = useState<Firearm[]>([])
|
const [firearms, setFirearms] = useState<Firearm[]>([])
|
||||||
const [total, setTotal] = useState<number>(0)
|
const [total, setTotal] = useState<number>(0)
|
||||||
|
|
||||||
const [createModalOpen, setCreateModalOpen] = useState(false)
|
const [createModalOpen, setCreateModalOpen] = useState(false)
|
||||||
const [editingFirearm, setEditingFirearm] = useState<Firearm | null>(null)
|
const [editingFirearm, setEditingFirearm] = useState<Firearm | null>(null)
|
||||||
const [deletingId, setDeletingId] = useState<number | null>(null)
|
const [deletingId, setDeletingId] = useState<number | null>(null)
|
||||||
const [allOptions, setAllOptions] = useState<AutoCompleteProps['options']>([]);
|
|
||||||
const [filteredOptions, setFilteredOptions] = useState<AutoCompleteProps['options']>([]);
|
|
||||||
const [loading, setLoading] = useState(false);
|
|
||||||
|
|
||||||
const loadFirearms = useCallback(async () => {
|
const loadFirearms = useCallback(async () => {
|
||||||
setLoading(true);
|
const pagedData = await FirearmApi.getFirearms({
|
||||||
const start = Date.now();
|
page: page - 1,
|
||||||
|
size: 12,
|
||||||
try {
|
|
||||||
const pagedData = await FirearmApi.getFirearms({
|
|
||||||
page: page - 1,
|
|
||||||
size: 8,
|
|
||||||
sortBy: "id",
|
|
||||||
direction: "ASC",
|
|
||||||
type: typeFilter === allTypeValue ? undefined : typeFilter,
|
|
||||||
});
|
|
||||||
setFirearms(pagedData.items);
|
|
||||||
setTotal(pagedData.totalElements);
|
|
||||||
} catch (error) {
|
|
||||||
// 可在此处理错误,比如 message.error
|
|
||||||
} finally {
|
|
||||||
const elapsed = Date.now() - start;
|
|
||||||
if (elapsed < 500) {
|
|
||||||
await new Promise(resolve => setTimeout(resolve, 500 - elapsed));
|
|
||||||
}
|
|
||||||
setLoading(false);
|
|
||||||
}
|
|
||||||
}, [page, typeFilter]);
|
|
||||||
|
|
||||||
const GetFirearmName = useCallback(async () => {
|
|
||||||
const Firearms = await FirearmApi.getFirearms({
|
|
||||||
page: 0, // 从第一页开始
|
|
||||||
size: 100, // 足够大的值,或者根据实际总数调整
|
|
||||||
sortBy: "id",
|
sortBy: "id",
|
||||||
direction: "ASC",
|
direction: "ASC",
|
||||||
type: undefined, // 不按类型过滤,获取全部
|
type: typeFilter === allTypeValue ? undefined : typeFilter,
|
||||||
});
|
})
|
||||||
const formatted = Firearms.items.map(item => ({
|
setFirearms(pagedData.items)
|
||||||
label: item.name,
|
setTotal(pagedData.totalElements)
|
||||||
value: item.name, // 用名称作为 value
|
}, [page, typeFilter])
|
||||||
data: item,
|
|
||||||
}));
|
const [expandedId, setExpandedId] = useState<number | null>(null);
|
||||||
setAllOptions(formatted);
|
|
||||||
setFilteredOptions(formatted);
|
|
||||||
}, []);
|
|
||||||
const handleSearch = (searchText: string) => {
|
|
||||||
if (!searchText) {
|
|
||||||
setFilteredOptions(allOptions);
|
|
||||||
void loadFirearms()
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
const lower = searchText.toLowerCase();
|
|
||||||
const filtered = allOptions?.filter(opt =>
|
|
||||||
opt?.label?.toString().toLowerCase().includes(lower)
|
|
||||||
);
|
|
||||||
setFilteredOptions(filtered);
|
|
||||||
};
|
|
||||||
|
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
void loadFirearms()
|
void loadFirearms()
|
||||||
void GetFirearmName()
|
}, [loadFirearms])
|
||||||
}, [loadFirearms, GetFirearmName])
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
window.scrollTo({ top: 0, behavior: 'smooth' });
|
window.scrollTo({ top: 0, behavior: 'smooth' });
|
||||||
}, [page]);
|
}, [page]);
|
||||||
|
|
||||||
|
|
||||||
async function handleDelete(firearm: Firearm) {
|
async function handleDelete(firearm: Firearm) {
|
||||||
setDeletingId(firearm.id)
|
setDeletingId(firearm.id)
|
||||||
try {
|
try {
|
||||||
@@ -136,334 +102,308 @@ export default function FirearmsPage() {
|
|||||||
</Button>
|
</Button>
|
||||||
)}
|
)}
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-col sm:flex-row gap-3 sm:items-center">
|
<Select<FirearmTypeFilter>
|
||||||
<Select<FirearmTypeFilter>
|
className="w-full sm:w-64"
|
||||||
className="w-full sm:w-64"
|
value={typeFilter}
|
||||||
value={typeFilter}
|
options={[
|
||||||
options={[
|
{ value: allTypeValue, label: "全部类型" },
|
||||||
{ value: allTypeValue, label: "全部类型" },
|
...Object.entries(firearmTypeText).map(([value, label]) => ({
|
||||||
...Object.entries(firearmTypeText).map(([value, label]) => ({
|
value,
|
||||||
value,
|
label,
|
||||||
label,
|
})),
|
||||||
})),
|
]}
|
||||||
]}
|
onChange={(nextType) => {
|
||||||
onChange={(nextType) => {
|
setPage(1)
|
||||||
setPage(1)
|
setTypeFilter(nextType)
|
||||||
setTypeFilter(nextType)
|
}}
|
||||||
}}
|
/>
|
||||||
/>
|
|
||||||
<AutoComplete
|
|
||||||
style={{ width: 240 }}
|
|
||||||
options={filteredOptions} // 使用过滤后的选项
|
|
||||||
placeholder="搜索武器名称"
|
|
||||||
showSearch={{ onSearch: handleSearch }} // 输入时触发过滤
|
|
||||||
onSelect={async (value, option) => {
|
|
||||||
const selected = option.data as Firearm;
|
|
||||||
console.log('选中 ID:', selected.id);
|
|
||||||
console.log('选中名称:', selected.name);
|
|
||||||
const pagedData = await FirearmApi.getFirearm(selected.id)
|
|
||||||
const newArray = [];
|
|
||||||
newArray.push(pagedData)
|
|
||||||
setFirearms(newArray)
|
|
||||||
setTotal(1)
|
|
||||||
}}
|
|
||||||
allowClear
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div className="mb-6">
|
<div className="mb-6">
|
||||||
{loading ? (<div className="flex justify-center items-center h-64">
|
<Row gutter={[16, 16]}>
|
||||||
<Spin size="large" tip="加载中..." />
|
{firearms.map((firearm) => (
|
||||||
</div>) : (
|
<Col key={firearm.id} xs={24} md={24} lg={24}>
|
||||||
<Row gutter={[16, 16]}>
|
|
||||||
{firearms.map((firearm) => (
|
|
||||||
<Col key={firearm.id} xs={24} md={24} lg={24}>
|
|
||||||
|
|
||||||
<Card
|
<Card
|
||||||
className="hex-bg border-5px-#142c38"
|
className="hex-bg border-5px-#142c38"
|
||||||
title={
|
extra={
|
||||||
<div style={{
|
user ? (
|
||||||
display: 'flex',
|
<div className="flex items-center gap-1">
|
||||||
alignItems: 'center',
|
<Button type="link" size="small" onClick={() => setEditingFirearm(firearm)}>
|
||||||
gap: '12px',
|
编辑
|
||||||
width: '100%'
|
</Button>
|
||||||
}}>
|
<Popconfirm
|
||||||
<span style={{
|
title="确认删除武器"
|
||||||
display: 'inline-block',
|
description={`确定要删除 ${firearm.name} 吗?该操作不可撤销。`}
|
||||||
color: '#10E28C',
|
okText="删除"
|
||||||
|
cancelText="取消"
|
||||||
|
okButtonProps={{ danger: true, loading: deletingId === firearm.id }}
|
||||||
|
onConfirm={() => handleDelete(firearm)}>
|
||||||
|
<Button type="link" danger size="small" loading={deletingId === firearm.id}>
|
||||||
|
删除
|
||||||
|
</Button>
|
||||||
|
</Popconfirm>
|
||||||
|
</div>
|
||||||
|
) : null
|
||||||
|
}
|
||||||
|
variant="outlined"
|
||||||
|
style={{
|
||||||
|
height: '100%', display: 'flex', flexDirection: 'column'
|
||||||
|
}}
|
||||||
|
styles={{
|
||||||
|
root: {
|
||||||
|
border: '1px solid #313131'
|
||||||
|
},
|
||||||
|
header: {
|
||||||
|
borderBottom: '1px solid #303030',
|
||||||
|
},
|
||||||
|
body: {
|
||||||
|
flex: 1,
|
||||||
|
overflow: 'auto',
|
||||||
|
padding: '12px',
|
||||||
|
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
flexShrink: 0,
|
||||||
|
background: '#1e1e1e',
|
||||||
|
display: 'flex'
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
actions={[
|
||||||
|
<div>
|
||||||
|
<Collapse
|
||||||
|
expandIcon={() => null}
|
||||||
|
styles={
|
||||||
|
{
|
||||||
|
root: {
|
||||||
|
background: '#1e1e1e',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
items={[{
|
||||||
|
key: '1',
|
||||||
|
label: (
|
||||||
|
<Button
|
||||||
|
variant="outlined"
|
||||||
|
styles={{
|
||||||
|
root: {
|
||||||
|
color: '#10E28C',
|
||||||
|
border: '1px solid #10E28C',
|
||||||
|
background: '#16343b96',
|
||||||
|
width: '20%',
|
||||||
|
}
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
查看改枪码
|
||||||
|
</Button>
|
||||||
|
),
|
||||||
|
children: <ModCodes firearmId={String(firearm.id)} />
|
||||||
|
}]}
|
||||||
|
/>
|
||||||
|
</div>,
|
||||||
|
]}>
|
||||||
|
<div className="flex flex-col gap-3">
|
||||||
|
<div className="lmr-container">
|
||||||
|
<div className="lmr-left">
|
||||||
|
<div style={{
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
gap: '12px',
|
||||||
|
width: '100%'
|
||||||
|
}}>
|
||||||
|
<span style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
backgroundColor: '#555555',
|
||||||
|
color: 'white',
|
||||||
|
padding: '4px 12px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
fontSize: '14px',
|
||||||
|
fontWeight: '500',
|
||||||
|
letterSpacing: '0.5px'
|
||||||
|
}}>
|
||||||
|
{firearm.name}
|
||||||
|
</span>
|
||||||
|
<span className="flex items-center justify-between"
|
||||||
|
style={{
|
||||||
|
display: 'inline-block',
|
||||||
|
backgroundColor: '#2d4f5796',
|
||||||
|
color: 'white',
|
||||||
|
padding: '4px 12px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
fontSize: '14px',
|
||||||
|
fontWeight: '500',
|
||||||
|
letterSpacing: '0.5px'
|
||||||
|
}}>
|
||||||
|
{firearmTypeText[firearm.type]}
|
||||||
|
|
||||||
|
</span></div>
|
||||||
|
</div>
|
||||||
|
<div className="lmr-middle">
|
||||||
|
<div style={{
|
||||||
|
color: 'white',
|
||||||
padding: '4px 12px',
|
padding: '4px 12px',
|
||||||
borderRadius: '4px',
|
borderRadius: '4px',
|
||||||
fontSize: '18px',
|
fontSize: '14px',
|
||||||
fontWeight: '500',
|
fontWeight: '500',
|
||||||
letterSpacing: '0.5px'
|
letterSpacing: '0.5px'
|
||||||
}}>
|
}}>
|
||||||
{firearm.name}
|
|
||||||
</span>
|
|
||||||
<span className="flex items-center justify-between"
|
|
||||||
style={{
|
|
||||||
display: 'inline-block',
|
|
||||||
backgroundColor: '#2d4f5796',
|
|
||||||
color: 'white',
|
|
||||||
padding: '4px 12px',
|
|
||||||
borderRadius: '4px',
|
|
||||||
fontSize: '14px',
|
|
||||||
fontWeight: '500',
|
|
||||||
letterSpacing: '0.5px'
|
|
||||||
}}>
|
|
||||||
{firearmTypeText[firearm.type]}
|
|
||||||
|
|
||||||
</span></div>
|
|
||||||
}
|
|
||||||
extra={
|
|
||||||
|
|
||||||
user ? (
|
|
||||||
<div className="flex items-center gap-1">
|
|
||||||
<Button type="link" size="small" onClick={() => setEditingFirearm(firearm)}>
|
|
||||||
编辑
|
|
||||||
</Button>
|
|
||||||
<Popconfirm
|
|
||||||
title="确认删除武器"
|
|
||||||
description={`确定要删除 ${firearm.name} 吗?该操作不可撤销。`}
|
|
||||||
okText="删除"
|
|
||||||
cancelText="取消"
|
|
||||||
okButtonProps={{ danger: true, loading: deletingId === firearm.id }}
|
|
||||||
onConfirm={() => handleDelete(firearm)}>
|
|
||||||
<Button type="link" danger size="small" loading={deletingId === firearm.id}>
|
|
||||||
删除
|
|
||||||
</Button>
|
|
||||||
</Popconfirm>
|
|
||||||
</div>
|
|
||||||
) : null
|
|
||||||
}
|
|
||||||
variant="outlined"
|
|
||||||
style={{
|
|
||||||
height: '100%', display: 'flex', flexDirection: 'column'
|
|
||||||
}}
|
|
||||||
styles={{
|
|
||||||
root: {
|
|
||||||
border: '1px solid #313131'
|
|
||||||
},
|
|
||||||
header: {
|
|
||||||
borderBottom: '1px solid #303030',
|
|
||||||
},
|
|
||||||
body: {
|
|
||||||
flex: 1,
|
|
||||||
overflow: 'auto',
|
|
||||||
padding: '12px',
|
|
||||||
|
|
||||||
},
|
|
||||||
actions: {
|
|
||||||
flexShrink: 0,
|
|
||||||
background: '#1e1e1e',
|
|
||||||
display: 'flex'
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
actions={[
|
|
||||||
<div>
|
|
||||||
<Collapse
|
|
||||||
|
|
||||||
expandIcon={() => null}
|
|
||||||
styles={
|
|
||||||
{
|
|
||||||
root: {
|
|
||||||
background: '#1e1e1e',
|
|
||||||
width: '100%'
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
items={[{
|
|
||||||
key: '1',
|
|
||||||
label: (
|
|
||||||
<Button
|
|
||||||
variant="outlined"
|
|
||||||
styles={{
|
|
||||||
root: {
|
|
||||||
color: '#10E28C',
|
|
||||||
border: '1px solid #10E28C',
|
|
||||||
background: '#16343b96',
|
|
||||||
width: '20%',
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
查看改枪码
|
|
||||||
</Button>
|
|
||||||
),
|
|
||||||
children: <ModCodes firearmId={String(firearm.id)} />
|
|
||||||
}]}
|
|
||||||
/>
|
|
||||||
</div>,
|
|
||||||
]}>
|
|
||||||
<div className="flex flex-col gap-3">
|
|
||||||
<div className="lmr-container">
|
|
||||||
<div className="lmr-left">
|
|
||||||
</div>
|
|
||||||
<div className="lmr-middle">
|
|
||||||
<div style={{
|
<div style={{
|
||||||
color: 'white',
|
display: 'grid',
|
||||||
padding: '4px 12px',
|
gridTemplateColumns: 'repeat(auto-fit, minmax(100px, 1fr))', // 最小宽度160px
|
||||||
borderRadius: '4px',
|
gap: '12px',
|
||||||
fontSize: '14px',
|
|
||||||
fontWeight: '500',
|
|
||||||
letterSpacing: '0.5px'
|
|
||||||
}}>
|
}}>
|
||||||
|
{/* 武器输出等级 */}
|
||||||
<div style={{
|
<div style={{
|
||||||
display: 'grid',
|
border: '2px solid #10E28C',
|
||||||
gridTemplateColumns: 'repeat(auto-fit, minmax(100px, 1fr))', // 最小宽度160px
|
backgroundColor: '#16343b96',
|
||||||
gap: '12px',
|
padding: '12px 16px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
textAlign: 'center'
|
||||||
}}>
|
}}>
|
||||||
{/* 武器输出等级 */}
|
|
||||||
<div style={{
|
<div style={{
|
||||||
border: '2px solid #10E28C',
|
padding: '4px 0px',
|
||||||
backgroundColor: '#16343b96',
|
borderRadius: '4px',
|
||||||
padding: '12px 16px',
|
color: '#10E28C',
|
||||||
borderRadius: '8px',
|
fontSize: '13px',
|
||||||
|
fontWeight: 500,
|
||||||
|
marginBottom: '6px',
|
||||||
|
whiteSpace: 'nowrap',
|
||||||
textAlign: 'center'
|
textAlign: 'center'
|
||||||
}}>
|
}}>
|
||||||
<div style={{
|
武器输出等级
|
||||||
padding: '4px 0px',
|
|
||||||
borderRadius: '4px',
|
|
||||||
color: '#10E28C',
|
|
||||||
fontSize: '13px',
|
|
||||||
fontWeight: 500,
|
|
||||||
marginBottom: '6px',
|
|
||||||
whiteSpace: 'nowrap',
|
|
||||||
textAlign: 'center'
|
|
||||||
}}>
|
|
||||||
武器输出等级
|
|
||||||
</div>
|
|
||||||
<div style={{
|
|
||||||
fontSize: '16px',
|
|
||||||
fontWeight: 600,
|
|
||||||
color: '#ffffff'
|
|
||||||
}}>
|
|
||||||
{firearm.level}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 子弹口径 */}
|
|
||||||
<div style={{
|
<div style={{
|
||||||
border: '2px solid #10E28C',
|
fontSize: '16px',
|
||||||
backgroundColor: '#16343b96',
|
fontWeight: 600,
|
||||||
padding: '12px 16px',
|
color: '#ffffff'
|
||||||
borderRadius: '8px',
|
|
||||||
textAlign: 'center'
|
|
||||||
}}>
|
}}>
|
||||||
<div style={{
|
{firearm.level}
|
||||||
padding: '4px 12px',
|
|
||||||
borderRadius: '4px',
|
|
||||||
color: '#10E28C',
|
|
||||||
fontSize: '13px',
|
|
||||||
fontWeight: 500,
|
|
||||||
marginBottom: '6px',
|
|
||||||
whiteSpace: 'nowrap'
|
|
||||||
}}>
|
|
||||||
子弹口径
|
|
||||||
</div>
|
|
||||||
<div style={{
|
|
||||||
fontSize: '16px',
|
|
||||||
fontWeight: 600,
|
|
||||||
color: '#ffffff'
|
|
||||||
}}>
|
|
||||||
{firearm.calibre}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 每秒甲伤 */}
|
|
||||||
<div style={{
|
|
||||||
border: '2px solid #10E28C',
|
|
||||||
backgroundColor: '#16343b96',
|
|
||||||
padding: '12px 16px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
textAlign: 'center'
|
|
||||||
}}>
|
|
||||||
<div style={{
|
|
||||||
padding: '4px 12px',
|
|
||||||
borderRadius: '4px',
|
|
||||||
color: '#10E28C',
|
|
||||||
fontSize: '13px',
|
|
||||||
fontWeight: 500,
|
|
||||||
marginBottom: '6px',
|
|
||||||
whiteSpace: 'nowrap'
|
|
||||||
}}>
|
|
||||||
每秒甲伤
|
|
||||||
</div>
|
|
||||||
<div style={{
|
|
||||||
fontSize: '16px',
|
|
||||||
fontWeight: 600,
|
|
||||||
color: '#ffffff'
|
|
||||||
}}>
|
|
||||||
{asDps(firearm.fireRate, firearm.armourDamage)}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* 每秒肉伤 */}
|
|
||||||
<div style={{
|
|
||||||
border: '2px solid #10E28C',
|
|
||||||
backgroundColor: '#16343b96',
|
|
||||||
padding: '12px 16px',
|
|
||||||
borderRadius: '8px',
|
|
||||||
textAlign: 'center'
|
|
||||||
}}>
|
|
||||||
<div style={{
|
|
||||||
padding: '4px 12px',
|
|
||||||
borderRadius: '4px',
|
|
||||||
color: '#10E28C',
|
|
||||||
fontSize: '13px',
|
|
||||||
fontWeight: 500,
|
|
||||||
marginBottom: '6px',
|
|
||||||
whiteSpace: 'nowrap'
|
|
||||||
}}>
|
|
||||||
每秒肉伤
|
|
||||||
</div>
|
|
||||||
<div style={{
|
|
||||||
fontSize: '16px',
|
|
||||||
fontWeight: 600,
|
|
||||||
color: '#ffffff'
|
|
||||||
}}>
|
|
||||||
{asDps(firearm.fireRate, firearm.bodyDamage)}
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* 子弹口径 */}
|
||||||
|
<div style={{
|
||||||
|
border: '2px solid #10E28C',
|
||||||
|
backgroundColor: '#16343b96',
|
||||||
|
padding: '12px 16px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
textAlign: 'center'
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
padding: '4px 12px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
color: '#10E28C',
|
||||||
|
fontSize: '13px',
|
||||||
|
fontWeight: 500,
|
||||||
|
marginBottom: '6px',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
}}>
|
||||||
|
子弹口径
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
fontSize: '16px',
|
||||||
|
fontWeight: 600,
|
||||||
|
color: '#ffffff'
|
||||||
|
}}>
|
||||||
|
{firearm.calibre}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 每秒甲伤 */}
|
||||||
|
<div style={{
|
||||||
|
border: '2px solid #10E28C',
|
||||||
|
backgroundColor: '#16343b96',
|
||||||
|
padding: '12px 16px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
textAlign: 'center'
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
padding: '4px 12px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
color: '#10E28C',
|
||||||
|
fontSize: '13px',
|
||||||
|
fontWeight: 500,
|
||||||
|
marginBottom: '6px',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
}}>
|
||||||
|
每秒甲伤
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
fontSize: '16px',
|
||||||
|
fontWeight: 600,
|
||||||
|
color: '#ffffff'
|
||||||
|
}}>
|
||||||
|
{asDps(firearm.fireRate, firearm.armourDamage)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* 每秒肉伤 */}
|
||||||
|
<div style={{
|
||||||
|
border: '2px solid #10E28C',
|
||||||
|
backgroundColor: '#16343b96',
|
||||||
|
padding: '12px 16px',
|
||||||
|
borderRadius: '8px',
|
||||||
|
textAlign: 'center'
|
||||||
|
}}>
|
||||||
|
<div style={{
|
||||||
|
padding: '4px 12px',
|
||||||
|
borderRadius: '4px',
|
||||||
|
color: '#10E28C',
|
||||||
|
fontSize: '13px',
|
||||||
|
fontWeight: 500,
|
||||||
|
marginBottom: '6px',
|
||||||
|
whiteSpace: 'nowrap'
|
||||||
|
}}>
|
||||||
|
每秒肉伤
|
||||||
|
</div>
|
||||||
|
<div style={{
|
||||||
|
fontSize: '16px',
|
||||||
|
fontWeight: 600,
|
||||||
|
color: '#ffffff'
|
||||||
|
}}>
|
||||||
|
{asDps(firearm.fireRate, firearm.bodyDamage)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div className="lmr-right">
|
|
||||||
<Typography.Paragraph
|
|
||||||
style={{ marginBottom: 0 }}
|
|
||||||
type="secondary"
|
|
||||||
ellipsis={{
|
|
||||||
rows: 3,
|
|
||||||
tooltip: firearm.review
|
|
||||||
? {
|
|
||||||
title: <div style={{ whiteSpace: "pre-line" }}>{firearm.review}</div>,
|
|
||||||
placement: "topLeft",
|
|
||||||
}
|
|
||||||
: false,
|
|
||||||
}}
|
|
||||||
className="whitespace-pre-line">
|
|
||||||
{firearm.review || "暂无描述"}
|
|
||||||
</Typography.Paragraph>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div className="lmr-right">
|
||||||
|
<Typography.Paragraph
|
||||||
|
style={{ marginBottom: 0 }}
|
||||||
|
type="secondary"
|
||||||
|
ellipsis={{
|
||||||
|
rows: 3,
|
||||||
|
tooltip: firearm.review
|
||||||
|
? {
|
||||||
|
title: <div style={{ whiteSpace: "pre-line" }}>{firearm.review}</div>,
|
||||||
|
placement: "topLeft",
|
||||||
|
}
|
||||||
|
: false,
|
||||||
|
}}
|
||||||
|
className="whitespace-pre-line">
|
||||||
|
{firearm.review || "暂无描述"}
|
||||||
|
</Typography.Paragraph>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Card>
|
|
||||||
</Col>
|
</div>
|
||||||
))}
|
</Card>
|
||||||
{firearms.length === 0 && (
|
</Col>
|
||||||
<Col span={24}>
|
))}
|
||||||
<Card>
|
{firearms.length === 0 && (
|
||||||
<Typography.Text type="secondary">暂无武器数据</Typography.Text>
|
<Col span={24}>
|
||||||
</Card>
|
<Card>
|
||||||
</Col>
|
<Typography.Text type="secondary">暂无武器数据</Typography.Text>
|
||||||
)}
|
</Card>
|
||||||
</Row>)}
|
</Col>
|
||||||
|
)}
|
||||||
|
</Row>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex justify-end">
|
<div className="flex justify-end">
|
||||||
<Pagination
|
<Pagination
|
||||||
align="end"
|
align="end"
|
||||||
current={page}
|
current={page}
|
||||||
pageSize={8}
|
pageSize={12}
|
||||||
total={total}
|
total={total}
|
||||||
onChange={(nextPage) => {
|
onChange={(nextPage) => {
|
||||||
setPage(nextPage)
|
setPage(nextPage)
|
||||||
|
|||||||
@@ -5,7 +5,6 @@ import { AuthApi } from "@/api"
|
|||||||
import { useAppDispatch } from "@/hooks/store"
|
import { useAppDispatch } from "@/hooks/store"
|
||||||
import { setCurrentUser } from "@/store/auth-slice"
|
import { setCurrentUser } from "@/store/auth-slice"
|
||||||
import { LoginRequest } from "@/types"
|
import { LoginRequest } from "@/types"
|
||||||
import dayjs from "dayjs";
|
|
||||||
|
|
||||||
export default function LoginPage() {
|
export default function LoginPage() {
|
||||||
const navigate = useNavigate()
|
const navigate = useNavigate()
|
||||||
@@ -17,9 +16,7 @@ export default function LoginPage() {
|
|||||||
setLoading(true)
|
setLoading(true)
|
||||||
try {
|
try {
|
||||||
const user = await AuthApi.login(values)
|
const user = await AuthApi.login(values)
|
||||||
const expireTimestamp = dayjs(user.expiration).valueOf();
|
dispatch(setCurrentUser(user))
|
||||||
const authUser = { ...user, expireAt: expireTimestamp };
|
|
||||||
dispatch(setCurrentUser(authUser))
|
|
||||||
message.success(`欢迎回来,${user.username}`)
|
message.success(`欢迎回来,${user.username}`)
|
||||||
navigate("/firearms")
|
navigate("/firearms")
|
||||||
} catch {
|
} catch {
|
||||||
|
|||||||
@@ -1,11 +1,6 @@
|
|||||||
import { createSlice, PayloadAction } from "@reduxjs/toolkit"
|
import { createSlice, PayloadAction } from "@reduxjs/toolkit"
|
||||||
import { User } from "@/types"
|
import { User } from "@/types"
|
||||||
|
|
||||||
export interface AuthUser extends User {
|
|
||||||
expireAt: number; // 转换 expiration 得到的时间戳
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
interface AuthState {
|
interface AuthState {
|
||||||
user: User | null
|
user: User | null
|
||||||
}
|
}
|
||||||
@@ -20,11 +15,9 @@ const authSlice = createSlice({
|
|||||||
reducers: {
|
reducers: {
|
||||||
setCurrentUser(state, action: PayloadAction<User>) {
|
setCurrentUser(state, action: PayloadAction<User>) {
|
||||||
state.user = action.payload
|
state.user = action.payload
|
||||||
localStorage.setItem('auth_user', JSON.stringify(action.payload));
|
|
||||||
},
|
},
|
||||||
clearCurrentUser(state) {
|
clearCurrentUser(state) {
|
||||||
state.user = null
|
state.user = null
|
||||||
localStorage.removeItem('auth_user');
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -1,25 +0,0 @@
|
|||||||
export interface PasswordItem {
|
|
||||||
mapName: string; // 地图名称,如 "零号大坝"
|
|
||||||
password: string; // 四位数字密码,如 "6460"
|
|
||||||
}
|
|
||||||
|
|
||||||
// data 字段的类型
|
|
||||||
export interface DailyPasswordData {
|
|
||||||
updateDate: string; // 如 "06月14日每日密码已更新"
|
|
||||||
totalCount: number; // 总数,这里固定为 5
|
|
||||||
passwords: PasswordItem[]; // 密码数组
|
|
||||||
source: string; // 如 "三角洲行动每日密码"
|
|
||||||
lastUpdated: string; // 最后更新时间字符串,如 "2026-06-14 16:54:46"
|
|
||||||
timestamp: number; // Unix 时间戳(秒),如 1781427286
|
|
||||||
}
|
|
||||||
|
|
||||||
// 根返回值的类型
|
|
||||||
export interface DailyPasswordResponse {
|
|
||||||
status: 'success' | 'error'; // 可根据实际调整字面量,或直接用 string
|
|
||||||
message: string; // 如 "每日密码获取成功"
|
|
||||||
data: DailyPasswordData;
|
|
||||||
metadata: {
|
|
||||||
version: string; // 如 "1.0"
|
|
||||||
author: string; // 如 "tmini.net"
|
|
||||||
};
|
|
||||||
}
|
|
||||||
+1
-1
@@ -7,5 +7,5 @@ export interface User {
|
|||||||
id: number
|
id: number
|
||||||
username: string
|
username: string
|
||||||
email: string
|
email: string
|
||||||
expiration: string
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -1,7 +1,6 @@
|
|||||||
export type Direction = "ASC" | "DESC"
|
export type Direction = "ASC" | "DESC"
|
||||||
|
|
||||||
export interface Page<T> {
|
export interface Page<T> {
|
||||||
map(arg0: (item: any) => { label: any; value: any; data: any }): unknown
|
|
||||||
items: T[]
|
items: T[]
|
||||||
page: number
|
page: number
|
||||||
size: number
|
size: number
|
||||||
|
|||||||
@@ -1,20 +0,0 @@
|
|||||||
let logoutTimer: ReturnType<typeof setTimeout> | null = null;
|
|
||||||
|
|
||||||
export const scheduleAutoLogout = (expireTimestamp: number, onLogout: () => void) => {
|
|
||||||
if (logoutTimer) clearTimeout(logoutTimer);
|
|
||||||
const delay = expireTimestamp - Date.now();
|
|
||||||
if (delay <= 0) {
|
|
||||||
onLogout();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
logoutTimer = setTimeout(() => {
|
|
||||||
onLogout();
|
|
||||||
}, delay);
|
|
||||||
};
|
|
||||||
|
|
||||||
export const clearAutoLogout = () => {
|
|
||||||
if (logoutTimer) {
|
|
||||||
clearTimeout(logoutTimer);
|
|
||||||
logoutTimer = null;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
@@ -44,15 +44,6 @@ export default defineConfig({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
server: {
|
|
||||||
proxy: {
|
|
||||||
"/api": {
|
|
||||||
target: "http://dfguide.onixbyte.cn/dev-api",
|
|
||||||
changeOrigin: true,
|
|
||||||
rewrite: (path) => path.replace(/^\/api/, ""),
|
|
||||||
},
|
|
||||||
},
|
|
||||||
},
|
|
||||||
resolve: {
|
resolve: {
|
||||||
alias: {
|
alias: {
|
||||||
"@": fileURLToPath(new URL("./src", import.meta.url)),
|
"@": fileURLToPath(new URL("./src", import.meta.url)),
|
||||||
|
|||||||
Reference in New Issue
Block a user