feat: beginning work on managing campaigns
This commit is contained in:
parent
0dccf7e86e
commit
0da40ebf42
@ -12,5 +12,5 @@ module.exports = {
|
|||||||
parserOptions: {
|
parserOptions: {
|
||||||
ecmaVersion: 'latest',
|
ecmaVersion: 'latest',
|
||||||
},
|
},
|
||||||
ignorePatterns: ['node_modules/', '**/node_modules/'],
|
ignorePatterns: ['pocketbase/'],
|
||||||
};
|
};
|
||||||
|
@ -1,6 +1,28 @@
|
|||||||
<template>Bonjour {{ pbStore.username }} !</template>
|
<template>
|
||||||
|
<div class="h3">Bonjour {{ pbStore.auth.username }} !</div>
|
||||||
|
|
||||||
|
<div class="campagnes flex-col-center gap-2rem">
|
||||||
|
<h1>Campagnes</h1>
|
||||||
|
<RouterLink :to="{ name: 'new-campaign' }" class="button">Créer une campagne</RouterLink>
|
||||||
|
<ul v-if="campaigns.length > 0">
|
||||||
|
<li v-for="campaign in campaigns" :key="campaign.id">{{ campaign }}</li>
|
||||||
|
</ul>
|
||||||
|
<div v-else>Pas de campagnes pour l’instant</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
<script setup="" lang="ts">
|
<script setup="" lang="ts">
|
||||||
import { usePocketbaseStore } from '@/stores/pocketbase';
|
import { usePocketbaseStore } from '@/stores/pocketbase';
|
||||||
|
import { type RecordModel } from 'pocketbase';
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
|
import { RouterLink } from 'vue-router';
|
||||||
const pbStore = usePocketbaseStore();
|
const pbStore = usePocketbaseStore();
|
||||||
|
|
||||||
|
const campaigns = ref<RecordModel[]>([]);
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
pbStore.campaign.listCampaigns().subscribe({
|
||||||
|
next: (result) => (campaigns.value = result),
|
||||||
|
});
|
||||||
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -13,6 +13,11 @@ const router = createRouter({
|
|||||||
name: 'account',
|
name: 'account',
|
||||||
component: () => import('@/views/AccountView.vue'),
|
component: () => import('@/views/AccountView.vue'),
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/new-campaign',
|
||||||
|
name: 'new-campaign',
|
||||||
|
component: () => import('@/views/CreateCampaignView.vue'),
|
||||||
|
},
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
|
|
||||||
|
57
src/views/CreateCampaignView.vue
Normal file
57
src/views/CreateCampaignView.vue
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
<template>
|
||||||
|
<h1>Création d’une campagne</h1>
|
||||||
|
<div class="h3 card" v-if="campaign.name">
|
||||||
|
{{ campaign.name }}
|
||||||
|
</div>
|
||||||
|
<form @submit.prevent="createCampaign" class="flex-col gap-2rem card">
|
||||||
|
<label for="campaign-name" class="flex-col gap-1rem">Nom de la nouvelle campagne</label>
|
||||||
|
<input
|
||||||
|
name="campaign-name"
|
||||||
|
type="text"
|
||||||
|
v-model="campaign.name"
|
||||||
|
placeholder="Nom de la nouvelle campagne" />
|
||||||
|
|
||||||
|
<div class="buttons gap-1rem">
|
||||||
|
<RouterLink :to="{ name: 'home' }" class="button faded">Annuler</RouterLink>
|
||||||
|
<button type="submit">Envoyer</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup lang="ts">
|
||||||
|
import router from '@/router';
|
||||||
|
import { usePocketbaseStore, type NewCampaign } from '@/stores/pocketbase';
|
||||||
|
import { type RecordModel } from 'pocketbase';
|
||||||
|
import { onMounted, ref } from 'vue';
|
||||||
|
|
||||||
|
const pbStore = usePocketbaseStore();
|
||||||
|
const simpleUsers = ref<RecordModel[]>([]);
|
||||||
|
|
||||||
|
const campaign = ref<NewCampaign>({
|
||||||
|
name: null,
|
||||||
|
game_master: pbStore.auth.userId,
|
||||||
|
players: null,
|
||||||
|
});
|
||||||
|
|
||||||
|
const createCampaign = () => {
|
||||||
|
pbStore.campaign.createCampaign(campaign.value).subscribe({
|
||||||
|
next: () => {
|
||||||
|
router.push({ name: 'home' });
|
||||||
|
router.go(0);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
pbStore.users.simpleUserList().subscribe({
|
||||||
|
next: (result) => (simpleUsers.value = result),
|
||||||
|
error: (err) => console.error('Failed to create campaign:', err),
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="less">
|
||||||
|
form {
|
||||||
|
min-width: 90%;
|
||||||
|
}
|
||||||
|
</style>
|
Loading…
Reference in New Issue
Block a user