loading.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. // [z-paging]loading相关模块
  2. import u from '.././z-paging-utils'
  3. import Enum from '.././z-paging-enum'
  4. export default {
  5. props: {
  6. // 第一次加载后自动隐藏loading slot,默认为是
  7. autoHideLoadingAfterFirstLoaded: {
  8. type: Boolean,
  9. default: u.gc('autoHideLoadingAfterFirstLoaded', true)
  10. },
  11. // loading slot是否铺满屏幕并固定,默认为否
  12. loadingFullFixed: {
  13. type: Boolean,
  14. default: u.gc('loadingFullFixed', false)
  15. },
  16. // 是否自动显示系统Loading:即uni.showLoading,若开启则将在刷新列表时(调用reload、refresh时)显示,下拉刷新和滚动到底部加载更多不会显示,默认为false。
  17. autoShowSystemLoading: {
  18. type: Boolean,
  19. default: u.gc('autoShowSystemLoading', false)
  20. },
  21. // 显示系统Loading时是否显示透明蒙层,防止触摸穿透,默认为是(H5、App、微信小程序、百度小程序有效)
  22. systemLoadingMask: {
  23. type: Boolean,
  24. default: u.gc('systemLoadingMask', true)
  25. },
  26. // 显示系统Loading时显示的文字,默认为"加载中"
  27. systemLoadingText: {
  28. type: [String, Object],
  29. default: u.gc('systemLoadingText', null)
  30. },
  31. },
  32. data() {
  33. return {
  34. loading: false,
  35. loadingForNow: false,
  36. }
  37. },
  38. watch: {
  39. // loading状态
  40. loadingStatus(newVal) {
  41. this.$emit('loadingStatusChange', newVal);
  42. this.$nextTick(() => {
  43. this.loadingStatusAfterRender = newVal;
  44. })
  45. if (this.useChatRecordMode) {
  46. if (this.isFirstPage && (newVal === Enum.More.NoMore || newVal === Enum.More.Fail)) {
  47. this.isFirstPageAndNoMore = true;
  48. return;
  49. }
  50. }
  51. this.isFirstPageAndNoMore = false;
  52. },
  53. loading(newVal){
  54. if (newVal) {
  55. this.loadingForNow = newVal;
  56. }
  57. },
  58. },
  59. computed: {
  60. // 是否显示loading
  61. showLoading() {
  62. if (this.firstPageLoaded || !this.loading || !this.loadingForNow) return false;
  63. if (this.finalShowSystemLoading) {
  64. // 显示系统loading
  65. uni.showLoading({
  66. title: this.finalSystemLoadingText,
  67. mask: this.systemLoadingMask
  68. })
  69. }
  70. return this.autoHideLoadingAfterFirstLoaded ? (this.fromEmptyViewReload ? true : !this.pagingLoaded) : this.loadingType === Enum.LoadingType.Refresher;
  71. },
  72. // 最终的是否显示系统loading
  73. finalShowSystemLoading() {
  74. return this.autoShowSystemLoading && this.loadingType === Enum.LoadingType.Refresher;
  75. }
  76. },
  77. methods: {
  78. // 处理开始加载更多状态
  79. _startLoading(isReload = false) {
  80. if ((this.showLoadingMoreWhenReload && !this.isUserPullDown) || !isReload) {
  81. this.loadingStatus = Enum.More.Loading;
  82. }
  83. this.loading = true;
  84. },
  85. // 停止系统loading和refresh
  86. _endSystemLoadingAndRefresh(){
  87. this.finalShowSystemLoading && uni.hideLoading();
  88. !this.useCustomRefresher && uni.stopPullDownRefresh();
  89. // #ifdef APP-NVUE
  90. this.usePageScroll && uni.stopPullDownRefresh();
  91. // #endif
  92. }
  93. }
  94. }