Go directly to the result:
<template>
<div class="search">
<Card>
<Row>
<Col>
<div>
<!--此处为页面显示,src为页面路径-->
<!--style样式高度调用calHeight方法进行设置-->
<iframe :src="this.url" frameborder="0" width="100%" :style="{height:calHeight}" scrolling="auto"></iframe>
</div>
</Col>
</Row>
</Card>
</div>
</template>
<script>
import {getCarKeyParameters} from '_p/afs-core-business/api/afs-case/loan-approve/loanAuditVin'
export default {
name: "loanAuditVin",
props: {
detailParams: {}
},
data() {
return {
// summaryVisible: false,
url: '',
}
},
mounted(){
this.summaryBtn()
},
//calHeight 设置高度为窗口高度少100px
//computed VUE计算属性
computed : {
calHeight(){
return (window.innerHeight - 100) + 'px';
}
},
methods: {
summaryBtn(){
var date = this.detailParams.lendingFirstDate.substring(0,18);
date = this.detailParams.lendingFirstDate.replace(/-/g,'/');
this.detailParams.loanDate = new Date(date).getTime();
getCarKeyParameters(this.detailParams).then(res => {
if (res.code === '0000') {
console.log(res.data.data)
//此处为后端接口返回的页面URL
this.url = res.data.data.url;
}
})
// this.summaryVisible = true;
},
}
}
</script>
<style scoped>
.search {
height: 90%;
}
.left-div {
float: left;
width: 20%;
height: 600px;
box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04)
}
.left-btn{
background-color: Transparent;
font-size:10px;
border-style :none;
width: 100%;
height: 10%;
}
.left-link{
display:block;
font-size:10px;
font-family:Verdana, Arial, Helvetica, sans-serif;
color:#000000;
width:100%;
height: 10%;
text-align:center;
padding:4px;
text-decoration:none;
}
.right-div{
float: right;
width: 78%;
height: 550px;
}
</style>