<template>
    <page-meta page-style="overflow: hidden" />
    <page title="魔换" ref="pageRef" light nav-color="transparent">

        <tabbar
            :data="tabbarData"
            :initial="initial"
            custom-class="paddingX20 marginB7"
            @change="onChange"
            ref="tabRef"
        />
        <publish-record v-if="index === 0" />
        <bid-record v-if="index === 1" />
        <sell-list v-if="index === 2" />
        <buy-record v-if="index === 3" />
        <image
            v-if="index === 2"
            @click="showWallet"
            :src="resource.sell_wallet"
            class="fixedBtn"
        />
        <image
            v-if="index === 0"
            @click="showPublish"
            :src="resource.sell_publish"
            class="fixedBtn"
        />
    </page>
</template>
<script>
import tabbar from '@/components/tabbar'
import loginMixin from '@/mixin/login'
import publishRecord from './publish_record'
import bidRecord from './bid_record'
import buyRecord from './buy_record'
import sellList from './sell-list'
import resource from '@/utils/resource'

export default {
    mixins: [loginMixin],
    components: { tabbar, publishRecord, bidRecord, buyRecord, sellList },
    data() {
        return {
            tabbarData: ['我发布的', '我出价的', '我卖出的', '我买到的'],
            initial: -1,
            index: -1,
            resource
        }
    },
    onLoad(options) {
        if (options.active) {
            this.initial = options.active - 0
            this.index = this.initial
        } else {
            this.initial = 0
            this.index = 0
        }
    },
    methods: {
        init() {
            let index = this.index
            this.index = -1
            this.$nextTick(() => {
                this.index = index
            })
        },
        onChange(index) {
            this.index = index
        },
        showWallet() {
            this.$router.push('wallet', { type: 1 })
        },
        showPublish() {
            this.$router.push('store', { type: 1 })
        }
    }
}
</script>
<style>

</style>

<style lang="scss" scoped>
.bg {
    position: fixed;
    z-index: -1;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0.3;
}
.fixedBtn {
    width: 94rpx;
    height: 100rpx;
    position: fixed;
    right: 20rpx;
    bottom: 180rpx;
}
</style>