| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- <template>
- <view class="page">
- <uni-nav-bar :fixed="true" background-color="#FFE05C" :border="false" :statusBar="true" left-icon="left" title="我的业绩" @clickLeft="back" />
- <view class=" tabs ">
- <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>
- </view>
- <!-- 订单列表 -->
- <view :style="{'height':windowHeight}">
- <swiper :style="{'height':windowHeight}" :current="tabIndex" @change="swiperChange">
- <swiper-item class="swiperItem" v-for="(item,index) in tabList" :key="index">
- <view>
- <mescroll-item ref="MescrollItem" :i="index" :index="tabIndex" :tabs="tabList" :height="windowHeight" >
- </mescroll-item>
- </view>
- </swiper-item>
- </swiper>
- </view>
- </view>
- </template>
- <script>
- import MescrollItem from "./module/mescrollUni-item.vue";
- export default {
- components: {
- MescrollItem
- },
- data() {
- return {
- tabIndex: 0,
- tabList: [{
- name: '累计服务'
- }, {
- name: '今日业绩'
- }, {
- name: '本月业绩'
- }],
- windowHeight:'',
- }
- },
- onLoad(e) {
- this.tabIndex = e.index*1
- let sysInfo = uni.getSystemInfoSync()
- this.windowHeight = sysInfo.windowHeight - 74 - 70 + 'px' //除标题栏栏外的屏幕可用高度
- console.log('this.$refs++++++++++',this.$refs)
- this.$refs.MescrollItem[this.tabIndex].downCallback()
- },
- methods: {
- back() {
- uni.navigateBack({
- delta: 1
- })
- },
- clickTab(e) {
- this.tabIndex = e.index
- },
- swiperChange(e) {
- this.tabIndex = e.detail.current
- },
- }
- }
- </script>
- <style scoped lang="scss">
- @import './index.rpx.css';
- </style>
|