精神病 社区矫正
This commit is contained in:
shijingjing
@@ -29,7 +29,7 @@
|
|||||||
<h2>身份证号</h2>
|
<h2>身份证号</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
<input placeholder="请输入身份证号" v-model="form.idNum" :maxlength="18" />
|
<input placeholder="请输入身份证号" v-model="form.idNum" type="number" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -68,7 +68,7 @@
|
|||||||
<h2>联系电话</h2>
|
<h2>联系电话</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
<input placeholder="请输入" v-model="form.phone" :maxlength="20" />
|
<input placeholder="请输入" v-model="form.phone"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -92,7 +92,7 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>详细地址</h2>
|
<h2>详细地址</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -103,7 +103,7 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>所属网格</h2>
|
<h2>所属网格</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -111,21 +111,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 残疾人 -->
|
||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>家庭年收入（万）</h2>
|
<h2>家庭年收入（万）</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
<input placeholder="请输入" v-model="form.income" />
|
<input placeholder="请输入" v-model="form.income" type="number" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>婚姻情况</h2>
|
<h2>婚姻情况</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -136,7 +138,7 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>身体状况</h2>
|
<h2>身体状况</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -147,7 +149,7 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>残疾类型</h2>
|
<h2>残疾类型</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -158,7 +160,7 @@
|
|||||||
<div class="form-item">
|
<div class="form-item">
|
||||||
<div class="form-item__wrapper">
|
<div class="form-item__wrapper">
|
||||||
<div class="form-item__title">
|
<div class="form-item__title">
|
||||||
<i>*</i>
|
<i> </i>
|
||||||
<h2>残疾级别</h2>
|
<h2>残疾级别</h2>
|
||||||
</div>
|
</div>
|
||||||
<div class="form-item__right">
|
<div class="form-item__right">
|
||||||
@@ -166,6 +168,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div style="height: 56px;"></div>
|
||||||
<div class="btn" @click="submit">保存</div>
|
<div class="btn" @click="submit">保存</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -203,7 +207,10 @@ export default {
|
|||||||
AiAreaPicker
|
AiAreaPicker
|
||||||
},
|
},
|
||||||
|
|
||||||
onLoad() {},
|
onLoad() {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
onShow() {
|
onShow() {
|
||||||
document.title = '新增人员'
|
document.title = '新增人员'
|
||||||
|
|||||||
434
src/sass/AppSpecialPeople/addCorrectionUser.vue
Normal file
434
src/sass/AppSpecialPeople/addCorrectionUser.vue
Normal file
@@ -0,0 +1,434 @@
|
|||||||
|
<template>
|
||||||
|
<div class="addCorrectionUser">
|
||||||
|
<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-select v-model="form.type" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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="请输入姓名" v-model="form.name" :maxlength="15" />
|
||||||
|
</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="请输入身份证号" v-model="form.idNum" :maxlength="18" />
|
||||||
|
</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-select v-model="form.sex" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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.birthday">{{ form.birthday }}</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">
|
||||||
|
<input placeholder="请输入" v-model="form.phone" :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">
|
||||||
|
<ai-area-picker 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.area">{{ form.area }}</span>
|
||||||
|
<i v-else>请选择</i>
|
||||||
|
<u-icon name="arrow-right" color="#ddd"/>
|
||||||
|
</div>
|
||||||
|
</ai-area-picker>
|
||||||
|
</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="请输入" v-model="form.address" />
|
||||||
|
</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-select v-model="form.grid" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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="请输入具体罪名" v-model="form.name"/>
|
||||||
|
</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-select v-model="form.disableType" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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.birthday">{{ form.birthday }}</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">
|
||||||
|
<div class="ai-area" @click="isShowEndTime = true">
|
||||||
|
<div class="ai-area__wrapper">
|
||||||
|
<span class="label" v-if="form.birthday">{{ form.birthday }}</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-select v-model="form.disableType" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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-select v-model="form.disableRank" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="height: 56px;"></div>
|
||||||
|
<div class="btn" @click="submit">保存</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AiSelect from '../../components/AiSelect'
|
||||||
|
import AiAreaPicker from '../../components/AiAreaPicker.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'addCorrectionUser',
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: '',
|
||||||
|
form: {
|
||||||
|
type: [],
|
||||||
|
name: '',
|
||||||
|
idNum: '',
|
||||||
|
sex: [],
|
||||||
|
birthday: '',
|
||||||
|
phone: '',
|
||||||
|
address: '',
|
||||||
|
grid: '',
|
||||||
|
income: '',
|
||||||
|
marStatus: [],
|
||||||
|
healthStatus: [],
|
||||||
|
disableType: [],
|
||||||
|
disableRank: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
components: {
|
||||||
|
AiSelect,
|
||||||
|
AiAreaPicker
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad() {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
onShow() {
|
||||||
|
document.title = '新增人员'
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.addCorrectionUser {
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.form-item {
|
||||||
|
padding-left: 32px;
|
||||||
|
|
||||||
|
.form-item__checkbox {
|
||||||
|
width: 100%;
|
||||||
|
div {
|
||||||
|
width: 90%;
|
||||||
|
height: 90px;
|
||||||
|
line-height: 100px;
|
||||||
|
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: 90px;
|
||||||
|
line-height: 90px;
|
||||||
|
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;
|
||||||
|
font-style: initial;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 16px;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-item__wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 90px;
|
||||||
|
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: 400;
|
||||||
|
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 {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 112px;
|
||||||
|
line-height: 112px;
|
||||||
|
background: #1365dd;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #ffffff;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
429
src/sass/AppSpecialPeople/addPsychosisUser.vue
Normal file
429
src/sass/AppSpecialPeople/addPsychosisUser.vue
Normal file
@@ -0,0 +1,429 @@
|
|||||||
|
<template>
|
||||||
|
<div class="addPsychosisUser">
|
||||||
|
<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-select v-model="form.type" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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="请输入姓名" v-model="form.name" :maxlength="15" />
|
||||||
|
</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="请输入身份证号" v-model="form.idNum" :maxlength="18" />
|
||||||
|
</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-select v-model="form.sex" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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.birthday">{{ form.birthday }}</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">
|
||||||
|
<input placeholder="请输入" v-model="form.phone" :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">
|
||||||
|
<ai-area-picker 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.area">{{ form.area }}</span>
|
||||||
|
<i v-else>请选择</i>
|
||||||
|
<u-icon name="arrow-right" color="#ddd"/>
|
||||||
|
</div>
|
||||||
|
</ai-area-picker>
|
||||||
|
</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="请输入" v-model="form.address" />
|
||||||
|
</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-select v-model="form.grid" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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="请输入" v-model="form.income" />
|
||||||
|
</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.birthday">{{ form.birthday }}</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">
|
||||||
|
<input placeholder="请输入姓名" v-model="form.name" :maxlength="15" />
|
||||||
|
</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="请输入" v-model="form.phone" type="number" />
|
||||||
|
</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-select v-model="form.disableType" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</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-select v-model="form.disableRank" dict="epidemicRecentPersonType" class="select"></ai-select>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div style="height: 56px;"></div>
|
||||||
|
<div class="btn" @click="submit">保存</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import AiSelect from '../../components/AiSelect'
|
||||||
|
import AiAreaPicker from '../../components/AiAreaPicker.vue'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'addPsychosisUser',
|
||||||
|
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value: '',
|
||||||
|
form: {
|
||||||
|
type: [],
|
||||||
|
name: '',
|
||||||
|
idNum: '',
|
||||||
|
sex: [],
|
||||||
|
birthday: '',
|
||||||
|
phone: '',
|
||||||
|
address: '',
|
||||||
|
grid: '',
|
||||||
|
income: '',
|
||||||
|
marStatus: [],
|
||||||
|
healthStatus: [],
|
||||||
|
disableType: [],
|
||||||
|
disableRank: []
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
components: {
|
||||||
|
AiSelect,
|
||||||
|
AiAreaPicker
|
||||||
|
},
|
||||||
|
|
||||||
|
onLoad() {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
onShow() {
|
||||||
|
document.title = '新增人员'
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.addPsychosisUser {
|
||||||
|
height: 100%;
|
||||||
|
|
||||||
|
.form-item {
|
||||||
|
padding-left: 32px;
|
||||||
|
|
||||||
|
.form-item__checkbox {
|
||||||
|
width: 100%;
|
||||||
|
div {
|
||||||
|
width: 90%;
|
||||||
|
height: 90px;
|
||||||
|
line-height: 100px;
|
||||||
|
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: 90px;
|
||||||
|
line-height: 90px;
|
||||||
|
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;
|
||||||
|
font-style: initial;
|
||||||
|
}
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 16px;
|
||||||
|
height: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.form-item__wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
height: 90px;
|
||||||
|
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: 400;
|
||||||
|
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 {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 112px;
|
||||||
|
line-height: 112px;
|
||||||
|
background: #1365dd;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32px;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #ffffff;
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Reference in New Issue
Block a user