Commit 85a73ad8 authored by 罗超's avatar 罗超

完成密碼找回頁面

parent ae9217f9
...@@ -27,23 +27,24 @@ ...@@ -27,23 +27,24 @@
"quasar-tiptap-branch": "^1.8.1", "quasar-tiptap-branch": "^1.8.1",
"vue": "^3.0.0", "vue": "^3.0.0",
"vue-i18n": "^9.0.0", "vue-i18n": "^9.0.0",
"vue-inline-svg": "^2.1.1", "vue-inline-svg": "next",
"vue-router": "^4.0.0", "vue-router": "^4.0.0",
"vuex": "^4.0.1", "vuex": "^4.0.1",
"vuex-persistedstate": "^4.1.0" "vuex-persistedstate": "^4.1.0"
}, },
"devDependencies": { "devDependencies": {
"@intlify/vite-plugin-vue-i18n": "^3.3.1",
"@quasar/app-vite": "^1.0.0",
"@types/node": "^12.20.21",
"@typescript-eslint/eslint-plugin": "^5.10.0", "@typescript-eslint/eslint-plugin": "^5.10.0",
"@typescript-eslint/parser": "^5.10.0", "@typescript-eslint/parser": "^5.10.0",
"autoprefixer": "^10.4.2",
"eslint": "^8.10.0", "eslint": "^8.10.0",
"eslint-plugin-vue": "^9.0.0",
"eslint-config-prettier": "^8.1.0", "eslint-config-prettier": "^8.1.0",
"eslint-plugin-vue": "^9.0.0",
"prettier": "^2.5.1", "prettier": "^2.5.1",
"@types/node": "^12.20.21", "typescript": "^4.5.4",
"@intlify/vite-plugin-vue-i18n": "^3.3.1", "vite-plugin-svg-icons": "^2.0.1"
"@quasar/app-vite": "^1.0.0",
"autoprefixer": "^10.4.2",
"typescript": "^4.5.4"
}, },
"browserslist": [ "browserslist": [
"last 10 Chrome versions", "last 10 Chrome versions",
......
import Axios, { AxiosResponse, AxiosRequestConfig, AxiosError } from 'axios' import Axios, { AxiosResponse, AxiosRequestConfig, AxiosError } from 'axios'
import router from '../router/index' import router from '../router/index'
import message from '../utils/message'
import { i18n } from '../boot/i18n'
// import { message } from 'ant-design-vue' // import { message } from 'ant-design-vue'
import Store from '../store' // import Store from '../store'
import { Notify } from 'quasar' // import { Notify } from 'quasar'
let {t} =i18n.global
/** /**
* get status code * get status code
...@@ -109,6 +113,7 @@ service.interceptors.request.use( ...@@ -109,6 +113,7 @@ service.interceptors.request.use(
* @returns {} * @returns {}
*/ */
service.interceptors.response.use( service.interceptors.response.use(
/** 请求有响应 */ /** 请求有响应 */
async (response: AxiosResponse) => { async (response: AxiosResponse) => {
if (response.status === 200) { if (response.status === 200) {
...@@ -131,19 +136,20 @@ service.interceptors.response.use( ...@@ -131,19 +136,20 @@ service.interceptors.response.use(
} }
// timeout // timeout
if (__emsg.indexOf('timeout') >= 0) { if (__emsg.indexOf('timeout') >= 0) {
__emsg = 'timeout' __emsg = t('timeout')
} }
//TODO: 结合接口实际情况进行权限判断 //TODO: 结合接口实际情况进行权限判断
if (error?.response?.status === 401) { if (error?.response?.status === 401) {
if (router.currentRoute.value.path !== '/entry/login') { if (router.currentRoute.value.path !== '/auth/login') {
Notify.create({ // Notify.create({
message: '登录凭证已过期,请重新登录', // message: '登录凭证已过期,请重新登录',
color: 'warning', // color: 'warning',
textColor: 'dark', // textColor: 'dark',
icon: 'announcement' // icon: 'announcement'
}) // })
router.push('/entry/login') message.errorMsg(t('loginout'));
router.push('/auth/login')
} }
return Promise.reject(new Error('401')) return Promise.reject(new Error('401'))
} }
......
...@@ -176,6 +176,10 @@ class UserService { ...@@ -176,6 +176,10 @@ class UserService {
console.log(params) console.log(params)
return request("b2b_post_Login",params); return request("b2b_post_Login",params);
} }
static sendVerify(data:any):Promise<HttpResponse>{
return request("b2b_post_send_verify",data);
}
} }
export default UserService export default UserService
<template> <template>
<span> <inline-svg :class="svgColor" :src="svgIcon" :width="svgSize" :height="svgSize" :title="tips" :aria-label="tips"></inline-svg>
<inline-svg :class="[`${color}`]" :src="svgIcon" :width="svgSize" :height="svgSize" :fill="svgColor" :stroke="svgColor" :title="tips" :aria-label="tips"></inline-svg>
</span>
</template> </template>
<script> <script lang="ts">
import { computed } from 'vue' import { computed } from 'vue'
import inlineSvg from 'vue-inline-svg' import InlineSvg from 'vue-inline-svg';
export default { export default {
props: { props: {
/** /**
...@@ -30,7 +28,7 @@ export default { ...@@ -30,7 +28,7 @@ export default {
tips: String tips: String
}, },
components: { components: {
inlineSvg InlineSvg
}, },
setup(props) { setup(props) {
const svgSize = computed(() => { const svgSize = computed(() => {
...@@ -38,23 +36,33 @@ export default { ...@@ -38,23 +36,33 @@ export default {
}) })
const svgColor = computed(() => { const svgColor = computed(() => {
let tempColor = props.color ?? 'var(--q-dark)' let tempColor = props.color ?? 'primary'
return tempColor.indexOf('#') != 0 ? `var(--q-${tempColor})` : tempColor return `svg-icon-${tempColor}`
}) })
const svgIcon = computed(() => { const svgIcon = computed(() => {
return new URL(`../../assets/svg/${props.icon}`,import.meta.url).href return new URL(`../../assets/svg/${props.icon}`,import.meta.url).href
}) })
console.log(svgIcon.value)
return { svgSize, svgColor,svgIcon } return { svgSize, svgColor,svgIcon }
} }
} }
</script> </script>
<style> <style>
.svg-icon.svg-icon-primary g [fill] { svg g [fill]{
fill: #3699FF !important;
}
/* .svg-icon g path[fill] {
fill: inherit !important;
} */
.svg-icon-primary g [fill] {
transition: fill 0.3s ease; transition: fill 0.3s ease;
fill: var(--q-color-primary) !important; fill: #3699FF !important;
}
.svg-icon-success g [fill] {
transition: fill 0.3s ease;
fill: #50cd89 !important;
} }
.svg-icon.svg-icon-secondary g [fill] { .svg-icon.svg-icon-secondary g [fill] {
transition: fill 0.3s ease; transition: fill 0.3s ease;
......
...@@ -39,7 +39,7 @@ ...@@ -39,7 +39,7 @@
.Poppins .Poppins
font-family: 'Poppins' font-family: 'Poppins'
body body
font-family: 'Roboto', 'Arial','微軟正黑體修正', '微軟正黑體', "Microsoft JhengHei", 'sans-serif','pf' font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji,MicrosoftJhengHeiBoldFix,"\5FAE\8EDF\6B63\9ED1\9AD4",Microsoft JhengHei
color: var(--q-dark) color: var(--q-dark)
.no-underline .no-underline
text-decoration: none !important text-decoration: none !important
......
...@@ -6,6 +6,8 @@ export default { ...@@ -6,6 +6,8 @@ export default {
success: '執行成功', success: '執行成功',
appsuffix: "JVS同業預定系統", appsuffix: "JVS同業預定系統",
lanuage:"系統語言", lanuage:"系統語言",
loginout:'登錄信息失效,請重新登錄',
timeout:'當前網絡環境異常,請求超時',
login:{ login:{
notaccess:"沒有同業會員帳戶?", notaccess:"沒有同業會員帳戶?",
registlink:"申請註冊", registlink:"申請註冊",
...@@ -27,6 +29,10 @@ export default { ...@@ -27,6 +29,10 @@ export default {
notaccess:"已經是會員了?", notaccess:"已經是會員了?",
registlink:"登錄", registlink:"登錄",
account:"帳戶(EMail)", account:"帳戶(EMail)",
submit:"提交" submit:"提交",
cancel:"取消",
goback:"返回",
mailResult:"郵件已發送到您的郵箱,請根據郵件提示修改密碼",
resultBtn:"我已知曉"
} }
} }
...@@ -3,13 +3,13 @@ ...@@ -3,13 +3,13 @@
<div class="col q-pa-xl fit row justify-center height"> <div class="col q-pa-xl fit row justify-center height">
<div style="width:450px;" class="column justify-between content-between"> <div style="width:450px;" class="column justify-between content-between">
<div :class="{'row':$q.platform.is.desktop,'column':$q.platform.is.mobile}"> <div class="row items-center">
<div class="col" :class="{'text-center q-mb-md':$q.platform.is.mobile}"> <div class="col">
<q-btn round flat> <q-btn round flat size="md" @click="goback">
<svg-icon icon="Navigation/Arrow-left.svg" :size="24"></svg-icon> <svg-icon icon="Navigation/Arrow-left.svg" :size="24" tips="$t('forget.goback')"></svg-icon>
</q-btn> </q-btn>
</div> </div>
<div class="text-grey-6 text-weight-bold col" :class="{'text-right':$q.platform.is.desktop,'text-center':$q.platform.is.mobile}"> <div class="text-grey-6 text-weight-bold text-right" >
<span>{{$t("forget.notaccess")}}</span> <span>{{$t("forget.notaccess")}}</span>
<router-link :to="{ path: '/auth/regist' }" class="text-primary pfb text-subtitle">{{$t("forget.registlink")}}</router-link> <router-link :to="{ path: '/auth/regist' }" class="text-primary pfb text-subtitle">{{$t("forget.registlink")}}</router-link>
</div> </div>
...@@ -56,28 +56,46 @@ ...@@ -56,28 +56,46 @@
</div> </div>
<div class="col right-bg full-height mobile-hide"></div> <div class="col right-bg full-height mobile-hide"></div>
</div> </div>
<q-dialog no-esc-dismiss persistent v-model="successModel">
<q-card :class="{'q-pa-xl':$q.platform.is.desktop,'q-pa-lg':$q.platform.is.mobile}">
<q-card-section>
<div class="text-center q-mb-md">
<svg-icon icon="Code/Done-circle.svg" color="success" :size="80"></svg-icon>
</div>
<div>{{$t('forget.mailResult')}}</div>
<div class="text-center q-mt-xl">
<q-btn color="primary" @click="goback" unelevated :label="$t('forget.resultBtn')" />
</div>
</q-card-section>
</q-card>
</q-dialog>
</template> </template>
<script lang="ts"> <script lang="ts">
import { defineComponent, reactive } from 'vue' import { defineComponent, reactive, ref, toRefs } from 'vue'
import useMetaModule from '../../module/meta/metaModule' import useMetaModule from '../../module/meta/metaModule'
import { useI18n } from 'vue-i18n' import { useI18n } from 'vue-i18n'
import { getLangs } from "../../utils/tools"; import { getLangs } from "../../utils/tools";
import { SitLang } from '@/@types'; import { SitLang } from '../../@types';
import svgIcon from '../../components/global/svg-icon.vue'; import svgIcon from '../../components/global/svg-icon.vue';
import UserService from '../../api/user';
import message from '../../utils/message';
import { ApiResult } from '../../@types/enumHelper';
export default defineComponent({ export default defineComponent({
components: { svgIcon }, components: { svgIcon },
setup() { setup() {
let { setTitle } = useMetaModule() let { setTitle } = useMetaModule()
const dtNow = new Date().getFullYear() const accountRef = ref(null)
const {locale,t } = useI18n(); const {locale,t } = useI18n();
setTitle(t("login.pageTitle")) setTitle(t("forget.pageTitle"))
const data=reactive({ const data=reactive({
currentLang: {} as SitLang, currentLang: {} as SitLang,
langs:[] as SitLang[], langs:[] as SitLang[],
account:'', account:'',
loading:false loading:false,
successModel:false
}) })
data.langs=getLangs() data.langs=getLangs()
if(data.langs && data.langs.length>0){ if(data.langs && data.langs.length>0){
...@@ -86,11 +104,33 @@ export default defineComponent({ ...@@ -86,11 +104,33 @@ export default defineComponent({
let methods = { let methods = {
sendVerifyCode(){ sendVerifyCode(){
const accountRefVal=accountRef as any
console.log(accountRef.value)
accountRefVal.value.validate()
if(!accountRefVal.value.hasError){
data.loading=true
//hasError
UserService.sendVerify({account:data.account,platform:0}).then(r=>{
console.log(r)
data.loading=false
if(r.data.resultCode==ApiResult.SUCCESS){
data.successModel=true
}else{
message.errorMsg(r.data.message)
}
}).catch(e=>{
data.loading=false
message.errorMsg(e.message)
})
}
},
goback(){
window.history.go(-1)
} }
} }
return { ...data, ...methods } return { ...toRefs(data), ...methods,accountRef }
} }
}) })
</script> </script>
......
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment