LeadMagnet/leadchat
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Feature: Ability to set an account name (#667)

Browse Source 
* Ability to change the account name 
* Ability to set a language to the account

Addresses: #667  #307  

Co-authored-by: Pranav Raj Sreepuram <pranavrajs@gmail.com>
This commit is contained in:
Nithin David Thomas
2020-04-06 22:17:07 +05:30
committed by GitHub
parent a1a81e3799
commit 99eaf59509
48 changed files with 1385 additions and 67 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
app/javascript/dashboard/routes/dashboard/settings/account/Index.vue Normal file
View File

@@ -0,0 +1,141 @@
<template>
<div class="columns profile--settings ">
<form @submit.prevent="updateAccount()">
<div class="small-12 row profile--settings--row">
<div class="columns small-3 ">
<h4 class="block-title">
{{ $t('GENERAL_SETTINGS.FORM.GENERAL_SECTION.TITLE') }}
</h4>
<p>{{ $t('GENERAL_SETTINGS.FORM.GENERAL_SECTION.NOTE') }}</p>
</div>
<div class="columns small-9 medium-5">
<label :class="{ error: $v.name.$error }">
{{ $t('GENERAL_SETTINGS.FORM.NAME.LABEL') }}
<input
v-model="name"
type="text"
:placeholder="$t('GENERAL_SETTINGS.FORM.NAME.PLACEHOLDER')"
@blur="$v.name.$touch"
/>
<span v-if="$v.name.$error" class="message">
{{ $t('GENERAL_SETTINGS.FORM.NAME.ERROR') }}
</span>
</label>
<label :class="{ error: $v.locale.$error }">
{{ $t('GENERAL_SETTINGS.FORM.LANGUAGE.LABEL') }}
<select v-model="locale">
<option value="en">English</option>
<option value="de">German</option>
</select>
<span v-if="$v.locale.$error" class="message">
{{ $t('GENERAL_SETTINGS.FORM.LANGUAGE.ERROR') }}
</span>
</label>
</div>
</div>
<woot-submit-button
class="button nice success button--fixed-right-top"
:button-text="$t('GENERAL_SETTINGS.SUBMIT')"
:loading="isUpdating"
>
</woot-submit-button>
</form>
</div>
</template>
<script>
import Vue from 'vue';
import { required } from 'vuelidate/lib/validators';
import { mapGetters } from 'vuex';
import { accountIdFromPathname } from 'dashboard/helper/URLHelper';
import alertMixin from 'shared/mixins/alertMixin';
export default {
mixins: [alertMixin],
data() {
return {
id: '',
name: '',
locale: 'en',
};
},
validations: {
name: {
required,
},
locale: {
required,
},
},
computed: {
...mapGetters({
getAccount: 'accounts/getAccount',
uiFlags: 'accounts/getUIFlags',
}),
isUpdating() {
return this.uiFlags.isUpdating;
},
},
mounted() {
if (!this.id) {
this.initializeAccount();
}
},
methods: {
async initializeAccount() {
const { pathname } = window.location;
const accountId = accountIdFromPathname(pathname);
if (accountId) {
await this.$store.dispatch('accounts/get');
const { name, locale, id } = this.getAccount(accountId);
Vue.config.lang = locale;
this.name = name;
this.locale = locale;
this.id = id;
}
},
async updateAccount() {
this.$v.$touch();
if (this.$v.$invalid) {
this.showAlert(this.$t('GENERAL_SETTINGS.FORM.ERROR'));
return;
}
try {
await this.$store.dispatch('accounts/update', {
locale: this.locale,
name: this.name,
});
Vue.config.lang = this.locale;
this.showAlert(this.$t('GENERAL_SETTINGS.UPDATE.SUCCESS'));
} catch (error) {
this.showAlert(this.$t('GENERAL_SETTINGS.UPDATE.ERROR'));
}
},
},
};
</script>
<style lang="scss">
@import '~dashboard/assets/scss/variables.scss';
@import '~dashboard/assets/scss/mixins.scss';
.profile--settings {
padding: 24px;
overflow: auto;
}
.profile--settings--row {
@include border-normal-bottom;
padding: $space-normal;
.small-3 {
padding: $space-normal $space-medium $space-normal 0;
}
.small-9 {
padding: $space-normal;
}
}
</style>

27
app/javascript/dashboard/routes/dashboard/settings/account/account.routes.js Normal file
View File

@@ -0,0 +1,27 @@
import SettingsContent from '../Wrapper';
import Index from './Index.vue';
import { frontendURL } from '../../../../helper/URLHelper';
export default {
routes: [
{
path: frontendURL('accounts/:accountId/settings/general'),
name: 'general_settings',
roles: ['administrator'],
component: SettingsContent,
props: {
headerTitle: 'GENERAL_SETTINGS.TITLE',
icon: 'ion-gear-a',
showNewButton: false,
},
children: [
{
path: '',
name: 'general_settings_index',
component: Index,
roles: ['administrator'],
},
],
},
],
};

14
app/javascript/dashboard/routes/dashboard/settings/inbox/InboxChannels.vue
View File

@@ -1,18 +1,6 @@
<template>
<div class="row content-box full-height">
<woot-wizard class="small-3 columns" :items="wizardItems"></woot-wizard>
<woot-wizard class="small-3 columns"></woot-wizard>
<router-view></router-view>
</div>
</template>
<script>
/* eslint no-console: 0 */
/* eslint-env browser */
export default {
data() {
return {
wizardItems: this.$t('INBOX_MGMT.CREATE_FLOW'),
};
},
};
</script>

4
app/javascript/dashboard/routes/dashboard/settings/profile/profile.routes.js
View File

@@ -10,14 +10,14 @@ export default {
roles: ['administrator', 'agent'],
component: SettingsContent,
props: {
headerTitle: 'PROFILE_SETTINGS.TITLE',
headerTitle: 'GENERAL_SETTINGS.TITLE',
icon: 'ion-compose',
showNewButton: false,
},
children: [
{
path: 'settings',
name: 'profile_settings_index',
name: 'general_settings_index',
component: Index,
roles: ['administrator', 'agent'],
},

2
app/javascript/dashboard/routes/dashboard/settings/settings.routes.js
View File

@@ -7,6 +7,7 @@ import inbox from './inbox/inbox.routes';
import profile from './profile/profile.routes';
import reports from './reports/reports.routes';
import integrations from './integrations/integrations.routes';
import account from './account/account.routes';
export default {
routes: [
@@ -28,5 +29,6 @@ export default {
...profile.routes,
...reports.routes,
...integrations.routes,
...account.routes,
],
};