ui cleanup
This commit is contained in:
parent
73aea84e8e
commit
a19b7883d6
2 changed files with 43 additions and 60 deletions
|
|
@ -212,18 +212,27 @@
|
||||||
return signup;
|
return signup;
|
||||||
}
|
}
|
||||||
|
|
||||||
function cloneSignupConfig(config: TournamentSignupConfig | null | undefined): SignupConfigForm {
|
function cloneSignupConfig(config: TournamentSignupConfig | null | undefined): SignupConfigForm {
|
||||||
if (!config) return createDefaultSignup();
|
if (!config) return createDefaultSignup();
|
||||||
|
|
||||||
const signup: SignupConfigForm = {
|
const normalizedSize = Math.max(
|
||||||
mode: config.mode === 'team' ? 'team' : 'solo',
|
1,
|
||||||
team_size: {
|
Math.floor(
|
||||||
min: config.team_size?.min ?? 1,
|
config.team_size?.max ??
|
||||||
max: config.team_size?.max ?? 1
|
config.team_size?.min ??
|
||||||
},
|
1
|
||||||
entry_fields: (config.entry_fields ?? []).map(cloneSignupField),
|
)
|
||||||
participant_fields: (config.participant_fields ?? []).map(cloneSignupField)
|
);
|
||||||
};
|
|
||||||
|
const signup: SignupConfigForm = {
|
||||||
|
mode: config.mode === 'team' ? 'team' : 'solo',
|
||||||
|
team_size: {
|
||||||
|
min: normalizedSize,
|
||||||
|
max: normalizedSize
|
||||||
|
},
|
||||||
|
entry_fields: (config.entry_fields ?? []).map(cloneSignupField),
|
||||||
|
participant_fields: (config.participant_fields ?? []).map(cloneSignupField)
|
||||||
|
};
|
||||||
|
|
||||||
ensureAttendancePlacement(signup);
|
ensureAttendancePlacement(signup);
|
||||||
|
|
||||||
|
|
@ -280,14 +289,15 @@
|
||||||
function setSignupMode(form: TournamentForm, mode: 'solo' | 'team') {
|
function setSignupMode(form: TournamentForm, mode: 'solo' | 'team') {
|
||||||
form.signup.mode = mode;
|
form.signup.mode = mode;
|
||||||
if (mode === 'solo') {
|
if (mode === 'solo') {
|
||||||
form.signup.team_size.min = 1;
|
setTeamSize(form, '1');
|
||||||
form.signup.team_size.max = 1;
|
|
||||||
form.signup.participant_fields = [];
|
form.signup.participant_fields = [];
|
||||||
} else {
|
} else {
|
||||||
if (form.signup.team_size.min < 1) form.signup.team_size.min = 1;
|
const currentSize = Math.max(
|
||||||
if (form.signup.team_size.max < form.signup.team_size.min) {
|
1,
|
||||||
form.signup.team_size.max = form.signup.team_size.min;
|
Number.isFinite(form.signup.team_size.min) ? form.signup.team_size.min : 1,
|
||||||
}
|
Number.isFinite(form.signup.team_size.max) ? form.signup.team_size.max : 1
|
||||||
|
);
|
||||||
|
setTeamSize(form, String(currentSize));
|
||||||
if (form.signup.participant_fields.length === 0) {
|
if (form.signup.participant_fields.length === 0) {
|
||||||
form.signup.participant_fields = [createSignupField('Spelare')];
|
form.signup.participant_fields = [createSignupField('Spelare')];
|
||||||
}
|
}
|
||||||
|
|
@ -295,12 +305,12 @@
|
||||||
ensureAttendancePlacement(form.signup);
|
ensureAttendancePlacement(form.signup);
|
||||||
}
|
}
|
||||||
|
|
||||||
function setTeamSize(form: TournamentForm, key: 'min' | 'max', value: string) {
|
function setTeamSize(form: TournamentForm, value: string) {
|
||||||
const parsed = Number.parseInt(value, 10);
|
const parsed = Number.parseInt(value, 10);
|
||||||
const fallback = key === 'min' ? 1 : form.signup.team_size.min;
|
const numeric = Number.isNaN(parsed) ? 1 : Math.max(1, parsed);
|
||||||
const numeric = Number.isNaN(parsed) ? fallback : Math.max(1, parsed);
|
form.signup.team_size.min = numeric;
|
||||||
form.signup.team_size[key] = numeric;
|
form.signup.team_size.max = numeric;
|
||||||
}
|
}
|
||||||
|
|
||||||
function slugify(value: string) {
|
function slugify(value: string) {
|
||||||
let slug = value
|
let slug = value
|
||||||
|
|
@ -404,17 +414,16 @@
|
||||||
};
|
};
|
||||||
|
|
||||||
const mode = signup.mode === 'team' ? 'team' : 'solo';
|
const mode = signup.mode === 'team' ? 'team' : 'solo';
|
||||||
let min = toNumber(signup.team_size.min);
|
let teamSize = toNumber(signup.team_size.min);
|
||||||
let max = toNumber(signup.team_size.max);
|
if (mode === 'team') {
|
||||||
if (max < min) max = min;
|
teamSize = Math.max(teamSize, toNumber(signup.team_size.max));
|
||||||
if (mode === 'solo') {
|
} else {
|
||||||
min = 1;
|
teamSize = 1;
|
||||||
max = 1;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const draft: SignupConfigForm = {
|
const draft: SignupConfigForm = {
|
||||||
mode,
|
mode,
|
||||||
team_size: { min, max },
|
team_size: { min: teamSize, max: teamSize },
|
||||||
entry_fields: signup.entry_fields.map((field) => ({ ...field })),
|
entry_fields: signup.entry_fields.map((field) => ({ ...field })),
|
||||||
participant_fields: signup.participant_fields.map((field) => ({ ...field }))
|
participant_fields: signup.participant_fields.map((field) => ({ ...field }))
|
||||||
};
|
};
|
||||||
|
|
@ -426,7 +435,7 @@
|
||||||
|
|
||||||
return {
|
return {
|
||||||
mode,
|
mode,
|
||||||
team_size: { min, max },
|
team_size: { min: teamSize, max: teamSize },
|
||||||
entry_fields,
|
entry_fields,
|
||||||
participant_fields
|
participant_fields
|
||||||
};
|
};
|
||||||
|
|
@ -1153,9 +1162,9 @@
|
||||||
</select>
|
</select>
|
||||||
</label>
|
</label>
|
||||||
{#if createState.form.signup.mode === 'team'}
|
{#if createState.form.signup.mode === 'team'}
|
||||||
<div class="grid grid-cols-2 gap-3">
|
<div class="grid gap-3">
|
||||||
<label class="flex flex-col gap-1 text-sm font-medium text-slate-700">
|
<label class="flex flex-col gap-1 text-sm font-medium text-slate-700">
|
||||||
<span>Min. spelare</span>
|
<span>Spelare per lag</span>
|
||||||
<input
|
<input
|
||||||
type="number"
|
type="number"
|
||||||
min={1}
|
min={1}
|
||||||
|
|
@ -1163,22 +1172,6 @@
|
||||||
oninput={(event) =>
|
oninput={(event) =>
|
||||||
setTeamSize(
|
setTeamSize(
|
||||||
createState.form,
|
createState.form,
|
||||||
'min',
|
|
||||||
(event.currentTarget as HTMLInputElement).value
|
|
||||||
)}
|
|
||||||
class="rounded-md border border-slate-300 px-3 py-2 text-sm text-slate-900 focus:border-indigo-500 focus:ring focus:ring-indigo-100 focus:outline-none"
|
|
||||||
/>
|
|
||||||
</label>
|
|
||||||
<label class="flex flex-col gap-1 text-sm font-medium text-slate-700">
|
|
||||||
<span>Max. spelare</span>
|
|
||||||
<input
|
|
||||||
type="number"
|
|
||||||
min={createState.form.signup.team_size.min}
|
|
||||||
value={createState.form.signup.team_size.max}
|
|
||||||
oninput={(event) =>
|
|
||||||
setTeamSize(
|
|
||||||
createState.form,
|
|
||||||
'max',
|
|
||||||
(event.currentTarget as HTMLInputElement).value
|
(event.currentTarget as HTMLInputElement).value
|
||||||
)}
|
)}
|
||||||
class="rounded-md border border-slate-300 px-3 py-2 text-sm text-slate-900 focus:border-indigo-500 focus:ring focus:ring-indigo-100 focus:outline-none"
|
class="rounded-md border border-slate-300 px-3 py-2 text-sm text-slate-900 focus:border-indigo-500 focus:ring focus:ring-indigo-100 focus:outline-none"
|
||||||
|
|
|
||||||
|
|
@ -545,17 +545,7 @@
|
||||||
|
|
||||||
{#if signupConfig.mode === 'team'}
|
{#if signupConfig.mode === 'team'}
|
||||||
<div class="space-y-3">
|
<div class="space-y-3">
|
||||||
<div class="flex items-center justify-between">
|
<h3 class="text-sm font-semibold tracking-wide text-slate-400 uppercase">Spelare</h3>
|
||||||
<h3 class="text-sm font-semibold tracking-wide text-slate-400 uppercase">Spelare</h3>
|
|
||||||
<button
|
|
||||||
type="button"
|
|
||||||
onclick={addParticipant}
|
|
||||||
disabled={!canAddParticipant() || signup.submitting}
|
|
||||||
class="rounded-full border border-indigo-300 px-3 py-1 text-xs font-semibold text-indigo-200 transition hover:border-indigo-400 hover:bg-indigo-500/10 disabled:cursor-not-allowed disabled:opacity-60"
|
|
||||||
>
|
|
||||||
Lägg till spelare
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{#if signup.participants.length > 0}
|
{#if signup.participants.length > 0}
|
||||||
<div class="space-y-4">
|
<div class="space-y-4">
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue