small-program/src/pages/user/login/index.tsx

import UserApi from '@/apis/userApi';
import Button from '@/component/button';
import Flex from '@/component/flex';
import Label from '@/component/label';
import Layout from '@/component/layout';
import Padding, { EdgeInsets } from '@/component/padding';
import { useParams } from '@/component/routes/hooks/useParams';
import SizeBox from '@/component/sizeBox';
import UserHelper from '@/helper/userHelper';
import { IRoutesUrls } from '@/routes/route.h5';
import RouteUtil from '@/utils/routeUtil';
import { Image } from '@tarojs/components';
import { useRequest } from 'ahooks';
import { PropsWithChildren, useEffect } from 'react';
import './index.scss'

interface ILoginProps {

}

export interface ILoginParms<T = any> {
    callback?: () => Promise<any>,
    page?: IRoutesUrls,
    params?: T;
    /**回调函数是否先于路由动作之前执行 */
    callbackBeforeRoute?: number;
    pop?: number;
}

export class LoginCallback {

}

const Login = (props: PropsWithChildren<ILoginProps>) => {
    const params = useParams<ILoginParms>();
    const aggrement = useRequest(() => {
        return UserApi.agreementsUsingPost({ data: { "pageView": "register_privacy" } }).toData();
    })
    useEffect(() => {
        () => {
            UserHelper.callback = undefined;
        }
    })
    const { pop = 1 } = params;
    return (
        <Layout className='login' >
            <Flex className='login-back' >
                <Flex flex={2} />
                <Flex alignItem="center" className='login-back-logo-wrap' >
                    <Image className='login-logo' src={require("@/assets/logo.png")} />
                </Flex>
                <Flex flex={2} />
                <Padding padding={EdgeInsets.symmetric({ horizontal: 80 })} >
                    <Flex alignItem='center' rowGap={12} >
                        <Button openType="getPhoneNumber" onGetPhoneNumber={async (e) => {
                            console.log(5555,pop);
                            if (e.detail.code && await UserHelper.userWxLogin(e.detail.code) === true) {
                                if (params.callbackBeforeRoute?.toString() === "1") {
                                    if (params.page) {
                                        RouteUtil.replace(params.page, { params: params.params });
                                    }
                                    else {
                                       +pop && RouteUtil.pop();
                                    }
                                }

                                if (UserHelper.callback) {
                                    await UserHelper.callback();
                                }
                                if (params.callbackBeforeRoute?.toString() !== "1") {
                                    if (params.page) {
                                        RouteUtil.replace(params.page, { params: params.params });
                                    }
                                    else {
                                        +pop && RouteUtil.pop();
                                    }
                                }
                            }
                        }} fill >微信登录</Button>
                        <SizeBox height={16} />
                        {
                            aggrement.data &&
                            <>
                                <Label size="sm" >点击微信登录则代表阅读并同意</Label>
                                <Flex direction="row" >
                                    {
                                        aggrement.data?.map((p, index) => {
                                            return (
                                                <Label key={index}
                                                    onClick={() => {
                                                        RouteUtil.toWebViewPage({ url: p.url })
                                                    }}
                                                    className='login-aggrement' size="sm" >《{p.name}》</Label>
                                            )
                                        })
                                    }
                                </Flex>
                            </>
                        }
                    </Flex>
                </Padding>
                <Flex flex={1} />
            </Flex>
        </Layout>
    )
}

export default Login;