<template>
  <div class="checkResultDetail">
    <headNav :title="'责令改正通知'"></headNav>

    <div class="content">
      <div class="detail">
        <van-cell is-link @click="correct_immedia(1)">
          <template #title>
            <div>部分检查情况异常，责令立即改正</div>
          </template>
          <template #default>
            <div class="FontColorOther fb" v-if="!hasData.IMMEDIATELY">无需下发</div>
            <div class="FontColorError fb" v-else-if="!(formData && formData.immediately_file_id)">未下发</div>
            <!--          <div class="FontColorError fb" v-else >未下发</div>-->
            <!--          <div class="FontColorOther fb" v-if="item.isSend">已下发</div>-->
            <div class="FontColorOther fb" v-else>已下发</div>
          </template>
        </van-cell>
        <div class="content10">
          <div class="mb10">《责令立即改正通知》</div>
        </div>
      </div>
      <div class="detail">
        <van-cell is-link @click="correct_immedia(2)">
          <template #title>
            <div>部分检查情况异常，责令限期改正</div>
          </template>
          <template #default>
            <div class="FontColorOther fb" v-if="!hasData.DEADLINE">无需下发</div>
            <!-- NOT-未下发 AUDIT-待审批 SENDED-已下发（审批通过）REJECT-被驳回 -->
            <div class="FontColorOther fb" v-else-if="formData.notification_audit_status =='AUDIT'">待审批</div>
            <div class="FontColorOther fb" v-else-if="formData.notification_audit_status =='SENDED'">已下发</div>
            <div class="FontColorOther fb" v-else-if="formData.notification_audit_status =='REJECT'">被驳回</div>
            <!-- <div class="FontColorError fb" v-else-if="!(formData && formData.deadline_file_id)">未下发</div> -->
            <div class="FontColorError fb" v-else>未下发</div>
          </template>
        </van-cell>
        <div class="content10" v-if="formData.notification_audit_status =='REJECT'">
          <div class="mb10">&nbsp;&nbsp;驳回原因：{{formData.deadline_job_reason}}</div>
        </div>
        <div class="content10">
          <div class="mb10">《责令限期改正通知》</div>
          <!--        <div class="mr10" v-if="item.isSend">{{ item.sendTime }}</div>-->
        </div>
      </div>

      <div class="btn" v-if="showFinishBtn">
        <van-button type="info" @click="finishJob">完成任务</van-button>
      </div>
      <div class="qrContent">
        <div class="qrItem" v-if="formData.immediately_file_id">
          <span>责令立即改正通知地址</span>
          <qrCode :url="getImmediatelySrc"/>
        </div>
        <div class="qrItem" v-if="formData.deadline_file_id">
          <span>责令限期改正通知地址</span>
          <qrCode :url="getDeadlineSrc"/>
        </div>
      </div>
    </div>
    <v-mask :showOverLay="showOverLay" tipMsg="加载中..."></v-mask>
  </div>
</template>

<script>
import headNav from '@/components/headNav.vue';
import {get, post, put} from '@/utils/http.js';
import mask_overLay from '@/components/overLay_xy.vue';
import qrCode from '@/components/qrCode.vue';
import { handleProblemImgs } from '@/utils/index';

