<template>
    <table class="detail-table" border="1" cellspacing="1">
        <colgroup>
          <col width="15%" />
          <col width="35%" />
          <col width="15%" />
          <col width="35%" />
        </colgroup>
        <tbody>
            <tr class="ant-table-cell ant-table-cell-ellipsis">
                <td class="ant-table-cell ant-table-cell-ellipsis bgColor">需要风险管控修复土壤污染面积</td>
                <td class="ant-table-cell ant-table-cell-ellipsis" colspan="3">{{ data?.wrmj }} m²</td>
            </tr>
            <tr class="ant-table-cell ant-table-cell-ellipsis">
                <td class="ant-table-cell ant-table-cell-ellipsis bgColor">主要风险</td>
                <td class="ant-table-cell ant-table-cell-ellipsis" colspan="3">
                    {{ data?.zyfx == 1 ? '公众健康风险' : `其他：${data?.zyfxQt || ''}` }}
                </td>
            </tr>
            <tr class="ant-table-cell ant-table-cell-ellipsis">
                <td class="ant-table-cell ant-table-cell-ellipsis bgColor">风险管控、修复要求</td>
                <td class="ant-table-cell ant-table-cell-ellipsis" colspan="3">
                    <span v-if="data?.gkxflx == 1000">风险管控</span>
                    <span v-if="data?.gkxflx == 2000">修复</span>
                    <span v-if="data?.gkxflx == 3000">管控及修复</span>
                    <span v-if="data?.gkxflx == 4000">风险可接受</span>
                </td>
            </tr>
        </tbody>
    </table>
</template>
      
<script lang="ts" setup>
import { defineProps } from 'vue';
const props = defineProps({
    data: {
        type: Object,
        default: () => ({}),
    },
})
</script>
