<script setup name="auditList">
import { getCurrentInstance, onMounted, ref } from 'vue'
import { useRoute } from 'vue-router'
import { projectDetail } from '@/http/apis/projectStoreManage/projectStore'
import { approve, summary, summaryList } from '@/http/apis/projectStoreManage/reviewCheckProjectList'
import router from '@/router'
const { proxy } = getCurrentInstance(),
  route = useRoute(),
  form = ref({}),
  formRef = ref(),
  detailData = ref({}),
  getDetail = async () => {
    const res = await projectDetail(route.query.id)
    detailData.value = res.data
    form.value = {
      reviewChecklist: res.data?.reviewChecklist && JSON.parse(res.data.reviewChecklist) || []
    }
  },
  getSummaryList = async () => {
    const res = await summaryList(route.query.projectCode)
    form.value = {
      reviewChecklist: res.data
    }
  },
  submitLoading = ref(false),
  submit = (formEl) => {
    if (!formEl) return
    formEl.validate(async (valid) => {
      if (valid) {
        submitLoading.value = true
        const postData = []
        form.value.reviewChecklist.forEach(i => {
          i.modules.forEach(j => {
            postData.push({
              ...j,
              ...i,
              projectCode: route.query.projectCode,
              modules: undefined
            })
          })
        })
        try {
          await approve(postData)
          submitLoading.value = false
          proxy.$message.success('提交成功')
          router.go(-1)
        } catch (e) {
          submitLoading.value = false
        }
      }
    })
  },
  composite = async () => {
    await summary(route.query.projectCode)
    proxy.$message.success('合成成功')
    router.go(-1)
  }
onMounted(() => {
  if (route.name === 'auditList') {
    getDetail()
  } else {
    getSummaryList()
  }
})
</script>

<template>
  <div class="footerPage auditList">
    <el-card v-if="$route.name==='auditList'" shadow="never" class="mb-16">
      <div class="card-header">
        <div class="flex justify-between items-center">
          <div class="flex-1">
            <p class="font-bold">{{ detailData.projectName }}</p>
            <div class="mt-8 search">
              <el-form label-suffix=":">
                <el-row :gutter="24">
                  <el-col :span="6">
                    <el-form-item label="项目联系人">{{ detailData.contactName||'-' }}</el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="联系方式">{{ detailData.contactPhone||'-' }}</el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="建设单位">{{ detailData.buildOrgName||'-' }}</el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="投资总估算">{{ detailData.declareAmount||'-' }}万元</el-form-item>
                  </el-col>
                  <el-col :span="6">
                    <el-form-item label="项目简介">{{ detailData.projectIntroduction||'-' }}</el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </div>
          </div>
        </div>
      </div>
    </el-card>
    <el-card shadow="never">
      <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 v-if="$route.name==='auditList'" :span="6">
                <div class="flex items-center">
                  <el-form-item
                    v-if="child.reviewResult===2||child.reviewResult===3"
                    label="审核意见"
                    :prop="`reviewChecklist[${index}].modules[${key}].reviewComments`"
                    :rules="[{required:true,message:'请输入'}]"
                    style="margin-right: 4px"
                  >
                    <el-input v-model="child.reviewComments" type="textarea" />
                  </el-form-item>
                  <el-form-item
                    :prop="`reviewChecklist[${index}].modules[${key}].reviewResult`"
                    :rules="[{required:true,message:'请选择'}]"
                    style="margin-bottom: 0"
                  >
                    <el-radio-group
                      v-model="child.reviewResult"
                      class="resultRadiogroup"
                    >
                      <el-radio :label="1">通过</el-radio>
                      <el-radio :label="2">不通过</el-radio>
                      <el-radio :label="3">一票否决</el-radio>
                    </el-radio-group>
                  </el-form-item>
                </div>
              </el-col>
              <el-col v-else :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>
    </el-card>
    <div class="footer">
      <el-button @click="$router.go(-1)"> 返回 </el-button>
      <el-button
        v-if="$route.name==='auditList'"
        type="primary"
        :loading="submitLoading"
        @click="submit(formRef)"
      > 提交 </el-button>
      <el-button v-else type="primary" @click="composite"> 合成报告 </el-button>
    </div>
  </div>
</template>
<style lang="less">
.auditList{
  .resultRadiogroup{
    display: flex;
    flex-direction: column;
    align-items: baseline;
    .el-radio{
      margin: 0;
    }
  }
}
</style>
