You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
112 lines
2.4 KiB
112 lines
2.4 KiB
<template>
|
|
<view>
|
|
<view class="swiper1">
|
|
<swiper circular autoplay interval="1000" indicator-dots indicator-color="#8f939c"
|
|
indicator-active-color="#e43d33">
|
|
<swiper-item>
|
|
<img src="../../common/images/原始黄其振.jpg" class="swiperItem" />
|
|
</swiper-item>
|
|
<swiper-item>
|
|
<img src="../../common/images/西装黄其振.jpg" class="swiperItem" />
|
|
</swiper-item>
|
|
<swiper-item>
|
|
<img src="../../common/images/真我光锥.jpg" class="swiperItem" />
|
|
</swiper-item>
|
|
<swiper-item>
|
|
<img src="../../common/images/无腿黄其振.jpg" class="swiperItem" />
|
|
</swiper-item>
|
|
<swiper-item>
|
|
<img src="../../common/images/证件照黄其振.jpg" class="swiperItem" />
|
|
</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<view class="announcement">
|
|
<view class="login">
|
|
<button @click="handleLogin"></button>
|
|
</view>
|
|
<view class="icon1">
|
|
<uni-icons type="chatboxes" size="20"></uni-icons>
|
|
<text class="announcement-title" style="align-items: center;justify-content: center;">公告</text>
|
|
</view>
|
|
<view class="swiper2">
|
|
<swiper vertical circular autoplay interval="1000">
|
|
<swiper-item class="notice-item">这是一条公告</swiper-item>
|
|
<swiper-item class="notice-item">大喊我是黄其振的狗自动登录</swiper-item>
|
|
</swiper>
|
|
</view>
|
|
<view class="icon2">
|
|
<uni-icons type="right" size="20"></uni-icons>
|
|
</view>
|
|
</view>
|
|
<view>
|
|
<button type="primary" plain="true" class="button1">
|
|
<text>点击登录</text>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup name="homePage">
|
|
</script>
|
|
|
|
<style scoped>
|
|
.button1 {
|
|
width: 220rpx;
|
|
height: 60rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
margin-top: 10rpx;
|
|
margin-bottom: 10rpx;
|
|
}
|
|
|
|
.swiper1 {
|
|
margin: 20rpx 0;
|
|
height: 300rpx;
|
|
}
|
|
|
|
.swiperItem {
|
|
width: 90%;
|
|
height: 300rpx;
|
|
padding: 0 35rpx;
|
|
align-items: center;
|
|
object-fit: cover;
|
|
border-radius: 16rpx;
|
|
justify-content: center;
|
|
}
|
|
|
|
.announcement {
|
|
display: flex;
|
|
margin-top: 20rpx;
|
|
width: 90%;
|
|
margin:0 35rpx;
|
|
min-height: 30rpx;
|
|
background-color: rgb(203, 182, 207);
|
|
}
|
|
|
|
.swiper2 {
|
|
flex: 1;
|
|
height: 60rpx;
|
|
overflow: hidden;
|
|
padding: 10rpx;
|
|
}
|
|
|
|
.notice-item {
|
|
flex: 1;
|
|
width: 100%;
|
|
}
|
|
|
|
.icon1 {
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 140rpx;
|
|
padding: 10rpx;
|
|
}
|
|
|
|
.icon2 {
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 80rpx;
|
|
padding: 10rpx;
|
|
}
|
|
</style>
|