返乡登记
This commit is contained in:
liuye
97
src/components/AiCheckbox.vue
Normal file
97
src/components/AiCheckbox.vue
Normal file
@@ -0,0 +1,97 @@
|
||||
<template>
|
||||
<div class="AiCheckbox">
|
||||
<div
|
||||
class="AiCheckbox-item"
|
||||
v-for="(item, index) in options"
|
||||
@click="onChange(item.value)"
|
||||
:class="[choosed.indexOf(item.value) > -1 ? 'active' : '']"
|
||||
:key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AiCheckbox',
|
||||
|
||||
model: {
|
||||
event: 'input',
|
||||
prop: 'value'
|
||||
},
|
||||
|
||||
props: {
|
||||
value: Array,
|
||||
placeholder: {
|
||||
default: '请选择'
|
||||
},
|
||||
list: {
|
||||
default: () => []
|
||||
},
|
||||
dict: String,
|
||||
disabled: Boolean
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
dictKey: '',
|
||||
choosed: []
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
options () {
|
||||
return this.dictKey ? this.$dict.getDict(this.dict).map(e => ({
|
||||
value: e.dictValue,
|
||||
label: e.dictName
|
||||
})) : this.list
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$dict.load(this.dict).then(() => {
|
||||
this.dictKey = this.dict
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange (value) {
|
||||
if (this.choosed.indexOf(value) > -1) {
|
||||
this.choosed.splice(this.choosed.indexOf(value), 1)
|
||||
} else {
|
||||
this.choosed.push(value)
|
||||
}
|
||||
|
||||
this.$emit('input', this.choosed)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiCheckbox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.AiCheckbox-item {
|
||||
width: 100%;
|
||||
line-height: 1.3;
|
||||
padding: 20px 32px;
|
||||
margin-bottom: 16px;
|
||||
text-align: center;
|
||||
background: #FFFFFF;
|
||||
box-sizing: border-box;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #CCCCCC;
|
||||
|
||||
&.active {
|
||||
background: #4181FF;
|
||||
color: #fff;
|
||||
border-color: #4181FF;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
120
src/components/AiRadio.vue
Normal file
120
src/components/AiRadio.vue
Normal file
@@ -0,0 +1,120 @@
|
||||
<template>
|
||||
<div class="AiRadio" :class="[isLine ? 'AiRadio-line' : '']">
|
||||
<div
|
||||
class="AiRadio-item"
|
||||
v-for="(item, index) in options"
|
||||
@click="onChange(index)"
|
||||
:class="[currIndex === index ? 'active' : '']"
|
||||
:key="index">
|
||||
{{ item.label }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'AiRadio',
|
||||
|
||||
model: {
|
||||
event: 'input',
|
||||
prop: 'value'
|
||||
},
|
||||
|
||||
props: {
|
||||
value: String,
|
||||
placeholder: {
|
||||
default: '请选择'
|
||||
},
|
||||
list: {
|
||||
default: () => []
|
||||
},
|
||||
isLine: Boolean,
|
||||
dict: String,
|
||||
disabled: Boolean
|
||||
},
|
||||
|
||||
data () {
|
||||
return {
|
||||
currIndex: -1,
|
||||
dictKey: ''
|
||||
}
|
||||
},
|
||||
|
||||
computed: {
|
||||
options () {
|
||||
return this.dictKey ? this.$dict.getDict(this.dict).map(e => ({
|
||||
value: e.dictValue,
|
||||
label: e.dictName
|
||||
})) : this.list
|
||||
}
|
||||
},
|
||||
|
||||
mounted () {
|
||||
this.$dict.load(this.dict).then(() => {
|
||||
this.dictKey = this.dict
|
||||
|
||||
if (this.value) {
|
||||
console.log(this.value)
|
||||
this.$dict.getDict(this.dict).forEach((e, i) => {
|
||||
console.log(e)
|
||||
if (e.dictValue === this.value) {
|
||||
this.currIndex = i
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
methods: {
|
||||
onChange (index) {
|
||||
this.currIndex = index
|
||||
const choosed = this.options[index]
|
||||
this.$emit('name', choosed.label)
|
||||
this.$emit('input', choosed.value)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.AiRadio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
.AiRadio-item {
|
||||
width: 212px;
|
||||
line-height: 1.3;
|
||||
padding: 20px 32px;
|
||||
margin-bottom: 16px;
|
||||
margin-right: 16px;
|
||||
padding: 20px 32px;
|
||||
text-align: center;
|
||||
background: #FFFFFF;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #CCCCCC;
|
||||
box-sizing: border-box;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #4181FF;
|
||||
color: #fff;
|
||||
border-color: #4181FF;
|
||||
}
|
||||
}
|
||||
|
||||
&.AiRadio-line {
|
||||
width: 100%;
|
||||
|
||||
.AiRadio-item {
|
||||
width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
773
src/sass/AppBackUserList/Add.vue
Normal file
773
src/sass/AppBackUserList/Add.vue
Normal file
@@ -0,0 +1,773 @@
|
||||
<template>
|
||||
<div class="album">
|
||||
<div class="tips">
|
||||
请确保以下信息全部由本人填写，本人对所填写内容的真实性和完整性负责
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>返乡人员姓名</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input placeholder="请输入" v-model="form.name" :maxlength="20" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>身份证号</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input
|
||||
placeholder="请输入"
|
||||
type="idcard"
|
||||
v-model="form.idNumber"
|
||||
:maxlength="20"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>手机号码</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input
|
||||
placeholder="请输入"
|
||||
type="number"
|
||||
v-model="form.phone"
|
||||
:maxlength="11"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>人员类别</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiSelect
|
||||
v-model="form.type"
|
||||
dict="epidemicRecentPersonType"
|
||||
class="select"
|
||||
></AiSelect>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>出行方式</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiSelect
|
||||
dict="epidemicRecentTravel"
|
||||
v-model="form.travelType"
|
||||
class="select"
|
||||
></AiSelect>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>出发时间</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<div class="ai-area" @click="isShowStartTime = true">
|
||||
<div class="ai-area__wrapper">
|
||||
<span class="label" v-if="form.startTime">{{
|
||||
form.startTime
|
||||
}}</span>
|
||||
<i v-else>请选择</i>
|
||||
<u-icon name="arrow-right" color="#ddd" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>出发地区</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiAreaPicker
|
||||
ref="area"
|
||||
class="ai-area"
|
||||
:value="form.startAreaId"
|
||||
:fullName.sync="form.startAreaName"
|
||||
all
|
||||
mode="custom"
|
||||
@select="(v) => (form.startAreaId = v)"
|
||||
>
|
||||
<div class="ai-area__wrapper">
|
||||
<span class="label" v-if="form.startAreaName">{{
|
||||
form.startAreaName
|
||||
}}</span>
|
||||
<i v-else>请选择</i>
|
||||
<u-icon name="arrow-right" color="#ddd" />
|
||||
</div>
|
||||
</AiAreaPicker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__textarea">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>出发地址</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<textarea
|
||||
auto-height
|
||||
v-model="form.startAddress"
|
||||
:maxlength="500"
|
||||
placeholder="请输入详细的出发地址"
|
||||
placeholder-style="font-size: 16px"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>到达时间</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<div class="ai-area" @click="isShowEndTime = true">
|
||||
<div class="ai-area__wrapper">
|
||||
<span class="label" v-if="form.arriveTime">{{
|
||||
form.arriveTime
|
||||
}}</span>
|
||||
<i v-else>请选择</i>
|
||||
<u-icon name="arrow-right" color="#ddd" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>到达地区</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<ai-area-picker
|
||||
ref="area"
|
||||
class="ai-area"
|
||||
:value="form.arriveAreaId"
|
||||
:fullName.sync="form.arriveAreaName"
|
||||
:areaId="$areaId"
|
||||
mode="custom"
|
||||
@select="(v) => (form.arriveAreaId = v)"
|
||||
>
|
||||
<div class="ai-area__wrapper">
|
||||
<span class="label" v-if="form.arriveAreaName">{{
|
||||
form.arriveAreaName
|
||||
}}</span>
|
||||
<i v-else>请选择</i>
|
||||
<u-icon name="arrow-right" color="#ddd" />
|
||||
</div>
|
||||
</ai-area-picker>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__textarea">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>返乡地址</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<textarea
|
||||
auto-height
|
||||
v-model="form.arriveAddress"
|
||||
:maxlength="500"
|
||||
placeholder="请输入详细的返乡地址"
|
||||
placeholder-style="font-size: 16px"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__textarea">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>行程描述</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<textarea
|
||||
auto-height
|
||||
style="height: 90px"
|
||||
v-model="form.description"
|
||||
:maxlength="500"
|
||||
placeholder="请输入行程描述"
|
||||
placeholder-style="font-size: 16px"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>核酸检测日期</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<div class="ai-area" @click="isShowDate = true">
|
||||
<div class="ai-area__wrapper">
|
||||
<span class="label" v-if="form.checkTime">{{
|
||||
form.checkTime
|
||||
}}</span>
|
||||
<i v-else>请选择</i>
|
||||
<u-icon name="arrow-right" color="#ddd" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__imgs">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>本人健康码截图或核酸检测报告</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiUploader v-model="form.checkPhoto" :limit="1"></AiUploader>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__imgs">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>核酸检测结果</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiRadio
|
||||
style="width: 100%"
|
||||
v-model="form.checkResult"
|
||||
dict="epidemicRecentTestResult"
|
||||
></AiRadio>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item__group">
|
||||
<div class="form-item">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>当前体温</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<input
|
||||
placeholder="请输入"
|
||||
v-model="form.temperature"
|
||||
:maxlength="20"
|
||||
/>
|
||||
<i>℃</i>
|
||||
</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">
|
||||
<ai-radio
|
||||
style="width: 100%"
|
||||
v-model="form.touchInFourteen"
|
||||
dict="epidemicTouchInFourteen"
|
||||
></ai-radio>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-item form-item__imgs">
|
||||
<div class="form-item__wrapper">
|
||||
<div class="form-item__title">
|
||||
<i>*</i>
|
||||
<h2>当前健康状况（可多选）</h2>
|
||||
</div>
|
||||
<div class="form-item__right">
|
||||
<AiCheckbox
|
||||
style="width: 100%"
|
||||
v-model="form.health"
|
||||
dict="epidemicRecentHealth"
|
||||
></AiCheckbox>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<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="btn-wrapper">
|
||||
<div class="btn" hover-class="text-hover" @click="submit">提交</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import AiUploader from "@/components/AiUploader/AiUploader";
|
||||
// import AiSelect from "@/components/AiSelect/AiSelect";
|
||||
import { mapState } from "vuex";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isShowType: false,
|
||||
isShowEndTime: false,
|
||||
isShowStartTime: false,
|
||||
isShowDate: false,
|
||||
params: {
|
||||
year: true,
|
||||
month: true,
|
||||
day: true,
|
||||
hour: true,
|
||||
minute: true,
|
||||
},
|
||||
dataParams: {
|
||||
year: true,
|
||||
month: true,
|
||||
day: true,
|
||||
},
|
||||
form: {
|
||||
arriveAddress: "",
|
||||
arriveAreaId: "",
|
||||
arriveAreaName: "",
|
||||
arriveTime: "",
|
||||
checkPhoto: [],
|
||||
checkResult: "",
|
||||
checkTime: "",
|
||||
description: "",
|
||||
health: [],
|
||||
idNumber: "",
|
||||
name: "",
|
||||
phone: "",
|
||||
startAddress: "",
|
||||
startAreaId: "",
|
||||
startAreaName: "",
|
||||
startTime: "",
|
||||
temperature: "",
|
||||
touchInFourteen: "",
|
||||
travelType: "",
|
||||
type: "",
|
||||
unusual: "",
|
||||
},
|
||||
dictList: [],
|
||||
arr: [],
|
||||
gridList: [[], [], []],
|
||||
flag: false,
|
||||
$areaId: "",
|
||||
};
|
||||
},
|
||||
|
||||
|
||||
computed: {
|
||||
...mapState(["user"]),
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
this.$areaId = this.user.$areaId;
|
||||
document.title = '返乡登记'
|
||||
},
|
||||
|
||||
methods: {
|
||||
onDateChange(e) {
|
||||
this.form.checkTime = `${e.year}-${e.month}-${e.day}`;
|
||||
},
|
||||
|
||||
onStartChange(e) {
|
||||
this.form.startTime = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`;
|
||||
},
|
||||
|
||||
onEndChange(e) {
|
||||
this.form.arriveTime = `${e.year}-${e.month}-${e.day} ${e.hour}:${e.minute}`;
|
||||
},
|
||||
|
||||
submit() {
|
||||
if (!this.form.name) {
|
||||
return this.$u.toast("请输入返乡人员姓名");
|
||||
}
|
||||
|
||||
if (!this.form.idNumber) {
|
||||
return this.$u.toast("请输入返乡人员身份证号");
|
||||
}
|
||||
|
||||
if (
|
||||
!/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(this.form.idNumber)
|
||||
) {
|
||||
return this.$u.toast("请输入正确的身份证账号");
|
||||
}
|
||||
|
||||
if (!this.form.phone) {
|
||||
return this.$u.toast("请输入返乡人员手机号码");
|
||||
}
|
||||
|
||||
if (!/^1[0-9]{10,10}$/.test(this.form.phone)) {
|
||||
return this.$u.toast("请输入正确的手机号码");
|
||||
}
|
||||
|
||||
if (!this.form.type) {
|
||||
return this.$u.toast("请选择人员类别");
|
||||
}
|
||||
|
||||
if (!this.form.travelType) {
|
||||
return this.$u.toast("请选择出行方式");
|
||||
}
|
||||
|
||||
if (!this.form.startTime) {
|
||||
return this.$u.toast("请选择出发时间");
|
||||
}
|
||||
|
||||
if (
|
||||
new Date(this.form.startTime.replace(/-/g, "/")).getTime() >
|
||||
new Date().getTime()
|
||||
) {
|
||||
return this.$u.toast("出发时间不得晚于当前时间");
|
||||
}
|
||||
|
||||
if (!this.form.startAreaName) {
|
||||
return this.$u.toast("请选择出发地区");
|
||||
}
|
||||
|
||||
if (
|
||||
this.form.startAreaId.substr(this.form.startAreaId.length - 3, 3) ===
|
||||
"000"
|
||||
) {
|
||||
return this.$u.toast("出发地区必须选到村或社区");
|
||||
}
|
||||
if (!this.form.startAddress) {
|
||||
return this.$u.toast("请输入出发详细地址");
|
||||
}
|
||||
|
||||
if (!this.form.arriveTime) {
|
||||
return this.$u.toast("请选择到达时间");
|
||||
}
|
||||
|
||||
if (
|
||||
new Date(this.form.startTime.replace(/-/g, "/")).getTime() >=
|
||||
new Date(this.form.arriveTime.replace(/-/g, "/")).getTime()
|
||||
) {
|
||||
return this.$u.toast("到达时间不得早于出发时间");
|
||||
}
|
||||
|
||||
if (!this.form.arriveAreaName) {
|
||||
return this.$u.toast("请选择到达地区");
|
||||
}
|
||||
if (
|
||||
this.form.arriveAreaId.substr(this.form.arriveAreaId.length - 3, 3) ===
|
||||
"000"
|
||||
) {
|
||||
return this.$u.toast("到达地区必须选到村或社区");
|
||||
}
|
||||
if (!this.form.arriveAddress) {
|
||||
return this.$u.toast("请输入返乡地址");
|
||||
}
|
||||
|
||||
if (!this.form.description) {
|
||||
return this.$u.toast("请输入行程描述");
|
||||
}
|
||||
if (!this.form.checkTime) {
|
||||
return this.$u.toast("请选择核酸检测日期");
|
||||
}
|
||||
if (!this.form.checkPhoto.length) {
|
||||
return this.$u.toast("请上传本人健康码截图或核酸检测报告");
|
||||
}
|
||||
|
||||
if (!this.form.checkResult) {
|
||||
return this.$u.toast("请选择核酸检测结果");
|
||||
}
|
||||
if (!this.form.temperature) {
|
||||
return this.$u.toast("请输入当前体温");
|
||||
}
|
||||
if (!this.form.touchInFourteen) {
|
||||
return this.$u.toast("请选择14天内是否接触新冠确诊或疑似患者");
|
||||
}
|
||||
|
||||
if (!this.form.health.length) {
|
||||
return this.$u.toast("请选择当前健康状况");
|
||||
}
|
||||
if (this.flag) return;
|
||||
this.flag = true;
|
||||
|
||||
this.$loading();
|
||||
this.$http
|
||||
.post(`/app/appepidemicbackhomerecord/addOrUpdate`, {
|
||||
...this.form,
|
||||
openid: this.user.openid,
|
||||
startTime: this.form.startTime + ":00",
|
||||
arriveTime: this.form.arriveTime + ":00",
|
||||
checkTime: this.form.checkTime + " 00:00:00",
|
||||
health: this.form.health.join(","),
|
||||
checkPhoto: JSON.stringify(this.form.checkPhoto),
|
||||
})
|
||||
.then((res) => {
|
||||
this.$hideLoading();
|
||||
this.flag = false;
|
||||
if (res.code == 0) {
|
||||
uni.$emit("update");
|
||||
this.$u.toast("提交成功");
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 400);
|
||||
}
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.album {
|
||||
padding-bottom: 140px;
|
||||
|
||||
.tips {
|
||||
line-height: 1.3;
|
||||
padding: 32px 32px;
|
||||
color: #ff883c;
|
||||
font-size: 30px;
|
||||
text-align: justify;
|
||||
background: #fff8f3;
|
||||
}
|
||||
|
||||
.form-item__group {
|
||||
margin-bottom: 24px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.form-item {
|
||||
padding-left: 32px;
|
||||
|
||||
.form-item__checkbox {
|
||||
width: 100%;
|
||||
div {
|
||||
width: 100%;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-bottom: 24px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__radio {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
|
||||
div {
|
||||
width: 212px;
|
||||
height: 80px;
|
||||
line-height: 80px;
|
||||
margin-right: 16px;
|
||||
margin-bottom: 8px;
|
||||
text-align: center;
|
||||
background: #ffffff;
|
||||
border-radius: 16px;
|
||||
color: #333333;
|
||||
font-size: 28px;
|
||||
border: 1px solid #cccccc;
|
||||
|
||||
&:nth-of-type(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
&.active {
|
||||
background: #4181ff;
|
||||
color: #fff;
|
||||
border-color: #4181ff;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.ai-area__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 100px;
|
||||
|
||||
span {
|
||||
color: #333;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
i {
|
||||
color: #999;
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 16px;
|
||||
height: 8px;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__wrapper {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 128px;
|
||||
padding-right: 28px;
|
||||
border-bottom: 1px solid #dddddd;
|
||||
|
||||
input {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
text-align: right;
|
||||
color: #333;
|
||||
padding-right: 10px;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 32px;
|
||||
|
||||
.select {
|
||||
._i {
|
||||
padding-left: 100px;
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
max-width: 400px;
|
||||
margin-right: 8px;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
i {
|
||||
margin-right: 8px;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
.form-item__wrapper {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
i {
|
||||
font-size: 32px;
|
||||
color: #ff4466;
|
||||
}
|
||||
|
||||
span {
|
||||
font-size: 28px;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
h2 {
|
||||
padding: 0 4px;
|
||||
font-weight: 600;
|
||||
font-size: 32px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
&.form-item__imgs,
|
||||
&.form-item__textarea {
|
||||
.form-item__wrapper {
|
||||
display: block;
|
||||
height: auto;
|
||||
padding-bottom: 32px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
}
|
||||
|
||||
.form-item__title {
|
||||
padding: 32px 0;
|
||||
}
|
||||
|
||||
.form-item__right {
|
||||
padding-left: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-wrapper {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
bottom: 0;
|
||||
z-index: 11;
|
||||
width: 100%;
|
||||
padding: 20px 0 20px 0 !important;
|
||||
transform: translateX(-50%);
|
||||
background: #f3f6f9;
|
||||
}
|
||||
|
||||
.btn-wrapper .btn {
|
||||
width: 686px;
|
||||
height: 88px;
|
||||
line-height: 88px;
|
||||
margin: 0 auto;
|
||||
padding: 0 !important;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-size: 34px;
|
||||
background: #4181FF;
|
||||
border-radius: 16px;
|
||||
}
|
||||
|
||||
.btn-wrapper .disabled {
|
||||
color: #B9E7D0;
|
||||
background: #50C48A;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -2,10 +2,10 @@
|
||||
<div class="BackUserList">
|
||||
<AiTopFixed v-if="isAdmin">
|
||||
<div class="pad-t32"></div>
|
||||
<div class="select-gird" @click="linkTo('./SelectGird')">
|
||||
<div class="select-gird" @click="showSelect=true">
|
||||
<img src="./components/img/gird-icon.png" alt="" class="gird-icon">
|
||||
<div>
|
||||
{{params.girdName}}
|
||||
{{girdName}}
|
||||
<img src="./components/img/down-icon.png" alt="" class="down-icon">
|
||||
</div>
|
||||
</div>
|
||||
@@ -48,9 +48,32 @@
|
||||
</div>
|
||||
<div class="pad-b120"></div>
|
||||
<div class="footer">
|
||||
<div class="bg-fff">登记</div>
|
||||
<div class="bg-blue">邀请居民填写</div>
|
||||
<div class="bg-fff" @click="linkTo('./Add')">登记</div>
|
||||
<div class="bg-blue" @click="show=true">邀请居民填写</div>
|
||||
</div>
|
||||
<u-popup v-model="show" mode="bottom" border-radius="14">
|
||||
<div class="line-bg"></div>
|
||||
<div class="flex">
|
||||
<div class="item">
|
||||
<img src="./components/img/zf.png" alt="">
|
||||
<p>转发</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="./components/img/wx.png" alt="">
|
||||
<p>分享到微信</p>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img src="./components/img/lj.png" alt="">
|
||||
<p>获取链接</p>
|
||||
</div>
|
||||
<div class="item" @click="linkTo('./Qrcode')">
|
||||
<img src="./components/img/ewm.png" alt="">
|
||||
<p>保存二维码</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn" @click="show=false">取消</div>
|
||||
</u-popup>
|
||||
<u-select v-model="showSelect" :list="girdList" label-name="dictName" value-name="dictValue" @confirm="confirmSelect"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
@@ -61,33 +84,36 @@ export default {
|
||||
appName: '返乡登记',
|
||||
data() {
|
||||
return {
|
||||
areaId: '',
|
||||
areaName: '',
|
||||
tabIndex: 0,
|
||||
current: 1,
|
||||
list: [],
|
||||
name: '',
|
||||
totalInfo: {},
|
||||
params: {},
|
||||
isAdmin: true
|
||||
isAdmin: true,
|
||||
show: false,
|
||||
girdList: [],
|
||||
girdName: '',
|
||||
girdId: '',
|
||||
showSelect: false
|
||||
}
|
||||
},
|
||||
computed: { ...mapState(['user']) },
|
||||
onShow() {
|
||||
this.areaId = this.user.areaId
|
||||
this.areaName = this.user.areaName
|
||||
document.title = '返乡登记'
|
||||
this.getList()
|
||||
this.getTotal()
|
||||
uni.$on('updateList', () => {
|
||||
this.getListInit()
|
||||
})
|
||||
this.isGirdUser()
|
||||
uni.$on('goback', (res) => {
|
||||
this.params = res
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
confirmSelect(e) {
|
||||
console.log(e)
|
||||
this.girdId = e[0].value
|
||||
this.girdList.map((item) => {
|
||||
if(item.id == this.girdId) {
|
||||
this.girdName = item.girdName
|
||||
}
|
||||
})
|
||||
this.getListInit()
|
||||
this.getTotal()
|
||||
},
|
||||
tabClick(index) {
|
||||
this.tabIndex = index
|
||||
this.getListInit()
|
||||
@@ -102,7 +128,7 @@ export default {
|
||||
if(this.tabIndex == 1) {
|
||||
status = 0
|
||||
}
|
||||
this.$http.post(`/app/appepidemicbackhomerecord/list?current=${this.current}&size=10&status=${status}&name=${this.name}&arriveAreaId=${this.areaId}`)
|
||||
this.$http.post(`/app/appepidemicbackhomerecord/list?current=${this.current}&size=10&status=${status}&name=${this.name}&arriveGirdId=${this.girdId}`)
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
res.data.records.map((item) => {
|
||||
@@ -113,7 +139,7 @@ export default {
|
||||
})
|
||||
},
|
||||
getTotal() {
|
||||
this.$http.post(`/app/appepidemicbackhomerecord/statistic?areaId=${this.areaId}`).then((res) => {
|
||||
this.$http.post(`/app/appepidemicbackhomerecord/statistic?arriveGirdId=${this.girdId}`).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.totalInfo = res.data
|
||||
}
|
||||
@@ -132,10 +158,29 @@ export default {
|
||||
if (res.data.checkType != '0') {
|
||||
this.isAdmin = true
|
||||
this.params = res.data.appGirdInfo
|
||||
this.getGirdList()
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
getGirdList() {
|
||||
this.$http.post('/app/appgirdmemberinfo/queryMyGirdListByLevel2AndUser').then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.girdList = res.data
|
||||
this.girdId = res.data[0].id
|
||||
this.girdName = res.data[0].girdName
|
||||
this.getList()
|
||||
this.getTotal()
|
||||
}
|
||||
})
|
||||
},
|
||||
close() {
|
||||
this.show = false
|
||||
},
|
||||
open() {
|
||||
console.log(123)
|
||||
this.show = true
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.current ++
|
||||
@@ -354,5 +399,48 @@ export default {
|
||||
background-color: #3975C6;
|
||||
}
|
||||
}
|
||||
.line-bg{
|
||||
width: 110px;
|
||||
height: 8px;
|
||||
background: #DCDDDE;
|
||||
border-radius: 4px;
|
||||
margin: 32px auto 82px;
|
||||
}
|
||||
.flex{
|
||||
width: 100%;
|
||||
display: flex;
|
||||
padding-bottom: 70px;
|
||||
.item{
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
img{
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
border-radius: 16px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
p{
|
||||
font-size: 26px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #666;
|
||||
line-height: 36px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn{
|
||||
width: 100%;
|
||||
height: 96px;
|
||||
line-height: 96px;
|
||||
text-align: center;
|
||||
background: #FFF;
|
||||
font-size: 30px;
|
||||
font-family: PingFangSC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333;
|
||||
}
|
||||
::v-deep .uni-scroll-view{
|
||||
background-color:#f7f7f7;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
87
src/sass/AppBackUserList/Qrcode.vue
Normal file
87
src/sass/AppBackUserList/Qrcode.vue
Normal file
@@ -0,0 +1,87 @@
|
||||
<template>
|
||||
<div class="Qrcode">
|
||||
<div class="content">
|
||||
<img src="./components/img/qrcode-header.png" alt="" class="header-img">
|
||||
<div class="code-content">
|
||||
<div class="img-div">
|
||||
<img src="./components/img/ewm.png" alt="">
|
||||
</div>
|
||||
<p>扫二维码填写返乡人员信息</p>
|
||||
<p>网格信息:千岩街网格</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapState } from 'vuex'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed: { ...mapState(['user']) },
|
||||
onShow() {
|
||||
document.title = '返乡人员信息'
|
||||
},
|
||||
onLoad(option) {
|
||||
|
||||
},
|
||||
methods: {
|
||||
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
uni-page-body{
|
||||
height: 100%;
|
||||
}
|
||||
.Qrcode{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-color: #F3F6F9;
|
||||
padding: 30px 30px 134px;
|
||||
box-sizing: border-box;
|
||||
.content{
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
padding: 120px 70px 200px;
|
||||
box-sizing: border-box;
|
||||
.header-img{
|
||||
width: 100%;
|
||||
}
|
||||
.code-content{
|
||||
width: 100%;
|
||||
height: 614px;
|
||||
background: #F6F9FF;
|
||||
border-radius: 12px;
|
||||
border: 1px solid #E6EEFF;
|
||||
margin-top: -8px;
|
||||
padding: 28px 44px 0;
|
||||
box-sizing: border-box;
|
||||
.img-div{
|
||||
width: 462px;
|
||||
height: 462px;
|
||||
background-color: #fff;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
img{
|
||||
width: 424px;
|
||||
height: 424px;
|
||||
margin: auto;
|
||||
}
|
||||
p{
|
||||
margin-top: 8px;
|
||||
font-size: 26px;
|
||||
font-family: PingFangSC-Regular, PingFang SC;
|
||||
color: #333;
|
||||
line-height: 36px;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
BIN
src/sass/AppBackUserList/components/img/ewm.png
Normal file
BIN
src/sass/AppBackUserList/components/img/ewm.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 625 B |
BIN
src/sass/AppBackUserList/components/img/lj.png
Normal file
BIN
src/sass/AppBackUserList/components/img/lj.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
BIN
src/sass/AppBackUserList/components/img/qrcode-header.png
Normal file
BIN
src/sass/AppBackUserList/components/img/qrcode-header.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.7 KiB |
BIN
src/sass/AppBackUserList/components/img/wx.png
Normal file
BIN
src/sass/AppBackUserList/components/img/wx.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.2 KiB |
BIN
src/sass/AppBackUserList/components/img/zf.png
Normal file
BIN
src/sass/AppBackUserList/components/img/zf.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
@@ -403,42 +403,9 @@ export default {
|
||||
}
|
||||
}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
this.form = res.data
|
||||
this.form.userType = this.index
|
||||
this.form.name = res.data.name
|
||||
this.form.idNumber = res.data.idNumber
|
||||
this.form.gender=res.data.gender,
|
||||
this.form.birth=res.data.birth,
|
||||
this.form.phone=res.data.phone,
|
||||
this.form.areaName=res.data.areaName,
|
||||
this.form.address=res.data.address,
|
||||
this.form.girdName=res.data.girdName,
|
||||
this.form.areaId=res.data.areaId,
|
||||
this.form.income=res.data.income,
|
||||
this.form.marriage = res.data.marriage,
|
||||
this.form.health = res.data.health
|
||||
this.form.type = res.data.type
|
||||
this.form.level= res.data.level
|
||||
this.form.sickTime= res.data.sickTime
|
||||
this.form.helpName= res.data.helpName
|
||||
this.form.helpPhone= res.data.helpPhone
|
||||
this.form.crime= res.data.crime
|
||||
this.form.startTime= res.data.startTime
|
||||
this.form.endTime= res.data.endTime
|
||||
this.form.isCreateGroup= res.data.isCreateGroup
|
||||
this.form.isRelease= res.data.isRelease
|
||||
this.form.firstTime= res.data.firstTime
|
||||
this.form.status= res.data.status
|
||||
this.form.debug= res.data.debug
|
||||
this.form.control= res.data.control
|
||||
this.form.controlName= res.data.controlName
|
||||
this.form.controlPhone= res.data.controlPhone
|
||||
this.form.isSecond= res.data.isSecond
|
||||
this.form.place= res.data.place
|
||||
this.form.denger= res.data.denger
|
||||
this.form.placement= res.data.placement
|
||||
this.form.situation= res.data.situation
|
||||
this.form.situationTime= res.data.situationTime
|
||||
this.form.isRepeat= res.data.isRepeat
|
||||
this.$forceUpdate()
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user