index.vue 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <template>
  2. <view class="car">
  3. <view class="cartop">
  4. <!-- <view class="toptit">
  5. <image :src="djtop"></image>本社区党员共<text>367</text>人
  6. </view> -->
  7. <view class="tabtop flexc">
  8. <view class="tabt" :class="tabval==ite.val?'act':''" v-for="(ite,idx) in tablist" :key="idx" @click="getTabFn(ite.val)">{{ite.tit}}</view>
  9. </view>
  10. </view>
  11. <!-- 列表 -->
  12. <view class="carlists">
  13. <box-list :datainfo="list" :wtdt="wtdt" type='delivery' @getDetail="getDetail"></box-list>
  14. </view>
  15. <loading></loading>
  16. </view>
  17. </template>
  18. <script>
  19. import config from '@/config'
  20. const baseUrl = config.baseUrl
  21. import boxList from "@/mine/components/box/list.vue"
  22. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  23. export default{
  24. components:{boxList},
  25. data(){
  26. return{
  27. cxrq:"",
  28. text:'',
  29. list:[{tit:'皖A IC520',type:1,right:0},{tit:'晋E KD783',type:2,right:0},],
  30. pageSize: 10,
  31. pageNum: 1,
  32. reachflag: true,
  33. wtdt:'',
  34. tabval:'0',
  35. tablist:[{tit:'在途快递',val:0},{tit:'最近签收',val:1}]
  36. }
  37. },
  38. onLoad: function() {
  39. },
  40. // 上拉触底加载更多触发事件
  41. onReachBottom() {
  42. if (this.reachflag) {
  43. this.pageNum++
  44. this.getDataFn()
  45. }
  46. },
  47. methods:{
  48. checkPermi, checkRole,
  49. getDetail(){
  50. this.$tab.navigateTo("/mine/pages/delivery/detail")
  51. },
  52. getTabFn(val){
  53. this.tabval=val
  54. },
  55. getrefreshData(){
  56. this.pageNum=1;
  57. this.list=[];
  58. this.reachflag=true;
  59. this.getDataFn()
  60. },
  61. bindDateChangea(e){
  62. var val=e.detail.value;
  63. this.cxrq=val;
  64. },
  65. getDataFn(){
  66. var params={
  67. pageSize:this.pageSize,
  68. pageNum: this.pageNum,
  69. }
  70. params.noticeType=this.tabidx
  71. getNoticeList(params).then(res=>{
  72. if(res.code==200){
  73. if (res.rows.length < this.pageSize) {
  74. this.reachflag = false
  75. this.wtdt = '到底了~';
  76. } else {
  77. var num = parseInt(res.rows.length) + parseInt(this.pageSize) * parseInt(this.pageNum - 1)
  78. if (num < res.total) {
  79. this.reachflag = true
  80. this.wtdt = ''
  81. } else {
  82. this.reachflag = false
  83. this.wtdt = '到底了~';
  84. }
  85. }
  86. var newArr=JSON.parse(JSON.stringify(res.rows))
  87. newArr.forEach(ite=>{
  88. ite.right=0;
  89. })
  90. // console.log(newArr,555)
  91. if (this.pageNum == 1) {
  92. this.list = newArr;
  93. } else {
  94. this.list = this.list.concat(newArr)
  95. }
  96. }else{
  97. this.$toast(res.msg)
  98. }
  99. })
  100. },
  101. }
  102. }
  103. </script>
  104. <style>
  105. page{background: #F3F3F0;}
  106. </style>
  107. <style lang="scss" scoped>
  108. .car{padding: 134rpx 0 10rpx;}
  109. .cartop{position: fixed;left: 0;right: 0;top: 0;background-color: #ffffff;z-index: 2;
  110. .toptit{display: flex;justify-content: center;font-weight: 500;font-size: 26rpx;color: #8592AA;height: 70rpx;align-items: center;
  111. background: #E4EDFF;
  112. text{font-size: 32rpx;color: #0156FE;padding: 0 10rpx;}
  113. image{width: 28rpx;height: 26rpx;flex: 0 0 auto;margin-right: 12rpx;}
  114. }
  115. .tabtop{padding-bottom: 40rpx;padding-top: 14rpx;
  116. .tabt{font-weight: 500;font-size: 32rpx;color: #666666;position: relative;line-height: 56rpx;padding: 0 40rpx;
  117. &.act{font-weight: bold;font-size: 32rpx;color: #272727;
  118. &::after{content: '';width: 40rpx;height: 10rpx;background: #0156FE;border-radius: 6rpx;position: absolute;left: 50%;margin-left: -20rpx;bottom: -10rpx;}
  119. }
  120. }
  121. }
  122. }
  123. .carlists{padding: 0 18rpx;}
  124. </style>