|
|
|
|
@ -1,6 +1,5 @@ |
|
|
|
|
import { |
|
|
|
|
ChangeEvent, |
|
|
|
|
FormEvent, |
|
|
|
|
useEffect, |
|
|
|
|
useRef, |
|
|
|
|
useState, |
|
|
|
|
@ -28,6 +27,7 @@ import { |
|
|
|
|
} from 'requests/getSportTeams' |
|
|
|
|
import { getPlayerMatches } from 'requests/getMatches/getPlayerMatches' |
|
|
|
|
import { getTeamPlayers, Player } from 'requests/getTeamPlayers' |
|
|
|
|
import { getSearchItems, PlayerTypeFromSearch } from 'requests' |
|
|
|
|
|
|
|
|
|
import { |
|
|
|
|
checkedMatches, |
|
|
|
|
@ -48,12 +48,29 @@ type SportTypeName = SportType & { |
|
|
|
|
name: string, |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
type PlayerType = Player & { |
|
|
|
|
type PlayerType = { |
|
|
|
|
firstname_eng: string, |
|
|
|
|
firstname_rus: string, |
|
|
|
|
id: number, |
|
|
|
|
lastname_eng: string, |
|
|
|
|
lastname_rus: string, |
|
|
|
|
name: string, |
|
|
|
|
sport?: number, |
|
|
|
|
sport_id?: number, |
|
|
|
|
team?: { |
|
|
|
|
id: number, |
|
|
|
|
name_eng: string, |
|
|
|
|
name_rus: string, |
|
|
|
|
}, |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
type TeamType = Team & { |
|
|
|
|
type TeamType = { |
|
|
|
|
id: number, |
|
|
|
|
name: string, |
|
|
|
|
name_eng: string, |
|
|
|
|
name_rus: string, |
|
|
|
|
short_name_eng?: string, |
|
|
|
|
short_name_rus?: string, |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
type Sound = { |
|
|
|
|
@ -73,7 +90,7 @@ type FormType = { |
|
|
|
|
players: Array<string>, |
|
|
|
|
selectedPlayer: PlayerType | null, |
|
|
|
|
selectedSound: Sound | null, |
|
|
|
|
selectedTeam: Team | null, |
|
|
|
|
selectedTeam: TeamType | null, |
|
|
|
|
sport: SportTypeName | null, |
|
|
|
|
stats: StatsType, |
|
|
|
|
teamValue: string, |
|
|
|
|
@ -98,7 +115,7 @@ const defaultValues = { |
|
|
|
|
selectedSound: null, |
|
|
|
|
selectedTeam: null, |
|
|
|
|
sport: null, |
|
|
|
|
stats: summaryStats[1], |
|
|
|
|
stats: summaryStats[0], |
|
|
|
|
teamValue: '', |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
@ -141,6 +158,7 @@ export const useHighlightsForm = () => { |
|
|
|
|
if (selectedTeam) { |
|
|
|
|
setFormState((state) => ({ |
|
|
|
|
...state, |
|
|
|
|
duration: '2', |
|
|
|
|
selectedTeam, |
|
|
|
|
})) |
|
|
|
|
} |
|
|
|
|
@ -148,10 +166,25 @@ export const useHighlightsForm = () => { |
|
|
|
|
|
|
|
|
|
const onPlayerSelect = (selectedPlayer: PlayerType | null) => { |
|
|
|
|
if (!selectedPlayer) return |
|
|
|
|
setFormState((state) => ({ |
|
|
|
|
setFormState((state: FormType) => ({ |
|
|
|
|
...state, |
|
|
|
|
duration: '2', |
|
|
|
|
playerValue: '', |
|
|
|
|
selectedPlayer, |
|
|
|
|
teamValue: '', |
|
|
|
|
})) |
|
|
|
|
|
|
|
|
|
if (selectedPlayer.team && !formState.selectedTeam) { |
|
|
|
|
setFormState((state: FormType) => ({ |
|
|
|
|
...state, |
|
|
|
|
selectedTeam: { |
|
|
|
|
id: selectedPlayer?.team?.id || 0, |
|
|
|
|
name: selectedPlayer?.team?.name_eng || '', |
|
|
|
|
name_eng: selectedPlayer?.team?.name_eng || '', |
|
|
|
|
name_rus: selectedPlayer?.team?.name_rus || '', |
|
|
|
|
}, |
|
|
|
|
})) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const onSoundSelect = (selectedSound: Sound | null) => { |
|
|
|
|
@ -186,31 +219,49 @@ export const useHighlightsForm = () => { |
|
|
|
|
|
|
|
|
|
setFormState((state: FormType) => ({ |
|
|
|
|
...state, |
|
|
|
|
playerValue: '', |
|
|
|
|
selectedPlayer: null, |
|
|
|
|
selectedTeam: null, |
|
|
|
|
teamValue: e?.target?.value, |
|
|
|
|
})) |
|
|
|
|
setPlayers([]) |
|
|
|
|
setPlayerMatches([]) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const onChangePlayer = (e: ChangeEvent<HTMLInputElement>) => { |
|
|
|
|
if (!/[A-Za-z\s]/g.test(e.target.value) && e.target.value.length) return |
|
|
|
|
|
|
|
|
|
if (!formState.selectedTeam) { |
|
|
|
|
e.target?.value?.length > 3 |
|
|
|
|
&& getSearchItems(formState.playerValue) |
|
|
|
|
.then((state) => { |
|
|
|
|
setPlayersData(state?.players?.map((player: PlayerTypeFromSearch) => ({ |
|
|
|
|
...player, |
|
|
|
|
name: `${player?.firstname_eng} ${player?.lastname_eng}`, |
|
|
|
|
})) || []) |
|
|
|
|
setPlayers(state?.players?.map((player: PlayerTypeFromSearch) => ({ |
|
|
|
|
...player, |
|
|
|
|
name: `${player?.firstname_eng} ${player?.lastname_eng}`, |
|
|
|
|
})) || []) |
|
|
|
|
}) |
|
|
|
|
} |
|
|
|
|
setPlayerMatches([]) |
|
|
|
|
setFormState((state: FormType) => ({ |
|
|
|
|
...state, |
|
|
|
|
playerValue: e?.target?.value, |
|
|
|
|
selectedPlayer: null, |
|
|
|
|
selectedTeam: state.selectedTeam ?? null, |
|
|
|
|
})) |
|
|
|
|
setPlayers( |
|
|
|
|
playersData?.filter( |
|
|
|
|
(player: PlayerType) => player |
|
|
|
|
&& player.name |
|
|
|
|
&& player?.name |
|
|
|
|
?.toLowerCase() |
|
|
|
|
.indexOf(e?.target?.value.toLowerCase()) >= 0, |
|
|
|
|
), |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
const handleSubmit = (e: FormEvent<HTMLFormElement>) => { |
|
|
|
|
e.preventDefault() |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
getSportList() |
|
|
|
|
.then((res) => setSports( |
|
|
|
|
@ -233,6 +284,7 @@ export const useHighlightsForm = () => { |
|
|
|
|
]) |
|
|
|
|
setFormState((prev) => ({ |
|
|
|
|
...prev, |
|
|
|
|
duration: '2', |
|
|
|
|
selectedSound: { |
|
|
|
|
asset: null, |
|
|
|
|
id: 100, |
|
|
|
|
@ -286,7 +338,7 @@ export const useHighlightsForm = () => { |
|
|
|
|
) |
|
|
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
|
if (Number(formState?.duration) < checkedMatchesLength * 2) { |
|
|
|
|
if (checkedMatchesLength * 2 >= 2) { |
|
|
|
|
setFormState((prev) => ({ |
|
|
|
|
...prev, |
|
|
|
|
duration: (checkedMatchesLength * 2).toString(), |
|
|
|
|
@ -352,7 +404,7 @@ export const useHighlightsForm = () => { |
|
|
|
|
p_match_completed: true, |
|
|
|
|
playerId: formState?.selectedPlayer?.id, |
|
|
|
|
sportType: formState?.sport?.id, |
|
|
|
|
sub_only: false, |
|
|
|
|
sub_only: true, |
|
|
|
|
}) |
|
|
|
|
.then(({ broadcast }) => setPlayerMatches( |
|
|
|
|
broadcast.map((match: Match) => ({ ...match, isChecked: false })), |
|
|
|
|
@ -366,7 +418,6 @@ export const useHighlightsForm = () => { |
|
|
|
|
checkedMatchesLength, |
|
|
|
|
formRef, |
|
|
|
|
formState, |
|
|
|
|
handleSubmit, |
|
|
|
|
isFetchingTeams, |
|
|
|
|
onChangeMaxDuration, |
|
|
|
|
onChangePlayer, |
|
|
|
|
|