Refactor order components to integrate total price and discount logic

- Updated OrderCard and PlaymateRecordCard components to replace 'coins' with 'total' for price calculations.
- Introduced discount display logic in both components to indicate when the total is less than the calculated price.
- Modified relevant props and interfaces across order detail and record pages to accommodate the new 'total' property.
- Enhanced styling for discount tags to improve visibility and user experience.

app/components/order/OrderCard.vue

@@ -9,7 +9,8 @@ type OrderCardProps = {
   game: string
   coins: number
   quantity: number
-  star: number
+  total: number
+  star?: number
   avatar: string
   nickname: string
   refundApply: boolean
@@ -29,6 +30,10 @@ const handleCompleteClick = () => emit('complete', props)
 const handleReviewClick = () => emit('review', props)
 // const handleRefundClick = () => emit('refund', props)
 const handleCancelClick = () => emit('cancel', props)
+
+const isDiscount = computed(() => {
+  return props.total < props.coins * props.quantity
+})
 </script>
 
 <template>
@@ -154,8 +159,15 @@ const handleCancelClick = () => emit('cancel', props)
       >
         {{ t('order.refund.refundingTip') }}
       </p>
+      <div v-else />
 
       <div class="order-card__total">
+        <div
+          v-if="isDiscount"
+          class="order-card__discount-tag"
+        >
+          <span>{{ t('order.detail.discount') }}</span>
+        </div>
         <div class="order-card__total-label">
           <span>{{ t('order.detail.totalLabel') }}</span>
           <span
@@ -164,7 +176,7 @@ const handleCancelClick = () => emit('cancel', props)
           />
         </div>
         <p class="order-card__total-value">
-          {{ formatNumber(coins * quantity) }}
+          {{ formatNumber(total) }}
         </p>
       </div>
     </footer>
@@ -378,6 +390,24 @@ const handleCancelClick = () => emit('cancel', props)
   line-height: 18px;
 }
 
+.order-card__discount-tag {
+  height: 20px;
+  padding: 0 6px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  background-color: #ff6f32;
+  margin-right: 3px;
+
+  span {
+    color: #fff;
+    font-size: 11px;
+    font-weight: 400;
+    line-height: 14px;
+  }
+}
+
 .order-card__coin {
   display: inline-block;
   background-repeat: no-repeat;

app/components/order/PlaymateRecordCard.vue

@@ -17,6 +17,7 @@ const props = withDefaults(
     coins: number
     quantity: number
     unit: string
+    total: number
 
     avatar: string
     nickname: string
@@ -47,6 +48,10 @@ const handleAccept = () => emit('accept', props)
 const handleStartService = () => emit('startService', props)
 const handleFinishService = () => emit('finishService', props)
 const handleSubmitProof = () => emit('submitProof', props)
+
+const isDiscount = computed(() => {
+  return props.total < props.coins * props.quantity
+})
 </script>
 
 <template>
@@ -97,12 +102,18 @@ const handleSubmitProof = () => emit('submitProof', props)
 
       <div class="playmate-record-card__price">
         <div class="playmate-record-card__price-row">
+          <div
+            v-if="isDiscount"
+            class="playmate-record-card__discount-tag"
+          >
+            <span>{{ t('order.detail.discount') }}</span>
+          </div>
           <span
             class="playmate-record-card__coin"
             aria-hidden="true"
           />
           <span class="playmate-record-card__amount">
-            {{ formatNumber(coins) }}
+            {{ formatNumber(total) }}
           </span>
         </div>
         <p class="playmate-record-card__unit">
@@ -347,6 +358,24 @@ const handleSubmitProof = () => emit('submitProof', props)
   gap: 2px;
 }
 
+.playmate-record-card__discount-tag {
+  height: 18px;
+  padding: 0 5px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border-radius: 4px;
+  background-color: #ff6f32;
+  margin-right: 3px;
+
+  span {
+    color: #fff;
+    font-size: 11px;
+    font-weight: 400;
+    line-height: 14px;
+  }
+}
+
 .playmate-record-card__coin {
   display: inline-block;
   @include bg('~/assets/images/common/coin.png', contain);

app/pages/order/detail.vue

@@ -28,7 +28,7 @@ interface OrderDetail {
   orderNo: string
   time: string
   total: number
-  star: number
+  star?: number
   refundApply: boolean
   refundReason: string
   refundAttachments: FileAttachment[]

app/pages/order/index.vue

@@ -257,6 +257,7 @@ onMounted(() => {
           :game="order.bizCategoryName"
           :coins="order.price"
           :quantity="order.purchaseQty"
+          :total="order.totalAmount"
           :star="order.star"
           :refund-apply="order.refundApply"
           :order-time="formatOrderTime(order.createTime)"

app/pages/order/record.vue

@@ -221,6 +221,7 @@ onMounted(() => {
           :coins="order.price"
           :unit="order.unit"
           :quantity="order.purchaseQty"
+          :total="order.totalAmount"
           :avatar="order.avatar"
           :nickname="order.nickname"
           :gender="order.gender ?? 0"

app/types/api/skill.ts

@@ -279,9 +279,11 @@ export interface SkillOrderInfoVo {
   // 下单时间
   createTime: number
   // 评分
-  star: number
+  star?: number
   // 是否已申请退款
   refundApply: boolean
+  // 总价
+  totalAmount: number
   // 客户备注
   customerRemark?: string
   // 用户性别