tmp

components/order-stats/index.js

@@ -0,0 +1,70 @@
+// components/order-stats/index.js
+// 首页订单统计卡片：全部完成 / 本月完成 / 未完成
+const API = require('../../utils/api.js')
+
+Component({
+  data: {
+    allCount: 0,
+    allFee: 0,
+    monthCount: 0,
+    monthFee: 0,
+    uncompletedCount: 0,
+    uncompletedFee: 0
+  },
+
+  lifetimes: {
+    attached() {
+      this.load()
+    }
+  },
+
+  methods: {
+    /**
+     * 拉取订单记录并统计三个口径（数量与费用）
+     * 全部完成：status === 'completed'
+     * 本月完成：completed 且预约日期在本月
+     * 未完成：status !== 'completed'
+     * 费用取 payment.totalFee 合计
+     */
+    load() {
+      API.escort.getAllRecords({ page: 1, pageSize: 200 })
+        .then(res => {
+          if (res.code !== 0) return
+          const records = res.data.records || []
+          const now = new Date()
+          const year = now.getFullYear()
+          const month = now.getMonth()
+          const feeOf = (item) => Number(item.payment && item.payment.totalFee) || 0
+
+          let allCount = 0
+          let allFee = 0
+          let monthCount = 0
+          let monthFee = 0
+          let uncompletedCount = 0
+          let uncompletedFee = 0
+
+          records.forEach(item => {
+            if (item.status === 'completed') {
+              allCount++
+              allFee += feeOf(item)
+              const d = item.schedule && item.schedule.date
+                ? new Date(item.schedule.date)
+                : null
+              if (d && !isNaN(d.getTime()) && d.getFullYear() === year && d.getMonth() === month) {
+                monthCount++
+                monthFee += feeOf(item)
+              }
+            } else {
+              uncompletedCount++
+              uncompletedFee += feeOf(item)
+            }
+          })
+
+          this.setData({ allCount, allFee, monthCount, monthFee, uncompletedCount, uncompletedFee })
+        })
+        .catch(err => {
+          console.error('获取订单统计失败', err)
+        })
+    }
+  }
+})

components/order-stats/index.json

@@ -0,0 +1,3 @@
+{
+  "component": true
+}

components/order-stats/index.wxml

@@ -0,0 +1,24 @@
+<view class="os-section">
+  <view class="os-header">
+    <text class="os-title">订单统计</text>
+  </view>
+  <view class="os-card">
+    <view class="os-item">
+      <text class="os-num green">{{allCount || 0}}</text>
+      <text class="os-label">全部完成</text>
+      <text class="os-fee">¥{{allFee || 0}}</text>
+    </view>
+    <view class="os-divider"></view>
+    <view class="os-item">
+      <text class="os-num blue">{{monthCount || 0}}</text>
+      <text class="os-label">本月完成</text>
+      <text class="os-fee">¥{{monthFee || 0}}</text>
+    </view>
+    <view class="os-divider"></view>
+    <view class="os-item">
+      <text class="os-num orange">{{uncompletedCount || 0}}</text>
+      <text class="os-label">未完成</text>
+      <text class="os-fee">¥{{uncompletedFee || 0}}</text>
+    </view>
+  </view>
+</view>

components/order-stats/index.wxss

@@ -0,0 +1,109 @@
+/* components/order-stats/index.wxss */
+
+.os-section {
+  margin-top: 30rpx;
+}
+
+.os-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16rpx;
+}
+
+.os-title {
+  font-size: 30rpx;
+  font-weight: 500;
+  color: #1a1a1a;
+  margin-left: 8rpx;
+  letter-spacing: 1rpx;
+}
+
+.os-card {
+  background: linear-gradient(135deg, #ffffff 0%, #f3fbf8 100%);
+  border-radius: 24rpx;
+  box-shadow: 0 4rpx 20rpx rgba(23, 195, 165, 0.10);
+  padding: 36rpx 0 32rpx;
+  display: flex;
+  align-items: stretch;
+  position: relative;
+  overflow: hidden;
+}
+
+/* 左上角装饰色块，呼应首页头部渐变 */
+.os-card::before {
+  content: '';
+  position: absolute;
+  top: -40rpx;
+  left: -40rpx;
+  width: 160rpx;
+  height: 160rpx;
+  border-radius: 50%;
+  background: linear-gradient(135deg, rgba(45, 211, 111, 0.10), rgba(23, 195, 165, 0.10));
+}
+
+.os-item {
+  flex: 1;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  position: relative;
+  z-index: 1;
+}
+
+.os-num {
+  font-size: 48rpx;
+  font-weight: 700;
+  line-height: 1;
+  font-family: 'DIN Alternate', -apple-system, sans-serif;
+}
+
+.os-num.green {
+  color: #2dd36f;
+}
+
+.os-num.blue {
+  color: #409eff;
+}
+
+.os-num.orange {
+  color: #ff9f43;
+}
+
+.os-label {
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #888888;
+}
+
+.os-fee {
+  margin-top: 10rpx;
+  font-size: 22rpx;
+  font-weight: 600;
+  color: #1a1a1a;
+  padding: 4rpx 16rpx;
+  border-radius: 20rpx;
+  background: rgba(26, 26, 46, 0.05);
+}
+
+.os-item:nth-child(1) .os-fee {
+  color: #1ea55c;
+  background: rgba(45, 211, 111, 0.12);
+}
+
+.os-item:nth-child(3) .os-fee {
+  color: #3d8fe0;
+  background: rgba(64, 158, 255, 0.12);
+}
+
+.os-item:nth-child(5) .os-fee {
+  color: #e08a1e;
+  background: rgba(255, 159, 67, 0.14);
+}
+
+.os-divider {
+  width: 1rpx;
+  margin: 8rpx 0;
+  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #e8e8e8 30%, #e8e8e8 70%, rgba(0, 0, 0, 0) 100%);
+  flex-shrink: 0;
+}