forked from TALL/check-work
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.
79 lines
1.3 KiB
79 lines
1.3 KiB
<template>
|
|
<div class="head">
|
|
<img class="settle-in" src="~assets/settleIn.png" />
|
|
<a-carousel :autoplay-speed="time" autoplay>
|
|
<div :key="item.id" class="img-box" v-for="item in lists">
|
|
<img :src="item.url" alt />
|
|
</div>
|
|
</a-carousel>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import { queryRotation } from 'config/api';
|
|
export default {
|
|
data() {
|
|
return {
|
|
time: 3000,
|
|
lists: [],
|
|
};
|
|
},
|
|
created() {
|
|
this.getData();
|
|
},
|
|
methods: {
|
|
async getData() {
|
|
try {
|
|
const params = { param: { showPage: 0 } };
|
|
const res = await queryRotation(params);
|
|
const { code, data, msg } = res.data;
|
|
if (code === 200) {
|
|
this.lists = data;
|
|
} else {
|
|
this.$message.error(error);
|
|
}
|
|
} catch (error) {
|
|
this.$message.error(error);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="stylus">
|
|
.head {
|
|
background: white;
|
|
max-height: 340px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
}
|
|
|
|
.settle-in {
|
|
position: absolute;
|
|
top: 3%;
|
|
right: 10%;
|
|
z-index: 9;
|
|
}
|
|
|
|
.img-box {
|
|
height: 340px;
|
|
width: 100%;
|
|
|
|
img {
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.ant-carousel >>> .slick-slide {
|
|
text-align: center;
|
|
height: 160px;
|
|
line-height: 160px;
|
|
background: #364d79;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ant-carousel >>> .slick-slide h3 {
|
|
color: #fff;
|
|
}
|
|
</style>
|
|
|