mirror of
https://github.com/router-for-me/Cli-Proxy-API-Management-Center.git
synced 2026-02-03 03:10:50 +08:00
fix: prevent focus loss in OAuth model mappings input
This commit is contained in:
@@ -17,6 +17,7 @@ import type { AuthFileItem, OAuthModelMappingEntry } from '@/types';
|
|||||||
import type { KeyStats, KeyStatBucket, UsageDetail } from '@/utils/usage';
|
import type { KeyStats, KeyStatBucket, UsageDetail } from '@/utils/usage';
|
||||||
import { collectUsageDetails, calculateStatusBarData } from '@/utils/usage';
|
import { collectUsageDetails, calculateStatusBarData } from '@/utils/usage';
|
||||||
import { formatFileSize } from '@/utils/format';
|
import { formatFileSize } from '@/utils/format';
|
||||||
|
import { generateId } from '@/utils/helpers';
|
||||||
import styles from './AuthFilesPage.module.scss';
|
import styles from './AuthFilesPage.module.scss';
|
||||||
|
|
||||||
type ThemeColors = { bg: string; text: string; border?: string };
|
type ThemeColors = { bg: string; text: string; border?: string };
|
||||||
@@ -91,12 +92,15 @@ interface ExcludedFormState {
|
|||||||
modelsText: string;
|
modelsText: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
type OAuthModelMappingFormEntry = OAuthModelMappingEntry & { id: string };
|
||||||
|
|
||||||
interface ModelMappingsFormState {
|
interface ModelMappingsFormState {
|
||||||
provider: string;
|
provider: string;
|
||||||
mappings: OAuthModelMappingEntry[];
|
mappings: OAuthModelMappingFormEntry[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const buildEmptyMappingEntry = (): OAuthModelMappingEntry => ({
|
const buildEmptyMappingEntry = (): OAuthModelMappingFormEntry => ({
|
||||||
|
id: generateId(),
|
||||||
name: '',
|
name: '',
|
||||||
alias: '',
|
alias: '',
|
||||||
fork: false
|
fork: false
|
||||||
@@ -728,11 +732,12 @@ export function AuthFilesPage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
// OAuth 模型映射相关方法
|
// OAuth 模型映射相关方法
|
||||||
const normalizeMappingEntries = (entries?: OAuthModelMappingEntry[]) => {
|
const normalizeMappingEntries = (entries?: OAuthModelMappingEntry[]): OAuthModelMappingFormEntry[] => {
|
||||||
if (!Array.isArray(entries) || entries.length === 0) {
|
if (!Array.isArray(entries) || entries.length === 0) {
|
||||||
return [buildEmptyMappingEntry()];
|
return [buildEmptyMappingEntry()];
|
||||||
}
|
}
|
||||||
return entries.map((entry) => ({
|
return entries.map((entry) => ({
|
||||||
|
id: generateId(),
|
||||||
name: entry.name ?? '',
|
name: entry.name ?? '',
|
||||||
alias: entry.alias ?? '',
|
alias: entry.alias ?? '',
|
||||||
fork: Boolean(entry.fork),
|
fork: Boolean(entry.fork),
|
||||||
@@ -1437,7 +1442,7 @@ export function AuthFilesPage() {
|
|||||||
<div className="header-input-list">
|
<div className="header-input-list">
|
||||||
{(mappingForm.mappings.length ? mappingForm.mappings : [buildEmptyMappingEntry()]).map(
|
{(mappingForm.mappings.length ? mappingForm.mappings : [buildEmptyMappingEntry()]).map(
|
||||||
(entry, index) => (
|
(entry, index) => (
|
||||||
<div key={`${entry.name}-${entry.alias}-${index}`} className={styles.mappingRow}>
|
<div key={entry.id} className={styles.mappingRow}>
|
||||||
<input
|
<input
|
||||||
className="input"
|
className="input"
|
||||||
placeholder={t('oauth_model_mappings.mapping_name_placeholder')}
|
placeholder={t('oauth_model_mappings.mapping_name_placeholder')}
|
||||||
|
|||||||
Reference in New Issue
Block a user