<template>
    <view class="position-analysis-page">
        <van-tabs 
            :active="activeType" 
            sticky 
            animated 
            swipeable 
            @change="onChange"
            color="#E3B377"
            id="tabs"
        >
            <van-tab 
                :title="item.exchange" 
                v-for="item in list" 
                :key="item.exchange"
                :name="item.exchange"
            >
                <indexContent :list="item.items" :num="item.num" :time="item.data_time" :exchange="item.exchange" :now="item.curr_date"/>
            </van-tab>
        </van-tabs>
    </view>
      
</template>

<script>
import {apiPositionAnalysisList} from '@/api/positionAnalysis.js'
import indexContent from './components/indexContent.vue'
export default {
    components:{indexContent},
    data() {
        return {
            list:[],
            activeType:''
        }
    },
    onLoad(){
        this.getList()
    },
    onPullDownRefresh() {
        this.getList()
		setTimeout(() => {
			uni.stopPullDownRefresh()
		}, 1500);
	},
	//转发分享
	onShareAppMessage(){
		return{
			title:'持仓分析',
		}
	},
    methods: {
        async getList(){
            const res=await apiPositionAnalysisList()
            if(res.code===200){
                this.list=res.data||[]
                this.activeType=res.data[0]&&res.data[0].exchange
                this.$nextTick(()=>{
                    this.selectComponent('#tabs').resize();
                })
                
            }
        },

        onChange(){
            uni.pageScrollTo({
                scrollTop: 0,
                duration: 300
            });
        }
    },
}
</script>

<style lang="scss">
page{
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
}
.van-sticky{
    z-index: 9999 !important;
}
.van-sticky-wrap--fixed{
    box-shadow: 0px 4px 4px rgba(198, 198, 198, 0.25);
}
</style>