mirror of
https://github.com/nocodb/nocodb.git
synced 2026-05-02 16:26:57 +00:00
refactor(gui): linting
Signed-off-by: Pranav C <61551451+pranavxc@users.noreply.github.com>
This commit is contained in:
Pranav C
@@ -1,150 +1,175 @@
|
||||
<template>
|
||||
|
||||
<section class="section container">
|
||||
<div class="box">
|
||||
<div class="box">
|
||||
<h3 class="title is-3">Connected social accounts (work in progress)</h3>
|
||||
<section class="" v-if="isConnectedSocialAccount('facebook')">
|
||||
<button class="button">facebook</button>
|
||||
<h3 class="title is-3">
|
||||
Connected social accounts (work in progress)
|
||||
</h3>
|
||||
<section v-if="isConnectedSocialAccount('facebook')" class="">
|
||||
<button class="button">
|
||||
facebook
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('google')">
|
||||
<button class="button">google</button>
|
||||
<section v-if="isConnectedSocialAccount('google')" class="">
|
||||
<button class="button">
|
||||
google
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('twitter')">
|
||||
<button class="button">twitter</button>
|
||||
<section v-if="isConnectedSocialAccount('twitter')" class="">
|
||||
<button class="button">
|
||||
twitter
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('linkedin')">
|
||||
<button class="button">linkedin</button>
|
||||
<section v-if="isConnectedSocialAccount('linkedin')" class="">
|
||||
<button class="button">
|
||||
linkedin
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('paypal')">
|
||||
<button class="button">paypal</button>
|
||||
<section v-if="isConnectedSocialAccount('paypal')" class="">
|
||||
<button class="button">
|
||||
paypal
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('github')">
|
||||
<button class="button">github</button>
|
||||
<section v-if="isConnectedSocialAccount('github')" class="">
|
||||
<button class="button">
|
||||
github
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h3 class="title is-3">Unconnected social accounts (work in progress)</h3>
|
||||
<section class="" v-if="isConnectedSocialAccount('facebook')">
|
||||
<button class="button">facebook</button>
|
||||
<h3 class="title is-3">
|
||||
Unconnected social accounts (work in progress)
|
||||
</h3>
|
||||
<section v-if="isConnectedSocialAccount('facebook')" class="">
|
||||
<button class="button">
|
||||
facebook
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('google')">
|
||||
<button class="button">google</button>
|
||||
<section v-if="isConnectedSocialAccount('google')" class="">
|
||||
<button class="button">
|
||||
google
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('twitter')">
|
||||
<button class="button">twitter</button>
|
||||
<section v-if="isConnectedSocialAccount('twitter')" class="">
|
||||
<button class="button">
|
||||
twitter
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('linkedin')">
|
||||
<button class="button">linkedin</button>
|
||||
<section v-if="isConnectedSocialAccount('linkedin')" class="">
|
||||
<button class="button">
|
||||
linkedin
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('paypal')">
|
||||
<button class="button">paypal</button>
|
||||
<section v-if="isConnectedSocialAccount('paypal')" class="">
|
||||
<button class="button">
|
||||
paypal
|
||||
</button>
|
||||
</section>
|
||||
<section class="" v-if="isConnectedSocialAccount('github')">
|
||||
<button class="button">github</button>
|
||||
<section v-if="isConnectedSocialAccount('github')" class="">
|
||||
<button class="button">
|
||||
github
|
||||
</button>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!--<div align="center">-->
|
||||
|
||||
|
||||
<!--<!–<h1>user.accounts</h1>–>-->
|
||||
<!--<!–<section class="row">–>-->
|
||||
<!--<!–<h3 class="col-md-12 text-center" ng-show="hasConnectedAdditionalSocialAccounts()">Connected social accounts:</h3>–>-->
|
||||
<!--<!–<div class="col-md-12 text-center">–>-->
|
||||
<!--<!–<!–<div ng-repeat="(providerName, providerData) in user.additionalProvidersData" class="social-account-container">–>–>-->
|
||||
<!--<!–<!–<!–<img ng-src="/modules/users/client/img/buttons/{{providerName}}.png">–>–>–>-->
|
||||
<!--<!–<!–<a class="btn btn-danger btn-raised btn-remove-account" ng-click="removeUserSocialAccount(providerName)">–>–>-->
|
||||
<!--<!–<!–<i class="glyphicon glyphicon-trash"></i>–>–>-->
|
||||
<!--<!–<!–</a>–>–>-->
|
||||
<!--<!–<!–</div>–>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<h3 class="col-md-12 text-center" ng-show="hasConnectedAdditionalSocialAccounts()">–>-->
|
||||
<!--<!–Unconnected social accounts:</h3>–>-->
|
||||
<!--<!–<div class="col-md-12 text-center">–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('facebook')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/facebook.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/facebook" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">Facebook</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('twitter')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/twitter.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/twitter" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">twitter</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('google')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/google.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/google" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">google</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('linkedin')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/linkedin.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/linkedin" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">linkedin</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('github')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/github.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/github" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">github</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('paypal')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/paypal.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/paypal" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">paypal</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–</section>–>-->
|
||||
<!--<!–<h1>user.accounts</h1>–>-->
|
||||
<!--<!–<section class="row">–>-->
|
||||
<!--<!–<h3 class="col-md-12 text-center" ng-show="hasConnectedAdditionalSocialAccounts()">Connected social accounts:</h3>–>-->
|
||||
<!--<!–<div class="col-md-12 text-center">–>-->
|
||||
<!--<!–<!–<div ng-repeat="(providerName, providerData) in user.additionalProvidersData" class="social-account-container">–>–>-->
|
||||
<!--<!–<!–<!–<img ng-src="/modules/users/client/img/buttons/{{providerName}}.png">–>–>–>-->
|
||||
<!--<!–<!–<a class="btn btn-danger btn-raised btn-remove-account" ng-click="removeUserSocialAccount(providerName)">–>–>-->
|
||||
<!--<!–<!–<i class="glyphicon glyphicon-trash"></i>–>–>-->
|
||||
<!--<!–<!–</a>–>–>-->
|
||||
<!--<!–<!–</div>–>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<h3 class="col-md-12 text-center" ng-show="hasConnectedAdditionalSocialAccounts()">–>-->
|
||||
<!--<!–Unconnected social accounts:</h3>–>-->
|
||||
<!--<!–<div class="col-md-12 text-center">–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('facebook')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/facebook.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/facebook" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">Facebook</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('twitter')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/twitter.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/twitter" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">twitter</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('google')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/google.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/google" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">google</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('linkedin')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/linkedin.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/linkedin" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">linkedin</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('github')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/github.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/github" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">github</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–<div class="social-account-container" ng-hide="isConnectedSocialAccount('paypal')">–>-->
|
||||
<!--<!–<!–<img ng-src="/modules/users/client/img/buttons/paypal.png">–>–>-->
|
||||
<!--<!–<a class="btn btn-success btn-raised btn-remove-account" href="/api/auth/paypal" target="_self">–>-->
|
||||
<!--<!–<i class="glyphicon glyphicon-plus">paypal</i>–>-->
|
||||
<!--<!–</a>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–</div>–>-->
|
||||
<!--<!–</section>–>-->
|
||||
|
||||
<!--</div>-->
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {}
|
||||
},
|
||||
computed: {},
|
||||
methods: {
|
||||
hasConnectedAdditionalSocialAccounts() {
|
||||
export default {
|
||||
directives: {},
|
||||
components: {},
|
||||
validate ({ params }) {
|
||||
return true
|
||||
},
|
||||
props: {},
|
||||
data () {
|
||||
return {}
|
||||
},
|
||||
head () {
|
||||
return {}
|
||||
},
|
||||
computed: {},
|
||||
watch: {},
|
||||
created () {
|
||||
},
|
||||
mounted () {
|
||||
},
|
||||
beforeDestroy () {
|
||||
},
|
||||
methods: {
|
||||
hasConnectedAdditionalSocialAccounts () {
|
||||
|
||||
},
|
||||
removeUserSocialAccount() {
|
||||
},
|
||||
removeUserSocialAccount () {
|
||||
|
||||
},
|
||||
isConnectedSocialAccount(social) {
|
||||
return true;
|
||||
}
|
||||
},
|
||||
beforeCreated() {
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
destroy() {
|
||||
},
|
||||
validate({params}) {
|
||||
isConnectedSocialAccount (social) {
|
||||
return true
|
||||
},
|
||||
head() {
|
||||
return {}
|
||||
},
|
||||
props: {},
|
||||
watch: {},
|
||||
directives: {},
|
||||
components: {}
|
||||
}
|
||||
},
|
||||
beforeCreated () {
|
||||
},
|
||||
destroy () {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -6,136 +6,151 @@
|
||||
v-model="tabs1.tab"
|
||||
background-color=""
|
||||
class="elevation-2"
|
||||
dark>
|
||||
|
||||
<v-tabs-slider></v-tabs-slider>
|
||||
dark
|
||||
>
|
||||
<v-tabs-slider />
|
||||
|
||||
<v-tab
|
||||
v-for="(t,i) in tabs1.tabs"
|
||||
:key="i"
|
||||
:href="`#tab-${i}`">
|
||||
{{t.title}}
|
||||
:href="`#tab-${i}`"
|
||||
>
|
||||
{{ t.title }}
|
||||
</v-tab>
|
||||
|
||||
<v-tab-item
|
||||
v-for="(t,i) in tabs1.tabs"
|
||||
:key="i"
|
||||
:value="'tab-' + i">
|
||||
:value="'tab-' + i"
|
||||
>
|
||||
<v-card
|
||||
v-if="t.type==='password'"
|
||||
class="py-10 "
|
||||
flat
|
||||
tile v-if="t.type==='password'">
|
||||
tile
|
||||
>
|
||||
<br>
|
||||
<div v-if="isAdmin">
|
||||
<h1>You are an Admin too!</h1>
|
||||
<h2 class="title is-2">You are admin as well</h2>
|
||||
<router-link to="/user/admin">User list</router-link>
|
||||
<h2 class="title is-2">
|
||||
You are admin as well
|
||||
</h2>
|
||||
<router-link to="/user/admin">
|
||||
User list
|
||||
</router-link>
|
||||
</div>
|
||||
|
||||
<v-row align="center">
|
||||
<v-col md="8" offset-md="2">
|
||||
|
||||
<p class="display-1">Change Password</p>
|
||||
|
||||
<p class="display-1">
|
||||
Change Password
|
||||
</p>
|
||||
|
||||
<div>
|
||||
<v-alert type="error" dismissible v-model="formUtil.formErr">
|
||||
{{formUtil.formErrMsg}}
|
||||
<v-alert v-model="formUtil.formErr" type="error" dismissible>
|
||||
{{ formUtil.formErrMsg }}
|
||||
</v-alert>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<v-card class="pa-5 elevation-10" color="">
|
||||
<v-form v-model="valid" ref="formType" lazy-validation>
|
||||
|
||||
<v-form ref="formType" v-model="valid" lazy-validation>
|
||||
<v-text-field
|
||||
v-model="passwordDetails.currentPassword"
|
||||
name="input-10-2"
|
||||
label="Currrent password"
|
||||
:append-icon="e3 ? 'visibility' : 'visibility_off'"
|
||||
@click:append="() => (e3 = !e3)"
|
||||
v-model="passwordDetails.currentPassword"
|
||||
:rules="formRules.password[0]"
|
||||
:type="e3 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
@click:append="() => (e3 = !e3)"
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="passwordDetails.newPassword"
|
||||
name="input-10-2"
|
||||
label="New password"
|
||||
:append-icon="e4 ? 'visibility' : 'visibility_off'"
|
||||
@click:append="() => (e4 = !e4)"
|
||||
v-model="passwordDetails.newPassword"
|
||||
:rules="formRules.password[1]"
|
||||
:type="e4 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
@click:append="() => (e4 = !e4)"
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="passwordDetails.verifyPassword"
|
||||
name="input-10-2"
|
||||
label="Confirm new password"
|
||||
:append-icon="e5 ? 'visibility' : 'visibility_off'"
|
||||
@click:append="() => (e5 = !e5)"
|
||||
v-model="passwordDetails.verifyPassword"
|
||||
:rules="formRules.password[2]"
|
||||
:type="e5 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
|
||||
@click:append="() => (e5 = !e5)"
|
||||
/>
|
||||
|
||||
<v-btn
|
||||
@click="resetUserPassword"
|
||||
color="primary"
|
||||
large
|
||||
:disabled="!valid">
|
||||
:disabled="!valid"
|
||||
@click="resetUserPassword"
|
||||
>
|
||||
SAVE PASSWORD
|
||||
</v-btn>
|
||||
|
||||
</v-form>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
</v-card>
|
||||
<v-card
|
||||
v-if="t.type==='subscription'"
|
||||
class="py-10 px-4"
|
||||
flat
|
||||
tile v-if="t.type==='subscription'">
|
||||
tile
|
||||
>
|
||||
<br>
|
||||
<p class="display-1">
|
||||
Your subscriptions
|
||||
</p>
|
||||
|
||||
<v-simple-table class="mt-10 mb-4">
|
||||
<template v-slot:default>
|
||||
<template #default>
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-center">Plan</th>
|
||||
<th class="text-center">Created On</th>
|
||||
<th class="text-center">Expires On</th>
|
||||
</tr>
|
||||
<tr>
|
||||
<th class="text-center">
|
||||
Plan
|
||||
</th>
|
||||
<th class="text-center">
|
||||
Created On
|
||||
</th>
|
||||
<th class="text-center">
|
||||
Expires On
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<template v-if="subscriptions && subscriptions.length">
|
||||
<tr v-for="(s,i) in subscriptions" :key="i">
|
||||
<td>{{s.plan_id}}</td>
|
||||
<td>{{new Date(s.created_at).toLocaleDateString()}}</td>
|
||||
<td>{{new Date(JSON.parse(s.api_response).subscription.current_term_end *
|
||||
1000).toLocaleDateString()}}
|
||||
<template v-if="subscriptions && subscriptions.length">
|
||||
<tr v-for="(s,i) in subscriptions" :key="i">
|
||||
<td>{{ s.plan_id }}</td>
|
||||
<td>{{ new Date(s.created_at).toLocaleDateString() }}</td>
|
||||
<td>
|
||||
{{ new Date(JSON.parse(s.api_response).subscription.current_term_end *
|
||||
1000).toLocaleDateString() }}
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
<tr v-else class="grey--text">
|
||||
<td colspan="3">
|
||||
No subscription found.
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
<tr v-else class="grey--text">
|
||||
<td colspan="3"> No subscription found.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</template>
|
||||
</v-simple-table>
|
||||
|
||||
<v-row class="text-center">
|
||||
<v-btn @click="getSubscriptions" class="mx-auto orange-gradient white--text">
|
||||
<v-btn class="mx-auto orange-gradient white--text" @click="getSubscriptions">
|
||||
<v-icon>mdi-refresh</v-icon> Refresh
|
||||
</v-btn>
|
||||
</v-row>
|
||||
|
||||
|
||||
<!-- <v-btn @click.prevent="getSubscriptions">Show Subscriptions</v-btn>-->
|
||||
<!-- <pre v-if="subscriptions.length">-->
|
||||
<!-- <div v-for="(s,i) in subscriptions" :key="i">-->
|
||||
@@ -153,129 +168,124 @@
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-container>
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {isEmail} from "@/helpers";
|
||||
import { isEmail } from '@/helpers'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
user: {
|
||||
provider: 'local',
|
||||
},
|
||||
tabs: 3,
|
||||
tabs1: {
|
||||
tab: null,
|
||||
tabs: [{
|
||||
type: 'password',
|
||||
title: 'Change Password',
|
||||
}, {
|
||||
type: 'subscription',
|
||||
title: 'Subscriptions',
|
||||
}]
|
||||
},
|
||||
|
||||
subscriptions: [],
|
||||
|
||||
passwordDetails: {
|
||||
newPassword: null,
|
||||
verifyPassword: null,
|
||||
currentPassword: null
|
||||
},
|
||||
formUtil: {
|
||||
formErr: false,
|
||||
formErrMsg: '',
|
||||
},
|
||||
e3: true,
|
||||
e4: true,
|
||||
e5: true,
|
||||
valid: true,
|
||||
formRules: {
|
||||
email: [
|
||||
v => !!v || 'E-mail is required',
|
||||
v => isEmail(v) || 'E-mail must be valid'
|
||||
],
|
||||
password: [
|
||||
[v => !!v || 'Password is required'],
|
||||
[v => !!v || 'New Password is required'],
|
||||
[v => v === this.passwordDetails.newPassword || 'Confirm password should match'],
|
||||
],
|
||||
},
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
isAdmin() {
|
||||
if (this.$store.state.users.user) {
|
||||
//console.log(this.$store.state.users.user.roles.indexOf('creator'));
|
||||
return 'creator' in this.$store.state.users.user.roles;
|
||||
}
|
||||
return false;
|
||||
export default {
|
||||
directives: {},
|
||||
components: {},
|
||||
validate ({ params }) {
|
||||
return true
|
||||
},
|
||||
props: {},
|
||||
data () {
|
||||
return {
|
||||
user: {
|
||||
provider: 'local'
|
||||
},
|
||||
tabs: 3,
|
||||
tabs1: {
|
||||
tab: null,
|
||||
tabs: [{
|
||||
type: 'password',
|
||||
title: 'Change Password'
|
||||
}, {
|
||||
type: 'subscription',
|
||||
title: 'Subscriptions'
|
||||
}]
|
||||
},
|
||||
|
||||
isEmailAuth() {
|
||||
|
||||
if (this.$store.state.users.user) {
|
||||
//console.log(this.$store.state.users.user.roles.indexOf('creator'));
|
||||
return (this.$store.state.users.user.provider === 'local');
|
||||
}
|
||||
return false;
|
||||
subscriptions: [],
|
||||
|
||||
passwordDetails: {
|
||||
newPassword: null,
|
||||
verifyPassword: null,
|
||||
currentPassword: null
|
||||
},
|
||||
formUtil: {
|
||||
formErr: false,
|
||||
formErrMsg: ''
|
||||
},
|
||||
e3: true,
|
||||
e4: true,
|
||||
e5: true,
|
||||
valid: true,
|
||||
formRules: {
|
||||
email: [
|
||||
v => !!v || 'E-mail is required',
|
||||
v => isEmail(v) || 'E-mail must be valid'
|
||||
],
|
||||
password: [
|
||||
[v => !!v || 'Password is required'],
|
||||
[v => !!v || 'New Password is required'],
|
||||
[v => v === this.passwordDetails.newPassword || 'Confirm password should match']
|
||||
]
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
head () {
|
||||
return {}
|
||||
},
|
||||
computed: {
|
||||
isAdmin () {
|
||||
if (this.$store.state.users.user) {
|
||||
// console.log(this.$store.state.users.user.roles.indexOf('creator'));
|
||||
return 'creator' in this.$store.state.users.user.roles
|
||||
}
|
||||
return false
|
||||
},
|
||||
methods: {
|
||||
test() {
|
||||
//console.log('test method');
|
||||
},
|
||||
|
||||
async resetUserPassword(e) {
|
||||
e.preventDefault();
|
||||
if (this.$refs.formType[0].validate()) {
|
||||
//console.log('passworDetails',this.passwordDetails);
|
||||
const err = await this.$store.dispatch('users/ActPostPasswordChange', this.passwordDetails)
|
||||
if (err) {
|
||||
this.formUtil.formErr = true;
|
||||
this.formUtil.formErrMsg = err.data.msg;
|
||||
} else {
|
||||
this.$toast.success('Password changed successfully.').goAway(3000);
|
||||
this.$refs.formType[0].reset();
|
||||
}
|
||||
isEmailAuth () {
|
||||
if (this.$store.state.users.user) {
|
||||
// console.log(this.$store.state.users.user.roles.indexOf('creator'));
|
||||
return (this.$store.state.users.user.provider === 'local')
|
||||
}
|
||||
return false
|
||||
}
|
||||
|
||||
},
|
||||
watch: {},
|
||||
created () {
|
||||
},
|
||||
mounted () {
|
||||
this.getSubscriptions()
|
||||
},
|
||||
beforeDestroy () {
|
||||
},
|
||||
methods: {
|
||||
test () {
|
||||
// console.log('test method');
|
||||
},
|
||||
|
||||
async resetUserPassword (e) {
|
||||
e.preventDefault()
|
||||
if (this.$refs.formType[0].validate()) {
|
||||
// console.log('passworDetails',this.passwordDetails);
|
||||
const err = await this.$store.dispatch('users/ActPostPasswordChange', this.passwordDetails)
|
||||
if (err) {
|
||||
this.formUtil.formErr = true
|
||||
this.formUtil.formErrMsg = err.data.msg
|
||||
} else {
|
||||
this.$toast.success('Password changed successfully.').goAway(3000)
|
||||
this.$refs.formType[0].reset()
|
||||
}
|
||||
},
|
||||
|
||||
async getSubscriptions(e) {
|
||||
console.log('get subs');
|
||||
let data = await this.$store.dispatch('users/ActGetSubscriptionsList')
|
||||
this.subscriptions = data;
|
||||
}
|
||||
},
|
||||
beforeCreated() {
|
||||
},
|
||||
created() {
|
||||
},
|
||||
mounted() {
|
||||
this.getSubscriptions();
|
||||
},
|
||||
beforeDestroy() {
|
||||
},
|
||||
destroy() {
|
||||
},
|
||||
validate({params}) {
|
||||
return true
|
||||
},
|
||||
head() {
|
||||
return {}
|
||||
},
|
||||
props: {},
|
||||
watch: {},
|
||||
directives: {},
|
||||
components: {}
|
||||
|
||||
async getSubscriptions (e) {
|
||||
console.log('get subs')
|
||||
const data = await this.$store.dispatch('users/ActGetSubscriptionsList')
|
||||
this.subscriptions = data
|
||||
}
|
||||
},
|
||||
beforeCreated () {
|
||||
},
|
||||
destroy () {
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -1,154 +1,144 @@
|
||||
<template>
|
||||
|
||||
<v-container class="text-center" >
|
||||
<v-row align="center">
|
||||
<v-container class="text-center">
|
||||
<v-row align="center">
|
||||
<v-col md="6" offset-md="3">
|
||||
|
||||
<h1>Change Password</h1>
|
||||
<br>
|
||||
|
||||
<v-card class="pa-5 elevation-10" color="">
|
||||
<v-form v-model="valid" ref="formType" lazy-validation>
|
||||
|
||||
<v-form ref="formType" v-model="valid" lazy-validation>
|
||||
<v-text-field
|
||||
v-model="passwordDetails.currentPassword"
|
||||
name="input-10-2"
|
||||
label="Currrent password"
|
||||
:append-icon="e3 ? 'visibility' : 'visibility_off'"
|
||||
:append-icon-cb="() => (e3 = !e3)"
|
||||
v-model="passwordDetails.currentPassword"
|
||||
:rules="formRules.password"
|
||||
:type="e3 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="passwordDetails.newPassword"
|
||||
name="input-10-2"
|
||||
label="New password"
|
||||
:append-icon="e4 ? 'visibility' : 'visibility_off'"
|
||||
:append-icon-cb="() => (e4 = !e4)"
|
||||
v-model="passwordDetails.newPassword"
|
||||
:rules="formRules.password"
|
||||
:type="e4 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
/>
|
||||
|
||||
<v-text-field
|
||||
v-model="passwordDetails.verifyPassword"
|
||||
name="input-10-2"
|
||||
label="Confirm new password"
|
||||
:append-icon="e5 ? 'visibility' : 'visibility_off'"
|
||||
:append-icon-cb="() => (e5 = !e5)"
|
||||
v-model="passwordDetails.verifyPassword"
|
||||
:rules="formRules.password"
|
||||
:type="e5 ? 'password' : 'text'"
|
||||
></v-text-field>
|
||||
|
||||
|
||||
/>
|
||||
|
||||
<v-btn
|
||||
@click="resetUserPassword"
|
||||
color="primary"
|
||||
large
|
||||
:disabled="!valid">
|
||||
:disabled="!valid"
|
||||
@click="resetUserPassword"
|
||||
>
|
||||
SAVE PASSWORD
|
||||
</v-btn>
|
||||
|
||||
</v-form>
|
||||
</v-card>
|
||||
</v-col>
|
||||
</v-row>
|
||||
|
||||
</v-container>
|
||||
|
||||
|
||||
<!--<section class="section container">-->
|
||||
|
||||
<!--<div class="box">-->
|
||||
<!--<div class="box">-->
|
||||
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">currentPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="currentPassword" id="currentPassword" v-model="passwordDetails.currentPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">currentPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="currentPassword" id="currentPassword" v-model="passwordDetails.currentPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">newPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="newPassword" id="newPassword" v-model="passwordDetails.newPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">newPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="newPassword" id="newPassword" v-model="passwordDetails.newPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">verifyPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="verifyPassword" id="verifyPassword" v-model="passwordDetails.verifyPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="field">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<label class="label">verifyPassword</label>-->
|
||||
<!--<input class="input" type="password" placeholder="verifyPassword" id="verifyPassword" v-model="passwordDetails.verifyPassword">-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
|
||||
<!--<div class="field is-grouped">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<button class="button is-link" @click="resetUserPassword">Reset Password</button>-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="field is-grouped">-->
|
||||
<!--<div class="control">-->
|
||||
<!--<button class="button is-link" @click="resetUserPassword">Reset Password</button>-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
<!--</div>-->
|
||||
|
||||
|
||||
<!---->
|
||||
<!---->
|
||||
|
||||
<!--</section>-->
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {isEmail} from "@/helpers";
|
||||
import { isEmail } from '@/helpers'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
passwordDetails : {
|
||||
newPassword : null,
|
||||
verifyPassword : null,
|
||||
currentPassword:null,
|
||||
oldPassword : null
|
||||
},
|
||||
e3:true,
|
||||
e4:true,
|
||||
e5:true,
|
||||
valid:true,
|
||||
formRules: {
|
||||
email: [
|
||||
v => !!v || 'E-mail is required',
|
||||
v => isEmail(v) || 'E-mail must be valid'
|
||||
],
|
||||
password: [
|
||||
v => !!v || 'Password is required'
|
||||
],
|
||||
},
|
||||
|
||||
}
|
||||
},
|
||||
computed : {
|
||||
},
|
||||
methods : {
|
||||
|
||||
async resetUserPassword(e){
|
||||
e.preventDefault();
|
||||
//console.log('passworDetails',this.passwordDetails);
|
||||
await this.$store.dispatch('ActPostPasswordChange',this.passwordDetails)
|
||||
export default {
|
||||
directives: { },
|
||||
components: { },
|
||||
validate ({ params }) { return true },
|
||||
props: { },
|
||||
data () {
|
||||
return {
|
||||
passwordDetails: {
|
||||
newPassword: null,
|
||||
verifyPassword: null,
|
||||
currentPassword: null,
|
||||
oldPassword: null
|
||||
},
|
||||
e3: true,
|
||||
e4: true,
|
||||
e5: true,
|
||||
valid: true,
|
||||
formRules: {
|
||||
email: [
|
||||
v => !!v || 'E-mail is required',
|
||||
v => isEmail(v) || 'E-mail must be valid'
|
||||
],
|
||||
password: [
|
||||
v => !!v || 'Password is required'
|
||||
]
|
||||
}
|
||||
|
||||
},
|
||||
beforeCreated () {},
|
||||
created () { },
|
||||
mounted () {},
|
||||
beforeDestroy () {},
|
||||
destroy () {},
|
||||
validate({params}) { return true },
|
||||
head() { return {} },
|
||||
props: { },
|
||||
watch: { },
|
||||
directives : { },
|
||||
components : { }
|
||||
}
|
||||
}
|
||||
},
|
||||
head () { return {} },
|
||||
computed: {
|
||||
},
|
||||
watch: { },
|
||||
created () { },
|
||||
mounted () {},
|
||||
beforeDestroy () {},
|
||||
methods: {
|
||||
|
||||
async resetUserPassword (e) {
|
||||
e.preventDefault()
|
||||
// console.log('passworDetails',this.passwordDetails);
|
||||
await this.$store.dispatch('ActPostPasswordChange', this.passwordDetails)
|
||||
}
|
||||
|
||||
},
|
||||
beforeCreated () {},
|
||||
destroy () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<div align="center">
|
||||
<h1>user.picture</h1>
|
||||
<h1>user picture</h1>
|
||||
<section class="">
|
||||
<div class="col-xs-offset-1 col-xs-10 col-md-offset-3 col-md-4">
|
||||
<form class="signin form-horizontal">
|
||||
@@ -9,59 +9,62 @@
|
||||
<!--<img ng-src="{{imageURL}}" alt="{{user.displayName}}" class="img-thumbnail user-profile-picture">-->
|
||||
</div>
|
||||
<div class="text-center form-group">
|
||||
<span class="btn btn-primary btn-raised btn-file">
|
||||
Select Image <input type="file" uploader="uploader">
|
||||
</span>
|
||||
<span class="btn btn-primary btn-raised btn-file">
|
||||
Select Image <input type="file" uploader="uploader">
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-center form-group">
|
||||
<button class="btn btn-primary btn-raised" @click="uploadProfilePicture()">Upload</button>
|
||||
<button class="btn btn-default btn-raised" @click="cancelUpload()">Cancel</button>
|
||||
<button class="btn btn-primary btn-raised" @click="uploadProfilePicture()">
|
||||
Upload
|
||||
</button>
|
||||
<button class="btn btn-default btn-raised" @click="cancelUpload()">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<!--<div ng-show="success" class="text-center text-success">-->
|
||||
<!--<strong>Profile Picture Changed Successfully</strong>-->
|
||||
<!--<strong>Profile Picture Changed Successfully</strong>-->
|
||||
<!--</div>-->
|
||||
<!--<div ng-show="error" class="text-center text-danger">-->
|
||||
<!--<strong ng-bind="error"></strong>-->
|
||||
<!--<strong ng-bind="error"></strong>-->
|
||||
<!--</div>-->
|
||||
</fieldset>
|
||||
</form>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
export default {
|
||||
directives: { },
|
||||
components: { },
|
||||
validate ({ params }) { return true },
|
||||
props: { },
|
||||
data () {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed : {
|
||||
}
|
||||
},
|
||||
head () { return {} },
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: { },
|
||||
created () { },
|
||||
mounted () {},
|
||||
beforeDestroy () {},
|
||||
methods: {
|
||||
uploadProfilePicture () {
|
||||
// console.log('uploadProfilePicture');
|
||||
},
|
||||
methods : {
|
||||
uploadProfilePicture(){
|
||||
//console.log('uploadProfilePicture');
|
||||
},
|
||||
cancelUpload(){
|
||||
//console.log('cancelUpload');
|
||||
}
|
||||
cancelUpload () {
|
||||
// console.log('cancelUpload');
|
||||
}
|
||||
|
||||
},
|
||||
beforeCreated () {},
|
||||
created () { },
|
||||
mounted () {},
|
||||
beforeDestroy () {},
|
||||
destroy () {},
|
||||
validate({params}) { return true },
|
||||
head() { return {} },
|
||||
props: { },
|
||||
watch: { },
|
||||
directives : { },
|
||||
components : { }
|
||||
}
|
||||
},
|
||||
beforeCreated () {},
|
||||
destroy () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
@@ -1,76 +1,74 @@
|
||||
<template>
|
||||
<section class="section container">
|
||||
<div class="box" v-if="this.$store.state.users.user!==null">
|
||||
|
||||
<div v-if="$store.state.users.user!==null" class="box">
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<label class="label">firstname</label>
|
||||
<input class="input" type="text" placeholder="firstname" id="firstname" v-model="form.firstName">
|
||||
<input id="firstname" v-model="form.firstName" class="input" type="text" placeholder="firstname">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="field">
|
||||
<div class="control">
|
||||
<label class="label">lastname</label>
|
||||
<input class="input" type="text" placeholder="lastname" id="lastname" v-model="form.lastName">
|
||||
<input id="lastname" v-model="form.lastName" class="input" type="text" placeholder="lastname">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="field is-grouped">
|
||||
<div class="control">
|
||||
<button class="button is-link" @click="updateUserProfile">Submit</button>
|
||||
<button class="button is-link" @click="updateUserProfile">
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
<div class="control">
|
||||
<button class="button is-text">Cancel</button>
|
||||
<button class="button is-text">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
export default {
|
||||
directives: { },
|
||||
components: { },
|
||||
validate ({ params }) { return true },
|
||||
props: { },
|
||||
data () {
|
||||
return {
|
||||
|
||||
form : {
|
||||
firstName : null,
|
||||
lastName : null
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
computed : {
|
||||
|
||||
},
|
||||
methods : {
|
||||
updateUserProfile(){
|
||||
//console.log('update user profile',this.$store.user);
|
||||
}
|
||||
},
|
||||
beforeCreated () {},
|
||||
created () { },
|
||||
mounted () {
|
||||
|
||||
if(this.$store.state.users.user){
|
||||
//console.log('update user profile',this.$store.state);
|
||||
this.form.firstName = this.$store.state.users.user.firstName;
|
||||
this.form.lastName = this.$store.state.users.user.firstName;
|
||||
form: {
|
||||
firstName: null,
|
||||
lastName: null
|
||||
}
|
||||
|
||||
},
|
||||
beforeDestroy () {},
|
||||
destroy () {},
|
||||
validate({params}) { return true },
|
||||
head() { return {} },
|
||||
props: { },
|
||||
watch: { },
|
||||
directives : { },
|
||||
components : { }
|
||||
}
|
||||
}
|
||||
},
|
||||
head () { return {} },
|
||||
computed: {
|
||||
|
||||
},
|
||||
watch: { },
|
||||
created () { },
|
||||
mounted () {
|
||||
if (this.$store.state.users.user) {
|
||||
// console.log('update user profile',this.$store.state);
|
||||
this.form.firstName = this.$store.state.users.user.firstName
|
||||
this.form.lastName = this.$store.state.users.user.firstName
|
||||
}
|
||||
},
|
||||
beforeDestroy () {},
|
||||
methods: {
|
||||
updateUserProfile () {
|
||||
// console.log('update user profile',this.$store.user);
|
||||
}
|
||||
},
|
||||
beforeCreated () {},
|
||||
destroy () {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
|
||||
Reference in New Issue
Block a user