export default {
  name: 'checkResultDetail',
  components: {
    headNav,
    'v-mask': mask_overLay,
    qrCode
  },
  computed: {
    dailyId() {
      return this.$route.params.currentID
    },
    hasData() { // 有立即改正数据
      let tmpValues = (this.formData.check_nodes || []).map(item => {
        if (item && Array.isArray(item.items)) {
          return item.items
        }
        return null
      }).flat().filter(Boolean)
      return {
        IMMEDIATELY: !!tmpValues.find(item => item.check_result == 2 && item.correct_type == 'IMMEDIATELY'),
        DEADLINE: !!tmpValues.find(item => item.check_result == 2 && item.correct_type == 'DEADLINE')
      }
    },
    showFinishBtn() {
      const flag1 = this.formData.job_status !== 'ARCHIVED';
      const flag2 =  (!this.hasData.IMMEDIATELY || (this.hasData.IMMEDIATELY && this.formData.immediately_file_id > 0));
      const flag3 = !this.hasData.DEADLINE || (this.hasData.DEADLINE && this.formData.notification_audit_status == 'SENDED');
      return flag1 && flag2 && flag3;
    },
    getDeadlineSrc() {  // 限期整改路径
      return handleProblemImgs(this.formData.deadline_file_id);
    },
    getImmediatelySrc() {
      return handleProblemImgs(this.formData.immediately_file_id);
    },
  },
  mounted() {
    this.init();
  },
  data() {
    return {
      isReportCheck: false,
      checkStatus: '',
      showOverLay: false,
      formData: {},
    };
  },
  methods: {
    // 初始化
    init() {
      this.showOverLay = true;
      this.$http.get(`/v2/api/enforce-job/${this.dailyId}`).then(async res => {
        if (res && res.data && res.data.check_nodes) {
          const obj = res.data
          this.formData = res.data
          setTimeout(() => {
            this.showOverLay = false;
          }, 1000);
        }
      })
    },
    // 完成任务
    async finishJob() {
      await put(`/v2/api/enforce-job/${this.dailyId}`, {
        id: this.dailyId,
        job_status: 'ARCHIVED',
        finish_time: new Date()
      }).then((res) => {
        this.$toast.success('归档成功！');
        if (this.formData.job_type == 'NORMAL') {
          this.$router.replace('/dailyMissionList');
        }
        else if (this.formData.job_type == 'SPECIAL') {
          this.$router.replace('/special');
        }
        else if (this.formData.job_type == 'REPORT') {
          this.$router.replace('/reportList');
        }
        else if (this.formData.job_type == 'TOWNS') {
          this.$router.replace('/town');
        }
        else if (this.formData.job_type == 'OTHER') {
          this.$router.replace('/otherList');
        }
      }).catch(() => {
        this.$toast.fail("归档失败！");
      });
    },

    backPage() {
      this.$router.go(-1);
    },

    // 责令立即改正
    correct_immedia(type) {
      if (type == '1') { // 立即改正
        if (!this.hasData.IMMEDIATELY) {
          return
        }
        if (this.formData.immediately_file_id) {
          let url = this.getImmediatelySrc;
          this.$router.push({
              name: 'pdf',
              params: {
                  url,
                  title: '责令立即改正通知'
              }
          })
        }
        else {
          this.$router.push(`/correctImmediately/${this.$route.params.currentID}`)
        }
      } else {
        if (!this.hasData.DEADLINE) {
          return
        }
        const status = this.formData && this.formData.notification_audit_status || '';
        if ((status == 'AUDIT' || status == 'SENDED') && this.formData.deadline_file_id) {
          let url = this.getDeadlineSrc;
          this.$router.push({
              name: 'pdf',
              params: {
                  url,
                  title: '责令限期改正通知'
              }
          })
        }
        else {
          this.$router.push(`/correctDeadline/${this.$route.params.currentID}`);
        }
      }
    }
  }
};
</script>

<style lang="scss" scoped>
.checkResultDetail {
  font-size: 14px;

  .qrContent {
    display: flex;
    justify-content: center;

    .qrItem {
      display: flex;
      flex-direction: column;
      align-items: center;
      margin: 10px;
    }
  }

  .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 20px 0;
    // width: 100%;

    button {
      height: 36px;
      // width: 100px;
      flex: 1;
      margin: 0 15px;
    }
  }

  .detail {
    // margin: 0 10px;
    margin-top: 10px;
    border: 1px solid #dfdfdf;

    .content10 {
      background-color: #fff;
      display: flex;
      justify-content: space-between;
      padding: 5px 10px;
      font-size: 12px;
      color: #aaa;
    }
  }
  .detail:first-child {
    margin-top: 57px;
  }
}
</style>

<style lang="scss">
.checkResultDetail {
  .van-cell.van-cell--clickable {
    &::after {
      border: none;
    }
  }

  .van-cell__title {
    flex: 4;
  }
}
</style>
