租聘申请界面0.9

enum/commonEnum.js

@@ -13,5 +13,6 @@ export const commonEnum = {
   TEMP3: 'https://api.ccttiot.com/image-1754987141539.png',
   LEASE_BACKGROUND: 'https://api.ccttiot.com/image-1755063111406.png',
   FIRE: 'https://api.ccttiot.com/image-1755063906561.png',
+  DOWN_ARROW: 'https://api.ccttiot.com/image-1755068355306.png',
 }
 export default commonEnum

pages/lease/lease.vue

@@ -101,7 +101,9 @@
         <view class="payment-details">
           <view class="details-header" @click="toggleDetails">
             <text class="details-title">明细</text>
-            <text :class="{ expanded: showDetails }" class="details-arrow">▼</text>
+            <view :class="{ expanded: showDetails }" class="arrow-wrapper">
+              <image :src="commonEnum.DOWN_ARROW" class="details-arrow"></image>
+            </view>
           </view>
 
           <view v-if="showDetails" class="details-content">
@@ -498,13 +500,16 @@ export default {
 
 // 支付区域
 .payment-section {
+  display: flex;
+  flex-direction: column;
+
   .pay-button {
     width: 100%;
     height: 100rpx;
     background: #f15a04;
     color: #fff;
     border: none;
-    border-radius: 50rpx;
+    border-radius: 5rpx;
     font-size: 32rpx;
     font-weight: bold;
     margin-bottom: 40rpx;
@@ -514,25 +519,31 @@ export default {
   .payment-details {
     .details-header {
       display: flex;
-      justify-content: space-between;
       align-items: center;
+      justify-content: space-between;
       padding: 20rpx 0;
       border-bottom: 2rpx solid #f0f0f0;
 
       .details-title {
         font-size: 28rpx;
-        color: #333;
+        color: #f15a04;
       }
 
-      .details-arrow {
-        font-size: 24rpx;
-        color: #999;
-        transition: transform 0.3s;
+      .arrow-wrapper {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        transition: transform 0.3s ease;
 
         &.expanded {
           transform: rotate(180deg);
         }
       }
+
+      .details-arrow {
+        width: 20rpx;
+        height: 10rpx;
+      }
     }
 
     .details-content {