review-order.vue 2.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. <template>
  2. <view class="common-page" style="padding: 0" @click="playGlobalSound">
  3. <PageScroll requestStr="/app/orderreview/reviewOrderList" @updateList="updateList" ref="scrollRef"
  4. :otherParams="otherParams" :immediate="true">
  5. <view class="list-con" v-if="dataList.length">
  6. <ReviewOrderItem v-for="cell in dataList" :key="cell.orderId" :item="cell" class="mt-20" @click="handleReviewOrder(cell)">
  7. </ReviewOrderItem>
  8. </view>
  9. <!-- 底部统计 -->
  10. <view class="fixed-bottom total-count" v-if="total > 0">
  11. 共计{{ total }}条
  12. </view>
  13. </PageScroll>
  14. </view>
  15. </template>
  16. <script setup>
  17. import { ref } from "vue";
  18. import { onShow } from "@dcloudio/uni-app";
  19. import PageScroll from "@/components/pageScroll/index.vue";
  20. import ReviewOrderItem from "./components/reviewOrderItem.vue";
  21. //点击全局音效
  22. function playGlobalSound() {
  23. uni.$u.playClickSound();
  24. }
  25. const otherParams = ref({});
  26. const scrollRef = ref(null);
  27. const refreshList = () => {
  28. scrollRef.value?.resetUpScroll();
  29. };
  30. let dataList = ref([]);
  31. let total = ref(0);
  32. const updateList = (data, page) => {
  33. dataList.value = data;
  34. // 假设API返回的数据结构中包含total字段
  35. // 如果API响应结构不同,需要根据实际情况调整
  36. if (page && page.total !== undefined) {
  37. total.value = page.total;
  38. } else {
  39. total.value = data.length;
  40. }
  41. };
  42. const handleReviewOrder = (item) => {
  43. uni.navigateTo({
  44. url: `/pages/index/detail/review-detail?id=${item.orderId}`
  45. });
  46. };
  47. onShow(() => {
  48. refreshList();
  49. });
  50. </script>
  51. <style lang="scss" scoped>
  52. .list-con {
  53. padding: 10rpx 30rpx;
  54. gap: 30rpx;
  55. }
  56. .total-count {
  57. background-color: #4caf50;
  58. color: #ffffff;
  59. text-align: center;
  60. padding: 24rpx;
  61. font-size: 32rpx;
  62. font-weight: 500;
  63. margin-top: 20rpx;
  64. display: flex;
  65. justify-content: center;
  66. }
  67. </style>