Chapril/mobilizon.chapril.org-mobilizon
Chapril
/
mobilizon.chapril.org-mobilizon
24
0
Fork 0
Code Issues Pull Requests Releases Activity

Adapt for Buefy 0.9 <b-table> scope changes 

Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2020-08-18 15:50:50 +02:00
parent 27c73c4646
commit 4a87d520b6
No known key found for this signature in database
GPG Key ID: A061B9DDE0CA0773
9 changed files with 260 additions and 246 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
js/src/components/Admin/Followers.vue
View File

@ -16,24 +16,30 @@
checkable checkable
checkbox-position="left" checkbox-position="left"
> >
<template slot-scope="props"> <b-table-column field="actor.id" label="ID" width="40" numeric v-slot="props">{{
<b-table-column field="actor.id" label="ID" width="40" numeric>{{
props.row.actor.id props.row.actor.id
}}</b-table-column> }}</b-table-column>
<b-table-column field="actor.type" :label="$t('Type')" width="80"> <b-table-column field="actor.type" :label="$t('Type')" width="80" v-slot="props">
<b-icon icon="lan" v-if="RelayMixin.isInstance(props.row.actor)" /> <b-icon icon="lan" v-if="RelayMixin.isInstance(props.row.actor)" />
<b-icon icon="account-circle" v-else /> <b-icon icon="account-circle" v-else />
</b-table-column> </b-table-column>
<b-table-column field="approved" :label="$t('Status')" width="100" sortable centered> <b-table-column
field="approved"
:label="$t('Status')"
width="100"
sortable
centered
v-slot="props"
>
<span :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`">{{ <span :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`">{{
props.row.approved ? $t("Accepted") : $t("Pending") props.row.approved ? $t("Accepted") : $t("Pending")
}}</span> }}</span>
</b-table-column> </b-table-column>
<b-table-column field="actor.domain" :label="$t('Domain')" sortable> <b-table-column field="actor.domain" :label="$t('Domain')" sortable>
<template> <template v-slot:default="props">
<a @click="toggle(props.row)" v-if="RelayMixin.isInstance(props.row.actor)">{{ <a @click="toggle(props.row)" v-if="RelayMixin.isInstance(props.row.actor)">{{
props.row.actor.domain props.row.actor.domain
}}</a> }}</a>
@ -43,12 +49,11 @@
</template> </template>
</b-table-column> </b-table-column>
<b-table-column field="targetActor.updatedAt" :label="$t('Date')" sortable> <b-table-column field="targetActor.updatedAt" :label="$t('Date')" sortable v-slot="props">
<span :title="$options.filters.formatDateTimeString(props.row.updatedAt)">{{ <span :title="$options.filters.formatDateTimeString(props.row.updatedAt)">{{
timeago(props.row.updatedAt) timeago(props.row.updatedAt)
}}</span></b-table-column }}</span></b-table-column
> >
</template>
<template slot="detail" slot-scope="props"> <template slot="detail" slot-scope="props">
<article> <article>

19
js/src/components/Admin/Followings.vue
View File

