index.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <template>
  2. <view class="position-analysis-page">
  3. <van-tabs
  4. :active="activeType"
  5. sticky
  6. animated
  7. swipeable
  8. @change="onChange"
  9. color="#E3B377"
  10. id="tabs"
  11. >
  12. <van-tab
  13. :title="item.exchange"
  14. v-for="item in list"
  15. :key="item.exchange"
  16. :name="item.exchange"
  17. >
  18. <indexContent :list="item.items" :num="item.num" :time="item.data_time" :exchange="item.exchange" :now="item.curr_date"/>
  19. </van-tab>
  20. </van-tabs>
  21. </view>
  22. </template>
  23. <script>
  24. import {apiPositionAnalysisList} from '@/api/positionAnalysis.js'
  25. import indexContent from './components/indexContent.vue'
  26. export default {
  27. components:{indexContent},
  28. data() {
  29. return {
  30. list:[],
  31. activeType:''
  32. }
  33. },
  34. onLoad(){
  35. this.getList()
  36. },
  37. onPullDownRefresh() {
  38. this.getList()
  39. setTimeout(() => {
  40. uni.stopPullDownRefresh()
  41. }, 1500);
  42. },
  43. //转发分享
  44. onShareAppMessage(){
  45. return{
  46. title:'持仓分析',
  47. }
  48. },
  49. methods: {
  50. async getList(){
  51. const res=await apiPositionAnalysisList()
  52. if(res.code===200){
  53. this.list=res.data||[]
  54. this.activeType=res.data[0]&&res.data[0].exchange
  55. this.$nextTick(()=>{
  56. this.selectComponent('#tabs').resize();
  57. })
  58. }
  59. },
  60. onChange(){
  61. uni.pageScrollTo({
  62. scrollTop: 0,
  63. duration: 300
  64. });
  65. }
  66. },
  67. }
  68. </script>
  69. <style lang="scss">
  70. page{
  71. padding-bottom: constant(safe-area-inset-bottom);
  72. padding-bottom: env(safe-area-inset-bottom);
  73. }
  74. .van-sticky{
  75. z-index: 9999 !important;
  76. }
  77. .van-sticky-wrap--fixed{
  78. box-shadow: 0px 4px 4px rgba(198, 198, 198, 0.25);
  79. }
  80. </style>