<template>
    <view class="content">
        <!-- 轮播图 -->
        <view class="uni-margin-wrap">
            <swiper class="swiper" circular indicator-dots="true" autoplay="true" interval="2000" duration="500">
                <swiper-item v-for="(item, index) in banner" :key="index">
                    <view class="swiper-item" @click="clickBannerItem(item)" :data-link="item.link">
                        <image class="swiper-image" :src="item.image" mode="aspectFill" :draggable="true" />
                    </view>
                </swiper-item>
            </swiper>
        </view>

        <image class="logo" src="@/static/logo.png"></image>
        <view class="text-area">
            <text class="title">安邮车联</text>
        </view>
        <view class="text-area">
            <text class="title">运车助手</text>
        </view>
    </view>
</template>

<script>
    import ctms from '@/apis/ctms/index.js';
    import utils from "@/utils/common.js";
    export default {
        data() {
            return {
                current: 0,
                swiperDotIndex: 0,
                banner: [{
                    image: '/static/img/banner/banner.jpg',
                    link: ""
                }]
            }
        },
        methods: {
            clickBannerItem(item) {
                if (item.link) {
                    var link = item.link;
                    uni.navigateTo({
                        url: "/pages/common/webview/index?url=" + link
                    })
                }
            },
            changeSwiper(e) {
                this.current = e.detail.current
            },
            getBanner() {
                ctms.ads.banner().then((res) => {
                    var _data = res;
                    if (_data) {
                        this.banner = _data;
                    }
                });
            },
            checkSplash() {
                var ls = "splashShowed";
                var a = uni.getStorageSync(ls);
                if (!a) {
                    uni.navigateTo({
                        url: "/pages/index/index"
                    })
                }
            }
        },
        onLoad: function() {
            this.checkSplash();
        },
        onShow: function() {
            this.getBanner();
        }
    }
</script>

<style>
    .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .logo {
        height: 200rpx;
        width: 200rpx;
        margin-top: 200rpx;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 50rpx;
    }

    .text-area {
        display: flex;
        justify-content: center;
    }

    .title {
        font-size: 36rpx;
        color: #8f8f94;
    }
</style>
<style lang="scss">
    .uni-margin-wrap {
        width: 100%;
    }

    .uni-padding-wrap {
        width: 550rpx;
        padding: 0 100rpx;
    }

    /*轮播幻灯*/
    .swiper {
        height: 300rpx;
        position: relative;
    }

    .swiper-list {
        margin-top: 40rpx;
        margin-bottom: 0;
    }

    .swiper-item {
        width: 100%;
        display: block;
        height: 300rpx;
        line-height: 300rpx;
        text-align: center;
    }

    .swiper-image {
        width: 100%;
        height: 300rpx;
    }

    /*滑动区*/
    .swiper-box {
        height: 370rpx;
        background: #fff;
        margin-top: 20rpx;
    }

    .swiper-box .wx-swiper-dots.wx-swiper-dots-horizontal {
        padding-bottom: 10rpx;
    }
</style>