index.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146
  1. <template>
  2. <view class="orderPage">
  3. <van-sticky :offset-top="40">
  4. <van-tabs
  5. sticky
  6. v-model="searchForm.basetype"
  7. class="van-hairline--bottom"
  8. @click="tabList(searchForm.basetype)"
  9. >
  10. <van-tab
  11. v-for="(item, key) in tabOptions"
  12. :key="key"
  13. :title="`${item.name}(${item.num})`"
  14. ></van-tab>
  15. </van-tabs>
  16. </van-sticky>
  17. <!-- :finished="finished" -->
  18. <van-list
  19. v-model="loading"
  20. :immediate-check="false"
  21. :error.sync="error"
  22. error-text="请求失败,点击重新加载"
  23. finished-text="没有更多了~"
  24. @load="getList"
  25. >
  26. <view
  27. class="list-item"
  28. v-for="(item, key) in pcsjList"
  29. :key="key"
  30. @click="goDetail(item)"
  31. >
  32. <div class="nameTitle">{{ item.name }}</div>
  33. <div>下发时间:{{ item.jsdw }}</div>
  34. <div>结束时间:{{ item.jsdw }}</div>
  35. <div>核查图斑:{{ item.spotsnumber || 0 }}个</div>
  36. <div>核查人员:{{ item.jsdw }}</div>
  37. <view class="status">{{ item.status }}</view>
  38. </view>
  39. </van-list>
  40. </view>
  41. </template>
  42. <script>
  43. import { listPcsj } from "@/api/apis.js";
  44. import order from "./order.vue";
  45. export default {
  46. name: "list",
  47. components: {
  48. order,
  49. },
  50. data() {
  51. return {
  52. searchForm: {},
  53. tabOptions: [
  54. {
  55. name: "全部",
  56. num: 2,
  57. },
  58. {
  59. name: "未完成",
  60. num: 1,
  61. },
  62. {
  63. name: "已完成",
  64. num: 1,
  65. },
  66. ],
  67. queryParams: {},
  68. loading: false,
  69. pcsjList: [
  70. {
  71. name: "sjcdsicjdifc",
  72. status: 0,
  73. },
  74. {},
  75. {},
  76. {},
  77. {},
  78. {},
  79. ],
  80. total: 0,
  81. };
  82. },
  83. mounted() {
  84. // this.getList();
  85. },
  86. unmounted() {},
  87. methods: {
  88. getList() {
  89. this.loading = true;
  90. console.log("ss1ss", listPcsj(this.queryParams));
  91. listPcsj(this.queryParams).then((res) => {
  92. console.log(res, "00s00s");
  93. this.pcsjList = res.rows;
  94. this.total = res.total;
  95. this.loading = false;
  96. });
  97. },
  98. //跳转到详情页
  99. goDetail(value) {
  100. uni.setStorage({
  101. key: "my_param",
  102. data: value,
  103. success: () => {
  104. uni.switchTab({ url: "/pages/check/index" });
  105. },
  106. });
  107. // uni.navigateTo({
  108. // url: "/pages/check/index?item=" + value,
  109. // });
  110. },
  111. },
  112. };
  113. </script>
  114. <style scoped lang="scss">
  115. page {
  116. background: $page-bg-color;
  117. }
  118. .orderPage {
  119. padding: 30rpx;
  120. background: azure;
  121. .list-item {
  122. background: #fff;
  123. padding: 40rpx 20rpx;
  124. border-radius: 20rpx;
  125. margin-bottom: 30rpx;
  126. position: relative;
  127. .nameTitle {
  128. color: red;
  129. line-height: 50rpx;
  130. }
  131. .status {
  132. width: 100rpx;
  133. height: 100rpx;
  134. background: aqua;
  135. position: absolute;
  136. right: 20rpx;
  137. top: 20rpx;
  138. }
  139. }
  140. }
  141. </style>