医学道
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
video/src/pages/my/components/header/header.tsx

36 lines
1.5 KiB

import {Profile} from "@/store";
import {Image, Text, View} from "@tarojs/components";
import styles from "@/pages/my/my.module.scss";
import avatar from "@/static/img/avatar.png"
import blacktriang from "@/static/img/blacktriangle.png"
import {FC, useMemo} from "react";
import Img from "@/components/image/image";
interface Props {
companyList: Company[]
showCompany: () => void
}
const Header: FC<Props> = ({companyList, showCompany}) => {
const {token, user, company, empty} = Profile.useContainer()
const login = () => empty()
const showChoose = useMemo(() => (token?.length ?? 0) > 0 && companyList.length >2, [token, companyList])
return (
<View className={styles.header}>
<View className='flex'>
<Img width={100} height={100} src={user?.avatar || avatar} className={`${styles.avatar} rounded-50`} errorType='avatar' onClick={token ? undefined : login} />
<View className='flex-1 flex flex-column justify-start align-start mt-1'>
<View className='font-32' onClick={token ? undefined : login}>{token ? user?.name ?? '匿名' : '请登录'}</View>
<View className='flex align-center mt-1' onClick={token ? showCompany : login}>
<Text style={{fontSize: '24rpx', fontWeight: '500', color: '#323635'}}>{token ? company?.name : '登录解锁更多功能哦'}</Text>
{showChoose && <Image src={blacktriang} style={{width: '20rpx', height: '20rpx'}}/>}
</View>
</View>
</View>
</View>
)
}
export default Header