<script name="projectCollectionEnterOtherMaterials" setup>
import { ref, watch } from 'vue'
import { fileFormatVerification, handleFileError, handleFileSuccess, handleFilePreview, reviewFileParam, fileTypes, fileDesc } from '@/utils/uploadAction'
import store from '@/store'

const props = defineProps({
    detail: {
      type: Object
    },
    data: {
      type: Object
    }
  }),
  uploadUrl = store.dictStore.uploadUrl,
  formRef = ref(),
  formData = ref({
    feasibilityStudyReport: [],
    approvedFile: [],
    purchaseFile: [],
    acceptanceLetter: [],
    purchaseContract: [],
    acceptanceReport: [],
    changeApprovalDoc: []
  }),
  fileRule = [{ required: true, message: '请选择文件' }],
  rules = {
    feasibilityStudyReport: fileRule,
    approvedFile: fileRule,
    purchaseFile: fileRule,
    acceptanceLetter: fileRule,
    purchaseContract: fileRule,
    acceptanceReport: fileRule,
    changeApprovalDoc: fileRule,
    constructionOrg: [{ required: true, message: '请填写承建单位' }],
    constructionOrgCreditCode: [{ required: true, message: '请填写承建单位统一信用代码' }]
  }
defineExpose({ formRef, formData })
watch(() => props.detail, val => {
  if (val) {
    formData.value = {
      feasibilityStudyReport: reviewFileParam(JSON.parse(val.feasibilityStudyReport)),
      approvedFile: reviewFileParam(JSON.parse(val.approvedFile)),
      purchaseFile: reviewFileParam(JSON.parse(val.purchaseFile)),
      acceptanceLetter: reviewFileParam(JSON.parse(val.acceptanceLetter)),
      purchaseContract: reviewFileParam(JSON.parse(val.purchaseContract)),
      acceptanceReport: reviewFileParam(JSON.parse(val.acceptanceReport)),
      changeApprovalDoc: reviewFileParam(JSON.parse(val.changeApprovalDoc)),
      constructionOrg: val.constructionOrg,
      constructionOrgCreditCode: val.constructionOrgCreditCode,
      supervisorOrg: val.supervisorOrg,
      supervisorOrgCreditCode: val.supervisorOrgCreditCode
    }
  }
})
watch(() => props.data, val => {
},
{ immediate: true, deep: true })
</script>

<template>
  <el-form
    ref="formRef"
    :model="formData"
    :rules="rules"
    label-position="top"
    label-suffix=":"
    scroll-to-error
  >
    <el-row :gutter="40">
      <el-col :span="24">
        <el-form-item
          label="可行性研究报告（建设方案、运维方案）"
          :prop="props.data.status===1||props.data.status===2?'':'feasibilityStudyReport'"
        >
          <el-upload
            v-model:file-list="formData.feasibilityStudyReport"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.feasibilityStudyReport)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>

      <el-col :span="8">
        <el-form-item
          label="立项批复文件"
          prop="approvedFile"
        >
          <el-upload
            v-model:file-list="formData.approvedFile"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.approvedFile)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="采购文件"
          prop="purchaseFile"
        >
          <el-upload
            v-model:file-list="formData.purchaseFile"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.purchaseFile)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="中标通知书"
          prop="acceptanceLetter"
        >
          <el-upload
            v-model:file-list="formData.acceptanceLetter"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.acceptanceLetter)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="采购合同"
          prop="purchaseContract"
        >
          <el-upload
            v-model:file-list="formData.purchaseContract"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.purchaseContract)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="验收报告"
          prop="acceptanceReport"
        >
          <el-upload
            v-model:file-list="formData.acceptanceReport"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.acceptanceReport)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="变更批复文件"
          prop="changeApprovalDoc"
        >
          <el-upload
            v-model:file-list="formData.changeApprovalDoc"
            class="w-full"
            :action="uploadUrl"
            :on-success="res => handleFileSuccess(res, formData.changeApprovalDoc)"
            :on-error="handleFileError"
            :before-upload="file=>fileFormatVerification(file, {types: fileTypes})"
            :accept="fileTypes.map(i=>`.${i}`).join(',')"
            multiple
            :limit="10"
            :on-preview="handleFilePreview"
          >
            <el-button type="primary" class="mr-4">上传文件</el-button>
            <template #tip>
              <div class="el-upload__tip">支持{{ fileDesc }}文件</div>
            </template>
          </el-upload>
        </el-form-item>
      </el-col>

      <el-col :span="6">
        <el-form-item label="承建单位" :prop="props.data.status===3||props.data.status===4||props.data.status===6?'constructionOrg':''">
          <el-input v-model="formData.constructionOrg" maxlength="50" placeholder="请填写" />
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="承建单位统一信用代码" :prop="props.data.status===3||props.data.status===4||props.data.status===6?'constructionOrgCreditCode':''">
          <el-input v-model="formData.constructionOrgCreditCode" maxlength="50" placeholder="请填写" />
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="监理单位" prop="supervisorOrg">
          <el-input v-model="formData.supervisorOrg" maxlength="50" placeholder="请填写" />
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="监理单位统一信用代码" prop="supervisorOrgCreditCode">
          <el-input v-model="formData.supervisorOrgCreditCode" maxlength="50" placeholder="请填写" />
        </el-form-item>
      </el-col>
    </el-row>
  </el-form>

</template>
