|
|
|
@ -42,7 +42,7 @@ let formInline: FormState = reactive({
|
|
|
|
|
// password: "123456",
|
|
|
|
|
enterprisecode: "",
|
|
|
|
|
username: "",
|
|
|
|
|
password: ""
|
|
|
|
|
password: "",
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
let formSms: FormSms = reactive({
|
|
|
|
@ -54,38 +54,52 @@ const tab = ref(0);
|
|
|
|
|
const countTime = ref("获取验证码");
|
|
|
|
|
const rules = {
|
|
|
|
|
enterprisecode: [
|
|
|
|
|
{ required: true, message: "请输入企业编码", trigger: "blur" },
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur"],
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
} else {
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入企业编码");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
agentcode: [
|
|
|
|
|
{ required: true, message: "请输入企业编码", trigger: "blur" },
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur"],
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
} else {
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入验证码");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
phone: { required: true, message: "请输入手机号", trigger: "blur" },
|
|
|
|
|
phone: [
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入手机号");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},],
|
|
|
|
|
phonecode: [
|
|
|
|
|
{ required: true, message: "请输入验证码", trigger: "blur" },
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur"],
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (value.length < 4 && value.length > 0) {
|
|
|
|
@ -93,32 +107,49 @@ const rules = {
|
|
|
|
|
}
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
} else {
|
|
|
|
|
return new Error("验证码错误");
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入验证码");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
username: [
|
|
|
|
|
{ required: true, message: "请输入用户名", trigger: "blur" },
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur"],
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
} else {
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入账号");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
],
|
|
|
|
|
password: { required: true, message: "请输入密码", trigger: "blur" },
|
|
|
|
|
captcha: { required: true, message: "请输入验证码", trigger: "blur" },
|
|
|
|
|
password: [
|
|
|
|
|
{
|
|
|
|
|
trigger: ["blur","input","change"],
|
|
|
|
|
level: "error",
|
|
|
|
|
validator(_rule, value) {
|
|
|
|
|
if (loginSuccess.value) {
|
|
|
|
|
return true;
|
|
|
|
|
}
|
|
|
|
|
if (!value) {
|
|
|
|
|
return new Error("请输入密码");
|
|
|
|
|
}
|
|
|
|
|
return new Error(loginRejectMessge.value);
|
|
|
|
|
},
|
|
|
|
|
},],
|
|
|
|
|
captcha: [{ required: true, message: "请输入验证码", trigger: "blur" }],
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
function handleSubmit(e) {
|
|
|
|
|
e.preventDefault();
|
|
|
|
|
loginSuccess.value = true;
|
|
|
|
|
formRef.value.validate(async (errors) => {
|
|
|
|
|
if (!errors) {
|
|
|
|
|
const { username, password, enterprisecode } = formInline;
|
|
|
|
@ -163,9 +194,9 @@ function handleSubmit(e) {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
onMounted(() => {
|
|
|
|
|
let data:any = localStorage.getItem("LOGIN_FORM_SMS");
|
|
|
|
|
let data: any = localStorage.getItem("LOGIN_FORM_SMS");
|
|
|
|
|
if (data) {
|
|
|
|
|
data = JSON.parse(data) as any
|
|
|
|
|
data = JSON.parse(data) as any;
|
|
|
|
|
formSms.agentcode = data.agentcode;
|
|
|
|
|
formSms.phone = data.phone;
|
|
|
|
|
formSms.phonecode = "";
|
|
|
|
@ -175,7 +206,7 @@ onMounted(() => {
|
|
|
|
|
if (data) {
|
|
|
|
|
data = JSON.parse(data) as any;
|
|
|
|
|
formInline.username = data.username;
|
|
|
|
|
formInline.password = '';
|
|
|
|
|
formInline.password = "";
|
|
|
|
|
// formInline.password = data.password;
|
|
|
|
|
formInline.enterprisecode = data.enterprisecode;
|
|
|
|
|
autoLogin.value = true;
|
|
|
|
@ -184,6 +215,7 @@ onMounted(() => {
|
|
|
|
|
|
|
|
|
|
function handleSmsSubmit(e) {
|
|
|
|
|
e.preventDefault();
|
|
|
|
|
loginSuccess.value = true;
|
|
|
|
|
formRefSms.value.validate(async (errors) => {
|
|
|
|
|
if (!errors) {
|
|
|
|
|
const { phone, agentcode, phonecode } = formSms;
|
|
|
|
@ -346,7 +378,7 @@ function forget() {
|
|
|
|
|
</template>
|
|
|
|
|
</n-input>
|
|
|
|
|
</n-form-item>
|
|
|
|
|
<n-form-item class="form-item">
|
|
|
|
|
<!-- <n-form-item class="form-item"> -->
|
|
|
|
|
<n-button
|
|
|
|
|
:class="{ 'btn-disabled': computedForm() }"
|
|
|
|
|
class="btn"
|
|
|
|
@ -359,7 +391,7 @@ function forget() {
|
|
|
|
|
>
|
|
|
|
|
登录
|
|
|
|
|
</n-button>
|
|
|
|
|
</n-form-item>
|
|
|
|
|
<!-- </n-form-item> -->
|
|
|
|
|
<n-form-item class="default-color">
|
|
|
|
|
<div class="flex justify-between w-full">
|
|
|
|
|
<div class="flex-initial">
|
|
|
|
@ -440,7 +472,7 @@ function forget() {
|
|
|
|
|
</template>
|
|
|
|
|
</n-input>
|
|
|
|
|
</n-form-item>
|
|
|
|
|
<n-form-item class="form-item">
|
|
|
|
|
<!-- <n-form-item class="form-item"> -->
|
|
|
|
|
<n-button
|
|
|
|
|
:class="{ 'btn-disabled': computedForm() }"
|
|
|
|
|
class="btn"
|
|
|
|
@ -453,10 +485,10 @@ function forget() {
|
|
|
|
|
>
|
|
|
|
|
登录
|
|
|
|
|
</n-button>
|
|
|
|
|
</n-form-item>
|
|
|
|
|
<!-- </n-form-item> -->
|
|
|
|
|
<n-form-item class="default-color">
|
|
|
|
|
<div class="flex justify-between w-full">
|
|
|
|
|
<div class="flex-initial">
|
|
|
|
|
<div class="flex-initial save-btn">
|
|
|
|
|
<n-checkbox v-model:checked="autoLogin">
|
|
|
|
|
<span class="forgetSpan">记住账号</span>
|
|
|
|
|
</n-checkbox>
|
|
|
|
@ -474,7 +506,7 @@ function forget() {
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
.form-login {
|
|
|
|
|
width: 26.25rem;
|
|
|
|
|
height: 26.0625rem;
|
|
|
|
|
height: 28.0625rem;
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
background: linear-gradient(
|
|
|
|
|
136deg,
|
|
|
|
@ -486,7 +518,7 @@ function forget() {
|
|
|
|
|
box-shadow: 0px 6px 12px 0px rgba(0, 0, 0, 0.04);
|
|
|
|
|
backdrop-filter: blur(12px);
|
|
|
|
|
position: relative;
|
|
|
|
|
padding: 3rem 1.6875rem 0;
|
|
|
|
|
padding: 3rem 1.6875rem 2rem;
|
|
|
|
|
|
|
|
|
|
.img-close {
|
|
|
|
|
position: absolute;
|
|
|
|
@ -528,10 +560,10 @@ function forget() {
|
|
|
|
|
|
|
|
|
|
.line {
|
|
|
|
|
width: 2rem;
|
|
|
|
|
height: .25rem;
|
|
|
|
|
height: 0.25rem;
|
|
|
|
|
border-radius: 2px;
|
|
|
|
|
margin: 0 auto;
|
|
|
|
|
margin-top: .5625rem;
|
|
|
|
|
margin-top: 0.5625rem;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
@ -540,14 +572,16 @@ function forget() {
|
|
|
|
|
margin-top: 1.8125rem;
|
|
|
|
|
|
|
|
|
|
.form-item {
|
|
|
|
|
height: 3.75rem;
|
|
|
|
|
height: 4.75rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.item-input {
|
|
|
|
|
width: 22.875rem;
|
|
|
|
|
// height: 44px;
|
|
|
|
|
// height: 2.75rem;
|
|
|
|
|
background: rgba(255, 255, 255, 0.5);
|
|
|
|
|
border-radius: 4px;
|
|
|
|
|
// margin-bottom: 1rem;
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.btn {
|
|
|
|
@ -555,8 +589,8 @@ function forget() {
|
|
|
|
|
height: 2.75rem;
|
|
|
|
|
background: linear-gradient(234deg, #96aaff 0%, #1c43ff 100%);
|
|
|
|
|
border-radius: 3px;
|
|
|
|
|
margin-top: .625rem;
|
|
|
|
|
margin-bottom: .875rem;
|
|
|
|
|
// margin-top: 1rem;
|
|
|
|
|
// margin-bottom: -0.875rem;
|
|
|
|
|
|
|
|
|
|
&-disabled {
|
|
|
|
|
opacity: 0.5;
|
|
|
|
@ -571,38 +605,56 @@ function forget() {
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.order-last {
|
|
|
|
|
font-size: .875rem;
|
|
|
|
|
font-size: 1rem;
|
|
|
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
|
|
|
font-weight: Regular;
|
|
|
|
|
color: #507afd;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
.code {
|
|
|
|
|
font-size: .9375rem;
|
|
|
|
|
font-size: 0.9375rem;
|
|
|
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
|
|
|
font-weight: Regular;
|
|
|
|
|
color: #507afd;
|
|
|
|
|
margin-left: .75rem;
|
|
|
|
|
margin-left: 0.75rem;
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
|
|
|
|
&-count {
|
|
|
|
|
font-size: .875rem;
|
|
|
|
|
font-size: 0.875rem;
|
|
|
|
|
color: #999999;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
::v-deep(.n-form-item-feedback--error) {
|
|
|
|
|
// color: #FF4E4F !important;
|
|
|
|
|
color: #ff4e4f !important;
|
|
|
|
|
}
|
|
|
|
|
.forgetSpan {
|
|
|
|
|
font-size: .9375rem;
|
|
|
|
|
font-size: 0.9375rem;
|
|
|
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
|
|
|
font-weight: Regular;
|
|
|
|
|
text-align: center;
|
|
|
|
|
color: #999999;
|
|
|
|
|
line-height: 1.3125rem;
|
|
|
|
|
line-height: 1rem;
|
|
|
|
|
}
|
|
|
|
|
::v-deep(.n-base-clear>.n-base-clear__clear>.n-base-icon>svg){
|
|
|
|
|
::v-deep(.n-base-clear > .n-base-clear__clear > .n-base-icon > svg) {
|
|
|
|
|
color: #c9c9c9;
|
|
|
|
|
}
|
|
|
|
|
::v-deep(.n-input .n-input__input-el) {
|
|
|
|
|
height: 2.75rem !important;
|
|
|
|
|
font-size: 1rem !important;
|
|
|
|
|
}
|
|
|
|
|
::v-deep(.n-input .n-input-wrapper) {
|
|
|
|
|
height: 2.75rem !important;
|
|
|
|
|
}
|
|
|
|
|
.save-btn {
|
|
|
|
|
font-size: 0.9375rem;
|
|
|
|
|
}
|
|
|
|
|
::v-deep(.n-form-item .n-form-item-feedback-wrapper) {
|
|
|
|
|
height: 1rem;
|
|
|
|
|
padding: 0 !important;
|
|
|
|
|
margin: 0 !important;
|
|
|
|
|
line-height: normal !important;
|
|
|
|
|
min-height: 0 !important;
|
|
|
|
|
// margin-bottom: .5rem;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|