HyeonJun Jeon

[Add] Login test

1 +function login(id, pw) {
2 + return `I got data { id:"${id}" pw:"${pw}" }`;
3 +}
4 +
5 +export { login };
......
1 import { useState } from "react"; 1 import { useState } from "react";
2 import { useNavigate } from "react-router-dom"; 2 import { useNavigate } from "react-router-dom";
3 +import { login } from "../libs/E_Campus";
4 +
5 +import "../styles/Debug.css";
3 import { initTempSubjects } from "../utils/Test"; 6 import { initTempSubjects } from "../utils/Test";
4 7
5 const Debug = () => { 8 const Debug = () => {
6 - const [state, setState] = useState({ input: "", output: "" }); 9 + const [state, setState] = useState({
10 + type: "login",
11 + input1: "",
12 + input2: "",
13 + output: "",
14 + });
7 15
8 const handleChangeState = (e) => { 16 const handleChangeState = (e) => {
9 setState({ 17 setState({
...@@ -13,10 +21,18 @@ const Debug = () => { ...@@ -13,10 +21,18 @@ const Debug = () => {
13 }; 21 };
14 22
15 const handleSubmit = async (e) => { 23 const handleSubmit = async (e) => {
16 - if (state.input === "init") await initTempSubjects(); 24 + let result;
17 - 25 + switch (state.type) {
18 - const result = state.input; 26 + case "initSubjects":
19 - 27 + await initTempSubjects();
28 + result = "inited";
29 + break;
30 + case "login":
31 + result = login(state.input1, state.input2);
32 + break;
33 + default:
34 + }
35 + console.log(result);
20 setState({ ...state, output: result }); 36 setState({ ...state, output: result });
21 }; 37 };
22 38
...@@ -33,10 +49,28 @@ const Debug = () => { ...@@ -33,10 +49,28 @@ const Debug = () => {
33 Home 49 Home
34 </button> 50 </button>
35 </div> 51 </div>
52 + <div className="dd">
53 + <div>
54 + <span>type : </span>
55 + <select name="type" value={state.type} onChange={handleChangeState}>
56 + <option value={"initSubjects"}>initSubjects</option>
57 + <option value={"login"}>login</option>
58 + </select>
59 + </div>
36 60
37 - <input value={state.input} onChange={handleChangeState} name="input" /> 61 + <input
38 - <button onClick={handleSubmit}>Enter</button> 62 + value={state.input1}
39 - <div>{"result : " + state.output}</div> 63 + onChange={handleChangeState}
64 + name="input1"
65 + />
66 + <input
67 + value={state.input2}
68 + onChange={handleChangeState}
69 + name="input2"
70 + />
71 + <button onClick={handleSubmit}>Enter</button>
72 + <div>{"result : \n" + state.output}</div>
73 + </div>
40 </div> 74 </div>
41 ); 75 );
42 }; 76 };
......
1 +.dd {
2 + display: flex;
3 + flex-direction: column;
4 + width: 300px;
5 + margin: 10px 0 10px 0;
6 +}
7 +
8 +.dd > div,
9 +.dd > span {
10 + margin: 5px 0 5px 0;
11 +}