fix: icons和布局

components/RenewalPaymentPopup.vue

@@ -20,9 +20,9 @@
 					@tap="selectPaymentMethod(method.value)"
 				>
 					<view class="method-left">
-						<view v-if="method.value === 'alipay'" class="method-icon method-badge method-badge-alipay">支</view>
+						<image v-if="method.value === 'alipay'" class="method-icon" src="/static/支付宝支付.png" mode="aspectFit"></image>
 						<image v-else-if="method.value === 'wallet'" class="method-icon" src="/static/wallet.png" mode="aspectFit"></image>
-						<view v-else class="method-icon method-badge">微</view>
+						<image v-else-if="method.value === 'wechat'" class="method-icon" src="/static/微信支付.png" mode="aspectFit"></image>
 						<text class="method-name">{{ method.label }}</text>
 					</view>
 					<view class="method-radio" :class="{ checked: paymentMethod === method.value }"></view>

pages/my-wallet/my-wallet.vue

@@ -158,8 +158,8 @@
 							<view v-for="method in paymentMethodOptions" :key="method.value" class="method-item"
 								:class="{ active: rechargePaymentMethod === method.value }" @tap="selectRechargePaymentMethod(method.value)">
 								<view class="method-left">
-									<view v-if="method.value === 'alipay'" class="method-icon method-badge method-badge-alipay">支</view>
+									<image v-if="method.value === 'alipay'" class="method-icon" src="/static/支付宝支付.png" mode="aspectFit"></image>
-									<view v-else-if="method.value === 'wechat'" class="method-icon method-badge">微</view>
+									<image v-else-if="method.value === 'wechat'" class="method-icon" src="/static/微信支付.png" mode="aspectFit"></image>
 									<image v-else class="method-icon" src="/static/wallet.png" mode="aspectFit"></image>
 									<text class="method-name">{{ method.label }}</text>
 								</view>

pages/package-order/package-order.vue

@@ -62,9 +62,9 @@
 					<view v-for="method in paymentMethodOptions" :key="method.value" class="method-item"
 						:class="{ active: paymentMethod === method.value }" @tap="selectPaymentMethod(method.value)">
 						<view class="method-left">
-							<view v-if="method.value === 'alipay'" class="method-icon method-badge method-badge-alipay">支</view>
+							<image v-if="method.value === 'alipay'" class="method-icon" src="/static/支付宝支付.png" mode="aspectFit"></image>
 							<image v-else-if="method.value === 'wallet'" class="method-icon" src="/static/wallet.png" mode="aspectFit"></image>
-							<view v-else class="method-icon method-badge">微</view>
+							<image v-else-if="method.value === 'wechat'" class="method-icon" src="/static/微信支付.png" mode="aspectFit"></image>
 							<text class="method-name">{{ method.label }}<template v-if="method.value === 'wallet'">（¥{{ formatMoney(walletBalance) }}）</template></text>
 						</view>
 						<view class="method-radio" :class="{ checked: paymentMethod === method.value }"></view>
@@ -476,6 +476,9 @@
 
 <style lang="scss" scoped>
 	.container {
+		gap: 16rpx;
+		padding: 24rpx 20rpx 40rpx;
+
 		.empty-state {
 			display: flex;
 			flex-direction: column;
@@ -506,69 +509,76 @@
 		}
 
 		.package-card {
-			margin-bottom: var(--space-md);
+			margin-bottom: 0;
-			padding: 32rpx;
+			padding: 28rpx;
-			border: 1rpx solid rgba(0, 122, 255, 0.08);
+			border: 1rpx solid var(--gray-200);
-			box-shadow: 0 12rpx 36rpx rgba(15, 23, 42, 0.06);
+			border-radius: 20rpx;
+			box-shadow: 0 4rpx 16rpx rgba(15, 23, 42, 0.03);
 
 			.package-header {
 				display: flex;
 				align-items: flex-start;
 				justify-content: space-between;
-				gap: 20rpx;
+				gap: 16rpx;
-				margin-bottom: 28rpx;
+				margin-bottom: 24rpx;
 
 				.package-name {
-					font-size: 32rpx;
+					font-size: 30rpx;
-					font-weight: 700;
+					font-weight: 600;
 					color: var(--text-primary);
-					line-height: 1.35;
+					line-height: 1.4;
 					flex: 1;
 				}
+
+				.tag-apple {
+					flex-shrink: 0;
+					padding: 6rpx 12rpx;
+					background: var(--gray-100);
+					color: var(--gray-700);
+					border: none;
+				}
 			}
 
 			.package-main {
 				display: flex;
 				align-items: stretch;
 				justify-content: space-between;
-				gap: 20rpx;
+				gap: 24rpx;
-				padding: 26rpx;
+				padding: 0 0 24rpx;
 				margin-bottom: 22rpx;
-				background: linear-gradient(135deg, rgba(0, 122, 255, 0.08) 0%, rgba(0, 122, 255, 0.02) 100%);
+				border-bottom: 1rpx solid var(--gray-100);
-				border-radius: 24rpx;
 
 				.data-block {
 					flex: 1;
+					padding-right: 24rpx;
 
 					.data-label {
-						font-size: 24rpx;
+						font-size: 23rpx;
 						color: var(--text-tertiary);
-						margin-bottom: 8rpx;
+						margin-bottom: 10rpx;
 					}
 				}
 
 				.package-data {
-					font-size: 52rpx;
+					font-size: 48rpx;
-					font-weight: 800;
+					font-weight: 700;
-					color: var(--primary);
+					color: var(--text-primary);
 					line-height: 1.1;
 					letter-spacing: -1rpx;
 				}
 
 				.validity-box {
-					min-width: 132rpx;
+					min-width: 116rpx;
 					display: flex;
 					flex-direction: column;
-					align-items: center;
+					align-items: flex-start;
 					justify-content: center;
-					padding: 18rpx 16rpx;
+					padding: 0 0 0 24rpx;
-					background: rgba(255, 255, 255, 0.78);
+					border-left: 1rpx solid var(--gray-200);
-					border: 1rpx solid rgba(0, 122, 255, 0.08);
-					border-radius: 20rpx;
 
 					.validity-value {
-						font-size: 34rpx;
+						font-size: 32rpx;
-						font-weight: 800;
+						font-weight: 700;
 						color: var(--text-primary);
 						line-height: 1;
 					}
@@ -582,10 +592,10 @@
 			}
 
 			.package-desc {
-				font-size: 26rpx;
+				font-size: 24rpx;
 				color: var(--text-secondary);
-				line-height: 1.55;
+				line-height: 1.5;
-				margin-bottom: 24rpx;
+				margin-bottom: 22rpx;
 			}
 
 			.package-footer {
@@ -593,13 +603,12 @@
 				align-items: center;
 				justify-content: space-between;
 				gap: 24rpx;
-				padding-top: 24rpx;
+				padding-top: 0;
-				border-top: 1rpx solid var(--border-light);
 
 				.price-block {
 					display: flex;
 					align-items: baseline;
-					color: var(--warning);
+					color: var(--text-primary);
 					white-space: nowrap;
 
 					.price-symbol {
@@ -609,8 +618,8 @@
 					}
 
 					.package-price {
-						font-size: 44rpx;
+						font-size: 40rpx;
-						font-weight: 800;
+						font-weight: 700;
 						letter-spacing: -1rpx;
 					}
 				}