Browse Source

Merge branch 'hongqiziben1' of http://154.209.4.10:3001/tt0101/zhunong-h5 into hongqiziben1

tt0101 2 weeks ago
parent
commit
3dbdf0d999
2 changed files with 113 additions and 73 deletions
  1. 1 0
      src/api/profile.js
  2. 112 73
      src/views/dhjilu.vue

+ 1 - 0
src/api/profile.js

@@ -78,3 +78,4 @@ export const exchangePrize = (data) => request({ url: "/index/exchange_prize", m
 export const getLotteryRecord = () => request({ url: "/index/get_lottery_record", method: "get", loading: true });
 // 设置收货地址 
 export const bindAddress = (data) => request({ url: "/index/bind_address", method: "post", data, loading: true });
+

+ 112 - 73
src/views/dhjilu.vue

@@ -12,20 +12,42 @@
     <div class="dhjilu-container">
       <div class="content-wrapper">
         <!-- 记录列表 -->
-        <div class="records-list">
-          <div 
-            v-for="(record, index) in exchangeRecords" 
-            :key="record.id"
-            class="record-item"
-          >
-            <div class="record-content">
-              <div class="record-number">奖品{{ getChineseNumber(index + 1) }}</div>
-              <div class="record-name">{{ record.prize_name }}</div>
-              <div class="record-price">价值{{ record.value }}元</div>
-              <div class="record-count">{{ record.count }}份</div>
+        <div v-if="exchangeRecords.length > 0" class="record-list">
+          <div class="record-card" v-for="item in exchangeRecords" :key="item.id">
+            <div class="row main-row">
+              <span class="label">商品名称:</span>
+              <span class="value name">{{ item.prize_name }}</span>
+            </div>
+            <div class="row">
+              <span class="label">兑换时间:</span>
+              <span class="value">{{ formatTime(item.create_time) }}</span>
+            </div>
+            <div class="row">
+              <span class="label">发货状态:</span>
+              <span class="value status" :class="'status-' + item.status">{{ getStatusText(item.status) }}</span>
+            </div>
+            <div class="row">
+              <span class="label">快递单号:</span>
+              <span class="value">{{ item.tranumber || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">收货人:</span>
+              <span class="value">{{ item.name || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">电话:</span>
+              <span class="value">{{ item.phone || '-' }}</span>
+            </div>
+            <div class="row">
+              <span class="label">地址:</span>
+              <span class="value">{{ item.address || '-' }}</span>
             </div>
           </div>
         </div>
+        <div v-else class="empty-state">
+          <div class="icon">😕</div>
+          <div class="text">暂无记录</div>
+        </div>
       </div>
     </div>
 
@@ -37,6 +59,7 @@
 <script>
 import Toast from '@/components/Toast.vue';
 import { getLotteryRecord } from '@/api/profile';
+
 export default {
   name: 'DhjiluPage',
   components: {
@@ -54,20 +77,42 @@ export default {
     // 加载兑换记录
     async loadExchangeRecords() {
       try {
-        
         const res = await getLotteryRecord();
-        console.log(res);
-        this.exchangeRecords = res.data;
+        console.log('res:', res);
+        this.exchangeRecords = Array.isArray(res.data) ? res.data : [];
+        console.log('records:', this.exchangeRecords);
       } catch (error) {
-        console.error('加载兑换记录失败:', error);
-        this.$refs.toast.show('加载记录失败', 'error');
+        this.exchangeRecords = [];
+        this.$refs.toast && this.$refs.toast.show('加载记录失败', 'error');
       }
     },
-
-    // 转换数字为中文
-    getChineseNumber(num) {
-      const chineseNumbers = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'];
-      return chineseNumbers[num - 1] || num;
+    // 状态文本
+    getStatusText(status) {
+      const map = {
+        '0': '备货中',
+        '1': '已发货'
+      };
+      return map[String(status)] || status || '-';
+    },
+    // 时间格式化
+    formatTime(ts) {
+      if (!ts) return '-';
+      // 支持时间戳(秒/毫秒)或字符串
+      let date;
+      if (typeof ts === 'number' || /^\d+$/.test(ts)) {
+        if (String(ts).length === 10) date = new Date(ts * 1000);
+        else date = new Date(Number(ts));
+      } else {
+        date = new Date(ts);
+      }
+      if (isNaN(date.getTime())) return '-';
+      const y = date.getFullYear();
+      const m = String(date.getMonth() + 1).padStart(2, '0');
+      const d = String(date.getDate()).padStart(2, '0');
+      const h = String(date.getHours()).padStart(2, '0');
+      const min = String(date.getMinutes()).padStart(2, '0');
+      const s = String(date.getSeconds()).padStart(2, '0');
+      return `${y}-${m}-${d} ${h}:${min}:${s}`;
     }
   }
 }
@@ -126,59 +171,62 @@ export default {
 }
 
 /* 记录列表 */
-.records-list {
+.record-list {
   display: flex;
   flex-direction: column;
-  gap: 15px;
+  gap: 18px;
 }
 
-.record-item {
-  background: linear-gradient(135deg, #f5a5a5 0%, #f0b8b8 100%);
-  border-radius: 12px;
-  padding: 20px 15px;
-  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
-  transition: transform 0.2s ease;
+.record-card {
+  background: #fff0f0;
+  border-radius: 14px;
+  padding: 18px 16px;
+  box-shadow: 0 2px 8px rgba(180,58,57,0.08);
+  margin-bottom: 0;
 }
 
-.record-item:active {
-  transform: scale(0.98);
+.row {
+  display: flex;
+  align-items: center;
+  margin-bottom: 7px;
+  font-size: 15px;
 }
 
-.record-content {
-  display: grid;
-  grid-template-columns: auto 1fr auto auto;
-  align-items: center;
-  gap: 15px;
+.row:last-child {
+  margin-bottom: 0;
 }
 
-.record-number {
-  font-size: 16px;
+.label {
+  color: #b43a39;
   font-weight: 600;
-  color: #d91d42;
-  min-width: 50px;
+  min-width: 80px;
 }
 
-.record-name {
-  font-size: 16px;
-  font-weight: 500;
+.value {
   color: #333;
-  text-align: left;
+  font-weight: 500;
+  word-break: break-all;
 }
 
-.record-price {
+.value.name {
   font-size: 16px;
-  font-weight: 600;
-  color: #d91d42;
-  text-align: right;
-  min-width: 90px;
+  font-weight: bold;
 }
 
-.record-count {
-  font-size: 16px;
-  font-weight: 600;
-  color: #333;
-  text-align: right;
-  min-width: 30px;
+.value.status {
+  font-weight: bold;
+}
+
+.status-0 {
+  color: #e67c00;
+}
+
+.status-1 {
+  color: #1bbf1b;
+}
+
+.main-row {
+  margin-bottom: 10px;
 }
 
 /* 响应式优化 */
@@ -187,37 +235,28 @@ export default {
     padding: 15px;
   }
   
-  .record-content {
-    gap: 10px;
+  .record-card {
+    padding: 12px 8px;
   }
   
-  .record-number,
-  .record-name,
-  .record-price,
-  .record-count {
+  .label {
+    min-width: 60px;
     font-size: 14px;
   }
   
-  .record-item {
-    padding: 15px 12px;
+  .value {
+    font-size: 14px;
   }
 }
 
 @media screen and (max-width: 320px) {
-  .record-content {
-    gap: 8px;
+  .label {
+    min-width: 80px;
   }
   
-  .record-number,
-  .record-name,
-  .record-price,
-  .record-count {
+  .value {
     font-size: 13px;
   }
-  
-  .record-price {
-    min-width: 80px;
-  }
 }
 
 /* 空状态 */