taro/src/_health/components/no_data.tsx

import { View, Text } from "@tarojs/components";
import './no_data.scss'
import { useTranslation } from "react-i18next";
import NewButton, { NewButtonType } from "../base/new_button";
import { rpxToPx } from "@/utils/tools";
import { MainColorType } from "@/context/themes/color";
import { IconError } from "@/components/basic/Icons";
export default function NoData(props: { refresh: Function }) {
    const { t } = useTranslation()
    return <View className="no_data_bg" style={{marginTop:rpxToPx(256)}}>
        <View style={{
            backgroundColor:MainColorType.g04,
            width:rpxToPx(108),
            height:rpxToPx(108),
            borderRadius:rpxToPx(54),
            display:'flex',
            alignItems:'center',
            justifyContent:'center'
        }}>
            <IconError width={rpxToPx(88)} color="#fff"/>
        </View>
        <Text className="h50 g01 bold" style={{marginBottom:rpxToPx(92),marginTop:rpxToPx(24)}}>{t('feature.common.no_data.title')}</Text>
        {/* <View className="h30 g01" style={{marginBottom:rpxToPx(92),marginTop:rpxToPx(12)}}>check your network connection and try again</View> */}
        <NewButton
            onClick={props.refresh}
            type={NewButtonType.alpha}
            color={MainColorType.blue}
            width={rpxToPx(240)}
            height={rpxToPx(96)}
            title={t('feature.common.no_data.retry_btn')}
        />
    </View>
}