Commit 69c82d01 authored by caimeng's avatar caimeng

详情页面,点击图片从当前图片开始预览

修改上传图片的预览图片方式,删掉show-file-list属性,不展示上传的图片列表
parent 0fba8cde
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<el-col v-for='(o, index) in clientIdCardInfoResponse' :key='index' :span='4'> <el-col v-for='(o, index) in clientIdCardInfoResponse' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o[1]' <el-image class='el-card-image' :src='o[1]'
@click.native='showImgViewer(clientIdCardInfoResponse,"idCard")'></el-image> @click.native='showImgViewer(o[1])'></el-image>
<div class='el-card-intro'> <div class='el-card-intro'>
<span v-if='o[0]==="frontImgPath"'>身份证正面</span> <span v-if='o[0]==="frontImgPath"'>身份证正面</span>
<span v-else>身份证反面</span> <span v-else>身份证反面</span>
...@@ -84,54 +84,72 @@ ...@@ -84,54 +84,72 @@
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo xcxSupplAttachInfo,
addAttachInfo
} = this.info } = this.info
let imgArray = []
let imgArray = [];
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 补充图片
if(supplAttachInfo && supplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 额外的图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (addAttachInfo && addAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ addAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList) imgArray.push(item)
}) })
} }
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray
this.imgList = imgArray; this.imgList = imgArray;
......
...@@ -4,12 +4,11 @@ ...@@ -4,12 +4,11 @@
<block-header title='授信附件信息' /> <block-header title='授信附件信息' />
<template v-if='creditAttachInfo.length'> <template v-if='creditAttachInfo.length'>
<el-row :gutter='20'> <el-row :gutter='20'>
<el-col v-for='(o, index) in creditAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in creditAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot="error" class="image-slot">
<span>未上传</span> <span>未上传</span>
</div> </div>
...@@ -89,55 +88,72 @@ ...@@ -89,55 +88,72 @@
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo,
xcxSupplAttachInfo addAttachInfo
} = this.info } = this.info
let imgArray = []
let imgArray = [];
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 补充图片
if(supplAttachInfo && supplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 额外的图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (addAttachInfo && addAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ addAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList) imgArray.push(item)
}) })
} }
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray
this.imgList = imgArray; this.imgList = imgArray;
......
<!-- 图片信息 -->
<template>
<div>
<block-header title='授信附件信息' />
<template v-if='creditAttachInfo.length'>
<el-row :gutter='20'>
<el-col v-for='(o, index) in creditAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'>
<div slot="error" class="image-slot">
<span>未上传</span>
</div>
</el-image>
<div class='el-card-intro'>
<span>{{ o.attachTypeStr }}</span>
</div>
</el-card>
</el-col>
</el-row>
</template>
<no-data v-else />
<!-- 图片预览-->
<el-image-viewer v-if='imgViewerVisible' :on-close='closeImgViewer' :url-list='imgList' />
</div>
</template>
<script>
export default {
name: 'UserOtherInfo',
props: {
info: {
type: Object,
require: true
},
isLoan: {
type: Boolean,
require: false
}
},
data() {
return {
data: '',
approvalResultResponse: null,
faceInfoResponse: [],
creditAttachInfo: [],
clientIdCardInfoResponse: [],
reportResponse: null,
thirdPartyReport: null,
supplAttachInfo: [],
imgViewerVisible: false,
imgList: [],
xcxSupplAttachInfo: null
}
},
created() {
const {
approvalResultResponse,
clientIdCardInfoResponse,
creditAttachInfo,
faceInfoResponse,
reportResponse,
thirdPartyReport,
supplAttachInfo,
xcxSupplAttachInfo
} = this.info
this.data = this.info
this.approvalResultResponse = approvalResultResponse
this.clientIdCardInfoResponse = Object.entries(clientIdCardInfoResponse)
this.faceInfoResponse = Object.entries(faceInfoResponse)
this.creditAttachInfo = creditAttachInfo // 授信图片信息
this.reportResponse = reportResponse
this.thirdPartyReport = JSON.parse(thirdPartyReport)
this.supplAttachInfo = supplAttachInfo // 附件信息
//this.supplAttachInfo = [] // 附件信息
if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) {
this.xcxSupplAttachInfo = xcxSupplAttachInfo
}
//console.log(this.thirdPartyReport, '第三方报告')
},
methods: {
showImgViewer(item, type) {
const {
clientIdCardInfoResponse,
creditAttachInfo,
faceInfoResponse,
supplAttachInfo,
xcxSupplAttachInfo
} = this.info
let imgArray = [];
const {values} = Object;
// 客户身份证
if(clientIdCardInfoResponse){
for(let val of values(clientIdCardInfoResponse)){
if(val) imgArray.push(val)
}
}
// 活体
if(faceInfoResponse){
for(let val of values(faceInfoResponse)){
if(val) imgArray.push(val)
}
}
// 授信图片
if(creditAttachInfo && creditAttachInfo.length){
creditAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList)
})
}
// 附件图片
if(supplAttachInfo && supplAttachInfo.length){
supplAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList)
})
}
// 补充图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){
xcxSupplAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList)
})
}
this.imgList = imgArray;
this.imgViewerVisible = true
const m = (e) => {
e.preventDefault()
}
document.body.style.overflow = 'hidden'
document.addEventListener('touchmove', m, false) // 禁止页面滑动
},
closeImgViewer() {
this.imgViewerVisible = false
const m = (e) => {
e.preventDefault()
}
document.body.style.overflow = 'auto'
document.removeEventListener('touchmove', m, true)
}
}
}
</script>
<style lang='scss' scoped>
.page-fence {
::v-deep {
i {
cursor: pointer;
}
}
box-sizing: border-box;
padding: 20px;
}
</style>
<style lang='scss'>
.custom-table-checkbox {
.el-checkbox {
display: block !important;
margin: 0 0 $base-padding/4 0;
}
}
.action-bar {
margin-bottom: 15px;
}
.el-card-image {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100px;
max-height: 100px;
background: #f5f7fa;
}
.el-card-intro {
box-sizing: border-box;
height: 56px;
display: flex;
align-items: center;
justify-content: center;
padding: 20px 5px;
overflow: hidden;
}
</style>
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<el-col v-for='(o, index) in faceInfoResponse' :key='index' :span='4'> <el-col v-for='(o, index) in faceInfoResponse' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o[1]' <el-image class='el-card-image' :src='o[1]'
@click.native='showImgViewer(faceInfoResponse,"face")'></el-image> @click.native='showImgViewer(o[1])'></el-image>
<div class='el-card-intro'> <div class='el-card-intro'>
<span v-if='o[0]==="panoramaImgPath"'>全景照</span> <span v-if='o[0]==="panoramaImgPath"'>全景照</span>
<span v-else-if='o[0]==="randomImgPath"'>随机照</span> <span v-else-if='o[0]==="randomImgPath"'>随机照</span>
...@@ -86,54 +86,72 @@ ...@@ -86,54 +86,72 @@
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo xcxSupplAttachInfo,
addAttachInfo
} = this.info } = this.info
let imgArray = []
let imgArray = [];
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 补充图片
if(supplAttachInfo && supplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 额外的图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (addAttachInfo && addAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ addAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList) imgArray.push(item)
}) })
} }
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray
this.imgList = imgArray; this.imgList = imgArray;
......
<!-- 图片信息 --> <!-- 图片信息 -->
<template> <template>
<div> <div>
<block-header title='稽核上传信息' /> <block-header title='额外附件资料' />
<template v-if='addAttachInfo!==null && addAttachInfo.length'> <template v-if='addAttachInfo!==null && addAttachInfo.length'>
<el-row :gutter='20'> <el-row :gutter='20'>
<el-col v-for='(o, index) in addAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in addAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o' <el-image class='el-card-image' :src='o'
@click.native='showImgViewer(o,"annex")'> @click.native='showImgViewer(o)'>
<div slot='error' class='image-slot'> <div slot='error' class='image-slot'>
<span>未上传</span> <span>未上传</span>
</div> </div>
...@@ -75,69 +75,83 @@ ...@@ -75,69 +75,83 @@
this.reportResponse = reportResponse this.reportResponse = reportResponse
this.thirdPartyReport = JSON.parse(thirdPartyReport) this.thirdPartyReport = JSON.parse(thirdPartyReport)
this.supplAttachInfo = supplAttachInfo // 附件信息 this.supplAttachInfo = supplAttachInfo // 附件信息
//this.supplAttachInfo = [] // 附件信息
this.addAttachInfo = addAttachInfo this.addAttachInfo = addAttachInfo
if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) { if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) {
this.xcxSupplAttachInfo = xcxSupplAttachInfo this.xcxSupplAttachInfo = xcxSupplAttachInfo
} }
//console.log(this.thirdPartyReport, '第三方报告')
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo xcxSupplAttachInfo,
addAttachInfo
} = this.info } = this.info
let imgArray = [] let imgArray = []
const { values } = Object
// 客户身份证 // 客户身份证
if (clientIdCardInfoResponse) { if (clientIdCardInfoResponse) {
for (let val of values(clientIdCardInfoResponse)) { imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if (val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if (faceInfoResponse) { if (faceInfoResponse) {
for (let val of values(faceInfoResponse)) { imgArray = this.arraySplice(faceInfoResponse, imgArray)
if (val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if (creditAttachInfo && creditAttachInfo.length) { if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item => { imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
}
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
supplAttachInfo.forEach(item => {
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 补充图片
if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) { if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
xcxSupplAttachInfo.forEach(item => { imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 额外的图片
if (addAttachInfo && addAttachInfo.length) {
addAttachInfo.forEach(item=>{
imgArray.push(item)
})
}
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray this.imgList = imgArray
this.imgList = imgArray;
this.imgViewerVisible = true this.imgViewerVisible = true
const m = (e) => { const m = (e) => {
e.preventDefault() e.preventDefault()
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<el-col v-for='(o, index) in xcxSupplAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in xcxSupplAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot="error" class="image-slot">
<span>未上传</span> <span>未上传</span>
</div> </div>
...@@ -86,54 +86,72 @@ ...@@ -86,54 +86,72 @@
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo xcxSupplAttachInfo,
addAttachInfo
} = this.info } = this.info
let imgArray = []
let imgArray = [];
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 补充图片
if(supplAttachInfo && supplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 额外的图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (addAttachInfo && addAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ addAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList) imgArray.push(item)
}) })
} }
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray
this.imgList = imgArray; this.imgList = imgArray;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
<el-col v-for='(o, index) in supplAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in supplAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot="error" class="image-slot">
<span>未上传</span> <span>未上传</span>
</div> </div>
...@@ -83,59 +83,74 @@ ...@@ -83,59 +83,74 @@
if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) { if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) {
this.xcxSupplAttachInfo = xcxSupplAttachInfo this.xcxSupplAttachInfo = xcxSupplAttachInfo
} }
//console.log(this.thirdPartyReport, '第三方报告')
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
creditAttachInfo, creditAttachInfo,
faceInfoResponse, faceInfoResponse,
supplAttachInfo, supplAttachInfo,
xcxSupplAttachInfo xcxSupplAttachInfo,
addAttachInfo
} = this.info } = this.info
let imgArray = []
let imgArray = [];
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
} }
// 附件图片
if (supplAttachInfo && supplAttachInfo.length) {
imgArray = this.arraySplice(supplAttachInfo, imgArray)
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 补充图片
if(supplAttachInfo && supplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 额外的图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (addAttachInfo && addAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ addAttachInfo.forEach(item=>{
imgArray = imgArray.concat(item.screenList) imgArray.push(item)
}) })
} }
// 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
const ArrayHeader = imgArray.slice(0, curIndex)
// 删除索引之前的内容
imgArray.splice(0, curIndex)
imgArray = imgArray.concat(ArrayHeader)
this.imgList = imgArray
this.imgList = imgArray; this.imgList = imgArray;
......
...@@ -7,7 +7,7 @@ ...@@ -7,7 +7,7 @@
<el-col v-for='(o, index) in clientIdCardInfoResponse' :key='index' :span='4'> <el-col v-for='(o, index) in clientIdCardInfoResponse' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o[1]' <el-image class='el-card-image' :src='o[1]'
@click.native='showImgViewer(clientIdCardInfoResponse,"idCard")'></el-image> @click.native='showImgViewer(o[1])'></el-image>
<div class='el-card-intro'> <div class='el-card-intro'>
<span v-if='o[0]==="frontImgPath"'>身份证正面</span> <span v-if='o[0]==="frontImgPath"'>身份证正面</span>
<span v-else>身份证反面</span> <span v-else>身份证反面</span>
...@@ -24,7 +24,7 @@ ...@@ -24,7 +24,7 @@
<el-col v-for='(o, index) in faceInfoResponse' :key='index' :span='4'> <el-col v-for='(o, index) in faceInfoResponse' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o[1]' <el-image class='el-card-image' :src='o[1]'
@click.native='showImgViewer(faceInfoResponse,"face")'></el-image> @click.native='showImgViewer(o[1])'></el-image>
<div class='el-card-intro'> <div class='el-card-intro'>
<span v-if='o[0]==="panoramaImgPath"'>全景照</span> <span v-if='o[0]==="panoramaImgPath"'>全景照</span>
<span v-else-if='o[0]==="randomImgPath"'>随机照</span> <span v-else-if='o[0]==="randomImgPath"'>随机照</span>
...@@ -43,8 +43,8 @@ ...@@ -43,8 +43,8 @@
<el-col v-for='(o, index) in creditAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in creditAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot='error' class='image-slot'>
<span>未上传</span> <span>未上传</span>
</div> </div>
</el-image> </el-image>
...@@ -63,8 +63,8 @@ ...@@ -63,8 +63,8 @@
<el-col v-for='(o, index) in supplAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in supplAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot='error' class='image-slot'>
<span>未上传</span> <span>未上传</span>
</div> </div>
</el-image> </el-image>
...@@ -84,8 +84,8 @@ ...@@ -84,8 +84,8 @@
<el-col v-for='(o, index) in xcxSupplAttachInfo' :key='index' :span='4'> <el-col v-for='(o, index) in xcxSupplAttachInfo' :key='index' :span='4'>
<el-card :body-style="{ padding: '10px' }"> <el-card :body-style="{ padding: '10px' }">
<el-image class='el-card-image' :src='o.screenList[0]' <el-image class='el-card-image' :src='o.screenList[0]'
@click.native='showImgViewer(o.screenList,"annex")'> @click.native='showImgViewer(o.screenList[0])'>
<div slot="error" class="image-slot"> <div slot='error' class='image-slot'>
<span>未上传</span> <span>未上传</span>
</div> </div>
</el-image> </el-image>
...@@ -123,7 +123,6 @@ ...@@ -123,7 +123,6 @@
<!-- 图片预览--> <!-- 图片预览-->
<el-image-viewer v-if='imgViewerVisible' :on-close='closeImgViewer' :url-list='imgList' /> <el-image-viewer v-if='imgViewerVisible' :on-close='closeImgViewer' :url-list='imgList' />
</div> </div>
</template> </template>
...@@ -182,12 +181,25 @@ ...@@ -182,12 +181,25 @@
if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) { if (xcxSupplAttachInfo && xcxSupplAttachInfo.length > 0) {
this.xcxSupplAttachInfo = xcxSupplAttachInfo this.xcxSupplAttachInfo = xcxSupplAttachInfo
} }
//console.log(this.thirdPartyReport, '第三方报告')
}, },
methods: { methods: {
showImgViewer(item, type) { arraySplice(obj, result) {
if (Array.isArray(obj)) {
obj.forEach(item => {
result = result.concat(item.screenList)
})
} else {
const { values } = Object
for (let val of values(obj)) {
if (val) result.push(val)
}
}
return result
},
// 图片预览大图
showImgViewer(firstImg) {
const { const {
clientIdCardInfoResponse, clientIdCardInfoResponse,
...@@ -197,68 +209,44 @@ ...@@ -197,68 +209,44 @@
xcxSupplAttachInfo xcxSupplAttachInfo
} = this.info } = this.info
let imgArray = []; let imgArray = []
const {values} = Object;
// 客户身份证 // 客户身份证
if(clientIdCardInfoResponse){ if (clientIdCardInfoResponse) {
for(let val of values(clientIdCardInfoResponse)){ imgArray = this.arraySplice(clientIdCardInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 活体 // 活体
if(faceInfoResponse){ if (faceInfoResponse) {
for(let val of values(faceInfoResponse)){ imgArray = this.arraySplice(faceInfoResponse, imgArray)
if(val) imgArray.push(val)
}
} }
// 授信图片 // 授信图片
if(creditAttachInfo && creditAttachInfo.length){ if (creditAttachInfo && creditAttachInfo.length) {
creditAttachInfo.forEach(item=>{ imgArray = this.arraySplice(creditAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 附件图片 // 附件图片
if(supplAttachInfo && supplAttachInfo.length){ if (supplAttachInfo && supplAttachInfo.length) {
supplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(supplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
// 补充图片 // 补充图片
if(xcxSupplAttachInfo && xcxSupplAttachInfo.length){ if (xcxSupplAttachInfo && xcxSupplAttachInfo.length) {
xcxSupplAttachInfo.forEach(item=>{ imgArray = this.arraySplice(xcxSupplAttachInfo, imgArray)
imgArray = imgArray.concat(item.screenList)
})
} }
this.imgList = imgArray; // 获取当前点击图片的索引
const curIndex = imgArray.findIndex((item) => item === firstImg)
// 把索引之前的内容copy一份
//this.data = this.info const ArrayHeader = imgArray.slice(0, curIndex)
//switch (type) { // 删除索引之前的内容
// case 'idCard': imgArray.splice(0, curIndex)
// case 'face': imgArray = imgArray.concat(ArrayHeader)
// const arr = [] this.imgList = imgArray
// item.forEach(o => {
// console.log(o, '是啥')
// arr.push(o[1])
// })
//
// console.log(arr, '预览图片的地址')
//
// this.imgList = arr
//
// break
// default:
// this.imgList = item
// break
//}
this.imgViewerVisible = true this.imgViewerVisible = true
const m = (e) => { const m = (e) => {
......
...@@ -13,7 +13,6 @@ import UserBaseInfo from '@/components/user-base-info' ...@@ -13,7 +13,6 @@ import UserBaseInfo from '@/components/user-base-info'
import UserProjectInfo from '@/components/user-project-info' import UserProjectInfo from '@/components/user-project-info'
import CertImg from '@/components/detail/cert-img' import CertImg from '@/components/detail/cert-img'
import CreditImg from '@/components/detail/credit-img'
import CreditEnclosureImg from '@/components/detail/credit-enclosure-img' import CreditEnclosureImg from '@/components/detail/credit-enclosure-img'
import UserEnclosureImg from '@/components/detail/user-enclosure-img' import UserEnclosureImg from '@/components/detail/user-enclosure-img'
import FaceImg from '@/components/detail/face-img' import FaceImg from '@/components/detail/face-img'
...@@ -40,7 +39,6 @@ export default { ...@@ -40,7 +39,6 @@ export default {
Approval, Approval,
LoanAudit, LoanAudit,
CertImg, CertImg,
CreditImg,
CreditEnclosureImg, CreditEnclosureImg,
UserEnclosureImg, UserEnclosureImg,
FaceImg, FaceImg,
......
...@@ -76,20 +76,17 @@ ...@@ -76,20 +76,17 @@
</template> </template>
<el-collapse style='margin: 15px 0' v-model='activeNames' @change='handleChange'> <el-collapse v-model='activeNames' style='margin: 15px 0' @change='handleChange'>
<el-collapse-item title='人脸信息' name='1'> <el-collapse-item title='人脸信息' name='1'>
<!--人脸 默认折叠--> <!--人脸 默认折叠-->
<face-img :info='detail' /> <face-img :info='detail' />
</el-collapse-item> </el-collapse-item>
<el-collapse-item title='授信附件信息' name='2'> <el-collapse-item title='授信附件信息' name='2'>
<!--授信附件 默认折叠 --> <!--授信附件 默认折叠 -->
<credit-enclosure-img :info='detail' /> <credit-enclosure-img :info='detail' />
</el-collapse-item> </el-collapse-item>
<el-collapse-item title='客户附件信息' name='3'> <el-collapse-item title='客户附件信息' name='3'>
<!--客户附件 默认折叠 --> <!--客户附件 默认折叠 -->
<user-enclosure-img :info='detail' /> <user-enclosure-img :info='detail' />
...@@ -98,7 +95,6 @@ ...@@ -98,7 +95,6 @@
</el-collapse> </el-collapse>
<!--操作日志--> <!--操作日志-->
<block-header title='操作日志' /> <block-header title='操作日志' />
<template v-if='detail.operationLogResponse!==null'> <template v-if='detail.operationLogResponse!==null'>
...@@ -106,31 +102,6 @@ ...@@ -106,31 +102,6 @@
</template> </template>
<!--额外附件-->
<new-attach-img :info='detail' />
<el-form label-suffix=':' label-width='80px' label-position='left'>
<el-form-item label='附件图片'>
<el-upload
class='auditUpload'
list-type='picture-card'
:action='UploadUrl'
:data='uploadParams'
:multiple='true'
:headers='headers'
:show-file-list='true'
:with-credentials='true'
:disabled='false'
:http-request='handleUpload'>
<i slot='trigger' class='el-icon-plus'></i>
</el-upload>
</el-form-item>
</el-form>
<!--稽核弹框--> <!--稽核弹框-->
<template v-if='visible'> <template v-if='visible'>
<div style='margin-top: 15px'> <div style='margin-top: 15px'>
...@@ -159,6 +130,27 @@ ...@@ -159,6 +130,27 @@
</div> </div>
</template> </template>
<!--额外附件-->
<new-attach-img :info='detail' />
<el-form label-suffix=':' label-width='80px' label-position='left'>
<el-form-item label='附件图片'>
<el-upload
class='auditUpload'
:action='UploadUrl'
:data='uploadParams'
:multiple='true'
:headers='headers'
:show-file-list='false'
:with-credentials='true'
:disabled='false'
:http-request='handleUpload'>
<el-button size='mini' type='primary'>点击上传</el-button>
</el-upload>
</el-form-item>
</el-form>
</div> </div>
</template> </template>
...@@ -204,11 +196,8 @@ ...@@ -204,11 +196,8 @@
activeNames: '', activeNames: '',
// 稽核审批 // 稽核审批
visible: false, visible: false,
isLoan: true, isLoan: true,
orderNo: '', orderNo: '',
detail: null, detail: null,
...@@ -226,8 +215,6 @@ ...@@ -226,8 +215,6 @@
const { query } = this.$route const { query } = this.$route
if (query && query.orderNo) { if (query && query.orderNo) {
this.orderNo = query.orderNo this.orderNo = query.orderNo
await this.init() await this.init()
} }
}, },
...@@ -240,7 +227,7 @@ ...@@ -240,7 +227,7 @@
methods: { methods: {
// 上传 // 上传
async handleUpload(obj) { async handleUpload(obj) {
const { clientDetail } = this.detail const { clientDetail, addAttachInfo } = this.detail
const { file } = obj const { file } = obj
let fileName = 'jpg' let fileName = 'jpg'
let fileType = 'LRD-ADMIN/audit' let fileType = 'LRD-ADMIN/audit'
...@@ -274,11 +261,13 @@ ...@@ -274,11 +261,13 @@
if (result.success) { if (result.success) {
this.$message.success('上传成功') this.$message.success('上传成功')
addAttachInfo.push(uploadFileUrl)
this.detail.addAttachInfo = addAttachInfo
} }
}).catch(e => { }).catch(e => {
throw new Error(e) throw new Error(e)
}); })
} catch (e) { } catch (e) {
this.$message.error('上传报错') this.$message.error('上传报错')
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment