File size: 3,227 Bytes
3444669
b22362b
3444669
 
 
 
28f2243
3444669
 
b22362b
28f2243
 
6fa5e4b
28f2243
 
 
3444669
28f2243
 
3444669
 
28f2243
 
 
 
 
6fa5e4b
28f2243
6fa5e4b
 
 
3444669
 
28f2243
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
3444669
 
 
 
 
51dc757
3444669
 
51dc757
3444669
 
 
 
 
 
 
 
 
 
 
28f2243
 
 
 
 
 
 
 
 
 
 
 
3444669
28f2243
 
 
 
 
 
 
 
3444669
 
ebde50b
 
3444669
 
 
ebde50b
6fa5e4b
3444669
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
import { ErrorBoundary } from "./error";
import Locale from "../locales";
import ChatIcon from "../icons/chatgpt.svg"
import styles from "./findpwd.module.scss";
import { IconButton } from "./button";
import { useUserStore } from "../store";
import { useEffect, useState } from "react";


export function FindPwd(){ 
  const userStore=useUserStore() 
  const [email, setEmail] = useState("");
  const [status, setStatus] = useState("");
  const [code, setCode] = useState("");
  const [codeStatus, setcodeStatus] = useState("");
  const [getcode, setgetcode] = useState("");

  const onEmail = (text: string) => {
    setEmail(text)
  };

  const onCode = (text: string) => {
    setCode(text)
  };

  async function findpwd(){
    setStatus("false")
    await useUserStore.getState().findPwd(email,code)
    setTimeout(()=>{
      setStatus("")
    },4000)
  }

  const getMailCode=()=>{
    userStore.getRestPwdCode(email)
    getCode()
  }
  var countdown=60;
  const getCode=()=>{
      if (countdown == 0) {
          setcodeStatus("")
          setgetcode("发送验证码")
          countdown = 60;
          return;
      } else {
          setcodeStatus("true")
          setgetcode("(" + countdown + ")")
          countdown--;
      }
      setTimeout(function() {
              getCode() }
          ,1000)
  }

  useEffect(()=>{
    setcodeStatus("")
    setgetcode("发送验证码")
  },[])

  return (
    <ErrorBoundary>
      <div className="window-header">
        <div className="window-header-title">
          <div className="window-header-main-title">
            {Locale.User.Findpwd}
          </div>
          <div className="window-header-sub-title">
            {Locale.User.FindpwdTitle}
          </div>
        </div>
      </div>

      <div>
        <div className={styles.login}>
          <div><ChatIcon></ChatIcon></div>
          <div>
            <input
              type="input"
              className={styles.name}
              placeholder={Locale.User.Email}
              onInput={(e) => onEmail(e.currentTarget.value)}
              value={email}
            ></input>
          </div>
          <div className={styles.codebox}>
            <input
              type="input"
              className={styles.code}
              placeholder={Locale.User.Code}
              onInput={(e) => onCode(e.currentTarget.value)}
              value={code}
            ></input>
            <IconButton
              disabled={!!codeStatus}
              text={getcode}
              className={styles.codeButton}
              onClick={()=>{
                getMailCode()
              }}
            ></IconButton>
          </div>
          <div>
            <span className={styles.wangji}><a href="/#/login">{Locale.User.Login}</a></span>
            <span className={styles.zhuce}><a href="/#/register">{Locale.User.Register}</a></span>
          </div>
          <div>
            <IconButton
              text={Locale.User.Findpwd}
              disabled={!!status}
              className={styles.loginButton}
              onClick={()=>{
                findpwd()
              }}
            ></IconButton>
          </div>
        </div>
      </div>
    </ErrorBoundary>
  );
}