|
|
@ -23,39 +23,84 @@ |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item> |
|
|
|
<a-form-item> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<Icon class="aui-icon" icon="ant-design:mobile-outlined"/> |
|
|
|
<Icon class="aui-icon" icon="ant-design:mobile-outlined" /> |
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.mobile')" v-model:value="formData.mobile" /> |
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.realName')" v-model:value="formData.realname" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
<a-form-item> |
|
|
|
|
|
|
|
<div class="aui-input-line"> |
|
|
|
|
|
|
|
<Icon class="aui-icon" icon="ant-design:mobile-outlined" /> |
|
|
|
|
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.workNo')" v-model:value="formData.workno" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
<!-- <a-form-item>--> |
|
|
|
|
|
|
|
<!-- <div class="aui-input-line">--> |
|
|
|
|
|
|
|
<!-- <!– <Icon class="aui-icon" icon="ant-design:mobile-outlined" /> –>--> |
|
|
|
|
|
|
|
<!-- <!– <a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.department')" />–>--> |
|
|
|
|
|
|
|
<!-- <JStuSelectDept v-model:value="formData.department" :multi="false" />--> |
|
|
|
|
|
|
|
<!-- </div>--> |
|
|
|
|
|
|
|
<!-- </a-form-item>--> |
|
|
|
<a-form-item> |
|
|
|
<a-form-item> |
|
|
|
|
|
|
|
<div class="aui-input-line"> |
|
|
|
|
|
|
|
<JSelectDept v-model:value="formData.department" :multi="false" type="array" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<a-form-item> |
|
|
|
|
|
|
|
<div class="aui-input-line"> |
|
|
|
|
|
|
|
<Icon class="aui-icon" icon="ant-design:mobile-outlined" /> |
|
|
|
|
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.mobile')" v-model:value="formData.mobile" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
<!-- <a-form-item> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<Icon class="aui-icon" icon="ant-design:mail-outlined"/> |
|
|
|
<Icon class="aui-icon" icon="ant-design:mail-outlined"/> |
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.smsCode')" v-model:value="formData.smscode" /> |
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.smsCode')" v-model:value="formData.smscode" /> |
|
|
|
<div v-if="showInterval" class="aui-code-line" @click="getLoginCode">{{t('component.countdown.normalText')}}</div> |
|
|
|
<div v-if="showInterval" class="aui-code-line" @click="getLoginCode">{{t('component.countdown.normalText')}}</div> |
|
|
|
<div v-else class="aui-code-line">{{t('component.countdown.sendText',[unref(timeRuning)])}}</div> |
|
|
|
<div v-else class="aui-code-line">{{t('component.countdown.sendText',[unref(timeRuning)])}}</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> --> |
|
|
|
<a-form-item> |
|
|
|
<a-form-item> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<Icon class="aui-icon" icon="ant-design:lock-outlined"/> |
|
|
|
<Icon class="aui-icon" icon="ant-design:lock-outlined" /> |
|
|
|
<a-input class="fix-auto-fill" :type="pwdIndex==='close'?'password':'text'" :placeholder="t('sys.login.password')" v-model:value="formData.password" /> |
|
|
|
<a-input |
|
|
|
|
|
|
|
class="fix-auto-fill" |
|
|
|
|
|
|
|
:type="pwdIndex === 'close' ? 'password' : 'text'" |
|
|
|
|
|
|
|
:placeholder="t('sys.login.password')" |
|
|
|
|
|
|
|
v-model:value="formData.password" |
|
|
|
|
|
|
|
/> |
|
|
|
<div class="aui-eye"> |
|
|
|
<div class="aui-eye"> |
|
|
|
<img :src="eyeKImg" alt="开启" v-if="pwdIndex==='open'" @click="pwdClick('close')" /> |
|
|
|
<img :src="eyeKImg" alt="开启" v-if="pwdIndex === 'open'" @click="pwdClick('close')" /> |
|
|
|
<img :src="eyeGImg" alt="关闭" v-else-if="pwdIndex==='close'" @click="pwdClick('open')" /> |
|
|
|
<img :src="eyeGImg" alt="关闭" v-else-if="pwdIndex === 'close'" @click="pwdClick('open')" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item> |
|
|
|
<a-form-item> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<div class="aui-input-line"> |
|
|
|
<Icon class="aui-icon" icon="ant-design:lock-outlined"/> |
|
|
|
<Icon class="aui-icon" icon="ant-design:lock-outlined" /> |
|
|
|
<a-input class="fix-auto-fill" :type="confirmPwdIndex==='close'?'password':'text'" :placeholder="t('sys.login.confirmPassword')" v-model:value="formData.confirmPassword" /> |
|
|
|
<a-input |
|
|
|
|
|
|
|
class="fix-auto-fill" |
|
|
|
|
|
|
|
:type="confirmPwdIndex === 'close' ? 'password' : 'text'" |
|
|
|
|
|
|
|
:placeholder="t('sys.login.confirmPassword')" |
|
|
|
|
|
|
|
v-model:value="formData.confirmPassword" |
|
|
|
|
|
|
|
/> |
|
|
|
<div class="aui-eye"> |
|
|
|
<div class="aui-eye"> |
|
|
|
<img :src="eyeKImg" alt="开启" v-if="confirmPwdIndex==='open'" @click="confirmPwdClick('close')" /> |
|
|
|
<img :src="eyeKImg" alt="开启" v-if="confirmPwdIndex === 'open'" @click="confirmPwdClick('close')" /> |
|
|
|
<img :src="eyeGImg" alt="关闭" v-else-if="confirmPwdIndex==='close'" @click="confirmPwdClick('open')" /> |
|
|
|
<img :src="eyeGImg" alt="关闭" v-else-if="confirmPwdIndex === 'close'" @click="confirmPwdClick('open')" /> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item> |
|
|
|
<a-form-item name="policy"> |
|
|
|
<div class="aui-inputClear"> |
|
|
|
|
|
|
|
<i class="icon icon-code"></i> |
|
|
|
|
|
|
|
<a-form-item> |
|
|
|
|
|
|
|
<a-input class="fix-auto-fill" type="text" :placeholder="t('sys.login.inputCode')" v-model:value="formData.smscode" /> |
|
|
|
|
|
|
|
</a-form-item> |
|
|
|
|
|
|
|
<div class="aui-code"> |
|
|
|
|
|
|
|
<img v-if="randCodeData.requestCodeSuccess" :src="randCodeData.randCodeImage" @click="handleChangeCheckCode" /> |
|
|
|
|
|
|
|
<img v-else style="margin-top: 2px; max-width: initial" :src="codeImg" @click="handleChangeCheckCode" /> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- <a-form-item name="policy"> |
|
|
|
<div class="aui-flex"> |
|
|
|
<div class="aui-flex"> |
|
|
|
<div class="aui-flex-box"> |
|
|
|
<div class="aui-flex-box"> |
|
|
|
<div class="aui-choice"> |
|
|
|
<div class="aui-choice"> |
|
|
@ -64,7 +109,7 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</a-form-item> |
|
|
|
</a-form-item>--> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div class="aui-formButton"> |
|
|
|
<div class="aui-formButton"> |
|
|
@ -81,23 +126,22 @@ |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<!-- 图片验证码弹窗 --> |
|
|
|
|
|
|
|
<CaptchaModal @register="captchaRegisterModal" @ok="getLoginCode" /> |
|
|
|
|
|
|
|
</template> |
|
|
|
</template> |
|
|
|
|
|
|
|
|
|
|
|
<script lang="ts" setup name="mini-register"> |
|
|
|
<script lang="ts" setup name="mini-register"> |
|
|
|
import { ref, reactive, unref, toRaw } from 'vue'; |
|
|
|
|
|
|
|
import { getCaptcha, register } from '/@/api/sys/user'; |
|
|
|
import { ref, reactive, unref, toRaw,onMounted } from 'vue'; |
|
|
|
|
|
|
|
import { getCaptcha, registerStu, getCodeInfo } from '/@/api/sys/user'; |
|
|
|
import { SmsEnum } from '/@/views/sys/login/useLogin'; |
|
|
|
import { SmsEnum } from '/@/views/sys/login/useLogin'; |
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'; |
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'; |
|
|
|
import logoImg from '/@/assets/loginmini/icon/jeecg_logo.png'; |
|
|
|
import logoImg from '/@/assets/loginmini/icon/jeecg_logo.png'; |
|
|
|
import jeecgAdTextImg from '/@/assets/loginmini/icon/jeecg_ad_text.png'; |
|
|
|
import jeecgAdTextImg from '/@/assets/loginmini/icon/jeecg_ad_text.png'; |
|
|
|
import eyeKImg from '/@/assets/loginmini/icon/icon-eye-k.png'; |
|
|
|
import eyeKImg from '/@/assets/loginmini/icon/icon-eye-k.png'; |
|
|
|
import eyeGImg from '/@/assets/loginmini/icon/icon-eye-g.png'; |
|
|
|
import eyeGImg from '/@/assets/loginmini/icon/icon-eye-g.png'; |
|
|
|
import { useI18n } from "/@/hooks/web/useI18n"; |
|
|
|
import JStuSelectDept from '/@/components/Form/src/jeecg/components/JStuSelectDept.vue'; |
|
|
|
import CaptchaModal from '@/components/jeecg/captcha/CaptchaModal.vue'; |
|
|
|
import JSelectDept from '/@/components/Form/src/jeecg/components/JSelectDept.vue'; |
|
|
|
import { useModal } from "@/components/Modal"; |
|
|
|
import { useI18n } from '/@/hooks/web/useI18n'; |
|
|
|
import { ExceptionEnum } from "@/enums/exceptionEnum"; |
|
|
|
import codeImg from '/@/assets/images/checkcode.png'; |
|
|
|
|
|
|
|
|
|
|
|
const { t } = useI18n(); |
|
|
|
const { t } = useI18n(); |
|
|
|
const { notification, createErrorModal, createMessage } = useMessage(); |
|
|
|
const { notification, createErrorModal, createMessage } = useMessage(); |
|
|
@ -105,12 +149,17 @@ |
|
|
|
const formRef = ref(); |
|
|
|
const formRef = ref(); |
|
|
|
const formData = reactive<any>({ |
|
|
|
const formData = reactive<any>({ |
|
|
|
username: '', |
|
|
|
username: '', |
|
|
|
|
|
|
|
workno: '', |
|
|
|
mobile: '', |
|
|
|
mobile: '', |
|
|
|
smscode: '', |
|
|
|
smscode: '', |
|
|
|
password: '', |
|
|
|
password: '', |
|
|
|
confirmPassword: '', |
|
|
|
confirmPassword: '', |
|
|
|
policy: false, |
|
|
|
// policy: false, |
|
|
|
|
|
|
|
realname: '', |
|
|
|
|
|
|
|
department: '', |
|
|
|
}); |
|
|
|
}); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 选择部门 |
|
|
|
//是否显示获取验证码 |
|
|
|
//是否显示获取验证码 |
|
|
|
const showInterval = ref<boolean>(true); |
|
|
|
const showInterval = ref<boolean>(true); |
|
|
|
//60s |
|
|
|
//60s |
|
|
@ -121,7 +170,6 @@ |
|
|
|
const pwdIndex = ref<string>('close'); |
|
|
|
const pwdIndex = ref<string>('close'); |
|
|
|
//确认密码眼睛打开关闭 |
|
|
|
//确认密码眼睛打开关闭 |
|
|
|
const confirmPwdIndex = ref<string>('close'); |
|
|
|
const confirmPwdIndex = ref<string>('close'); |
|
|
|
const [captchaRegisterModal, { openModal: openCaptchaModal }] = useModal(); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/** |
|
|
|
/** |
|
|
|
* 返回 |
|
|
|
* 返回 |
|
|
@ -130,7 +178,21 @@ |
|
|
|
emit('go-back'); |
|
|
|
emit('go-back'); |
|
|
|
initForm(); |
|
|
|
initForm(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// 验证码 |
|
|
|
|
|
|
|
const randCodeData = reactive<any>({ |
|
|
|
|
|
|
|
randCodeImage: '', |
|
|
|
|
|
|
|
requestCodeSuccess: false, |
|
|
|
|
|
|
|
checkKey: null, |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
function handleChangeCheckCode() { |
|
|
|
|
|
|
|
formData.inputCode = ''; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
randCodeData.checkKey = 1629428467008; |
|
|
|
|
|
|
|
getCodeInfo(randCodeData.checkKey).then((res) => { |
|
|
|
|
|
|
|
randCodeData.randCodeImage = res; |
|
|
|
|
|
|
|
randCodeData.requestCodeSuccess = true; |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
} |
|
|
|
/** |
|
|
|
/** |
|
|
|
* 获取手机验证码 |
|
|
|
* 获取手机验证码 |
|
|
|
*/ |
|
|
|
*/ |
|
|
@ -139,13 +201,7 @@ |
|
|
|
createMessage.warn(t('sys.login.mobilePlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.mobilePlaceholder')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
//update-begin---author:wangshuai---date:2024-04-18---for:【QQYUN-9005】同一个IP,1分钟超过5次短信,则提示需要验证码--- |
|
|
|
const result = await getCaptcha({ mobile: formData.mobile, smsmode: SmsEnum.REGISTER }); |
|
|
|
const result = await getCaptcha({ mobile: formData.mobile, smsmode: SmsEnum.REGISTER }).catch((res) =>{ |
|
|
|
|
|
|
|
if(res.code === ExceptionEnum.PHONE_SMS_FAIL_CODE){ |
|
|
|
|
|
|
|
openCaptchaModal(true, {}); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
}); |
|
|
|
|
|
|
|
//update-end---author:wangshuai---date:2024-04-18---for:【QQYUN-9005】同一个IP,1分钟超过5次短信,则提示需要验证码--- |
|
|
|
|
|
|
|
if (result) { |
|
|
|
if (result) { |
|
|
|
const TIME_COUNT = 60; |
|
|
|
const TIME_COUNT = 60; |
|
|
|
if (!unref(timer)) { |
|
|
|
if (!unref(timer)) { |
|
|
@ -169,18 +225,26 @@ |
|
|
|
createMessage.warn(t('sys.login.accountPlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.accountPlaceholder')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
if (!formData.mobile) { |
|
|
|
if (!formData.realname) { |
|
|
|
createMessage.warn(t('sys.login.mobilePlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.realName')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
if (!formData.smscode) { |
|
|
|
if (!formData.department) { |
|
|
|
createMessage.warn(t('sys.login.smsPlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.selectdep')); |
|
|
|
|
|
|
|
return; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
if (!formData.mobile) { |
|
|
|
|
|
|
|
createMessage.warn(t('sys.login.mobilePlaceholder')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
if (!formData.password) { |
|
|
|
if (!formData.password) { |
|
|
|
createMessage.warn(t('sys.login.passwordPlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.passwordPlaceholder')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// if (!formData.workno) { |
|
|
|
|
|
|
|
// createMessage.warn(t('sys.login.passwordPlaceholder')); |
|
|
|
|
|
|
|
// return; |
|
|
|
|
|
|
|
// } |
|
|
|
if (!formData.confirmPassword) { |
|
|
|
if (!formData.confirmPassword) { |
|
|
|
createMessage.warn(t('sys.login.confirmPassword')); |
|
|
|
createMessage.warn(t('sys.login.confirmPassword')); |
|
|
|
return; |
|
|
|
return; |
|
|
@ -189,10 +253,14 @@ |
|
|
|
createMessage.warn(t('sys.login.diffPwd')); |
|
|
|
createMessage.warn(t('sys.login.diffPwd')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
if(!formData.policy){ |
|
|
|
if (!formData.smscode) { |
|
|
|
createMessage.warn(t('sys.login.policyPlaceholder')); |
|
|
|
createMessage.warn(t('sys.login.smsPlaceholder')); |
|
|
|
return; |
|
|
|
return; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
// if (!formData.policy) { |
|
|
|
|
|
|
|
// createMessage.warn(t('sys.login.policyPlaceholder')); |
|
|
|
|
|
|
|
// return; |
|
|
|
|
|
|
|
// } |
|
|
|
registerAccount(); |
|
|
|
registerAccount(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
@ -201,12 +269,16 @@ |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
async function registerAccount() { |
|
|
|
async function registerAccount() { |
|
|
|
try { |
|
|
|
try { |
|
|
|
const resultInfo = await register( |
|
|
|
const resultInfo = await registerStu( |
|
|
|
toRaw({ |
|
|
|
toRaw({ |
|
|
|
|
|
|
|
workno: formData.workno, |
|
|
|
username: formData.username, |
|
|
|
username: formData.username, |
|
|
|
|
|
|
|
departmentid: formData.department, |
|
|
|
|
|
|
|
realname: formData.realname, |
|
|
|
password: formData.password, |
|
|
|
password: formData.password, |
|
|
|
phone: formData.mobile, |
|
|
|
phone: formData.mobile, |
|
|
|
smscode: formData.smscode, |
|
|
|
smscode: formData.smscode, |
|
|
|
|
|
|
|
checkKey: randCodeData.checkKey, |
|
|
|
}) |
|
|
|
}) |
|
|
|
); |
|
|
|
); |
|
|
|
if (resultInfo && resultInfo.data.success) { |
|
|
|
if (resultInfo && resultInfo.data.success) { |
|
|
@ -236,8 +308,8 @@ |
|
|
|
* 初始化表单 |
|
|
|
* 初始化表单 |
|
|
|
*/ |
|
|
|
*/ |
|
|
|
function initForm() { |
|
|
|
function initForm() { |
|
|
|
Object.assign(formData,{username:'',mobile: '', smscode: '', password: '', confirmPassword: '', policy: false}) |
|
|
|
Object.assign(formData, { workno: '', username: '', mobile: '', realname: '', department: '', smscode: '', password: '', confirmPassword: ''/*, policy: false*/ }); |
|
|
|
if(!unref(timer)){ |
|
|
|
if (!unref(timer)) { |
|
|
|
showInterval.value = true; |
|
|
|
showInterval.value = true; |
|
|
|
clearInterval(unref(timer)); |
|
|
|
clearInterval(unref(timer)); |
|
|
|
timer.value = null; |
|
|
|
timer.value = null; |
|
|
@ -260,15 +332,19 @@ |
|
|
|
function confirmPwdClick(value) { |
|
|
|
function confirmPwdClick(value) { |
|
|
|
confirmPwdIndex.value = value; |
|
|
|
confirmPwdIndex.value = value; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
onMounted(() => { |
|
|
|
|
|
|
|
//加载验证码 |
|
|
|
|
|
|
|
handleChangeCheckCode(); |
|
|
|
|
|
|
|
}); |
|
|
|
defineExpose({ |
|
|
|
defineExpose({ |
|
|
|
initForm |
|
|
|
initForm, |
|
|
|
}) |
|
|
|
}); |
|
|
|
</script> |
|
|
|
</script> |
|
|
|
|
|
|
|
|
|
|
|
<style lang="less" scoped> |
|
|
|
<style lang="less" scoped> |
|
|
|
@import '/@/assets/loginmini/style/home.less'; |
|
|
|
@import '/@/assets/loginmini/style/home.less'; |
|
|
|
@import '/@/assets/loginmini/style/base.less'; |
|
|
|
@import '/@/assets/loginmini/style/base.less'; |
|
|
|
.aui-input-line .aui-icon{ |
|
|
|
.aui-input-line .aui-icon { |
|
|
|
position: absolute; |
|
|
|
position: absolute; |
|
|
|
z-index: 2; |
|
|
|
z-index: 2; |
|
|
|
top: 10px; |
|
|
|
top: 10px; |
|
|
|