【第一版开发】

1.新增大乐透、ProductHunt热榜、双色球、订单列表页面

src/apis/orderApi.js

@@ -11,4 +11,16 @@ export function createOrder(data) {
         data,
         loading: true
     });
+}
+
+/**
+ * 查询订单
+ * @param {Object} data
+ */
+export function queryOrder() {
+    return request({
+        url: "/order/queryOrder",
+        method: "get",
+        loading: true
+    });
 }

src/common/router.js

@@ -37,6 +37,11 @@ const router = {
      * 免责声明
      */
     DISCLAIMER_PAGE: '/pages/disclaimer',
+
+    /**
+     * 订单列表
+     */
+    ORDER_LIST_PAGE: '/pages/orderList'
 }
 
 export default router;

src/pages.json

@@ -90,6 +90,13 @@
 				"enablePullDownRefresh": true,
 				"backgroundColor": "#E5E5E5"
 			}
+		},
+		{
+			"path": "pages/orderList",
+			"style": {
+				"navigationBarTitleText": "订单列表",
+				"enablePullDownRefresh": true
+			}
 		}
 	],
 	"tabBar": {

src/pages/data/daLeTou.vue

@@ -1,8 +1,181 @@
 <template>
-  <div class="daLeTou">daLeTou</div>
+  <view class="bg-box">
+    <view>
+      <text>开奖日期：</text>
+      <text>{{ dataObj.time }}</text>
+    </view>
+    <view>
+      <text>期号：</text>
+      <text>{{ dataObj.qihao }}</text>
+    </view>
+    <view>
+      <text>本期全国销售金额：</text>
+      <text>{{ dataObj.xiaoshou }}</text>
+    </view>
+    <view>
+      <text>开奖号码：</text>
+      <view class="number-box">
+        <view class="number" v-for="(item, index) in dataObj.numberList" :key="index">{{ item }}</view>
+      </view>
+      <view class="number-table">
+        <uni-table style="width: 100%; table-layout: fixed;" border>
+          <uni-tr>
+            <uni-th align="center">奖等</uni-th>
+            <uni-th align="center">中奖注数（注）</uni-th>
+            <uni-th align="center">单注中奖金额（元）</uni-th>
+          </uni-tr>
+          <!-- <uni-tr>
+            <uni-td align="center">一等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no1num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no1money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">二等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no2num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no2money }}</uni-td>
+          </uni-tr> -->
+          <uni-tr>
+            <uni-td align="center">一等奖 基本</uni-td>
+            <uni-td align="center">{{ dataObj.no1num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no1money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">一等奖 追加</uni-td>
+            <uni-td align="center">{{ dataObj.no1numjia }}</uni-td>
+            <uni-td align="center">{{ dataObj.no2moneyjia }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">二等奖 基本</uni-td>
+            <uni-td align="center">{{ dataObj.no2num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no2money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">二等奖 追加</uni-td>
+            <uni-td align="center">{{ dataObj.no2numjia }}</uni-td>
+            <uni-td align="center">{{ dataObj.no2moneyjia }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">三等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no3num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no3money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">四等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no4num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no4money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">五等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no5num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no5money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">六等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no6num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no6money }}</uni-td>
+          </uni-tr>
+        </uni-table>
+      </view>
+    </view>
+    <view>
+      <text>{{ dataObj.jiangchi }}元奖金滚入下期奖池</text>
+    </view>
+
+    <uni-load-more status="no-more" v-if="!dataObj" />
+  </view>
 </template>
 
 <script setup>
+import { ref } from 'vue';
+import { onPullDownRefresh, onShow, onLoad } from "@dcloudio/uni-app";
+import { dataApi } from '@/apis/apis.js';
+
+// 属性
+/**
+ * 开奖期号
+ */
+const drawDate = ref(null);
+
+/**
+ * 数据列表
+ */
+const dataObj = ref([]);
+
+
+// 方法
+/**
+ * 加载数据
+ */
+const loadData = async () => {
+  dataObj.value = await dataApi.queryDaLeTou({
+    "drawDate": drawDate.value,
+  });
+};
+
+// 生命周期
+onLoad((e) => {
+  if (e.drawDate) {
+    drawDate.value = e.drawDate;
+    loadData();
+  }
+});
+
+onShow(() => {
+  loadData();
+});
+
+onPullDownRefresh(() => {
+  loadData();
+  uni.stopPullDownRefresh();
+});
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.bg-box {
+  width: 100%;
+  height: 100%;
+  padding: 16rpx 24rpx;
+  background-color: #ffffff;
+
+  text {
+    font-size: 30rpx;
+    font-weight: 400;
+    letter-spacing: 0rpx;
+    line-height: 43.44rpx;
+    color: #000000;
+    text-align: left;
+    vertical-align: top;
+  }
+
+  .number-box {
+    display: inline-block;
+
+    .number {
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
+
+      border-radius: 50%;
+      margin-right: 8rpx;
+      background: #F26C76;
+      width: 50rpx;
+      height: 50rpx;
+
+      font-size: 28rpx;
+      font-weight: 400;
+      letter-spacing: 0rpx;
+      line-height: 40.54rpx;
+      color: #ffffff;
+    }
+
+    .number:nth-last-child(-n+2) {
+      background: #2879ED;
+    }
+  }
+
+  .number-table {
+    margin-top: 8rpx;
+    margin-bottom: 8rpx;
+  }
+}
+</style>

src/pages/data/productHunt.vue

@@ -1,7 +1,13 @@
 <template>
   <view class="box">
     <view class="product-hunt-box" v-for="item in dataList" :key="item.postId">
-      <!-- <image :src="item."></image> -->
+      <view v-if="item.medias">
+        <swiper indicator-dots autoplay circular>
+          <swiper-item v-for="(midea, index) in item.medias" :key="index">
+            <image :src="midea.url" mode="aspectFit" />
+          </swiper-item>
+        </swiper>
+      </view>
       <text class="title">{{ item.rankNum }}.{{ item.name }}</text>
       <view class="detail">
         <text class="label">标语：</text>

src/pages/data/shuangSeQiu.vue

@@ -1,8 +1,166 @@
 <template>
-  <div class="shuangSeQiu">shuangSeQiu</div>
+  <view class="bg-box">
+    <view>
+      <text>开奖日期：</text>
+      <text>{{ dataObj.time }}</text>
+    </view>
+    <view>
+      <text>期号：</text>
+      <text>{{ dataObj.qihao }}</text>
+    </view>
+    <view>
+      <text>本期销售金额：</text>
+      <text>{{ dataObj.xiaoshou }}</text>
+    </view>
+    <view>
+      <text>开奖号码：</text>
+      <view class="number-box">
+        <view class="number" v-for="(item, index) in dataObj.numberList" :key="index">{{ item }}</view>
+      </view>
+      <view class="number-table">
+        <uni-table style="width: 100%; table-layout: fixed;" border>
+          <uni-tr>
+            <uni-th align="center">奖等</uni-th>
+            <uni-th align="center">中奖注数（注）</uni-th>
+            <uni-th align="center">单注中奖金额（元）</uni-th>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">一等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no1num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no1money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">二等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no2num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no2money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">三等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no3num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no3money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">四等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no4num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no4money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">五等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no5num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no5money }}</uni-td>
+          </uni-tr>
+          <uni-tr>
+            <uni-td align="center">六等奖</uni-td>
+            <uni-td align="center">{{ dataObj.no6num }}</uni-td>
+            <uni-td align="center">{{ dataObj.no6money }}</uni-td>
+          </uni-tr>
+        </uni-table>
+      </view>
+    </view>
+    <view>
+      <text>一等奖中奖情况：</text>
+      <text>{{ dataObj.no1msg }}</text>
+    </view>
+    <view>
+      <text>下期一等奖奖池累计金额：</text>
+      <text>{{ dataObj.jiangchi }}</text>
+    </view>
+
+    <uni-load-more status="no-more" v-if="!dataObj" />
+  </view>
 </template>
 
 <script setup>
+import { ref } from 'vue';
+import { onPullDownRefresh, onShow, onLoad } from "@dcloudio/uni-app";
+import { dataApi } from '@/apis/apis.js';
+
+// 属性
+/**
+ * 开奖期号
+ */
+const drawDate = ref(null);
+
+/**
+ * 数据列表
+ */
+const dataObj = ref([]);
+
+
+// 方法
+/**
+ * 加载数据
+ */
+const loadData = async () => {
+  dataObj.value = await dataApi.queryShuangSeQiu({
+    "drawDate": drawDate.value,
+  });
+};
+
+// 生命周期
+onLoad((e) => {
+  if (e.drawDate) {
+    drawDate.value = e.drawDate;
+    loadData();
+  }
+});
+
+onShow(() => {
+  loadData();
+});
+
+onPullDownRefresh(() => {
+  loadData();
+  uni.stopPullDownRefresh();
+});
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+.bg-box {
+  width: 100%;
+  height: 100%;
+  padding: 16rpx 24rpx;
+  background-color: #ffffff;
+
+  text {
+    font-size: 30rpx;
+    font-weight: 400;
+    letter-spacing: 0rpx;
+    line-height: 43.44rpx;
+    color: #000000;
+    text-align: left;
+    vertical-align: top;
+  }
+
+  .number-box {
+    display: inline-block;
+
+    .number {
+      display: inline-flex;
+      justify-content: center;
+      align-items: center;
+
+      border-radius: 50%;
+      margin-right: 8rpx;
+      background: #F26C76;
+      width: 50rpx;
+      height: 50rpx;
+
+      font-size: 28rpx;
+      font-weight: 400;
+      letter-spacing: 0rpx;
+      line-height: 40.54rpx;
+      color: #ffffff;
+    }
+
+    .number:last-child {
+      background: #2879ED;
+    }
+  }
+
+  .number-table {
+    margin-top: 8rpx;
+    margin-bottom: 8rpx;
+  }
+}
+</style>

src/pages/orderList.vue

@@ -0,0 +1,96 @@
+<template>
+  <view class="bg-box">
+    <view class="order-box" v-for="(item, index) in dataList" :key="item.orderNo">
+      <view class="item-detail">
+        <text class="label">订单号</text>
+        <text class="value">{{ item.orderNo }}</text>
+      </view>
+      <view class="item-detail">
+        <text class="label">商品</text>
+        <text class="value">{{ item.product }}</text>
+      </view>
+      <view class="item-detail">
+        <text class="label">价格</text>
+        <text class="value">{{ item.subscriptionPrice }}</text>
+      </view>
+      <view class="item-detail">
+        <text class="label">状态</text>
+        <text class="value">{{ item.paymentStatus }}</text>
+      </view>
+      <view class="item-detail">
+        <text class="label">创建时间</text>
+        <text class="value">{{ item.creationTime }}</text>
+      </view>
+      <view class="item-detail" v-if="item.paymentStatus == '支付成功'">
+        <text class="label">付款时间</text>
+        <text class="value">{{ item.closeTime }}</text>
+      </view>
+      <view class="item-detail" v-if="item.paymentStatus == '已关闭'">
+        <text class="label">关闭时间</text>
+        <text class="value">{{ item.closeTime }}</text>
+      </view>
+    </view>
+
+    <uni-load-more status="no-more" v-if="!dataList || dataList.length == 0" />
+  </view>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { onPullDownRefresh, onShow } from "@dcloudio/uni-app";
+import { orderApi } from '@/apis/apis.js';
+
+// 属性
+
+/**
+ * 数据列表
+ */
+const dataList = ref([]);
+
+
+// 方法
+/**
+ * 加载数据
+ */
+const loadData = async () => {
+  dataList.value = await orderApi.queryOrder();
+};
+
+// 生命周期
+onShow(() => {
+  loadData();
+});
+
+onPullDownRefresh(() => {
+  loadData();
+  uni.stopPullDownRefresh();
+});
+</script>
+
+<style lang="scss" scoped>
+.bg-box {
+  width: 100%;
+  min-height: 100vh;
+  padding: 16rpx 24rpx;
+  background-color: #e5e5e5;
+
+  .order-box {
+    background-color: #ffffff;
+    padding: 16rpx;
+    margin-bottom: 24rpx;
+    border-radius: 16rpx;
+
+    .item-detail {
+      display: flex;
+
+      .label {
+        flex: 0 0 40%;
+      }
+
+      .value {
+        flex: 0 0 60%;
+      }
+    }
+  }
+}
+</style>

src/pages/userCenter.vue

@@ -25,7 +25,7 @@
     <view class="mt24" v-if="loginStatus">
       <uni-list :border="true">
         <uni-list-item title="订单记录" :showArrow="true" :showExtraIcon="true"
-          :extraIcon="{ color: '#000000', size: 22, type: 'list' }">
+          :extraIcon="{ color: '#000000', size: 22, type: 'list' }" link="navigateTo" :to="router.ORDER_LIST_PAGE">
         </uni-list-item>
       </uni-list>
     </view>