订单

src/api/ticket.js

@@ -34,3 +34,11 @@ export function receiveCoupon(data) {
     data,
   });
 }
+
+// 优惠券使用须知
+export function couponUsageNotice() {
+  return request({
+    url: `/sgyrdd/coupon/instructions`,
+    method: 'GET',
+  });
+}

src/pages/order/components/OrderList/index.vue

-<template>
-  <view class="content" v-if="dataList.length > 0">
-    <view class="box" v-for="(item, index) in dataList" :key="index">
-      <view class="header" @click="handleDetail(item.orderNumber)">
-        <view class="left">
-          <image src="@/static/order/shop.png" />
-          <view class="title">{{ item.shopName }}</view>
-        </view>
-        <view class="right">
-          <span class="status">{{ statusList[item.status] }}</span>
-          <wd-count-down :time="time" :format="format" v-if="item.status == 1" />
-        </view>
-      </view>
-
-      <view class="info" @click="handleDetail(item.orderNumber)">
-        <image mode="aspectFill" :src="fileDomain + item.orderItems[0].pic" />
-        <view class="info-box">
-          <view class="text">下单时间：{{ item.createTime.slice(0, 16) }}</view>
-          <view class="text">预约时间：{{ item.receiverTime }}</view>
-          <view class="text">数量：{{ item.orderItems[0].prodCount }}</view>
-          <view class="text">实付：￥{{ item.actualTotal }}</view>
-        </view>
-      </view>
-
-      <view class="btn">
-        <view
-          class="btn-info"
-          v-if="item.status == 5 || item.status == 6"
-          @tap="handleDelete(item.orderNumber)"
-        >
-          删除
-        </view>
-        <view class="btn-info" v-if="item.status == 3" @tap="handleDetail(item.orderNumber)">
-          查看预约
-        </view>
-        <view class="btn-info" @tap="handleCancel(item.orderNumber)" v-if="item.status == 1">
-          取消订单
-        </view>
-        <view class="btn-info" v-if="item.status == 4" @tap="handleRemark(item)">评价</view>
-        <view class="btn-info" @tap="callShopPhone(item.shopTel)">联系商家</view>
-        <view class="btn-error" v-if="item.status == 7">售后详情</view>
-        <view
-          class="btn-error"
-          v-if="item.status == 2 || item.status == 3 || item.status == 4"
-          @click="handleRefund(item.orderNumber)"
-        >
-          申请退款
-        </view>
-        <view class="btn-error" v-if="item.status == 5">再来一单</view>
-        <view class="btn-error" v-if="item.status == 1">立即支付</view>
-      </view>
-    </view>
-
-    <wd-loadmore :state="state" @reload="getList" />
-  </view>
-  <wd-status-tip image="content" tip="暂无内容" v-else />
-</template>
-
-<script setup>
-import { getOrderList, deleteOrderApi, cancelOrderApi } from '@/api/order';
-const fileDomain = import.meta.env.VITE_APP_IMG_URL;
-const emits = defineEmits(['refresh']);
-
-const time = ref(30 * 60 * 1000);
-const format = ref('mm:ss');
-
-const state = ref('loading');
-const catalog = reactive({
-  current: 0,
-  size: 10,
-  startDate: '',
-  endDate: '',
-  keyword: '',
-  status: '', // 订单状态，1-待付款，2-待接单，3-待取货，4-待评价，5-完成，6-取消，7-退款
-});
-const statusList = ref({
-  1: '待付款',
-  3: '待消费',
-  4: '待评价',
-  5: '已完成',
-  6: '已取消',
-  7: '已退款',
-});
-const total = ref(0);
-const dataList = ref([]);
-
-const getList = async () => {
-  catalog.current++;
-  state.value = 'loading';
-  const res = await getOrderList(catalog);
-  if (res.code === 0) {
-    if (res.data.records.length > 0) {
-      dataList.value.push(...res.data.records);
-      total.value = res.data.total;
-    } else {
-      state.value = 'finished';
-    }
-  } else {
-    state.value = 'error';
-  }
-  state.value = 'finished';
-};
-getList();
-
-onReachBottom(() => {
-  if (dataList.value.length >= total.value) {
-    state.value = 'finished';
-  } else {
-    getList();
-  }
-});
-
-const handleDetail = (id) => {
-  uni.navigateTo({
-    url: `/pages/order/detail?orderNumber=${id}`,
-  });
-};
-
-const handleRefresh = (e) => {
-  catalog.status = e;
-  if (e === '0') {
-    catalog.status = '';
-  }
-  catalog.current = 0;
-  dataList.value = [];
-  total.value = 0;
-  getList();
-};
-
-/**
- * 拨打商家电话
- * @param {*} phoneNumber
- */
-function callShopPhone(phoneNumber) {
-  xma.makePhoneCall({
-    phoneNumber, // 仅为示例
-  });
-}
-
-/**
- * 删除订单
- * @param {*} ordrerNumber
- */
-const handleDelete = (ordrerNumber) => {
-  uni.showModal({
-    title: '提示',
-    content: '确定要删除订单吗？',
-    success: async (res) => {
-      if (res.confirm) {
-        const res = await deleteOrderApi(ordrerNumber);
-        if (res.code === 0) {
-          uni.showToast({
-            title: '删除成功',
-            icon: 'success',
-          });
-          handleRefresh(catalog.status);
-        } else {
-          uni.showToast({
-            title: '删除失败',
-            icon: 'error',
-          });
-        }
-      }
-    },
-  });
-};
-
-/**
- * 取消订单
- * @param {*} ordrerNumber
- */
-const handleCancel = (ordrerNumber) => {
-  uni.showModal({
-    title: '提示',
-    content: '确定要取消订单吗？',
-    success: async (res) => {
-      if (res.confirm) {
-        const res = await cancelOrderApi({ ordrerNumber });
-        if (res.code === 0) {
-          uni.showToast({
-            title: '取消成功',
-            icon: 'success',
-          });
-          handleRefresh(catalog.status);
-        } else {
-          uni.showToast({
-            title: '取消失败',
-            icon: 'error',
-          });
-        }
-      }
-    },
-  });
-};
-
-const handleRemark = (item) => {
-  xma.navigateTo({
-    url: `/pages/order/remark?orderNumber=${item.orderNumber}&shopName=${item.shopName}`,
-  });
-};
-
-const handleRefund = (item) => {
-  xma.navigateTo({
-    url: `/pages/order/refund?orderNumber=${item.orderNumber}`,
-  });
-};
-
-defineExpose({
-  refresh: handleRefresh,
-});
-</script>
-
-<style lang="scss" scoped>
-.content {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 20rpx;
-  gap: 24rpx;
-
-  .box {
-    background-color: #fff;
-    width: 100%;
-    border-radius: 16rpx;
-    padding: 28rpx 18rpx;
-    display: flex;
-    flex-direction: column;
-    box-sizing: border-box;
-    gap: 30rpx;
-
-    .header {
-      display: flex;
-      align-items: center;
-      justify-content: space-between;
-
-      .left {
-        display: flex;
-        align-items: center;
-        gap: 6rpx;
-        font-weight: bold;
-
-        image {
-          height: 38rpx;
-          width: 38rpx;
-        }
-
-        .title {
-          color: #333;
-          font-size: 32rpx;
-          font-family: PingFang SC;
-        }
-      }
-
-      .right {
-        display: flex;
-        align-items: center;
-        gap: 6rpx;
-
-        .status {
-          color: #666;
-          font-size: 28rpx;
-        }
-      }
-    }
-
-    .info {
-      display: flex;
-      gap: 20rpx;
-
-      image {
-        width: 110rpx;
-        height: 110rpx;
-        border-radius: 12rpx;
-      }
-
-      .info-box {
-        display: flex;
-        flex-direction: column;
-        gap: 18rpx;
-
-        .text {
-          color: #666;
-          line-height: 28rpx;
-          font-size: 28rpx;
-          font-family: PingFang SC;
-        }
-      }
-    }
-
-    .btn {
-      display: flex;
-      justify-content: flex-end;
-      gap: 14rpx;
-
-      .btn-info {
-        width: 162rpx;
-        height: 66rpx;
-        border-radius: 34rpx;
-        border: 1rpx solid #999999;
-        color: #666;
-        font-size: 28rpx;
-        font-family: PingFang SC;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
-
-      .btn-error {
-        width: 162rpx;
-        height: 66rpx;
-        border-radius: 34rpx;
-        border: 1rpx solid #e9231b;
-        color: #e9231b;
-        font-size: 28rpx;
-        font-family: PingFang SC;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-      }
-    }
-  }
-}
-</style>

src/pages/order/components/Payment/index.vue

@@ -10,7 +10,7 @@
     <view class="pay-card">
       <view class="header">
         <view class="title">立即支付</view>
-        <wd-icon name="close" size="20" color="#999"></wd-icon>
+        <wd-icon name="close" size="20" color="#999" @tap="close"></wd-icon>
       </view>
       <radio-group style="width: 100%" @change="radioChange">
         <view class="pay-item">

src/pages/ticket/components/TicketList/index.vue

-<template>
-  <!-- 优惠券列表 -->
-  <view></view>
-</template>
-
-<script setup>
-const props = defineProps({
-  couponData: {
-    type: Array,
-  },
-});
-</script>
-
-<style lang="scss" scoped></style>

src/pages/ticket/detail.vue

@@ -115,14 +115,22 @@
             </view>
           </view>
         </view>
+        <view class="coupon-tips" v-if="couponInfo">
+          <view class="tips">使用须知</view>
+          <view class="desc">{{ couponInfo.contentRdd }}</view>
+        </view>
       </view>
       <wd-status-tip image="content" tip="暂无优惠券" v-else />
     </view>
+
+    <view class="footer">
+      <view class="btn" @tap="getCouponAll">一键领取</view>
+    </view>
   </view>
 </template>
 
 <script setup>
-import { shopCouponList, receiveCoupon } from '@/api/ticket';
+import { shopCouponList, receiveCoupon, couponUsageNotice } from '@/api/ticket';
 import { getShopDetail } from '@/api/order';
 import { getDistance } from '@/utils/common';
 import Header from '@/pages/order/components/Header/index.vue';
@@ -136,10 +144,10 @@ onShow(() => {
 
 const shopId = ref();
 onLoad((options) => {
-  console.log(options);
   shopId.value = options.shopId;
   getShopMailDetail();
   getList();
+  getCouponInfo();
 });
 
 /**
@@ -171,14 +179,51 @@ const getCoupon = async (item) => {
   const res = await receiveCoupon([item.couponYzfId]);
   if (res.code === 0) {
     item.numState = 1;
-    uni.showToast({
+    xma.showToast({
       title: '领取成功',
       icon: 'success',
       duration: 2000,
     });
     return;
   }
-  uni.showToast({
+  xma.showToast({
+    title: '领取失败',
+    icon: 'error',
+    duration: 2000,
+  });
+};
+
+/**
+ * 一键领取优惠券
+ */
+const getCouponAll = async () => {
+  const ids = [];
+  couponData.value.forEach((item) => {
+    if (item.numState === 0) {
+      ids.push(item.couponYzfId);
+    }
+  });
+  if (ids.length === 0) {
+    xma.showToast({
+      title: '暂无可领取优惠券',
+      icon: 'none',
+      duration: 2000,
+    });
+    return;
+  }
+  const res = await receiveCoupon(ids);
+  if (res.code === 0) {
+    couponData.value.forEach((item) => {
+      item.numState = 1;
+    });
+    xma.showToast({
+      title: '领取成功',
+      icon: 'success',
+      duration: 2000,
+    });
+    return;
+  }
+  xma.showToast({
     title: '领取失败',
     icon: 'error',
     duration: 2000,
@@ -198,6 +243,17 @@ const getShopMailDetail = async () => {
   }
 };
 
+/**
+ * 获取优惠券信息
+ */
+const couponInfo = ref();
+const getCouponInfo = async () => {
+  const res = await couponUsageNotice();
+  if (res.code === 0) {
+    couponInfo.value = JSON.parse(res.data.paramValue);
+  }
+};
+
 /**
  * 拨打商家电话
  * @param {*} phoneNumber
@@ -596,6 +652,57 @@ page {
           }
         }
       }
+
+      .coupon-tips {
+        width: 100%;
+        background-color: #fff;
+        border-radius: 16rpx;
+        display: flex;
+        flex-direction: column;
+        padding: 40rpx 46rpx 40rpx;
+        // min-height: 436rpx;
+        box-sizing: border-box;
+        gap: 38rpx;
+
+        .tips {
+          font-family: PingFang SC Bold-Regular;
+          font-size: 32rpx;
+          color: #333333;
+          line-height: 32rpx;
+          text-align: center;
+        }
+
+        .desc {
+          white-space: pre-line; /* 将空格和换行符保留在文本中 */
+          font-family: PingFang SC Regular;
+          font-size: 24rpx;
+          color: #333333;
+          line-height: 36rpx;
+          text-align: left;
+        }
+      }
+    }
+  }
+
+  .footer {
+    position: fixed;
+    bottom: 0;
+    width: 100%;
+    padding: 20rpx 26rpx 60rpx;
+    box-sizing: border-box;
+    background-color: #f5f5f5;
+
+    .btn {
+      width: 100%;
+      height: 80rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      font-family: PingFang SC Bold-Regular;
+      font-size: 32rpx;
+      color: #ffffff;
+      background: linear-gradient(180deg, #ff694d 0%, #ff3f33 100%);
+      border-radius: 46rpx;
     }
   }
 }