<template>
  <!-- <div class="w-full flex justify-end"><a-button type="primary">上传</a-button></div> -->
  <div class="text-center py-2">样点监测信息</div>
  <a-table :dataSource="dataSource" :columns="columns">
    <template #bodyCell="{ column, index }">
      <template v-if="column.key == 'index'">
        {{ index + 1 }}
      </template>
    </template>
  </a-table>
</template>

<script lang="ts" setup>
  import { ref, watch } from 'vue';
  import { getJcypInfoList } from '@/api/common/api';

  const props = defineProps({
    sampleId: {
      type: String,
      default: '',
    },
  });
  const dataSource = ref();
  const columns = ref<any>([
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
    },
    {
      title: '样品编码',
      dataIndex: 'samplecode',
      key: 'samplecode',
    },
    {
      title: '检测项目编码',
      dataIndex: 'pollutecode',
      key: 'pollutecode',
    },
    {
      title: '检测项目',
      dataIndex: 'pollutename',
      key: 'pollutename',
    },

    {
      title: '检测方法',
      dataIndex: 'samplemethod',
      key: 'samplemethod',
    },
    {
      title: '标准文号',
      dataIndex: 'bzwh',
      key: 'bzwh',
    },
    {
      title: '检测值',
      dataIndex: 'pollutevalue',
      key: 'pollutevalue',
    },
    {
      title: '检测项目编码',
      dataIndex: 'polluteno',
      key: 'polluteno',
    },
    {
      title: '单位',
      dataIndex: 'dw',
      key: 'dw',
    },
    {
      title: '评价结果',
      dataIndex: 'pjjg',
      key: 'pjjg',
    },
  ]);

  async function init() {
    const res = await getJcypInfoList({ sampleId: props.sampleId });
    dataSource.value = res.records;
  }
  watch(
    () => props.sampleId,
    (val) => {
      console.log(val, 'valbuzou');
      init();
    },
    { deep: true, immediate: true }
  );
</script>
