更新：我的订单兼容多种商品订单（电子书、课程、vip）显示

components/order/GoodsSelector.vue

@@ -9,7 +9,7 @@
         <image :src="goods[selectedIndex].productImages" mode="aspectFit" class="goods-cover" />
         <view class="info">
           <text class="name">{{ goods[selectedIndex].productName }}</text>
-          <text v-if="selectedGoodsPrice" class="price">NZ$ {{ selectedGoodsPrice }}</text>
+          <text v-if="selectedGoodsPrice" class="price">{{ selectedGoodsPrice }} 天医币</text>
         </view>
       </view>
       
@@ -30,21 +30,21 @@
             
             <!-- VIP优惠价 -->
             <view v-if="item.isVipPrice === 1 && item.vipPrice" class="price-info">
-              <text class="vip-price">NZ$ {{ parseFloat(item.vipPrice).toFixed(2) }}</text>
+              <text class="vip-price">{{ parseFloat(item.vipPrice).toFixed(2) }} 天医币</text>
               <text class="vip-label">VIP到手价</text>
-              <text class="original-price">NZ$ {{ parseFloat(item.price).toFixed(2) }}</text>
+              <text class="original-price">{{ parseFloat(item.price).toFixed(2) }} 天医币</text>
             </view>
             
             <!-- 活动价 -->
             <view v-else-if="item.activityPrice && item.activityPrice > 0" class="price-info">
-              <text class="activity-price">NZ$ {{ parseFloat(item.activityPrice).toFixed(2) }}</text>
+              <text class="activity-price">{{ parseFloat(item.activityPrice).toFixed(2) }} 天医币</text>
               <text class="activity-label">活动价</text>
-              <text class="original-price">NZ$ {{ parseFloat(item.price).toFixed(2) }}</text>
+              <text class="original-price">{{ parseFloat(item.price).toFixed(2) }} 天医币</text>
             </view>
             
             <!-- 普通价格 -->
             <view v-else class="price-info">
-              <text class="normal-price">NZ$ {{ parseFloat(item.price).toFixed(2) }}</text>
+              <text class="normal-price">{{ parseFloat(item.price).toFixed(2) }} 天医币</text>
             </view>
           </view>
         </view>

components/order/ProductInfo.vue

@@ -0,0 +1,110 @@
+<template>
+  <view class="order-item-content">
+    <view class="order-item-product-info">
+      <image
+        :src="productImg"
+        mode="aspectFit"
+        class="order-item-product-cover"
+      />
+      <view class="order-item-product-name" v-html="title"></view>
+    </view>
+    <view class="order-item-product-price">
+      <view class="price">{{ price }} 天医币</view>
+      <view class="count">x {{ 1 }}</view>
+    </view>
+  </view>
+</template>
+
+<script lang="ts" setup>
+import { computed } from 'vue'
+interface Props {
+  data: any
+  type: string
+}
+const props = defineProps<Props>()
+
+const productImg = computed(() => {
+  
+  switch (props.type) {
+    case 'order':
+      return props.data[0]?.product?.productImages || ''
+    case 'abroadBook':
+      return props.data?.images || ''
+    case 'vip':
+      return '/static/vip.png'
+    case 'point':
+      return '/static/jifen.png'
+    default:
+      return ''
+  }
+})
+const title = computed(() => {
+  switch (props.type) {
+    case 'order':
+      return props.data[0]?.product?.productName || ''
+    case 'abroadBook':
+      return props.data?.name || ''
+    case 'vip':
+      return props.data?.title + '<text style="color: #ff4703; font-weight: bold;">(' + props.data?.year + '年)</text>' || ''
+    case 'point':
+      return ''
+    default:
+      return ''
+  }
+})
+const price = computed(() => {
+  switch (props.type) {
+    case 'order':
+      return props.data[0]?.product?.price || 0
+    case 'abroadBook':
+      return props.data?.abroadPrice || 0
+    case 'vip':
+      return props.data?.fee || 0
+    case 'point':
+      return ''
+    default:
+      return ''
+  }
+})
+
+</script>
+
+<style lang="scss" scoped>
+.order-item-content {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-between;
+  align-items: center;
+  font-size: 14px;
+
+  .order-item-product-info {
+    display: flex;
+    flex-direction: row;
+    justify-content: flex-start;
+    align-items: center;
+
+    .order-item-product-cover {
+      margin-right: 12px;
+      width: 40px;
+      height: 40px;
+      border-radius: 4px;
+      background-color: #f5f5f5;
+    }
+
+    .order-item-product-name {
+      color: #333;
+    }
+  }
+  .order-item-product-price {
+    font-weight: bold;
+    color: #333;
+    text-align: right;
+    font-size: 12px;
+
+    .count {
+      font-weight: normal;
+      color: #999;
+    }
+  }
+}
+</style>