余额接口修改

src/main.js

@@ -4,6 +4,7 @@ import App from './App.vue'
 import router from './router'
 import store from './store'
 import Vant from 'vant';
+
 import 'vant/lib/index.css';
 import './assets/scss/common.scss';
 import './assets/iconfont/iconfont.css'
@@ -15,6 +16,8 @@ document.title = '东信充值'
 Vue.use(Vant);
 Vue.config.productionTip = false
 Vue.prototype.$qs = querystring
+
+
 new Vue({
     router,
     store,

src/router/index.js

@@ -4,31 +4,46 @@ import VueRouter from 'vue-router'
 Vue.use(VueRouter)
 
 const routes = [{
-    path: '/',
-    name: 'Home',
-    component: () =>
-        import ( /* webpackChunkName: "about" */ '../views/home')
-}, {
-    path: '/balance',
-    name: 'balance',
-    component: () =>
-        import ( /* webpackChunkName: "about" */ '../views/balance')
-}, {
-    path: '/recharge',
-    name: 'recharge',
-    component: () =>
-        import ( /* webpackChunkName: "about" */ '../views/recharge')
-}, {
-    path: '/record',
-    name: 'record',
-    component: () =>
-        import ( /* webpackChunkName: "about" */ '../views/record')
-}, {
-    path: '/amount',
-    name: 'amount',
-    component: () =>
-        import ( /* webpackChunkName: "about" */ '../views/amount')
-}, ]
+        path: '/',
+        name: 'Home',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/home')
+    },
+    // {
+    //     path: '/login',
+    //     name: 'Login',
+    //     component: () =>
+    //         import ( /* webpackChunkName: "about" */ '../views/login')
+    // },
+    // {
+    //     path: '/function',
+    //     name: 'Function',
+    //     component: () =>
+    //         import ( /* webpackChunkName: "about" */ '../views/function')
+    // },
+
+    {
+        path: '/balance',
+        name: 'balance',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/balance')
+    }, {
+        path: '/recharge',
+        name: 'recharge',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/recharge')
+    }, {
+        path: '/record',
+        name: 'record',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/record')
+    }, {
+        path: '/amount',
+        name: 'amount',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/amount')
+    }
+]
 
 const router = new VueRouter({
     mode: 'hash',

src/views/balance/index.vue

@@ -31,38 +31,7 @@ export default {
   },
   mounted() {},
   created(){
-    let _this = this
-    // if(localStorage.getItem("balance")){
-    //   this.balance = localStorage.getItem("balance")
-    //   this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-    // }else{
-    //   var time = function (){
-    //     if(localStorage.getItem("balance")){
-    //       _this.balance = localStorage.getItem("balance")
-    //       _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-    //       clearInterval(val)
-    //     }
-    //     _this.num++
-    //     if(_this.num>15){
-    //       clearInterval(val)
-    //       _this.balance = "查询失败"
-    //       _this.createdTime = "更新时间：" + getNowTime()
-    //     }
-    //   }
-    //   var val = setInterval(time,1000)
-    // }
-
-    
-      // var time = function (){
-      //   _this.num++
-      //   if(_this.num>15){
-      //     clearInterval(val)
-      //     _this.balance = "查询失败"
-      //     _this.createdTime = "更新时间：" + getNowTime()
-      //   }
-      // }
-      _this.cardBalance()
-      // var val = setInterval(time,1000)
+    this.cardBalance()
   },
   methods: {
     shuaxin(){
@@ -72,119 +41,20 @@ export default {
       return (Date.parse(new Date(str)) / 1000)
     },
     cardBalance(){ //消费充值余额取最大值
-      let _this = this
-      let time1 = undefined
-      _this.balance = undefined
-       axios.post(`/dxtop/dish/page`,{
-        "size":1,
-        "current":1,
-        "userId":localStorage.getItem("user")
-      }).then(res =>{
-        //(res)
-        if(res.data.data.records){
-          if(res.data.data.records[0]){
-            if(res.data.data.records[0].balance){
-              _this.balanceHC = res.data.data.records[0].balance
-              time1 = _this.timeStamp(res.data.data.records[0].createTime)
-            }else{
-              _this.balanceHC = 0
-            }
+      if(localStorage.getItem("cardId")){
+        axios.get(`/dxtop/staff/cardBalance?card=${localStorage.getItem("cardId")}`).then(res => { //验证充值信息是否同步
+          if(res.data.data){
+            this.balance = res.data.data
           }else{
-            _this.balanceHC = 0
+            this.balance = "0.00"
           }
-        }else{
-           _this.balanceHC = "查询失败"
-        }
-
-        setTimeout(()=>{
-          axios.post(`/dxtop/charge/page`,{
-              "size":1,
-              "current":1,
-              "userId":localStorage.getItem("user")
-          }).then(res => {
-            if(res.data.data.records){
-              if(res.data.data.records[0]){
-                if(res.data.data.records[0].balance){
-                  if(typeof(_this.balanceHC) == "number"){
-                    if(time1 <= _this.timeStamp(res.data.data.records[0].createTime)){
-                      _this.balance = res.data.data.records[0].balance
-                      localStorage.setItem("getBalanceTime",getNowTime())
-                      _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-                    }else{
-                      _this.balance = _this.balanceHC
-                      localStorage.setItem("getBalanceTime",getNowTime())
-                      _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-                    }
-                  }
-                }else{
-                  _this.balance = "0.00"
-                  localStorage.setItem("getBalanceTime",getNowTime())
-                  _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-                }
-              }else{
-                _this.balance = "0.00"
-                localStorage.setItem("getBalanceTime",getNowTime())
-                _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-              }
-            }else{
-              _this.balance = "查询失败"
-              localStorage.setItem("getBalanceTime",getNowTime())
-              _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-            }
-          })
-        },100)
-      })
-
-
-
-
-
-      // 超长处理
-      // axios.get(`/dxtop/staff/one?id=${localStorage.getItem("user")}`).then(res => {
-      //   if(res.data?.data?.cardId){
-      //     axios.get(`/dxtop/staff/cardBalance`,{params:{"card":res.data.data.cardId}}).then(res2 => { //res.data.data.cardId
-      //     let msgFlag =undefined
-      //       axios.get(`/dxtop/msglog/one`,{params:{"id":res2.data.msg}}).then(res3 => {//res.msg
-      //           msgFlag = res3.data.data.msgFlag
-      //           let num = 0
-      //           var time = function (){
-      //             axios.get(`/dxtop/msglog/one`,{params:{"id":res2.data.msg}}).then(res4 => {//res.msg
-      //                 if(res4.data.data.msgFlag ==4){
-      //                   var data = JSON.parse(res4.data.data.consequence)
-      //                   if(data.code == 1){
-      //                     _this.balance = Number(data.balance).toFixed(2)
-      //                     localStorage.setItem("getBalanceTime",getNowTime())
-      //                     _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-      //                     clearInterval(val)
-      //                   }
-      //                 }
-      //             })
-      //             num+=2
-      //             console.log("余额加载秒数",num)
-      //             if(num>14){
-      //               _this.balance = "查询失败"
-      //               localStorage.setItem("getBalanceTime",getNowTime())
-      //               _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
-      //               clearInterval(val)
-                    
-      //             }
-      //           }
-      //           var val = setInterval(time,2000)
-      //       }).catch(err=>{
-      //         console.log(err)
-      //       })
-      //     }).catch(err=>{
-      //       console.log(err)
-      //     })
-      //   }else{
-      //     Toast("卡号不存在")
-      //   }
-         
-      // }).catch(() => {
-
-      // })
+        })
+      }else{
+        this.balance = "0.00"
+      }
+      localStorage.setItem("getBalanceTime",getNowTime())
+      this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
     },
-    
   },
 };
 </script>

src/views/function/index.vue

@@ -0,0 +1,136 @@
+<template>
+  <div class="mianBox">
+    <van-row class="headerBox">
+      功能
+    </van-row>
+    <van-row class="contentBox">
+      <van-row  type="flex" justify="space-between" gutter="10">
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >运营中心</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col>车牌登记</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >一卡通</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >智能会议</van-col>
+        </van-col>
+      </van-row>
+      <van-row  type="flex" justify="space-between" gutter="10">
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >运营中心</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col>车牌登记</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >一卡通</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >智能会议</van-col>
+        </van-col>
+      </van-row>
+      <van-row  type="flex" justify="space-between" gutter="10">
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >智慧餐饮</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col>文印助手</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >一卡通</van-col>
+        </van-col>
+        <van-col span="6">
+          <van-image :src="require('../../assets/image/function/icon1.png')" />
+          <van-col >智能会议</van-col>
+        </van-col>
+      </van-row>
+    </van-row>
+
+    <!-- <van-loading
+      size="24px"
+      v-if="loading"
+      color="#fff"
+      vertical
+      style="z-index: 999999; position: fixed; top: 40%; left: 0; right: 0"
+      >加载中...</van-loading
+    >
+    <van-overlay :show="loading" style="z-index: 100; position: fixed" /> -->
+  </div>
+</template>
+
+<script>
+import axios from "axios";
+import { getNowTime } from "@/assets/js/dataFormate";
+import { Toast } from "vant";
+import { Col, Row } from 'vant';
+export default {
+  data() {
+    return {
+      user:undefined,
+      type:undefined,
+      loading: false,
+    };
+  },
+  created(){
+    console.log(1111)
+    var url = window.location.href;
+
+  },
+  mounted() {
+  },
+  methods: {
+
+    
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.mianBox{
+    height: 100%;
+    width: 100%;
+    color: #FFF;
+    padding-top: 44px;
+    box-sizing: border-box;
+    background-color: #F7F7F7;
+    .contentBox{
+      width: 94%;
+      margin:20px 3%;
+      padding: 15px 20px;
+      box-sizing: border-box;
+      overflow: hidden;
+      background-color: #fff;
+      border-radius: 15px;
+      .van-row{
+        .van-col{
+          .van-col{
+            width:100%;
+            font-size: 12px;
+            color:#323232;
+            display: block;
+            text-align: center;
+          }
+          
+        }
+        .van-image{
+          width:100%;
+        }
+       
+      }
+    }
+}
+</style>

src/views/home/index.vue

@@ -89,10 +89,11 @@ export default {
           timeout: 10000,
         }).then(res =>{
           if(res.data?.data?.id){
+            //axios.get(`/dxtop/staff/one?id=0001T110000000002HBL`).then(res2 => { //验证充值信息是否同步
             axios.get(`/dxtop/staff/one?id=${res.data.data.id}`).then(res2 => { //验证充值信息是否同步
               if(res2.data.data){
-                this.user = res2.data.data.id
-                localStorage.setItem("user", this.user)
+                localStorage.setItem("user", res.data.data.id)
+                localStorage.setItem("cardId", res2.data.data.cardId)
               }else{
                 this.userNoAlert()
               }

src/views/login/index.vue

@@ -0,0 +1,327 @@
+<template>
+  <div class="mianBox">
+    <van-row class="loginHeaderBox">
+      登录
+    </van-row>
+    <van-row class="contentBox">
+        <van-col :span="24">
+          <div class="login">
+            <van-image :src="require('../../assets/image/login/login.png')" />
+          </div>
+        </van-col>
+        <van-col :span="24" class="form">
+          <van-col :span="24" class="name formtext">
+            <div class="icon">
+              <van-image :src="require('../../assets/image/login/icon1.png')" />
+            </div>
+            <div class="input">
+              <input type="text"  v-model="form.name" placeholder="请输入用户名">
+            </div>
+          </van-col>
+          <van-col :span="24" class="password formtext">
+            <div class="icon">
+              <van-image :src="require('../../assets/image/login/icon2.png')" />
+            </div>
+            <div class="input">
+              <input :type="passwordtxt"  v-model="form.password" placeholder="请输入密码">
+            </div>
+            <div class="eye">
+              <van-image :src="require('../../assets/image/login/eye.png')" />
+            </div>
+          </van-col>
+          <van-col>
+            <input type="checkbox" > 
+            <span class="checkboxText">记住密码</span>
+          </van-col>
+          <van-button class="loginBtn"  type="danger" @click="login">登 录</van-button>
+        </van-col>
+    </van-row>
+    
+  </div>
+</template>
+<script>
+import axios from "axios";
+import { getNowTime } from "@/assets/js/dataFormate";
+export default {
+  data() {
+    return {
+      passwordtxt:'text',
+      balance:undefined,
+      num:0,
+      createdTime:undefined,
+      balanceHC:undefined,
+      form:{
+        name:undefined,
+        password:undefined
+      }
+    };
+  },
+  mounted() {},
+  created(){
+    let _this = this
+    // if(localStorage.getItem("balance")){
+    //   this.balance = localStorage.getItem("balance")
+    //   this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+    // }else{
+    //   var time = function (){
+    //     if(localStorage.getItem("balance")){
+    //       _this.balance = localStorage.getItem("balance")
+    //       _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+    //       clearInterval(val)
+    //     }
+    //     _this.num++
+    //     if(_this.num>15){
+    //       clearInterval(val)
+    //       _this.balance = "查询失败"
+    //       _this.createdTime = "更新时间：" + getNowTime()
+    //     }
+    //   }
+    //   var val = setInterval(time,1000)
+    // }
+
+    
+      // var time = function (){
+      //   _this.num++
+      //   if(_this.num>15){
+      //     clearInterval(val)
+      //     _this.balance = "查询失败"
+      //     _this.createdTime = "更新时间：" + getNowTime()
+      //   }
+      // }
+      _this.cardBalance()
+      // var val = setInterval(time,1000)
+  },
+  methods: {
+    shuaxin(){
+      this.cardBalance()
+    },
+    timeStamp(str){
+      return (Date.parse(new Date(str)) / 1000)
+    },
+    cardBalance(){ //消费充值余额取最大值
+      let _this = this
+      let time1 = undefined
+      _this.balance = undefined
+       axios.post(`/dxtop/dish/page`,{
+        "size":1,
+        "current":1,
+        "userId":localStorage.getItem("user")
+      }).then(res =>{
+        //(res)
+        if(res.data.data.records){
+          if(res.data.data.records[0]){
+            if(res.data.data.records[0].balance){
+              _this.balanceHC = res.data.data.records[0].balance
+              time1 = _this.timeStamp(res.data.data.records[0].createTime)
+            }else{
+              _this.balanceHC = 0
+            }
+          }else{
+            _this.balanceHC = 0
+          }
+        }else{
+           _this.balanceHC = "查询失败"
+        }
+
+        setTimeout(()=>{
+          axios.post(`/dxtop/charge/page`,{
+              "size":1,
+              "current":1,
+              "userId":localStorage.getItem("user")
+          }).then(res => {
+            if(res.data.data.records){
+              if(res.data.data.records[0]){
+                if(res.data.data.records[0].balance){
+                  if(typeof(_this.balanceHC) == "number"){
+                    if(time1 <= _this.timeStamp(res.data.data.records[0].createTime)){
+                      _this.balance = res.data.data.records[0].balance
+                      localStorage.setItem("getBalanceTime",getNowTime())
+                      _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+                    }else{
+                      _this.balance = _this.balanceHC
+                      localStorage.setItem("getBalanceTime",getNowTime())
+                      _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+                    }
+                  }
+                }else{
+                  _this.balance = "0.00"
+                  localStorage.setItem("getBalanceTime",getNowTime())
+                  _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+                }
+              }else{
+                _this.balance = "0.00"
+                localStorage.setItem("getBalanceTime",getNowTime())
+                _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+              }
+            }else{
+              _this.balance = "查询失败"
+              localStorage.setItem("getBalanceTime",getNowTime())
+              _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+            }
+          })
+        },100)
+      })
+
+
+
+
+
+      // 超长处理
+      // axios.get(`/dxtop/staff/one?id=${localStorage.getItem("user")}`).then(res => {
+      //   if(res.data?.data?.cardId){
+      //     axios.get(`/dxtop/staff/cardBalance`,{params:{"card":res.data.data.cardId}}).then(res2 => { //res.data.data.cardId
+      //     let msgFlag =undefined
+      //       axios.get(`/dxtop/msglog/one`,{params:{"id":res2.data.msg}}).then(res3 => {//res.msg
+      //           msgFlag = res3.data.data.msgFlag
+      //           let num = 0
+      //           var time = function (){
+      //             axios.get(`/dxtop/msglog/one`,{params:{"id":res2.data.msg}}).then(res4 => {//res.msg
+      //                 if(res4.data.data.msgFlag ==4){
+      //                   var data = JSON.parse(res4.data.data.consequence)
+      //                   if(data.code == 1){
+      //                     _this.balance = Number(data.balance).toFixed(2)
+      //                     localStorage.setItem("getBalanceTime",getNowTime())
+      //                     _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+      //                     clearInterval(val)
+      //                   }
+      //                 }
+      //             })
+      //             num+=2
+      //             console.log("余额加载秒数",num)
+      //             if(num>14){
+      //               _this.balance = "查询失败"
+      //               localStorage.setItem("getBalanceTime",getNowTime())
+      //               _this.createdTime = "更新时间：" + localStorage.getItem("getBalanceTime")
+      //               clearInterval(val)
+                    
+      //             }
+      //           }
+      //           var val = setInterval(time,2000)
+      //       }).catch(err=>{
+      //         console.log(err)
+      //       })
+      //     }).catch(err=>{
+      //       console.log(err)
+      //     })
+      //   }else{
+      //     Toast("卡号不存在")
+      //   }
+         
+      // }).catch(() => {
+
+      // })
+    },
+    login(){
+      this.$router.push({ path: "/function"})
+    }
+    
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.mianBox{
+    height: 100%;
+    width: 100%;
+    color: #000;
+    position: fixed;
+    top:0;
+    left:0;
+    width:100%;
+    height:100%;
+    overflow: hidden;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    .loginHeaderBox {
+        height: 44px;
+        width: 100%;
+        position: fixed;
+        top: 0;
+        left: 0;
+        box-sizing: border-box;
+        text-align: center;
+        line-height: 44px;
+        color: #000;
+        font-size: 18px;
+        padding: 0 10px;
+        letter-spacing: 1px;
+        z-index: 1;
+        border-bottom:1px solid #ccc
+    }
+    .contentBox{
+        padding-bottom: 200px;
+        box-sizing: border-box;
+        .login{
+          width:50%;
+          margin:30% auto 10%;
+        }
+        .form{
+          width:100%;
+          margin-top:20px;
+          .formtext{
+            border:1px solid #ccc;
+            border-radius: 6px;
+          }
+          .van-col{
+            width:90%;
+            margin:10px 5%;
+            height:40px;
+            position: relative;
+            .icon{
+              width:20px;
+              margin:8px 10px 10px 10px;
+              display: inline-block;
+              vertical-align: middle;
+            }
+            .input{
+              width:84%;
+              height:25px;
+              line-height: 25px;
+              margin-top:-6px;
+              vertical-align: middle;
+              display: inline-block;
+              font-size: 14px;
+              input{
+               width:85%;
+               border:none
+              }
+            }
+            input[type='checkbox']{
+              width:20px;
+              width:20px;
+              display: inline-block;
+              zoom:160%;
+              margin-left:-4px;
+              
+            }
+            .checkboxText{
+              margin-top:1px;
+              display: inline-block;
+              vertical-align: top;
+            }
+            .checkbox-wp .checkbox-checked {
+              border-color: #387ef5;
+              background-color: #387ef5;
+            }
+            .eye{
+               width:20px;
+              position: absolute;
+              right:10px;
+              top:10px;
+            }
+          }
+          .loginBtn{
+            border-radius: 10px;
+            width: 90%;
+            height: 50px;
+            margin:20px 5%;
+            font-size: 18px;
+            
+          }
+        }
+    }
+    
+    
+}
+</style>

src/views/record/index copy.vue

@@ -0,0 +1,337 @@
+<template>
+  <div class="mianBox">
+    <van-row class="headerBox">
+      <van-icon name="arrow-left" @click="$router.go(-1)" />
+      交易记录
+    </van-row>
+    <van-tabs
+      v-model="active"
+      class="type"
+      color="red"
+      line-width="60px"
+      @click="tab"
+    >
+      <van-tab title="充值记录">
+        <!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh"> -->
+          <van-list
+            v-model="loading"
+            :finished="finished"
+            finished-text="没有更多了"
+            @load="onLoad"
+            :style="height"
+            class="listData"
+            line-width="60px"
+            :immediate-check="false"
+          >
+            <van-row
+              class="listBoxCell"
+              v-for="(item, index) in recharge"
+              :key="index"
+            >
+              <van-col span="18">
+                <van-row class="jlName">{{ item.shopName }}</van-row>
+                <van-row class="jlTime">时间：{{ item.createTime }}</van-row>
+                <van-row class="jlBalance">余额：{{ item.balance }} 元</van-row>
+              </van-col>
+              <van-col span="6" class="jlMoney just">{{ item.amt }}元</van-col>
+            </van-row>
+          </van-list>
+        <!-- </van-pull-refresh> -->
+      </van-tab>
+      <van-tab title="消费记录">
+        <!-- <van-pull-refresh v-model="refreshing" @refresh="onRefresh"> -->
+          <van-list
+            v-model="loading"
+            :finished="finished"
+            finished-text="没有更多了"
+            @load="onLoad"
+            class="listData"
+            :immediate-check="false"
+          >
+            <van-row class="listBoxCell" v-for="(item, index) in consumption" :key="index">
+              <van-col span="18">
+                <van-row class="jlName">{{ item.shopName }}</van-row>
+                <van-row class="jlTime">时间：{{ item.createTime }}</van-row>
+                <van-row class="jlBalance">余额：{{ item.balance }} 元</van-row>
+              </van-col>
+              <van-col span="6" class="jlMoney negative"> - {{ item.amt }}元</van-col>
+            </van-row>
+          </van-list>
+        <!-- </van-pull-refresh> -->
+      </van-tab>
+    </van-tabs>
+    <van-datetime-picker
+      
+      v-model="currentDate"
+      type="date"
+      title="选择年月日"
+      :min-date="minDate"
+      :max-date="maxDate"
+      class="timeSelect"
+    />
+    <!-- <van-cell
+      title="选择日期区间"
+      :value="date"
+      @click="show = true"
+      class="timeSelect"
+    />
+    <van-calendar
+      v-model="show"
+      type="range"
+      @confirm="onConfirm"
+      :min-date="minDate"
+    /> -->
+  </div>
+</template>
+
+<script>
+import { Toast, } from "vant";
+import { DatetimePicker } from 'vant';
+export default {
+  data() {
+    return {
+      minDate: new Date(2020, 0, 1),
+      maxDate: new Date(2025, 10, 1),
+      currentDate: new Date(2021, 0, 17),
+      recharge: [],//支付记录
+      consumption: [], //消费记录
+      loading: false,
+      finished: false,
+      refreshing: true,
+      height: {
+        height: false,
+      },
+      active: 0,
+      date: "",
+      show: false,
+      minDate: new Date(2020, 1, 1),
+      page1:1,
+      page2:1,
+      current:20,
+      isref:true,
+      starTime:undefined,
+      endTime:undefined
+    };
+  },
+  components: {
+    [Toast.name]: Toast,
+  },
+  created() {
+    this.height.height = document.documentElement.clientHeight - 120 + "px";
+    if(localStorage.getItem("user")){
+      this.charge()
+    }else{
+      this.finished = true
+    }
+  },
+  
+  methods: {
+    tab(name, title) {
+      this.date = "";
+      this.active = name
+      if (name == 0) {
+        if (this.recharge.length == 0) {
+          this.charge()
+        }
+        this.starTime = undefined,
+        this.endTime = undefined
+      } else {
+        if (this.consumption.length == 0) {
+          this.dish()
+        }
+      }
+      
+    },
+    formatDate(date) {
+      return `${date.getMonth() + 1}/${date.getDate()}`;
+    },
+    onConfirm(date) {
+      this.show = false;
+      var start_ = new Date(date[0]);
+      this.starTime =start_.getFullYear() +"-" +(start_.getMonth() + 1) +"-" +start_.getDate() + ' ' + '00:00:00' 
+      var end_ = new Date(date[1]);
+      this.endTime = end_.getFullYear() + "-" + (end_.getMonth() + 1) + "-" + end_.getDate() + ' ' + '23:59:59' 
+      this.date = this.starTime.slice(0,10) + " 至 " + this.endTime.slice(0,10);
+      this.isref = true
+      if(this.active == 0){
+        this.page1 = 1
+        this.charge()
+        this.recharge = []
+      }else{
+        this.page2 = 1
+        this.consumption = []
+        this.dish()
+      }
+    },
+    charge(){//充值
+      axios.post(`/dxtop/charge/page`,{
+          "startTime":this.starTime, 
+          "endTime":this.endTime,
+          "size":this.current,
+          "current":this.page1,
+          "userId":localStorage.getItem("user")
+      }).then(res => {
+        if (res?.data?.data?.records.length > 0) {
+          let data = res.data.data.records
+          for(let i =0;i<data.length;i++){
+            if(data[i].type == "31") {//减帐
+              data[i].amt = "- " + data[i].amt
+            }else{
+              data[i].amt = "+ " + data[i].amt
+            }
+            this.recharge.push(data[i])
+          }
+          this.page1 ++
+          this.isref = true
+          
+        } else {
+          this.page1--
+          this.isref = false
+          this.finished = true
+        }
+        this.loading = false
+      }).catch(err =>{
+        console.log(err)
+      })
+    },
+    dish(){//消费
+      axios.post(`/dxtop/dish/page`,{
+        "startTime":this.starTime, 
+        "endTime":this.endTime,
+        "size":this.current,
+        "current":this.page2,
+        "userId":localStorage.getItem("user")
+      }).then(res => {
+        if (res?.data?.data?.records.length > 0) {
+          let data = res.data.data.records
+          for(let i =0;i<data.length;i++){
+            this.consumption.push(data[i])
+          }
+          this.page2 ++
+          this.isref = true
+        } else {
+          this.page2--
+          this.isref = false
+          this.finished = true
+        }
+        this.loading = false
+      })
+    },
+    onLoad() {
+      if(timeout){
+        clearTimeout(timeout);
+      }
+      let timeout = setTimeout(() => {//节流
+        if (this.isref) {
+          this.loading = true;
+          //防止多次上滑动导致page等于2没加载出来就加载page等于3的内容
+          this.isref = false;
+          if(this.active == 0){
+            this.charge()
+          }else{
+            this.dish()
+          }
+          this.loading = false;
+        }
+	    }, 1000);
+    },
+    onRefresh() {
+      
+      // 清空列表数据
+      // this.finished = false;
+      // console.log(1111)
+      // // 重新加载数据
+      // // 将 loading 设置为 true，表示处于加载状态
+      // this.loading = false;
+      // this.onLoad();
+    },
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.mianBox {
+  width: 100vw;
+  padding-top: 44px;
+  height: 100vh;
+  color: #000;
+  box-sizing: border-box;
+  overflow-y: hidden;
+}
+.listBoxCell {
+  height: 75px;
+  width: 100%;
+  padding: 10px 10px 10px;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  border-bottom: 1px solid rgba(237, 237, 237, 1);
+  .jlName {
+    font-size: 14px;
+    color: #000;
+  }
+  .jlTime {
+    margin-top: 5px;
+    font-size: 12px;
+    color: #ccc;
+  }
+  .jlBalance {
+    margin-top: 5px;
+    font-size: 14px;
+    color: rgba(242, 46, 60, 1);
+  }
+  .jlMoney {
+    text-align: right;
+    font-size: 16px;
+  }
+  .jlMoney.just {
+    color: rgba(56, 129, 253, 1);
+  }
+  .jlMoney.negative {
+    color: rgba(242, 46, 60, 1);
+  }
+}
+.van-list {
+  overflow-y: auto;
+}
+.timeSelect{
+  width:100%;
+  position: absolute; 
+  top: 92px; 
+  left: 0; 
+  z-index: 10
+}
+.listData{
+  margin-top:40px;
+  height:calc(100vh - 10rem);
+  overflow-y: scroll;
+}
+/deep/ .van-list__finished-text{
+  margin-bottom:30px !important;
+}
+@media screen and (max-width:374px){
+  .timeSelect{
+    position: absolute; 
+    top: 86px; 
+  }
+}
+@media screen and (max-width:350px){
+  .timeSelect{
+    position: absolute; 
+    top: 84px; 
+  }
+}
+@media screen and (min-width:410px){
+  .listData{
+    margin-top:50px
+  }
+}
+</style>
+<style>
+/* .van-cell__title, .van-cell__value{
+  flex:none
+}
+.van-cell__value{
+  margin-left:20px
+} */
+</style>

src/views/record/index.vue

@@ -60,6 +60,15 @@
         <!-- </van-pull-refresh> -->
       </van-tab>
     </van-tabs>
+    <!-- <van-datetime-picker
+      v-if="timeStatus"
+      v-model="currentDate"
+      type="date"
+      title="选择年月日"
+      :min-date="minDate"
+      :max-date="maxDate"
+      class="timeSelect"
+    /> -->
     <van-cell
       title="选择日期区间"
       :value="date"
@@ -77,9 +86,25 @@
 
 <script>
 import { Toast, } from "vant";
+import { DatetimePicker } from 'vant';
 export default {
   data() {
     return {
+      minDate: new Date(2020, 0, 1),
+      maxDate: new Date(2099, 10, 1),
+      currentDate: new Date(2021, 0, 17),
+      timeStatus:true,
+
+
+
+
+
+
+
+
+
+
+
       recharge: [],//支付记录
       consumption: [], //消费记录
       loading: false,
@@ -223,7 +248,6 @@ export default {
 	    }, 1000);
     },
     onRefresh() {
-      
       // 清空列表数据
       // this.finished = false;
       // console.log(1111)
@@ -282,7 +306,10 @@ export default {
   overflow-y: auto;
 }
 .timeSelect{
-  position: absolute; 
+  // width:100%;
+  // height:30%;
+  // position: fixed; 
+  position: absolute;
   top: 92px; 
   left: 0; 
   z-index: 10

vuepay/index.html

@@ -1 +1 @@
-<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><meta name="format-detection" content="telephone=yes"><link rel="icon" href="/vuepay/favicon.ico"><script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script><title></title><script></script><link href="/vuepay/static/css/about.e0e5630e.css" rel="prefetch"><link href="/vuepay/static/js/about.21fe78f9.js" rel="prefetch"><link href="/vuepay/static/css/app.c691c8f1.css" rel="preload" as="style"><link href="/vuepay/static/css/chunk-vendors.9e9d9b26.css" rel="preload" as="style"><link href="/vuepay/static/js/app.ce725d7f.js" rel="preload" as="script"><link href="/vuepay/static/js/chunk-vendors.635a522f.js" rel="preload" as="script"><link href="/vuepay/static/css/chunk-vendors.9e9d9b26.css" rel="stylesheet"><link href="/vuepay/static/css/app.c691c8f1.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/vuepay/static/js/chunk-vendors.635a522f.js"></script><script src="/vuepay/static/js/app.ce725d7f.js"></script></body></html>
+<!DOCTYPE html><html lang=""><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no"><meta name="format-detection" content="telephone=yes"><link rel="icon" href="/vuepay/favicon.ico"><script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script><title></title><script></script><link href="/vuepay/static/css/about.b57d5f61.css" rel="prefetch"><link href="/vuepay/static/js/about.f7fc3ce9.js" rel="prefetch"><link href="/vuepay/static/css/app.c691c8f1.css" rel="preload" as="style"><link href="/vuepay/static/css/chunk-vendors.9e9d9b26.css" rel="preload" as="style"><link href="/vuepay/static/js/app.4cafe8ba.js" rel="preload" as="script"><link href="/vuepay/static/js/chunk-vendors.635a522f.js" rel="preload" as="script"><link href="/vuepay/static/css/chunk-vendors.9e9d9b26.css" rel="stylesheet"><link href="/vuepay/static/css/app.c691c8f1.css" rel="stylesheet"></head><body><noscript><strong>We're sorry but doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app"></div><script src="/vuepay/static/js/chunk-vendors.635a522f.js"></script><script src="/vuepay/static/js/app.4cafe8ba.js"></script></body></html>