exam_mp/pages/punch/jiangli.vue

<script setup name="order">
import Container from "@/components/Container/Container.vue";
import { request } from "@/utils/request";
import { ref, onMounted } from "vue";
import utils from "@/utils/common";

const orderList = ref([]);

onMounted(async () => {
  const res = await request(
    "api/question_bank/question_reception/lottery_winning_record/list",
    {
      page: 1,
      limit: 999,
    }
  );
  orderList.value = res.data.data;
});
</script>

<template>
  <Container
    title="订单记录"
    bgColor="#f8f8f8"
    :empty="!orderList.length"
    headerColor="#fff"
    text="暂无订单记录"
  >
    <view class="Container">
      <view class="card" v-for="item in orderList" :key="item.id">
        <view class="left">
          <view class="name">{{ item.reward_name }}</view>
          <view>中奖时间: {{ utils.timestampToString(item.insert_time) }}</view>
        </view>
        <!-- <view class="right">
          <view class="price" v-if="item.order_preferential_price > 0"
            >￥{{ item.order_preferential_price }}</view
          >
          <view class="price" v-if="item.order_preferential_price < 0.01"
            >赠送</view
          >
          <view class="line" v-if="item.order_original_price > 0">{{
            item.order_original_price
          }}</view>
          <view class="line" v-if="item.order_preferential_price < 0.01"></view>
        </view> -->
      </view>
    </view>
  </Container>
</template>

<style scoped lang="scss">
@import "@/uni.scss";
.Container {
  display: flex;
  flex-direction: column;
  gap: 16rpx;

  .card {
    background-color: #fff;
    padding: 24rpx 16rpx;
    border-radius: 16rpx;
    display: flex;
    justify-content: space-between;
    border-radius: 16rpx;
    font-family: PingFang SC, PingFang SC;
    font-weight: 500;
    font-size: 28rpx;

    .left {
      display: flex;
      flex-direction: column;
      gap: 8rpx;
      color: #666666;

      .name {
        color: $primary;
      }
    }

    .right {
      .price {
        color: $error;
      }
      .line {
        color: #999;
        text-decoration: line-through;
      }
    }
  }
}
</style>