147 lines
4.2 KiB
JavaScript
147 lines
4.2 KiB
JavaScript
"use client";
|
||
|
||
import React from "react";
|
||
import { Form, Input, Toast } from "antd-mobile";
|
||
import { cryptoPassword, generateSignature } from "@/utils/crypto";
|
||
import { useRouter, useSearchParams } from "next/navigation";
|
||
import baseRequest from "@/utils/baseRequest";
|
||
|
||
export default function SetPassword() {
|
||
const router = useRouter();
|
||
const searchParams = useSearchParams();
|
||
|
||
//点击登录
|
||
const handleSubmit = async (value) => {
|
||
if (!value.password) {
|
||
Toast.show({
|
||
content: "请完善信息",
|
||
});
|
||
return;
|
||
}
|
||
if (value.password.length < 8) {
|
||
Toast.show({
|
||
content: "密码不得小于8位",
|
||
});
|
||
return;
|
||
}
|
||
if (value.password.length > 15) {
|
||
Toast.show({
|
||
content: "密码不得大于15位",
|
||
});
|
||
return;
|
||
}
|
||
if (!value.confirm_password) {
|
||
Toast.show({
|
||
content: "请再次输入您的密码",
|
||
});
|
||
return;
|
||
}
|
||
if (value.password != value.confirm_password) {
|
||
Toast.show({
|
||
content: "两次输入密码不一致",
|
||
});
|
||
return;
|
||
}
|
||
const mobile_phone = searchParams.get("mobile_phone");
|
||
const region_code = searchParams.get("region_code");
|
||
if (!mobile_phone || !region_code) {
|
||
Toast.show({
|
||
content: "设置出错，请下载app设置密码",
|
||
});
|
||
return;
|
||
}
|
||
//MD5加密密码
|
||
const encryptedPassword = cryptoPassword(value.password);
|
||
//设置密码并登录
|
||
const base = baseRequest();
|
||
const signature = generateSignature({
|
||
mobile_phone: mobile_phone,
|
||
region_code: region_code,
|
||
new_password: encryptedPassword,
|
||
...base,
|
||
});
|
||
try {
|
||
const response = await fetch(
|
||
`/api/login/set_password?signature=${signature}`,
|
||
{
|
||
method: "POST",
|
||
headers: {
|
||
"Content-Type": "application/json",
|
||
},
|
||
body: JSON.stringify({
|
||
mobile_phone: mobile_phone,
|
||
region_code: region_code,
|
||
new_password: encryptedPassword,
|
||
...base,
|
||
}),
|
||
}
|
||
);
|
||
const data = await response.json();
|
||
if (data.ret === -1) {
|
||
Toast.show({
|
||
content: data.msg,
|
||
});
|
||
router.back();
|
||
return;
|
||
}
|
||
router.back();
|
||
} catch (error) {
|
||
console.error(error);
|
||
}
|
||
};
|
||
|
||
return (
|
||
<section className="flex flex-1 flex-col">
|
||
<div className="flex flex-row justify-center mt-24">
|
||
<Form
|
||
style={{
|
||
"--border-top": "0",
|
||
"--border-bottom": "0",
|
||
"--border-inner": "0",
|
||
}}
|
||
layout="horizontal"
|
||
onFinish={handleSubmit}
|
||
>
|
||
<div className="w-96 p-4 bg-[#07050A]">
|
||
<h1 className="text-3xl font-semibold">设置密码</h1>
|
||
<p className="text-base text-secondary mb-10">请牢记密码</p>
|
||
<div className="rounded-2xl overflow-hidden border-neutral border">
|
||
<Form.Item name="password">
|
||
<div className="flex flex-row">
|
||
<p className="mr-4 text-white whitespace-nowrap">密码</p>
|
||
<Input placeholder="请输入密码" type="password" clearable />
|
||
</div>
|
||
</Form.Item>
|
||
<hr className="mx-4 border-neutral" />
|
||
<Form.Item name="confirm_password">
|
||
<div className="flex flex-row">
|
||
<p className="mr-4 text-white whitespace-nowrap">确认密码</p>
|
||
<Input
|
||
placeholder="请再次输入密码"
|
||
type="password"
|
||
clearable
|
||
/>
|
||
</div>
|
||
</Form.Item>
|
||
</div>
|
||
<div className="flex flex-col items-center mt-12">
|
||
<button
|
||
type="submit"
|
||
className="btn btn-primary w-full text-base text-white font-medium"
|
||
>
|
||
登录
|
||
</button>
|
||
<p
|
||
onClick={() => router.back()}
|
||
className="text-base inline-block text-secondary text-center font-medium mt-4"
|
||
>
|
||
跳过
|
||
</p>
|
||
</div>
|
||
</div>
|
||
</Form>
|
||
</div>
|
||
</section>
|
||
);
|
||
}
|