potsda.mn/mobilizon
10
4
Fork 1
Code Issues 22 Pull requests 1 Projects Releases Wiki Activity

Lint JS files

Browse source 
Signed-off-by: Thomas Citharel <tcit@tcit.fr>
This commit is contained in:
Thomas Citharel 2019-03-22 10:57:14 +01:00
parent e319735ab9
commit b698eb470f
No known key found for this signature in database
GPG key ID: A061B9DDE0CA0773
27 changed files with 237 additions and 243 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
js/src/App.vue
View file

@ -21,55 +21,55 @@ import NavBar from '@/components/NavBar.vue';
import { Component, Vue } from 'vue-property-decorator';
import { AUTH_TOKEN, AUTH_USER_ACTOR, AUTH_USER_EMAIL, AUTH_USER_ID } from '@/constants';
import { CURRENT_USER_CLIENT, UPDATE_CURRENT_USER_CLIENT } from '@/graphql/user';
import { ICurrentUser } from '@/types/current-user.model'
import { ICurrentUser } from '@/types/current-user.model';
@Component({
apollo: {
currentUser: {
query: CURRENT_USER_CLIENT
}
query: CURRENT_USER_CLIENT,
},
},
components: {
NavBar
}
NavBar,
},
})
export default class App extends Vue {
drawer = false;
fab = false;
items = [
{
icon: "poll",
text: "Events",
route: "EventList",
role: null
icon: 'poll',
text: 'Events',
route: 'EventList',
role: null,
},
{
icon: "group",
text: "Groups",
route: "GroupList",
role: null
icon: 'group',
text: 'Groups',
route: 'GroupList',
role: null,
},
{ icon: "settings", text: "Settings", role: "ROLE_USER" },
{ icon: "chat_bubble", text: "Send feedback", role: "ROLE_USER" },
{ icon: "help", text: "Help", role: null },
{ icon: "phonelink", text: "App downloads", role: null }
{ icon: 'settings', text: 'Settings', role: 'ROLE_USER' },
{ icon: 'chat_bubble', text: 'Send feedback', role: 'ROLE_USER' },
{ icon: 'help', text: 'Help', role: null },
{ icon: 'phonelink', text: 'App downloads', role: null },
];
error = {
timeout: 3000,
show: false,
text: ""
text: '',
};
currentUser!: ICurrentUser;
actor = localStorage.getItem(AUTH_USER_ACTOR);
mounted () {
this.initializeCurrentUser()
this.initializeCurrentUser();
}
get displayed_name () {
// FIXME: load actor
return "no implemented";
return 'no implemented';
// return this.actor.display_name === null ? this.actor.username : this.actor.display_name
}

10
js/src/components/Event/EventCard.vue
View file

@ -10,7 +10,7 @@
<router-link :to="{ name: 'Event', params:{ uuid: event.uuid } }">
<h2 class="title">{{ event.title }}</h2>
</router-link>
<span>{{ event.begins_on | formatDay }}</span>
<span>{{ event.beginsOn | formatDay }}</span>
</div>
<div v-if="!hideDetails">
<div v-if="event.participants.length === 1">
@ -33,8 +33,8 @@
</template>
<script lang="ts">
import {IEvent, ParticipantRole} from "@/types/event.model";
import { Component, Prop, Vue } from "vue-property-decorator";
import { IEvent, ParticipantRole } from '@/types/event.model';
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component
export default class EventCard extends Vue {
@ -43,8 +43,8 @@ export default class EventCard extends Vue {
data() {
return {
ParticipantRole: ParticipantRole
}
ParticipantRole,
};
}
}
</script>

4
js/src/components/Group/GroupCard.vue
View file

@ -19,8 +19,8 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { IGroup } from "../../types/actor.model";
import { Component, Prop, Vue } from 'vue-property-decorator';
import { IGroup } from '../../types/actor.model';
@Component
export default class GroupCard extends Vue {

40
js/src/components/NavBar.vue
View file

@ -43,14 +43,14 @@
</template>
<script lang="ts">
import { Component, Vue, Watch } from "vue-property-decorator";
import { SEARCH } from "@/graphql/search";
import { CURRENT_USER_CLIENT } from "@/graphql/user";
import { onLogout } from "@/vue-apollo";
import { deleteUserData } from "@/utils/auth";
import { LOGGED_PERSON } from "@/graphql/actor";
import { Component, Vue, Watch } from 'vue-property-decorator';
import { SEARCH } from '@/graphql/search';
import { CURRENT_USER_CLIENT } from '@/graphql/user';
import { onLogout } from '@/vue-apollo';
import { deleteUserData } from '@/utils/auth';
import { LOGGED_PERSON } from '@/graphql/actor';
import { IActor, IPerson } from '@/types/actor.model';
import { RouteName } from '@/router'
import { RouteName } from '@/router';
@Component({
apollo: {
@ -58,25 +58,25 @@ import { RouteName } from '@/router'
query: SEARCH,
variables() {
return {
searchText: this.searchText
searchText: this.searchText,
};
},
skip() {
return !this.searchText;
}
},
},
currentUser: {
query: CURRENT_USER_CLIENT
query: CURRENT_USER_CLIENT,
},
loggedPerson: {
query: LOGGED_PERSON
}
}
query: LOGGED_PERSON,
},
},
})
export default class NavBar extends Vue {
notifications = [
{ header: "Coucou" },
{ title: "T'as une notification", subtitle: "Et elle est cool" }
{ header: 'Coucou' },
{ title: "T'as une notification", subtitle: 'Et elle est cool' },
];
model = null;
search: any[] = [];
@ -87,12 +87,12 @@ export default class NavBar extends Vue {
get items() {
return this.search.map(searchEntry => {
switch (searchEntry.__typename) {
case "Actor":
case 'Actor':
searchEntry.label =
searchEntry.preferredUsername +
(searchEntry.domain === null ? "" : `@${searchEntry.domain}`);
(searchEntry.domain === null ? '' : `@${searchEntry.domain}`);
break;
case "Event":
case 'Event':
searchEntry.label = searchEntry.title;
break;
}
@ -124,8 +124,8 @@ export default class NavBar extends Vue {
}
enter() {
console.log("enter");
this.$apollo.queries["search"].refetch();
console.log('enter');
this.$apollo.queries['search'].refetch();
}
logout() {

8
js/src/graphql/event.ts
View file

@ -24,8 +24,8 @@ export const FETCH_EVENT = gql`
status,
visibility,
thumbnail,
large_image,
publish_at,
largeImage,
publishAt,
category,
# online_address,
# phone_address,
@ -60,8 +60,8 @@ export const FETCH_EVENTS = gql`
status,
visibility,
thumbnail,
large_image,
publish_at,
largeImage,
publishAt,
# online_address,
# phone_address,
organizerActor {

6
js/src/main.ts
View file

@ -3,7 +3,7 @@
import Vue from 'vue';
// import * as VueGoogleMaps from 'vue2-google-maps';
import VueSimpleMarkdown from 'vue-simple-markdown';
import Buefy from 'buefy'
import Buefy from 'buefy';
import 'buefy/dist/buefy.css';
import GetTextPlugin from 'vue-gettext';
import App from '@/App.vue';
@ -16,7 +16,7 @@ Vue.config.productionTip = false;
Vue.use(VueSimpleMarkdown);
Vue.use(Buefy, {
defaultContainerElement: '#mobilizon'
defaultContainerElement: '#mobilizon',
});
const language = (window.navigator as any).userLanguage || window.navigator.language;
@ -34,8 +34,8 @@ Vue.config.language = language.replace('-', '_');
/* eslint-disable no-new */
new Vue({
router,
apolloProvider,
el: '#app',
template: '<App/>',
apolloProvider,
components: { App },
});

4
js/src/types/current-user.model.ts
View file

@ -1,4 +1,4 @@
export interface ICurrentUser {
id: number,
email: string,
id: number;
email: string;
}

22
js/src/types/event.model.ts
View file

@ -1,4 +1,4 @@
import {Actor, IActor} from './actor.model';
import { Actor, IActor } from './actor.model';
export enum EventStatus {
TENTATIVE,
@ -51,17 +51,17 @@ export interface IEvent {
description: string;
category: Category;
begins_on: Date;
ends_on: Date;
publish_at: Date;
beginsOn: Date;
endsOn: Date;
publishAt: Date;
status: EventStatus;
visibility: EventVisibility;
join_options: EventJoinOptions;
joinOptions: EventJoinOptions;
thumbnail: string;
large_image: string;
largeImage: string;
organizerActor: IActor;
attributedTo: IActor;
@ -73,15 +73,15 @@ export interface IEvent {
export class EventModel implements IEvent {
begins_on: Date = new Date();
beginsOn: Date = new Date();
category: Category = Category.MEETING;
description: string = '';
ends_on: Date = new Date();
join_options: EventJoinOptions = EventJoinOptions.FREE;
large_image: string = '';
endsOn: Date = new Date();
joinOptions: EventJoinOptions = EventJoinOptions.FREE;
largeImage: string = '';
local: boolean = true;
participants: IParticipant[] = [];
publish_at: Date = new Date();
publishAt: Date = new Date();
status: EventStatus = EventStatus.CONFIRMED;
thumbnail: string = '';
title: string = '';

4
js/src/types/login.model.ts
View file

@ -1,7 +1,7 @@
import { ICurrentUser } from '@/types/current-user.model';
export interface ILogin {
user: ICurrentUser,
user: ICurrentUser;
token: string,
token: string;
}

2
js/src/utils/auth.ts
View file

@ -8,7 +8,7 @@ export function saveUserData(obj: ILogin) {
}
export function deleteUserData() {
for (const key of [ AUTH_USER_ID, AUTH_USER_EMAIL, AUTH_TOKEN ]) {
for (const key of [AUTH_USER_ID, AUTH_USER_EMAIL, AUTH_TOKEN]) {
localStorage.removeItem(key);
}
}

16
js/src/views/Account/Identities.vue
View file

@ -46,19 +46,19 @@
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { IDENTITIES, LOGGED_PERSON, CREATE_PERSON } from "../../graphql/actor";
import { IPerson } from "@/types/actor.model";
import { Component, Vue } from 'vue-property-decorator';
import { IDENTITIES, LOGGED_PERSON, CREATE_PERSON } from '../../graphql/actor';
import { IPerson } from '@/types/actor.model';
@Component({
apollo: {
identities: {
query: IDENTITIES
query: IDENTITIES,
},
loggedPerson: {
query: LOGGED_PERSON
}
}
query: LOGGED_PERSON,
},
},
})
export default class Identities extends Vue {
identities: IPerson[] = [];
@ -73,7 +73,7 @@ export default class Identities extends Vue {
try {
await this.$apollo.mutate({
mutation: CREATE_PERSON,
variables: this.newPerson
variables: this.newPerson,
});
this.showCreateProfileForm = false;
this.$apollo.queries.identities.refresh();

24
js/src/views/Account/Profile.vue
View file

@ -66,10 +66,10 @@
</template>
<script lang="ts">
import { FETCH_PERSON, LOGGED_PERSON } from "@/graphql/actor";
import { Component, Prop, Vue, Watch } from "vue-property-decorator";
import EventCard from "@/components/Event/EventCard.vue";
import { RouteName } from '@/router'
import { FETCH_PERSON, LOGGED_PERSON } from '@/graphql/actor';
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import EventCard from '@/components/Event/EventCard.vue';
import { RouteName } from '@/router';
@Component({
apollo: {
@ -77,17 +77,17 @@ import { RouteName } from '@/router'
query: FETCH_PERSON,
variables() {
return {
name: this.$route.params.name
name: this.$route.params.name,
};
}
},
},
loggedPerson: {
query: LOGGED_PERSON
}
query: LOGGED_PERSON,
},
},
components: {
EventCard
}
EventCard,
},
})
export default class Profile extends Vue {
@Prop({ type: String, required: true }) name!: string;
@ -95,7 +95,7 @@ export default class Profile extends Vue {
person = null;
// call again the method if the route changes
@Watch("$route")
@Watch('$route')
onRouteChange() {
// this.fetchData()
}
@ -106,7 +106,7 @@ export default class Profile extends Vue {
}
nl2br(text) {
return text.replace(/(?:\r\n|\r|\n)/g, "<br>");
return text.replace(/(?:\r\n|\r|\n)/g, '<br>');
}
}
</script>

12
js/src/views/Account/Register.vue
View file

@ -70,11 +70,11 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { IPerson } from "@/types/actor.model";
import { REGISTER_PERSON } from "@/graphql/actor";
import { MOBILIZON_INSTANCE_HOST } from "@/api/_entrypoint";
import { RouteName } from '@/router'
import { Component, Prop, Vue } from 'vue-property-decorator';
import { IPerson } from '@/types/actor.model';
import { REGISTER_PERSON } from '@/graphql/actor';
import { MOBILIZON_INSTANCE_HOST } from '@/api/_entrypoint';
import { RouteName } from '@/router';
@Component
export default class Register extends Vue {
@ -104,7 +104,7 @@ export default class Register extends Vue {
this.errors = {};
await this.$apollo.mutate({
mutation: REGISTER_PERSON,
variables: Object.assign({ email: this.email }, this.person)
variables: Object.assign({ email: this.email }, this.person),
});
this.validationSent = true;

40
js/src/views/Event/Create.vue
View file

@ -10,7 +10,7 @@
<b-input aria-required="true" required v-model="event.title"/>
</b-field>
<b-datepicker v-model="event.begins_on" inline></b-datepicker>
<b-datepicker v-model="event.beginsOn" inline></b-datepicker>
<b-field :label="$gettext('Category')">
<b-select placeholder="Select a category" v-model="event.category">
@ -31,23 +31,23 @@
</template>
<script lang="ts">
// import Location from '@/components/Location';
import {CREATE_EVENT, EDIT_EVENT} from "@/graphql/event";
import {Component, Prop, Vue} from "vue-property-decorator";
import {
// import Location from '@/components/Location';
import { CREATE_EVENT, EDIT_EVENT } from '@/graphql/event';
import { Component, Prop, Vue } from 'vue-property-decorator';
import {
Category,
IEvent,
EventModel,
} from "@/types/event.model";
import {LOGGED_PERSON} from "@/graphql/actor";
import {IPerson, Person} from "@/types/actor.model";
} from '@/types/event.model';
import { LOGGED_PERSON } from '@/graphql/actor';
import { IPerson, Person } from '@/types/actor.model';
@Component({
apollo: {
loggedPerson: {
query: LOGGED_PERSON,
}
}
},
},
})
export default class CreateEvent extends Vue {
@Prop({ required: false, type: String }) uuid!: string;
@ -61,23 +61,23 @@ export default class CreateEvent extends Vue {
this.event.organizerActor = this.loggedPerson;
this.event.attributedTo = this.loggedPerson;
if (this.event.uuid === "") {
if (this.event.uuid === '') {
this.$apollo
.mutate({
mutation: CREATE_EVENT,
variables: {
title: this.event.title,
description: this.event.description,
beginsOn: this.event.begins_on,
beginsOn: this.event.beginsOn,
category: this.event.category,
organizerActorId: this.event.organizerActor.id
}
organizerActorId: this.event.organizerActor.id,
},
})
.then(data => {
console.log("event created", data);
console.log('event created', data);
this.$router.push({
name: "Event",
params: { uuid: data.data.createEvent.uuid }
name: 'Event',
params: { uuid: data.data.createEvent.uuid },
});
})
.catch(error => {
@ -86,12 +86,12 @@ export default class CreateEvent extends Vue {
} else {
this.$apollo
.mutate({
mutation: EDIT_EVENT
mutation: EDIT_EVENT,
})
.then(data => {
this.$router.push({
name: "Event",
params: { uuid: data.data.uuid }
name: 'Event',
params: { uuid: data.data.uuid },
});
})
.catch(error => {

31
js/src/views/Event/Event.vue
View file

@ -9,7 +9,7 @@
</figure>
</div>
<div class="card-content">
<span>{{ event.begins_on | formatDay }}</span>
<span>{{ event.beginsOn | formatDay }}</span>
<span class="tag is-primary">{{ event.category }}</span>
<h1 class="title">{{ event.title }}</h1>
<router-link
@ -44,7 +44,7 @@
</p>
</div>
<div>
<span>{{ event.begins_on | formatDate }} - {{ event.ends_on | formatDate }}</span>
<span>{{ event.beginsOn | formatDate }} - {{ event.endsOn | formatDate }}</span>
</div>
<p v-if="actorIsOrganizer()">
<translate>You are an organizer.</translate>
@ -100,11 +100,10 @@
</template>
<script lang="ts">
import { DELETE_EVENT, FETCH_EVENT, LEAVE_EVENT } from '@/graphql/event';
import { DELETE_EVENT, FETCH_EVENT, JOIN_EVENT, LEAVE_EVENT } from '@/graphql/event';
import { Component, Prop, Vue } from 'vue-property-decorator';
import { LOGGED_PERSON } from '@/graphql/actor';
import { IEvent, IParticipant } from '@/types/event.model';
import { JOIN_EVENT } from '@/graphql/event';
import { IPerson } from '@/types/actor.model';
import { RouteName } from '@/router';
import 'vue-simple-markdown/dist/vue-simple-markdown.css';
@ -115,14 +114,14 @@ import 'vue-simple-markdown/dist/vue-simple-markdown.css';
query: FETCH_EVENT,
variables() {
return {
uuid: this.uuid
uuid: this.uuid,
};
}
},
},
loggedPerson: {
query: LOGGED_PERSON
}
}
query: LOGGED_PERSON,
},
},
})
export default class Event extends Vue {
@Prop({ type: String, required: true }) uuid!: string;
@ -140,10 +139,10 @@ export default class Event extends Vue {
variables: {
id: this.event.id,
actorId: this.loggedPerson.id,
}
},
});
router.push({ name: RouteName.EVENT })
router.push({ name: RouteName.EVENT });
} catch (error) {
console.error(error);
}
@ -161,13 +160,13 @@ export default class Event extends Vue {
const event = store.readQuery<IEvent>({ query: FETCH_EVENT });
if (event === null) {
console.error('Cannot update event participant cache, because of null value.');
return
return;
}
event.participants = event.participants.concat([ joinEvent ]);
event.participants = event.participants.concat([joinEvent]);
store.writeQuery({ query: FETCH_EVENT, data: event });
}
},
});
} catch (error) {
console.error(error);
@ -186,14 +185,14 @@ export default class Event extends Vue {
const event = store.readQuery<IEvent>({ query: FETCH_EVENT });
if (event === null) {
console.error('Cannot update event participant cache, because of null value.');
return
return;
}
event.participants = event.participants
.filter(p => p.actor.id !== leaveEvent.actor.id);
store.writeQuery({ query: FETCH_EVENT, data: event });
}
},
});
} catch (error) {
console.error(error);

10
js/src/views/Event/EventList.vue
View file

@ -27,8 +27,8 @@ const ngeohash = require('ngeohash');
@Component({
components: {
EventCard
}
EventCard,
},
})
export default class EventList extends Vue {
@Prop(String) location!: string;
@ -39,7 +39,7 @@ export default class EventList extends Vue {
locationText = '';
created() {
this.fetchData(this.$router.currentRoute.params["location"]);
this.fetchData(this.$router.currentRoute.params['location']);
}
beforeRouteUpdate(to, from, next) {
@ -47,7 +47,7 @@ export default class EventList extends Vue {
next();
}
@Watch("locationChip")
@Watch('locationChip')
onLocationChipChange(val) {
if (val === false) {
this.$router.push({ name: RouteName.EVENT_LIST });
@ -61,7 +61,7 @@ export default class EventList extends Vue {
}
fetchData(location) {
let queryString = "/events";
let queryString = '/events';
if (location) {
queryString += `?geohash=${location}`;
const { latitude, longitude } = ngeohash.decode(location);

6
js/src/views/Group/Create.vue
View file

@ -26,7 +26,7 @@
</template>
<script lang="ts">
import { Component, Vue } from "vue-property-decorator";
import { Component, Vue } from 'vue-property-decorator';
@Component({})
export default class CreateGroup extends Vue {
@ -74,13 +74,13 @@ export default class CreateGroup extends Vue {
this.group.address = {
geo: {
latitude: addressData.latitude,
longitude: addressData.longitude
longitude: addressData.longitude,
},
addressCountry: addressData.country,
addressLocality: addressData.city,
addressRegion: addressData.administrative_area_level_1,
postalCode: addressData.postal_code,
streetAddress: `${addressData.street_number} ${addressData.route}`
streetAddress: `${addressData.street_number} ${addressData.route}`,
};
}
}

20
js/src/views/Group/Group.vue
View file

@ -60,9 +60,9 @@
</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 { Component, Prop, Vue, Watch } from 'vue-property-decorator';
import EventCard from '@/components/Event/EventCard.vue';
import { FETCH_PERSON, LOGGED_PERSON } from '@/graphql/actor';
@Component({
apollo: {
@ -70,17 +70,17 @@ import { FETCH_PERSON, LOGGED_PERSON } from "@/graphql/actor";
query: FETCH_PERSON,
variables() {
return {
name: this.$route.params.name
name: this.$route.params.name,
};
}
},
},
loggedPerson: {
query: LOGGED_PERSON
}
query: LOGGED_PERSON,
},
},
components: {
EventCard
}
EventCard,
},
})
export default class Group extends Vue {
@Prop({ type: String, required: true }) name!: string;
@ -92,7 +92,7 @@ export default class Group extends Vue {
this.fetchData();
}
@Watch("$route")
@Watch('$route')
onRouteChanged() {
// call again the method if the route changes
this.fetchData();

4
js/src/views/Group/GroupList.vue
View file

@ -32,7 +32,7 @@ export default class GroupList extends Vue {
}
usernameWithDomain(actor) {
return actor.username + (actor.domain === null ? "" : `@${actor.domain}`);
return actor.username + (actor.domain === null ? '' : `@${actor.domain}`);
}
fetchData() {
@ -57,7 +57,7 @@ export default class GroupList extends Vue {
viewActor(actor) {
this.$router.push({
name: RouteName.GROUP,
params: { name: this.usernameWithDomain(actor) }
params: { name: this.usernameWithDomain(actor) },
});
}

21
js/src/views/Home.vue
View file

@ -51,25 +51,20 @@ import { RouteName } from '@/router';
apollo: {
events: {
query: FETCH_EVENTS,
fetchPolicy: "no-cache" // Debug me: https://github.com/apollographql/apollo-client/issues/3030
fetchPolicy: 'no-cache', // Debug me: https://github.com/apollographql/apollo-client/issues/3030
},
loggedPerson: {
query: LOGGED_PERSON
query: LOGGED_PERSON,
},
currentUser: {
query: CURRENT_USER_CLIENT
}
query: CURRENT_USER_CLIENT,
},
},
components: {
EventCard
}
EventCard,
},
})
export default class Home extends Vue {
searchTerm = null;
location_field = {
loading: false,
search: null
};
events = [];
locations = [];
city = { name: null };
@ -124,9 +119,9 @@ export default class Home extends Vue {
const geoHash = ngeohash.encode(
addressData.latitude,
addressData.longitude,
11
11,
);
sessionStorage.setItem("City", geoHash);
sessionStorage.setItem('City', geoHash);
this.$router.push({ name: RouteName.EVENT_LIST, params: { location: geoHash } });
}

12
js/src/views/Location.vue
View file

@ -3,28 +3,28 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { Component, Prop, Vue } from 'vue-property-decorator';
@Component
export default class Location extends Vue {
@Prop(String) address!: string;
description = "Paris, France";
description = 'Paris, France';
center = { lat: 48.85, lng: 2.35 };
markers: any[] = [];
setPlace(place) {
this.center = {
lat: place.geometry.location.lat(),
lng: place.geometry.location.lng()
lng: place.geometry.location.lng(),
};
this.markers = [
{
position: { lat: this.center.lat, lng: this.center.lng }
}
position: { lat: this.center.lat, lng: this.center.lng },
},
];
this.$emit("input", place.formatted_address);
this.$emit('input', place.formatted_address);
}
}
</script>

34
js/src/views/User/Login.vue
View file

@ -53,29 +53,29 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { LOGIN } from "@/graphql/auth";
import { validateEmailField, validateRequiredField } from "@/utils/validators";
import { saveUserData } from "@/utils/auth";
import { ILogin } from "@/types/login.model";
import { UPDATE_CURRENT_USER_CLIENT } from "@/graphql/user";
import { onLogin } from "@/vue-apollo";
import { RouteName } from '@/router'
import { Component, Prop, Vue } from 'vue-property-decorator';
import { LOGIN } from '@/graphql/auth';
import { validateEmailField, validateRequiredField } from '@/utils/validators';
import { saveUserData } from '@/utils/auth';
import { ILogin } from '@/types/login.model';
import { UPDATE_CURRENT_USER_CLIENT } from '@/graphql/user';
import { onLogin } from '@/vue-apollo';
import { RouteName } from '@/router';
@Component
export default class Login extends Vue {
@Prop({ type: String, required: false, default: "" }) email!: string;
@Prop({ type: String, required: false, default: "" }) password!: string;
@Prop({ type: String, required: false, default: '' }) email!: string;
@Prop({ type: String, required: false, default: '' }) password!: string;
credentials = {
email: "",
password: ""
email: '',
password: '',
};
validationSent = false;
errors: string[] = [];
rules = {
required: validateRequiredField,
email: validateEmailField
email: validateEmailField,
};
user: any;
@ -99,8 +99,8 @@ export default class Login extends Vue {
mutation: LOGIN,
variables: {
email: this.credentials.email,
password: this.credentials.password
}
password: this.credentials.password,
},
});
saveUserData(result.data.login);
@ -109,8 +109,8 @@ export default class Login extends Vue {
mutation: UPDATE_CURRENT_USER_CLIENT,
variables: {
id: result.data.login.user.id,
email: this.credentials.email
}
email: this.credentials.email,
},
});
onLogin(this.$apollo);

28
js/src/views/User/PasswordReset.vue
View file

@ -35,28 +35,28 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { validateRequiredField } from "@/utils/validators";
import { RESET_PASSWORD } from "@/graphql/auth";
import { saveUserData } from "@/utils/auth";
import { ILogin } from "@/types/login.model";
import { RouteName } from '@/router'
import { Component, Prop, Vue } from 'vue-property-decorator';
import { validateRequiredField } from '@/utils/validators';
import { RESET_PASSWORD } from '@/graphql/auth';
import { saveUserData } from '@/utils/auth';
import { ILogin } from '@/types/login.model';
import { RouteName } from '@/router';
@Component
export default class PasswordReset extends Vue {
@Prop({ type: String, required: true }) token!: string;
credentials = {
password: "",
password_confirmation: ""
password: '',
password_confirmation: '',
} as { password: string; password_confirmation: string };
errors: string[] = [];
rules = {
password_length: value =>
value.length > 6 || "Password must be at least 6 characters long",
password_length: (value: string) =>
value.length > 6 || 'Password must be at least 6 characters long',
required: validateRequiredField,
password_equal: value =>
value === this.credentials.password || "Passwords must be the same"
password_equal: (value: string) =>
value === this.credentials.password || 'Passwords must be the same',
};
get samePasswords() {
@ -75,8 +75,8 @@ export default class PasswordReset extends Vue {
mutation: RESET_PASSWORD,
variables: {
password: this.credentials.password,
token: this.token
}
token: this.token,
},
});
saveUserData(result.data.resetPassword);

18
js/src/views/User/Register.vue
View file

@ -108,19 +108,19 @@
</template>
<script lang="ts">
import { CREATE_USER } from "@/graphql/user";
import { Component, Prop, Vue } from "vue-property-decorator";
import { UserRouteName } from '@/router/user'
import { CREATE_USER } from '@/graphql/user';
import { Component, Prop, Vue } from 'vue-property-decorator';
import { UserRouteName } from '@/router/user';
@Component
export default class Register extends Vue {
@Prop({ type: String, required: false, default: "" }) email!: string;
@Prop({ type: String, required: false, default: "" }) password!: string;
@Prop({ type: String, required: false, default: '' }) email!: string;
@Prop({ type: String, required: false, default: '' }) password!: string;
credentials = {
email: this.email,
password: this.password
}
password: this.password,
};
errors: object = {};
sendingValidation: boolean = false;
validationSent: boolean = false;
@ -132,14 +132,14 @@ export default class Register extends Vue {
await this.$apollo.mutate({
mutation: CREATE_USER,
variables: this.credentials
variables: this.credentials,
});
this.validationSent = true;
this.$router.push({
name: UserRouteName.REGISTER_PROFILE,
params: { email: this.credentials.email }
params: { email: this.credentials.email },
});
} catch (error) {
console.error(error);

20
js/src/views/User/ResendConfirmation.vue
View file

@ -27,28 +27,28 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { validateEmailField, validateRequiredField } from "@/utils/validators";
import { RESEND_CONFIRMATION_EMAIL } from "@/graphql/auth";
import { Component, Prop, Vue } from 'vue-property-decorator';
import { validateEmailField, validateRequiredField } from '@/utils/validators';
import { RESEND_CONFIRMATION_EMAIL } from '@/graphql/auth';
@Component
export default class ResendConfirmation extends Vue {
@Prop({ type: String, required: false, default: "" }) email!: string;
@Prop({ type: String, required: false, default: '' }) email!: string;
credentials = {
email: ""
email: '',
};
validationSent = false;
error = false;
state = {
email: {
status: null,
msg: ""
}
msg: '',
},
};
rules = {
required: validateRequiredField,
email: validateEmailField
email: validateEmailField,
};
mounted() {
@ -63,8 +63,8 @@ export default class ResendConfirmation extends Vue {
await this.$apollo.mutate({
mutation: RESEND_CONFIRMATION_EMAIL,
variables: {
email: this.credentials.email
}
email: this.credentials.email,
},
});
} catch (err) {
console.error(err);

24
js/src/views/User/SendPasswordReset.vue
View file

@ -28,29 +28,29 @@
</template>
<script lang="ts">
import { Component, Prop, Vue } from "vue-property-decorator";
import { validateEmailField, validateRequiredField } from "@/utils/validators";
import { SEND_RESET_PASSWORD } from "@/graphql/auth";
import { Component, Prop, Vue } from 'vue-property-decorator';
import { validateEmailField, validateRequiredField } from '@/utils/validators';
import { SEND_RESET_PASSWORD } from '@/graphql/auth';
@Component
export default class SendPasswordReset extends Vue {
@Prop({ type: String, required: false, default: "" }) email!: string;
@Prop({ type: String, required: false, default: '' }) email!: string;
credentials = {
email: ""
email: '',
} as { email: string };
validationSent: boolean = false;
errors: string[] = [];
state = {
email: {
status: null,
msg: ""
} as { status: boolean | null; msg: string }
msg: '',
} as { status: boolean | null; msg: string },
};
rules = {
required: validateRequiredField,
email: validateEmailField
email: validateEmailField,
};
mounted() {
@ -64,8 +64,8 @@ export default class SendPasswordReset extends Vue {
await this.$apollo.mutate({
mutation: SEND_RESET_PASSWORD,
variables: {
email: this.credentials.email
}
email: this.credentials.email,
},
});
this.validationSent = true;
@ -81,8 +81,8 @@ export default class SendPasswordReset extends Vue {
this.state = {
email: {
status: null,
msg: ""
}
msg: '',
},
};
}
}

14
js/src/views/User/Validate.vue
View file

@ -17,11 +17,11 @@
</template>
<script lang="ts">
import { VALIDATE_USER } from "@/graphql/user";
import { Component, Prop, Vue } from "vue-property-decorator";
import { AUTH_TOKEN, AUTH_USER_ID } from "@/constants";
import { RouteName } from '@/router'
import { UserRouteName } from '@/router/user'
import { VALIDATE_USER } from '@/graphql/user';
import { Component, Prop, Vue } from 'vue-property-decorator';
import { AUTH_TOKEN, AUTH_USER_ID } from '@/constants';
import { RouteName } from '@/router';
import { UserRouteName } from '@/router/user';
@Component
export default class Validate extends Vue {
@ -39,8 +39,8 @@ export default class Validate extends Vue {
const { data } = await this.$apollo.mutate({
mutation: VALIDATE_USER,
variables: {
token: this.token
}
token: this.token,
},
});
this.saveUserData(data);