@ -29,24 +29,30 @@
checkable checkable
checkbox-position="left" checkbox-position="left"
> >
<template slot-scope="props"> <b-table-column field="targetActor.id" label="ID" width="40" numeric v-slot="props">{{
<b-table-column field="targetActor.id" label="ID" width="40" numeric>{{
props.row.targetActor.id props.row.targetActor.id
}}</b-table-column> }}</b-table-column>
<b-table-column field="targetActor.type" :label="$t('Type')" width="80"> <b-table-column field="targetActor.type" :label="$t('Type')" width="80" v-slot="props">
<b-icon icon="lan" v-if="RelayMixin.isInstance(props.row.targetActor)" /> <b-icon icon="lan" v-if="RelayMixin.isInstance(props.row.targetActor)" />
<b-icon icon="account-circle" v-else /> <b-icon icon="account-circle" v-else />
</b-table-column> </b-table-column>
<b-table-column field="approved" :label="$t('Status')" width="100" sortable centered> <b-table-column
field="approved"
:label="$t('Status')"
width="100"
sortable
centered
v-slot="props"
>
<span :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`">{{ <span :class="`tag ${props.row.approved ? 'is-success' : 'is-danger'}`">{{
props.row.approved ? $t("Accepted") : $t("Pending") props.row.approved ? $t("Accepted") : $t("Pending")
}}</span> }}</span>
</b-table-column> </b-table-column>
<b-table-column field="targetActor.domain" :label="$t('Domain')" sortable> <b-table-column field="targetActor.domain" :label="$t('Domain')" sortable>
<template> <template v-slot:default="props">
<a @click="toggle(props.row)" v-if="RelayMixin.isInstance(props.row.targetActor)">{{ <a @click="toggle(props.row)" v-if="RelayMixin.isInstance(props.row.targetActor)">{{
props.row.targetActor.domain props.row.targetActor.domain
}}</a> }}</a>
@ -56,12 +62,11 @@
</template> </template>
</b-table-column> </b-table-column>
<b-table-column field="targetActor.updatedAt" :label="$t('Date')" sortable> <b-table-column field="targetActor.updatedAt" :label="$t('Date')" sortable v-slot="props">
<span :title="$options.filters.formatDateTimeString(props.row.updatedAt)">{{ <span :title="$options.filters.formatDateTimeString(props.row.updatedAt)">{{
timeago(props.row.updatedAt) timeago(props.row.updatedAt)
}}</span></b-table-column }}</span></b-table-column
> >
</template>
<template slot="detail" slot-scope="props"> <template slot="detail" slot-scope="props">
<article> <article>

4
js/src/i18n/en_US.json
View File

@ -760,5 +760,7 @@
"You have been removed from this group's members.": "You have been removed from this group's members.", "You have been removed from this group's members.": "You have been removed from this group's members.",
"Since you are a new member, private content can take a few minutes to appear.": "Since you are a new member, private content can take a few minutes to appear.", "Since you are a new member, private content can take a few minutes to appear.": "Since you are a new member, private content can take a few minutes to appear.",
"Leave group": "Leave group", "Leave group": "Leave group",
"Remove": "Remove" "Remove": "Remove",
"Update": "Update",
"Search…": "Search…"
} }

4
js/src/i18n/fr_FR.json
View File

@ -761,5 +761,7 @@
"You have been removed from this group's members.": "Vous avez été exclu des membres de ce groupe.", "You have been removed from this group's members.": "Vous avez été exclu des membres de ce groupe.",
"Since you are a new member, private content can take a few minutes to appear.": "Étant donné que vous êtes un·e nouveau·elle membre, le contenu privé peut mettre quelques minutes à arriver.", "Since you are a new member, private content can take a few minutes to appear.": "Étant donné que vous êtes un·e nouveau·elle membre, le contenu privé peut mettre quelques minutes à arriver.",
"Leave group": "Quitter le groupe", "Leave group": "Quitter le groupe",
"Remove": "Exclure" "Remove": "Exclure",
"Update": "Éditer",
"Search…": "Rechercher…"
} }

12
js/src/views/Admin/AdminProfile.vue
View File

@ -71,16 +71,14 @@
:per-page="EVENTS_PER_PAGE" :per-page="EVENTS_PER_PAGE"
@page-change="onOrganizedEventsPageChange" @page-change="onOrganizedEventsPageChange"
> >
<template slot-scope="props"> <b-table-column field="beginsOn" :label="$t('Begins on')" v-slot="props">
<b-table-column field="beginsOn" :label="$t('Begins on')">
{{ props.row.beginsOn | formatDateTimeString }} {{ props.row.beginsOn | formatDateTimeString }}
</b-table-column> </b-table-column>
<b-table-column field="title" :label="$t('Title')"> <b-table-column field="title" :label="$t('Title')" v-slot="props">
<router-link :to="{ name: RouteName.EVENT, params: { uuid: props.row.uuid } }"> <router-link :to="{ name: RouteName.EVENT, params: { uuid: props.row.uuid } }">
{{ props.row.title }} {{ props.row.title }}
</router-link> </router-link>
</b-table-column> </b-table-column>
</template>
<template slot="empty"> <template slot="empty">
<section class="section"> <section class="section">
<div class="content has-text-grey has-text-centered"> <div class="content has-text-grey has-text-centered">
@ -107,16 +105,14 @@
:per-page="EVENTS_PER_PAGE" :per-page="EVENTS_PER_PAGE"
@page-change="onParticipationsPageChange" @page-change="onParticipationsPageChange"
> >
<template slot-scope="props"> <b-table-column field="beginsOn" :label="$t('Begins on')" v-slot="props">
<b-table-column field="beginsOn" :label="$t('Begins on')">
{{ props.row.beginsOn | formatDateTimeString }} {{ props.row.beginsOn | formatDateTimeString }}
</b-table-column> </b-table-column>
<b-table-column field="title" :label="$t('Title')"> <b-table-column field="title" :label="$t('Title')" v-slot="props">
<router-link :to="{ name: RouteName.EVENT, params: { uuid: props.row.uuid } }"> <router-link :to="{ name: RouteName.EVENT, params: { uuid: props.row.uuid } }">
{{ props.row.title }} {{ props.row.title }}
</router-link> </router-link>
</b-table-column> </b-table-column>
</template>
<template slot="empty"> <template slot="empty">
<section class="section"> <section class="section">
<div class="content has-text-grey has-text-centered"> <div class="content has-text-grey has-text-centered">

6
js/src/views/Admin/Profiles.vue
View File

@ -24,7 +24,6 @@
@page-change="onPageChange" @page-change="onPageChange"
@filters-change="onFiltersChange" @filters-change="onFiltersChange"
> >
<template slot-scope="props">
<b-table-column field="preferredUsername" :label="$t('Username')" searchable> <b-table-column field="preferredUsername" :label="$t('Username')" searchable>
<template slot="searchable" slot-scope="props"> <template slot="searchable" slot-scope="props">
<b-input <b-input
@ -34,6 +33,7 @@
size="is-small" size="is-small"
/> />
</template> </template>
<template v-slot:default="props">
<router-link <router-link
class="profile" class="profile"
:to="{ name: RouteName.ADMIN_PROFILE, params: { id: props.row.id } }" :to="{ name: RouteName.ADMIN_PROFILE, params: { id: props.row.id } }"
@ -53,6 +53,7 @@
</div> </div>
</article> </article>
</router-link> </router-link>
</template>
</b-table-column> </b-table-column>
<b-table-column field="domain" :label="$t('Domain')" searchable> <b-table-column field="domain" :label="$t('Domain')" searchable>
@ -64,9 +65,10 @@
size="is-small" size="is-small"
/> />
</template> </template>
<template v-slot:default="props">
{{ props.row.domain }} {{ props.row.domain }}
</b-table-column>
</template> </template>
</b-table-column>
<template slot="empty"> <template slot="empty">
<section class="section"> <section class="section">
<div class="content has-text-grey has-text-centered"> <div class="content has-text-grey has-text-centered">

20
js/src/views/Admin/Users.vue
View File

@ -25,19 +25,19 @@
@page-change="onPageChange" @page-change="onPageChange"
@filters-change="onFiltersChange" @filters-change="onFiltersChange"
> >
<template slot-scope="props"> <b-table-column field="id" width="40" numeric v-slot="props">
<b-table-column field="id" width="40" numeric>
{{ props.row.id }} {{ props.row.id }}
</b-table-column> </b-table-column>
<b-table-column field="email" :label="$t('Email')" searchable> <b-table-column field="email" :label="$t('Email')" searchable>
<template slot="searchable" slot-scope="props"> <template slot="searchable" slot-scope="props">
<b-input <b-input
v-model="props.filters.email" v-model="props.filters.email"
placeholder="Search..." :placeholder="$t('Search…')"
icon="magnify" icon="magnify"
size="is-small" size="is-small"
/> />
</template> </template>
<template v-slot:default="props">
<router-link <router-link
class="user-profile" class="user-profile"
:to="{ name: RouteName.ADMIN_USER_PROFILE, params: { id: props.row.id } }" :to="{ name: RouteName.ADMIN_USER_PROFILE, params: { id: props.row.id } }"
@ -45,8 +45,14 @@
> >
{{ props.row.email }} {{ props.row.email }}
</router-link> </router-link>
</template>
</b-table-column> </b-table-column>
<b-table-column field="confirmedAt" :label="$t('Confirmed at')" :centered="true"> <b-table-column
field="confirmedAt"
:label="$t('Confirmed at')"
:centered="true"
v-slot="props"
>
<template v-if="props.row.confirmedAt"> <template v-if="props.row.confirmedAt">
{{ props.row.confirmedAt | formatDateTimeString }} {{ props.row.confirmedAt | formatDateTimeString }}
</template> </template>
@ -54,10 +60,9 @@
{{ $t("Not confirmed") }} {{ $t("Not confirmed") }}
</template> </template>
</b-table-column> </b-table-column>
<b-table-column field="locale" :label="$t('Language')" :centered="true"> <b-table-column field="locale" :label="$t('Language')" :centered="true" v-slot="props">
{{ props.row.locale }} {{ props.row.locale }}
</b-table-column> </b-table-column>
</template>
<template slot="detail" slot-scope="props"> <template slot="detail" slot-scope="props">
<router-link <router-link
@ -68,9 +73,10 @@
> >
<article class="media"> <article class="media">
<figure class="media-left"> <figure class="media-left">
<p class="image is-64x64"> <p class="image is-32x32" v-if="actor.avatar">
<img :src="actor.avatar.url" /> <img :src="actor.avatar.url" />
</p> </p>
<b-icon v-else size="is-medium" icon="account-circle" />
</figure> </figure>
<div class="media-content"> <div class="media-content">
<div class="content"> <div class="content">

10
js/src/views/Event/Participants.vue
View File

@ -72,8 +72,7 @@
@page-change="(newPage) => (page = newPage)" @page-change="(newPage) => (page = newPage)"
@sort="(field, order) => $emit('sort', field, order)" @sort="(field, order) => $emit('sort', field, order)"
> >
<template slot-scope="props"> <b-table-column field="actor.preferredUsername" :label="$t('Participant')" v-slot="props">
<b-table-column field="actor.preferredUsername" :label="$t('Participant')">
<article class="media"> <article class="media">
<figure class="media-left image is-48x48" v-if="props.row.actor.avatar"> <figure class="media-left image is-48x48" v-if="props.row.actor.avatar">
<img class="is-rounded" :src="props.row.actor.avatar.url" alt="" /> <img class="is-rounded" :src="props.row.actor.avatar.url" alt="" />
@ -101,7 +100,7 @@
</div> </div>
</article> </article>
</b-table-column> </b-table-column>
<b-table-column field="role" :label="$t('Role')"> <b-table-column field="role" :label="$t('Role')" v-slot="props">
<b-tag type="is-primary" v-if="props.row.role === ParticipantRole.CREATOR"> <b-tag type="is-primary" v-if="props.row.role === ParticipantRole.CREATOR">
{{ $t("Organizer") }} {{ $t("Organizer") }}
</b-tag> </b-tag>
@ -115,7 +114,7 @@
{{ $t("Rejected") }} {{ $t("Rejected") }}
</b-tag> </b-tag>
</b-table-column> </b-table-column>
<b-table-column field="metadata.message" :label="$t('Message')"> <b-table-column field="metadata.message" :label="$t('Message')" v-slot="props">
<span <span
@click="toggleQueueDetails(props.row)" @click="toggleQueueDetails(props.row)"
:class="{ :class="{
@ -129,14 +128,13 @@
{{ $t("No message") }} {{ $t("No message") }}
</span> </span>
</b-table-column> </b-table-column>
<b-table-column field="insertedAt" :label="$t('Date')"> <b-table-column field="insertedAt" :label="$t('Date')" v-slot="props">
<span class="has-text-centered"> <span class="has-text-centered">
{{ props.row.insertedAt | formatDateString }}<br />{{ {{ props.row.insertedAt | formatDateString }}<br />{{
props.row.insertedAt | formatTimeString props.row.insertedAt | formatTimeString
}} }}
</span> </span>
</b-table-column> </b-table-column>
</template>
<template slot="detail" slot-scope="props"> <template slot="detail" slot-scope="props">
<article v-html="nl2br(props.row.metadata.message)" /> <article v-html="nl2br(props.row.metadata.message)" />
</template> </template>

10
js/src/views/Group/GroupMembers.vue
View File

@ -89,8 +89,7 @@
@page-change="(newPage) => (page = newPage)" @page-change="(newPage) => (page = newPage)"
@sort="(field, order) => $emit('sort', field, order)" @sort="(field, order) => $emit('sort', field, order)"
> >
<template slot-scope="props"> <b-table-column field="actor.preferredUsername" :label="$t('Member')" v-slot="props">
<b-table-column field="actor.preferredUsername" :label="$t('Member')">
<article class="media"> <article class="media">
<figure class="media-left image is-48x48" v-if="props.row.actor.avatar"> <figure class="media-left image is-48x48" v-if="props.row.actor.avatar">
<img class="is-rounded" :src="props.row.actor.avatar.url" alt="" /> <img class="is-rounded" :src="props.row.actor.avatar.url" alt="" />
@ -107,7 +106,7 @@
</div> </div>
</article> </article>
</b-table-column> </b-table-column>
<b-table-column field="role" :label="$t('Role')"> <b-table-column field="role" :label="$t('Role')" v-slot="props">
<b-tag type="is-primary" v-if="props.row.role === MemberRole.ADMINISTRATOR"> <b-tag type="is-primary" v-if="props.row.role === MemberRole.ADMINISTRATOR">
{{ $t("Administrator") }} {{ $t("Administrator") }}
</b-tag> </b-tag>
@ -127,14 +126,14 @@
{{ $t("Invited") }} {{ $t("Invited") }}
</b-tag> </b-tag>
</b-table-column> </b-table-column>
<b-table-column field="insertedAt" :label="$t('Date')"> <b-table-column field="insertedAt" :label="$t('Date')" v-slot="props">
<span class="has-text-centered"> <span class="has-text-centered">
{{ props.row.insertedAt | formatDateString }}<br />{{ {{ props.row.insertedAt | formatDateString }}<br />{{
props.row.insertedAt | formatTimeString props.row.insertedAt | formatTimeString
}} }}
</span> </span>
</b-table-column> </b-table-column>
<b-table-column field="actions" :label="$t('Actions')"> <b-table-column field="actions" :label="$t('Actions')" v-slot="props">
<b-button <b-button
v-if="props.row.role === MemberRole.MEMBER" v-if="props.row.role === MemberRole.MEMBER"
@click="removeMember(props.row.id)" @click="removeMember(props.row.id)"
@ -142,7 +141,6 @@
>{{ $t("Remove") }}</b-button >{{ $t("Remove") }}</b-button
> >
</b-table-column> </b-table-column>
</template>
<template slot="empty"> <template slot="empty">
<section class="section"> <section class="section">
<div class="content has-text-grey has-text-centered"> <div class="content has-text-grey has-text-centered">