<template>
  <div class="drawer-company">
    <div class="drawerLoading" v-if="loading" v-loading="true"></div>
    <div class="drawer-company-top">
      <div class="company-top-title">
        <div class="company-name">
          <h1>{{ data.name }}</h1>
          <p>
            <img src="@/assets/imgs/jdt/website.png" />{{
              data.tel_info ? data.tel_info : "---"
            }}
          </p>
          <p>
            <i class="el-icon-search"></i
            >{{ data.businessAddress ? data.businessAddress : "---" }}
          </p>
        </div>
        <div class="company-img">
          <img src="@/assets/imgs/jdt/GSlogo.png" alt="" />
        </div>
      </div>
    </div>
    <div class="drawer-company-main">
      <table>
        <tr>
          <td>统一社会信用代码</td>
          <td>{{ data.creditCode ? data.creditCode : "---" }}</td>
          <td>组织机构代码</td>
          <td>{{ data.organizationCode ? data.organizationCode : "---" }}</td>
        </tr>
        <tr>
          <td>注册号</td>
          <td>{{ data.registrID ? data.registrID : "---" }}</td>
          <td>经营状态</td>
          <td>{{ data.managementState ? data.managementState : "---" }}</td>
        </tr>
        <tr>
          <td>公司类型</td>
          <td>{{ data.companyType ? data.companyType : "---" }}</td>
          <td>成立日期</td>
          <td>{{ data.foundation ? data.foundation : "---" }}</td>
        </tr>
        <tr>
          <td>法定代表人</td>
          <td>
            {{ data.legalRepresentative ? data.legalRepresentative : "---" }}
          </td>
          <td>营业期限</td>
          <td>{{ data.businessTerm ? data.businessTerm : "---" }}</td>
        </tr>
        <tr>
          <td>注册资本</td>
          <td>{{ data.registeredCapital ? data.registeredCapital : "---" }}</td>
          <td>发照日期</td>
          <td>{{ data.dateIssue ? data.dateIssue : "---" }}</td>
        </tr>
        <tr>
          <td>登记机关</td>
          <td colspan="3">
            {{ data.registerOffice ? data.registerOffice : "---" }}
          </td>
        </tr>
        <tr>
          <td>营业范围</td>
          <td colspan="3">{{ data.scope ? data.scope : "---" }}</td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>
import { getCompanyInfoNoUser } from "@/api/tmQuery.js";
export default {
  props: ["title"],
  data() {
    return {
      data: {},
      loading: false
    };
  },
  mounted() {
    this.getCompanyInfo();
  },
  methods: {
    getCompanyInfo() {
      this.loading = true;
      getCompanyInfoNoUser(this.title).then(res => {
        this.loading = false;
        if (res.status == 0) {
          this.data = res.data;
        }
      });
    }
  },
  watch: {
    title() {
      this.getCompanyInfo();
    }
  }
};
</script>

<style lang="scss">
.drawer-company {
  width: 100%;
  padding: 0 30px;
  .drawer-company-top {
    width: 100%;
  }
  .drawerLoading {
    position: absolute !important;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
  }
}
.company-top-title {
  width: 100%;
  height: 122px;
  margin-bottom: 30px;
  .company-name {
    float: left;
    h1 {
      font-size: 20px;
      margin-bottom: 35px;
    }
    p {
      width: 100%;
      line-height: 30px;
      display: flex;
      align-items: center;
      font-size: 14px;
      color: #606266;
      img {
        width: 14px !important;
        height: 14px !important;
        margin-right: 10px;
      }
      i {
        font-size: 14px;
        margin-right: 10px;
      }
    }
  }
  .company-img {
    float: right;
    border-radius: 5px;
    overflow: hidden;
  }
}
.drawer-company-main {
  width: 100%;
  margin-bottom: 40px;
  table {
    width: 100%;
    tr {
      width: 100%;
      td:nth-child(odd) {
        text-align: center;
        border: 0.25px solid #d8d8d8;
        white-space: nowrap;
        padding: 0 10px;
      }
      td:nth-child(even) {
        padding: 15px 30px;
        border: 0.25px solid #d8d8d8;
      }
    }
  }
}
</style>
