Commit f63f6e72 authored by 远方不远's avatar 远方不远

hy

parent 9f53bc99
...@@ -122,6 +122,20 @@ export const constantRoutes = [ ...@@ -122,6 +122,20 @@ export const constantRoutes = [
meta: { title: '区域专项债详情', icon: 'user' } meta: { title: '区域专项债详情', icon: 'user' }
} }
] ]
},
{
path: '/debtProject',
component: Layout,
hidden: true,
redirect: 'noredirect',
children: [
{
path: '/radar/debtProject/details/:id(\\d+)',
component: () => import('@/views/radar/debtProject/details'),
name: 'debtProjectDetails',
meta: { title: '企业专项债详情', icon: 'radar' }
}
]
} }
] ]
......
<template> <template>
<div>
<div class="content"> <div class="content">
<div class="content_item"> <div class="content_item">
<div class="label">项目名称</div> <div class="label">项目名称</div>
...@@ -77,6 +78,74 @@ ...@@ -77,6 +78,74 @@
</div> </div>
</div> </div>
<div class="bottomlist">
<div class="bottomlist-title">
<p>共有{{total}}条</p>
<p>
<img src="@/assets/images/EXCEL.png" alt="">
<span>导出EXCEL</span>
</p>
</div>
<ul class="bottomlist-content">
<li class="bottomlist-list">
<p class="list-titel">
<router-link :to="'/radar/debtProject/details/'+ 1" tag="a" class="list-titel-a">轨道交通13号线扩能提升工程</router-link>
</p>
<div class="content-label">
<span class="list-label">江西省-南昌市</span>
</div>
<div class="list-content">
<p class="list-content-text">
<span>项目类型:</span>
<span>轨道交通</span>
</p>
<p class="list-content-text">
<span>项目总投资(亿):</span>
<span>26</span>
</p>
<p class="list-content-text">
<span>项目资本金(亿):</span>
<span>96</span>
</p>
<p class="list-content-text">
<span>专项债金额(亿):</span>
<span>200</span>
</p>
</div>
<div class="list-content">
<p class="list-content-text">
<span>项目主体:</span>
<span class="blue">江西合胜合招标咨询有限公司</span>
</p>
<p class="list-content-text">
<span>主管部门:</span>
<span class="blue">江西胜合招标咨询有限公司</span>
</p>
<p class="list-content-text">
<span>实施单位:</span>
<span class="blue">江西合胜合招标咨询有限公司</span>
</p>
</div>
</li>
</ul>
<div class="pagination clearfix" v-show="total>0">
<el-pagination
background
:page-size="pageSize"
:current-page="page"
@current-change="handleCurrentChange"
layout="prev, pager, next"
:total="total">
</el-pagination>
</div>
</div>
</div>
</template> </template>
<script> <script>
...@@ -158,7 +227,11 @@ ...@@ -158,7 +227,11 @@
}, },
], ],
projectTypeText: ['不限'], projectTypeText: ['不限'],
arrList:[] arrList:[],
total:6000,
page:1,
pageSize:20
} }
}, },
...@@ -372,6 +445,9 @@ ...@@ -372,6 +445,9 @@
} }
// this.landMarketDto = obj // this.landMarketDto = obj
}, },
handleCurrentChange(val){
}
} }
} }
</script> </script>
...@@ -379,6 +455,8 @@ ...@@ -379,6 +455,8 @@
<style lang="scss" scoped> <style lang="scss" scoped>
.content{ .content{
padding: 0px 16px; padding: 0px 16px;
border-radius: 4px 4px 4px 4px;
background: #FFFFFF; background: #FFFFFF;
.content_item{ .content_item{
padding-top: 12px; padding-top: 12px;
...@@ -456,5 +534,115 @@ ...@@ -456,5 +534,115 @@
} }
} }
.bottomlist{
width: 100%;
background-color: #FFFFFF;
border-radius: 4px 4px 4px 4px;
.bottomlist-title{
display: flex;
justify-content: end;
align-items: center;
margin-top: 12px;
padding: 24px ;
border-bottom: 1px solid #EFEFEF;
p:first-child{
font-size: 12px;
font-weight: 400;
color: #3D3D3D;
margin-right: 10px;
}
p:last-child{
font-size: 14px;
font-weight: 400;
color: rgba(35,35,35,0.8);
}
img{
width: 18px;
height: 18px;
}
}
.bottomlist-content{
padding: 14px;
padding-bottom: 0px;
}
.bottomlist-list{
font-size: 14px;
border-bottom: 1px solid #EFEFEF;
padding-bottom: 14px;
.list-titel{
font-size: 16px;
font-weight: 700;
color: #3D3D3D;
line-height: 19px;
.list-titel-a{
text-decoration: none;
color:#3D3D3D;
}
a:hover, a:visited, a:link, a:active{
color:#3D3D3D;
}
}
.content-label{
margin-top: 7px;
.list-label{
background: #F3F3FF;
color: #8491E8;
border-radius: 1px 1px 1px 1px;
padding: 3px 7px;
font-size: 12px;
}
}
.list-content{
margin-top: 3px;
display: flex;
justify-content: start;
align-items: center;
.list-content-text{
margin-top: 7px;
display: flex;
justify-content: start;
align-items: center;
margin-right: 27px;
font-size: 14px;
span:first-child{
font-weight: 400;
color: rgba(35,35,35,0.4);
line-height: 15px
}
span:last-child{
font-weight: 400;
color: rgba(35,35,35,0.8);
line-height: 15px
}
.blue{
color: #0081FF !important;
cursor: pointer;
}
}
}
}
.bottomlist-list:hover{
background: #F6F9FC;
cursor: pointer;
}
.pagination{
padding: 14px ;
.el-pagination{
float: right;
}
}
}
</style> </style>
\ No newline at end of file
<template>
<div class="app-container qyzx-details">
<div class="content main1">
<div class="title"><img src="@/assets/images/financing/head_icon.png" />重庆至黔江高速铁路项目一项目详情</div>
<p>本项目是厦渝高铁通道的重要组成部分,是成渝地区、海西经济区间高速客运交流的主通道;是成渝地区与华南、华东地区间客运交流的辅助通道;是以重庆主城为核心的城际客流的快速客运通道;
是整合区域旅游资源,促进沿线旅游资源开发的黄金旅游通道。线路起自重庆站,经巴南、南川、武隆、彭水,终至江,正线全长265公里,设8座,其中新建6座。
同步建设重庆东动车所动车出入段,重庆枢纽东环联络线。</p>
</div>
<div class="content main2">
<div class="common-title">项目筹资</div>
<div class="main2-box">
<div class="list">
<div class="item color1">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>项目总投资额</p>
</div>
<img class="img" src="@/assets/images/financing/icon1.png" />
</div>
<div class="item color2">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>项目资本金</p>
</div>
<img class="img" src="@/assets/images/financing/icon2.png" />
</div>
<div class="item color3">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>专项债融资</p>
</div>
<img class="img" src="@/assets/images/financing/icon3.png" />
</div>
<div class="item color4">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>专项债用作资本金</p>
</div>
<img class="img" src="@/assets/images/financing/icon4.png" />
</div>
</div>
<div class="list">
<div class="item color4">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>其他资金</p>
</div>
<img class="img" src="@/assets/images/financing/icon5.png" />
</div>
<div class="item color3">
<div class="item-left">
<h4>535.00<span>亿 / 10只</span></h4>
<p>专项债融资额/专项债只数</p>
</div>
<img class="img" src="@/assets/images/financing/icon6.png" />
</div>
<div class="item color4">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>其他融资</p>
</div>
<img class="img" src="@/assets/images/financing/icon7.png" />
</div>
<div class="item color2">
<div class="item-left">
<h4>535.00<span>亿</span></h4>
<p>政府安排资金</p>
</div>
<img class="img" src="@/assets/images/financing/icon8.png" />
</div>
</div>
</div>
</div>
<div class="content main3">
<div class="common-title">项目保障</div>
<div class="main3-box">
<p>
<label class="label">项目总收益/项目总债务融资本息(覆盖倍数)</label>
<span>1.36倍</span>
</p>
<p>
<label class="label">项目总收益/项目总地方债券融资本息</label>
<span>1.96倍</span>
</p>
<p>
<label class="label">项目总收益/项目总投资</label>
<span>1.96倍</span>
</p>
<p>
<label class="label">项目总收益/项目总地方债券融资本金</label>
<span>1.96倍</span>
</p>
<p>
<label class="label">项目总收益/项目总债务融资本金</label>
<span>2.45倍</span>
</p>
<p>
<label class="label">项目预测总收益</label>
<span>2.45倍</span>
</p>
</div>
</div>
<div class="content main4">
<div class="common-title">项目当事人</div>
<div class="main4-box">
<label class="label">项目主体</label>
<span>重庆铁路投资集团有限公司</span>
<label class="label">主管部门</label>
<span>-</span>
<label class="label">实施单位</label>
<span>重庆铁路投资集团有限公司</span>
</div>
</div>
<div class="content main5">
<div class="common-title">专项债</div>
<div class="table-item">
<el-table
:data="tableData"
element-loading-text="Loading"
border
fit
highlight-current-row
>
<el-table-column prop="name" label="债券简称">
<template slot-scope="scope">
<router-link :to="'/macro/financing/details/'+ scope.row.id" tag="a" class="a-link">{{ scope.row.name}}</router-link>
</template>
</el-table-column>
<el-table-column prop="name" label="招标日期" width="220" />
<el-table-column prop="gm" label="专项债规模(亿)" width="260" />
<el-table-column prop="gm" label="用于项目规模(亿)" width="260" />
<el-table-column prop="zj" label="是否资本金" width="200" />
</el-table>
</div>
</div>
</div>
</template>
<script>
export default {
name: 'debtProjectDetails',
data() {
return {
id:'',
tableData:[
{
id:0,
name:'20重庆债14(2005938)',
time:'2020-09-18',
gm:'285.24',
zj:'否',
}
]
}
},
created() {
console.log(this.$route.params)
this.id=this.$route.params.id
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.app-container{
padding: 0;
}
.qyzx-details{
.tab{
font-size: 12px;
color:#A1A1A1;
span{
color:#232323;
}
}
.content{
margin-top: 16px;
background: #FFFFFF;
padding: 16px;
border-radius: 4px;
}
.common-title{
margin-bottom: 8px;
}
.main1{
.title{
color: #232323;
font-size: 16px;
line-height: 28px;
font-weight: bold;
margin-bottom: 8px;
text-align: left;
img{
width: 28px;
height: 28px;
margin-bottom: -9px;
margin-right: 17px;
}
}
p{
color: #3D3D3D;
font-size: 14px;
margin: 0;
}
}
.main2{
.list{
display: flex;
margin: 16px 0;
}
.item{
width: 24.5%;
margin-right: 16px;
height: 100px;
display: flex;
justify-content: space-between;
border-radius: 8px;
.item-left{
margin-left: 16px;
margin-top: 24px;
h4{
color: #232323;
font-size: 22px;
line-height: 22px;
font-weight: bold;
margin: 0;
span{
font-weight: 400;
margin-left: 4px;
font-size: 18px;
}
}
p{
margin: 0;
color: #3D3D3D;
font-size: 14px;
padding-top: 8px;
}
}
.img{
width: 56px;
height: 56px;
margin-top: 22px;
margin-right: 12px;
}
}
.color1{
background: rgba(246,190,59,0.08);
border: 1px solid rgba(246,190,59,0.2);
}
.color2{
background: rgba(148,216,196,0.102);
border: 1px solid rgba(73,187,154,0.1);
}
.color3{
background: rgba(57,100,199,0.06);
border: 1px solid rgba(57,100,199,0.1);
}
.color4{
background: rgba(0,129,255,0.04);
border: 1px solid rgba(0,129,255,0.1);
}
}
.main3{
.main3-box{
margin-top: 22px;
p{
margin: 0;
display: inline-block;
width: 50%;
border-top: 1px solid #E6E9F0;
border-left: 1px solid #E6E9F0;
}
p:nth-child(2n){
border-right: 1px solid #E6E9F0;
}
p:nth-child(5){
border-bottom: 1px solid #E6E9F0;
}
p:last-child{
border-bottom: 1px solid #E6E9F0;
}
.label{
width: 60%;
background: #F0F3FA;
display: inline-block;
height: 40px;
font-weight: 400;
border-right: 1px solid #E6E9F0;
line-height: 40px;
font-size: 12px;
color: rgba(35,35,35,0.8);
padding-left: 12px;
}
span{
width: 40%;
display: inline-block;
height: 40px;
line-height: 40px;
padding-left: 12px;
font-size: 12px;
}
}
}
.main4{
.main4-box{
margin-top: 22px;
.label{
width: 14%;
background: #F0F3FA;
border: 1px solid #E6E9F0;
display: inline-block;
height: 40px;
line-height: 40px;
font-size: 12px;
color: rgba(35,35,35,0.8);
padding-left: 12px;
}
span{
width: 19%;
display: inline-block;
height: 40px;
line-height: 40px;
border-top: 1px solid #E6E9F0;
border-bottom: 1px solid #E6E9F0;
padding-left: 12px;
font-size: 12px;
}
span:last-child{
width: 20%;
border-right: 1px solid #E6E9F0;
}
}
}
.main5{
.table-item{
margin-top: 22px;
}
}
}
</style>
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