nelson.kai
/
ShowEasyFrontEnd
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

處理衝突

Dev
18300102974 2 years ago
parent
30ca5137f3
commit
8d6579a36f
2 changed files with 206 additions and 208 deletions
Split View
  1. 2
      FrontEnd/pages/service/done/_id.vue
  2. 412
      FrontEnd/pages/user/forgot.vue

2
FrontEnd/pages/service/done/_id.vue
View File

@ -101,7 +101,7 @@ export default {
bookingNo: ret.BookingNo,
service_date: ret.ServiceDateSFormat,
created_at: ret.BookingDateFormat,
currency: ret.CurrencyID,
currency: ret.CurrencyName,
};
}
}

412
FrontEnd/pages/user/forgot.vue
View File

@ -14,216 +14,216 @@
<img class="mt-11 ml-15" :src="require('@/assets/img/UserLoginMain.png')" />
</div>
<div class="md:tw-w-[414px] md:tw-mx-auto">
<div
class="tw-bg-white md:tw-rounded-[24px] md:tw-mt-[30px] md:tw-pt-[60px] md:tw-pb-[150px] md:tw-px-[30px]"
>
<div v-if="getPath == null">
<p class="tw-text-[26px] tw-font-bold tw-mb-[20px] md:tw-text-[18px]">
{{ $t("Forgot Password") }}
</p>
<p class="tw-body-3 tw-text-black tw-mb-[24px]">
{{
$t(
"Dont worry! It happens. Please enter the address associated with your account."
)
}}
</p>
<div v-if="wrongMessageActive" class="warning--text text-size-14 ps-1 mb-3">
{{ $t('The Email entered is incorrect') }}
</div>
<v-form v-model="resendValid">
<v-text-field
v-model="Email"
background-color="neutrals darken-1"
:label="this.$t('Email')"
placeholder=""
filled
rounded
dense
single-line
:rules="[rules.email, rules.require]"
></v-text-field>
</v-form>
<div class="md:tw-flex md:tw-justify-center md:tw-items-center">
<button
@click="sendForgotMail"
:disabled="!resendValid"
:class="[
'tw-block tw-w-full tw-py-[10px] tw-rounded-[16px] tw-border tw-border-solid tw-body-3 tw-font-normal tw-transition-all tw-duration-200 tw-ease-in-out',
resendValid
? 'tw-text-white tw-bg-primary-default tw-border-primary-default'
: 'tw-text-base-disable tw-bg-neutral-100 tw-border-neutral-100',
]"
>
{{ $t("Reset Password")
}}<span v-if="disableBtn">({{ this.countdown }})</span>
</button>
</div>
<div
class="tw-bg-white md:tw-rounded-[24px] md:tw-mt-[30px] md:tw-pt-[60px] md:tw-pb-[150px] md:tw-px-[30px]"
>
<div v-if="getPath == null">
<p class="tw-text-[26px] tw-font-bold tw-mb-[20px] md:tw-text-[18px]">
{{ $t("Forgot Password") }}
</p>
<p class="tw-body-3 tw-text-black tw-mb-[24px]">
{{
$t(
"Dont worry! It happens. Please enter the address associated with your account."
)
}}
</p>
<div v-if="wrongMessageActive" class="warning--text text-size-14 ps-1 mb-3">
{{ $t('The Email entered is incorrect') }}
</div>
<div v-if="getPath != null && resetSuccess == false">
<p class="title">{{ $t("Reset Password") }}</p>
<v-form v-model="resetValid">
<v-text-field
v-model="userData.Password"
background-color="neutrals darken-1"
:label="this.$t('Password') + '*'"
:type="showPass ? 'text' : 'password'"
placeholder=""
filled
rounded
dense
single-line
persistent-hint
:rules="[rules.checkPassword, rules.require]"
:hint="
this.$t(
'Passwords must be 8-20 characters with at least 1 number, 1 lower case letter and 1 upper case letter'
)
"
:append-icon="showPass ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showPass = !showPass"
></v-text-field>
<v-text-field
v-model="userConfirmPass"
background-color="neutrals darken-1"
:label="this.$t('Confirm Password') + '*'"
:type="showConfirmPass ? 'text' : 'password'"
placeholder=""
filled
rounded
dense
single-line
:rules="[rules.checkPassword, rules.require, rules.confirmPass]"
:append-icon="showConfirmPass ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showConfirmPass = !showConfirmPass"
></v-text-field>
</v-form>
<div class="md:tw-flex md:tw-justify-center md:tw-items-center">
<button
@click="resetUserPass"
:class="[
'tw-block tw-w-full tw-py-[10px] tw-rounded-[16px] tw-border tw-border-solid tw-body-3 tw-font-normal tw-transition-all tw-duration-200 tw-ease-in-out tw-text-white tw-bg-primary-default tw-border-primary-default']"
>
{{ $t("Reset Password") }}
</button>
</div>
<v-form v-model="resendValid">
<v-text-field
v-model="Email"
background-color="neutrals darken-1"
:label="this.$t('Email')"
placeholder=""
filled
rounded
dense
single-line
:rules="[rules.email, rules.require]"
></v-text-field>
</v-form>
<div class="md:tw-flex md:tw-justify-center md:tw-items-center">
<button
@click="sendForgotMail"
:class="[
'tw-block tw-w-full tw-py-[10px] tw-rounded-[16px] tw-border tw-border-solid tw-body-3 tw-font-normal tw-transition-all tw-duration-200 tw-ease-in-out',
resendValid
? 'tw-text-white tw-bg-primary-default tw-border-primary-default'
: 'tw-text-base-disable tw-bg-neutral-100 tw-border-neutral-100',
]"
>
{{ $t("Reset Password")
}}<span v-if="disableBtn">({{ this.countdown }})</span>
</button>
</div>
<div v-if="resetSuccess">
<p class="title">{{ $t("Password Reset") }}</p>
<p class="neutrals--text text--darken-5 text-size-14">
{{ $t("Congrats! Your password has been successfully reset") }}
</p>
<nuxt-link :to="localePath('/')">
<v-btn
@click="redirectHome"
width="100%"
color="primary"
class="border-radius-16 mt-4"
>
<span class="text-capitalize">{{ $t("Explore with ShowEasy") }}</span>
</v-btn>
</nuxt-link>
<v-spacer class="d-flex justify-center mt-5">
<span
class="text-size-12 primary--text"
v-html="$t('Go to ShowEasy in sec', { second: this.countdown })"
></span>
</v-spacer>
</div>
<div v-if="getPath != null && resetSuccess == false">
<p class="title">{{ $t("Reset Password") }}</p>
<v-form v-model="resetValid">
<v-text-field
v-model="userData.Password"
background-color="neutrals darken-1"
:label="this.$t('Password') + '*'"
:type="showPass ? 'text' : 'password'"
placeholder=""
filled
rounded
dense
single-line
persistent-hint
:rules="[rules.checkPassword, rules.require]"
:hint="
this.$t(
'Passwords must be 8-20 characters with at least 1 number, 1 lower case letter and 1 upper case letter'
)
"
:append-icon="showPass ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showPass = !showPass"
></v-text-field>
<v-text-field
v-model="userConfirmPass"
background-color="neutrals darken-1"
:label="this.$t('Confirm Password') + '*'"
:type="showConfirmPass ? 'text' : 'password'"
placeholder=""
filled
rounded
dense
single-line
:rules="[rules.checkPassword, rules.require, rules.confirmPass]"
:append-icon="showConfirmPass ? 'mdi-eye' : 'mdi-eye-off'"
@click:append="showConfirmPass = !showConfirmPass"
></v-text-field>
</v-form>
<div class="md:tw-flex md:tw-justify-center md:tw-items-center">
<button
@click="resetUserPass"
:class="[
'tw-block tw-w-full tw-py-[10px] tw-rounded-[16px] tw-border tw-border-solid tw-body-3 tw-font-normal tw-transition-all tw-duration-200 tw-ease-in-out tw-text-white tw-bg-primary-default tw-border-primary-default']"
>
{{ $t("Reset Password") }}
</button>
</div>
<v-dialog v-model="dialog" :width="$vuetify.breakpoint.smAndUp ? 423 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex align-center tw-justify-between tw-mb-[30px]">
<div class="tw-text-[20px] tw-font-bold tw-text-black">
{{ $t("Verify your email") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800">
{{ $t("Oops! Seems like you haven't verified your email,please click the button below to resend a verification email.")}}
</div>
</v-spacer>
<button @click="resendVerifyEmail()" class="tw-bg-primary-1 hover:tw-bg-primary-light tw-text-white tw-text-[18px] tw-rounded-[16px] tw-px-[77px] tw-py-[13px]">
{{ $t("Resend verification email") }}
</button>
<!-- <v-btn @click="resendVerifyEmail" class="primary tw-text-[18px] tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
<v-dialog v-model="deleteDialog" :width="$vuetify.breakpoint.smAndUp ? 423 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex tw-justify-between align-center tw-mb-[30px]">
<div class="tw-text-[20px] tw-text-black tw-font-bold">
{{ $t("Reactivate your account") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("Welcome back!")}}
</div>
<div class="tw-text-[16px] tw-text-neutrals-800">
{{ $t("Looks like your account has been deactivated.")}}
<br />
{{ $t("Would you like to reactivate this account?")}}
</div>
</v-spacer>
<button @click="ReactivateAccount()" class="tw-bg-primary-1 tw-text-white hover:tw-bg-primary-light tw-text-[18px] tw-rounded-[16px] tw-px-[86px] tw-py-[13px]">
{{ $t("Reactivate my account") }}
</button>
<!-- <v-btn class="primary tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
<v-dialog v-model="chackMailDialog" :width="$vuetify.breakpoint.smAndUp ? 463 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex tw-justify-between align-center tw-mb-[30px]">
<div class="tw-text-[20px] tw-text-black tw-font-bold">
{{ $t("Check your email") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("We've sent a password reset link to")}}
</div>
<div class="tw-text-[16px] tw-text-primary-1">
{{ Email }}
</div>
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("Please tap the link inside that email to continue.")}}
</div>
</v-spacer>
<button @click="colseDialog()" class="tw-bg-primary-1 tw-text-white hover:tw-bg-primary-light tw-text-[18px] tw-rounded-[16px] tw-px-[169px] tw-py-[13px]">
{{ $t("OK") }}
</button>
<!-- <v-btn class="primary tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
</div>
<div v-if="resetSuccess">
<p class="title">{{ $t("Password Reset") }}</p>
<p class="neutrals--text text--darken-5 text-size-14">
{{ $t("Congrats! Your password has been successfully reset") }}
</p>
<nuxt-link :to="localePath('/')">
<v-btn
@click="redirectHome"
width="100%"
color="primary"
class="border-radius-16 mt-4"
>
<span class="text-capitalize">{{ $t("Explore with ShowEasy") }}</span>
</v-btn>
</nuxt-link>
<v-spacer class="d-flex justify-center mt-5">
<span
class="text-size-12 primary--text"
v-html="$t('Go to ShowEasy in sec', { second: this.countdown })"
></span>
</v-spacer>
</div>
<v-dialog v-model="dialog" :width="$vuetify.breakpoint.smAndUp ? 423 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex align-center tw-justify-between tw-mb-[30px]">
<div class="tw-text-[20px] tw-font-bold tw-text-black">
{{ $t("Verify your email") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800">
{{ $t("Oops! Seems like you haven't verified your email,please click the button below to resend a verification email.")}}
</div>
</v-spacer>
<button @click="resendVerifyEmail()" class="tw-bg-primary-1 hover:tw-bg-primary-light tw-text-white tw-text-[18px] tw-rounded-[16px] tw-px-[77px] tw-py-[13px]">
{{ $t("Resend verification email") }}
</button>
<!-- <v-btn @click="resendVerifyEmail" class="primary tw-text-[18px] tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
<v-dialog v-model="deleteDialog" :width="$vuetify.breakpoint.smAndUp ? 423 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex tw-justify-between align-center tw-mb-[30px]">
<div class="tw-text-[20px] tw-text-black tw-font-bold">
{{ $t("Reactivate your account") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("Welcome back!")}}
</div>
<div class="tw-text-[16px] tw-text-neutrals-800">
{{ $t("Looks like your account has been deactivated.")}}
<br />
{{ $t("Would you like to reactivate this account?")}}
</div>
</v-spacer>
<button @click="ReactivateAccount()" class="tw-bg-primary-1 tw-text-white hover:tw-bg-primary-light tw-text-[18px] tw-rounded-[16px] tw-px-[86px] tw-py-[13px]">
{{ $t("Reactivate my account") }}
</button>
<!-- <v-btn class="primary tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
<v-dialog v-model="chackMailDialog" :width="$vuetify.breakpoint.smAndUp ? 463 : 294"
@click:outside="colseDialog()">
<v-card class="tw-p-[30px]" :height="$vuetify.breakpoint.smAndUp ? 289 : 290">
<v-spacer class="d-flex tw-justify-between align-center tw-mb-[30px]">
<div class="tw-text-[20px] tw-text-black tw-font-bold">
{{ $t("Check your email") }}
</div>
<v-btn @click="colseDialog()" icon>
<v-icon> mdi-close </v-icon>
</v-btn>
</v-spacer>
<v-spacer class="tw-mb-[40px]">
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("We've sent a password reset link to")}}
</div>
<div class="tw-text-[16px] tw-text-primary-1">
{{ Email }}
</div>
<div class="tw-text-[16px] tw-text-neutrals-800 tw-font-bold">
{{ $t("Please tap the link inside that email to continue.")}}
</div>
</v-spacer>
<button @click="colseDialog()" class="tw-bg-primary-1 tw-text-white hover:tw-bg-primary-light tw-text-[18px] tw-rounded-[16px] tw-px-[169px] tw-py-[13px]">
{{ $t("OK") }}
</button>
<!-- <v-btn class="primary tw-w-auto" rounded
:disabled="countdown > 0">
<span v-if="countdown > 0">
{{ `(${this.countdown})` }}
</span>
</v-btn> -->
</v-card>
</v-dialog>
</div>
</div>
</div>
</div>
</template>
@ -449,9 +449,7 @@ export default {
letter-spacing: 0.02em;
color: #232323;
}
</style>
<style lang="scss" scoped>
#app {
overflow-y: hidden;

Write Preview
|||||||
100:0
Loading…
Cancel
Save