钱包、下载记录添加空状态
This commit is contained in:
@@ -3,7 +3,7 @@
|
|||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding: 124px 16px;
|
padding: 60px 16px;
|
||||||
min-height: 400px;
|
min-height: 400px;
|
||||||
|
|
||||||
.empty-icon {
|
.empty-icon {
|
||||||
|
|||||||
@@ -4,14 +4,16 @@ import "./index.scss";
|
|||||||
interface EmptyStateProps {
|
interface EmptyStateProps {
|
||||||
text?: string;
|
text?: string;
|
||||||
icon?: any; // 图片资源
|
icon?: any; // 图片资源
|
||||||
|
styles?: any;
|
||||||
}
|
}
|
||||||
|
|
||||||
const EmptyState = ({
|
const EmptyState = ({
|
||||||
text = "暂无数据",
|
text = "暂无数据",
|
||||||
icon = require("@/static/message/emi.svg")
|
icon = require("@/static/message/emi.svg"),
|
||||||
|
styles,
|
||||||
}: EmptyStateProps) => {
|
}: EmptyStateProps) => {
|
||||||
return (
|
return (
|
||||||
<View className="empty-state">
|
<View className="empty-state" style={styles && {...styles}}>
|
||||||
<View className="empty-icon">
|
<View className="empty-icon">
|
||||||
<Image className="img" src={icon} />
|
<Image className="img" src={icon} />
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
@@ -5,6 +5,7 @@ import "./index.scss";
|
|||||||
import httpService from "@/services/httpService";
|
import httpService from "@/services/httpService";
|
||||||
import Taro, { useReachBottom } from "@tarojs/taro";
|
import Taro, { useReachBottom } from "@tarojs/taro";
|
||||||
import img from "@/config/images";
|
import img from "@/config/images";
|
||||||
|
import { EmptyState } from "@/components";
|
||||||
|
|
||||||
interface BillRecord {
|
interface BillRecord {
|
||||||
id: number;
|
id: number;
|
||||||
@@ -81,7 +82,7 @@ const DownloadBillRecords: React.FC = () => {
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<View className="records-container">
|
<View className="records-container">
|
||||||
{records.map((record) => (
|
{records.length ? records.map((record) => (
|
||||||
<View className="record-item" key={record.id}>
|
<View className="record-item" key={record.id}>
|
||||||
<View className="title-text">{record.file_name}</View>
|
<View className="title-text">{record.file_name}</View>
|
||||||
<View className="info-item">
|
<View className="info-item">
|
||||||
@@ -97,7 +98,7 @@ const DownloadBillRecords: React.FC = () => {
|
|||||||
<Text className="btn">查看材料</Text>
|
<Text className="btn">查看材料</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
))}
|
)) : <EmptyState text="暂无数据" />}
|
||||||
</View>
|
</View>
|
||||||
<View className="tips">
|
<View className="tips">
|
||||||
出于信息安全考虑,仅保留并展示7天内的账单下载记录
|
出于信息安全考虑,仅保留并展示7天内的账单下载记录
|
||||||
|
|||||||
@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
|
|||||||
import { View, Text, Input, Button, Image } from "@tarojs/components";
|
import { View, Text, Input, Button, Image } from "@tarojs/components";
|
||||||
import Taro, { useDidShow, useReachBottom } from "@tarojs/taro";
|
import Taro, { useDidShow, useReachBottom } from "@tarojs/taro";
|
||||||
import "./index.scss";
|
import "./index.scss";
|
||||||
import { CommonPopup } from "@/components";
|
import { CommonPopup, EmptyState } from "@/components";
|
||||||
import httpService from "@/services/httpService";
|
import httpService from "@/services/httpService";
|
||||||
import { withAuth } from "@/components";
|
import { withAuth } from "@/components";
|
||||||
import { PopupPicker } from "@/components/Picker/index";
|
import { PopupPicker } from "@/components/Picker/index";
|
||||||
@@ -603,9 +603,10 @@ const WalletPage: React.FC = () => {
|
|||||||
);
|
);
|
||||||
})
|
})
|
||||||
) : (
|
) : (
|
||||||
<View className="empty_state">
|
// <View className="empty_state">
|
||||||
<Text className="empty_text">暂无交易记录</Text>
|
// <Text className="empty_text">暂无交易记录</Text>
|
||||||
</View>
|
// </View>
|
||||||
|
<EmptyState text="钱包空空如也,组织球局赚点球费吧" styles={{padding: "unset"}} />
|
||||||
)}
|
)}
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
|
|||||||
Reference in New Issue
Block a user