81 lines
1.7 KiB
Vue
81 lines
1.7 KiB
Vue
<template>
|
||
<swiper
|
||
class="swiper"
|
||
circular
|
||
:indicator-dots="true"
|
||
:autoplay="false"
|
||
:interval="2000"
|
||
:duration="500"
|
||
indicator-active-color="#00DCEE"
|
||
>
|
||
<swiper-item v-for="(item, index) in list" :key="index">
|
||
<view class="image-box">
|
||
<image :src="`https://backend-common.obs.cn-east-3.myhuaweicloud.com/static/pagesLaunch/${item.imgUrl}`"></image>
|
||
<view class="title">
|
||
{{ item.title }}
|
||
</view>
|
||
<view v-if="index === 3" class="btn-start" @click="start()">
|
||
立即启用
|
||
</view>
|
||
</view>
|
||
</swiper-item>
|
||
</swiper>
|
||
</template>
|
||
<script setup lang="ts">
|
||
const list = [
|
||
{
|
||
title: "智能回收 智慧未来！",
|
||
imgUrl: "1.png",
|
||
},
|
||
{
|
||
title: "高效管理 安全快捷！",
|
||
imgUrl: "2.png",
|
||
},
|
||
{
|
||
title: "全新系统 崭新界面！",
|
||
imgUrl: "3.png",
|
||
},
|
||
{
|
||
title: "全城握手 致富从这里开始!",
|
||
imgUrl: "4.png",
|
||
},
|
||
];
|
||
const start = () => {
|
||
uni.navigateTo({
|
||
url: "/pagesLogin/login/index", // 要跳转到的页面路径
|
||
});
|
||
};
|
||
</script>
|
||
<style lang="scss" scoped>
|
||
.swiper {
|
||
width: 100%;
|
||
height: 80vh;
|
||
margin-top: 10vh;
|
||
.image-box {
|
||
text-align: center;
|
||
cursor: pointer;
|
||
}
|
||
.title {
|
||
font-size: 40rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 500;
|
||
color: #00d2e3;
|
||
margin-top: 90rpx;
|
||
}
|
||
.btn-start {
|
||
height: 88rpx;
|
||
background: #00dcee;
|
||
border-radius: 44rpx;
|
||
line-height: 88rpx;
|
||
font-size: 37rpx;
|
||
font-family: Source Han Sans CN;
|
||
font-weight: 500;
|
||
color: #ffffff;
|
||
width: 80%;
|
||
margin: 0px auto;
|
||
margin-top: 50rpx;
|
||
cursor: pointer;
|
||
}
|
||
}
|
||
</style>
|