登录样式

main
king 1 year ago
parent c3b564fb77
commit 5b8d492e31
  1. 4
      src/pages/login/login.module.scss
  2. 32
      src/pages/login/login.tsx

@ -1,5 +1,6 @@
.container {
position: relative;
padding: 0 30rpx;
}
.navbar,
@ -39,8 +40,7 @@
justify-content: center;
align-items: center;
gap: 12px;
margin: 0 auto;
padding: 25px 0;
margin: 20rpx auto;
a {

@ -1,6 +1,6 @@
import {FC, useEffect, useRef, useState} from "react";
import {Profile} from "@/store";
import {Button, Form, Image, Input, Text, View} from "@tarojs/components";
import {Form, Image, Input, Text, View} from "@tarojs/components";
import Taro from "@tarojs/taro";
import styles from './login.module.scss'
import Loading from "@/components/loading";
@ -9,6 +9,7 @@ import {LoginData, userApi} from "@/api";
import {regexTel} from "@/utils/regu";
import CustomPageContainer from "@/components/custom-page-container/custom-page-container";
import {loginApi, LoginParams} from "@/api/login";
import MyButton from "@/components/button/MyButton";
interface BingProps {
code: string
@ -74,24 +75,23 @@ const Bing: FC<BingProps> = ({code, catch_key}: BingProps) => {
</View>
</View>
<Button className={'button ' + styles.submit} style='margin:30px auto' formType='submit'
disabled={loading}></Button>
<MyButton className={styles.submit} formType='submit' disabled={loading}></MyButton>
</Form>
</View>
)
}
function getMenuButtonBoundingClientRect() {
if (process.env.TARO_ENV === 'h5') {
return {top: 0, bottom: 44}
}
return Taro.getMenuButtonBoundingClientRect()
}
// function getMenuButtonBoundingClientRect() {
// if (process.env.TARO_ENV === 'h5') {
// return {top: 0, bottom: 44}
// }
// return Taro.getMenuButtonBoundingClientRect()
// }
const Login: FC = () => {
const {statusBarHeight = 0} = Taro.getSystemInfoSync()
const bbc = getMenuButtonBoundingClientRect();
const navHeight = bbc.bottom + (bbc.top - statusBarHeight) - statusBarHeight
// const {statusBarHeight = 0} = Taro.getSystemInfoSync()
// const bbc = getMenuButtonBoundingClientRect();
// const navHeight = bbc.bottom + (bbc.top - statusBarHeight) - statusBarHeight
const [isLoading, setLoading] = useState(false)
const [error, setError] = useState<string | null>(null)
@ -187,9 +187,10 @@ const Login: FC = () => {
<View className={styles.loginTips}>
<Text>使</Text>
</View>
<Button className={'button ' + styles.submit} onClick={login} disabled={isLoading}>
<MyButton onClick={login} disabled={isLoading}>
<View className={styles.submit}>
{isLoading ? <Loading/> : null}
<View className={styles.navbar} style={`height:${navHeight}px;margin-top:${statusBarHeight}px`}>
<View className={styles.navbar}>
<Text></Text>
{error ? <View className={styles.errorTips}>
<View style={{flex: 1}}>{error}</View>
@ -198,7 +199,8 @@ const Login: FC = () => {
</View>
</View> : null}
</View>
</Button>
</View>
</MyButton>
</View>
)
}

Loading…
Cancel
Save