Thomas Citharel
3 years ago
149 changed files with 5600 additions and 4660 deletions
-
4.gitignore
-
5.gitlab-ci.yml
-
8config/config.exs
-
5docker/tests/Dockerfile
-
8js/.eslintrc.js
-
6js/.postcssrc.js
-
58js/Makefile
-
38js/get_union_json.js
-
2180js/package-lock.json
-
18js/package.json
-
48js/src/App.vue
-
5js/src/actions/login.js
-
29js/src/api/eventFetch.js
-
120js/src/auth/index.js
-
366js/src/components/Account/Account.vue
-
35js/src/components/Account/Identities.vue
-
149js/src/components/Account/Login.vue
-
4js/src/components/Account/PasswordReset.vue
-
215js/src/components/Account/Register.vue
-
4js/src/components/Account/RegisterAvatar.vue
-
2js/src/components/Account/ResendConfirmation.vue
-
6js/src/components/Account/SendPasswordReset.vue
-
38js/src/components/Account/Validate.vue
-
109js/src/components/Category/Create.vue
-
67js/src/components/Category/List.vue
-
244js/src/components/Event/Create.vue
-
46js/src/components/Event/Edit.vue
-
430js/src/components/Event/Event.vue
-
143js/src/components/Event/EventList.vue
-
107js/src/components/Group/Create.vue
-
68js/src/components/Group/Group.vue
-
78js/src/components/Group/GroupList.vue
-
73js/src/components/Home.vue
-
40js/src/components/Location.vue
-
198js/src/components/NavBar.vue
-
3js/src/constants.js
-
39js/src/graphql/actor.js
-
16js/src/graphql/auth.js
-
29js/src/graphql/category.js
-
109js/src/graphql/event.js
-
1js/src/graphql/fragmentTypes.json
-
17js/src/graphql/search.js
-
10js/src/graphql/upload.js
-
28js/src/graphql/user.js
-
15js/src/i18n/en.js
-
20js/src/i18n/fr.js
-
6js/src/i18n/index.js
-
30js/src/i18n/locale/en_US/LC_MESSAGES/app.po
-
30js/src/i18n/locale/fr_FR/LC_MESSAGES/app.po
-
30js/src/i18n/locale/fr_FR/LC_MESSAGES/app.po~
-
1js/src/i18n/translations.json
-
47js/src/main.js
-
44js/src/store/index.js
-
4js/src/store/mutation-types.js
-
135js/src/vue-apollo.js
-
8js/tests/unit/.eslintrc.js
-
2lib/mix/tasks/create_bot.ex
-
134lib/mobilizon/actors/actors.ex
-
12lib/mobilizon/actors/service/activation.ex
-
31lib/mobilizon/actors/service/reset_password.ex
-
27lib/mobilizon/actors/service/tools.ex
-
18lib/mobilizon/actors/user.ex
-
4lib/mobilizon/email/user.ex
-
6lib/mobilizon/events/category.ex
-
1lib/mobilizon/events/event.ex
-
93lib/mobilizon/events/events.ex
-
6lib/mobilizon_web/auth_pipeline.ex
-
20lib/mobilizon_web/context.ex
-
79lib/mobilizon_web/controllers/actor_controller.ex
-
78lib/mobilizon_web/controllers/address_controller.ex
-
48lib/mobilizon_web/controllers/bot_controller.ex
-
46lib/mobilizon_web/controllers/category_controller.ex
-
43lib/mobilizon_web/controllers/comment_controller.ex
-
125lib/mobilizon_web/controllers/event_controller.ex
-
52lib/mobilizon_web/controllers/event_request_controller.ex
-
43lib/mobilizon_web/controllers/follower_controller.ex
-
53lib/mobilizon_web/controllers/group_controller.ex
-
6lib/mobilizon_web/controllers/inboxes_controller.ex
-
4lib/mobilizon_web/controllers/node_info_controller.ex
-
10lib/mobilizon_web/controllers/outboxes_controller.ex
-
18lib/mobilizon_web/controllers/participant_controller.ex
-
23lib/mobilizon_web/controllers/search_controller.ex
-
56lib/mobilizon_web/controllers/session_controller.ex
-
46lib/mobilizon_web/controllers/tag_controller.ex
-
46lib/mobilizon_web/controllers/track_controller.ex
-
148lib/mobilizon_web/controllers/user_controller.ex
-
41lib/mobilizon_web/controllers/user_session_controller.ex
-
4lib/mobilizon_web/controllers/web_finger_controller.ex
-
8lib/mobilizon_web/endpoint.ex
-
26lib/mobilizon_web/resolvers/actor.ex
-
37lib/mobilizon_web/resolvers/category.ex
-
54lib/mobilizon_web/resolvers/event.ex
-
2lib/mobilizon_web/resolvers/upload.ex
-
118lib/mobilizon_web/resolvers/user.ex
-
90lib/mobilizon_web/router.ex
-
318lib/mobilizon_web/schema.ex
-
36lib/mobilizon_web/schema/custom/UUID4.ex
-
15lib/mobilizon_web/upload_plug.ex
-
50lib/mobilizon_web/uploaders/avatar.ex
-
49lib/mobilizon_web/uploaders/category.ex
@ -0,0 +1,5 @@ |
|||
FROM elixir:latest |
|||
|
|||
RUN apt-get update -yq && apt-get install -yq build-essential inotify-tools postgresql-client git curl gnupg |
|||
RUN curl -sL https://deb.nodesource.com/setup_8.x | bash && apt-get install nodejs -yq |
|||
RUN apt-get clean && rm -rf /var/lib/apt/lists/* /tmp/* /var/tmp/* |
|||
@ -1,7 +1,7 @@ |
|||
module.exports = { |
|||
root: true, |
|||
'extends': [ |
|||
extends: [ |
|||
'plugin:vue/essential', |
|||
'@vue/airbnb' |
|||
] |
|||
} |
|||
'@vue/airbnb', |
|||
], |
|||
}; |
|||
@ -1,5 +1,5 @@ |
|||
module.exports = { |
|||
plugins: { |
|||
autoprefixer: {} |
|||
} |
|||
} |
|||
autoprefixer: {}, |
|||
}, |
|||
}; |
|||
@ -0,0 +1,58 @@ |
|||
# On OSX the PATH variable isn't exported unless "SHELL" is also set, see: http://stackoverflow.com/a/25506676
|
|||
SHELL = /bin/bash |
|||
NODE_BINDIR = ./node_modules/.bin |
|||
export PATH := $(NODE_BINDIR):$(PATH) |
|||
|
|||
# Where to find input files (it can be multiple paths).
|
|||
INPUT_FILES = ./src |
|||
|
|||
# Where to write the files generated by this makefile.
|
|||
OUTPUT_DIR = ./src/i18n |
|||
|
|||
# Available locales for the app.
|
|||
LOCALES = en_US fr_FR |
|||
|
|||
# Name of the generated .po files for each available locale.
|
|||
LOCALE_FILES ?= $(patsubst %,$(OUTPUT_DIR)/locale/%/LC_MESSAGES/app.po,$(LOCALES)) |
|||
|
|||
GETTEXT_HTML_SOURCES = $(shell find $(INPUT_FILES) -name '*.vue' -o -name '*.html' 2> /dev/null) |
|||
GETTEXT_JS_SOURCES = $(shell find $(INPUT_FILES) -name '*.vue' -o -name '*.js') |
|||
|
|||
# Makefile Targets
|
|||
.PHONY: clean makemessages translations |
|||
|
|||
clean: |
|||
rm -f /tmp/template.pot $(OUTPUT_DIR)/translations.json |
|||
|
|||
makemessages: /tmp/template.pot |
|||
|
|||
translations: ./$(OUTPUT_DIR)/translations.json |
|||
|
|||
# Create a main .pot template, then generate .po files for each available language.
|
|||
# Thanx to Systematic: https://github.com/Polyconseil/systematic/blob/866d5a/mk/main.mk#L167-L183
|
|||
/tmp/template.pot: $(GETTEXT_HTML_SOURCES) |
|||
# `dir` is a Makefile built-in expansion function which extracts the directory-part of `$@`.
|
|||
# `$@` is a Makefile automatic variable: the file name of the target of the rule.
|
|||
# => `mkdir -p /tmp/`
|
|||
mkdir -p $(dir $@) |
|||
which gettext-extract |
|||
# Extract gettext strings from templates files and create a POT dictionary template.
|
|||
gettext-extract --attribute v-translate --quiet --output $@ $(GETTEXT_HTML_SOURCES) |
|||
# Extract gettext strings from JavaScript files.
|
|||
xgettext --language=JavaScript --keyword=npgettext:1c,2,3 \
|
|||
--from-code=utf-8 --join-existing --no-wrap \
|
|||
--package-name=$(shell node -e "console.log(require('./package.json').name);") \
|
|||
--package-version=$(shell node -e "console.log(require('./package.json').version);") \
|
|||
--output $@ $(GETTEXT_JS_SOURCES) |
|||
# Generate .po files for each available language.
|
|||
@for lang in $(LOCALES); do \
|
|||
export PO_FILE=$(OUTPUT_DIR)/locale/$$lang/LC_MESSAGES/app.po; \
|
|||
echo "msgmerge --update $$PO_FILE $@"; \
|
|||
mkdir -p $$(dirname $$PO_FILE); \
|
|||
[ -f $$PO_FILE ] && msgmerge --lang=$$lang --update $$PO_FILE $@ || msginit --no-translator --locale=$$lang --input=$@ --output-file=$$PO_FILE; \
|
|||
msgattrib --no-wrap --no-obsolete -o $$PO_FILE $$PO_FILE; \
|
|||
done; |
|||
|
|||
$(OUTPUT_DIR)/translations.json: clean /tmp/template.pot |
|||
mkdir -p $(OUTPUT_DIR) |
|||
gettext-compile --output $@ $(LOCALE_FILES) |
|||
@ -0,0 +1,38 @@ |
|||
const fetch = require('node-fetch'); |
|||
const fs = require('fs'); |
|||
|
|||
fetch(`http://localhost:4000/graphiql`, { |
|||
method: 'POST', |
|||
headers: { 'Content-Type': 'application/json' }, |
|||
body: JSON.stringify({ |
|||
variables: {}, |
|||
query: `
|
|||
{ |
|||
__schema { |
|||
types { |
|||
kind |
|||
name |
|||
possibleTypes { |
|||
name |
|||
} |
|||
} |
|||
} |
|||
} |
|||
`,
|
|||
}), |
|||
}) |
|||
.then(result => result.json()) |
|||
.then(result => { |
|||
// here we're filtering out any type information unrelated to unions or interfaces
|
|||
const filteredData = result.data.__schema.types.filter( |
|||
type => type.possibleTypes !== null, |
|||
); |
|||
result.data.__schema.types = filteredData; |
|||
fs.writeFile('./fragmentTypes.json', JSON.stringify(result.data), err => { |
|||
if (err) { |
|||
console.error('Error writing fragmentTypes file', err); |
|||
} else { |
|||
console.log('Fragment types successfully extracted!'); |
|||
} |
|||
}); |
|||
}); |
|||
2180
js/package-lock.json
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,5 +0,0 @@ |
|||
export default { |
|||
login(state, user) { |
|||
state.user = user.user; |
|||
}, |
|||
}; |
|||
@ -1,29 +0,0 @@ |
|||
import { API_ORIGIN, API_PATH } from './_entrypoint'; |
|||
|
|||
const jsonLdMimeType = 'application/json'; |
|||
|
|||
export default function eventFetch(url, store, optionsarg = {}) { |
|||
const options = optionsarg; |
|||
if (typeof options.headers === 'undefined') { |
|||
options.headers = new Headers(); |
|||
} |
|||
if (options.headers.get('Accept') === null) { |
|||
options.headers.set('Accept', jsonLdMimeType); |
|||
} |
|||
|
|||
if (options.body !== 'undefined' && !(options.body instanceof FormData) && options.headers.get('Content-Type') === null) { |
|||
options.headers.set('Content-Type', jsonLdMimeType); |
|||
} |
|||
|
|||
if (store.state.user) { |
|||
options.headers.set('Authorization', `Bearer ${localStorage.getItem('token')}`); |
|||
} |
|||
|
|||
const link = url.includes(API_PATH) ? API_ORIGIN + url : API_ORIGIN + API_PATH + url; |
|||
|
|||
return fetch(link, options).then((response) => { |
|||
if (response.ok) return response; |
|||
|
|||
throw response.text(); |
|||
}); |
|||
} |
|||
@ -1,120 +0,0 @@ |
|||
import { API_ORIGIN, API_PATH } from '../api/_entrypoint'; |
|||
import { LOGIN_USER, LOAD_USER, CHANGE_ACTOR } from '../store/mutation-types'; |
|||
|
|||
// URL and endpoint constants
|
|||
const LOGIN_URL = `${API_ORIGIN}${API_PATH}/login`; |
|||
const SIGNUP_URL = `${API_ORIGIN}${API_PATH}/users/`; |
|||
const CHECK_AUTH = `${API_ORIGIN}${API_PATH}/user/`; |
|||
const REFRESH_TOKEN = `${API_ORIGIN}${API_PATH}/token/refresh`; |
|||
|
|||
export default { |
|||
|
|||
// Send a request to the login URL and save the returned JWT
|
|||
login(creds, success, error) { |
|||
fetch(LOGIN_URL, { method: 'POST', body: creds, headers: { 'Content-Type': 'application/json' } }) |
|||
.then((response) => { |
|||
if (response.status === 200) { |
|||
return response.json(); |
|||
} |
|||
throw response.json(); |
|||
}) |
|||
.then((data) => { |
|||
localStorage.setItem('token', data.token); |
|||
// localStorage.setItem('refresh_token', data.refresh_token);
|
|||
return success(data); |
|||
}) |
|||
.catch(err => error(err)); |
|||
}, |
|||
|
|||
signup(creds, success, error) { |
|||
fetch(SIGNUP_URL, { method: 'POST', body: creds, headers: { 'Content-Type': 'application/json' } }) |
|||
.then((response) => { |
|||
if (response.status === 200) { |
|||
return response.json(); |
|||
} |
|||
throw response.json(); |
|||
}) |
|||
.then((data) => { |
|||
localStorage.setItem('token', data.token); |
|||
// localStorage.setItem('refresh_token', data.refresh_token);
|
|||
|
|||
return success(data); |
|||
}).catch(err => error(err)); |
|||
}, |
|||
refreshToken(store, successHandler, errorHandler) { |
|||
const refreshToken = localStorage.getItem('refresh_token'); |
|||
console.log('We are refreshing the jwt token'); |
|||
fetch(REFRESH_TOKEN, { method: 'POST', body: JSON.stringify({ refresh_token: refreshToken }), headers: { 'Content-Type': 'application/json' } }) |
|||
.then((response) => { |
|||
if (response.ok) { |
|||
return response.json(); |
|||
} |
|||
return errorHandler('Error while authenticating'); |
|||
}) |
|||
.then((response) => { |
|||
console.log('We have a new token'); |
|||
this.authenticated = true; |
|||
store.commit(LOGIN_USER, response); |
|||
localStorage.setItem('token', response.token); |
|||
console.log("Let's try to auth again"); |
|||
successHandler(); |
|||
}); |
|||
}, |
|||
|
|||
// To log out, we just need to remove the token
|
|||
logout(store) { |
|||
localStorage.removeItem('refresh_token'); |
|||
localStorage.removeItem('token'); |
|||
this.authenticated = false; |
|||
store.commit('LOGOUT_USER'); |
|||
}, |
|||
|
|||
jwt_decode(token) { |
|||
const base64Url = token.split('.')[1]; |
|||
const base64 = base64Url.replace('-', '+').replace('_', '/'); |
|||
return JSON.parse(window.atob(base64)); |
|||
}, |
|||
|
|||
getTokenExpirationDate(encodedToken) { |
|||
const token = this.jwt_decode(encodedToken); |
|||
if (!token.exp) { return null; } |
|||
|
|||
const date = new Date(0); |
|||
date.setUTCSeconds(token.exp); |
|||
|
|||
return date; |
|||
}, |
|||
|
|||
isTokenExpired(token) { |
|||
const expirationDate = this.getTokenExpirationDate(token); |
|||
return expirationDate < new Date(); |
|||
}, |
|||
|
|||
getUser(store, successHandler, errorHandler) { |
|||
console.log('We are checking the auth'); |
|||
this.token = localStorage.getItem('token'); |
|||
const options = {}; |
|||
options.headers = new Headers(); |
|||
options.headers.set('Authorization', `Bearer ${this.token}`); |
|||
fetch(CHECK_AUTH, options) |
|||
.then((response) => { |
|||
if (response.ok) { |
|||
return response.json(); |
|||
} |
|||
return errorHandler('Error while authenticating'); |
|||
}).then((response) => { |
|||
this.authenticated = true; |
|||
console.log(response); |
|||
store.commit(LOAD_USER, response.data); |
|||
store.commit(CHANGE_ACTOR, response.data.actors[0]); |
|||
return successHandler(); |
|||
}); |
|||
}, |
|||
|
|||
// The object to be passed as a header for authenticated requests
|
|||
getAuthHeader() { |
|||
return { |
|||
Authorization: `Bearer ${localStorage.getItem('access_token')}`, |
|||
}; |
|||
}, |
|||
}; |
|||
@ -1,216 +1,210 @@ |
|||
<template> |
|||
<v-layout row> |
|||
<v-flex xs12 sm6 offset-sm3> |
|||
<v-progress-circular v-if="loading" indeterminate color="primary"></v-progress-circular> |
|||
<v-card v-if="!loading"> |
|||
<v-img :src="actor.banner || 'https://picsum.photos/400/'" height="300px"> |
|||
<v-layout column class="media"> |
|||
<v-card-title> |
|||
<v-btn icon @click="$router.go(-1)"> |
|||
<v-icon>chevron_left</v-icon> |
|||
</v-btn> |
|||
<v-spacer></v-spacer> |
|||
<v-btn icon class="mr-3" v-if="$store.state.user && $store.state.actor.id === actor.id"> |
|||
<v-icon>edit</v-icon> |
|||
</v-btn> |
|||
<v-menu bottom left> |
|||
<v-btn icon slot="activator"> |
|||
<v-icon>more_vert</v-icon> |
|||
</v-btn> |
|||
<v-list> |
|||
<v-list-tile @click="logoutUser()" v-if="$store.state.user && $store.state.actor.id === actor.id"> |
|||
<v-list-tile-title>User logout</v-list-tile-title> |
|||
</v-list-tile> |
|||
<v-list-tile @click="deleteAccount()" v-if="$store.state.user && $store.state.actor.id === actor.id"> |
|||
<v-list-tile-title>Delete</v-list-tile-title> |
|||
</v-list-tile> |
|||
</v-list> |
|||
</v-menu> |
|||
</v-card-title> |
|||
<v-spacer></v-spacer> |
|||
<div class="text-xs-center"> |
|||
<v-avatar size="125px"> |
|||
<img v-if="!actor.avatar" |
|||
class="img-circle elevation-7 mb-1" |
|||
src="https://picsum.photos/125/125/" |
|||
> |
|||
<img v-else |
|||
<ApolloQuery :query="FETCH_ACTOR" :variables="{ name }"> |
|||
<template slot-scope="{ result: { loading, error, data } }"> |
|||
<v-progress-circular v-if="loading" indeterminate color="primary"></v-progress-circular> |
|||
<v-card v-if="data"> |
|||
<v-img :src="data.actor.banner || 'https://picsum.photos/400/'" height="300px"> |
|||
<v-layout column class="media"> |
|||
<v-card-title> |
|||
<v-btn icon @click="$router.go(-1)"> |
|||
<v-icon>chevron_left</v-icon> |
|||
</v-btn> |
|||
<v-spacer></v-spacer> |
|||
<!-- <v-btn icon class="mr-3" v-if="actor.id === data.actor.id"> |
|||
<v-icon>edit</v-icon> |
|||
</v-btn> --> |
|||
<v-menu bottom left> |
|||
<v-btn icon slot="activator"> |
|||
<v-icon>more_vert</v-icon> |
|||
</v-btn> |
|||
<v-list> |
|||
<!-- <v-list-tile @click="logoutUser()" v-if="actor.id === data.actor.id"> |
|||
<v-list-tile-title>User logout</v-list-tile-title> |
|||
</v-list-tile> |
|||
<v-list-tile @click="deleteAccount()" v-if="actor.id === data.actor.id"> |
|||
<v-list-tile-title>Delete</v-list-tile-title> |
|||
</v-list-tile> --> |
|||
</v-list> |
|||
</v-menu> |
|||
</v-card-title> |
|||
<v-spacer></v-spacer> |
|||
<div class="text-xs-center"> |
|||
<v-avatar size="125px"> |
|||
<img v-if="!data.actor.avatarUrl" |
|||
class="img-circle elevation-7 mb-1" |
|||
:src="actor.avatar" |
|||
> |
|||
</v-avatar> |
|||
</div> |
|||
<v-container fluid grid-list-lg> |
|||
<v-layout row> |
|||
<v-flex xs7> |
|||
<div class="headline">{{ actor.display_name }}</div> |
|||
<div><span class="subheading">@{{ actor.username }}<span v-if="actor.domain">@{{ actor.domain }}</span></span></div> |
|||
<v-card-text v-if="actor.description" v-html="actor.description"></v-card-text> |
|||
src="https://picsum.photos/125/125/" |
|||
> |
|||
<img v-else |
|||
class="img-circle elevation-7 mb-1" |
|||
:src="data.actor.avatarUrl" |
|||
> |
|||
</v-avatar> |
|||
</div> |
|||
<v-container fluid grid-list-lg> |
|||
<v-layout row> |
|||
<v-flex xs7> |
|||
<div class="headline">{{ data.actor.name }}</div> |
|||
<div><span class="subheading">@{{ data.actor.preferredUsername }}<span v-if="data.actor.domain">@{{ data.actor.domain }}</span></span></div> |
|||
<v-card-text v-if="data.actor.description" v-html="data.actor.description"></v-card-text> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-layout> |
|||
</v-img> |
|||
<v-list three-line> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">phone</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>(323) 555-6789</v-list-tile-title> |
|||
<v-list-tile-sub-title>Work</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
<v-list-tile-action> |
|||
<v-icon dark>chat</v-icon> |
|||
</v-list-tile-action> |
|||
</v-list-tile> |
|||
<v-divider inset></v-divider> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">mail</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>ali_connors@example.com</v-list-tile-title> |
|||
<v-list-tile-sub-title>Work</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
</v-list-tile> |
|||
<v-divider inset></v-divider> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">location_on</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>1400 Main Street</v-list-tile-title> |
|||
<v-list-tile-sub-title>Orlando, FL 79938</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
</v-list-tile> |
|||
</v-list> |
|||
<v-container fluid grid-list-md v-if="data.actor.participatingEvents && data.actor.participatingEvents.length > 0"> |
|||
<v-subheader>Participated at</v-subheader> |
|||
<v-layout row wrap> |
|||
<v-flex v-for="event in data.actor.participatingEvents" :key="event.id"> |
|||
<v-card> |
|||
<v-img |
|||
class="black--text" |
|||
height="200px" |
|||
src="https://picsum.photos/400/200/" |
|||
> |
|||
<v-container fill-height fluid> |
|||
<v-layout fill-height> |
|||
<v-flex xs12 align-end flexbox> |
|||
<span class="headline">{{ event.title }}</span> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-img> |
|||
<v-card-title> |
|||
<div> |
|||
<span class="grey--text">{{ event.startDate | formatDate }} ร {{ event.location }}</span><br> |
|||
<p>{{ event.description }}</p> |
|||
<p v-if="event.organizer">Organisรฉ par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p> |
|||
</div> |
|||
</v-card-title> |
|||
<v-card-actions> |
|||
<v-spacer></v-spacer> |
|||
<v-btn icon> |
|||
<v-icon>favorite</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>bookmark</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>share</v-icon> |
|||
</v-btn> |
|||
</v-card-actions> |
|||
</v-card> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-layout> |
|||
</v-img> |
|||
<v-list three-line> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">phone</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>(323) 555-6789</v-list-tile-title> |
|||
<v-list-tile-sub-title>Work</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
<v-list-tile-action> |
|||
<v-icon dark>chat</v-icon> |
|||
</v-list-tile-action> |
|||
</v-list-tile> |
|||
<v-divider inset></v-divider> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">mail</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>ali_connors@example.com</v-list-tile-title> |
|||
<v-list-tile-sub-title>Work</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
</v-list-tile> |
|||
<v-divider inset></v-divider> |
|||
<v-list-tile> |
|||
<v-list-tile-action> |
|||
<v-icon color="indigo">location_on</v-icon> |
|||
</v-list-tile-action> |
|||
<v-list-tile-content> |
|||
<v-list-tile-title>1400 Main Street</v-list-tile-title> |
|||
<v-list-tile-sub-title>Orlando, FL 79938</v-list-tile-sub-title> |
|||
</v-list-tile-content> |
|||
</v-list-tile> |
|||
</v-list> |
|||
<v-container fluid grid-list-md v-if="actor.participatingEvents && actor.participatingEvents.length > 0"> |
|||
<v-subheader>Participated at</v-subheader> |
|||
<v-layout row wrap> |
|||
<v-flex v-for="event in actor.participatingEvents" :key="event.id"> |
|||
<v-card> |
|||
<v-card-media |
|||
class="black--text" |
|||
height="200px" |
|||
src="https://picsum.photos/400/200/" |
|||
> |
|||
<v-container fill-height fluid> |
|||
<v-layout fill-height> |
|||
<v-flex xs12 align-end flexbox> |
|||
<span class="headline">{{ event.title }}</span> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-card-media> |
|||
<v-card-title> |
|||
<div> |
|||
<span class="grey--text">{{ event.startDate | formatDate }} ร {{ event.location }}</span><br> |
|||
<p>{{ event.description }}</p> |
|||
<p v-if="event.organizer">Organisรฉ par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p> |
|||
</div> |
|||
</v-card-title> |
|||
<v-card-actions> |
|||
<v-spacer></v-spacer> |
|||
<v-btn icon> |
|||
<v-icon>favorite</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>bookmark</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>share</v-icon> |
|||
</v-btn> |
|||
</v-card-actions> |
|||
</v-card> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
<v-container fluid grid-list-md v-if="actor.organized_events && actor.organized_events.length > 0"> |
|||
<v-subheader>Organized events</v-subheader> |
|||
<v-layout row wrap> |
|||
<v-flex v-for="event in actor.organized_events" :key="event.id"> |
|||
<v-card> |
|||
<v-card-media |
|||
class="black--text" |
|||
height="200px" |
|||
src="https://picsum.photos/400/200/" |
|||
> |
|||
<v-container fill-height fluid> |
|||
<v-layout fill-height> |
|||
<v-flex xs12 align-end flexbox> |
|||
<span class="headline">{{ event.title }}</span> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-card-media> |
|||
<v-card-title> |
|||
<div> |
|||
<span class="grey--text">{{ event.startDate | formatDate }} ร {{ event.location }}</span><br> |
|||
<p>{{ event.description }}</p> |
|||
<p v-if="event.organizer">Organisรฉ par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p> |
|||
</div> |
|||
</v-card-title> |
|||
<v-card-actions> |
|||
<v-spacer></v-spacer> |
|||
<v-btn icon> |
|||
<v-icon>favorite</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>bookmark</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>share</v-icon> |
|||
</v-btn> |
|||
</v-card-actions> |
|||
</v-card> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-card> |
|||
<v-container fluid grid-list-md v-if="data.actor.organizedEvents && data.actor.organizedEvents.length > 0"> |
|||
<v-subheader>Organized events</v-subheader> |
|||
<v-layout row wrap> |
|||
<v-flex v-for="event in data.actor.organizedEvents" :key="event.id" md6> |
|||
<v-card> |
|||
<v-img |
|||
height="200px" |
|||
src="https://picsum.photos/400/200/" |
|||
/> |
|||
<v-card-title primary-title> |
|||
<div> |
|||
<router-link :to="{name: 'Event', params: {uuid: event.uuid}}"> |
|||
<div class="headline">{{ event.title }}</div> |
|||
</router-link> |
|||
<span class="grey--text" v-html="nl2br(event.description)"></span> |
|||
</div> |
|||
</v-card-title> |
|||
|
|||
<!-- <v-card-title> |
|||
<div> |
|||
<span class="grey--text" v-if="event.addressType === 'physical'">{{ event.startDate }} ร {{ event.location }}</span><br> |
|||
<p v-if="event.organizer">Organisรฉ par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p> |
|||
</div> |
|||
</v-card-title> --> |
|||
<v-card-actions> |
|||
<v-spacer></v-spacer> |
|||
<v-btn icon> |
|||
<v-icon>favorite</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>bookmark</v-icon> |
|||
</v-btn> |
|||
<v-btn icon> |
|||
<v-icon>share</v-icon> |
|||
</v-btn> |
|||
</v-card-actions> |
|||
</v-card> |
|||
</v-flex> |
|||
</v-layout> |
|||
</v-container> |
|||
</v-card> |
|||
</template> |
|||
</ApolloQuery> |
|||
</v-flex> |
|||
</v-layout> |
|||
</template> |
|||
|
|||
<script> |
|||
import eventFetch from '@/api/eventFetch'; |
|||
import auth from '@/auth'; |
|||
import { FETCH_ACTOR } from '@/graphql/actor'; |
|||
|
|||
export default { |
|||
name: 'Account', |
|||
data() { |
|||
return { |
|||
actor: null, |
|||
loading: true, |
|||
} |
|||
loading: true, |
|||
}; |
|||
}, |
|||
props: { |
|||
name: { |
|||
type: String, |
|||
required: true, |
|||
} |
|||
name: { |
|||
type: String, |
|||
required: true, |
|||
}, |
|||
}, |
|||
created() { |
|||
this.fetchData(); |
|||
}, |
|||
watch: { |
|||
// call again the method if the route changes |
|||
'$route': 'fetchData' |
|||
$route: 'fetchData', |
|||
}, |
|||
methods: { |
|||
fetchData() { |
|||
eventFetch(`/actors/${this.name}`, this.$store) |
|||
.then(response => response.json()) |
|||
.then((response) => { |
|||
this.actor = response.data; |
|||
this.loading = false; |
|||
console.log('actor', this.actor); |
|||
}) |
|||
}, |
|||
logoutUser() { |
|||
auth.logout(this.$store); |
|||
// TODO : implement logout |
|||
this.$router.push({ name: 'Home' }); |
|||
}, |
|||
} |
|||
} |
|||
nl2br: function(text) { |
|||
return text.replace(/(?:\r\n|\r|\n)/g, '<br>'); |
|||
} |
|||
}, |
|||
}; |
|||
</script> |
|||