You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

259 lines
10 KiB

<template>
<div class="app-container">
<div class="tab-header webtop">
<!--标题-->
<div>{{ viewTitle }}</div>
<!--start 添加修改按钮-->
<div>
<el-button type="info" size="small" @click="handleReturn()">关闭</el-button>
</div>
</div>
<div class="listconadd">
<el-form ref="form_obj" :model="formobj" class="formaddcopy02">
<el-collapse v-model="activeNames" accordion>
<el-collapse-item title="家访见证类" name="1">
<el-row>
<el-col :span="24">
<div class="span-sty colSty">定位信息</div>
<el-form-item><span class="addinputInfo">{{ formobj.locationStr }}</span></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">房屋照片</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.house" :key="index" :src="item" :preview-src-list="formobj.house"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">门口照片</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.doorway" :key="index" :src="item" :preview-src-list="formobj.doorway"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">客厅卧室照片</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.indoor" :key="index" :src="item" :preview-src-list="formobj.indoor"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">合影照等</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.groupPhoto" :key="index" :src="item" :preview-src-list="formobj.groupPhoto"/></el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="资产类" name="2">
<el-row>
<el-col :span="24">
<div class="span-sty colSty">银行卡</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.yhkImages" :key="index" :src="item" :preview-src-list="formobj.yhkImages"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">房产</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.houseProperty" :key="index" :src="item" :preview-src-list="formobj.houseProperty"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">车辆</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.carProperty" :key="index" :src="item" :preview-src-list="formobj.carProperty"/></el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="证明文件" name="3">
<div class="collapse">
<el-collapse v-model="activeName" accordion>
<el-collapse-item title="贷款人" name="1">
<el-row>
<el-col :span="24">
<div class="span-sty colSty">身份证</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.lenderIdCard" :key="index" :src="item" :preview-src-list="formobj.lenderIdCard"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">户口本</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.lenderAccount" :key="index" :src="item" :preview-src-list="formobj.lenderAccount"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">婚姻证明</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.lenderMarriageCertificate" :key="index" :src="item" :preview-src-list="formobj.lenderMarriageCertificate"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">驾驶本</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.lenderDriverBook" :key="index" :src="item" :preview-src-list="formobj.lenderDriverBook"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">银行流水</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.lenderBankStatement" :key="index" :src="item" :preview-src-list="formobj.lenderBankStatement"/></el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="配偶" name="2">
<el-row>
<el-col :span="24">
<div class="span-sty colSty">身份证</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.spouseIdCard" :key="index" :src="item" :preview-src-list="formobj.spouseIdCard"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">户口本</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.spouseAccount" :key="index" :src="item" :preview-src-list="formobj.spouseAccount"/></el-form-item>
</el-col>
</el-row>
</el-collapse-item>
<el-collapse-item title="担保人" name="3">
<el-row>
<el-col :span="24">
<div class="span-sty colSty">身份证</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.guarantorIdCard" :key="index" :src="item" :preview-src-list="formobj.guarantorIdCard"/></el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<div class="span-sty colSty">户口本</div>
<el-form-item><el-image style="width: 150px; height: 150px" class="addinputInfo" v-for="(item, index) in formobj.guarantorAccount" :key="index" :src="item" :preview-src-list="formobj.guarantorAccount"/></el-form-item>
</el-col>
</el-row>
</el-collapse-item>
</el-collapse>
</div>
</el-collapse-item>
</el-collapse>
</el-form>
</div>
</div>
</template>
<script>
import req from '@/api/overduevehicle/overduevehicle'
export default {
name: 'MaterialInfo',
data() {
return {
viewTitle: '',
activeNames: '1',
activeName: '1',
formobj: {
carProperty: [],
doorway: [],
groupPhoto: [],
guarantorAccount: [],
guarantorIdCard: [],
homeVisitSid: '',
house: [],
houseProperty: [],
indoor: [],
lenderAccount: [],
lenderBankStatement: [],
lenderDriverBook: [],
lenderIdCard: [],
lenderMarriageCertificate: [],
loanXdCons: [],
loanZfCons: [],
locationStr: '',
remarks: '',
saleOrderSid: '',
sid: '',
spouseAccount: [],
spouseIdCard: [],
yhkImages: []
}
}
},
methods: {
showInfo(row) {
this.viewTitle = '家访资料详情'
req.details2({ sid: row.kczlSid }).then((resp) => {
if (resp.success) {
this.formobj = resp.data
}
})
},
handleReturn() {
this.formobj = {
carProperty: [],
doorway: [],
groupPhoto: [],
guarantorAccount: [],
guarantorIdCard: [],
homeVisitSid: '',
house: [],
houseProperty: [],
indoor: [],
lenderAccount: [],
lenderBankStatement: [],
lenderDriverBook: [],
lenderIdCard: [],
lenderMarriageCertificate: [],
loanXdCons: [],
loanZfCons: [],
locationStr: '',
remarks: '',
saleOrderSid: '',
sid: '',
spouseAccount: [],
spouseIdCard: [],
yhkImages: []
}
this.$emit('doback')
}
}
}
</script>
<style scoped>
.span-sty {
width: 100px !important;
}
.addinputInfo {
margin-left: 90px !important;
}
.colSty {
display: flex;
flex-direction: row;
justify-content: flex-end;
align-items: center;
}
/deep/ .el-collapse-item__header {
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
text-align: left;
color: #ffffff;
background-color: #0294d7;
}
/deep/ .el-collapse-item__content {
padding-bottom: 0;
}
.collapse {
padding: 0 10px;
}
/deep/ .collapse .el-collapse-item__header {
height: 40px;
padding: 10px;
font-weight: bold;
font-size: 20px;
text-align: left;
color: #ffffff;
background-color: #87CEFA;
}
</style>