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>
|
2020-02-05 14:06:07 +00:00
|
|
|
<content-form v-if="f.type === 'content'" v-model="f.value.text"></content-form>
|
2018-03-03 11:40:01 +00:00
|
|
|
</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>
|
2020-01-23 15:38:04 +00:00
|
|
|
{{ }}
|
|
|
|
<attachment-input
|
|
|
|
:value="avatar.uuid"
|
|
|
|
@input="submitAvatar($event)"
|
|
|
|
:initial-value="initialAvatar"
|
|
|
|
:required="false"
|
2020-02-23 14:31:03 +00:00
|
|
|
@delete="avatar = {uuid: null}">
|
|
|
|
<translate translate-context="Content/Channel/*" slot="label">Avatar</translate>
|
|
|
|
</attachment-input>
|
2018-07-13 12:10:39 +00:00
|
|
|
</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
|
2020-02-23 14:31:03 +00:00
|
|
|
:class="['ui', {'loading': isLoading}, 'yellow', 'button']"
|
2018-05-09 20:18:33 +00:00
|
|
|
: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
|
2020-02-23 14:31:03 +00:00
|
|
|
class="ui tiny basic red button"
|
2019-03-25 16:02:51 +00:00
|
|
|
@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}}">
|
2019-10-01 13:19:55 +00:00
|
|
|
<translate translate-context="Content/*/Button.Label/Verb">Edit</translate>
|
2019-03-25 16:02:51 +00:00
|
|
|
</router-link>
|
|
|
|
<dangerous-button
|
2020-02-23 14:31:03 +00:00
|
|
|
class="ui tiny basic red button"
|
2019-03-25 16:02:51 +00:00
|
|
|
@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>
|
2019-09-21 14:20:49 +00:00
|
|
|
<section class="ui text container">
|
|
|
|
<div class="ui hidden divider"></div>
|
|
|
|
<h2 class="ui header">
|
|
|
|
<i class="trash icon"></i>
|
|
|
|
<div class="content">
|
2019-10-01 13:19:55 +00:00
|
|
|
<translate translate-context="*/*/Button.Label">Delete my account</translate>
|
2019-09-21 14:20:49 +00:00
|
|
|
</div>
|
|
|
|
</h2>
|
|
|
|
<p>
|
|
|
|
<translate translate-context="Content/Settings/Paragraph'">You can permanently and irreversibly delete your account and all the associated data using the form below. You will be asked for confirmation.</translate>
|
|
|
|
</p>
|
|
|
|
<div class="ui warning message">
|
|
|
|
<translate translate-context="Content/Settings/Paragraph'">Your account will be deleted from our servers within a few minutes. We will also notify other servers who may have a copy of some of your data so they can proceed to deletion. Please note that some of these servers may be offline or unwilling to comply though.</translate>
|
|
|
|
</div>
|
|
|
|
<div class="ui form"">
|
|
|
|
<div v-if="accountDeleteErrors.length > 0" class="ui negative message">
|
|
|
|
<div class="header"><translate translate-context="Content/Settings/Error message.Title">We cannot delete your account</translate></div>
|
|
|
|
<ul class="list">
|
|
|
|
<li v-for="error in accountDeleteErrors">{{ error }}</li>
|
|
|
|
</ul>
|
|
|
|
</div>
|
|
|
|
<div class="field">
|
|
|
|
<label><translate translate-context="*/*/*">Password</translate></label>
|
|
|
|
<password-input required v-model="password" />
|
|
|
|
</div>
|
|
|
|
<dangerous-button
|
2020-02-23 14:31:03 +00:00
|
|
|
:class="['ui', {'loading': isDeletingAccount}, {disabled: !password}, 'red', 'button']"
|
2019-09-21 14:20:49 +00:00
|
|
|
:action="deleteAccount">
|
|
|
|
<translate translate-context="*/*/Button.Label">Delete my account…</translate>
|
|
|
|
<p slot="modal-header"><translate translate-context="Popup/Settings/Title">Do you want to delete your account?</translate></p>
|
|
|
|
<div slot="modal-content">
|
|
|
|
<p><translate translate-context="Popup/Settings/Paragraph">This is irreversible and will permanently remove your data from our servers. You will we immediatly logged out.</translate></p>
|
|
|
|
</div>
|
2019-10-01 13:19:55 +00:00
|
|
|
<div slot="modal-confirm"><translate translate-context="*/*/Button.Label">Delete my account</translate></div>
|
2019-09-21 14:20:49 +00:00
|
|
|
</dangerous-button>
|
|
|
|
</div>
|
|
|
|
</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"
|
2020-01-23 15:38:04 +00:00
|
|
|
import AttachmentInput from '@/components/common/AttachmentInput'
|
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,
|
2020-01-23 15:38:04 +00:00
|
|
|
SubsonicTokenForm,
|
|
|
|
AttachmentInput
|
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: "",
|
2020-01-23 15:38:04 +00:00
|
|
|
avatar: {...(this.$store.state.auth.profile.avatar || {uuid: null})},
|
2018-11-19 22:33:22 +00:00
|
|
|
passwordError: "",
|
2019-09-21 14:20:49 +00:00
|
|
|
password: "",
|
2018-03-03 11:40:01 +00:00
|
|
|
isLoading: false,
|
2018-07-13 12:10:39 +00:00
|
|
|
isLoadingAvatar: false,
|
2019-09-21 14:20:49 +00:00
|
|
|
isDeletingAccount: false,
|
|
|
|
accountDeleteErrors: [],
|
2018-07-13 12:10:39 +00:00
|
|
|
avatarErrors: [],
|
2019-03-25 16:02:51 +00:00
|
|
|
apps: [],
|
|
|
|
ownedApps: [],
|
2018-03-03 11:40:01 +00:00
|
|
|
settings: {
|
|
|
|
success: false,
|
|
|
|
errors: [],
|
2020-02-05 14:06:07 +00:00
|
|
|
order: ["summary", "privacy_level"],
|
2018-03-03 11:40:01 +00:00
|
|
|
fields: {
|
2020-02-05 14:06:07 +00:00
|
|
|
summary: {
|
|
|
|
type: "content",
|
|
|
|
initial: this.$store.state.auth.profile.summary || {text: '', content_type: 'text/markdown'},
|
|
|
|
},
|
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
|
|
|
}
|
2020-01-23 15:38:04 +00:00
|
|
|
d.initialAvatar = d.avatar.uuid
|
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 => {
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
2020-01-23 15:38:04 +00:00
|
|
|
submitAvatar(uuid) {
|
2018-07-13 12:10:39 +00:00
|
|
|
this.isLoadingAvatar = true
|
|
|
|
this.avatarErrors = []
|
|
|
|
let self = this
|
2018-11-19 22:33:22 +00:00
|
|
|
axios
|
2020-01-23 15:38:04 +00:00
|
|
|
.patch(`users/users/${this.$store.state.auth.username}/`, {avatar: uuid})
|
2018-11-19 22:33:22 +00:00
|
|
|
.then(
|
|
|
|
response => {
|
|
|
|
this.isLoadingAvatar = false
|
2020-01-23 15:38:04 +00:00
|
|
|
self.avatar = response.data.avatar
|
|
|
|
self.$store.commit("auth/avatar", response.data.avatar)
|
2018-11-19 22:33:22 +00:00
|
|
|
},
|
|
|
|
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({
|
2020-02-05 14:06:07 +00:00
|
|
|
name: "profile.overview",
|
2018-11-19 22:33:22 +00:00
|
|
|
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
|
|
|
)
|
2019-09-21 14:20:49 +00:00
|
|
|
},
|
|
|
|
deleteAccount() {
|
|
|
|
this.isDeletingAccount = true
|
|
|
|
this.accountDeleteErrors = []
|
|
|
|
let self = this
|
|
|
|
let payload = {
|
|
|
|
confirm: true,
|
|
|
|
password: this.password,
|
|
|
|
}
|
|
|
|
axios.delete(`users/users/me/`, {data: payload})
|
|
|
|
.then(
|
|
|
|
response => {
|
|
|
|
self.isDeletingAccount = false
|
2019-10-01 11:47:07 +00:00
|
|
|
let msg = self.$pgettext('*/Auth/Message', 'Your deletion request was submitted, your account and content will be deleted shortly')
|
2019-09-21 14:20:49 +00:00
|
|
|
self.$store.commit('ui/addMessage', {
|
|
|
|
content: msg,
|
|
|
|
date: new Date()
|
|
|
|
})
|
|
|
|
self.$store.dispatch('auth/logout')
|
|
|
|
},
|
|
|
|
error => {
|
|
|
|
self.isDeletingAccount = false
|
|
|
|
self.accountDeleteErrors = error.backendErrors
|
|
|
|
}
|
|
|
|
)
|
|
|
|
},
|
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
|
2020-02-05 14:06:07 +00:00
|
|
|
if (setting === 'summary' && !conf.value.text) {
|
|
|
|
s[setting] = null
|
|
|
|
}
|
2018-03-03 11:40:01 +00:00
|
|
|
})
|
|
|
|
return s
|
|
|
|
}
|
2017-12-26 14:56:04 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<!-- Add "scoped" attribute to limit CSS to this component only -->
|
|
|
|
<style scoped>
|
|
|
|
</style>
|