<template>
    <div>
        <div class="header">
            <span class="header-nav">项目名称:{{itemTitle}}</span>
            <span class="header-nav">项目编号:{{itemCode}}</span>
            <span>发布日期:{{itemTime}}</span>
        </div>
        <h2>{{itemTitle}}</h2>
        <div class="form" v-html="contentList">
            <div>
                <div>公告名称:</div>
                <div>{{itemTime}}</div>
            </div>
            <div>
                <div>相关字段:</div>
                <div>{{itemTitle}}</div>
            </div>
            <div>
                <div>中标人:</div>
                <div>{{itemPerson}}</div>
            </div>
            <div>
                <div>中标价格:</div>
                <div>{{winPrice}}</div>
            </div>
            <div>
                <div>委托金额:</div>
                <div>{{itemPrice}}</div>
            </div>
            <div>
                <div>节资率:</div>
                <div>{{itemCapital}}</div>
            </div>
            <div>
                <div>其他说明:</div>
                <div>{{other}}</div>
            </div>
            <div>
                <div>公告内容:</div>
                <div class="rig-content">
                    <div>招标人:{{itemPerson}}</div>
                    <div>招标代理机构:{{itemCompany}}</div>
                    <div>项目经理:{{itemManager}}</div>
                    <div>中标单位:{{itemPerson}}</div>
                    <div>中标金额:{{winPrice}}</div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
import {getClerDetailsList} from "@/common/list.js"
export default {
    data(){
        return{
            contentList:[],
            itemTitle:'定州市集中供热工程2020年预制直埋保温管及管道采购',
            itemCode:'l1301000075017553011',
            itemTime:'2020年07月30号',
            itemPerson:'江丰管道集团有限公司',
            winPrice:'173162元人民币',
            itemPrice:'173162元人民币',
            itemCapital:'1.7189484984%',
            other:'无',
            itemCompany:"瑞和安惠项目管理集团有限公司",
            itemManager:'车经理'
        }
        
    },
    mounted(){
        let id = this.$route.query.id
        console.log(id+"-----------------")
        this.getClerDetailsList(id)

    },
    methods:{
        async getClerDetailsList(id){
            console.log(id+"-----------------")
            const {data} = await getClerDetailsList(id)
            this.itemTitle = data.title
            this.itemCode = data.projectId
            this.contentList = data.content
        }
    }
}
</script>

<style scoped>
.header{
    display: flex;
}
.header-nav{
    margin-right: 30px;
}
h2{
    margin-top:30px;
    margin-bottom: 30px;
    text-align: center;
}
.form{
    margin-left:40px;
}
.form>div{
    display: flex;
    margin-bottom: 20px;
}
.form>div:last-child{
    justify-content: center;
    padding-bottom: 100px;  
}
.rig-content{
    flex-direction: column;
}
.form>div>div:first-child{
    width:92px;
    height:25px;
    line-height: 25px;
    font-size: 10px;
    color: #808080;
    margin-right:20px;
}
.form>div>div:last-child{
    justify-content: center;
    width:100%;
    height:25px;
    line-height: 25px;
    font-size: 10px;
    color: #000000
}
</style>