防疫政策
This commit is contained in:
shijingjing
@@ -4,7 +4,7 @@
|
|||||||
<div class="user">
|
<div class="user">
|
||||||
<div class="header">
|
<div class="header">
|
||||||
<h3>张三</h3>
|
<h3>张三</h3>
|
||||||
<div style="color: #4181FF;"><u-icon name="phone" color="#4181FF" size="28"></u-icon>拨打电话</div>
|
<div style="color: #4181FF;" @click="call('110')"><u-icon name="phone" color="#4181FF" size="28"></u-icon>拨打电话</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="idNumber">
|
<div class="idNumber">
|
||||||
<span>身份证号：</span>
|
<span>身份证号：</span>
|
||||||
@@ -26,7 +26,6 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<!-- <h2>{{ info.name }}的返乡登记信息</h2> -->
|
|
||||||
<div class="item-info">
|
<div class="item-info">
|
||||||
<div class="item-info__item">
|
<div class="item-info__item">
|
||||||
<image src="/static/img/from-icon.png"/>
|
<image src="/static/img/from-icon.png"/>
|
||||||
@@ -43,168 +42,85 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-info">
|
|
||||||
<h2>基本信息</h2>
|
<div class="info">
|
||||||
<div class="detail-info__item">
|
<div class="detail-info">
|
||||||
<div class="left">
|
<h2>行程信息<span>省外高风险地区</span></h2>
|
||||||
<label>姓名</label>
|
|
||||||
|
<div class="detail-info__item">
|
||||||
|
<div class="left">
|
||||||
|
<label>出发地</label>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<span :style="{color: info.denger == 1 ? '#FF4466' : '#333'}">{{ info.startAreaName }}</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.name }}</span>
|
<div class="detail-info__item">
|
||||||
</div>
|
<div class="left">
|
||||||
</div>
|
<label>交通工具</label>
|
||||||
<div class="detail-info__item">
|
</div>
|
||||||
<div class="left">
|
<div class="right">
|
||||||
<label>身份证号</label>
|
<span>{{ $dict.getLabel('epidemicRecentTravel', info.travelType) }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
</div>
|
||||||
<span>{{ info.idNumber }}</span>
|
|
||||||
</div>
|
<div class="detail-info__item_wrap">
|
||||||
</div>
|
<div class="left">
|
||||||
<div class="detail-info__item">
|
<label>火车车次/航班号/汽车出发地</label>
|
||||||
<div class="left">
|
</div>
|
||||||
<label>手机号码</label>
|
<div class="right">
|
||||||
</div>
|
<span>{{ $dict.getLabel('epidemicRecentTravel', info.travelType) }}</span>
|
||||||
<div class="right" @click="call(info.phone)" hover-class="text-hover">
|
</div>
|
||||||
<image src="https://cdn.cunwuyun.cn/dvcp/h5/common/phone.png"/>
|
</div>
|
||||||
<span style="color: #4181FF">{{ info.phone }}</span>
|
|
||||||
</div>
|
<div class="detail-info__item">
|
||||||
</div>
|
<div class="left">
|
||||||
<div class="detail-info__item">
|
<label>目的地</label>
|
||||||
<div class="left">
|
</div>
|
||||||
<label>人员类别</label>
|
<div class="right">
|
||||||
</div>
|
<span>{{ info.startAddress }}</span>
|
||||||
<div class="right">
|
</div>
|
||||||
<span :style="{color: /[03]/.test(info.type) ? '#42D784' : '#FF4466'}">{{
|
</div>
|
||||||
$dict.getLabel('epidemicMemberType', info.type)
|
|
||||||
}}</span>
|
<div class="detail-info__item">
|
||||||
</div>
|
<div class="left">
|
||||||
</div>
|
<label>居住地点</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-info">
|
<div class="right">
|
||||||
<h2>行程信息</h2>
|
<span>{{ info.startAddress }}</span>
|
||||||
<div class="detail-info__item">
|
</div>
|
||||||
<div class="left">
|
</div>
|
||||||
<label>出行方式</label>
|
|
||||||
</div>
|
<div class="detail-info__item">
|
||||||
<div class="right">
|
<div class="left">
|
||||||
<span>{{ $dict.getLabel('epidemicRecentTravel', info.travelType) }}</span>
|
<label>行程安排</label>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
<div class="right">
|
||||||
<div class="detail-info__item">
|
<span>{{ info.startAddress }}</span>
|
||||||
<div class="left">
|
</div>
|
||||||
<label>出发时间</label>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="right">
|
<div class="detail-info__item">
|
||||||
<span>{{ info.startTime && info.startTime.substr(0, info.startTime.length - 3) }}</span>
|
<div class="left">
|
||||||
</div>
|
<label>预计/实际抵达时间</label>
|
||||||
</div>
|
</div>
|
||||||
<div class="detail-info__item">
|
<div class="right">
|
||||||
<div class="left">
|
<span>{{ info.startTime && info.startTime.substr(0, info.startTime.length - 3) }}</span>
|
||||||
<label>出发地区</label>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
|
||||||
<span :style="{color: info.denger == 1 ? '#FF4466' : '#333'}">{{ info.startAreaName }}</span>
|
|
||||||
</div>
|
<div class="detail-info__item">
|
||||||
</div>
|
<div class="left">
|
||||||
<div class="detail-info__item">
|
<label>预计离开时间</label>
|
||||||
<div class="left">
|
</div>
|
||||||
<label>出发地址</label>
|
<div class="right">
|
||||||
</div>
|
<span>{{ info.arriveTime && info.arriveTime.substr(0, info.arriveTime.length - 3) }}</span>
|
||||||
<div class="right">
|
</div>
|
||||||
<span>{{ info.startAddress }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>到达时间</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.arriveTime && info.arriveTime.substr(0, info.arriveTime.length - 3) }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>返乡地区</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.arriveAreaName }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>返乡地址</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.arriveAddress }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>行程描述</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.description }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info">
|
|
||||||
<h2>核酸检测信息</h2>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>核酸检测日期</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span>{{ info.checkTime.split(' ')[0] }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>核酸检测结果</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span :style="{color: info.checkResult === '0' ? '#42D784' : '#FF4466'}">{{
|
|
||||||
$dict.getLabel('epidemicRecentTestResult', info.checkResult)
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item detail-info__item--img">
|
|
||||||
<div class="left" style="max-width: 100%;">
|
|
||||||
<label>本人健康码截图或核酸检测报告</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<image :src="item.url" @click="preview(item.url)" v-for="(item, index) in info.checkPhoto" :key="index"/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info">
|
|
||||||
<h2>健康状况</h2>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>当前体温</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span :style="{color: info.temperature >= 37.3 ? '#FF4466' : '#42D784'}">{{ info.temperature }}℃</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>14天内是否接触新冠确诊或疑似患者</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span :style="{color: info.touchInFourteen === '0' ? '#42D784' : '#FF4466'}">{{
|
|
||||||
$dict.getLabel('epidemicTouchInFourteen', info.touchInFourteen)
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="detail-info__item">
|
|
||||||
<div class="left">
|
|
||||||
<label>当前健康状况</label>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<span :style="{color: !info.isHealth ? '#42D784' : '#FF4466'}">{{ info.healthName }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -281,8 +197,9 @@ export default {
|
|||||||
|
|
||||||
.detail-header {
|
.detail-header {
|
||||||
padding: 32px;
|
padding: 32px;
|
||||||
height: 860px;
|
height: 680px;
|
||||||
background: linear-gradient(135deg, #6496FF 0%, #4F75FF 100%);
|
background: linear-gradient(135deg, #6496FF 0%, #4F75FF 100%);
|
||||||
|
position: relative;
|
||||||
|
|
||||||
.user {
|
.user {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -328,8 +245,7 @@ export default {
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
background: #000000;
|
background: rgb(27, 27, 27, 0.85);
|
||||||
opacity: 0.8;
|
|
||||||
color: #fff;
|
color: #fff;
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@@ -349,13 +265,6 @@ export default {
|
|||||||
border-radius: 16px;
|
border-radius: 16px;
|
||||||
padding: 32px;
|
padding: 32px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
// h2 {
|
|
||||||
// margin-bottom: 32px;
|
|
||||||
// color: #fff;
|
|
||||||
// font-size: 40px;
|
|
||||||
// font-weight: 600;
|
|
||||||
// }
|
|
||||||
|
|
||||||
.item-info {
|
.item-info {
|
||||||
.item-info__item {
|
.item-info__item {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -382,77 +291,86 @@ export default {
|
|||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.detail-info {
|
.info {
|
||||||
margin-top: 24px;
|
position: absolute;
|
||||||
padding: 0 32px;
|
top: 657px;
|
||||||
background: #fff;
|
left: 50%;
|
||||||
|
width: 100%;
|
||||||
|
transform: translate(-50%, 1%);
|
||||||
|
|
||||||
|
.detail-info {
|
||||||
|
margin-top: 24px;
|
||||||
|
padding: 0 32px;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16px 16px 0 0;
|
||||||
|
|
||||||
& > h2 {
|
& > h2 {
|
||||||
height: 116px;
|
height: 116px;
|
||||||
line-height: 116px;
|
line-height: 116px;
|
||||||
font-size: 38px;
|
font-size: 38px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
span {
|
||||||
|
float: right;
|
||||||
.detail-info__item {
|
font-size: 28px;
|
||||||
display: flex;
|
color: #FF4466;
|
||||||
justify-content: space-between;
|
font-weight: normal;
|
||||||
padding: 34px 0;
|
}
|
||||||
border-bottom: 1px solid #DDDDDD;
|
|
||||||
|
|
||||||
&:last-child {
|
|
||||||
border: none;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.left {
|
.detail-info__item {
|
||||||
display: flex;
|
display: flex;
|
||||||
line-height: 1.3;
|
justify-content: space-between;
|
||||||
max-width: 360px;
|
padding: 34px 0;
|
||||||
|
border-bottom: 1px solid #DDDDDD;
|
||||||
|
|
||||||
label {
|
&:last-child {
|
||||||
position: relative;
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left {
|
||||||
|
display: flex;
|
||||||
|
line-height: 1.3;
|
||||||
|
max-width: 360px;
|
||||||
|
|
||||||
|
label {
|
||||||
|
position: relative;
|
||||||
|
color: #999999;
|
||||||
|
font-size: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
display: flex;
|
||||||
|
max-width: 450px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 32px;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 40px;
|
||||||
|
height: 40px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail-info__item_wrap {
|
||||||
|
display: block;
|
||||||
|
border-bottom: 1px solid #DDDDDD;
|
||||||
|
padding: 34px 0;
|
||||||
|
.left {
|
||||||
color: #999999;
|
color: #999999;
|
||||||
font-size: 32px;
|
font-size: 32px;
|
||||||
}
|
}
|
||||||
}
|
.right {
|
||||||
|
margin-top: 20px;
|
||||||
.right {
|
|
||||||
display: flex;
|
|
||||||
max-width: 450px;
|
|
||||||
|
|
||||||
span {
|
|
||||||
color: #333333;
|
|
||||||
font-size: 32px;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
|
|
||||||
image {
|
|
||||||
width: 40px;
|
|
||||||
height: 40px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.detail-info__item--img {
|
|
||||||
display: block;
|
|
||||||
|
|
||||||
.right {
|
|
||||||
flex-wrap: wrap;
|
|
||||||
max-width: 100%;
|
|
||||||
margin-top: 34px;
|
|
||||||
|
|
||||||
image {
|
|
||||||
width: 226px;
|
|
||||||
height: 226px;
|
|
||||||
margin: 0 9px 9px 0;
|
|
||||||
|
|
||||||
&:nth-of-type(3n) {
|
|
||||||
margin-right: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,13 +1,43 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>政策详情</div>
|
<div class="policyDetail">
|
||||||
|
<h2>外地抵汉、来汉人员疫情防控政策通知</h2>
|
||||||
|
<div class="tips">
|
||||||
|
<span>武昌区疫情防控中心</span><span>125人看过</span>
|
||||||
|
</div>
|
||||||
|
<u-parse :html="content"></u-parse>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
content: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {},
|
||||||
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style lang="scss" scoped>
|
||||||
|
.policyDetail {
|
||||||
|
padding: 32px 32px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background: #FFF;
|
||||||
|
h2 {
|
||||||
|
font-size: 48px;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
.tips {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
color: #999999;
|
||||||
|
margin-top: 16px;
|
||||||
|
}
|
||||||
|
u-parse {
|
||||||
|
margin-top: 64px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Reference in New Issue
Block a user