<template>
  <a-descriptions bordered>
    <!--    <template #extra>-->
    <!--      <a @click="openEdit">编辑</a>-->
    <!--    </template>-->
    <a-descriptions-item
      label="设备名称"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.name }}</a-descriptions-item
    >
    <a-descriptions-item
      label="设备状态"
      :labelStyle="{ width: '200px', color: '#808080' }"
    >
      <a-tag v-if="data.status === 0" color="green">闲置</a-tag>
      <a-tag v-if="data.status === 1" color="red">报废</a-tag>
      <a-tag v-if="data.status === 2" color="purple">注销</a-tag>
      <a-tag v-if="data.status === 3" color="orange">转卖</a-tag>
    </a-descriptions-item>
    <a-descriptions-item
      label="二维码"
      :labelStyle="{ width: '200px', color: '#808080' }"
      ><ele-qr-code
        :value="`http://1.14.159.185:10042/tower/machine/detail/${data.equipmentId}`"
        :size="100"
    /></a-descriptions-item>

    <a-descriptions-item
      label="设备型号"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.model }}</a-descriptions-item
    >
    <a-descriptions-item
      label="备案编号"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.filingNo }}</a-descriptions-item
    >
    <a-descriptions-item
      label="出厂编号"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.factoryNo }}</a-descriptions-item
    >
    <a-descriptions-item
      label="出厂日期"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.factoryDate }}</a-descriptions-item
    >
    <a-descriptions-item
      label="制造厂家"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.manufactor }}</a-descriptions-item
    >
    <a-descriptions-item
      label="报废日期"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.scrapDate }}</a-descriptions-item
    >
    <a-descriptions-item
      label="自编号"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.name }}</a-descriptions-item
    >
    <a-descriptions-item
      label="使用年限"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.lifeYear }}</a-descriptions-item
    >

    <a-descriptions-item
      label="剩余使用年限"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.surplusYear }}</a-descriptions-item
    >
    <a-descriptions-item
      label="产权单位"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.company }}</a-descriptions-item
    >
    <a-descriptions-item
      label="所属仓库"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.warehouse }}</a-descriptions-item
    >
    <a-descriptions-item
      label="采购日期"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.buyDate }}</a-descriptions-item
    >
    <a-descriptions-item
      label="设备来源"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.source }}</a-descriptions-item
    >
    <a-descriptions-item
      label="设计高度"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.designHeight }}</a-descriptions-item
    >
    <a-descriptions-item
      label="额定载重"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.ratedLoad }}</a-descriptions-item
    >
    <a-descriptions-item
      label="最大起升高度(m)"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.maxLiftingHeight }}</a-descriptions-item
    >
    <a-descriptions-item
      label="独立高度"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.height }}</a-descriptions-item
    >
    <a-descriptions-item
      label="最大幅度处额定载重"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.maxRatedLoad }}</a-descriptions-item
    >
    <a-descriptions-item
      label="臂长"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.armLength }}</a-descriptions-item
    >
    <a-descriptions-item
      label="采购合同"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file1 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="发票"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file2 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="制造许可证"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file3 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="出厂合格证"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file4 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="备案证书"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file5 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="整机性能参数表"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file6 }}</a-descriptions-item
    >
    <a-descriptions-item
      label="其他"
      :labelStyle="{ width: '200px', color: '#808080' }"
      >{{ data.file7 }}</a-descriptions-item
    >
  </a-descriptions>
  <!-- 编辑弹窗 -->
  <AppInfoEdit v-model:visible="showEdit" :data="data" @done="reload" />
</template>
<script lang="ts" setup>
  import { ref } from 'vue';
  import AppInfoEdit from './app-info-edit.vue';
  import { TowerEquipment } from '@/api/tower/equipment/model';

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

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

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

  const openAppSecretForm = () => {
    showAppSecretForm.value = true;
  };

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

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