Various UI stuff (mainly implement mookup)

Fix lint

Disable modern mode

Fixes

UI fixes

Fixes

Ignore .po~ files

Fixes

Fix homepage

Fixes

Fixes

Mix format

Fix tests

Fix tests (yeah…)

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel
2019-04-03 17:29:03 +02:00
parent 2dcd65ea78
commit da2a0593ca
66 changed files with 14247 additions and 15872 deletions

View File

@@ -1,76 +1,73 @@
<template>
<section>
<div class="columns">
<div class="column">
<div class="card" v-if="group">
<div class="card-image" v-if="group.bannerUrl">
<figure class="image">
<img :src="group.bannerUrl">
<section class="container">
<div v-if="group">
<div class="card-image" v-if="group.bannerUrl">
<figure class="image">
<img :src="group.bannerUrl">
</figure>
</div>
<div class="box">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img :src="group.avatarUrl">
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="media-left">
<figure class="image is-48x48">
<img :src="group.avatarUrl">
</figure>
</div>
<div class="media-content">
<p class="title">{{ group.name }}</p>
<p class="subtitle">@{{ group.preferredUsername }}</p>
</div>
</div>
<div class="content">
<p v-html="group.summary"></p>
</div>
<div class="media-content">
<p class="title">{{ group.name }}</p>
<p class="subtitle">@{{ group.preferredUsername }}</p>
</div>
<section v-if="group.organizedEvents.length > 0">
<h2 class="subtitle">
<translate>Organized</translate>
</h2>
<div class="columns">
<EventCard
v-for="event in group.organizedEvents"
:event="event"
:options="{ hideDetails: true }"
:key="event.uuid"
class="column is-one-third"
/>
</div>
</section>
<section v-if="group.members.length > 0">
<h2 class="subtitle">
<translate>Members</translate>
</h2>
<div class="columns">
<span
v-for="member in group.members"
:key="member"
>{{ member.actor.preferredUsername }}</span>
</div>
</section>
</div>
<b-message v-if-else="!group && $apollo.loading === false" type="is-danger">
<translate>No group found</translate>
</b-message>
<div class="content">
<p v-html="group.summary"></p>
</div>
</div>
<section class="box" v-if="group.organizedEvents.length > 0">
<h2 class="subtitle">
<translate>Organized</translate>
</h2>
<div class="columns">
<EventCard
v-for="event in group.organizedEvents"
:event="event"
:options="{ hideDetails: true }"
:key="event.uuid"
class="column is-one-third"
/>
</div>
</section>
<section v-if="group.members.length > 0">
<h2 class="subtitle">
<translate>Members</translate>
</h2>
<div class="columns">
<span
v-for="member in group.members"
:key="member.actor.preferredUsername"
>{{ member.actor.preferredUsername }}</span>
</div>
</section>
</div>
<b-message v-else-if="!group && $apollo.loading === false" type="is-danger">
<translate>No group found</translate>
</b-message>
</section>
</template>
<script lang="ts">
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import EventCard from '@/components/Event/EventCard.vue';
import { FETCH_PERSON, LOGGED_PERSON } from '@/graphql/actor';
import { FETCH_GROUP, LOGGED_PERSON } from '@/graphql/actor';
import { IGroup } from '@/types/actor.model';
@Component({
apollo: {
person: {
query: FETCH_PERSON,
group: {
query: FETCH_GROUP,
variables() {
return {
name: this.$route.params.name,
name: this.$route.params.preferredUsername,
};
},
},
@@ -83,9 +80,9 @@ import { FETCH_PERSON, LOGGED_PERSON } from '@/graphql/actor';
},
})
export default class Group extends Vue {
@Prop({ type: String, required: true }) name!: string;
@Prop({ type: String, required: true }) preferredUsername!: string;
group = null;
group!: IGroup;
loading = true;
created() {
@@ -110,3 +107,8 @@ export default class Group extends Vue {
}
}
</script>
<style lang="scss">
section.container {
min-height: 30em;
}
</style>

View File

@@ -12,7 +12,7 @@
class="column is-one-quarter-desktop is-half-mobile"
/>
</div>
<router-link class="button" :to="{ name: 'CreateGroup' }">
<router-link class="button" :to="{ name: RouteName.CREATE_GROUP }">
<translate>Create group</translate>
</router-link>
</section>
@@ -27,6 +27,8 @@ export default class GroupList extends Vue {
groups = [];
loading = true;
RouteName = RouteName;
created() {
this.fetchData();
}