<script lang="ts" setup>
defineProps({
  data: {
    type: Object as PropType<any>,
    required: true,
  },
})
</script>

<template>
  <table class="description">
    <tr>
      <th>拜访终端名称</th>
      <td class="blue">
        {{ data?.ocrPicture?.field3 }}
      </td>
      <th>定位信息</th>
      <td class="blue">
        {{ data?.ocrPicture?.field10 }}
      </td>
    </tr>
    <tr>
      <th>拜访日期</th>
      <td> {{ data?.ocrPicture?.field1 }}</td>
      <th>定位距离</th>
      <td> {{ data?.ocrPicture?.field12 }}</td>
    </tr>
    <tr>
      <th>拜访小结</th>
      <td> {{ data?.ocrPicture?.field8 }}</td>
      <th>拜访项目类别</th>
      <td> {{ data?.ocrPicture?.field17 }}</td>
    </tr>
    <tr>
      <th>科室名称</th>
      <td> {{ data?.ocrPicture?.field7 }}</td>
      <th>病例号</th>
      <td>？</td>
    </tr>
    <tr>
      <th>拜访级别</th>
      <td> {{ data?.ocrPicture?.field6 }}</td>
      <th>下阶段计划</th>
      <td>?</td>
    </tr>
    <tr>
      <th>是否为重复图片</th>
      <td> {{ data?.ocrPicture?.field14 }}</td>
      <th>附件信息</th>
      <td>
        <a href="data?.fileannex" download>????</a>
      </td>
    </tr>
  </table>
</template>

<style lang="less" scoped>
.description {
  width: 100%;
  font-size: 14px;
}

th {
  width: 20%;
  background-color: #fafafa;
  color: #666666;
}

td {
  width: 30%;
}

th,
td {
  border: 1px solid #ebebeb;
  padding: 12px 24px;
  text-align: left;
}

.blue {
  color: #507afd;
}

.black {
  color: #666666;
}
</style>
