| | |
| | | import { FetchNextPageOptions } from '@tanstack/vue-query'; |
| | | import { Loading } from '@nutui/icons-vue-taro'; |
| | | import { useScrollDistance } from 'senin-mini/hooks'; |
| | | import IconBackTop from '../../../assets/icon-back-top.png'; |
| | | import IconBackTop from '../../assets/icon-back-top.png'; |
| | | |
| | | defineOptions({ |
| | | name: 'InfiniteLoading', |
| | |
| | | |
| | | defineExpose({ backToTop, scrollToBottom }); |
| | | </script> |
| | | |
| | | <style lang="scss"> |
| | | @import '@/styles/common.scss'; |
| | | |
| | | .loading-more-tips { |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | padding: 18px 10px; |
| | | width: auto; |
| | | font-size: 24px; |
| | | text-align: center; |
| | | } |
| | | |
| | | .infinite-list-inner { |
| | | // padding: 30px 30px 0; |
| | | |
| | | &.hasPaddingTop { |
| | | padding-top: 20px; |
| | | } |
| | | |
| | | &.noShowMoreText { |
| | | padding-bottom: 30px; |
| | | } |
| | | } |
| | | |
| | | .infiniting-tips { |
| | | color: boleGetCssVar('text-color', 'primary'); |
| | | padding: 18px 10px; |
| | | width: auto; |
| | | font-size: 24px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: center; |
| | | |
| | | .infiniting-tips-icon { |
| | | margin-right: 10px; |
| | | } |
| | | } |
| | | |
| | | .back-top-wrapper { |
| | | width: 92px; |
| | | height: 92px; |
| | | background: #ffffff; |
| | | box-shadow: 0px 0px 28px 0px rgba(0, 0, 0, 0.18); |
| | | position: fixed; |
| | | border-radius: 50%; |
| | | right: boleGetCssVar('size', 'body-padding-h'); |
| | | bottom: 390px; |
| | | |
| | | .back-top-img { |
| | | width: 44px; |
| | | height: 44px; |
| | | margin: 12px auto 2px; |
| | | } |
| | | |
| | | .back-top-text { |
| | | font-weight: 400; |
| | | font-size: 16px; |
| | | color: boleGetCssVar('text-color', 'regular'); |
| | | line-height: 22px; |
| | | text-align: center; |
| | | } |
| | | } |
| | | </style> |