LogList.vue 3.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108
  1. <template><page-meta :root-font-size="fontSize+'px'"></page-meta>
  2. <seller-base :show="false"><view style="position: absolute;top:0;right:0;left:0;bottom:0" class="scroll-view-wrapper div container">
  3. <view class="div common-header-wrap">
  4. <view class="status-holder"></view>
  5. <view :style="'height:'+navHeight+'px'"></view>
  6. <view class="common-header-holder"></view>
  7. <view class="common-header-fixed">
  8. <title-header />
  9. <uni-nav-bar title="账号日志" class="common-header" left-icon="back" @clickLeft="goBack()">
  10. </uni-nav-bar>
  11. </view>
  12. </view>
  13. <view class="scroll-view div" style="position:relative">
  14. <scroll-view style="position: absolute;top:0;right:0;left:0;bottom:0" class="div mt-5" @scrolltolower="loadMore" scroll-y="true">
  15. <view class="div item mb-5" v-for="item in logList" :key="item.log_id">
  16. <view class="div mt">
  17. <text class="h2">{{item.sellerlog_seller_name}}</text><text class="em time"> {{ $moment.unix(item.sellerlog_time).format('YYYY-MM-DD h:mm:ss') }}</text>
  18. </view>
  19. <view class="div mc">
  20. {{item.sellerlog_content}}
  21. </view>
  22. </view>
  23. </scroll-view>
  24. </view>
  25. </view>
  26. </seller-base>
  27. </template>
  28. <script>
  29. import {getFontSize} from '@/util/common'
  30. import TitleHeader from '../../TitleHeader'
  31. import SellerBase from '../SellerBase'
  32. import EmptyRecord from '../../EmptyRecord'
  33. import { getSellerLogList } from '../../../api/seller'
  34. export default {
  35. name: 'LogList',
  36. components:{
  37. TitleHeader,
  38. SellerBase,
  39. EmptyRecord
  40. },
  41. computed:{
  42. fontSize(){
  43. return getFontSize()
  44. },
  45. },
  46. data(){
  47. return {
  48. navHeight: 0,
  49. params: { 'page': 0, 'per_page': 10 },
  50. loading: false, // 是否加载更多
  51. isMore: true, // 是否有更多
  52. logList: false // 记录列表
  53. }
  54. },
  55. created () {
  56. this.loadMore()
  57. },
  58. mounted(){
  59. // #ifdef MP-WEIXIN
  60. this.navHeight = uni.getMenuButtonBoundingClientRect().height
  61. // #endif
  62. },
  63. methods:{
  64. goBack(){uni.navigateBack({delta:1})},
  65. getLogList (ispush) {
  66. uni.showLoading({ title: '加载中' })
  67. let params = this.params
  68. getSellerLogList(params).then(res => {
  69. uni.hideLoading()
  70. if (ispush && this.logList) {
  71. this.logList = this.logList.concat(res.result.log_list)
  72. } else {
  73. this.logList = res.result.log_list
  74. }
  75. if (res.result.hasmore) {
  76. this.isMore = true
  77. } else {
  78. this.isMore = false
  79. }
  80. }).catch(error=>{
  81. uni.hideLoading()
  82. uni.showToast({icon:'none',title: error.message})
  83. })
  84. },
  85. loadMore () {
  86. this.loading = true
  87. this.params.page = ++this.params.page
  88. if (this.isMore) {
  89. this.loading = false
  90. this.getLogList(true)
  91. }
  92. }
  93. }
  94. }
  95. </script>
  96. <style scoped lang="scss">
  97. .scroll-view-wrapper{display: flex;flex-direction: column;}
  98. .scroll-view{flex:1}
  99. .item{padding:.5rem;background:#fff;}
  100. .item .mt{height:1rem;line-height:1rem;}
  101. .item .mt .h2{float:left;font-size:$subFontSize;font-weight:600;}
  102. .item .mt .em{float:right;font-size:$fontSize;color: #999;}
  103. .item .mc{padding-top:.5rem;line-height:1rem;font-size:$h6;color:#999}
  104. </style>