Adjust start.gg layout and admin-only tournament listing

This commit is contained in:
Pandipipas
2026-02-16 00:07:55 +01:00
parent a83f633506
commit 165482a7e0
2 changed files with 139 additions and 120 deletions
+138 -119
View File
@@ -270,135 +270,141 @@ onMounted(() => {
/> />
</div> </div>
<QCard <div class="players-content row q-col-gutter-md">
flat <div class="col players-main-column">
bordered <div class="row items-center q-gutter-sm q-mb-md">
class="q-pa-md"
>
<div class="text-h6 q-mb-sm">
Integración start.gg
</div>
<div class="text-caption q-mb-md">
Pega tu token personal de start.gg para cargar automáticamente tus torneos recientes y sus inscritos.
</div>
<div class="row q-col-gutter-sm items-center">
<div class="col-12 col-md-7">
<QInput <QInput
v-model="startGGToken" v-model="filter"
label="start.gg API Token"
dense dense
outlined placeholder="Search..."
type="password" class="players-search players-underlined-field"
/> clearable
</div> >
<div class="col-auto"> <template #prepend>
<QIcon name="search" />
</template>
</QInput>
<QBtn <QBtn
color="secondary" color="secondary"
icon="sync" outline
label="Cargar torneos" icon="file_upload"
:loading="loadingTournaments" label="Import"
@click="loadRecentTournaments" @click="triggerImport"
/> />
<QBtn
color="secondary"
outline
icon="file_download"
label="Export"
@click="exportPlayers"
/>
<input
ref="fileInput"
type="file"
class="visually-hidden"
accept="application/json"
@change="handleImport"
>
</div> </div>
</div>
<div <QTable
v-if="tournamentsError" flat
class="text-negative q-mt-sm" bordered
> row-key="id"
{{ tournamentsError }} :rows="rows"
</div> :columns="columns"
<QList :filter="filter"
v-if="recentTournaments.length" :rows-per-page-options="[10, 20, 50]"
bordered
separator
class="q-mt-md startgg-tournaments-list"
>
<QItem
v-for="tournament in recentTournaments"
:key="tournament.id"
clickable
> >
<QItemSection> <template #body-cell-actions="{ row }">
<QItemLabel>{{ tournament.name }}</QItemLabel> <QTd align="right">
<QItemLabel caption> <QBtn
{{ tournament.slug }} size="sm"
</QItemLabel> flat
</QItemSection> icon="edit"
<QItemSection side> @click="openEditDialog(row)"
<QBtn />
color="primary" <QBtn
unelevated size="sm"
label="Importar jugadores" flat
@click.stop="openStartGGImportDialog(tournament)" color="negative"
/> icon="delete"
</QItemSection> @click="deletePlayer(row)"
</QItem> />
</QList> </QTd>
</QCard> </template>
</QTable>
</div>
<div class="row items-center q-gutter-sm q-mb-md"> <div class="col-12 col-lg-4 players-startgg-column">
<QInput <QCard
v-model="filter" flat
dense bordered
placeholder="Search..." class="q-pa-md"
class="players-search players-underlined-field" >
clearable <div class="text-h6 q-mb-sm">
> Integración start.gg
<template #prepend> </div>
<QIcon name="search" /> <div class="text-caption q-mb-md">
</template> Pega tu token personal de start.gg para cargar automáticamente tus torneos creados o donde eres admin.
</QInput> </div>
<QBtn <div class="row q-col-gutter-sm items-center">
color="secondary" <div class="col-12">
outline <QInput
icon="file_upload" v-model="startGGToken"
label="Import" label="start.gg API Token"
@click="triggerImport" dense
/> outlined
<QBtn type="password"
color="secondary" />
outline </div>
icon="file_download" <div class="col-12">
label="Export" <QBtn
@click="exportPlayers" color="secondary"
/> icon="sync"
<input label="Cargar torneos"
ref="fileInput" :loading="loadingTournaments"
type="file" @click="loadRecentTournaments"
class="visually-hidden" />
accept="application/json" </div>
@change="handleImport" </div>
> <div
v-if="tournamentsError"
class="text-negative q-mt-sm"
>
{{ tournamentsError }}
</div>
<QList
v-if="recentTournaments.length"
bordered
separator
class="q-mt-md startgg-tournaments-list"
>
<QItem
v-for="tournament in recentTournaments"
:key="tournament.id"
clickable
>
<QItemSection>
<QItemLabel>{{ tournament.name }}</QItemLabel>
<QItemLabel caption>
{{ tournament.slug }}
</QItemLabel>
</QItemSection>
<QItemSection side>
<QBtn
color="primary"
unelevated
label="Importar jugadores"
@click.stop="openStartGGImportDialog(tournament)"
/>
</QItemSection>
</QItem>
</QList>
</QCard>
</div>
</div> </div>
<QTable
flat
bordered
row-key="id"
:rows="rows"
:columns="columns"
:filter="filter"
:rows-per-page-options="[10, 20, 50]"
>
<template #body-cell-actions="{ row }">
<QTd align="right">
<QBtn
size="sm"
flat
icon="edit"
@click="openEditDialog(row)"
/>
<QBtn
size="sm"
flat
color="negative"
icon="delete"
@click="deletePlayer(row)"
/>
</QTd>
</template>
</QTable>
<QDialog v-model="isImportDialogOpen"> <QDialog v-model="isImportDialogOpen">
<QCard class="players-dialog"> <QCard class="players-dialog">
<QCardSection> <QCardSection>
@@ -541,6 +547,19 @@ onMounted(() => {
min-width: 240px; min-width: 240px;
} }
.players-content {
align-items: flex-start;
}
.players-main-column {
min-width: 0;
flex: 1 1 auto;
}
.players-startgg-column {
min-width: 320px;
}
.players-dialog { .players-dialog {
min-width: 320px; min-width: 320px;
width: min(720px, 90vw); width: min(720px, 90vw);
+1 -1
View File
@@ -89,7 +89,7 @@ nodecg.listenFor('startgg:fetchRecentTournaments', async (payload: unknown, ack)
const query = ` const query = `
query RecentTournaments($perPage: Int!) { query RecentTournaments($perPage: Int!) {
currentUser { currentUser {
tournaments(query: { perPage: $perPage }) { tournaments(query: { perPage: $perPage, filter: { tournamentView: "admin" } }) {
nodes { nodes {
id id
name name