卡扣登记

This commit is contained in:
shijingjing
2022-09-22 17:41:38 +08:00
parent 24dad80b52
commit 3dde4fa4ce
4 changed files with 623 additions and 33 deletions

View File

@@ -1,7 +1,5 @@
<template>
<div class="AddGetway">
<!-- <div class="tips">请确保以下信息全部由本人填写本人对所填写内容的真实性和完整性负责</div> -->
<!-- 基本信息 -->
<div class="title">基本信息</div>
<div class="form-item__group">
@@ -286,16 +284,12 @@
</div>
</div>
</div>
<div class="form-item form-item__imgs">
<div class="form-item__wrapper">
<div class="form-item__title">
<i>*</i>
<h2>14天内是否接触新冠确诊或疑似患者</h2>
</div>
<div class="form-item__right">
<AiRadio style="width: 100%;" v-model="form.touchInFourteen" dict="epidemicTouchInFourteen"></AiRadio>
</div>
</div>
<div style="height: 200px;">
<NamePhone v-for="(item, index) in people" :key="index" ref="NamePhoneRef" :name.sync="item.name"
:phone.sync="item.phone" :index="index" @delCountHandle="delCountHandle"/>
</div>
<div class="addCount">
<u-button type="primary" @click="addCountHandle">继续添加</u-button>
</div>
</div>
@@ -303,7 +297,7 @@
<u-picker mode="time" :params="dataParams" v-model="isShowDate" @confirm="onDateChange"></u-picker>
<u-picker mode="time" :params="params" v-model="isShowStartTime" @confirm="onStartChange"></u-picker>
<u-picker mode="time" :params="params" v-model="isShowEndTime" @confirm="onEndChange"></u-picker>
<div class="agree">
<u-checkbox v-model="isAgree"></u-checkbox>
<span class="deal">以上信息是我本人填写本人对信息内容的真实性和完整性负责</span>
@@ -316,7 +310,7 @@
<script>
import {mapState} from 'vuex'
import NamePhone from './components/namePhone.vue'
export default {
appName: "添加返乡记录",
data() {
@@ -364,10 +358,17 @@ export default {
arr: [],
gridList: [[], [], []],
flag: false,
$areaId: ''
$areaId: '',
people: [{
name: '',
phone: '',
}]
}
},
component: {
NamePhone,
},
computed: {
...mapState(['user'])
@@ -378,6 +379,17 @@ export default {
},
methods: {
addCountHandle() {
this.people.push({
name: "",
phone: "",
});
},
delCountHandle(index) {
this.people.splice(index, 1);
},
onDateChange(e) {
this.form.checkTime = `${e.year}-${e.month}-${e.day}`
},
@@ -511,15 +523,6 @@ export default {
.AddGetway {
padding-bottom: 140px;
// .tips {
// line-height: 1.3;
// padding: 32px 32px;
// color: #FF883C;
// font-size: 30px;
// text-align: justify;
// background: #FFF8F3;
// }
.title {
padding: 16px 32px 0 32px;
box-sizing: border-box;
@@ -531,6 +534,14 @@ export default {
.form-item__group {
margin-bottom: 24px;
background: #fff;
.addCount {
padding: 0 32px;
box-sizing: border-box;
::v-deep .u-btn--primary {
border-radius: 16px;
}
}
}
.form-item {

View File

@@ -1,20 +1,196 @@
<template>
<div class="AppGetwayRegister">
<u-button type="primary" @click="$linkTo(`./AddGetway`)">按钮</u-button>
<div class="title">
<h2>全部记录</h2>
<div class="right">
<span></span>
<i>{{ total }}</i>
<span></span>
</div>
</div>
<div class="home-list">
<div class="item" hover-class="bg-hover" @click="$linkTo(`./Detail?id=${item.id}`)"
v-for="(item, index) in list" :key="index">
<div class="item-top">
<h2>{{ item.name }}</h2>
<span v-if="item.status === '0'">有异常情况</span>
</div>
<p>{{ item.idNumber.replace(/^(\d{6})\d{8}(.{4}$)/g, `$1${Array(9).join('*')}$2`) }}</p>
<div class="item-info">
<div class="item-info__item">
<image src="/static/img/from-icon.png"/>
<span>{{ item.startAreaName }}</span>
</div>
<div class="item-info__item">
<image src="/static/img/to-icon.png"/>
<span>{{ item.arriveAreaName }}</span>
</div>
<div class="item-info__item">
<image src="/static/img/to-date.png"/>
<span>{{ item.arriveTime && item.arriveTime.substr(0, item.arriveTime.length - 3) }} 到达</span>
</div>
</div>
</div>
<AiEmpty v-if="list.length==0"/>
</div>
<div class="btn-wrapper">
<div class="btn" @click="toReport" hover-class="text-hover">添加卡口登记</div>
</div>
</div>
</template>
<script>
import {mapState} from 'vuex'
export default {
name: "AppGetwayRegister",
appName: "卡口登记",
data() {
return {
list: [],
current: 1,
total: 0
}
},
computed: {
...mapState(['user'])
},
onLoad() {
this.$loading()
this.getList()
this.$dict.load('villageActivityStatus')
uni.$on('update', () => {
this.current = 1
this.$nextTick(() => {
this.getList()
})
})
},
methods: {
toReport() {
this.$linkTo('./AddGetway')
},
getList() {
this.$instance.post(`/app/appepidemicbackhomerecord/list`, null, {
params: {
openId: this.user.openId,
current: this.current,
size: 15
}
}).then(res => {
uni.hideLoading()
if (res?.data) {
this.total = res.data.total
if (this.current > 1) {
this.list = [...this.list, ...res.data.records]
} else {
this.list = res.data.records
}
}
}).catch(() => {
uni.hideLoading()
})
}
},
onReachBottom() {
this.current++
this.getList()
}
}
</script>
<style lang="scss" scoped>
.AppGetwayRegister {}
</style>
<style lang="scss" socped>
.AppGetwayRegister {
padding: 0 0 150px 0;
.title {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 32px;
padding: 48px 32px 0 32px;
& > h2 {
font-size: 38px;
color: #333;
font-weight: 600;
}
.right {
display: flex;
align-items: center;
span {
color: #666666;
font-size: 28px;
}
i {
color: #4181FF;
font-style: normal;
font-size: 28px;
}
}
}
.item {
margin: 0 32px 24px;
padding: 32px;
border-radius: 16px;
background: #fff;
.item-info {
.item-info__item {
display: flex;
margin-bottom: 8px;
line-height: 1.3;
&:last-child {
margin-bottom: 0;
}
image {
position: relative;
top: 2px;
width: 32px;
height: 32px;
margin-right: 16px;
}
span {
flex: 1;
color: #333;
font-size: 28px;
}
}
}
.item-top {
display: flex;
align-items: center;
justify-content: space-between;
height: 50px;
h2 {
color: #333333;
font-size: 36px;
font-weight: 600;
}
span {
font-size: 28px;
color: #FF4466;
}
}
p {
margin: 14px 0 20px;
color: #999999;
font-size: 28px;
}
}
}
</style>

View File

@@ -1,15 +1,356 @@
<template>
<div class="DetailGetway"></div>
<div class="DetailGetway" v-if="pageShow">
<div class="detail-header">
<h2>{{ info.name }}的返乡登记信息</h2>
<div class="item-info">
<div class="item-info__item">
<image src="/static/img/from-icon.png"/>
<span>{{ info.startAreaName }}</span>
</div>
<div class="item-info__item">
<image src="/static/img/to-icon.png"/>
<span>{{ info.arriveAreaName }}</span>
</div>
<div class="item-info__item">
<image src="/static/img/to-date.png"/>
<span>{{ info.arriveTime && info.arriveTime.substr(0, info.arriveTime.length - 3) }} 到达</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.name }}</span>
</div>
</div>
<div class="detail-info__item">
<div class="left">
<label>身份证号</label>
</div>
<div class="right">
<span>{{ info.idNumber }}</span>
</div>
</div>
<div class="detail-info__item">
<div class="left">
<label>手机号码</label>
</div>
<div class="right" @click="call(info.phone)" hover-class="text-hover">
<image src="https://cdn.cunwuyun.cn/dvcp/h5/common/phone.png"/>
<span style="color: #4181FF">{{ info.phone }}</span>
</div>
</div>
<div class="detail-info__item">
<div class="left">
<label>人员类别</label>
</div>
<div class="right">
<span :style="{color: /[03]/.test(info.type) ? '#42D784' : '#FF4466'}">{{
$dict.getLabel('epidemicMemberType', info.type)
}}</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>{{ $dict.getLabel('epidemicRecentTravel', info.travelType) }}</span>
</div>
</div>
<div class="detail-info__item">
<div class="left">
<label>出发时间</label>
</div>
<div class="right">
<span>{{ info.startTime && info.startTime.substr(0, info.startTime.length - 3) }}</span>
</div>
</div>
<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 class="detail-info__item">
<div class="left">
<label>出发地址</label>
</div>
<div class="right">
<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>
</template>
<script>
export default {
appName: "卡口登记详情"
appName: "卡口登记详情",
data() {
return {
info: {},
pageShow: false
}
},
onLoad(query) {
this.$loading()
this.$dict.load(['epidemicRecentHealth', 'epidemicRecentTravel', 'epidemicTouchInFourteen', 'epidemicMemberType', 'epidemicRecentTestResult']).then(() => {
this.getInfo(query.id)
})
},
methods: {
preview(url) {
uni.previewImage({
urls: this.info.checkPhoto.map(v => v.url),
current: url
})
},
getInfo(id) {
this.$instance.post(`/app/appepidemicbackhomerecord/queryDetailById?id=${id}`).then(res => {
if (res.code === 0) {
this.info = res.data
this.info.checkPhoto = JSON.parse(res.data.checkPhoto)
let healthName = ''
this.info.isHealth = false
res.data.health.split(',').forEach(v => {
if (v > 0) {
this.info.isHealth = true
}
healthName = healthName + this.$dict.getLabel('epidemicRecentHealth', v)
})
this.info.healthName = healthName
this.$nextTick(() => {
this.pageShow = true
})
}
this.$hideLoading()
})
},
call(phone) {
uni.makePhoneCall({
phoneNumber: phone
})
}
}
}
</script>
<style lang="scss" scoped>
<style lang="scss">
.DetailGetway {
padding-bottom: 40px;
.detail-header {
padding: 32px;
background: #fff;
h2 {
margin-bottom: 32px;
color: #333333;
font-size: 40px;
font-weight: 600;
}
.item-info {
.item-info__item {
display: flex;
align-items: center;
margin-bottom: 8px;
&:last-child {
margin-bottom: 0;
}
image {
width: 32px;
height: 32px;
margin-right: 16px;
}
span {
color: #333;
font-size: 28px;
}
}
}
}
.detail-info {
margin-top: 24px;
padding: 0 32px;
background: #fff;
& > h2 {
height: 116px;
line-height: 116px;
font-size: 38px;
font-weight: 600;
color: #333;
}
.detail-info__item {
display: flex;
justify-content: space-between;
padding: 34px 0;
border-bottom: 1px solid #DDDDDD;
&:last-child {
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--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>

View File

@@ -0,0 +1,62 @@
<template>
<div class="namePhone">
<u-form ref="uForm">
<u-form-item label="姓名" :rules="[{ required: true, message: '请输入姓名' }]">
<u-input v-model="_name" type="text" placeholder="请输入" maxLength="10" />
</u-form-item>
<u-form-item label="手机号" :rules="[{ required: true, message: '请输入手机号' }]">
<u-input v-model="_phone" type="number" placeholder="请输入" maxLength="11" />
</u-form-item>
</u-form>
<u-button type="warning" @click="removeMe">删除</u-button>
</div>
</template>
<script>
export default {
props: {
name: Number,
phone: String,
index: Number,
},
computed: {
_name: {
get() {
return this.name;
},
set(val) {
this.$emit("update:name", val);
},
},
_phone: {
get() {
return this.phone;
},
set(val) {
this.$emit("update:phone", val);
},
},
},
data() {
return {
username: "",
uaerphone: "",
};
},
methods: {
removeMe() {
this.$emit("delCountHandle", this.index);
},
},
}
</script>
<style lang="scss" scoped>
.namePhone {
width: 100%;
height: 100%;
.uForm {
}
}
</style>