list.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
  1. <template>
  2. <view>
  3. <view class="search">
  4. <u-search placeholder="搜索商品名称" v-model="param.customerName" bgColor="white" @search="refresh()" :animation="true" actionText="取消" @clear="refresh()"></u-search>
  5. <view class="clear"></view>
  6. </view>
  7. <view class="goodsList">
  8. <view class="sort-list">
  9. <view class="sort-item" :class="{ active: item.check }" v-for="(item, index) in sort" :key="index" @click="select(item, index)">
  10. <text>{{ item.name }}</text>
  11. <text v-if="index > 0 && item.isAsc == 'desc'" class="icon">&#xeb0a;</text>
  12. <text v-if="index > 0 && item.isAsc == 'asc'" class="icon">&#xeb0b;</text>
  13. </view>
  14. <view class="type" @click="show = true">
  15. <text>分类</text>
  16. <text class="icon">&#xe8f2;</text>
  17. </view>
  18. <view class="clear"></view>
  19. </view>
  20. <view class="item" v-for="(item, index) in list" :key="index" @click="detail(item)">
  21. <view class="title">广西京东自营店南宁分店</view>
  22. <image src="../../../static/news.jpg" mode="aspectFill" class="pic"></image>
  23. <view class="con">
  24. <view class="productName omit">八角茴香(未磨)(可食用)</view>
  25. <view class="desc">50吨</view>
  26. <view class="price">¥ 5000</view>
  27. <view class="icon buy" v-if="user.userType == 2">&#xe604;</view>
  28. </view>
  29. <view class="clear"></view>
  30. </view>
  31. </view>
  32. <productType v-model="show"></productType>
  33. </view>
  34. </template>
  35. <script>
  36. export default {
  37. data() {
  38. return {
  39. user: this.getUser(),
  40. show: false,
  41. sort: [
  42. {
  43. name: '综合',
  44. key: 1,
  45. isAsc: 'desc',
  46. check: false
  47. },
  48. {
  49. name: '日期',
  50. key: 2,
  51. isAsc: 'desc',
  52. check: false
  53. },
  54. {
  55. name: '价格',
  56. key: 3,
  57. isAsc: 'desc',
  58. check: false
  59. }
  60. ],
  61. list: [{}, {}, {}, {}],
  62. param: { pageNo: 1, pageSize: 10 },
  63. loadMore: true
  64. };
  65. },
  66. onLoad(e) {
  67. //this.getData();
  68. },
  69. methods: {
  70. getData() {
  71. this.http.request({
  72. url: '/level-one-server/app/TbGoodsTransit/getTransitList',
  73. data: this.param,
  74. loading: 'false',
  75. success: res => {
  76. this.loadMore = parseInt(res.data.pageCount) > this.param.pageNo;
  77. this.list.push(...res.data.data);
  78. }
  79. });
  80. },
  81. detail(item) {
  82. uni.navigateTo({ url: '/pages/market/two/detail?id=' + item.id });
  83. },
  84. //刷新数据
  85. refresh() {
  86. this.loadMore = true;
  87. this.param.pageNum = 1;
  88. this.list = [];
  89. this.getData();
  90. }
  91. },
  92. //下拉刷新
  93. onPullDownRefresh() {
  94. setTimeout(() => {
  95. this.refresh();
  96. uni.stopPullDownRefresh();
  97. }, 1000);
  98. },
  99. //上拉加载
  100. onReachBottom() {
  101. if (this.loadMore) {
  102. this.param.pageNum++;
  103. this.getData();
  104. }
  105. }
  106. };
  107. </script>
  108. <style lang="scss">
  109. page {
  110. background-color: $pg;
  111. }
  112. .search {
  113. padding: 12px 12px 0px 12px;
  114. }
  115. </style>