2017-12-26 14:56:04 +00:00
|
|
|
<template>
|
2018-11-19 22:33:22 +00:00
|
|
|
<main class="main pusher" v-title="labels.title">
|
2017-12-26 14:56:04 +00:00
|
|
|
<div class="ui vertical stripe segment">
|
2019-03-25 16:02:51 +00:00
|
|
|
<section class="ui text container">
|
2018-06-30 13:28:47 +00:00
|
|
|
<h2 class="ui header">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Title">Account settings</translate>
|
2018-06-30 13:28:47 +00:00
|
|
|
</h2>
|
2018-03-03 11:40:01 +00:00
|
|
|
<form class="ui form" @submit.prevent="submitSettings()">
|
|
|
|
<div v-if="settings.success" class="ui positive message">
|
2018-06-30 13:28:47 +00:00
|
|
|
<div class="header">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Message">Settings updated</translate>
|
2018-06-30 13:28:47 +00:00
|
|
|
</div>
|
2018-03-03 11:40:01 +00:00
|
|
|
</div>
|
|
|
|
<div v-if="settings.errors.length > 0" class="ui negative message">
|
2019-09-02 16:17:23 +00:00
|
|
|
<div class="header"><translate translate-context="Content/Settings/Error message.Title">Your settings can't be updated</translate></div>
|
2018-03-03 11:40:01 +00:00
|
|
|
<ul class="list">
|
|
|
|
<li v-for="error in settings.errors">{{ error }}</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="field" v-for="f in orderedSettingsFields">
|
2018-10-05 17:53:28 +00:00
|
|
|
<label>{{ sharedLabels.fields[f.id].label }}</label>
|
|
|
|
<p v-if="f.help">{{ sharedLabels.fields[f.id].help }}</p>
|
2018-03-03 11:40:01 +00:00
|
|
|
<select v-if="f.type === 'dropdown'" class="ui dropdown" v-model="f.value">
|
2018-10-05 17:53:28 +00:00
|
|
|
<option :value="c" v-for="c in f.choices">{{ sharedLabels.fields[f.id].choices[c] }}</option>
|
2018-03-03 11:40:01 +00:00
|
|
|
</select>
|
|
|
|
</div>
|
2018-06-30 13:28:47 +00:00
|
|
|
<button :class="['ui', {'loading': isLoading}, 'button']" type="submit">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Button.Label/Verb">Update settings</translate>
|
2018-06-30 13:28:47 +00:00
|
|
|
</button>
|
2018-03-03 11:40:01 +00:00
|
|
|
</form>
|
2018-11-19 22:33:22 +00:00
|
|
|
</section>
|
2019-03-25 16:02:51 +00:00
|
|
|
<section class="ui text container">
|
2019-03-06 16:43:12 +00:00
|
|
|
<div class="ui hidden divider"></div>
|
2018-07-13 12:10:39 +00:00
|
|
|
<h2 class="ui header">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Title">Avatar</translate>
|
2018-07-13 12:10:39 +00:00
|
|
|
</h2>
|
|
|
|
<div class="ui form">
|
|
|
|
<div v-if="avatarErrors.length > 0" class="ui negative message">
|
2019-03-08 11:37:02 +00:00
|
|
|
<div class="header"><translate translate-context="Content/Settings/Error message.Title">Your avatar cannot be saved</translate></div>
|
2018-07-13 12:10:39 +00:00
|
|
|
<ul class="list">
|
|
|
|
<li v-for="error in avatarErrors">{{ error }}</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="ui stackable grid">
|
|
|
|
<div class="ui ten wide column">
|
2019-03-08 11:37:02 +00:00
|
|
|
<h3 class="ui header"><translate translate-context="Content/Settings/Title/Verb">Upload a new avatar</translate></h3>
|
|
|
|
<p><translate translate-context="Content/Settings/Paragraph">PNG, GIF or JPG. At most 2MB. Will be downscaled to 400x400px.</translate></p>
|
2018-07-13 12:10:39 +00:00
|
|
|
<input class="ui input" ref="avatar" type="file" />
|
|
|
|
<div class="ui hidden divider"></div>
|
|
|
|
<button @click="submitAvatar" :class="['ui', {'loading': isLoadingAvatar}, 'button']">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Button.Label/Verb">Update avatar</translate>
|
2018-07-13 12:10:39 +00:00
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
<div class="ui six wide column">
|
2019-03-08 11:37:02 +00:00
|
|
|
<h3 class="ui header"><translate translate-context="Content/Settings/Title/Noun">Current avatar</translate></h3>
|
2018-12-20 11:37:51 +00:00
|
|
|
<img class="ui circular image" v-if="currentAvatar && currentAvatar.square_crop" v-lazy="$store.getters['instance/absoluteUrl'](currentAvatar.medium_square_crop)" />
|
2018-07-13 12:10:39 +00:00
|
|
|
<div class="ui hidden divider"></div>
|
|
|
|
<button @click="removeAvatar" v-if="currentAvatar && currentAvatar.square_crop" :class="['ui', {'loading': isLoadingAvatar}, ,'yellow', 'button']">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Button.Label/Verb">Remove avatar</translate>
|
2018-07-13 12:10:39 +00:00
|
|
|
</button>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
2018-11-19 22:33:22 +00:00
|
|
|
</section>
|
2019-02-14 09:49:06 +00:00
|
|
|
|
2019-03-25 16:02:51 +00:00
|
|
|
<section class="ui text container">
|
2019-03-06 16:43:12 +00:00
|
|
|
<div class="ui hidden divider"></div>
|
2018-06-30 13:28:47 +00:00
|
|
|
<h2 class="ui header">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Title/Verb">Change my password</translate>
|
2018-06-30 13:28:47 +00:00
|
|
|
</h2>
|
2018-05-09 20:18:33 +00:00
|
|
|
<div class="ui message">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Paragraph'">Changing your password will also change your Subsonic API password if you have requested one.</translate> <translate translate-context="Content/Settings/Paragraph">You will have to update your password on your clients that use this password.</translate>
|
2018-05-09 20:18:33 +00:00
|
|
|
</div>
|
2018-03-03 11:40:01 +00:00
|
|
|
<form class="ui form" @submit.prevent="submitPassword()">
|
|
|
|
<div v-if="passwordError" class="ui negative message">
|
2018-06-30 13:28:47 +00:00
|
|
|
<div class="header">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Error message.Title">Your password cannot be changed</translate>
|
2018-06-30 13:28:47 +00:00
|
|
|
</div>
|
2017-12-26 14:56:04 +00:00
|
|
|
<ul class="list">
|
2019-03-08 11:37:02 +00:00
|
|
|
<li v-if="passwordError == 'invalid_credentials'"><translate translate-context="Content/Settings/Error message.List item/Call to action">Please double-check your password is correct</translate></li>
|
2017-12-26 14:56:04 +00:00
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="field">
|
2019-03-08 11:37:02 +00:00
|
|
|
<label><translate translate-context="Content/Settings/Input.Label">Old password</translate></label>
|
2018-05-06 09:19:20 +00:00
|
|
|
<password-input required v-model="old_password" />
|
|
|
|
|
2017-12-26 14:56:04 +00:00
|
|
|
</div>
|
|
|
|
<div class="field">
|
2019-03-08 11:37:02 +00:00
|
|
|
<label><translate translate-context="Content/Settings/Input.Label">New password</translate></label>
|
2018-05-06 09:19:20 +00:00
|
|
|
<password-input required v-model="new_password" />
|
2017-12-26 14:56:04 +00:00
|
|
|
</div>
|
2018-05-09 20:18:33 +00:00
|
|
|
<dangerous-button
|
|
|
|
color="yellow"
|
|
|
|
:class="['ui', {'loading': isLoading}, 'button']"
|
|
|
|
:action="submitPassword">
|
2019-03-08 11:37:02 +00:00
|
|
|
<translate translate-context="Content/Settings/Button.Label">Change password</translate>
|
|
|
|
<p slot="modal-header"><translate translate-context="Popup/Settings/Title">Change your password?</translate></p>
|
2018-05-09 20:18:33 +00:00
|
|
|
<div slot="modal-content">
|
2019-03-08 11:37:02 +00:00
|
|
|
<p><translate translate-context="Popup/Settings/Paragraph">Changing your password will have the following consequences:</translate></p>
|
2018-05-09 20:18:33 +00:00
|
|
|
<ul>
|
2019-03-08 11:37:02 +00:00
|
|
|
<li><translate translate-context="Popup/Settings/List item">You will be logged out from this session and have to log in with the new one</translate></li>
|
|
|
|
<li><translate translate-context="Popup/Settings/List item">Your Subsonic password will be changed to a new, random one, logging you out from devices that used the old Subsonic password</translate></li>
|
2018-05-09 20:18:33 +00:00
|
|
|
</ul>
|
|
|
|
</div>
|
2019-03-18 09:07:58 +00:00
|
|
|
<div slot="modal-confirm"><translate translate-context="Popup/Settings/Button.Label">Disable access</translate></div>
|
2018-05-09 20:18:33 +00:00
|
|
|
</dangerous-button>
|
2017-12-26 14:56:04 +00:00
|
|
|
</form>
|
2018-05-09 20:18:33 +00:00
|
|
|
<div class="ui hidden divider" />
|
|
|
|
<subsonic-token-form />
|
2018-11-19 22:33:22 +00:00
|
|
|
</section>
|
2019-02-14 09:49:06 +00:00
|
|
|
|
2019-03-25 16:02:51 +00:00
|
|
|
<section class="ui text container" id="content-filters">
|
2019-03-06 16:43:12 +00:00
|
|
|
<div class="ui hidden divider"></div>
|
2019-02-14 09:49:06 +00:00
|
|
|
<h2 class="ui header">
|
|
|
|
<i class="eye slash outline icon"></i>
|
|
|
|
<div class="content">
|
2019-03-18 09:07:58 +00:00
|
|
|
<translate translate-context="Content/Settings/Title/Noun">Content filters</translate>
|
2019-02-14 09:49:06 +00:00
|
|
|
</div>
|
|
|
|
</h2>
|
2019-03-18 09:07:58 +00:00
|
|
|
<p><translate translate-context="Content/Settings/Paragraph">Content filters help you hide content you don't want to see on the service.</translate></p>
|
2019-02-14 09:49:06 +00:00
|
|
|
|
|
|
|
<button
|
|
|
|
@click="$store.dispatch('moderation/fetchContentFilters')"
|
|
|
|
class="ui basic icon button">
|
|
|
|
<i class="refresh icon"></i>
|
2019-03-18 09:07:58 +00:00
|
|
|
<translate translate-context="Content/*/Button.Label/Short, Verb">Refresh</translate>
|
2019-02-14 09:49:06 +00:00
|
|
|
</button>
|
|
|
|
<h3 class="ui header">
|
2019-03-18 09:07:58 +00:00
|
|
|
<translate translate-context="Content/Settings/Title">Hidden artists</translate>
|
2019-02-14 09:49:06 +00:00
|
|
|
</h3>
|
2019-03-06 16:40:09 +00:00
|
|
|
<table class="ui compact very basic unstackable table">
|
2019-02-14 09:49:06 +00:00
|
|
|
<thead>
|
|
|
|
<tr>
|
2019-03-18 09:07:58 +00:00
|
|
|
<th><translate translate-context="*/*/*/Noun">Name</translate></th>
|
|
|
|
<th><translate translate-context="Content/*/*/Noun">Creation date</translate></th>
|
2019-02-14 09:49:06 +00:00
|
|
|
<th></th>
|
|
|
|
</tr>
|
|
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
<tr v-for="filter in $store.getters['moderation/artistFilters']()" :key='filter.uuid'>
|
|
|
|
<td>
|
|
|
|
<router-link :to="{name: 'library.artists.detail', params: {id: filter.target.id }}">
|
|
|
|
{{ filter.target.name }}
|
|
|
|
</router-link>
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<human-date :date="filter.creation_date"></human-date>
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<button @click="$store.dispatch('moderation/deleteContentFilter', filter.uuid)" class="ui basic tiny button">
|
2019-03-18 09:07:58 +00:00
|
|
|
<translate translate-context="*/*/*/Verb">Delete</translate>
|
2019-02-14 09:49:06 +00:00
|
|
|
</button>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
</section>
|
2019-03-25 16:02:51 +00:00
|
|
|
<section class="ui text container" id="grants">
|
|
|
|
<div class="ui hidden divider"></div>
|
|
|
|
<h2 class="ui header">
|
|
|
|
<i class="open lock icon"></i>
|
|
|
|
<div class="content">
|
|
|
|
<translate translate-context="Content/Settings/Title/Noun">Authorized apps</translate>
|
|
|
|
</div>
|
|
|
|
</h2>
|
|
|
|
<p><translate translate-context="Content/Settings/Paragraph">This is the list of applications that have access to your account data.</translate></p>
|
|
|
|
<button
|
|
|
|
@click="fetchApps()"
|
|
|
|
class="ui basic icon button">
|
|
|
|
<i class="refresh icon"></i>
|
|
|
|
<translate translate-context="Content/*/Button.Label/Short, Verb">Refresh</translate>
|
|
|
|
</button>
|
|
|
|
<table v-if="apps.length > 0" class="ui compact very basic unstackable table">
|
|
|
|
<thead>
|
|
|
|
<tr>
|
|
|
|
<th><translate translate-context="*/*/*/Noun">Application</translate></th>
|
|
|
|
<th><translate translate-context="Content/*/*/Noun">Permissions</translate></th>
|
|
|
|
<th></th>
|
|
|
|
</tr>
|
|
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
<tr v-for="app in apps" :key='app.client_id'>
|
|
|
|
<td>
|
|
|
|
{{ app.name }}
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
{{ app.scopes }}
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<dangerous-button
|
|
|
|
class="ui tiny basic button"
|
|
|
|
@confirm="revokeApp(app.client_id)">
|
|
|
|
<translate translate-context="*/*/*/Verb">Revoke</translate>
|
|
|
|
<p slot="modal-header" v-translate="{application: app.name}" translate-context="Popup/Settings/Title">Revoke access for application "%{ application }"?</p>
|
|
|
|
<p slot="modal-content"><translate translate-context="Popup/Settings/Paragraph">This will prevent this application from accessing the service on your behalf.</translate></p>
|
|
|
|
<div slot="modal-confirm"><translate translate-context="*/Settings/Button.Label/Verb">Revoke access</translate></div>
|
|
|
|
</dangerous-button>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
<empty-state v-else>
|
|
|
|
<translate slot="title" translate-context="Content/Applications/Paragraph">
|
|
|
|
You don't have any application connected with your account.
|
|
|
|
</translate>
|
|
|
|
<translate translate-context="Content/Applications/Paragraph">
|
|
|
|
If you authorize third-party applications to access your data, those applications will be listed here.
|
|
|
|
</translate>
|
|
|
|
</empty-state>
|
|
|
|
</section>
|
|
|
|
<section class="ui text container" id="apps">
|
|
|
|
<div class="ui hidden divider"></div>
|
|
|
|
<h2 class="ui header">
|
|
|
|
<i class="code icon"></i>
|
|
|
|
<div class="content">
|
|
|
|
<translate translate-context="Content/Settings/Title/Noun">Your applications</translate>
|
|
|
|
</div>
|
|
|
|
</h2>
|
|
|
|
<p><translate translate-context="Content/Settings/Paragraph">This is the list of applications that you have created.</translate></p>
|
|
|
|
<router-link class="ui basic green button" :to="{name: 'settings.applications.new'}">
|
|
|
|
<translate translate-context="Content/Settings/Button.Label">Create a new application</translate>
|
|
|
|
</router-link>
|
|
|
|
<table v-if="ownedApps.length > 0" class="ui compact very basic unstackable table">
|
|
|
|
<thead>
|
|
|
|
<tr>
|
|
|
|
<th><translate translate-context="*/*/*/Noun">Application</translate></th>
|
|
|
|
<th><translate translate-context="Content/*/*/Noun">Scopes</translate></th>
|
|
|
|
<th><translate translate-context="Content/*/*/Noun">Creation date</translate></th>
|
|
|
|
<th></th>
|
|
|
|
</tr>
|
|
|
|
</thead>
|
|
|
|
<tbody>
|
|
|
|
<tr v-for="app in ownedApps" :key='app.client_id'>
|
|
|
|
<td>
|
|
|
|
<router-link :to="{name: 'settings.applications.edit', params: {id: app.client_id}}">
|
|
|
|
{{ app.name }}
|
|
|
|
</router-link>
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
{{ app.scopes }}
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<human-date :date="app.created" />
|
|
|
|
</td>
|
|
|
|
<td>
|
|
|
|
<router-link class="ui basic tiny green button" :to="{name: 'settings.applications.edit', params: {id: app.client_id}}">
|
|
|
|
<translate translate-context="Content/Settings/Button.Label">Edit</translate>
|
|
|
|
</router-link>
|
|
|
|
<dangerous-button
|
|
|
|
class="ui tiny basic button"
|
|
|
|
@confirm="deleteApp(app.client_id)">
|
|
|
|
<translate translate-context="*/*/*/Verb">Delete</translate>
|
|
|
|
<p slot="modal-header" v-translate="{application: app.name}" translate-context="Popup/Settings/Title">Delete application "%{ application }"?</p>
|
|
|
|
<p slot="modal-content"><translate translate-context="Popup/Settings/Paragraph">This will permanently delete the application and all the associated tokens.</translate></p>
|
|
|
|
<div slot="modal-confirm"><translate translate-context="*/Settings/Button.Label/Verb">Delete application</translate></div>
|
|
|
|
</dangerous-button>
|
|
|
|
</td>
|
|
|
|
</tr>
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
<empty-state v-else>
|
|
|
|
<translate slot="title" translate-context="Content/Applications/Paragraph">
|
|
|
|
You don't have any configured application yet.
|
|
|
|
</translate>
|
|
|
|
<translate translate-context="Content/Applications/Paragraph">
|
|
|
|
Create one to integrate Funkwhale with third-party applications.
|
|
|
|
</translate>
|
|
|
|
</empty-state>
|
|
|
|
</section>
|
2017-12-26 14:56:04 +00:00
|
|
|
</div>
|
2018-11-19 22:33:22 +00:00
|
|
|
</main>
|
2017-12-26 14:56:04 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2018-11-19 22:33:22 +00:00
|
|
|
import $ from "jquery"
|
|
|
|
import axios from "axios"
|
|
|
|
import logger from "@/logging"
|
|
|
|
import PasswordInput from "@/components/forms/PasswordInput"
|
|
|
|
import SubsonicTokenForm from "@/components/auth/SubsonicTokenForm"
|
|
|
|
import TranslationsMixin from "@/components/mixins/Translations"
|
2017-12-26 14:56:04 +00:00
|
|
|
|
|
|
|
export default {
|
2018-10-05 17:53:28 +00:00
|
|
|
mixins: [TranslationsMixin],
|
2018-05-06 09:19:20 +00:00
|
|
|
components: {
|
2018-05-09 20:18:33 +00:00
|
|
|
PasswordInput,
|
|
|
|
SubsonicTokenForm
|
2018-05-06 09:19:20 +00:00
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
data() {
|
2018-03-03 11:40:01 +00:00
|
|
|
let d = {
|
2017-12-26 14:56:04 +00:00
|
|
|
// We need to initialize the component with any
|
|
|
|
// properties that will be used in it
|
2018-11-19 22:33:22 +00:00
|
|
|
old_password: "",
|
|
|
|
new_password: "",
|
2018-07-13 12:10:39 +00:00
|
|
|
currentAvatar: this.$store.state.auth.profile.avatar,
|
2018-11-19 22:33:22 +00:00
|
|
|
passwordError: "",
|
2018-03-03 11:40:01 +00:00
|
|
|
isLoading: false,
|
2018-07-13 12:10:39 +00:00
|
|
|
isLoadingAvatar: false,
|
|
|
|
avatarErrors: [],
|
|
|
|
avatar: null,
|
2019-03-25 16:02:51 +00:00
|
|
|
apps: [],
|
|
|
|
ownedApps: [],
|
2018-03-03 11:40:01 +00:00
|
|
|
settings: {
|
|
|
|
success: false,
|
|
|
|
errors: [],
|
2018-11-19 22:33:22 +00:00
|
|
|
order: ["privacy_level"],
|
2018-03-03 11:40:01 +00:00
|
|
|
fields: {
|
2018-11-19 22:33:22 +00:00
|
|
|
privacy_level: {
|
|
|
|
type: "dropdown",
|
2018-03-03 11:40:01 +00:00
|
|
|
initial: this.$store.state.auth.profile.privacy_level,
|
2018-11-19 22:33:22 +00:00
|
|
|
choices: ["me", "instance"]
|
2018-03-03 11:40:01 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
2017-12-26 14:56:04 +00:00
|
|
|
}
|
2018-03-03 11:40:01 +00:00
|
|
|
d.settings.order.forEach(id => {
|
|
|
|
d.settings.fields[id].value = d.settings.fields[id].initial
|
2018-10-05 17:53:28 +00:00
|
|
|
d.settings.fields[id].id = id
|
2018-03-03 11:40:01 +00:00
|
|
|
})
|
|
|
|
return d
|
|
|
|
},
|
2019-03-25 16:02:51 +00:00
|
|
|
created () {
|
|
|
|
this.fetchApps()
|
|
|
|
this.fetchOwnedApps()
|
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
mounted() {
|
|
|
|
$("select.dropdown").dropdown()
|
2017-12-26 14:56:04 +00:00
|
|
|
},
|
|
|
|
methods: {
|
2018-11-19 22:33:22 +00:00
|
|
|
submitSettings() {
|
2018-03-03 11:40:01 +00:00
|
|
|
this.settings.success = false
|
|
|
|
this.settings.errors = []
|
|
|
|
let self = this
|
|
|
|
let payload = this.settingsValues
|
|
|
|
let url = `users/users/${this.$store.state.auth.username}/`
|
2018-11-19 22:33:22 +00:00
|
|
|
return axios.patch(url, payload).then(
|
|
|
|
response => {
|
|
|
|
logger.default.info("Updated settings successfully")
|
|
|
|
self.settings.success = true
|
|
|
|
return axios.get("users/users/me/").then(response => {
|
|
|
|
self.$store.dispatch("auth/updateProfile", response.data)
|
|
|
|
})
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
logger.default.error("Error while updating settings")
|
|
|
|
self.isLoading = false
|
|
|
|
self.settings.errors = error.backendErrors
|
|
|
|
}
|
|
|
|
)
|
2018-03-03 11:40:01 +00:00
|
|
|
},
|
2019-03-25 16:02:51 +00:00
|
|
|
fetchApps() {
|
|
|
|
this.apps = []
|
|
|
|
let self = this
|
|
|
|
let url = `oauth/grants/`
|
|
|
|
return axios.get(url).then(
|
|
|
|
response => {
|
|
|
|
self.apps = response.data
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
|
|
|
fetchOwnedApps() {
|
|
|
|
this.ownedApps = []
|
|
|
|
let self = this
|
|
|
|
let url = `oauth/apps/`
|
|
|
|
return axios.get(url).then(
|
|
|
|
response => {
|
|
|
|
self.ownedApps = response.data.results
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
|
|
|
revokeApp (id) {
|
|
|
|
let self = this
|
|
|
|
let url = `oauth/grants/${id}/`
|
|
|
|
return axios.delete(url).then(
|
|
|
|
response => {
|
|
|
|
self.apps = self.apps.filter(a => {
|
|
|
|
return a.client_id != id
|
|
|
|
})
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
|
|
|
deleteApp (id) {
|
|
|
|
let self = this
|
|
|
|
let url = `oauth/apps/${id}/`
|
|
|
|
return axios.delete(url).then(
|
|
|
|
response => {
|
|
|
|
self.ownedApps = self.ownedApps.filter(a => {
|
|
|
|
return a.client_id != id
|
|
|
|
})
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
submitAvatar() {
|
2018-07-13 12:10:39 +00:00
|
|
|
this.isLoadingAvatar = true
|
|
|
|
this.avatarErrors = []
|
|
|
|
let self = this
|
|
|
|
this.avatar = this.$refs.avatar.files[0]
|
|
|
|
let formData = new FormData()
|
2018-11-19 22:33:22 +00:00
|
|
|
formData.append("avatar", this.avatar)
|
|
|
|
axios
|
|
|
|
.patch(`users/users/${this.$store.state.auth.username}/`, formData, {
|
2018-07-13 12:10:39 +00:00
|
|
|
headers: {
|
2018-11-19 22:33:22 +00:00
|
|
|
"Content-Type": "multipart/form-data"
|
2018-07-13 12:10:39 +00:00
|
|
|
}
|
2018-11-19 22:33:22 +00:00
|
|
|
})
|
|
|
|
.then(
|
|
|
|
response => {
|
|
|
|
this.isLoadingAvatar = false
|
|
|
|
self.currentAvatar = response.data.avatar
|
|
|
|
self.$store.commit("auth/avatar", self.currentAvatar)
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
self.isLoadingAvatar = false
|
|
|
|
self.avatarErrors = error.backendErrors
|
|
|
|
}
|
|
|
|
)
|
2018-07-13 12:10:39 +00:00
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
removeAvatar() {
|
2018-07-13 12:10:39 +00:00
|
|
|
this.isLoadingAvatar = true
|
|
|
|
let self = this
|
|
|
|
this.avatar = null
|
2018-11-19 22:33:22 +00:00
|
|
|
axios
|
|
|
|
.patch(`users/users/${this.$store.state.auth.username}/`, {
|
|
|
|
avatar: null
|
|
|
|
})
|
|
|
|
.then(
|
|
|
|
response => {
|
|
|
|
this.isLoadingAvatar = false
|
|
|
|
self.currentAvatar = {}
|
|
|
|
self.$store.commit("auth/avatar", self.currentAvatar)
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
self.isLoadingAvatar = false
|
|
|
|
self.avatarErrors = error.backendErrors
|
|
|
|
}
|
|
|
|
)
|
2018-07-13 12:10:39 +00:00
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
submitPassword() {
|
2017-12-26 14:56:04 +00:00
|
|
|
var self = this
|
|
|
|
self.isLoading = true
|
2018-11-19 22:33:22 +00:00
|
|
|
this.error = ""
|
2017-12-26 14:56:04 +00:00
|
|
|
var credentials = {
|
|
|
|
old_password: this.old_password,
|
|
|
|
new_password1: this.new_password,
|
|
|
|
new_password2: this.new_password
|
|
|
|
}
|
2018-11-19 22:33:22 +00:00
|
|
|
let url = "auth/registration/change-password/"
|
|
|
|
return axios.post(url, credentials).then(
|
|
|
|
response => {
|
|
|
|
logger.default.info("Password successfully changed")
|
|
|
|
self.$router.push({
|
|
|
|
name: "profile",
|
|
|
|
params: {
|
|
|
|
username: self.$store.state.auth.username
|
|
|
|
}
|
|
|
|
})
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
if (error.response.status === 400) {
|
|
|
|
self.passwordError = "invalid_credentials"
|
|
|
|
} else {
|
|
|
|
self.passwordError = "unknown_error"
|
|
|
|
}
|
|
|
|
self.isLoading = false
|
2017-12-26 14:56:04 +00:00
|
|
|
}
|
2018-11-19 22:33:22 +00:00
|
|
|
)
|
2017-12-26 14:56:04 +00:00
|
|
|
}
|
2018-03-03 11:40:01 +00:00
|
|
|
},
|
|
|
|
computed: {
|
2018-11-19 22:33:22 +00:00
|
|
|
labels() {
|
2018-07-01 19:50:50 +00:00
|
|
|
return {
|
2019-02-14 09:28:12 +00:00
|
|
|
title: this.$pgettext('Head/Settings/Title', "Account Settings")
|
2018-07-01 19:50:50 +00:00
|
|
|
}
|
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
orderedSettingsFields() {
|
2018-03-03 11:40:01 +00:00
|
|
|
let self = this
|
|
|
|
return this.settings.order.map(id => {
|
|
|
|
return self.settings.fields[id]
|
|
|
|
})
|
|
|
|
},
|
2018-11-19 22:33:22 +00:00
|
|
|
settingsValues() {
|
2018-03-03 11:40:01 +00:00
|
|
|
let self = this
|
|
|
|
let s = {}
|
|
|
|
this.settings.order.forEach(setting => {
|
|
|
|
let conf = self.settings.fields[setting]
|
|
|
|
s[setting] = conf.value
|
|
|
|
})
|
|
|
|
return s
|
|
|
|
}
|
2017-12-26 14:56:04 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
|
<style scoped>
|
|
|
|
</style>
|