112 lines
2.5 KiB
Vue
112 lines
2.5 KiB
Vue
<template>
|
|
<Card title="疫情播报" class="max">
|
|
<div class="container" id="more" @click="toMore">
|
|
<div id="page">
|
|
<div class="content" v-for="(item, index) in list" :key="index">
|
|
<p class="time">{{ item.content }}</p>
|
|
<!-- <p class="value">
|
|
<a :href= item.url target="_blank">{{111}}</a>
|
|
</p> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</Card>
|
|
</template>
|
|
|
|
<script>
|
|
import Card from '../components/Card'
|
|
import { getEpidemicBroadcastApi } from '@/assets/js/api/zhongjianFourth'
|
|
export default {
|
|
components: { Card },
|
|
data() {
|
|
return {
|
|
list: [{ content: '' }]
|
|
}
|
|
},
|
|
created() {
|
|
this.getData()
|
|
},
|
|
methods: {
|
|
getData() {
|
|
getEpidemicBroadcastApi({adCode: this.$store.state.currentProDetail.cityCode }).then(res => {
|
|
if (res.code == 200) {
|
|
this.list[0].content = res.result
|
|
}
|
|
// console.log('疫情',res)
|
|
})
|
|
},
|
|
toMore() {
|
|
let dom = document.getElementById('more')
|
|
dom.addEventListener('click', function(e) {
|
|
if (e.target.id == 'more') {
|
|
window.open('http://wjw.gz.gov.cn/ztzl/xxfyyqfk/yqtb/index.html', '_blank')
|
|
}
|
|
})
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="less" scoped>
|
|
.max {
|
|
position: relative;
|
|
}
|
|
.container::after {
|
|
content: '更多 >';
|
|
cursor: pointer;
|
|
color: #66d4d9;
|
|
position: absolute;
|
|
right: 4%;
|
|
top: 5%;
|
|
z-index: 999;
|
|
}
|
|
.container {
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
height: 100%;
|
|
padding: 8px 15px;
|
|
overflow: auto;
|
|
.content {
|
|
margin-top: 10px;
|
|
width: 100%;
|
|
height: 65px;
|
|
.time {
|
|
padding: 10px 0px 10px 0px;
|
|
// color:rgba(255, 255, 255, 0.65)
|
|
border-left: 4px solid #66d3d8;
|
|
background-image: linear-gradient(to right, #3b7589, #182337);
|
|
margin-top: 35px;
|
|
}
|
|
a {
|
|
text-decoration: none;
|
|
color: rgb(255, 255, 255);
|
|
}
|
|
.value {
|
|
position: relative;
|
|
box-sizing: border-box;
|
|
border-left: 4px solid #66d3d8;
|
|
margin-bottom: 3px;
|
|
padding: 10px 5px;
|
|
width: 100%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
background-image: linear-gradient(to right, #3b7589, #182337);
|
|
font-size: 14px;
|
|
font-weight: 500;
|
|
cursor: pointer;
|
|
color: rgb(255, 255, 255);
|
|
transition: all 0.3s;
|
|
white-space: nowrap;
|
|
|
|
&:hover {
|
|
cursor: pointer;
|
|
margin-top: 2px;
|
|
margin-bottom: 5px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|