<template>
  <div class="page">
    <el-form label-width="170px"
             label-suffix=":"
             class="input-form model"
             size="small">
      <el-form-item label="幼儿园名称">
        <div class="d-inline-block">
          <el-input v-model="form.companyName"
                    disabled />
        </div>
      </el-form-item>
      <el-form-item label="统一社会信用代码">
        <div class="d-inline-block">
          <el-input disabled
                    v-model="form.creditCode" />
        </div>
      </el-form-item>
      <el-form-item label="法人">
        <div class="d-inline-block">
          <el-input disabled
                    v-model="form.legalPerson" />
        </div>
      </el-form-item>
      <el-form-item label="营业执照">
        <img v-if="form.businessLicensePicture"
             class="pic"
             :src="form.businessLicensePicture"
             alt="">
      </el-form-item>
      <el-form-item label="办学许可证件">
        <img v-if="form.licenseForRunningSchool"
             class="pic"
             :src="form.licenseForRunningSchool"
             alt="">
      </el-form-item>
      <div class="aline"></div>

      <div class="info">
        <div class="field">
          <label>申请人</label>
          <p class="val">{{ form.account }}</p>
        </div>
        <div class="field">
          <label>联系方式</label>
          <p class="val">{{ form.contactInformation }}</p>
        </div>
        <div class="field">
          <label>提交时间</label>
          <p class="val">{{ form.submitTime }}</p>
        </div>
      </div>
    </el-form>

    <div class="btns">
      <el-button type="primary"
                 @click="confirmSubmit(2)">通过</el-button>
      <el-button type="danger"
                 @click="confirmSubmit(3)">不通过</el-button>
      <el-button @click="$router.back()">返回</el-button>
    </div>

    <el-dialog title="请填写审批意见"
               :visible.sync="auditVisible"
               width="450px">
      <el-input type="textarea"
                :rows="2"
                v-model="remark" />
      <span slot="footer"
            class="dialog-footer">
        <el-button @click="auditVisible = false">取 消</el-button>
        <el-button type="primary"
                   @click="submit(3)">确 定</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import Util from "@/libs/util";
import Setting from "@/setting";
export default {
  data () {
    return {
      id: this.$route.query.id,
      form: {},
      remark: '',
      submiting: false,
      auditVisible: false
    };
  },
  mounted () {
    this.$store.commit('user/setCrumbs', [
      {
        name: '幼儿园管理',
        route: '/preschool'
      },
      {
        name: '幼儿园审核'
      },
    ])
    this.getData()
  },
  methods: {
    getData () {
      const { id } = this
      id && this.$post(`${this.api.enterpriseCertificationDetails}?id=${id}`).then(({ data }) => {
        this.form = data
      }).catch(err => { })
    },
    // 提交前判断
    confirmSubmit (auditStatus) {
      // 通过：直接提交，不通过：弹框填写意见
      if (auditStatus === 2) {
        this.submit(2)
      } else {
        this.auditVisible = true
      }
    },
    // 提交
    async submit (auditStatus) {
      if (this.submiting) return false
      this.submiting = true
      try {
        await this.$post(`${this.api.informationAudit}?auditStatus=${auditStatus}&id=${this.id}&openId=${this.form.openId}&remark=${this.remark}`).then(res => {
          this.$router.back()
          Util.successMsg('审核成功！');
        })
      } catch (e) {
        this.submiting = true
      }
    },
  }
};
</script>

<style scoped lang="scss">
.pic {
    max-width: 500px;
}
.info {
    .field {
        display: flex;
        justify-content: space-between;
        width: 470px;
        margin: 10px 0;
    }
    label {
        font-size: 14px;
    }
    .val {
        font-size: 15px;
        font-weight: 600;
        color: #333;
    }
}
</style>