<template>
  <div class="company-edit">
    <el-form
      ref="ruleFormRef"
      :model="ruleForm"
      :rules="rules"
      label-position="left"
      label-width="150px"
      class="rule-form-orange company-form"
    >
      <el-form-item label="企业名称" prop="corporateName" style="width: 100%">
        <el-input
          v-model="ruleForm.corporateName"
          placeholder="请输入企业名称"
          disabled
        >
        </el-input>
      </el-form-item>
      <el-form-item label="统一社会信用代码" style="width: 100%" prop="socialCreditCode">
        <el-input
          v-model="ruleForm.socialCreditCode"
          placeholder="请输入统一社会信用代码"
          disabled
        />
      </el-form-item>

      <div v-for="(item,index) in creditDetails" :key="index" style="width: 100%;margin-right: 20px;padding: 20px;border: 1px solid #ccc;border-radius: 5px;overflow: hidden;">
        <el-form-item label="征信查询授权书" style="width: 100%;margin-bottom: 0px;">
          <cy-upload
            :upload-params="{}"
            :file-data="item.authAddressFile?[item.authAddressFile]:[]"
            :upload-from-orange-status="true"
            placeholder="请上传征信查询授权书"
            :can-download="true"
            disabled
            download-power="enterpriseDownload"
          />
        </el-form-item>
        <el-form-item label="征信查询日期" style="width: 100%;margin-bottom: 0px;">
          <el-date-picker :value="item.searchDate" value-format="yyyy-MM-dd" type="date" placeholder="选择征信查询日期" style="width: 100%;" disabled />
        </el-form-item>
        <el-form-item label="征信报告" style="width: 100%;margin-bottom: 0px;">
          <cy-upload
            :upload-params="{}"
            :file-data="item.creditAddressFile?[item.creditAddressFile]:[]"
            :upload-from-orange-status="true"
            placeholder="请上传征信报告"
            disabled
            :can-download="true"
            download-power="enterpriseDownload"
          />
        </el-form-item>
      </div>

      <p v-if="creditDetails && type!=='view'" class="operate" @click="operationShow=true">+增加</p>

      <template v-if="operationShow">
        <el-form-item label="征信查询授权书" prop="creditAuth" style="width: 100%">
          <cy-upload
            ref="creditAuth"
            :upload-params="{
              fileType: 'creditAuth'
            }"
            :file-data="ruleForm.creditAuth"
            :upload-from-orange-status="true"
            placeholder="请上传征信查询授权书"
            :disabled="type==='view'"
          />
        </el-form-item>
        <el-form-item label="征信查询日期" prop="searchDate" style="width: 100%;" :rules="[{required: operationShow, trigger: 'change', message: '请选择征信查询日期'}]">
          <el-date-picker v-model="ruleForm.searchDate" value-format="yyyy-MM-dd" type="date" placeholder="选择征信查询日期" style="width: 100%;" :disabled="type==='view'" />
        </el-form-item>
        <el-form-item label="征信报告" prop="creditReport" style="width: 100%">
          <span slot="label" class="required-label">征信报告</span>
          <cy-upload
            ref="creditReport"
            :upload-params="{
              fileType: 'creditReport'
            }"
            :file-data="ruleForm.creditReport"
            :upload-from-orange-status="true"
            placeholder="请上传征信标报告"
            :disabled="type==='view'"
          />
        </el-form-item>
      </template>
    </el-form>
  </div>
</template>

<script>
import { creditDetail } from '@/api/creditInfoManage/index'
export default {
  props: {
    detailId: {
      type: Number,
      default: null
    },
    type: {
      type: String,
      default: ''
    }
  },
  data() {
    return {
      listData: [],
      ruleForm: {
        id: '',
        corporateName: '',
        socialCreditCode: '',
        searchDate: '',
        creditAuth: [],
        creditReport: []
      },
      creditDetails: [],
      rules: {

      },
      operationShow: false

    }
  },
  created() {
    this.getDetails()
  },
  methods: {
    validate() {
      return new Promise((resolve, reject) => {
        this.$refs.ruleFormRef.validate(valid => {
          if (valid) {
            const authFile = this.$refs.creditAuth.getFileLists
            const creditFile = this.$refs.creditReport.getFileLists

            if (this.operationShow && !creditFile.length) {
              this.$message.warning('请上传征信报告')
              return
            }
            const postData = {
              Loading: true,
              type: 1,
              id: this.ruleForm.id,
              name: this.ruleForm.corporateName,
              cardNo: this.ruleForm.socialCreditCode,
              searchDate: this.ruleForm.searchDate !== '' ? this.ruleForm.searchDate + ' 00:00:00' : '',
              authAddress: authFile.length ? authFile.map(item => item.id)[0] : '',
              creditAddress: creditFile.length ? creditFile.map(item => item.id)[0] : ''
            }
            return resolve(postData)
          } else {
            reject()
            return false
          }
        })
      })
    },

    // 详情
    getDetails() {
      if (this.detailId) {
        creditDetail({ id: this.detailId }).then((res) => {
          if (res.success) {
            this.ruleForm.id = res.data.id
            this.ruleForm.corporateName = res.data.name
            this.ruleForm.socialCreditCode = res.data.cardNo
            this.creditDetails = res.data.creditDetails
            if (this.creditDetails) {
              this.operationShow = false
            } else {
              this.operationShow = true
            }
          } else {
            this.$message.warning(res.msg)
          }
        })
      }
    }

  }
}
</script>

  <style lang="scss" scoped>
  .company-edit {
      .company-form {
      max-height: 58vh;
      overflow: auto;
      .el-form-item {
        margin-bottom: 20px;
        .required-label:before {
          content: '*'!important;
          color: #F56C6C;
          margin-right: 4px;
        }
      }
      .operate {
          cursor: pointer;
          color: #FE7D0B;
        }
    }
  }
  </style>
