index.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. <template>
  2. <view class="carbox">
  3. <view class="flex1 cartop">
  4. <box-list :datainfo="list" type="mycar" @getDetail="getDetail"></box-list>
  5. <view class="cartips flexc mt16 mb16" @click="getChargeFn">
  6. <view class="tit flex1">当前有车辆<text class="co025">充电中…</text></view>
  7. <image :src="rimg"></image>
  8. </view>
  9. </view>
  10. <view class="plr12 flex0">
  11. <view class="rhbtn" @click="getAddFn">添加车辆</view>
  12. </view>
  13. <loading></loading>
  14. </view>
  15. </template>
  16. <script>
  17. import config from '@/config'
  18. const baseUrl = config.baseUrl
  19. import boxList from "@/mine/components/box/list.vue"
  20. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  21. import {carList} from "@/api/work/car.js"
  22. import {getDictionaryFn} from "@/api/system/user.js"
  23. export default{
  24. components:{boxList},
  25. data(){
  26. return{
  27. rimg: require('@/mine/static/house/rimg.png'),
  28. list:[],
  29. pageSize: 10,
  30. pageNum: 1,
  31. reachflag: true,
  32. wtdt:'',
  33. }
  34. },
  35. onUnload() {
  36. uni.$off('refcarList')
  37. },
  38. onLoad: function() {
  39. uni.$on('refcarList',(res)=>{
  40. this.getDataFn()
  41. })
  42. this.init()
  43. this.getDataFn()
  44. },
  45. // 上拉触底加载更多触发事件
  46. onReachBottom() {
  47. if (this.reachflag) {
  48. this.pageNum++
  49. this.getDataFn()
  50. }
  51. },
  52. methods:{
  53. checkPermi, checkRole,
  54. init(){
  55. // 车型
  56. getDictionaryFn('cartype').then(res=>{
  57. if(res.code==200){
  58. this.sfList = res.data.map(v => {
  59. return {
  60. dictLabel: v.dictLabel,
  61. dictValue: v.dictValue
  62. }
  63. })
  64. }
  65. })
  66. },
  67. getAddFn(){
  68. this.$tab.navigateTo("/mine/pages/car/addcar")
  69. },
  70. getDetail(id){
  71. this.$tab.navigateTo("/mine/pages/car/addcar?id="+id)
  72. },
  73. getChargeFn(){
  74. this.$tab.navigateTo("/mine/pages/car/charge")
  75. },
  76. getDataFn(){
  77. var params={
  78. pageSize:this.pageSize,
  79. pageNum: this.pageNum,
  80. }
  81. carList(params).then(res=>{
  82. if(res.code==200){
  83. if (res.rows.length < this.pageSize) {
  84. this.reachflag = false
  85. this.wtdt = '到底了~';
  86. } else {
  87. var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1)
  88. if (num < res.total) {
  89. this.reachflag = true
  90. this.wtdt = ''
  91. } else {
  92. this.reachflag = false
  93. this.wtdt = '到底了~';
  94. }
  95. }
  96. var newArr=JSON.parse(JSON.stringify(res.rows))
  97. newArr.forEach(ite=>{
  98. ite.right=0;
  99. })
  100. if (this.pageNum == 1) {
  101. this.list = newArr;
  102. } else {
  103. this.list = this.list.concat(newArr)
  104. }
  105. }else{
  106. this.$toast(res.msg)
  107. }
  108. })
  109. },
  110. }
  111. }
  112. </script>
  113. <style>
  114. page{background: #F3F3F0;}
  115. </style>
  116. <style lang="scss" scoped>
  117. .carbox{display: flex;flex-direction: column;min-height: 100vh;padding: 22rpx 18rpx 100rpx;
  118. .cartop{overflow: auto;}
  119. .cartips{background: #FFFFFF;border-radius: 20rpx;height: 98rpx;padding: 0 24rpx;
  120. image{width: 16rpx;height: 28rpx;flex: 0 0 auto;margin-left: 20rpx;}
  121. .tit{font-weight: bold;font-size: 26rpx;color: #272727;}
  122. }
  123. }
  124. </style>