日期范围选择器、账单筛选

This commit is contained in:
2025-09-26 00:01:27 +08:00
parent 19a51fc679
commit 9ba0b8eb8a
4 changed files with 205 additions and 53 deletions

View File

@@ -4,26 +4,26 @@
min-height: 100vh;
background-color: #f5f5f5;
padding: 5px;
.wallet_main_card {
background: #000;
border-radius: 20px;
padding: 12px 20px 32px;
margin-bottom: 8px;
color: #fff;
.card_header {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 32px;
.header_title {
font-size: 12px;
font-weight: 400;
line-height: 1.5;
}
.modify_password {
font-size: 12px;
font-weight: 400;
@@ -31,37 +31,37 @@
line-height: 1.5;
}
}
.balance_display {
.amount_section {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
.amount_container {
display: flex;
align-items: flex-end;
gap: 8px;
.currency_symbol {
font-family: 'DingTalk JinBuTi', sans-serif;
font-size: 32px;
font-weight: 400;
line-height: 0.8;
}
.amount_group {
display: flex;
align-items: flex-end;
.main_amount {
font-family: 'DingTalk JinBuTi', sans-serif;
font-size: 32px;
font-weight: 400;
line-height: 0.75;
}
.decimal_amount {
font-family: 'DingTalk JinBuTi', sans-serif;
font-size: 32px;
@@ -70,7 +70,7 @@
}
}
}
.withdraw_btn {
background: #fff;
border: none;
@@ -86,7 +86,7 @@
align-items: center;
}
}
.available_amount {
font-size: 12px;
font-weight: 400;
@@ -95,13 +95,13 @@
}
}
}
.function_buttons {
display: flex;
align-items: center;
gap: 8px;
margin-bottom: 8px;
.function_item {
background: white;
border: 0.5px solid #EBEBEB;
@@ -114,19 +114,19 @@
box-shadow: 0px 4px 36px 0px rgba(0, 0, 0, 0.05);
height: 24px;
flex: 1;
.function_icon {
width: 16px;
height: 16px;
display: flex;
align-items: center;
justify-content: center;
.icon_text {
font-size: 8px;
}
}
.function_text {
font-size: 12px;
font-weight: 600;
@@ -134,7 +134,7 @@
line-height: 1.33;
white-space: nowrap;
}
&:active {
background: #f8f8f8;
}
@@ -169,7 +169,8 @@
position: relative;
padding-right: 16px;
&::before, &::after {
&::before,
&::after {
content: '';
display: block;
width: 2px;
@@ -195,6 +196,7 @@
}
.transaction_list {
.loading_state,
.empty_state {
padding: 40px 20px;
@@ -277,21 +279,21 @@
.popup_content {
padding: 12px;
overflow: hidden;
.form_section {
.form_item {
margin-bottom: 12px;
.form_label {
font-size: 12px;
color: #333;
margin-bottom: 6px;
font-weight: 500;
}
.input_wrapper {
position: relative;
.amount_input {
box-sizing: border-box;
width: 100%;
@@ -301,17 +303,17 @@
padding: 0 10px;
font-size: 14px;
color: #333;
&:focus {
border-color: #667eea;
box-shadow: none;
}
&::placeholder {
color: #bbb;
}
}
.currency_symbol {
position: absolute;
left: 10px;
@@ -321,24 +323,24 @@
color: #999;
pointer-events: none;
}
.amount_input.with_symbol {
padding-left: 28px;
}
}
.balance_tip {
font-size: 10px;
color: #999;
margin-top: 4px;
}
.withdraw_desc {
padding: 8px;
background: #f8f9fa;
border-radius: 4px;
border: 1px solid #e9ecef;
.desc_text {
font-size: 10px;
color: #666;
@@ -349,3 +351,40 @@
}
}
}
// 过滤弹窗
.filter_popup {
padding: 20px;
.popup_content {
.form_section {
.form_item {
margin-bottom: 20px;
.form_label {
display: inline-block;
font-family: PingFang SC;
font-weight: 600;
font-style: Semibold;
font-size: 16px;
margin-bottom: 20px;
}
.options_wrapper {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 8px;
.option_item {
background-color: #0000000D;
text-align: center;
padding: 8px;
border-radius: 4px;
&.active {
background-color: #000000;
color: #fff;
}
}
}
}
}
}
}