<script setup name="sureScore">
import { onMounted, reactive, ref } from 'vue'
import { templateDetail } from '@/http/apis/performanceEvaluation/unitSelfEvaluation'
import { useRoute } from 'vue-router'
import Accessory from '@/components/accessory/index.vue'

const props = defineProps({
    appraisalInfoList: {
      type: Array,
      default: () => []
    }
  }),
  route = useRoute(),
  columns = reactive([
    {
      label: '一级指标',
      key: 'oneName',
      prop: 'oneName'
    },
    {
      label: '二级指标',
      key: 'twoName',
      prop: 'twoName'
    },
    {
      label: '三级指标',
      key: 'name',
      prop: 'name'
    },
    {
      label: '指标细则',
      key: 'indexDetail',
      prop: 'indexDetail'
    },
    {
      label: '评分细则',
      key: 'gradeDetail',
      prop: 'gradeDetail'
    },
    {
      label: '佐证材料',
      key: 'supportMaterial',
      prop: 'supportMaterial'
    },
    {
      label: '指标分值',
      key: 'indexScore',
      prop: 'indexScore',
      width: 85
    },
    {
      label: '复核得分',
      key: 'selfScore',
      slot: 'selfScore',
      width: 85
    },
    {
      label: '复核说明',
      key: 'selfBasis',
      slot: 'selfBasis',
      width: 200
    }
  ]),
  objectSpanMethod = ({
    row,
    column,
    rowIndex,
    columnIndex
  }) => {
    if (columnIndex === 0) {
      if (row.isFirstOne) {
        return {
          rowspan: row.oneRows,
          colspan: 1
        }
      } else {
        return {
          rowspan: 0,
          colspan: 0
        }
      }
    }
    if (columnIndex === 1) {
      if (row.isFirstTwo) {
        return {
          rowspan: row.twoRows,
          colspan: 1
        }
      } else {
        return {
          rowspan: 0,
          colspan: 0
        }
      }
    }
  },
  tableData = ref([]),
  loading = ref(false),
  getDetail = async () => {
    loading.value = true
    tableData.value = []
    const res = await templateDetail(route.query.projectCode)
    const data1 = getData(res.data.templateDetails)
    const data2 = getData(res.data.additionalIndexDetails)
    tableData.value = [...data1, ...data2]
    props.appraisalInfoList.forEach((data, index) => {
      tableData.value[index].appraisalType4List = data
    })
    console.log(tableData.value)
    loading.value = false
  },
  getData = (data) => {
    const list = []
    data.forEach((one, oneIndex) => {
      let oneRows = 0
      one.children.forEach((two, twoIndex) => {
        let twoRows = 0
        two.children.forEach((three, threeIndex) => {
          list.push({
            oneId: one.templateId,
            oneName: one.name,
            twoId: two.templateId,
            twoName: two.name,
            isFirstOne: oneRows === 0,
            isFirstTwo: twoRows === 0,
            appraisalType1List: three.selfAppraisalScoreInfo?.filter(i => i.appraisalType === 1) || [],
            appraisalType2List: three.reAppraisalScoreInfo && Object.values(three.reAppraisalScoreInfo).reduce((arr, cur) => arr.concat((cur), [])) || [],
            appraisalType3List: three.verifyScoreInfo && Object.values(three.verifyScoreInfo).reduce((arr, cur) => arr.concat((cur), [])) || [],
            oneRows,
            twoRows,
            ...three,
            threeId: three.templateId
          })
          oneRows++
          twoRows++
        })
        list.forEach(i => {
          if (i.twoId === two.templateId) {
            i.twoRows = twoRows
          }
        })
      })
      list.forEach(i => {
        if (i.oneId === one.templateId) {
          i.oneRows = oneRows
        }
      })
    })
    return list
  }
onMounted(() => {
  getDetail()
})
</script>

<template>
  <table-list
    v-loading="loading"
    :stripe="false"
    :border="true"
    :pagination="false"
    :data="tableData"
    :span-method="objectSpanMethod"
    :column="columns"
  >
    <template #selfScore="{scope}">
      <div v-if="scope.row.appraisalType4List">
        {{ scope.row.appraisalType4List.score }}
      </div>
      <span v-else>-</span>
    </template>
    <template #selfBasis="{scope}">
      <template v-if="scope.row.appraisalType4List">
        <p>{{ scope.row.appraisalType4List.appraisalBasis||'-' }}</p>
        <p v-for="(file,fileIndex) in scope.row.appraisalType4List?.appraisalBasisAppendix&&JSON.parse(scope.row.appraisalType4List.appraisalBasisAppendix)" :key="fileIndex" class="mb-4">
          <accessory :file-name="file.originalFileName" :file-id="file.id" />
        </p>
      </template>
      <span v-else>-</span>
    </template>
  </table-list>
</template>
