rongzidanbao-ui/components/swiper/notice.vue

<template>
  <view v-if="noticelist.length">
	  <view class="hswip flexc" >
	  		<image :src="tztip"></image>
			<swiper class="swiper" circular :autoplay="autoplay" :interval="interval" :duration="duration" vertical='true'>
				<swiper-item v-for="(ite,idx) in noticelist" :key="">
					<view class="flexc swipers" @click="getDetail(ite.zxNoticeId)">
						<view class="tit over">{{ite.noticeTitle}}</view>
						<view class="time">{{ite.issuerTime}}</view>
					</view>
				</swiper-item>
			</swiper>
	  		
	  </view>
  </view>
</template>

<script>
  export default {
	  props:{
	  	autoplay: {
	  		type: Boolean,
	  		default () {
	  			return false
	  		}
	  	},
	  	confdat:{},
		noticelist:{
			type: Array,
			default () {
				return []
			}
		}
	  },
	data(){
		return{
			tztip:require('@/static/images/home/tztip.png'),
            interval: 2000,
            duration: 500
		}
	},
	methods:{
		 getRoad(){
		 	console.log(1)
		 },
		 getDetail(e){
			 this.$emit('getNoticeDet',e)
		 }
	},
	onLoad: function() {
    }
  }
</script>

<style lang="scss" scoped>
.hswip{width: 100%;background: #F7F7FF;border-radius: 10rpx;height: 92rpx;padding: 0 26rpx 0 28rpx;box-sizing: border-box;
	image{width: 64rpx;height: 46rpx;flex: 0 0 auto;margin-right: 24rpx;}
	.swiper{flex: 1;height: 92rpx;
	.swipers{height: 92rpx;}
		.tit{flex: 1;font-weight: bold;font-size: 26rpx;color: #222327;}
		.time{font-weight: 500;font-size: 22rpx;color: #878787;flex: 0 0 auto;margin-left: 40rpx;}
	}
}
</style>