<template>
  <div class="info">
    <div class="content">
      <div class="info_box">
        <div class="info_mes">
          <div class="flex">
            <div class="left_mes flex">
              <div>项目名称:{{itemName}}</div>
              <div>项目编号:{{itemCode}}</div>
            </div>
            <div class="right_mes"></div>
            <div>发布时间:{{itemTime}}</div>
          </div>
          
        </div>
        <h1>{{itemTitle}}</h1>
        <div class="content_list">
          <div>
            <h3 style="border-bottom:1px solid #CCC">
              1.招标列表
            </h3>
            <p>
              {{firstText}}
            </p>
          </div>
          <div>
            <h3 style="border-bottom:1px solid #CCC">
              2.项目概况与招标范围
            </h3>
            <p>
              {{middleText}}
            </p>
          </div>
          <div>
            <h3 style="border-bottom:1px solid #CCC">
              3.投标人资格要求
            </h3>
            <p>
              {{lastText}}
            </p>
          </div>
        </div>
        <el-row>
          <el-button>
            <a href="/notice/bid">返回</a>
          </el-button>
          <el-button type="primary" v-show = "isshow">报名</el-button>
        </el-row>
      </div>
    </div>
  </div>
</template>
<script>
import dataBreadcrumb from '@/components/dataBreadcrumb.vue'
import {getBidingdetails} from '@/common/list.js'
export default {
    components:{
        dataBreadcrumb,
    },
    created(){
        let id = this.$route.query.id
        console.log(id)
        this.getBidingdetails(id)
        setTimeout(function(){
          //判断是否为采购商  状态 
       
        })
    },
    data(){
        return{
            firstText:'',
            middleText:'',
            lastText:'',
            itemTitle:'建设路北伸(丰南界-南湖大道)',
            itemTime:'2020-09-18',
            itemName:"建设路北伸(丰南界-南湖大道)",
            itemCode:'l1301000075023964001',
            breads: ['投标管理', '在线报名', '招标公告'],
            isshow:true,
        }
    },
    methods:{
        async getBidingdetails(){
            const {data} = await getBidingdetails(1)
            console.log(data)
            this.itemTitle = data.title
            this.itemName = data.title
            this.itemTime = data.createTime.slice(0,10)
            this.itemCode = data.projectId
            this.firstText = data.content
        }
    }
}
</script>

<style>
.left_mes>div:first-child{
  margin-right:40px;
}
.info {
		box-sizing: border-box;
		padding: 30px;
		background: rgb(240, 242, 245);
		width: 100%;
	}

	.info>.info_prev {
		box-sizing: border-box;
		padding-left: 30px;
		padding-top: 30px;
		background: #fff;
	}

	.title_info {
		margin-top: 20px;
		margin-left: 40px;
		margin-bottom: 50px;
	}

	.info_mes {
		margin-bottom: 40px;
		display: flex;
		justify-content: center;
	}

	.info_mes p {
		display: inline-block;
	}

	.info_mes .left_mes {
		margin-right: 200px;
		font-size:16px ;
	}
	.right_mes{
		font-size:16px ;
	}

	h1 {
		display: flex;
		justify-content: center;
	}

	.content_list {
		margin-left: 100px;
		margin-right: 100px;
		margin-top: 50px;
	}
	
	.content_list h3 {
		margin-top: 30px;
		font-weight: bold;
		padding-bottom: 10px;
	}

	.content_list p {
		margin-top: 10px;
		margin-bottom: 10px;
	}

	.el-row {
		display: flex;
		justify-content: center;

	}
	.message>p{
		font-weight: bold;
	}
</style>