Merge branch 'feature/typescript' into 'master'
Migration to typescript: first step See merge request framasoft/mobilizon!33
This commit is contained in:
commit
eaa4c347ca
@ -1,7 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
root: true,
|
|
||||||
extends: [
|
|
||||||
'plugin:vue/essential',
|
|
||||||
'@vue/airbnb',
|
|
||||||
],
|
|
||||||
};
|
|
1253
js/package-lock.json
generated
1253
js/package-lock.json
generated
File diff suppressed because it is too large
Load Diff
@ -2,16 +2,13 @@
|
|||||||
"name": "mobilizon",
|
"name": "mobilizon",
|
||||||
"version": "0.1.0",
|
"version": "0.1.0",
|
||||||
"private": true,
|
"private": true,
|
||||||
"engines": {
|
|
||||||
"node": ">=10.0.0"
|
|
||||||
},
|
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "vue-cli-service serve",
|
|
||||||
"build": "vue-cli-service build --modern",
|
"build": "vue-cli-service build --modern",
|
||||||
"lint": "vue-cli-service lint",
|
"lint": "vue-cli-service lint",
|
||||||
|
"analyze-bundle": "npm run build -- --report-json && webpack-bundle-analyzer ../priv/static/report.json",
|
||||||
|
"dev": "vue-cli-service serve",
|
||||||
"test:e2e": "vue-cli-service test:e2e",
|
"test:e2e": "vue-cli-service test:e2e",
|
||||||
"test:unit": "vue-cli-service test:unit",
|
"test:unit": "vue-cli-service test:unit"
|
||||||
"analyze-bundle": "npm run build -- --report-json && webpack-bundle-analyzer ../priv/static/report.json"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"apollo-absinthe-upload-link": "^1.4.0",
|
"apollo-absinthe-upload-link": "^1.4.0",
|
||||||
@ -22,31 +19,37 @@
|
|||||||
"graphql-tag": "^2.9.0",
|
"graphql-tag": "^2.9.0",
|
||||||
"material-design-icons": "^3.0.1",
|
"material-design-icons": "^3.0.1",
|
||||||
"moment": "^2.22.2",
|
"moment": "^2.22.2",
|
||||||
"ngeohash": "^0.6.0",
|
"ngeohash": "^0.6.3",
|
||||||
"register-service-worker": "^1.4.1",
|
"register-service-worker": "^1.4.1",
|
||||||
"vue": "^2.5.17",
|
"vue": "^2.5.17",
|
||||||
"vue-apollo": "^3.0.0-beta.26",
|
"vue-apollo": "^3.0.0-beta.26",
|
||||||
|
"vue-class-component": "^6.3.2",
|
||||||
"vue-gettext": "^2.1.1",
|
"vue-gettext": "^2.1.1",
|
||||||
"vue-gravatar": "^1.3.0",
|
"vue-gravatar": "^1.3.0",
|
||||||
"vue-markdown": "^2.2.4",
|
"vue-markdown": "^2.2.4",
|
||||||
|
"vue-property-decorator": "^7.2.0",
|
||||||
"vue-router": "^3.0.2",
|
"vue-router": "^3.0.2",
|
||||||
"vuetify": "^1.3.9",
|
"vuetify": "^1.3.9",
|
||||||
"vuetify-google-autocomplete": "^2.0.0-beta.5",
|
"vuetify-google-autocomplete": "^2.0.0-beta.5",
|
||||||
"vuex": "^3.0.1"
|
"vuex": "^3.0.1"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
|
"@types/chai": "^4.1.0",
|
||||||
|
"@types/mocha": "^5.2.4",
|
||||||
"@vue/cli-plugin-babel": "^3.1.1",
|
"@vue/cli-plugin-babel": "^3.1.1",
|
||||||
"@vue/cli-plugin-e2e-nightwatch": "^3.1.1",
|
"@vue/cli-plugin-e2e-nightwatch": "^3.1.1",
|
||||||
"@vue/cli-plugin-eslint": "^3.1.5",
|
|
||||||
"@vue/cli-plugin-pwa": "^3.1.2",
|
"@vue/cli-plugin-pwa": "^3.1.2",
|
||||||
|
"@vue/cli-plugin-typescript": "^3.2.0",
|
||||||
"@vue/cli-plugin-unit-mocha": "^3.1.1",
|
"@vue/cli-plugin-unit-mocha": "^3.1.1",
|
||||||
"@vue/cli-service": "^3.1.4",
|
"@vue/cli-service": "^3.1.4",
|
||||||
"@vue/eslint-config-airbnb": "^3.0.5",
|
"@vue/eslint-config-typescript": "^3.1.0",
|
||||||
"@vue/test-utils": "^1.0.0-beta.26",
|
"@vue/test-utils": "^1.0.0-beta.26",
|
||||||
"chai": "^4.2.0",
|
"chai": "^4.2.0",
|
||||||
"dotenv-webpack": "^1.5.7",
|
"dotenv-webpack": "^1.5.7",
|
||||||
"node-sass": "^4.10.0",
|
"node-sass": "^4.10.0",
|
||||||
"sass-loader": "^7.1.0",
|
"sass-loader": "^7.1.0",
|
||||||
|
"tslint-config-airbnb": "^5.11.1",
|
||||||
|
"typescript": "^3.0.0",
|
||||||
"vue-cli-plugin-apollo": "^0.17.4",
|
"vue-cli-plugin-apollo": "^0.17.4",
|
||||||
"vue-template-compiler": "^2.5.17",
|
"vue-template-compiler": "^2.5.17",
|
||||||
"webpack-bundle-analyzer": "^3.0.3"
|
"webpack-bundle-analyzer": "^3.0.3"
|
||||||
@ -55,5 +58,8 @@
|
|||||||
"> 1%",
|
"> 1%",
|
||||||
"last 2 versions",
|
"last 2 versions",
|
||||||
"not ie <= 8"
|
"not ie <= 8"
|
||||||
]
|
],
|
||||||
|
"engines": {
|
||||||
|
"node": ">=10.0.0"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
@ -134,7 +134,8 @@
|
|||||||
class="white--text"
|
class="white--text"
|
||||||
v-translate="{
|
v-translate="{
|
||||||
date: new Date().getFullYear(),
|
date: new Date().getFullYear(),
|
||||||
}">© The Mobilizon Contributors %{date} - Made with Elixir, Phoenix & <a href="https://vuejs.org/">VueJS</a> & <a href="https://www.vuetifyjs.com/">Vuetify</a> with some love and some weeks
|
}">© The Mobilizon Contributors %{date} - Made with Elixir, Phoenix & <a href="https://vuejs.org/">VueJS</a> & <a
|
||||||
|
href="https://www.vuetifyjs.com/">Vuetify</a> with some love and some weeks
|
||||||
</span>
|
</span>
|
||||||
</v-footer>
|
</v-footer>
|
||||||
<v-snackbar
|
<v-snackbar
|
||||||
@ -148,22 +149,21 @@
|
|||||||
</v-app>
|
</v-app>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import gql from 'graphql-tag';
|
import NavBar from '@/components/NavBar.vue';
|
||||||
import NavBar from '@/components/NavBar';
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
import { AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
import { AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'app',
|
|
||||||
components: {
|
components: {
|
||||||
NavBar,
|
NavBar,
|
||||||
},
|
},
|
||||||
data() {
|
})
|
||||||
return {
|
export default class App extends Vue {
|
||||||
drawer: false,
|
drawer = false;
|
||||||
fab: false,
|
fab = false;
|
||||||
user: localStorage.getItem(AUTH_USER_ID),
|
user = localStorage.getItem(AUTH_USER_ID);
|
||||||
items: [
|
items = [
|
||||||
{
|
{
|
||||||
icon: 'poll', text: 'Events', route: 'EventList', role: null,
|
icon: 'poll', text: 'Events', route: 'EventList', role: null,
|
||||||
},
|
},
|
||||||
@ -177,46 +177,48 @@ export default {
|
|||||||
{ icon: 'chat_bubble', text: 'Send feedback', role: 'ROLE_USER' },
|
{ icon: 'chat_bubble', text: 'Send feedback', role: 'ROLE_USER' },
|
||||||
{ icon: 'help', text: 'Help', role: null },
|
{ icon: 'help', text: 'Help', role: null },
|
||||||
{ icon: 'phonelink', text: 'App downloads', role: null },
|
{ icon: 'phonelink', text: 'App downloads', role: null },
|
||||||
],
|
];
|
||||||
error: {
|
error = {
|
||||||
timeout: 3000,
|
timeout: 3000,
|
||||||
show: false,
|
show: false,
|
||||||
text: '',
|
text: '',
|
||||||
},
|
|
||||||
show_new_event_button: false,
|
|
||||||
actor: localStorage.getItem(AUTH_USER_ACTOR),
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
methods: {
|
actor = localStorage.getItem(AUTH_USER_ACTOR);
|
||||||
showMenuItem(elem) {
|
|
||||||
return elem !== null && this.user && this.user.roles !== undefined ? this.user.roles.includes(elem) : true;
|
get displayed_name () {
|
||||||
},
|
// FIXME: load actor
|
||||||
getUser() {
|
return 'no implemented';
|
||||||
|
// return this.actor.display_name === null ? this.actor.username : this.actor.display_name
|
||||||
|
}
|
||||||
|
|
||||||
|
showMenuItem (elem) {
|
||||||
|
// FIXME: load actor
|
||||||
|
return false;
|
||||||
|
// return elem !== null && this.user && this.user.roles !== undefined ? this.user.roles.includes(elem) : true
|
||||||
|
}
|
||||||
|
|
||||||
|
getUser () {
|
||||||
return this.user === undefined ? false : this.user;
|
return this.user === undefined ? false : this.user;
|
||||||
},
|
}
|
||||||
toggleDrawer() {
|
|
||||||
|
toggleDrawer () {
|
||||||
this.drawer = !this.drawer;
|
this.drawer = !this.drawer;
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
computed: {
|
|
||||||
displayed_name() {
|
|
||||||
return this.actor.display_name === null ? this.actor.username : this.actor.display_name;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
.router-enter-active, .router-leave-active {
|
.router-enter-active, .router-leave-active {
|
||||||
transition-property: opacity;
|
transition-property: opacity;
|
||||||
transition-duration: .25s;
|
transition-duration: .25s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.router-enter-active {
|
.router-enter-active {
|
||||||
transition-delay: .25s;
|
transition-delay: .25s;
|
||||||
}
|
}
|
||||||
|
|
||||||
.router-enter, .router-leave-active {
|
.router-enter, .router-leave-active {
|
||||||
opacity: 0
|
opacity: 0
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -44,7 +44,8 @@
|
|||||||
<v-layout row>
|
<v-layout row>
|
||||||
<v-flex xs7>
|
<v-flex xs7>
|
||||||
<div class="headline">{{ actor.name }}</div>
|
<div class="headline">{{ actor.name }}</div>
|
||||||
<div><span class="subheading">@{{ actor.preferredUsername }}<span v-if="actor.domain">@{{ actor.domain }}</span></span></div>
|
<div><span class="subheading">@{{ actor.preferredUsername }}<span v-if="actor.domain">@{{ actor.domain }}</span></span>
|
||||||
|
</div>
|
||||||
<v-card-text v-if="actor.description" v-html="actor.description"></v-card-text>
|
<v-card-text v-if="actor.description" v-html="actor.description"></v-card-text>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
@ -107,7 +108,9 @@
|
|||||||
<div>
|
<div>
|
||||||
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
||||||
<p>{{ event.description }}</p>
|
<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>
|
<p v-if="event.organizer">Organisé par
|
||||||
|
<router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
@ -171,22 +174,11 @@
|
|||||||
</v-layout>
|
</v-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import { FETCH_ACTOR } from '@/graphql/actor';
|
import { FETCH_ACTOR } from '@/graphql/actor';
|
||||||
|
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'Account',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
actor: null,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
name: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
apollo: {
|
apollo: {
|
||||||
actor: {
|
actor: {
|
||||||
query: FETCH_ACTOR,
|
query: FETCH_ACTOR,
|
||||||
@ -197,20 +189,25 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
created() {
|
})
|
||||||
},
|
export default class Account extends Vue {
|
||||||
watch: {
|
@Prop({ type: String, required: true }) name!: string;
|
||||||
|
|
||||||
|
actor = null;
|
||||||
|
|
||||||
// call again the method if the route changes
|
// call again the method if the route changes
|
||||||
$route: 'fetchData',
|
@Watch('$route')
|
||||||
},
|
onRouteChange() {
|
||||||
methods: {
|
// this.fetchData()
|
||||||
|
}
|
||||||
|
|
||||||
logoutUser() {
|
logoutUser() {
|
||||||
// TODO : implement logout
|
// TODO : implement logout
|
||||||
this.$router.push({ name: 'Home' });
|
this.$router.push({ name: 'Home' });
|
||||||
},
|
}
|
||||||
nl2br: function(text) {
|
|
||||||
|
nl2br(text) {
|
||||||
return text.replace(/(?:\r\n|\r|\n)/g, '<br>');
|
return text.replace(/(?:\r\n|\r|\n)/g, '<br>');
|
||||||
}
|
}
|
||||||
},
|
};
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -66,64 +66,68 @@
|
|||||||
</v-layout>
|
</v-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
name: 'Identities',
|
|
||||||
data() {
|
@Component
|
||||||
return {
|
export default class Identities extends Vue {
|
||||||
actors: [],
|
actors = [];
|
||||||
newActor: {
|
newActor = {
|
||||||
preferred_username: '',
|
preferred_username: '',
|
||||||
summary: '',
|
summary: '',
|
||||||
},
|
};
|
||||||
loading: true,
|
loading = true;
|
||||||
showForm: false,
|
showForm = false;
|
||||||
rules: {
|
rules = {
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
},
|
};
|
||||||
state: {
|
state = {
|
||||||
username: {
|
username: {
|
||||||
status: false,
|
status: false,
|
||||||
msg: [],
|
msg: [],
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
created() {
|
created() {
|
||||||
this.fetchData();
|
this.fetchData();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
fetchData() {
|
fetchData() {
|
||||||
eventFetch('/user', this.$store)
|
// Implements eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch('/user', this.$store)
|
||||||
.then((response) => {
|
// .then(response => response.json())
|
||||||
this.actors = response.data.actors;
|
// .then((response) => {
|
||||||
this.loading = false;
|
// this.actors = response.data.actors;
|
||||||
});
|
// this.loading = false;
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
sendData() {
|
sendData() {
|
||||||
this.loading = true;
|
this.loading = true;
|
||||||
this.showForm = false;
|
this.showForm = false;
|
||||||
eventFetch('/actors', this.$store, {
|
|
||||||
method: 'POST',
|
// Implements eventFetch
|
||||||
body: JSON.stringify({ actor: this.newActor }),
|
// eventFetch('/actors', this.$store, {
|
||||||
})
|
// method: 'POST',
|
||||||
.then(response => response.json())
|
// body: JSON.stringify({ actor: this.newActor }),
|
||||||
.then((response) => {
|
// })
|
||||||
this.actors.push(response.data);
|
// .then(response => response.json())
|
||||||
this.loading = false;
|
// .then((response) => {
|
||||||
});
|
// this.actors.push(response.data);
|
||||||
},
|
// this.loading = false;
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
toggleForm() {
|
toggleForm() {
|
||||||
if (this.showForm === true) {
|
if (this.showForm === true) {
|
||||||
this.sendData();
|
this.sendData();
|
||||||
} else {
|
} else {
|
||||||
this.showForm = true;
|
this.showForm = true;
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
|
|
||||||
host() {
|
host() {
|
||||||
return `@${window.location.host}`;
|
return `@${window.location.host}`;
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -58,47 +58,30 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
|
|
||||||
import Gravatar from 'vue-gravatar';
|
import Gravatar from 'vue-gravatar';
|
||||||
import RegisterAvatar from './RegisterAvatar';
|
import RegisterAvatar from './RegisterAvatar.vue';
|
||||||
import { AUTH_TOKEN, AUTH_USER_ID, AUTH_USER_ACTOR } from '@/constants';
|
import { AUTH_TOKEN, AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
||||||
import { LOGIN } from '@/graphql/auth';
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
|
import { LOGIN } from '@/graphql/auth';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
props: {
|
|
||||||
email: {
|
|
||||||
type: String,
|
|
||||||
required: false,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
password: {
|
|
||||||
type: String,
|
|
||||||
required: false,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
beforeCreate() {
|
|
||||||
if (this.user) {
|
|
||||||
this.$router.push('/');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
components: {
|
components: {
|
||||||
'v-gravatar': Gravatar,
|
'v-gravatar': Gravatar,
|
||||||
avatar: RegisterAvatar,
|
avatar: RegisterAvatar,
|
||||||
},
|
},
|
||||||
mounted() {
|
})
|
||||||
this.credentials.email = this.email;
|
export default class Login extends Vue {
|
||||||
this.credentials.password = this.password;
|
@Prop({ type: String, required: false, default: '' }) email!: string;
|
||||||
},
|
@Prop({ type: String, required: false, default: '' }) password!: string;
|
||||||
data() {
|
|
||||||
return {
|
credentials = {
|
||||||
credentials: {
|
|
||||||
email: '',
|
email: '',
|
||||||
password: '',
|
password: '',
|
||||||
},
|
};
|
||||||
validationSent: false,
|
validationSent = false;
|
||||||
error: {
|
error = {
|
||||||
show: false,
|
show: false,
|
||||||
text: '',
|
text: '',
|
||||||
timeout: 3000,
|
timeout: 3000,
|
||||||
@ -106,42 +89,53 @@ export default {
|
|||||||
email: false,
|
email: false,
|
||||||
password: false,
|
password: false,
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
rules: {
|
rules = {
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
email: (value) => {
|
email: (value) => {
|
||||||
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||||
return pattern.test(value) || 'Invalid e-mail.';
|
return pattern.test(value) || 'Invalid e-mail.';
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
user: any;
|
||||||
methods: {
|
|
||||||
|
beforeCreate() {
|
||||||
|
if (this.user) {
|
||||||
|
this.$router.push('/');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
mounted() {
|
||||||
|
this.credentials.email = this.email;
|
||||||
|
this.credentials.password = this.password;
|
||||||
|
}
|
||||||
|
|
||||||
loginAction(e) {
|
loginAction(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
this.$apollo.mutate({
|
this.$apollo.mutate({
|
||||||
mutation: LOGIN,
|
mutation: LOGIN,
|
||||||
variables: {
|
variables: {
|
||||||
email: this.credentials.email,
|
email: this.credentials.email,
|
||||||
password: this.credentials.password
|
password: this.credentials.password,
|
||||||
}
|
},
|
||||||
}).then((result) => {
|
}).then((result) => {
|
||||||
this.saveUserData(result.data);
|
this.saveUserData(result.data);
|
||||||
this.$router.push({name: 'Home'});
|
this.$router.push({ name: 'Home' });
|
||||||
}).catch((e) => {
|
}).catch((e) => {
|
||||||
console.log(e);
|
console.log(e);
|
||||||
this.error.show = true;
|
this.error.show = true;
|
||||||
this.error.text = e.message;
|
this.error.text = e.message;
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
|
|
||||||
validEmail() {
|
validEmail() {
|
||||||
return this.rules.email(this.credentials.email) === true ? 'v-gravatar' : 'avatar';
|
return this.rules.email(this.credentials.email) === true ? 'v-gravatar' : 'avatar';
|
||||||
},
|
}
|
||||||
saveUserData({login: login}) {
|
|
||||||
|
saveUserData({ login: login }) {
|
||||||
localStorage.setItem(AUTH_USER_ID, login.user.id);
|
localStorage.setItem(AUTH_USER_ID, login.user.id);
|
||||||
localStorage.setItem(AUTH_USER_ACTOR, JSON.stringify(login.actor));
|
localStorage.setItem(AUTH_USER_ACTOR, JSON.stringify(login.actor));
|
||||||
localStorage.setItem(AUTH_TOKEN, login.token);
|
localStorage.setItem(AUTH_TOKEN, login.token);
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -36,31 +36,22 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
|
||||||
name: 'PasswordReset',
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
props: {
|
|
||||||
token: {
|
@Component
|
||||||
type: String,
|
export default class PasswordReset extends Vue {
|
||||||
required: true,
|
@Prop({ type: String, required: true }) token!: string;
|
||||||
},
|
|
||||||
},
|
credentials = {
|
||||||
computed: {
|
|
||||||
samePasswords() {
|
|
||||||
return this.rules.password_length(this.credentials.password) === true &&
|
|
||||||
this.credentials.password === this.credentials.password_confirmation;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
credentials: {
|
|
||||||
password: '',
|
password: '',
|
||||||
password_confirmation: '',
|
password_confirmation: '',
|
||||||
},
|
};
|
||||||
error: {
|
error = {
|
||||||
show: false,
|
show: false,
|
||||||
},
|
};
|
||||||
state: {
|
state = {
|
||||||
token: {
|
token: {
|
||||||
status: null,
|
status: null,
|
||||||
msg: '',
|
msg: '',
|
||||||
@ -73,38 +64,46 @@ export default {
|
|||||||
status: null,
|
status: null,
|
||||||
msg: '',
|
msg: '',
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
rules: {
|
rules = {
|
||||||
password_length: value => value.length > 6 || 'Password must be at least 6 caracters long',
|
password_length: value => value.length > 6 || 'Password must be at least 6 caracters long',
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
password_equal: value => value === this.credentials.password || 'Passwords must be the same',
|
password_equal: value => value === this.credentials.password || 'Passwords must be the same',
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
methods: {
|
get samePasswords() {
|
||||||
|
return this.rules.password_length(this.credentials.password) === true &&
|
||||||
|
this.credentials.password === this.credentials.password_confirmation;
|
||||||
|
}
|
||||||
|
|
||||||
resetAction(e) {
|
resetAction(e) {
|
||||||
this.resetState();
|
this.resetState();
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
console.log(this.token);
|
console.log(this.token);
|
||||||
fetchStory('/users/password-reset/post', this.$store, { method: 'POST', body: JSON.stringify({ password: this.credentials.password, token: this.token }) }).then((data) => {
|
// FIXME: implements fetchStory
|
||||||
localStorage.setItem('token', data.token);
|
// fetchStory('/users/password-reset/post', this.$store, {
|
||||||
localStorage.setItem('refresh_token', data.refresh_token);
|
// method: 'POST',
|
||||||
this.$store.commit('LOGIN_USER', data.account);
|
// body: JSON.stringify({ password: this.credentials.password, token: this.token }),
|
||||||
this.$snotify.success(this.$t('registration.success.login', { username: data.account.username }));
|
// }).then((data) => {
|
||||||
this.$router.push({ name: 'Home' });
|
// localStorage.setItem('token', data.token);
|
||||||
}, (error) => {
|
// localStorage.setItem('refresh_token', data.refresh_token);
|
||||||
Promise.resolve(error).then((errormsg) => {
|
// this.$store.commit('LOGIN_USER', data.account);
|
||||||
console.log('errormsg', errormsg);
|
// this.$snotify.success(this.$t('registration.success.login', { username: data.account.username }));
|
||||||
this.error.show = true;
|
// this.$router.push({ name: 'Home' });
|
||||||
Object.entries(JSON.parse(errormsg).errors).forEach(([key, val]) => {
|
// }, (error) => {
|
||||||
console.log('key', key);
|
// Promise.resolve(error).then((errormsg) => {
|
||||||
console.log('val', val[0]);
|
// console.log('errormsg', errormsg);
|
||||||
this.state[key] = { status: false, msg: val[0] };
|
// this.error.show = true;
|
||||||
console.log('state', this.state);
|
// Object.entries(JSON.parse(errormsg).errors).forEach(([ key, val ]) => {
|
||||||
});
|
// console.log('key', key);
|
||||||
});
|
// console.log('val', val[ 0 ]);
|
||||||
});
|
// this.state[ key ] = { status: false, msg: val[ 0 ] };
|
||||||
},
|
// console.log('state', this.state);
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
resetState() {
|
resetState() {
|
||||||
this.state = {
|
this.state = {
|
||||||
token: {
|
token: {
|
||||||
@ -120,7 +119,6 @@ export default {
|
|||||||
msg: '',
|
msg: '',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
}
|
||||||
},
|
};
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -68,8 +68,12 @@
|
|||||||
<router-link :to="{ name: 'ResendConfirmation', params: { email }}">Didn't receive the instructions ?</router-link>
|
<router-link :to="{ name: 'ResendConfirmation', params: { email }}">Didn't receive the instructions ?</router-link>
|
||||||
</v-form>
|
</v-form>
|
||||||
<div v-if="validationSent">
|
<div v-if="validationSent">
|
||||||
<h2><translate>A validation email was sent to %{email}</translate></h2>
|
<h2>
|
||||||
<v-alert :value="true" type="info"><translate>Before you can login, you need to click on the link inside it to validate your account</translate></v-alert>
|
<translate>A validation email was sent to %{email}</translate>
|
||||||
|
</h2>
|
||||||
|
<v-alert :value="true" type="info">
|
||||||
|
<translate>Before you can login, you need to click on the link inside it to validate your account</translate>
|
||||||
|
</v-alert>
|
||||||
</div>
|
</div>
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
</v-card>
|
</v-card>
|
||||||
@ -78,39 +82,31 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import Gravatar from 'vue-gravatar';
|
import Gravatar from 'vue-gravatar';
|
||||||
import RegisterAvatar from './RegisterAvatar';
|
import RegisterAvatar from './RegisterAvatar.vue';
|
||||||
import { CREATE_USER } from '@/graphql/user';
|
import { CREATE_USER } from '@/graphql/user';
|
||||||
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
props: {
|
|
||||||
default_email: {
|
|
||||||
type: String,
|
|
||||||
required: false,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
default_password: {
|
|
||||||
type: String,
|
|
||||||
required: false,
|
|
||||||
default: '',
|
|
||||||
},
|
|
||||||
},
|
|
||||||
components: {
|
components: {
|
||||||
'v-gravatar': Gravatar,
|
'v-gravatar': Gravatar,
|
||||||
avatar: RegisterAvatar,
|
avatar: RegisterAvatar,
|
||||||
},
|
},
|
||||||
data() {
|
})
|
||||||
return {
|
export default class Register extends Vue {
|
||||||
username: '',
|
@Prop({ type: String, required: false, default: '' }) default_email!: string;
|
||||||
email: this.default_email,
|
@Prop({ type: String, required: false, default: '' }) default_password!: string;
|
||||||
password: this.default_password,
|
|
||||||
error: {
|
username = '';
|
||||||
|
email = this.default_email;
|
||||||
|
password = this.default_password;
|
||||||
|
error = {
|
||||||
show: false,
|
show: false,
|
||||||
},
|
};
|
||||||
showPassword: false,
|
showPassword = false;
|
||||||
validationSent: false,
|
validationSent = false;
|
||||||
state: {
|
state = {
|
||||||
email: {
|
email: {
|
||||||
status: false,
|
status: false,
|
||||||
msg: [],
|
msg: [],
|
||||||
@ -123,40 +119,41 @@ export default {
|
|||||||
status: false,
|
status: false,
|
||||||
msg: [],
|
msg: [],
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
rules: {
|
rules = {
|
||||||
password_length: value => value.length > 6 || 'Password must be at least 6 caracters long',
|
password_length: value => value.length > 6 || 'Password must be at least 6 caracters long',
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
email: (value) => {
|
email: (value) => {
|
||||||
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||||
return pattern.test(value) || 'Invalid e-mail.';
|
return pattern.test(value) || 'Invalid e-mail.';
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
resetState() {
|
resetState() {
|
||||||
this.state = {
|
this.state = {
|
||||||
email: {
|
email: {
|
||||||
status: false,
|
status: false,
|
||||||
msg: '',
|
msg: [],
|
||||||
},
|
},
|
||||||
username: {
|
username: {
|
||||||
status: false,
|
status: false,
|
||||||
msg: '',
|
msg: [],
|
||||||
},
|
},
|
||||||
password: {
|
password: {
|
||||||
status: false,
|
status: false,
|
||||||
msg: '',
|
msg: [],
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
}
|
||||||
|
|
||||||
host() {
|
host() {
|
||||||
return `@${window.location.host}`;
|
return `@${window.location.host}`;
|
||||||
},
|
}
|
||||||
|
|
||||||
validEmail() {
|
validEmail() {
|
||||||
return this.rules.email(this.email) === true ? 'v-gravatar' : 'avatar';
|
return this.rules.email(this.email) === true ? 'v-gravatar' : 'avatar';
|
||||||
},
|
}
|
||||||
|
|
||||||
submit() {
|
submit() {
|
||||||
this.$apollo.mutate({
|
this.$apollo.mutate({
|
||||||
mutation: CREATE_USER,
|
mutation: CREATE_USER,
|
||||||
@ -171,19 +168,20 @@ export default {
|
|||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
},
|
};
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss">
|
|
||||||
.avatar-enter-active {
|
|
||||||
transition: opacity 1s ease;
|
|
||||||
}
|
|
||||||
.avatar-enter, .avatar-leave-to {
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar-leave {
|
<style lang="scss">
|
||||||
|
.avatar-enter-active {
|
||||||
|
transition: opacity 1s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-enter, .avatar-leave-to {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.avatar-leave {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -1,9 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<img class="img-circle elevation-7 mb-1" src="@/assets/profile.svg">
|
<img class="img-circle elevation-7 mb-1" src="@/assets/profile.svg">
|
||||||
</template>
|
</template>
|
||||||
<script>
|
|
||||||
export default {
|
<script lang="ts">
|
||||||
name: 'RegisterAvatar',
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
};
|
|
||||||
|
@Component
|
||||||
|
export default class RegisterAvatar extends Vue {
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -30,53 +30,48 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
name: 'ResendConfirmation',
|
|
||||||
props: {
|
@Component
|
||||||
email: {
|
export default class ResendConfirmation extends Vue {
|
||||||
type: String,
|
@Prop({ type: String, required: false, default: '' }) email!: string;
|
||||||
required: false,
|
|
||||||
default: '',
|
credentials = {
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
credentials: {
|
|
||||||
email: '',
|
email: '',
|
||||||
},
|
};
|
||||||
validationSent: false,
|
validationSent = false;
|
||||||
error: false,
|
error = false;
|
||||||
state: {
|
state = {
|
||||||
email: {
|
email: {
|
||||||
status: null,
|
status: null,
|
||||||
msg: '',
|
msg: '',
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
rules: {
|
rules = {
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
email: (value) => {
|
email: (value) => {
|
||||||
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||||
return pattern.test(value) || 'Invalid e-mail.';
|
return pattern.test(value) || 'Invalid e-mail.';
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
mounted() {
|
mounted() {
|
||||||
this.credentials.email = this.email;
|
this.credentials.email = this.email;
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
resendConfirmationAction(e) {
|
resendConfirmationAction(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
fetchStory('/users/resend', this.$store, { method: 'POST', body: JSON.stringify(this.credentials) }).then(() => {
|
|
||||||
this.validationSent = true;
|
// FIXME: implement fetchStory
|
||||||
}).catch((err) => {
|
// fetchStory('/users/resend', this.$store, { method: 'POST', body: JSON.stringify(this.credentials) }).then(() => {
|
||||||
Promise.resolve(err).then(() => {
|
// this.validationSent = true;
|
||||||
this.error = true;
|
// }).catch((err) => {
|
||||||
this.validationSent = true;
|
// Promise.resolve(err).then(() => {
|
||||||
});
|
// this.error = true;
|
||||||
});
|
// this.validationSent = true;
|
||||||
},
|
// });
|
||||||
},
|
// });
|
||||||
};
|
}
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -30,54 +30,51 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
name: 'SendPasswordReset',
|
|
||||||
props: {
|
@Component
|
||||||
email: {
|
export default class SendPasswordReset extends Vue {
|
||||||
type: String,
|
@Prop({ type: String, required: false, default: '' }) email!: string;
|
||||||
required: false,
|
|
||||||
default: '',
|
credentials = {
|
||||||
},
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.credentials.email = this.email;
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
credentials: {
|
|
||||||
email: '',
|
email: '',
|
||||||
},
|
};
|
||||||
validationSent: false,
|
validationSent = false;
|
||||||
error: false,
|
error = false;
|
||||||
state: {
|
state = {
|
||||||
email: {
|
email: {
|
||||||
status: null,
|
status: null,
|
||||||
msg: '',
|
msg: '',
|
||||||
},
|
},
|
||||||
},
|
};
|
||||||
rules: {
|
|
||||||
|
rules = {
|
||||||
required: value => !!value || 'Required.',
|
required: value => !!value || 'Required.',
|
||||||
email: (value) => {
|
email: (value) => {
|
||||||
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
const pattern = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
|
||||||
return pattern.test(value) || 'Invalid e-mail.';
|
return pattern.test(value) || 'Invalid e-mail.';
|
||||||
},
|
},
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
methods: {
|
mounted() {
|
||||||
|
this.credentials.email = this.email;
|
||||||
|
}
|
||||||
|
|
||||||
resendConfirmationAction(e) {
|
resendConfirmationAction(e) {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
fetchStory('/users/password-reset/send', this.$store, { method: 'POST', body: JSON.stringify(this.credentials) }).then(() => {
|
// FIXME: implement fetchStory
|
||||||
this.error = false;
|
// fetchStory('/users/password-reset/send', this.$store, { method: 'POST', body: JSON.stringify(this.credentials) }).then(() => {
|
||||||
this.validationSent = true;
|
// this.error = false;
|
||||||
}).catch((err) => {
|
// this.validationSent = true;
|
||||||
Promise.resolve(err).then((data) => {
|
// }).catch((err) => {
|
||||||
this.error = true;
|
// Promise.resolve(err).then((data) => {
|
||||||
this.state.email = { status: false, msg: data.errors };
|
// this.error = true;
|
||||||
});
|
// this.state.email = { status: false, msg: data.errors };
|
||||||
});
|
// });
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
resetState() {
|
resetState() {
|
||||||
this.state = {
|
this.state = {
|
||||||
email: {
|
email: {
|
||||||
@ -85,7 +82,6 @@ export default {
|
|||||||
msg: '',
|
msg: '',
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
},
|
}
|
||||||
},
|
};
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
@ -1,36 +1,37 @@
|
|||||||
<template>
|
<template>
|
||||||
<v-container>
|
<v-container>
|
||||||
<h1 v-if="loading"><translate>Your account is being validated</translate></h1>
|
<h1 v-if="loading">
|
||||||
|
<translate>Your account is being validated</translate>
|
||||||
|
</h1>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<div v-if="failed">
|
<div v-if="failed">
|
||||||
<v-alert :value="true" variant="danger"><translate>Error while validating account</translate></v-alert>
|
<v-alert :value="true" variant="danger">
|
||||||
|
<translate>Error while validating account</translate>
|
||||||
|
</v-alert>
|
||||||
</div>
|
</div>
|
||||||
<h1 v-else><translate>Your account has been validated</translate></h1>
|
<h1 v-else>
|
||||||
|
<translate>Your account has been validated</translate>
|
||||||
|
</h1>
|
||||||
</div>
|
</div>
|
||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import { VALIDATE_USER } from '@/graphql/user';
|
import { VALIDATE_USER } from '@/graphql/user';
|
||||||
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
|
import { AUTH_TOKEN, AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
||||||
|
|
||||||
|
@Component
|
||||||
|
export default class Validate extends Vue {
|
||||||
|
@Prop({ type: String, required: true }) token!: string;
|
||||||
|
|
||||||
|
loading = true;
|
||||||
|
failed = false;
|
||||||
|
|
||||||
export default {
|
|
||||||
name: 'Validate',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
loading: true,
|
|
||||||
failed: false,
|
|
||||||
};
|
|
||||||
},
|
|
||||||
props: {
|
|
||||||
token: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
created() {
|
||||||
this.validateAction();
|
this.validateAction();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
validateAction() {
|
validateAction() {
|
||||||
this.$apollo.mutate({
|
this.$apollo.mutate({
|
||||||
mutation: VALIDATE_USER,
|
mutation: VALIDATE_USER,
|
||||||
@ -41,18 +42,19 @@ export default {
|
|||||||
this.loading = false;
|
this.loading = false;
|
||||||
console.log(data);
|
console.log(data);
|
||||||
this.saveUserData(data.data);
|
this.saveUserData(data.data);
|
||||||
this.$router.push({name: 'Home'});
|
this.$router.push({ name: 'Home' });
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
console.log(error);
|
console.log(error);
|
||||||
this.failed = true;
|
this.failed = true;
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
saveUserData({validateUser: login}) {
|
|
||||||
|
saveUserData({ validateUser: login }) {
|
||||||
localStorage.setItem(AUTH_USER_ID, login.user.id);
|
localStorage.setItem(AUTH_USER_ID, login.user.id);
|
||||||
localStorage.setItem(AUTH_USER_ACTOR, JSON.stringify(login.actor));
|
localStorage.setItem(AUTH_USER_ACTOR, JSON.stringify(login.actor));
|
||||||
localStorage.setItem(AUTH_TOKEN, login.token);
|
localStorage.setItem(AUTH_TOKEN, login.token);
|
||||||
}
|
}
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -4,7 +4,9 @@
|
|||||||
<v-flex xs12 sm8 md4>
|
<v-flex xs12 sm8 md4>
|
||||||
<v-card class="elevation-12">
|
<v-card class="elevation-12">
|
||||||
<v-toolbar dark color="primary">
|
<v-toolbar dark color="primary">
|
||||||
<v-toolbar-title><translate>Create a new category</translate></v-toolbar-title>
|
<v-toolbar-title>
|
||||||
|
<translate>Create a new category</translate>
|
||||||
|
</v-toolbar-title>
|
||||||
</v-toolbar>
|
</v-toolbar>
|
||||||
<v-card-text>
|
<v-card-text>
|
||||||
<v-form>
|
<v-form>
|
||||||
@ -29,7 +31,9 @@
|
|||||||
@change="onFilePicked"
|
@change="onFilePicked"
|
||||||
>
|
>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
<v-btn color="primary" @click="create"><translate>Create category</translate></v-btn>
|
<v-btn color="primary" @click="create">
|
||||||
|
<translate>Create category</translate>
|
||||||
|
</v-btn>
|
||||||
</v-form>
|
</v-form>
|
||||||
</v-card-text>
|
</v-card-text>
|
||||||
</v-card>
|
</v-card>
|
||||||
@ -38,50 +42,48 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import { UPLOAD_PICTURE } from '@/graphql/upload';
|
import { CREATE_CATEGORY } from '@/graphql/category';
|
||||||
import { CREATE_CATEGORY } from '@/graphql/category';
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component
|
||||||
name: 'create-category',
|
export default class CreateCategory extends Vue {
|
||||||
data() {
|
title = '';
|
||||||
return {
|
description = '';
|
||||||
title: '',
|
image = {
|
||||||
description: '',
|
|
||||||
image: {
|
|
||||||
url: '',
|
url: '',
|
||||||
name: '',
|
name: '',
|
||||||
file: '',
|
file: '',
|
||||||
},
|
|
||||||
};
|
};
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
create() {
|
create() {
|
||||||
this.$apollo.mutate({
|
this.$apollo.mutate({
|
||||||
mutation: CREATE_CATEGORY,
|
mutation: CREATE_CATEGORY,
|
||||||
variables: {
|
variables: {
|
||||||
title: this.title,
|
title: this.title,
|
||||||
description: this.description,
|
description: this.description,
|
||||||
picture: this.$refs.image.files[0],
|
picture: (this.$refs['image'] as any).files[ 0 ],
|
||||||
}
|
},
|
||||||
}).then((data) => {
|
}).then((data) => {
|
||||||
console.log(data);
|
console.log(data);
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.error(error);
|
console.error(error);
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
pickFile () {
|
|
||||||
this.$refs.image.click ()
|
pickFile() {
|
||||||
},
|
(this.$refs['image'] as any).click();
|
||||||
|
}
|
||||||
|
|
||||||
onFilePicked(e) {
|
onFilePicked(e) {
|
||||||
const files = e.target.files;
|
const files = e.target.files;
|
||||||
if(files[0] === undefined || files[0].name.lastIndexOf('.') <= 0) {
|
if (files[ 0 ] === undefined || files[ 0 ].name.lastIndexOf('.') <= 0) {
|
||||||
console.error("File is incorrect")
|
console.error('File is incorrect');
|
||||||
}
|
}
|
||||||
this.image.name = files[0].name;
|
this.image.name = files[ 0 ].name;
|
||||||
},
|
}
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
@ -15,8 +15,12 @@
|
|||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
<v-btn flat class="orange--text"><translate>Explore</translate></v-btn>
|
<v-btn flat class="orange--text">
|
||||||
<v-btn flat class="red--text" v-on:click="deleteCategory(category.id)"><translate>Delete</translate></v-btn>
|
<translate>Explore</translate>
|
||||||
|
</v-btn>
|
||||||
|
<v-btn flat class="red--text" v-on:click="deleteCategory(category.id)">
|
||||||
|
<translate>Delete</translate>
|
||||||
|
</v-btn>
|
||||||
</v-card-actions>
|
</v-card-actions>
|
||||||
</v-card>
|
</v-card>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
@ -30,37 +34,34 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import { FETCH_CATEGORIES } from '@/graphql/category';
|
import { FETCH_CATEGORIES } from '@/graphql/category';
|
||||||
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
// TODO : remove this hardcode
|
// TODO : remove this hardcode
|
||||||
|
|
||||||
|
@Component({
|
||||||
export default {
|
|
||||||
name: 'Home',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
categories: [],
|
|
||||||
loading: true,
|
|
||||||
HTTP_ENDPOINT: 'http://localhost:4000',
|
|
||||||
};
|
|
||||||
},
|
|
||||||
apollo: {
|
apollo: {
|
||||||
categories: {
|
categories: {
|
||||||
query: FETCH_CATEGORIES,
|
query: FETCH_CATEGORIES,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
})
|
||||||
|
export default class List extends Vue {
|
||||||
|
categories = [];
|
||||||
|
loading = true;
|
||||||
|
HTTP_ENDPOINT = 'http://localhost:4000';
|
||||||
|
|
||||||
deleteCategory(categoryId) {
|
deleteCategory(categoryId) {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
eventFetch(`/categories/${categoryId}`, this.$store, { method: 'DELETE' })
|
// FIXME: remove eventFetch
|
||||||
.then(() => {
|
// eventFetch(`/categories/${categoryId}`, this.$store, { method: 'DELETE' })
|
||||||
this.categories = this.categories.filter(category => category.id !== categoryId);
|
// .then(() => {
|
||||||
router.push('/category');
|
// this.categories = this.categories.filter(category => category.id !== categoryId);
|
||||||
});
|
// router.push('/category');
|
||||||
},
|
// });
|
||||||
},
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
@ -65,30 +65,31 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
// import Location from '@/components/Location';
|
// import Location from '@/components/Location';
|
||||||
import VueMarkdown from 'vue-markdown';
|
import VueMarkdown from 'vue-markdown';
|
||||||
import { CREATE_EVENT, EDIT_EVENT } from '@/graphql/event';
|
import { CREATE_EVENT, EDIT_EVENT } from '@/graphql/event';
|
||||||
import { FETCH_CATEGORIES } from '@/graphql/category';
|
import { FETCH_CATEGORIES } from '@/graphql/category';
|
||||||
import { AUTH_USER_ACTOR } from '@/constants';
|
import { AUTH_USER_ACTOR } from '@/constants';
|
||||||
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'create-event',
|
|
||||||
props: {
|
|
||||||
uuid: {
|
|
||||||
required: false,
|
|
||||||
type: String,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
components: {
|
components: {
|
||||||
/* Location, */
|
VueMarkdown
|
||||||
VueMarkdown,
|
|
||||||
},
|
},
|
||||||
data() {
|
apollo: {
|
||||||
return {
|
categories: {
|
||||||
e1: 0,
|
query: FETCH_CATEGORIES,
|
||||||
event: {
|
},
|
||||||
|
}
|
||||||
|
})
|
||||||
|
export default class CreateEvent extends Vue {
|
||||||
|
@Prop({required: false, type: String}) uuid!: string
|
||||||
|
|
||||||
|
e1 = 0
|
||||||
|
event = {
|
||||||
title: null,
|
title: null,
|
||||||
|
organizer_actor_id: null,
|
||||||
description: '',
|
description: '',
|
||||||
begins_on: (new Date()).toISOString().substr(0, 10),
|
begins_on: (new Date()).toISOString().substr(0, 10),
|
||||||
ends_on: new Date(),
|
ends_on: new Date(),
|
||||||
@ -102,25 +103,20 @@ export default {
|
|||||||
category_id: null,
|
category_id: null,
|
||||||
tags: [],
|
tags: [],
|
||||||
participants: [],
|
participants: [],
|
||||||
},
|
} as any // FIXME: correctly type an event
|
||||||
categories: [],
|
categories = []
|
||||||
tags: [],
|
tags = []
|
||||||
tagsToSend: [],
|
tagsToSend = []
|
||||||
tagsFetched: [],
|
tagsFetched = []
|
||||||
};
|
loading = false
|
||||||
},
|
|
||||||
// created() {
|
// created() {
|
||||||
// if (this.uuid) {
|
// if (this.uuid) {
|
||||||
// this.fetchEvent();
|
// this.fetchEvent();
|
||||||
// }
|
// }
|
||||||
// },
|
// }
|
||||||
apollo: {
|
|
||||||
categories: {
|
create () {
|
||||||
query: FETCH_CATEGORIES,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
create() {
|
|
||||||
// this.event.seats = parseInt(this.event.seats, 10);
|
// this.event.seats = parseInt(this.event.seats, 10);
|
||||||
// this.tagsToSend.forEach((tag) => {
|
// this.tagsToSend.forEach((tag) => {
|
||||||
// this.event.tags.push({
|
// this.event.tags.push({
|
||||||
@ -128,10 +124,11 @@ export default {
|
|||||||
// // '@type': 'Tag',
|
// // '@type': 'Tag',
|
||||||
// });
|
// });
|
||||||
// });
|
// });
|
||||||
const actor = JSON.parse(localStorage.getItem(AUTH_USER_ACTOR));
|
// FIXME: correctly parse actor JSON
|
||||||
this.event.category_id = this.event.category;
|
const actor = JSON.parse(localStorage.getItem(AUTH_USER_ACTOR) || '{}')
|
||||||
this.event.organizer_actor_id = actor.id;
|
this.event.category_id = this.event.category
|
||||||
this.event.participants = [actor.id];
|
this.event.organizer_actor_id = actor.id
|
||||||
|
this.event.participants = [actor.id]
|
||||||
// this.event.price = parseFloat(this.event.price);
|
// this.event.price = parseFloat(this.event.price);
|
||||||
|
|
||||||
if (this.uuid === undefined) {
|
if (this.uuid === undefined) {
|
||||||
@ -146,33 +143,25 @@ export default {
|
|||||||
addressType: this.event.location_type,
|
addressType: this.event.location_type,
|
||||||
}
|
}
|
||||||
}).then((data) => {
|
}).then((data) => {
|
||||||
this.loading = false;
|
this.loading = false
|
||||||
this.$router.push({ name: 'Event', params: { uuid: data.data.uuid } });
|
this.$router.push({name: 'Event', params: {uuid: data.data.uuid}})
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.log(error);
|
console.log(error)
|
||||||
});
|
})
|
||||||
} else {
|
} else {
|
||||||
this.$apollo.mutate({
|
this.$apollo.mutate({
|
||||||
mutation: EDIT_EVENT,
|
mutation: EDIT_EVENT,
|
||||||
}).then((data) => {
|
}).then((data) => {
|
||||||
this.loading = false;
|
this.loading = false
|
||||||
this.$router.push({ name: 'Event', params: { uuid: data.data.uuid } });
|
this.$router.push({name: 'Event', params: {uuid: data.data.uuid}})
|
||||||
}).catch((error) => {
|
}).catch((error) => {
|
||||||
console.log(error);
|
console.log(error)
|
||||||
});
|
})
|
||||||
}
|
}
|
||||||
this.event.tags = [];
|
this.event.tags = []
|
||||||
},
|
}
|
||||||
// fetchEvent() {
|
|
||||||
// eventFetch(`/events/${this.id}`, this.$store)
|
getAddressData (addressData) {
|
||||||
// .then(response => response.json())
|
|
||||||
// .then((data) => {
|
|
||||||
// this.loading = false;
|
|
||||||
// this.event = data;
|
|
||||||
// console.log(this.event);
|
|
||||||
// });
|
|
||||||
// },
|
|
||||||
getAddressData(addressData) {
|
|
||||||
if (addressData !== null) {
|
if (addressData !== null) {
|
||||||
this.event.address = {
|
this.event.address = {
|
||||||
geom: {
|
geom: {
|
||||||
@ -187,11 +176,11 @@ export default {
|
|||||||
addressRegion: addressData.administrative_area_level_1,
|
addressRegion: addressData.administrative_area_level_1,
|
||||||
postalCode: addressData.postal_code,
|
postalCode: addressData.postal_code,
|
||||||
streetAddress: `${addressData.street_number} ${addressData.route}`,
|
streetAddress: `${addressData.street_number} ${addressData.route}`,
|
||||||
};
|
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
@ -97,28 +97,29 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
props: ['id'],
|
|
||||||
data() {
|
@Component
|
||||||
return {
|
export default class EventEdit extends Vue {
|
||||||
loading: true,
|
@Prop(String) id!: string;
|
||||||
event: null,
|
|
||||||
};
|
loading = true;
|
||||||
},
|
event = null;
|
||||||
|
|
||||||
created() {
|
created() {
|
||||||
this.fetchData();
|
this.fetchData();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
fetchData() {
|
fetchData() {
|
||||||
eventFetch(`/events/${this.id}`, this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/events/${this.id}`, this.$store)
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
this.loading = false;
|
// .then((data) => {
|
||||||
this.event = data;
|
// this.loading = false;
|
||||||
console.log(this.event);
|
// this.event = data;
|
||||||
});
|
// console.log(this.event);
|
||||||
},
|
// });
|
||||||
},
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -54,7 +54,9 @@
|
|||||||
<!-- <span v-if="event.organizerActor">Organisé par {{ event.organizerActor.name ? event.organizerActor.name : event.organizerActor.preferredUsername }}</span> -->
|
<!-- <span v-if="event.organizerActor">Organisé par {{ event.organizerActor.name ? event.organizerActor.name : event.organizerActor.preferredUsername }}</span> -->
|
||||||
</div>
|
</div>
|
||||||
<!-- <p><router-link :to="{ name: 'Account', params: {id: event.organizer.id} }"><span class="grey--text">{{ event.organizer.username }}</span></router-link> organises {{ event.title }} <span v-if="event.address.addressLocality">in {{ event.address.addressLocality }}</span> on the {{ event.startDate | formatDate }}.</p> -->
|
<!-- <p><router-link :to="{ name: 'Account', params: {id: event.organizer.id} }"><span class="grey--text">{{ event.organizer.username }}</span></router-link> organises {{ event.title }} <span v-if="event.address.addressLocality">in {{ event.address.addressLocality }}</span> on the {{ event.startDate | formatDate }}.</p> -->
|
||||||
<v-card-text v-if="event.description"><vue-markdown :source="event.description"></vue-markdown></v-card-text>
|
<v-card-text v-if="event.description">
|
||||||
|
<vue-markdown :source="event.description"></vue-markdown>
|
||||||
|
</v-card-text>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
<!-- <v-flex md2>
|
<!-- <v-flex md2>
|
||||||
<p v-if="actorIsOrganizer()">
|
<p v-if="actorIsOrganizer()">
|
||||||
@ -146,32 +148,15 @@
|
|||||||
</v-layout>
|
</v-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import VueMarkdown from 'vue-markdown';
|
import { FETCH_EVENT } from '@/graphql/event';
|
||||||
import { FETCH_EVENT } from '@/graphql/event';
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
import { LOGGED_ACTOR } from '@/graphql/actor';
|
import VueMarkdown from 'vue-markdown';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'Home',
|
|
||||||
components: {
|
components: {
|
||||||
VueMarkdown,
|
VueMarkdown,
|
||||||
},
|
},
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
event: {
|
|
||||||
name: '',
|
|
||||||
slug: '',
|
|
||||||
title: '',
|
|
||||||
uuid: this.uuid,
|
|
||||||
description: '',
|
|
||||||
organizer: {
|
|
||||||
id: null,
|
|
||||||
username: null,
|
|
||||||
},
|
|
||||||
participants: [],
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
apollo: {
|
apollo: {
|
||||||
event: {
|
event: {
|
||||||
query: FETCH_EVENT,
|
query: FETCH_EVENT,
|
||||||
@ -185,58 +170,76 @@ export default {
|
|||||||
// query: LOGGED_ACTOR,
|
// query: LOGGED_ACTOR,
|
||||||
// }
|
// }
|
||||||
},
|
},
|
||||||
methods: {
|
})
|
||||||
|
export default class Event extends Vue {
|
||||||
|
@Prop({ type: String, required: true }) uuid!: string;
|
||||||
|
|
||||||
|
event = {
|
||||||
|
name: '',
|
||||||
|
slug: '',
|
||||||
|
title: '',
|
||||||
|
uuid: this.uuid,
|
||||||
|
description: '',
|
||||||
|
organizer: {
|
||||||
|
id: null,
|
||||||
|
username: null,
|
||||||
|
},
|
||||||
|
participants: [],
|
||||||
|
};
|
||||||
|
|
||||||
deleteEvent() {
|
deleteEvent() {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
eventFetch(`/events/${this.uuid}`, this.$store, { method: 'DELETE' })
|
// FIXME: remove eventFetch
|
||||||
.then(() => router.push({ name: 'EventList' }));
|
// eventFetch(`/events/${this.uuid}`, this.$store, { method: 'DELETE' })
|
||||||
},
|
// .then(() => router.push({ name: 'EventList' }));
|
||||||
|
}
|
||||||
|
|
||||||
joinEvent() {
|
joinEvent() {
|
||||||
eventFetch(`/events/${this.uuid}/join`, this.$store, { method: 'POST' })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/events/${this.uuid}/join`, this.$store, { method: 'POST' })
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
console.log(data);
|
// .then((data) => {
|
||||||
});
|
// console.log(data);
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
leaveEvent() {
|
leaveEvent() {
|
||||||
eventFetch(`/events/${this.uuid}/leave`, this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/events/${this.uuid}/leave`, this.$store)
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
console.log(data);
|
// .then((data) => {
|
||||||
});
|
// console.log(data);
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
downloadIcsEvent() {
|
downloadIcsEvent() {
|
||||||
eventFetch(`/events/${this.uuid}/ics`, this.$store, { responseType: 'arraybuffer' })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.text())
|
// eventFetch(`/events/${this.uuid}/ics`, this.$store, { responseType: 'arraybuffer' })
|
||||||
.then((response) => {
|
// .then(response => response.text())
|
||||||
const blob = new Blob([response], { type: 'text/calendar' });
|
// .then((response) => {
|
||||||
const link = document.createElement('a');
|
// const blob = new Blob([ response ], { type: 'text/calendar' });
|
||||||
link.href = window.URL.createObjectURL(blob);
|
// const link = document.createElement('a');
|
||||||
link.download = `${this.event.title}.ics`;
|
// link.href = window.URL.createObjectURL(blob);
|
||||||
document.body.appendChild(link);
|
// link.download = `${this.event.title}.ics`;
|
||||||
link.click();
|
// document.body.appendChild(link);
|
||||||
document.body.removeChild(link);
|
// link.click();
|
||||||
});
|
// document.body.removeChild(link);
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
// actorIsParticipant() {
|
// actorIsParticipant() {
|
||||||
// return this.loggedActor && this.event.participants.map(participant => participant.actor.preferredUsername).includes(this.loggedActor.preferredUsername) || this.actorIsOrganizer();
|
// return this.loggedActor && this.event.participants.map(participant => participant.actor.preferredUsername).includes(this.loggedActor.preferredUsername) || this.actorIsOrganizer();
|
||||||
// },
|
// }
|
||||||
|
//
|
||||||
// actorIsOrganizer() {
|
// actorIsOrganizer() {
|
||||||
// return this.loggedActor && this.loggedActor.preferredUsername === this.event.organizer.preferredUsername;
|
// return this.loggedActor && this.loggedActor.preferredUsername === this.event.organizer.preferredUsername;
|
||||||
// },
|
// }
|
||||||
},
|
}
|
||||||
props: {
|
|
||||||
uuid: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
<style>
|
<style>
|
||||||
.v-card__media__background {
|
.v-card__media__background {
|
||||||
filter: contrast(0.4);
|
filter: contrast(0.4);
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
@ -2,11 +2,12 @@
|
|||||||
<v-layout>
|
<v-layout>
|
||||||
<v-flex xs12 sm8 offset-sm2>
|
<v-flex xs12 sm8 offset-sm2>
|
||||||
<v-card>
|
<v-card>
|
||||||
<h1>{{ $t("event.list.title") }}</h1>
|
<h1>{{ $t('event.list.title') }}</h1>
|
||||||
|
|
||||||
<v-progress-circular v-if="loading" indeterminate color="primary"></v-progress-circular>
|
<v-progress-circular v-if="loading" indeterminate color="primary"></v-progress-circular>
|
||||||
<v-chip close v-model="locationChip" label color="pink" text-color="white" v-if="$router.currentRoute.params.location">
|
<v-chip close v-model="locationChip" label color="pink" text-color="white" v-if="$router.currentRoute.params.location">
|
||||||
<v-icon left>location_city</v-icon>{{ locationText }}
|
<v-icon left>location_city</v-icon>
|
||||||
|
{{ locationText }}
|
||||||
</v-chip>
|
</v-chip>
|
||||||
<v-container grid-list-sm fluid>
|
<v-container grid-list-sm fluid>
|
||||||
<v-layout row wrap>
|
<v-layout row wrap>
|
||||||
@ -35,7 +36,8 @@
|
|||||||
>
|
>
|
||||||
</v-avatar>
|
</v-avatar>
|
||||||
</router-link>
|
</router-link>
|
||||||
<span v-if="event.organizer">Organisé par <router-link :to="{name: 'Account', params: {'name': event.organizer.username}}">{{ event.organizer.username }}</router-link></span>
|
<span v-if="event.organizer">Organisé par <router-link
|
||||||
|
:to="{name: 'Account', params: {'name': event.organizer.username}}">{{ event.organizer.username }}</router-link></span>
|
||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
@ -53,46 +55,48 @@
|
|||||||
</v-layout>
|
</v-layout>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import ngeohash from 'ngeohash';
|
import ngeohash from 'ngeohash';
|
||||||
import VueMarkdown from 'vue-markdown';
|
import VueMarkdown from 'vue-markdown';
|
||||||
import VCardTitle from 'vuetify/es5/components/VCard/VCardTitle';
|
import VCardTitle from 'vuetify/es5/components/VCard/VCardTitle';
|
||||||
|
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'EventList',
|
|
||||||
components: {
|
components: {
|
||||||
VCardTitle,
|
VCardTitle: VCardTitle as any,
|
||||||
VueMarkdown,
|
VueMarkdown,
|
||||||
},
|
},
|
||||||
data() {
|
})
|
||||||
return {
|
export default class EventList extends Vue {
|
||||||
events: [],
|
@Prop(String) location!: string;
|
||||||
loading: true,
|
|
||||||
locationChip: false,
|
events = [];
|
||||||
locationText: '',
|
loading = true;
|
||||||
};
|
locationChip = false;
|
||||||
},
|
locationText = '';
|
||||||
props: ['location'],
|
|
||||||
created() {
|
created() {
|
||||||
this.fetchData(this.$router.currentRoute.params.location);
|
this.fetchData(this.$router.currentRoute.params[ 'location' ]);
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
locationChip(val) {
|
|
||||||
if (val === false) {
|
|
||||||
this.$router.push({ name: 'EventList' });
|
|
||||||
}
|
}
|
||||||
},
|
|
||||||
},
|
|
||||||
beforeRouteUpdate(to, from, next) {
|
beforeRouteUpdate(to, from, next) {
|
||||||
this.fetchData(to.params.location);
|
this.fetchData(to.params.location);
|
||||||
next();
|
next();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
|
@Watch('locationChip')
|
||||||
|
onLocationChipChange(val) {
|
||||||
|
if (val === false) {
|
||||||
|
this.$router.push({ name: 'EventList' });
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
geocode(lat, lon) {
|
geocode(lat, lon) {
|
||||||
console.log({ lat, lon });
|
console.log({ lat, lon });
|
||||||
console.log(ngeohash.encode(lat, lon, 10));
|
console.log(ngeohash.encode(lat, lon, 10));
|
||||||
return ngeohash.encode(lat, lon, 10);
|
return ngeohash.encode(lat, lon, 10);
|
||||||
},
|
}
|
||||||
|
|
||||||
fetchData(location) {
|
fetchData(location) {
|
||||||
let queryString = '/events';
|
let queryString = '/events';
|
||||||
if (location) {
|
if (location) {
|
||||||
@ -101,37 +105,43 @@ export default {
|
|||||||
this.locationText = `${latitude.toString()} : ${longitude.toString()}`;
|
this.locationText = `${latitude.toString()} : ${longitude.toString()}`;
|
||||||
}
|
}
|
||||||
this.locationChip = true;
|
this.locationChip = true;
|
||||||
eventFetch(queryString, this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(queryString, this.$store)
|
||||||
.then((response) => {
|
// .then(response => response.json())
|
||||||
this.loading = false;
|
// .then((response) => {
|
||||||
this.events = response.data;
|
// this.loading = false;
|
||||||
console.log(this.events);
|
// this.events = response.data;
|
||||||
});
|
// console.log(this.events);
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
deleteEvent(event) {
|
deleteEvent(event) {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
eventFetch(`/events/${event.uuid}`, this.$store, { method: 'DELETE' })
|
// FIXME: remove eventFetch
|
||||||
.then(() => router.push('/events'));
|
// eventFetch(`/events/${event.uuid}`, this.$store, { method: 'DELETE' })
|
||||||
},
|
// .then(() => router.push('/events'));
|
||||||
|
}
|
||||||
|
|
||||||
viewEvent(event) {
|
viewEvent(event) {
|
||||||
this.$router.push({ name: 'Event', params: { uuid: event.uuid } });
|
this.$router.push({ name: 'Event', params: { uuid: event.uuid } });
|
||||||
},
|
}
|
||||||
|
|
||||||
downloadIcsEvent(event) {
|
downloadIcsEvent(event) {
|
||||||
eventFetch(`/events/${event.uuid}/ics`, this.$store, { responseType: 'arraybuffer' })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.text())
|
// eventFetch(`/events/${event.uuid}/ics`, this.$store, { responseType: 'arraybuffer' })
|
||||||
.then((response) => {
|
// .then(response => response.text())
|
||||||
const blob = new Blob([response], { type: 'text/calendar' });
|
// .then((response) => {
|
||||||
const link = document.createElement('a');
|
// const blob = new Blob([ response ], { type: 'text/calendar' });
|
||||||
link.href = window.URL.createObjectURL(blob);
|
// const link = document.createElement('a');
|
||||||
link.download = `${event.title}.ics`;
|
// link.href = window.URL.createObjectURL(blob);
|
||||||
document.body.appendChild(link);
|
// link.download = `${event.title}.ics`;
|
||||||
link.click();
|
// document.body.appendChild(link);
|
||||||
document.body.removeChild(link);
|
// link.click();
|
||||||
});
|
// document.body.removeChild(link);
|
||||||
},
|
// });
|
||||||
},
|
}
|
||||||
};
|
|
||||||
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
@ -64,51 +64,54 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import VueMarkdown from 'vue-markdown';
|
import VueMarkdown from 'vue-markdown';
|
||||||
import VuetifyGoogleAutocomplete from 'vuetify-google-autocomplete';
|
import VuetifyGoogleAutocomplete from 'vuetify-google-autocomplete';
|
||||||
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
export default {
|
|
||||||
name: 'create-group',
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
components: {
|
components: {
|
||||||
VueMarkdown,
|
VueMarkdown,
|
||||||
VuetifyGoogleAutocomplete,
|
VuetifyGoogleAutocomplete,
|
||||||
},
|
},
|
||||||
data() {
|
})
|
||||||
return {
|
export default class CreateGroup extends Vue {
|
||||||
e1: 0,
|
e1 = 0;
|
||||||
group: {
|
// FIXME: correctly type group
|
||||||
|
group: { preferred_username: string, name: string, summary: string, address?: any } = {
|
||||||
preferred_username: '',
|
preferred_username: '',
|
||||||
name: '',
|
name: '',
|
||||||
summary: '',
|
summary: '',
|
||||||
// category: null,
|
// category: null,
|
||||||
},
|
|
||||||
categories: [],
|
|
||||||
};
|
};
|
||||||
},
|
categories = [];
|
||||||
|
|
||||||
mounted() {
|
mounted() {
|
||||||
this.fetchCategories();
|
this.fetchCategories();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
create() {
|
create() {
|
||||||
// this.group.organizer = "/accounts/" + this.$store.state.user.id;
|
// this.group.organizer = "/accounts/" + this.$store.state.user.id;
|
||||||
|
|
||||||
eventFetch('/groups', this.$store, { method: 'POST', body: JSON.stringify({ group: this.group }) })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch('/groups', this.$store, { method: 'POST', body: JSON.stringify({ group: this.group }) })
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
this.loading = false;
|
// .then((data) => {
|
||||||
this.$router.push({ path: 'Group', params: { id: data.id } });
|
// this.loading = false;
|
||||||
});
|
// this.$router.push({ path: 'Group', params: { id: data.id } });
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
fetchCategories() {
|
fetchCategories() {
|
||||||
eventFetch('/categories', this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch('/categories', this.$store)
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
this.loading = false;
|
// .then((data) => {
|
||||||
this.categories = data.data;
|
// this.loading = false;
|
||||||
});
|
// this.categories = data.data;
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
getAddressData(addressData) {
|
getAddressData(addressData) {
|
||||||
this.group.address = {
|
this.group.address = {
|
||||||
geo: {
|
geo: {
|
||||||
@ -121,9 +124,9 @@ export default {
|
|||||||
postalCode: addressData.postal_code,
|
postalCode: addressData.postal_code,
|
||||||
streetAddress: `${addressData.street_number} ${addressData.route}`,
|
streetAddress: `${addressData.street_number} ${addressData.route}`,
|
||||||
};
|
};
|
||||||
},
|
}
|
||||||
},
|
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
@ -135,7 +135,10 @@
|
|||||||
<div>
|
<div>
|
||||||
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
||||||
<p>{{ event.description }}</p>
|
<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>
|
<p v-if="event.organizer">Organisé par
|
||||||
|
<router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}
|
||||||
|
</router-link>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
@ -176,7 +179,10 @@
|
|||||||
<div>
|
<div>
|
||||||
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
<span class="grey--text">{{ event.startDate | formatDate }} à {{ event.location }}</span><br>
|
||||||
<p>{{ event.description }}</p>
|
<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>
|
<p v-if="event.organizer">Organisé par
|
||||||
|
<router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}
|
||||||
|
</router-link>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
@ -201,38 +207,35 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
|
||||||
name: 'Group',
|
|
||||||
data() {
|
@Component
|
||||||
return {
|
export default class Group extends Vue {
|
||||||
group: null,
|
@Prop({ type: String, required: true }) name!: string;
|
||||||
loading: true,
|
|
||||||
};
|
group = null;
|
||||||
},
|
loading = true;
|
||||||
props: {
|
|
||||||
name: {
|
|
||||||
type: String,
|
|
||||||
required: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
created() {
|
created() {
|
||||||
this.fetchData();
|
this.fetchData();
|
||||||
},
|
}
|
||||||
watch: {
|
|
||||||
|
@Watch('$route')
|
||||||
|
onRouteChanged() {
|
||||||
// call again the method if the route changes
|
// call again the method if the route changes
|
||||||
$route: 'fetchData',
|
this.fetchData();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
fetchData() {
|
fetchData() {
|
||||||
eventFetch(`/actors/${this.name}`, this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/actors/${this.name}`, this.$store)
|
||||||
.then((response) => {
|
// .then(response => response.json())
|
||||||
this.group = response.data;
|
// .then((response) => {
|
||||||
this.loading = false;
|
// this.group = response.data;
|
||||||
console.log(this.group);
|
// this.loading = false;
|
||||||
});
|
// console.log(this.group);
|
||||||
},
|
// });
|
||||||
},
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
@ -22,11 +22,16 @@
|
|||||||
<v-card-title>
|
<v-card-title>
|
||||||
<div>
|
<div>
|
||||||
<p>{{ group.summary }}</p>
|
<p>{{ group.summary }}</p>
|
||||||
<p v-if="group.organizer">Organisé par <router-link :to="{name: 'Account', params: {'id': group.organizer.id}}">{{ group.organizer.username }}</router-link></p>
|
<p v-if="group.organizer">Organisé par
|
||||||
|
<router-link :to="{name: 'Account', params: {'id': group.organizer.id}}">{{ group.organizer.username }}</router-link>
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</v-card-title>
|
</v-card-title>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
<v-btn flat color="green" @click="joinGroup(group)"><v-icon v-if="group.locked">lock</v-icon>Join</v-btn>
|
<v-btn flat color="green" @click="joinGroup(group)">
|
||||||
|
<v-icon v-if="group.locked">lock</v-icon>
|
||||||
|
Join
|
||||||
|
</v-btn>
|
||||||
<v-btn flat color="orange" @click="viewActor(group)">Explore</v-btn>
|
<v-btn flat color="orange" @click="viewActor(group)">Explore</v-btn>
|
||||||
<v-btn flat color="red" @click="deleteGroup(group)">Delete</v-btn>
|
<v-btn flat color="red" @click="deleteGroup(group)">Delete</v-btn>
|
||||||
</v-card-actions>
|
</v-card-actions>
|
||||||
@ -37,48 +42,54 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
export default {
|
|
||||||
name: 'GroupList',
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
data() {
|
|
||||||
return {
|
@Component
|
||||||
groups: [],
|
export default class GroupList extends Vue {
|
||||||
loading: true,
|
groups = [];
|
||||||
};
|
loading = true;
|
||||||
},
|
|
||||||
created() {
|
created() {
|
||||||
this.fetchData();
|
this.fetchData();
|
||||||
},
|
}
|
||||||
methods: {
|
|
||||||
username_with_domain(actor) {
|
usernameWithDomain(actor) {
|
||||||
return actor.username + (actor.domain === null ? '' : `@${actor.domain}`);
|
return actor.username + (actor.domain === null ? '' : `@${actor.domain}`);
|
||||||
},
|
}
|
||||||
|
|
||||||
fetchData() {
|
fetchData() {
|
||||||
eventFetch('/groups', this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch('/groups', this.$store)
|
||||||
.then((data) => {
|
// .then(response => response.json())
|
||||||
console.log(data);
|
// .then((data) => {
|
||||||
this.loading = false;
|
// console.log(data);
|
||||||
this.groups = data.data;
|
// this.loading = false;
|
||||||
});
|
// this.groups = data.data;
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
deleteGroup(group) {
|
deleteGroup(group) {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
eventFetch(`/groups/${this.username_with_domain(group)}`, this.$store, { method: 'DELETE' })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/groups/${this.usernameWithDomain(group)}`, this.$store, { method: 'DELETE' })
|
||||||
.then(() => router.push('/groups'));
|
// .then(response => response.json())
|
||||||
},
|
// .then(() => router.push('/groups'));
|
||||||
|
}
|
||||||
|
|
||||||
viewActor(actor) {
|
viewActor(actor) {
|
||||||
this.$router.push({ name: 'Group', params: { name: this.username_with_domain(actor) } });
|
this.$router.push({ name: 'Group', params: { name: this.usernameWithDomain(actor) } });
|
||||||
},
|
}
|
||||||
|
|
||||||
joinGroup(group) {
|
joinGroup(group) {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
eventFetch(`/groups/${this.username_with_domain(group)}/join`, this.$store, { method: 'POST' })
|
// FIXME: remove eventFetch
|
||||||
.then(response => response.json())
|
// eventFetch(`/groups/${this.usernameWithDomain(group)}/join`, this.$store, { method: 'POST' })
|
||||||
.then(() => router.push({ name: 'Group', params: { name: this.username_with_domain(group) } }));
|
// .then(response => response.json())
|
||||||
},
|
// .then(() => router.push({ name: 'Group', params: { name: this.usernameWithDomain(group) } }));
|
||||||
},
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
|
@ -12,7 +12,9 @@
|
|||||||
<v-flex text-xs-center>
|
<v-flex text-xs-center>
|
||||||
<h1 class="display-3">Find events you like</h1>
|
<h1 class="display-3">Find events you like</h1>
|
||||||
<h2>Share it with Mobilizon</h2>
|
<h2>Share it with Mobilizon</h2>
|
||||||
<v-btn :to="{ name: 'Register' }"><translate>Register</translate></v-btn>
|
<v-btn :to="{ name: 'Register' }">
|
||||||
|
<translate>Register</translate>
|
||||||
|
</v-btn>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
</v-layout>
|
</v-layout>
|
||||||
</v-container>
|
</v-container>
|
||||||
@ -21,11 +23,14 @@
|
|||||||
<v-flex xs12 sm8 offset-sm2>
|
<v-flex xs12 sm8 offset-sm2>
|
||||||
<v-layout row wrap>
|
<v-layout row wrap>
|
||||||
<v-flex xs12 sm6>
|
<v-flex xs12 sm6>
|
||||||
<h1><translate :translate-params="{username: actor.preferredUsername}">Welcome back %{username}</translate></h1>
|
<h1>
|
||||||
|
<translate :translate-params="{username: actor.preferredUsername}">Welcome back %{username}</translate>
|
||||||
|
</h1>
|
||||||
</v-flex>
|
</v-flex>
|
||||||
<v-flex xs12 sm6>
|
<v-flex xs12 sm6>
|
||||||
<v-layout align-center>
|
<v-layout align-center>
|
||||||
<span class="events-nearby title">Events nearby </span><v-text-field
|
<span class="events-nearby title">Events nearby </span>
|
||||||
|
<v-text-field
|
||||||
solo
|
solo
|
||||||
append-icon="place"
|
append-icon="place"
|
||||||
:value="ipLocation()"
|
:value="ipLocation()"
|
||||||
@ -78,51 +83,52 @@
|
|||||||
</v-container>
|
</v-container>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
import ngeohash from 'ngeohash';
|
import ngeohash from 'ngeohash';
|
||||||
import {AUTH_USER_ACTOR, AUTH_USER_ID} from '@/constants';
|
import { AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
||||||
import { FETCH_EVENTS } from '@/graphql/event';
|
import { FETCH_EVENTS } from '@/graphql/event';
|
||||||
|
import { Component, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
export default {
|
@Component({
|
||||||
name: 'Home',
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
gradient: 'to top right, rgba(63,81,181, .7), rgba(25,32,72, .7)',
|
|
||||||
searchTerm: null,
|
|
||||||
location_field: {
|
|
||||||
loading: false,
|
|
||||||
search: null,
|
|
||||||
},
|
|
||||||
events: [],
|
|
||||||
locations: [],
|
|
||||||
city: { name: null },
|
|
||||||
country: { name: null },
|
|
||||||
actor: JSON.parse(localStorage.getItem(AUTH_USER_ACTOR)),
|
|
||||||
user: localStorage.getItem(AUTH_USER_ID),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
apollo: {
|
apollo: {
|
||||||
events: {
|
events: {
|
||||||
query: FETCH_EVENTS,
|
query: FETCH_EVENTS,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
computed: {
|
})
|
||||||
displayed_name() {
|
export default class Home extends Vue {
|
||||||
|
gradient = 'to top right, rgba(63,81,181, .7), rgba(25,32,72, .7)';
|
||||||
|
searchTerm = null;
|
||||||
|
location_field = {
|
||||||
|
loading: false,
|
||||||
|
search: null,
|
||||||
|
};
|
||||||
|
events = [];
|
||||||
|
locations = [];
|
||||||
|
city = { name: null };
|
||||||
|
country = { name: null };
|
||||||
|
// FIXME: correctly parse local storage
|
||||||
|
actor = JSON.parse(localStorage.getItem(AUTH_USER_ACTOR) || '{}');
|
||||||
|
user = localStorage.getItem(AUTH_USER_ID);
|
||||||
|
|
||||||
|
get displayed_name() {
|
||||||
return this.actor.name === null ? this.actor.preferredUsername : this.actor.name;
|
return this.actor.name === null ? this.actor.preferredUsername : this.actor.name;
|
||||||
},
|
}
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
fetchLocations() {
|
fetchLocations() {
|
||||||
eventFetch('/locations', this.$store)
|
// FIXME: remove eventFetch
|
||||||
.then(response => (response.json()))
|
// eventFetch('/locations', this.$store)
|
||||||
.then((response) => {
|
// .then(response => (response.json()))
|
||||||
this.locations = response;
|
// .then((response) => {
|
||||||
});
|
// this.locations = response;
|
||||||
},
|
// });
|
||||||
|
}
|
||||||
|
|
||||||
geoLocalize() {
|
geoLocalize() {
|
||||||
const router = this.$router;
|
const router = this.$router;
|
||||||
if (sessionStorage.getItem('City')) {
|
const sessionCity = sessionStorage.getItem('City')
|
||||||
router.push({ name: 'EventList', params: { location: localStorage.getItem('City') } });
|
if (sessionCity) {
|
||||||
|
router.push({ name: 'EventList', params: { location: sessionCity } });
|
||||||
} else {
|
} else {
|
||||||
navigator.geolocation.getCurrentPosition((pos) => {
|
navigator.geolocation.getCurrentPosition((pos) => {
|
||||||
const crd = pos.coords;
|
const crd = pos.coords;
|
||||||
@ -136,27 +142,29 @@ export default {
|
|||||||
maximumAge: 0,
|
maximumAge: 0,
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
|
|
||||||
getAddressData(addressData) {
|
getAddressData(addressData) {
|
||||||
const geohash = ngeohash.encode(addressData.latitude, addressData.longitude, 11);
|
const geohash = ngeohash.encode(addressData.latitude, addressData.longitude, 11);
|
||||||
sessionStorage.setItem('City', geohash);
|
sessionStorage.setItem('City', geohash);
|
||||||
this.$router.push({ name: 'EventList', params: { location: geohash } });
|
this.$router.push({ name: 'EventList', params: { location: geohash } });
|
||||||
},
|
}
|
||||||
|
|
||||||
viewEvent(event) {
|
viewEvent(event) {
|
||||||
this.$router.push({ name: 'Event', params: { uuid: event.uuid } });
|
this.$router.push({ name: 'Event', params: { uuid: event.uuid } });
|
||||||
},
|
}
|
||||||
|
|
||||||
ipLocation() {
|
ipLocation() {
|
||||||
return this.city.name ? this.city.name : this.country.name;
|
return this.city.name ? this.city.name : this.country.name;
|
||||||
},
|
}
|
||||||
},
|
}
|
||||||
};
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.search-autocomplete {
|
.search-autocomplete {
|
||||||
border: 1px solid #dbdbdb;
|
border: 1px solid #dbdbdb;
|
||||||
color: rgba(0,0,0,.87);
|
color: rgba(0, 0, 0, .87);
|
||||||
}
|
}
|
||||||
|
|
||||||
.events-nearby {
|
.events-nearby {
|
||||||
|
@ -24,29 +24,28 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script lang="ts">
|
||||||
|
import { Component, Prop, Vue } from 'vue-property-decorator';
|
||||||
|
|
||||||
|
@Component
|
||||||
|
export default class Location extends Vue {
|
||||||
|
@Prop(String) address!: string;
|
||||||
|
|
||||||
|
description = 'Paris, France';
|
||||||
|
center = { lat: 48.85, lng: 2.35 };
|
||||||
|
markers: any[] = [];
|
||||||
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
description: 'Paris, France',
|
|
||||||
center: { lat: 48.85, lng: 2.35 },
|
|
||||||
markers: [],
|
|
||||||
};
|
|
||||||
},
|
|
||||||
props: ['address'],
|
|
||||||
methods: {
|
|
||||||
setPlace(place) {
|
setPlace(place) {
|
||||||
this.center = {
|
this.center = {
|
||||||
lat: place.geometry.location.lat(),
|
lat: place.geometry.location.lat(),
|
||||||
lng: place.geometry.location.lng(),
|
lng: place.geometry.location.lng(),
|
||||||
};
|
};
|
||||||
this.markers = [{
|
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>
|
</script>
|
||||||
|
@ -74,42 +74,33 @@
|
|||||||
</v-list>
|
</v-list>
|
||||||
<v-card-actions>
|
<v-card-actions>
|
||||||
<v-spacer></v-spacer>
|
<v-spacer></v-spacer>
|
||||||
<v-btn flat @click="notificationMenu = false"><translate>Close</translate></v-btn>
|
<v-btn flat @click="notificationMenu = false">
|
||||||
<v-btn color="primary" flat @click="notificationMenu = false"><translate>Save</translate></v-btn>
|
<translate>Close</translate>
|
||||||
|
</v-btn>
|
||||||
|
<v-btn color="primary" flat @click="notificationMenu = false">
|
||||||
|
<translate>Save</translate>
|
||||||
|
</v-btn>
|
||||||
</v-card-actions>
|
</v-card-actions>
|
||||||
</v-card>
|
</v-card>
|
||||||
</v-menu>
|
</v-menu>
|
||||||
<v-btn v-if="!user" :to="{ name: 'Login' }"><translate>Login</translate></v-btn>
|
<v-btn v-if="!user" :to="{ name: 'Login' }">
|
||||||
|
<translate>Login</translate>
|
||||||
|
</v-btn>
|
||||||
</v-toolbar>
|
</v-toolbar>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<style>
|
||||||
import {AUTH_USER_ACTOR, AUTH_USER_ID} from '@/constants';
|
nav.v-toolbar .v-input__slot {
|
||||||
import {SEARCH} from '@/graphql/search';
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
export default {
|
<script lang="ts">
|
||||||
name: 'NavBar',
|
import { Component, Prop, Vue, Watch } from 'vue-property-decorator';
|
||||||
props: {
|
import { AUTH_USER_ACTOR, AUTH_USER_ID } from '@/constants';
|
||||||
toggleDrawer: {
|
import { SEARCH } from '@/graphql/search';
|
||||||
type: Function,
|
|
||||||
required: true,
|
@Component({
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
notificationMenu: false,
|
|
||||||
notifications: [
|
|
||||||
{ header: 'Coucou' },
|
|
||||||
{ title: "T'as une notification", subtitle: 'Et elle est cool' },
|
|
||||||
],
|
|
||||||
model: null,
|
|
||||||
search: [],
|
|
||||||
searchText: null,
|
|
||||||
searchSelect: null,
|
|
||||||
actor: localStorage.getItem(AUTH_USER_ACTOR),
|
|
||||||
user: localStorage.getItem(AUTH_USER_ID),
|
|
||||||
};
|
|
||||||
},
|
|
||||||
apollo: {
|
apollo: {
|
||||||
search: {
|
search: {
|
||||||
query: SEARCH,
|
query: SEARCH,
|
||||||
@ -123,20 +114,23 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
watch: {
|
})
|
||||||
model(val) {
|
export default class NavBar extends Vue {
|
||||||
switch(val.__typename) {
|
@Prop({ required: true, type: Function }) toggleDrawer!: Function;
|
||||||
case 'Event':
|
|
||||||
this.$router.push({ name: 'Event', params: { uuid: val.uuid } });
|
notificationMenu = false;
|
||||||
break;
|
notifications = [
|
||||||
case 'Actor':
|
{ header: 'Coucou' },
|
||||||
this.$router.push({ name: 'Account', params: { name: this.username_with_domain(val) } });
|
{ title: 'T\'as une notification', subtitle: 'Et elle est cool' },
|
||||||
break;
|
];
|
||||||
}
|
model = null;
|
||||||
},
|
search: any[] = [];
|
||||||
},
|
searchText: string | null = null;
|
||||||
computed: {
|
searchSelect = null;
|
||||||
items() {
|
actor = localStorage.getItem(AUTH_USER_ACTOR);
|
||||||
|
user = localStorage.getItem(AUTH_USER_ID);
|
||||||
|
|
||||||
|
get items() {
|
||||||
return this.search.map(searchEntry => {
|
return this.search.map(searchEntry => {
|
||||||
switch (searchEntry.__typename) {
|
switch (searchEntry.__typename) {
|
||||||
case 'Actor':
|
case 'Actor':
|
||||||
@ -148,22 +142,28 @@ export default {
|
|||||||
}
|
}
|
||||||
return searchEntry;
|
return searchEntry;
|
||||||
});
|
});
|
||||||
},
|
}
|
||||||
},
|
|
||||||
methods: {
|
@Watch('model')
|
||||||
|
onModelChanged(val) {
|
||||||
|
switch (val.__typename) {
|
||||||
|
case 'Event':
|
||||||
|
this.$router.push({ name: 'Event', params: { uuid: val.uuid } });
|
||||||
|
break;
|
||||||
|
case 'Actor':
|
||||||
|
this.$router.push({ name: 'Account', params: { name: this.username_with_domain(val) } });
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
username_with_domain(actor) {
|
username_with_domain(actor) {
|
||||||
return actor.preferredUsername + (actor.domain === null ? '' : `@${actor.domain}`);
|
return actor.preferredUsername + (actor.domain === null ? '' : `@${actor.domain}`);
|
||||||
},
|
}
|
||||||
|
|
||||||
enter() {
|
enter() {
|
||||||
console.log('enter');
|
console.log('enter');
|
||||||
this.$apollo.queries.search.refetch();
|
this.$apollo.queries['search'].refetch();
|
||||||
}
|
}
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style>
|
|
||||||
nav.v-toolbar .v-input__slot {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
}
|
||||||
</style>
|
</script>
|
||||||
|
@ -11,14 +11,16 @@ import 'vuetify/dist/vuetify.min.css';
|
|||||||
import App from '@/App.vue';
|
import App from '@/App.vue';
|
||||||
import router from '@/router';
|
import router from '@/router';
|
||||||
// import store from './store';
|
// import store from './store';
|
||||||
import translations from '@/i18n/translations.json';
|
|
||||||
import { createProvider } from './vue-apollo';
|
import { createProvider } from './vue-apollo';
|
||||||
|
|
||||||
|
const translations = require('@/i18n/translations.json');
|
||||||
|
|
||||||
Vue.config.productionTip = false;
|
Vue.config.productionTip = false;
|
||||||
|
|
||||||
Vue.use(VueMarkdown);
|
Vue.use(VueMarkdown);
|
||||||
Vue.use(Vuetify);
|
Vue.use(Vuetify);
|
||||||
const language = window.navigator.userLanguage || window.navigator.language;
|
|
||||||
|
const language = (window.navigator as any).userLanguage || window.navigator.language;
|
||||||
moment.locale(language);
|
moment.locale(language);
|
||||||
|
|
||||||
Vue.filter('formatDate', value => (value ? moment(String(value)).format('LLLL') : null));
|
Vue.filter('formatDate', value => (value ? moment(String(value)).format('LLLL') : null));
|
||||||
@ -33,8 +35,8 @@ Vue.config.language = language.replace('-', '_');
|
|||||||
|
|
||||||
/* eslint-disable no-new */
|
/* eslint-disable no-new */
|
||||||
new Vue({
|
new Vue({
|
||||||
el: '#app',
|
|
||||||
router,
|
router,
|
||||||
|
el: '#app',
|
||||||
template: '<App/>',
|
template: '<App/>',
|
||||||
apolloProvider: createProvider(),
|
apolloProvider: createProvider(),
|
||||||
components: { App },
|
components: { App },
|
@ -5,8 +5,7 @@ import { register } from 'register-service-worker';
|
|||||||
if (process.env.NODE_ENV === 'production') {
|
if (process.env.NODE_ENV === 'production') {
|
||||||
register(`${process.env.BASE_URL}service-worker.js`, {
|
register(`${process.env.BASE_URL}service-worker.js`, {
|
||||||
ready() {
|
ready() {
|
||||||
console.log('App is being served from cache by a service worker.\n' +
|
console.log('App is being served from cache by a service worker.\nFor more details, visit https://goo.gl/AFskqB');
|
||||||
'For more details, visit https://goo.gl/AFskqB');
|
|
||||||
},
|
},
|
||||||
cached() {
|
cached() {
|
||||||
console.log('Content has been cached for offline use.');
|
console.log('Content has been cached for offline use.');
|
@ -1,23 +1,23 @@
|
|||||||
import Vue from 'vue';
|
import Vue from 'vue';
|
||||||
import Router from 'vue-router';
|
import Router from 'vue-router';
|
||||||
import PageNotFound from '@/components/PageNotFound';
|
import PageNotFound from '@/components/PageNotFound.vue';
|
||||||
import Home from '@/components/Home';
|
import Home from '@/components/Home.vue';
|
||||||
import Event from '@/components/Event/Event';
|
import Event from '@/components/Event/Event.vue';
|
||||||
import EventList from '@/components/Event/EventList';
|
import EventList from '@/components/Event/EventList.vue';
|
||||||
import Location from '@/components/Location';
|
import Location from '@/components/Location.vue';
|
||||||
import CreateEvent from '@/components/Event/Create';
|
import CreateEvent from '@/components/Event/Create.vue';
|
||||||
import CategoryList from '@/components/Category/List';
|
import CategoryList from '@/components/Category/List.vue';
|
||||||
import CreateCategory from '@/components/Category/Create';
|
import CreateCategory from '@/components/Category/Create.vue';
|
||||||
import Register from '@/components/Account/Register';
|
import Register from '@/components/Account/Register.vue';
|
||||||
import Login from '@/components/Account/Login';
|
import Login from '@/components/Account/Login.vue';
|
||||||
import Validate from '@/components/Account/Validate';
|
import Validate from '@/components/Account/Validate.vue';
|
||||||
import ResendConfirmation from '@/components/Account/ResendConfirmation';
|
import ResendConfirmation from '@/components/Account/ResendConfirmation.vue';
|
||||||
import SendPasswordReset from '@/components/Account/SendPasswordReset';
|
import SendPasswordReset from '@/components/Account/SendPasswordReset.vue';
|
||||||
import PasswordReset from '@/components/Account/PasswordReset';
|
import PasswordReset from '@/components/Account/PasswordReset.vue';
|
||||||
import Account from '@/components/Account/Account';
|
import Account from '@/components/Account/Account.vue';
|
||||||
import CreateGroup from '@/components/Group/Create';
|
import CreateGroup from '@/components/Group/Create.vue';
|
||||||
import Group from '@/components/Group/Group';
|
import Group from '@/components/Group/Group.vue';
|
||||||
import GroupList from '@/components/Group/GroupList';
|
import GroupList from '@/components/Group/GroupList.vue';
|
||||||
import Identities from '../components/Account/Identities.vue';
|
import Identities from '../components/Account/Identities.vue';
|
||||||
|
|
||||||
Vue.use(Router);
|
Vue.use(Router);
|
13
js/src/shims-tsx.d.ts
vendored
Normal file
13
js/src/shims-tsx.d.ts
vendored
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
import Vue, { VNode } from 'vue';
|
||||||
|
|
||||||
|
declare global {
|
||||||
|
namespace JSX {
|
||||||
|
// tslint:disable no-empty-interface
|
||||||
|
interface Element extends VNode {}
|
||||||
|
// tslint:disable no-empty-interface
|
||||||
|
interface ElementClass extends Vue {}
|
||||||
|
interface IntrinsicElements {
|
||||||
|
[elem: string]: any;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
4
js/src/shims-vue.d.ts
vendored
Normal file
4
js/src/shims-vue.d.ts
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
declare module '*.vue' {
|
||||||
|
import Vue from 'vue';
|
||||||
|
export default Vue;
|
||||||
|
}
|
@ -33,7 +33,6 @@ const fragmentMatcher = new IntrospectionFragmentMatcher({
|
|||||||
|
|
||||||
const cache = new InMemoryCache({ fragmentMatcher });
|
const cache = new InMemoryCache({ fragmentMatcher });
|
||||||
|
|
||||||
|
|
||||||
const authMiddleware = new ApolloLink((operation, forward) => {
|
const authMiddleware = new ApolloLink((operation, forward) => {
|
||||||
// add the authorization to the headers
|
// add the authorization to the headers
|
||||||
const token = localStorage.getItem(AUTH_TOKEN);
|
const token = localStorage.getItem(AUTH_TOKEN);
|
||||||
@ -43,7 +42,9 @@ const authMiddleware = new ApolloLink((operation, forward) => {
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
return forward(operation);
|
if (forward) forward(operation);
|
||||||
|
|
||||||
|
return null;
|
||||||
});
|
});
|
||||||
|
|
||||||
const uploadLink = createLink({
|
const uploadLink = createLink({
|
||||||
@ -60,6 +61,8 @@ const link = authMiddleware.concat(uploadLink);
|
|||||||
|
|
||||||
// Config
|
// Config
|
||||||
const defaultOptions = {
|
const defaultOptions = {
|
||||||
|
cache,
|
||||||
|
link,
|
||||||
// You can use `https` for secure connection (recommended in production)
|
// You can use `https` for secure connection (recommended in production)
|
||||||
httpEndpoint,
|
httpEndpoint,
|
||||||
// You can use `wss` for secure connection (recommended in production)
|
// You can use `wss` for secure connection (recommended in production)
|
||||||
@ -74,9 +77,8 @@ const defaultOptions = {
|
|||||||
websocketsOnly: false,
|
websocketsOnly: false,
|
||||||
// Is being rendered on the server?
|
// Is being rendered on the server?
|
||||||
ssr: false,
|
ssr: false,
|
||||||
cache,
|
|
||||||
link,
|
|
||||||
defaultHttpLink: false,
|
defaultHttpLink: false,
|
||||||
|
connectToDevTools: true,
|
||||||
};
|
};
|
||||||
|
|
||||||
// Call this in the Vue app file
|
// Call this in the Vue app file
|
||||||
@ -89,23 +91,18 @@ export function createProvider(options = {}) {
|
|||||||
apolloClient.wsClient = wsClient;
|
apolloClient.wsClient = wsClient;
|
||||||
|
|
||||||
// Create vue apollo provider
|
// Create vue apollo provider
|
||||||
const apolloProvider = new VueApollo({
|
return new VueApollo({
|
||||||
defaultClient: apolloClient,
|
defaultClient: apolloClient,
|
||||||
link,
|
// defaultOptions: {
|
||||||
cache,
|
// $query: {
|
||||||
connectToDevTools: true,
|
|
||||||
defaultOptions: {
|
|
||||||
$query: {
|
|
||||||
// fetchPolicy: 'cache-and-network',
|
// fetchPolicy: 'cache-and-network',
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
errorHandler(error) {
|
errorHandler(error) {
|
||||||
// eslint-disable-next-line no-console
|
// eslint-disable-next-line no-console
|
||||||
console.log('%cError', 'background: red; color: white; padding: 2px 4px; border-radius: 3px; font-weight: bold;', error.message);
|
console.log('%cError', 'background: red; color: white; padding: 2px 4px; border-radius: 3px; font-weight: bold;', error.message);
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
return apolloProvider;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// Manually call this when user log in
|
// Manually call this when user log in
|
@ -1,8 +0,0 @@
|
|||||||
module.exports = {
|
|
||||||
env: {
|
|
||||||
mocha: true,
|
|
||||||
},
|
|
||||||
rules: {
|
|
||||||
'import/no-extraneous-dependencies': 'off',
|
|
||||||
},
|
|
||||||
};
|
|
@ -1,13 +0,0 @@
|
|||||||
import { expect } from 'chai';
|
|
||||||
import { shallow } from '@vue/test-utils';
|
|
||||||
import HelloWorld from '@/components/HelloWorld.vue';
|
|
||||||
|
|
||||||
describe('HelloWorld.vue', () => {
|
|
||||||
it('renders props.msg when passed', () => {
|
|
||||||
const msg = 'new message';
|
|
||||||
const wrapper = shallow(HelloWorld, {
|
|
||||||
propsData: { msg },
|
|
||||||
});
|
|
||||||
expect(wrapper.text()).to.include(msg);
|
|
||||||
});
|
|
||||||
});
|
|
42
js/tsconfig.json
Normal file
42
js/tsconfig.json
Normal file
@ -0,0 +1,42 @@
|
|||||||
|
{
|
||||||
|
"compilerOptions": {
|
||||||
|
"target": "esnext",
|
||||||
|
"module": "esnext",
|
||||||
|
"strict": true,
|
||||||
|
"jsx": "preserve",
|
||||||
|
"importHelpers": true,
|
||||||
|
"moduleResolution": "node",
|
||||||
|
"experimentalDecorators": true,
|
||||||
|
"esModuleInterop": true,
|
||||||
|
"noImplicitAny": false,
|
||||||
|
"allowSyntheticDefaultImports": true,
|
||||||
|
"sourceMap": true,
|
||||||
|
"baseUrl": ".",
|
||||||
|
"types": [
|
||||||
|
"webpack-env",
|
||||||
|
"mocha",
|
||||||
|
"chai"
|
||||||
|
],
|
||||||
|
"paths": {
|
||||||
|
"@/*": [
|
||||||
|
"src/*"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"lib": [
|
||||||
|
"esnext",
|
||||||
|
"dom",
|
||||||
|
"dom.iterable",
|
||||||
|
"scripthost"
|
||||||
|
]
|
||||||
|
},
|
||||||
|
"include": [
|
||||||
|
"src/**/*.ts",
|
||||||
|
"src/**/*.tsx",
|
||||||
|
"src/**/*.vue",
|
||||||
|
"tests/**/*.ts",
|
||||||
|
"tests/**/*.tsx"
|
||||||
|
],
|
||||||
|
"exclude": [
|
||||||
|
"node_modules"
|
||||||
|
]
|
||||||
|
}
|
8
js/tslint.json
Normal file
8
js/tslint.json
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
{
|
||||||
|
"extends": "tslint-config-airbnb",
|
||||||
|
"rules": {
|
||||||
|
"max-line-length": [ true, 140 ],
|
||||||
|
"import-name": false,
|
||||||
|
"ter-arrow-parens": false
|
||||||
|
}
|
||||||
|
}
|
Loading…
Reference in New Issue
Block a user