<template>
  <Card title="基本信息">
    <div class="contentBox">
      <p class="row">
        <span>项目位置</span>
        <a>{{list.projectAddress}}</a>
      </p>
      <p class="row">
        <span>用地面积</span>
        <a>{{list.projectAcreage}}㎡</a>
      </p>
      <p class="row">
        <span>建设单位</span>
        <a>{{list.constructionUnit}}</a>
      </p>
      <p class="row">
        <span>设计单位</span>
        <a>{{list.designUnit}}</a>
      </p>
      <p class="row">
        <span>勘察单位</span>
        <a>{{list.exploreUnit}}</a>
      </p>
      <p class="row">
        <span>监理单位</span>
        <a>{{list.supervisorUnit}}</a>
      </p>
    </div>
  </Card>
</template>

<script>
import Card from "../components/Card.vue";
import { listProjectInfo } from '@/assets/js/api/zhongjianFourth'
export default {
  components: { Card },
  data(){
    return{
      list:{
        projectAddress:'',
        projectAcreage:'',
        constructionUnit:"",
        designUnit:"",
        exploreUnit:"",
        supervisorUnit:"",
      }
    }
  },
  created(){
    this.getData();
  },
  methods:{
    getData(){
      listProjectInfo({projectSn: this.$store.state.projectSn}).then((res)=>{
        console.log('========',res)
        this.list = res.result
      })
    }
  }
};
</script>

<style lang="less" scoped>
.contentBox {
  width: 100%;
  height: 90%;
  overflow: auto;
  margin-top: 3%;
  margin-left: 2%;
  .row {
    height: 35px;
    line-height: 35px;
    display: flex;
    justify-content: left;
    align-content: left;
    margin-top: 3px;
    background-image: url(../assets/images/common/bg-intro.png);
    background-repeat: no-repeat;
    background-size: 100%;
    span {
      margin-left: 10%;
      color: white;
      width: 25%;
      font-size: 14px;
      position: relative;
    }
    a {
      color: #c4c7cc;
    }
  }
  .row:active,
  .row:hover {
    height: 55px;
    line-height: 55px;
    background-image: url(../assets/images/common/bg-ihover.png);
    background-repeat: no-repeat;
    background-size: 100%;
    a {
      color: #bc5935;
    }
    span::before {
      content: "";
      top: 30%;
      left: -30%;
      position: absolute;
      border: 8px solid transparent;
      border-left: 8px solid white;
      display: inline-block;
    }
  }
}
::-webkit-scrollbar {
 width: 3px;
 color: #182337;
}
</style>
