performanceList.vue 1.7 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970
  1. <template>
  2. <view class="page">
  3. <uni-nav-bar :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true" left-icon="left" title="我的业绩" @clickLeft="back" />
  4. <view class=" tabs ">
  5. <u-tabs :list="tabList" :scrollable="false" lineWidth="30" lineColor="#FFE05C" :activeStyle="{color: '#333333',fontWeight: 'bold',transform: 'scale(1.05)'}" :current="tabIndex" @click="clickTab"></u-tabs>
  6. </view>
  7. <!-- 订单列表 -->
  8. <view :style="{'height':windowHeight}">
  9. <swiper :style="{'height':windowHeight}" :current="tabIndex" @change="swiperChange">
  10. <swiper-item class="swiperItem" v-for="(item,index) in tabList" :key="index">
  11. <view>
  12. <mescroll-item ref="MescrollItem" :i="index" :index="tabIndex" :tabs="tabList" :height="windowHeight" >
  13. </mescroll-item>
  14. </view>
  15. </swiper-item>
  16. </swiper>
  17. </view>
  18. </view>
  19. </template>
  20. <script>
  21. import MescrollItem from "./module/mescrollUni-item.vue";
  22. export default {
  23. components: {
  24. MescrollItem
  25. },
  26. data() {
  27. return {
  28. tabIndex: 0,
  29. tabList: [{
  30. name: '累计服务'
  31. }, {
  32. name: '今日业绩'
  33. }, {
  34. name: '本月业绩'
  35. }],
  36. windowHeight:'',
  37. }
  38. },
  39. onLoad(e) {
  40. this.tabIndex = e.index*1
  41. let sysInfo = uni.getSystemInfoSync()
  42. this.windowHeight = sysInfo.windowHeight - 74 - 70 + 'px' //除标题栏栏外的屏幕可用高度
  43. console.log('this.$refs++++++++++',this.$refs)
  44. this.$refs.MescrollItem[this.tabIndex].downCallback()
  45. },
  46. methods: {
  47. back() {
  48. uni.navigateBack({
  49. delta: 1
  50. })
  51. },
  52. clickTab(e) {
  53. this.tabIndex = e.index
  54. },
  55. swiperChange(e) {
  56. this.tabIndex = e.detail.current
  57. },
  58. }
  59. }
  60. </script>
  61. <style scoped lang="scss">
  62. @import './index.rpx.css';
  63. </style>