scout_ante/dashboard-v2
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use normal <select>

Browse Source
This commit is contained in:
rxdn 2024-06-20 17:35:57 +01:00
parent c9cb0c719c
commit 740a9f8ce7
1 changed files with 26 additions and 24 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
frontend/src/views/Teams.svelte
View File

@ -18,19 +18,17 @@
<div class="section"> <div class="section">
<h2 class="section-title">Manage Teams</h2> <h2 class="section-title">Manage Teams</h2>
<div class="col-1" style="flex-direction: row"> <div class="col-1" style="flex-direction: row; gap: 12px">
<div class="col-4" style="margin-right: 12px"> <Dropdown col3 label="Team" bind:value={activeTeam} on:change={(e) => updateActiveTeam(e.target.value)}>
<div class="col-1"> {#each teams as team}
<WrappedSelect isSearchable={false} isClearable={false} optionIdentifier="id" items={teams} placeholder="Select a team..." <option value={team.id}>{team.name}</option>
bind:selectedValue={activeTeam} nameMapper={labelMapper} {/each}
on:input={updateActiveTeam}/> </Dropdown>
</div>
</div>
{#if activeTeam.id !== 'default'} {#if activeTeam !== 'default'}
<div class="col-1"> <div style="margin-top: auto; margin-bottom: 0.5em">
<Button danger={true} type="button" <Button danger={true} type="button"
on:click={() => deleteTeam(activeTeam.id)}>Delete {activeTeam.name}</Button> on:click={() => deleteTeam(activeTeam)}>Delete {getTeam(activeTeam)?.name}</Button>
</div> </div>
{/if} {/if}
</div> </div>
@ -50,7 +48,7 @@
<td>{role === undefined ? "Unknown Role" : role.name}</td> <td>{role === undefined ? "Unknown Role" : role.name}</td>
{/if} {/if}
<td style="display: flex; flex-direction: row-reverse"> <td style="display: flex; flex-direction: row-reverse">
<Button type="button" danger={true} on:click={() => removeMember(activeTeam.id, member)}>Delete <Button type="button" danger={true} on:click={() => removeMember(activeTeam, member)}>Delete
</Button> </Button>
</td> </td>
</tr> </tr>
@ -105,6 +103,7 @@
import UserSelect from "../components/form/UserSelect.svelte"; import UserSelect from "../components/form/UserSelect.svelte";
import RoleSelect from "../components/form/RoleSelect.svelte"; import RoleSelect from "../components/form/RoleSelect.svelte";
import WrappedSelect from "../components/WrappedSelect.svelte"; import WrappedSelect from "../components/WrappedSelect.svelte";
import Dropdown from "../components/form/Dropdown.svelte";
export let currentRoute; export let currentRoute;
let guildId = currentRoute.namedParams.id; let guildId = currentRoute.namedParams.id;
@ -115,20 +114,20 @@
let defaultTeam = {id: 'default', name: 'Default'}; let defaultTeam = {id: 'default', name: 'Default'};
let createName; let createName;
let teams = []; let teams = [defaultTeam];
let roles = []; let roles = [];
let activeTeam = defaultTeam; let activeTeam = defaultTeam.id;
let members = []; let members = [];
let selectedUser; let selectedUser;
let selectedRole; let selectedRole;
function labelMapper(team) { function getTeam(id) {
return team.name; return teams.find((team) => team.id === id);
} }
async function updateActiveTeam() { async function updateActiveTeam(teamId) {
const res = await axios.get(`${API_URL}/api/${guildId}/team/${activeTeam.id}`); const res = await axios.get(`${API_URL}/api/${guildId}/team/${teamId}`);
if (res.status !== 200) { if (res.status !== 200) {
if (res.status === 429) { if (res.status === 429) {
notifyRatelimit(); notifyRatelimit();
@ -142,13 +141,13 @@
} }
async function addUser() { async function addUser() {
const res = await axios.put(`${API_URL}/api/${guildId}/team/${activeTeam.id}/${selectedUser.id}?type=0`); const res = await axios.put(`${API_URL}/api/${guildId}/team/${activeTeam}/${selectedUser.id}?type=0`);
if (res.status !== 200) { if (res.status !== 200) {
notifyError(res.data.error); notifyError(res.data.error);
return; return;
} }
notifySuccess(`${selectedUser.username} has been added to the support team ${activeTeam.name}`); notifySuccess(`${selectedUser.username} has been added to the support team ${getTeam(activeTeam).name}`);
let entity = { let entity = {
id: selectedUser.id, id: selectedUser.id,
@ -160,13 +159,13 @@
} }
async function addRole() { async function addRole() {
const res = await axios.put(`${API_URL}/api/${guildId}/team/${activeTeam.id}/${selectedRole.id}?type=1`); const res = await axios.put(`${API_URL}/api/${guildId}/team/${activeTeam}/${selectedRole.id}?type=1`);
if (res.status !== 200) { if (res.status !== 200) {
notifyError(res.data.error); notifyError(res.data.error);
return; return;
} }
notifySuccess(`${selectedRole.name} has been added to the support team ${activeTeam.name}`); notifySuccess(`${selectedRole.name} has been added to the support team ${getTeam(activeTeam).name}`);
let entity = { let entity = {
id: selectedRole.id, id: selectedRole.id,
@ -218,8 +217,11 @@
} }
notifySuccess(`Team deleted successfully`); notifySuccess(`Team deleted successfully`);
activeTeam = defaultTeam;
activeTeam = defaultTeam.id;
teams = teams.filter((team) => team.id !== id); teams = teams.filter((team) => team.id !== id);
await updateActiveTeam(defaultTeam.id);
} }
async function loadTeams() { async function loadTeams() {
@ -250,7 +252,7 @@
loadRoles() loadRoles()
]); ]);
await updateActiveTeam(); // Depends on teams await updateActiveTeam(defaultTeam.id); // Depends on teams
}); });
</script> </script>