修改登录输入框
This commit is contained in:
al
parent
4ad9e4f4c6
commit
a32ee6c281
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
import React, { useState, useRef, useEffect } from "react";
|
||||
import {
|
||||
Input,
|
||||
// Input,
|
||||
Button,
|
||||
Swiper,
|
||||
Tabs,
|
||||
|
|
@ -20,6 +20,7 @@ import { connect } from "react-redux";
|
|||
import { cryptoPassword } from "@/utils/crypto";
|
||||
import requireAPI from "@/utils/requireAPI";
|
||||
import { signOut, signIn, checkAuth } from "@/utils/auth";
|
||||
import OwnInput from "@/components/OwnInput";
|
||||
/*
|
||||
params格式：
|
||||
{
|
||||
|
|
@ -278,7 +279,7 @@ function Login({ handleLogin }) {
|
|||
<p className="text-base text-white mr-4">
|
||||
+{loginInfo.regionCode}
|
||||
</p>
|
||||
<Input
|
||||
{/* <Input
|
||||
clearable
|
||||
placeholder="请输入手机号"
|
||||
// disabled={true}
|
||||
|
|
@ -294,6 +295,21 @@ function Login({ handleLogin }) {
|
|||
"--font-size": "16px",
|
||||
"--placeholder-color": "#FFFFFF80",
|
||||
}}
|
||||
/> */}
|
||||
<OwnInput
|
||||
clearable={true}
|
||||
placeholder="请输入手机号"
|
||||
// disabled={true}
|
||||
name="phone_number"
|
||||
type="number"
|
||||
maxLength={11}
|
||||
onChange={(value) => {
|
||||
setLoginInfo({
|
||||
...loginInfo,
|
||||
mobilePhone: value,
|
||||
});
|
||||
}}
|
||||
value={loginInfo.mobilePhone}
|
||||
/>
|
||||
</div>
|
||||
<Divider />
|
||||
|
|
@ -301,7 +317,7 @@ function Login({ handleLogin }) {
|
|||
<p className="text-base text-white mr-4 whitespace-nowrap">
|
||||
验证码
|
||||
</p>
|
||||
<Input
|
||||
{/* <Input
|
||||
placeholder="请输入验证码"
|
||||
onChange={(value) => setVeriCode(value)}
|
||||
value={veriCode}
|
||||
|
|
@ -311,6 +327,14 @@ function Login({ handleLogin }) {
|
|||
"--placeholder-color": "#FFFFFF80",
|
||||
"--font-size": "16px",
|
||||
}}
|
||||
/> */}
|
||||
<OwnInput
|
||||
placeholder="请输入验证码"
|
||||
// disabled={true}
|
||||
name="veriCode"
|
||||
type="number"
|
||||
onChange={setVeriCode}
|
||||
value={veriCode}
|
||||
/>
|
||||
<Button
|
||||
shape="rounded"
|
||||
|
|
@ -338,7 +362,7 @@ function Login({ handleLogin }) {
|
|||
<p className="text-base text-white mr-4">
|
||||
+{loginInfo.regionCode}
|
||||
</p>
|
||||
<Input
|
||||
{/* <Input
|
||||
clearable
|
||||
placeholder="请输入手机号"
|
||||
// disabled={true}
|
||||
|
|
@ -354,6 +378,21 @@ function Login({ handleLogin }) {
|
|||
"--font-size": "16px",
|
||||
"--placeholder-color": "#FFFFFF80",
|
||||
}}
|
||||
/> */}
|
||||
<OwnInput
|
||||
clearable={true}
|
||||
placeholder="请输入手机号"
|
||||
// disabled={true}
|
||||
name="phone_number"
|
||||
type="number"
|
||||
maxLength={11}
|
||||
onChange={(value) => {
|
||||
setLoginInfo({
|
||||
...loginInfo,
|
||||
mobilePhone: value,
|
||||
});
|
||||
}}
|
||||
value={loginInfo.mobilePhone}
|
||||
/>
|
||||
</div>
|
||||
<Divider />
|
||||
|
|
@ -361,7 +400,7 @@ function Login({ handleLogin }) {
|
|||
<p className="text-base text-white mr-4 whitespace-nowrap">
|
||||
密码
|
||||
</p>
|
||||
<Input
|
||||
{/* <Input
|
||||
clearable
|
||||
placeholder="请输入密码"
|
||||
name="password"
|
||||
|
|
@ -374,6 +413,17 @@ function Login({ handleLogin }) {
|
|||
"--placeholder-color": "#FFFFFF80",
|
||||
"--font-size": "16px",
|
||||
}}
|
||||
/> */}
|
||||
<OwnInput
|
||||
clearable={true}
|
||||
placeholder="请输入密码"
|
||||
// disabled={true}
|
||||
name="password"
|
||||
type="password"
|
||||
onChange={(value) => {
|
||||
setLoginInfo({ ...loginInfo, password: value });
|
||||
}}
|
||||
value={loginInfo.password}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -405,9 +455,7 @@ function Login({ handleLogin }) {
|
|||
|
||||
const LoginBtn = ({ loginInfo, setLoginInfo, type, handleSubmit }) => {
|
||||
const router = useRouter();
|
||||
useEffect(() => {
|
||||
// console.log("loginInfo", loginInfo);
|
||||
}, []);
|
||||
useEffect(() => {}, []);
|
||||
return (
|
||||
<div className="mt-16">
|
||||
<div className="flex items-center justify-center">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
"use client";
|
||||
|
||||
import React from "react";
|
||||
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
||||
import { faClose } from "@fortawesome/free-solid-svg-icons";
|
||||
// import styles from "./index.module.scss";
|
||||
export default function OwnInput({
|
||||
value,
|
||||
onChange,
|
||||
type = "text",
|
||||
name,
|
||||
placeholder,
|
||||
clearable,
|
||||
disabled,
|
||||
}) {
|
||||
return (
|
||||
<div className="flex flex-1 relative">
|
||||
<input
|
||||
placeholder={placeholder}
|
||||
disabled={disabled}
|
||||
name={name}
|
||||
type={type}
|
||||
maxLength={11}
|
||||
onChange={(e) => onChange(e.target?.value)}
|
||||
value={value}
|
||||
className="text-[#ffffff] w-full text-[16px] placeholder:text-[#FFFFFF80]"
|
||||
/>
|
||||
{clearable && value != "" && (
|
||||
<div className="w-4 h-4 absolute right-2 top-[2px] flex justify-center items-center bg-[#ffffff33] p-1 rounded-full">
|
||||
<FontAwesomeIcon
|
||||
color="#ffffff40"
|
||||
icon={faClose}
|
||||
style={{ maxWidth: "12px" }}
|
||||
onClick={() => {
|
||||
onChange && onChange("");
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
Loading…
Reference in New Issue