zjcdetail.vue 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <view class="content">
  3. <view class="v-top">
  4. <image src="../../static/img/zjc-bg.png" mode="" class="top-bg"></image>
  5. <view class="top-num">
  6. {{all || 0}}
  7. </view>
  8. </view>
  9. <scroll-view class="list-scroll-content" scroll-y @scrolltolower="loadData" :style="{'heihgt': height}">
  10. <!-- 空白页 -->
  11. <!-- <empty v-if="loaded == true && list.length === 0"></empty> -->
  12. <!-- 订单列表 -->
  13. <view v-for="(item, index) in list" :key="index" class="order-item flex">
  14. <view class="title-box flex_item">
  15. <view class="title-avatar"><image :src="item.avatar"></image></view>
  16. <view class="list_tpl">
  17. <view class="title">
  18. <text>{{ item.nickname }}</text>
  19. </view>
  20. <view class="time">
  21. <text>{{ item.time }}</text>
  22. </view>
  23. </view>
  24. </view>
  25. </view>
  26. <uni-load-more :status="loadingType"></uni-load-more>
  27. </scroll-view>
  28. </view>
  29. </template>
  30. <script>
  31. import uniLoadMore from '@/components/uni-load-more/uni-load-more.vue';
  32. import empty from '@/components/empty';
  33. export default {
  34. data() {
  35. return {
  36. all: '',
  37. height: '',
  38. list: [],
  39. loadingType: 'more',
  40. page: 1,
  41. limit: 10,
  42. loaded: true
  43. }
  44. },
  45. components: {
  46. uniLoadMore,
  47. empty
  48. },
  49. onReady(res) {
  50. var _this = this;
  51. uni.getSystemInfo({
  52. success: resu => {
  53. const query = uni.createSelectorQuery();
  54. query.select('.list-scroll-content').boundingClientRect();
  55. query.exec(function(res) {
  56. _this.maxheight = resu.windowHeight - res[0].top + 'px';
  57. console.log('打印页面的剩余高度', _this.maxheight);
  58. });
  59. },
  60. fail: res => {}
  61. });
  62. },
  63. methods: {
  64. loadData() {
  65. }
  66. }
  67. }
  68. </script>
  69. <style lang="scss" scoped>
  70. .v-top {
  71. position: relative;
  72. height: 470rpx;
  73. width: 750rpx;
  74. .top-bg {
  75. position: absolute;
  76. width: 750rpx;
  77. height: 470rpx;
  78. }
  79. .top-num {
  80. position: relative;
  81. padding-top: 200rpx;
  82. font-size: 72rpx;
  83. font-family: PingFang SC;
  84. font-weight: bold;
  85. color: #fff;
  86. text-align: center;
  87. }
  88. .list-scroll-content {
  89. position: relative;
  90. }
  91. }
  92. </style>