feat(主播、代理的提现明细页): 针对提现增加状态

src/views/Wallet/Detail/InformationDetails.vue

@@ -25,28 +25,60 @@
       <!-- 交易记录列表 -->
       <div v-else class="transaction-list">
         <div v-for="transaction in transactions" :key="transaction.id" class="transaction-item">
-          <div class="transaction-content">
+          <!-- 提现 -->
+          <div v-if="transaction.event == 'WITHDRAW'" class="transaction-content">
             <!-- 交易信息 -->
             <div class="transaction-info">
               <div style="margin-bottom: 4px; font-weight: 700">
                 {{ transaction.eventDescribe }}
               </div>
-              <!-- 用户信息 -->
+              <p style="font-size: 1em; font-weight: 500; color: rgba(0, 0, 0, 0.4)">
-              <!-- <div v-if="transaction.userNickname || transaction.account" class="user-info">
-                <span v-if="transaction.userNickname" class="user-nickname">{{
-                  transaction.userNickname
-                }}</span>
-                <span v-if="transaction.account" class="user-account"
-                  >{{ t('user_id_prefix') }}  {{ transaction.account }}</span
-                >
-              </div> -->
-              <p class="transaction-time" style="font-weight: 500; color: rgba(0, 0, 0, 0.4)">
                 {{ transaction.createTime }}
               </p>
             </div>
 
             <!-- 交易金额 -->
-            <div class="transaction-amount" style="font-weight: 500; margin: 0 8px">
+            <div
+              style="margin: 0 8px; display: flex; flex-direction: column; align-items: flex-end"
+            >
+              <div style="font-size: 1.2em; font-weight: 500; margin-bottom: 4px; direction: ltr">
+                ${{ Math.abs(transaction.amount) }}
+              </div>
+              <div
+                style="
+                  font-weight: 510;
+                  background-clip: text;
+                  -webkit-background-clip: text;
+                  -webkit-text-fill-color: transparent;
+                "
+                :style="{
+                  backgroundImage:
+                    transaction.withdrawStatus == 'Under review'
+                      ? 'linear-gradient(248deg, #FFE675 5.66%, #FFC53D 42.49%)'
+                      : transaction.withdrawStatus == 'Approved'
+                        ? 'linear-gradient(248deg, #75FF98 5.66%, #3DFF54 42.49%)'
+                        : 'linear-gradient(248deg, #FF7578 5.66%, #FF3D40 42.49%)',
+                }"
+              >
+                {{ transaction.withdrawStatus }}
+              </div>
+            </div>
+          </div>
+
+          <!-- 转账和兑换 -->
+          <div v-else class="transaction-content">
+            <!-- 交易信息 -->
+            <div class="transaction-info">
+              <div style="margin-bottom: 4px; font-weight: 700">
+                {{ transaction.eventDescribe }}
+              </div>
+              <p style="font-size: 1em; font-weight: 500; color: rgba(0, 0, 0, 0.4)">
+                {{ transaction.createTime }}
+              </p>
+            </div>
+
+            <!-- 交易金额 -->
+            <div style="font-size: 1.2em; font-weight: 500; margin: 0 8px; direction: ltr">
               {{ transaction.amount > 0 ? '+' : '-' }}{{ Math.abs(transaction.amount) }}
             </div>
           </div>