账单统计页面

app.json

@@ -1,17 +1,17 @@
 {
-  "pages":[
+  "pages": [
     "pages/index/index",
-    "pages/logs/logs"
+    "pages/logs/logs",
+    "pages/billing_Statistics/index"
   ],
-  "window":{
-    "backgroundTextStyle":"light",
+  "window": {
+    "backgroundTextStyle": "light",
     "navigationBarBackgroundColor": "#fff",
     "navigationBarTitleText": "Weixin",
-    "navigationBarTextStyle":"black"
+    "navigationBarTextStyle": "black"
   },
   "usingComponents": {
-    "van-button":"@vant/weapp/button"
+    "van-button": "@vant/weapp/button"
   },
-
   "sitemapLocation": "sitemap.json"
-}
+}

pages/billing_Statistics/index.js

@@ -0,0 +1,77 @@
+const date = new Date()
+const years = []
+const months = []
+const days = []
+ 
+for (let i = 1990; i <= date.getFullYear(); i++) {
+  years.push(i)
+}
+ 
+for (let i = 1; i <= 12; i++) {
+  months.push(i)
+}
+ 
+for (let i = 1; i <= 31; i++) {
+  days.push(i)
+}
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+ 
+  },
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/billing_Statistics/index.json

@@ -0,0 +1,10 @@
+{
+  "usingComponents": {
+    "van-row":"@vant/weapp/row",
+    "van-icon":"@vant/weapp/icon",
+    "van-col": "@vant/weapp/col",
+    "van-datetime-picker": "@vant/weapp/datetime-picker",
+    "van-popup": "@vant/weapp/popup",
+    "van-calendar":"@vant/weapp/calendar"
+  }
+}

pages/billing_Statistics/index.wxml

@@ -0,0 +1,70 @@
+<view class="bill_container">
+  <view class="bill_header">
+    <van-row>
+      <van-col style="font-size: 44rpx;color:white;" span="10">
+        <van-icon name="arrow-left" />
+      </van-col>
+      <van-col style="font-size: 40rpx;color:white" span="10">账单统计</van-col>
+      <van-col span="4"></van-col>
+    </van-row>
+
+    <view class="bill_content">
+      <view class="todayBill">今日账单</view>
+      <view class="Account">入账金额：￥<span>9909.98</span>元
+      </view>
+    </view>
+
+    <view class="bill_list">
+      <view class="bill_list_content1">
+        <view><span>￥340.14</span>元</view>
+        <view>包装费</view>
+      </view>
+      <view class="bill_list_content2">
+        <view><span>￥298.00</span>元</view>
+        <view>配送费</view>
+      </view>
+      <view class="bill_list_content3">
+        <view><span>￥50.00</span>元</view>
+        <view>退款费</view>
+      </view>
+    </view>
+
+    <view class="bill_bottom">
+      <view class="bill_bottom_header">
+        <text>累计账单</text>
+        <van-icon bindtap="onClose" name="calendar-o" />
+      </view>
+      <view class="bill_bottom_content">
+        <view class="bill_bottom_contentList">
+          <view>
+            <van-icon name="gold-coin-o" /><span>￥19899.00</span>元
+          </view>
+          <view class="bill_bottom_contentList_text">入账金额</view>
+        </view>
+
+        <view class="bill_bottom_contentList">
+          <view>
+            <van-icon name="point-gift-o" /><span>￥19899.00</span>元
+          </view>
+          <view class="bill_bottom_contentList_text">包装费</view>
+        </view>
+
+        <view class="bill_bottom_contentList">
+          <view>
+            <van-icon name="logistics" /><span>￥19899.00</span>元
+          </view>
+          <view class="bill_bottom_contentList_text"> 配送费</view>
+        </view>
+
+        <view class="bill_bottom_contentList">
+          <view>
+            <van-icon name="refund-o" /><span>￥19899.00</span>元
+          </view>
+          <view class="bill_bottom_contentList_text">退款费</view>
+        </view>
+      </view>
+    </view>
+  </view>
+</view>
+
+

pages/billing_Statistics/index.wxss

@@ -0,0 +1,110 @@
+.bill_header {
+  width: 100%;
+  height: 500rpx;
+  background-color: #FE8146;
+}
+
+.bill_content {
+  margin-left: 80rpx;
+  color: white;
+  padding-top: 60rpx;
+}
+
+.bill_content .todayBill {
+  font-size: 40rpx;
+}
+
+.bill_content .Account {
+  margin-top: 20rpx;
+  font-size: 32rpx;
+}
+
+.bill_content span {
+  font-size: 48rpx;
+}
+
+.bill_list {
+  margin-top: 100rpx;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+}
+
+.bill_list_content1,
+.bill_list_content2,
+.bill_list_content3 {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  font-size: 28rpx;
+  color: aliceblue;
+  /* background-color: aqua; */
+  padding: 20rpx;
+}
+
+.bill_list_content1,
+.bill_list_content2 {
+  border-right: 1rpx solid rgb(199, 192, 192);
+}
+
+.bill_list_content1 view span {
+  font-size: 40rpx;
+}
+
+.bill_list_content2 view span {
+  font-size: 40rpx;
+}
+
+.bill_list_content3 view span {
+  font-size: 40rpx;
+}
+
+.bill_bottom {
+  width: 100%;
+  height: 60rpx;
+}
+
+.bill_bottom_header {
+  margin-top: 20rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.bill_bottom_header text {
+  padding: 40rpx;
+  font-size: 32rpx;
+}
+
+.bill_bottom_header van-icon {
+  padding: 40rpx;
+  color: orange;
+  font-size: 50rpx;
+}
+
+.bill_bottom_content {
+
+  display: grid;
+  grid-template-rows: 1fr 1fr;
+  grid-template-columns: 1fr 1fr;
+  text-align: center;
+}
+
+.bill_bottom_contentList {
+  padding: 40rpx;
+  border: 1px solid #ccc;
+}
+
+.bill_bottom_contentList van-icon {
+  font-size: 50rpx;
+  color: orange;
+}
+
+.bill_bottom_contentList span {
+  font-size: 35rpx;
+}
+
+.bill_bottom_contentList_text {
+  font-size: 24rpx;
+  color: #ccc;
+}

pages/index/index.wxml

@@ -24,3 +24,6 @@
   </view>
   <van-button type="primary">按钮</van-button>
 </view>
+<!-- 两端对齐 -->
+
+

project.private.config.json

@@ -1,8 +1,40 @@
 {
   "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
-  "projectname": "miniprogram",
+  "projectname": "delivery-rider",
   "setting": {
     "compileHotReLoad": true
   },
-  "libVersion": "2.19.6"
+  "libVersion": "2.19.6",
+  "condition": {
+    "miniprogram": {
+      "list": [
+        {
+          "name": "",
+          "pathName": "pages/index/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null,
+          "partialCompile": {
+            "enabled": false,
+            "pages": [
+              "pages/billing_Statistics/index"
+            ]
+          }
+        },
+        {
+          "name": "",
+          "pathName": "pages/billing_Statistics/index",
+          "query": "",
+          "launchMode": "default",
+          "scene": null,
+          "partialCompile": {
+            "enabled": false,
+            "pages": [
+              "pages/billing_Statistics/index"
+            ]
+          }
+        }
+      ]
+    }
+  }
 }