github
/
nocodb
mirror of https://github.com/nocodb/nocodb
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

chore: format code 

Signed-off-by: Wing-Kam Wong <wingkwong.code@gmail.com>
pull/251/head
Wing-Kam Wong 4 years ago
parent
6e5ec622f8
commit
0e1cd6e465
1 changed files with 157 additions and 123 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 278
      packages/nc-gui/pages/user/authentication/signin.vue

278
packages/nc-gui/pages/user/authentication/signin.vue
Unescape View File

@ -1,20 +1,19 @@
<template> <template>
<v-container class="text-center" fluid> <v-container class="text-center" fluid>
<v-row align="center"> <v-row align="center">
<v-col> <v-col>
<v-row align="center"> <v-row align="center">
<v-col md="4" offset-md="4"> <v-col md="4" offset-md="4">
<v-card class="pa-10 elevation-10 mt-10" color=""> <v-card class="pa-10 elevation-10 mt-10" color="">
<div <div
style="position: absolute;top:-45px; style="
left:-moz-calc(50% - 45px); position: absolute;
left:-webkit-calc(50% - 45px); top: -45px;
left:calc(50% - 45px); left: -moz-calc(50% - 45px);
left: -webkit-calc(50% - 45px);
left: calc(50% - 45px);
border-radius: 15px; border-radius: 15px;
" "
class="primary" class="primary"
> >
<v-img <v-img
@ -24,9 +23,8 @@
:src="require('~/assets/img/icons/512x512-trans.png')" :src="require('~/assets/img/icons/512x512-trans.png')"
> >
</v-img> </v-img>
</div> </div>
<!-- SIGN IN --> <!-- SIGN IN -->
<h1 class="mt-4">{{ $t('signin.title') }}</h1> <h1 class="mt-4">{{ $t('signin.title') }}</h1>
<div> <div>
@ -35,18 +33,22 @@
</v-alert> </v-alert>
</div> </div>
<v-form
<v-form v-if=" type === 'jwt'" v-model="valid" ref="formType" lazy-validation> v-if="type === 'jwt'"
v-model="valid"
<!-- Enter your work email --> ref="formType"
lazy-validation
>
<!-- Enter your work email -->
<v-text-field <v-text-field
v-bind:label="$t('signin.input_1')" v-bind:label="$t('signin.input_1')"
v-model="form.email" v-model="form.email"
:rules="formRules.email" :rules="formRules.email"
required> required
>
</v-text-field> </v-text-field>
<!-- Enter your password --> <!-- Enter your password -->
<v-text-field <v-text-field
name="input-10-2" name="input-10-2"
v-bind:label="$t('signin.input_2')" v-bind:label="$t('signin.input_2')"
@ -55,11 +57,14 @@
@click:append="() => (e3 = !e3)" @click:append="() => (e3 = !e3)"
v-model="form.password" v-model="form.password"
:rules="formRules.password" :rules="formRules.password"
:type="e3 ? 'password' : 'text'"> :type="e3 ? 'password' : 'text'"
>
</v-text-field> </v-text-field>
<!-- Forgot your password --> <!-- Forgot your password -->
<p class="accent--text text-right caption font-weight-light"> <p class="accent--text text-right caption font-weight-light">
<router-link to="/user/password/forgot">{{ $t('signin.forget_password') }}</router-link> <router-link to="/user/password/forgot">{{
$t('signin.forget_password')
}}</router-link>
</p> </p>
<!-- <vue-recaptcha @verify="onNormalVerify" sitekey="6LfbcqMUAAAAAAb_2319UdF8m68JHSYVy_m4wPBx"--> <!-- <vue-recaptcha @verify="onNormalVerify" sitekey="6LfbcqMUAAAAAAb_2319UdF8m68JHSYVy_m4wPBx"-->
@ -71,41 +76,72 @@
<!-- <b>Sign In</b>--> <!-- <b>Sign In</b>-->
<!-- </v-btn>--> <!-- </v-btn>-->
<v-btn @click="MtdOnSignin" color="primary" large elevation-10 :disabled="false" v-ge="['Sign In','']"> <v-btn
@click="MtdOnSignin"
color="primary"
large
elevation-10
:disabled="false"
v-ge="['Sign In', '']"
>
<b>Sign In</b> <b>Sign In</b>
</v-btn> </v-btn>
<br />
<br> <br />
<br> <br />
<br> <!-- Don't have an account ? -->
<!-- Don't have an account ? --> <p class="caption font-weight-light">
<p class="caption font-weight-light"> {{ $t('signin.footer_text_1') }} {{ $t('signin.footer_text_1') }}
<!-- Sign Up --> <!-- Sign Up -->
<router-link to="/user/authentication/signup" v-ge="['Don\'t have an account ?','']"> {{ $t('signin.footer_text_2') }} <router-link
to="/user/authentication/signup"
v-ge="['Don\'t have an account ?', '']"
>
{{ $t('signin.footer_text_2') }}
</router-link> </router-link>
</p> </p>
<div> <div>
<v-btn <v-btn
v-if="googleAuthEnabled" v-if="googleAuthEnabled"
:href="_isDev ?'http://localhost:8080/auth/google':'../auth/google'" outlined large elevation-10 :href="
_isDev
? 'http://localhost:8080/auth/google'
: '../auth/google'
"
outlined
large
elevation-10
block block
color="blue"> color="blue"
<img :src="require('~/assets/img/gmail.png')" >
class="img-responsive" alt="google" <img
width="24px"> :src="require('~/assets/img/gmail.png')"
class="img-responsive"
alt="google"
width="24px"
/>
<b>&nbsp; &nbsp;Sign In with Google</b> <b>&nbsp; &nbsp;Sign In with Google</b>
</v-btn> </v-btn>
<v-btn <v-btn
v-if="githubAuthEnabled" v-if="githubAuthEnabled"
:href="_isDev ?'http://localhost:8080/auth/github':'../auth/github'" outlined large elevation-10 :href="
_isDev
? 'http://localhost:8080/auth/github'
: '../auth/github'
"
outlined
large
elevation-10
block block
color="blue"> color="blue"
<img :src="require('~/assets/img/github.png')" >
class="img-responsive" alt="github" <img
width="24px"> :src="require('~/assets/img/github.png')"
class="img-responsive"
alt="github"
width="24px"
/>
<b>&nbsp; &nbsp;Sign In with Github</b> <b>&nbsp; &nbsp;Sign In with Github</b>
</v-btn> </v-btn>
@ -120,30 +156,30 @@
<b>&nbsp; &nbsp;Sign In with Github</b> <b>&nbsp; &nbsp;Sign In with Github</b>
</v-btn>--> </v-btn>-->
</div> </div>
</v-form> </v-form>
<!-- <p class="title">--> <!-- <p class="title">-->
<!-- OR--> <!-- OR-->
<!-- </p>--> <!-- </p>-->
<v-form v-else-if=" type === 'masterKey'" v-model="formUtil.valid1" ref="formType1" @submit="MtdOnSignup" <v-form
elevation-20> v-else-if="type === 'masterKey'"
v-model="formUtil.valid1"
ref="formType1"
@submit="MtdOnSignup"
elevation-20
>
<v-text-field <v-text-field
label="Admin Secret" label="Admin Secret"
v-model="form.secret" v-model="form.secret"
:rules="formRules.secret" :rules="formRules.secret"
min="8" min="8"
:append-icon="formUtil.e4 ? 'visibility' : 'visibility_off'" :append-icon="formUtil.e4 ? 'visibility' : 'visibility_off'"
@click:append="() => (formUtil.e4 = !formUtil.e4)" @click:append="() => (formUtil.e4 = !formUtil.e4)"
:type="formUtil.e4 ? 'password' : 'text'" :type="formUtil.e4 ? 'password' : 'text'"
required> required
>
</v-text-field> </v-text-field>
<!----> <!---->
<!-- <vue-recaptcha @verify="onNormalVerify" sitekey="6LfbcqMUAAAAAAb_2319UdF8m68JHSYVy_m4wPBx"--> <!-- <vue-recaptcha @verify="onNormalVerify" sitekey="6LfbcqMUAAAAAAb_2319UdF8m68JHSYVy_m4wPBx"-->
@ -151,47 +187,42 @@
<!-- </vue-recaptcha>--> <!-- </vue-recaptcha>-->
<v-btn @click="MtdOnSignin" color="primary" class="btn--large" <v-btn
:disabled="!formUtil.recpatcha || !formUtil.valid1" v-ge="['Authenticate','']"> @click="MtdOnSignin"
color="primary"
class="btn--large"
:disabled="!formUtil.recpatcha || !formUtil.valid1"
v-ge="['Authenticate', '']"
>
Authenticate&nbsp; Authenticate&nbsp;
</v-btn> </v-btn>
</v-form> </v-form>
<template v-else> <template v-else>
<br/> <br />
<v-alert type="warning" outlined icon="mdi-alert"> <v-alert type="warning" outlined icon="mdi-alert">
<!-- <v-icon color="warning">mdi-alert</v-icon>--> <!-- <v-icon color="warning">mdi-alert</v-icon>-->
Authentication not configured in configuration Authentication not configured in configuration
</v-alert> </v-alert>
</template> </template>
</v-card> </v-card>
</v-col> </v-col>
</v-row> </v-row>
<br> <br />
</v-col> </v-col>
</v-row> </v-row>
</v-container> </v-container>
</template> </template>
<script> <script>
import Vue from 'vue';
import Vue from "vue";
// const {shell} = require("electron").remote.require( // const {shell} = require("electron").remote.require(
// "./libs" // "./libs"
// ); // );
import {mapGetters, mapActions} from 'vuex' import { mapGetters, mapActions } from 'vuex';
import {VueReCaptcha} from "vue-recaptcha-v3"; import { VueReCaptcha } from 'vue-recaptcha-v3';
// import VueRecaptcha from 'vue-recaptcha'; // import VueRecaptcha from 'vue-recaptcha';
export default { export default {
@ -202,25 +233,26 @@ export default {
data() { data() {
return { return {
form: { form: {
email: null, email: null,
password: null password: null,
}, },
formRules: { formRules: {
email: [ email: [
// E-mail is required // E-mail is required
v => !!v || this.$t('signin.form.rules.email_1'), (v) => !!v || this.$t('signin.form.rules.email_1'),
// E-mail must be valid // E-mail must be valid
v => /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) || this.$t('signin.form.rules.email_2') (v) =>
/^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(v) ||
this.$t('signin.form.rules.email_2'),
], ],
password: [ password: [
// Password is required // Password is required
v => !!v || this.$t('signin.form.rules.password_1'), (v) => !!v || this.$t('signin.form.rules.password_1'),
// You password must be atleast 8 characters // You password must be atleast 8 characters
v => (v && v.length >= 8) || this.$t('signin.form.rules.password_2') (v) =>
(v && v.length >= 8) || this.$t('signin.form.rules.password_2'),
], ],
}, },
formUtil: { formUtil: {
@ -230,14 +262,13 @@ export default {
recpatcha: true, recpatcha: true,
e3: true, e3: true,
passwordProgress: 0, passwordProgress: 0,
progressColorValue: 'red' progressColorValue: 'red',
}, },
valid: false, valid: false,
e3: true, e3: true,
recpatcha: false, recpatcha: false,
};
}
}, },
methods: { methods: {
openGoogleSiginInBrowser(e) { openGoogleSiginInBrowser(e) {
@ -254,15 +285,13 @@ export default {
}, },
PlusCounter() { PlusCounter() {
this.$store.dispatch('ActPlusCounter') this.$store.dispatch('ActPlusCounter');
}, },
async MtdOnSignin(e) { async MtdOnSignin(e) {
e.preventDefault(); e.preventDefault();
if (this.type === 'jwt') { if (this.type === 'jwt') {
if (this.$refs.formType.validate()) { if (this.$refs.formType.validate()) {
let err = null; let err = null;
//this.$nuxt.$loading.start() //this.$nuxt.$loading.start()
this.form.firstName = this.form.email; this.form.firstName = this.form.email;
@ -272,23 +301,25 @@ export default {
// await this.$recaptchaLoaded() // await this.$recaptchaLoaded()
// const recaptchaToken = await this.$recaptcha('login') // const recaptchaToken = await this.$recaptcha('login')
err = await this.$store.dispatch('users/ActSignIn', {...this.form})//, recaptchaToken}); err = await this.$store.dispatch('users/ActSignIn', { ...this.form }); //, recaptchaToken});
if (err) { if (err) {
this.formUtil.formErr = true; this.formUtil.formErr = true;
this.formUtil.formErrMsg = err.data.msg; this.formUtil.formErrMsg = err.data.msg;
return return;
} }
//this.$nuxt.$loading.finish() //this.$nuxt.$loading.finish()
} }
} else if (this.type === 'masterKey') { } else if (this.type === 'masterKey') {
const valid = await this.$store.dispatch('users/ActVerifyMasterKey', this.form.secret); const valid = await this.$store.dispatch(
'users/ActVerifyMasterKey',
this.form.secret
);
if (!valid) { if (!valid) {
this.formUtil.formErr = true; this.formUtil.formErr = true;
this.formUtil.formErrMsg = 'Invalid admin secret'; this.formUtil.formErrMsg = 'Invalid admin secret';
return return;
} }
this.$store.commit('users/MutMasterKey', this.form.secret) this.$store.commit('users/MutMasterKey', this.form.secret);
} }
if ('redirect_to' in this.$route.query) { if ('redirect_to' in this.$route.query) {
@ -303,68 +334,71 @@ export default {
this.$store.dispatch('users/ActAuthGoogle'); this.$store.dispatch('users/ActAuthGoogle');
}, },
MtdOnReset() { MtdOnReset() {
//console.log('in method reset'); //console.log('in method reset');
} },
}, },
computed: { computed: {
counter() { counter() {
return this.$store.getters['users/GtrCounter'] return this.$store.getters['users/GtrCounter'];
}, },
displayName() { displayName() {
return this.$store.getters['users/GtrUser'] return this.$store.getters['users/GtrUser'];
}, },
type() { type() {
return this.$store.state.project.projectInfo && this.$store.state.project.projectInfo.authType; return (
this.$store.state.project.projectInfo &&
this.$store.state.project.projectInfo.authType
);
}, },
googleAuthEnabled() { googleAuthEnabled() {
return this.$store.state.project.projectInfo && this.$store.state.project.projectInfo.googleAuthEnabled; return (
this.$store.state.project.projectInfo &&
this.$store.state.project.projectInfo.googleAuthEnabled
);
}, },
githubAuthEnabled() { githubAuthEnabled() {
return this.$store.state.project.projectInfo && this.$store.state.project.projectInfo.githubAuthEnabled; return (
} this.$store.state.project.projectInfo &&
}, this.$store.state.project.projectInfo.githubAuthEnabled
beforeCreated() { );
},
}, },
beforeCreated() {},
async created() { async created() {
// this.type = (await this.$store.dispatch('users/ActGetAuthType')).type; // this.type = (await this.$store.dispatch('users/ActGetAuthType')).type;
if (this.$route.query && this.$route.query.error) { if (this.$route.query && this.$route.query.error) {
this.$nextTick(() => this.$toast.error(this.$route.query.error).goAway(5000)); this.$nextTick(() =>
this.$router.replace({path: '/user/authentication/signin'}) this.$toast.error(this.$route.query.error).goAway(5000)
);
this.$router.replace({ path: '/user/authentication/signin' });
} }
}, },
mounted() { mounted() {},
}, beforeDestroy() {},
beforeDestroy() { destroy() {},
}, validate({ params }) {
destroy() { return true;
},
validate({params}) {
return true
}, },
head() { head() {
return { return {
title: this.$t('signin.head.title'), title: this.$t('signin.head.title'),
meta: [ meta: [
{hid: this.$t('signin.head.meta.hid'), name: this.$t('signin.head.meta.name'), content: this.$t('signin.head.meta.content')} {
] hid: this.$t('signin.head.meta.hid'),
} name: this.$t('signin.head.meta.name'),
content: this.$t('signin.head.meta.content'),
},
],
};
}, },
props: {}, props: {},
watch: {}, watch: {},
directives: {} directives: {},
} };
</script> </script>
<style scoped> <style scoped></style>
</style>
<!-- <!--
/** /**
* @copyright Copyright (c) 2021, Xgene Cloud Ltd * @copyright Copyright (c) 2021, Xgene Cloud Ltd

Write Preview
Loading…
Cancel
Save