账单tag样式优化
This commit is contained in:
@@ -8,6 +8,7 @@ import httpService from "@/services/httpService";
|
|||||||
import { TransactionType, TransactionSubType } from "@/user_pages/wallet/index";
|
import { TransactionType, TransactionSubType } from "@/user_pages/wallet/index";
|
||||||
import "./index.scss";
|
import "./index.scss";
|
||||||
import img from "@/config/images";
|
import img from "@/config/images";
|
||||||
|
import { BackNavbar } from "@/components"
|
||||||
|
|
||||||
enum FreezeActions {
|
enum FreezeActions {
|
||||||
Unfreeze = "unfreeze",
|
Unfreeze = "unfreeze",
|
||||||
@@ -75,7 +76,7 @@ const BillDetail: React.FC = () => {
|
|||||||
return (
|
return (
|
||||||
<View className="bill-detail-page">
|
<View className="bill-detail-page">
|
||||||
{/* 导航栏 */}
|
{/* 导航栏 */}
|
||||||
<View className="custom-navbar">
|
{/* <View className="custom-navbar">
|
||||||
<View className="detail-navigator">
|
<View className="detail-navigator">
|
||||||
<View
|
<View
|
||||||
className="detail-navigator-back"
|
className="detail-navigator-back"
|
||||||
@@ -90,7 +91,16 @@ const BillDetail: React.FC = () => {
|
|||||||
<Text>{pageTitle}</Text>
|
<Text>{pageTitle}</Text>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
</View>
|
</View> */}
|
||||||
|
{/* 顶部导航栏 */}
|
||||||
|
<BackNavbar
|
||||||
|
title={pageTitle}
|
||||||
|
showBackButton={true}
|
||||||
|
showAvatar={false}
|
||||||
|
onBack={() => {
|
||||||
|
Taro.navigateBack();
|
||||||
|
}}
|
||||||
|
/>
|
||||||
<View className="title-text-box">
|
<View className="title-text-box">
|
||||||
<View className="title-text">现金交易 (元)</View>
|
<View className="title-text">现金交易 (元)</View>
|
||||||
<View className="amount-text">
|
<View className="amount-text">
|
||||||
|
|||||||
@@ -249,6 +249,22 @@
|
|||||||
gap: 4px;
|
gap: 4px;
|
||||||
width: 68px;
|
width: 68px;
|
||||||
|
|
||||||
|
.type_text_tag {
|
||||||
|
font-size: 8px;
|
||||||
|
font-weight: normal;
|
||||||
|
color: #ff9500;
|
||||||
|
border-radius: 999px !important;
|
||||||
|
padding: 4px;
|
||||||
|
background-color: rgba(#ff9500, 0.1);
|
||||||
|
border: solid 1px #ff9500;
|
||||||
|
|
||||||
|
&.success {
|
||||||
|
color: #000;
|
||||||
|
background-color: rgba(0, 0, 0, .1);
|
||||||
|
border-color: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.transaction_amount {
|
.transaction_amount {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
|
|||||||
@@ -16,6 +16,7 @@ interface Transaction {
|
|||||||
create_time: string;
|
create_time: string;
|
||||||
last_modify_time: string;
|
last_modify_time: string;
|
||||||
related_id: number;
|
related_id: number;
|
||||||
|
type_text: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
interface History {
|
interface History {
|
||||||
@@ -372,9 +373,14 @@ const QueryTransactions = () => {
|
|||||||
</View>
|
</View>
|
||||||
</View>
|
</View>
|
||||||
<View className="transaction_right">
|
<View className="transaction_right">
|
||||||
|
<View>
|
||||||
|
<Text className={`type_text_tag ${transaction.type_text === "已提现" ? "success" : ""}`}>
|
||||||
|
{transaction.type_text}
|
||||||
|
</Text>
|
||||||
<Text className="transaction_amount">
|
<Text className="transaction_amount">
|
||||||
{get_amount_display(transaction)}
|
{get_amount_display(transaction)}
|
||||||
</Text>
|
</Text>
|
||||||
|
</View>
|
||||||
<Text className="balance_info">
|
<Text className="balance_info">
|
||||||
余额 ¥{format_amount(transaction.amount)}
|
余额 ¥{format_amount(transaction.amount)}
|
||||||
</Text>
|
</Text>
|
||||||
|
|||||||
@@ -11,6 +11,7 @@
|
|||||||
width: 0;
|
width: 0;
|
||||||
height: 0;
|
height: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.custom-navbar {
|
.custom-navbar {
|
||||||
height: 56px;
|
height: 56px;
|
||||||
/* 通常与原生导航栏高度一致 */
|
/* 通常与原生导航栏高度一致 */
|
||||||
@@ -250,6 +251,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.transaction_list {
|
.transaction_list {
|
||||||
|
|
||||||
.loading_state,
|
.loading_state,
|
||||||
.empty_state {
|
.empty_state {
|
||||||
padding: 40px 20px;
|
padding: 40px 20px;
|
||||||
@@ -314,6 +316,12 @@
|
|||||||
padding: 4px;
|
padding: 4px;
|
||||||
background-color: rgba(#ff9500, 0.1);
|
background-color: rgba(#ff9500, 0.1);
|
||||||
border: solid 1px #ff9500;
|
border: solid 1px #ff9500;
|
||||||
|
|
||||||
|
&.success {
|
||||||
|
color: #000;
|
||||||
|
background-color: rgba(0, 0, 0, .1);
|
||||||
|
border-color: #000;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.transaction_amount {
|
.transaction_amount {
|
||||||
@@ -420,6 +428,7 @@
|
|||||||
.filter_popup {
|
.filter_popup {
|
||||||
.popup_content {
|
.popup_content {
|
||||||
padding: 16px 20px;
|
padding: 16px 20px;
|
||||||
|
|
||||||
.form_section {
|
.form_section {
|
||||||
.form_item {
|
.form_item {
|
||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
|||||||
@@ -613,7 +613,7 @@ const WalletPage: React.FC = () => {
|
|||||||
</View>
|
</View>
|
||||||
<View className="transaction_right">
|
<View className="transaction_right">
|
||||||
<View>
|
<View>
|
||||||
<Text className="type_text_tag">
|
<Text className={`type_text_tag ${transaction.type_text === "已提现" ? "success" : ""}`}>
|
||||||
{transaction.type_text}
|
{transaction.type_text}
|
||||||
</Text>
|
</Text>
|
||||||
<Text className="transaction_amount">
|
<Text className="transaction_amount">
|
||||||
|
|||||||
Reference in New Issue
Block a user