Files
dvcp_v2_wxcp_app/src/apps/AppPovertyAlleviation/MonitorPoorStatus.vue
2021-12-16 17:10:43 +08:00

353 lines
8.3 KiB
Vue

<template>
<div class="add">
<div class="form-group">
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>产业帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpIndustrialAssistance" v-model="form.industrialAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>健康帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpHealthAssistance" v-model="form.healthAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>就业帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpEmploymentAssistance" v-model="form.employmentAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>教育帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpEducationalAssistance" v-model="form.educationalAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>金融帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpFinancialAssistance" v-model="form.financialAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>社会帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpSocialAssistance" v-model="form.socialAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i style="opacity: 0;">*</i>
<span>公益岗位帮扶</span>
</div>
<div class="right">
<AiSelect dict="fpPublicWelfarePostAssistance" v-model="form.publicWelfarePostAssistance"></AiSelect>
</div>
</div>
</div>
<div class="form-item">
<div class="form-item__wrapper">
<div class="left">
<i>*</i>
<span>是否消除风险</span>
</div>
<div class="right">
<u-radio-group v-model="form.isRisk" @change="onRiskChange">
<u-radio :name="item.dictValue" v-for="(item, index) in $dict.getDict('fpYesOrNo')" :key="index">
{{ item.dictName }}
</u-radio>
</u-radio-group>
</div>
</div>
</div>
<div class="form-item" v-if="form.isRisk === '01'">
<div class="form-item__wrapper">
<div class="left">
<i>*</i>
<span>风险消除方式</span>
</div>
<div class="right">
<AiSelect dict="fpRiskEliminationMethod" v-model="form.riskEliminationMethod"></AiSelect>
</div>
</div>
</div>
<div class="form-item" v-if="form.isRisk === '01'">
<div class="form-item__wrapper">
<div class="left">
<i>*</i>
<span>风险消除时间</span>
</div>
<div class="right">
<AiDate v-model="form.riskEliminationDate"></AiDate>
</div>
</div>
</div>
</div>
<div class="btn" hover-class="text" @click="submit">保存</div>
</div>
</template>
<script>
import AiSelect from '@/components/AiSelect'
import AiDate from '@/components/AiDate'
export default {
data() {
return {
result: '',
form: {
isRisk: '02',
riskEliminationMethod: '',
riskEliminationDate: '',
industrialAssistance: '',
healthAssistance: '',
employmentAssistance: '',
educationalAssistance: '',
financialAssistance: '',
socialAssistance: '',
publicWelfarePostAssistance: ''
},
id: ''
}
},
components: {
AiDate,
AiSelect
},
onLoad(query) {
uni.showLoading()
this.$dict.load(['fpYesOrNo', 'fpRiskEliminationMethod', 'fpIndustrialAssistance', 'fpHealthAssistance', 'fpEmploymentAssistance',
'fpEducationalAssistance', 'fpFinancialAssistance', 'fpSocialAssistance', 'fpPublicWelfarePostAssistance']).then(() => {
this.getInfo(query.id)
})
this.id = query.id
},
methods: {
getInfo(id) {
this.$http.post(`/app/apppreventionreturntopoverty/queryDetailById?id=${id}`).then(res => {
if (res.code === 0) {
this.form = {
...this.form,
...res.data
}
if (this.form.riskEliminationMethod) {
this.form.isRisk = '01'
}
}
uni.hideLoading()
})
},
onRiskChange(e) {
if (e === '02') {
this.form.riskEliminationMethod = ''
this.form.riskEliminationDate = ''
}
},
submit() {
if (!this.form.isRisk) {
return this.$u.toast('请选择是否消除风险')
}
if (this.form.isRisk === '01') {
if (!this.form.riskEliminationMethod) {
return this.$u.toast('请选择风险消除方式')
}
if (!this.form.riskEliminationDate) {
return this.$u.toast('请选择风险消除时间')
}
}
uni.showLoading()
this.$http.post('/app/apppreventionreturntopoverty/addOrUpdate', {
...this.form,
riskEliminationMethod: this.form.isRisk ? this.form.riskEliminationMethod : '',
id: this.id,
status: this.form.isRisk === '01' ? 1 : ''
}).then(res => {
if (res.code === 0) {
this.$u.toast(this.isEdit ? '保存成功' : '提交成功')
uni.$emit('reload')
uni.navigateBack({
delta: 1
})
}
uni.hideLoading()
})
}
}
}
</script>
<style lang="scss">
.add {
padding-bottom: 120px;
& > div {
margin-bottom: 16px;
background: #fff;
}
::v-deep .u-radio {
&:last-child {
.u-radio__label {
margin-right: 0;
}
}
}
.form-group {
.form-item {
padding-left: 32px;
.form-item__wrapper {
display: flex;
align-items: center;
justify-content: space-between;
height: 112px;
border-bottom: 1px solid #E4E5E6;
}
.right {
height: 112px;
line-height: 112px;
padding-right: 32px;
span {
font-size: 30px;
color: #999999;
}
}
input {
height: 100%;
text-align: right;
}
.left {
display: flex;
align-items: center;
span {
color: #333333;
font-size: 32px;
}
i {
margin-right: 4px;
font-style: normal;
color: #FF4466;
font-size: 32px;
}
}
&:last-child {
.form-item__wrapper {
border: none;
}
}
}
}
.form-item__imgs {
padding: 32px;
.form-item__title {
display: flex;
align-items: center;
margin-bottom: 34px;
h2 {
color: #333333;
font-weight: normal;
font-size: 32px;
}
i {
color: #999999;
font-size: 28px;
font-style: normal;
}
}
textarea {
width: 100%;
}
}
.form-type {
display: flex;
align-items: center;
justify-content: space-between;
height: 112px;
padding: 0 32px;
h2 {
font-weight: normal;
color: #333333;
font-size: 32px;
}
span {
color: #999999;
font-size: 28px;
}
}
.btn {
position: fixed;
left: 0;
bottom: 0;
z-index: 11;
width: 100%;
height: 112px;
line-height: 112px;
margin: 0;
text-align: center;
color: #FFFFFF;
font-size: 32px;
background: #3192F4;
}
}
</style>