<script name="reviewCheckList" setup>
import { onMounted, ref } from 'vue'

const props = defineProps({
  detailData: Object
})
const form = ref()
onMounted(() => {
  form.value = {
    reviewChecklist: props.detailData.reviewChecklist && JSON.parse(props.detailData?.reviewChecklist) || []
  }
})
</script>

<template>
  <el-form
    ref="formRef"
    :model="form"
    label-suffix=":"
    label-position="top"
  >
    <div v-for="(item,index) in form?.reviewChecklist" :key="index">
      <p class="font-bold text-16 mb-8">{{ item.title }}</p>
      <div v-for="(child,key) in item.modules" :key="key" class="mb-16">
        <el-row :gutter="16" class="items-center">
          <el-col :span="8">
            <el-form-item :label="child.subTitle">
              <el-input v-model="child.content" type="textarea" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="4">
            <el-form-item label="否决情形">
              <el-input v-model="child.rejectionSituation" type="textarea" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item
              label="响应情况"
              class="flex-form-item"
              style="margin-bottom: 14px"
            >
              <el-input v-model="child.responseSituation" disabled />
            </el-form-item>
            <el-form-item
              label="对应页面"
              class="flex-form-item"
              style="margin-bottom: 0"
            >
              <el-input v-model="child.corrPageNum" disabled />
            </el-form-item>
          </el-col>
          <el-col :span="6">
            <el-form-item
              label="审核意见"
            >
              <el-input v-model="child.reviewComments" type="textarea" disabled />
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-divider v-if="index<form.reviewChecklist?.length-1" />
    </div>
  </el-form>
</template>
