<template>
  <a-descriptions title="基本信息" :column="2" bordered>
    <template #extra>
      <a @click="openEdit">编辑</a>
    </template>
    <a-descriptions-item
      label="企业名称"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.companyName }}</a-descriptions-item
    >
    <a-descriptions-item
      label="状态"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      <template v-if="data.status == 0">
        <a-badge status="processing" :text="`正常`" />
      </template>
      <template v-if="data.status == 1">
        <a-badge status="default" :text="`冻结`" />
      </template>
    </a-descriptions-item>
    <a-descriptions-item
      label="客户简称"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.shortName }}</a-descriptions-item
    >
    <a-descriptions-item
      label="客户类型"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.companyType }}</a-descriptions-item
    >
    <a-descriptions-item
      label="统一社会信用代码"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.companyCode }}</a-descriptions-item
    >
    <a-descriptions-item
      label="所属行业"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      <a-space class="justify">
        {{ data.industryParent }}
        {{ data.industryChild ? data.industryChild : '-' }}
      </a-space>
    </a-descriptions-item>
    <a-descriptions-item
      label="法定代表人"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.businessEntity }}
    </a-descriptions-item>
    <a-descriptions-item
      label="所属区域"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      <a-space class="justify">
        <span
          >{{ data.province }} {{ data.city }}
          {{ data.region ? data.region : '-' }}</span
        >
      </a-space>
    </a-descriptions-item>
    <a-descriptions-item
      label="手机号码"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.phone }}
    </a-descriptions-item>
    <a-descriptions-item
      label="办公地址"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.address }}
    </a-descriptions-item>
    <a-descriptions-item
      label="座机电话"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.tel }}
    </a-descriptions-item>
    <a-descriptions-item
      label="描述"
      :span="2"
      layout="vertical"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.comments }}
    </a-descriptions-item>

    <a-descriptions-item
      label="电子邮箱"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.email }}
    </a-descriptions-item>
    <a-descriptions-item
      label="官方网站"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      {{ data.domain }}
    </a-descriptions-item>
    <a-descriptions-item
      label="logo"
      layout="vertical"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      <ele-image-upload
        v-model:value="logo"
        :disabled="true"
        :item-style="{ width: '90px', height: '90px' }"
        :limit="1"
      />
    </a-descriptions-item>
    <!--    <a-descriptions-item-->
    <!--      label="二维码"-->
    <!--      layout="vertical"-->
    <!--      :labelStyle="{ width: '200px', color: '#808080' }"-->
    <!--    >-->
    <!--      <ele-image-upload-->
    <!--        v-model:value="companyQrcode"-->
    <!--        :disabled="true"-->
    <!--        :item-style="{ width: '90px', height: '90px' }"-->
    <!--        :limit="1"-->
    <!--      />-->
    <!--    </a-descriptions-item>-->
  </a-descriptions>
  <!-- 编辑弹窗 -->
  <CompanyInfoEdit v-model:visible="showEdit" :data="data" @done="reload" />
</template>
<script lang="ts" setup>
  import { Company } from '@/api/oa/company/model';
  import { ref } from 'vue';
  import CompanyInfoEdit from './company-info-edit.vue';

  defineProps<{
    data: Company;
    logo: [] | any;
    companyQrcode: any | undefined;
  }>();

  const emit = defineEmits<{
    (e: 'done'): void;
  }>();

  // 是否显示编辑弹窗
  const showEdit = ref(false);
  const showCompanySecretForm = ref<boolean>(false);

  const openCompanySecretForm = () => {
    showCompanySecretForm.value = true;
  };

  /* 打开编辑弹窗 */
  const openEdit = () => {
    showEdit.value = true;
  };

  const reload = () => {
    emit('done');
  };
</script>
