<script>
import {downFileBase64, editVerifyTask, uploadFile} from "@/api/commitment";
import {v4 as uuidv4} from "uuid";
import CommitmentConfirmForm from "@/subPages/pages/commitment/components/commitmentConfirmForm/index.vue";

export default {
  name: "IndicatorComponents",
  components: {CommitmentConfirmForm},
  computed: {
    indicatorList() {
      return this.$store.state.template.indicatorList
    },
  },
  watch: {
    indicatorList: {
      handler(value) {
        if (value && value.length > 0 && !this.formStatesInitFlag) {
          value.forEach((indicatorItem) => {
            this.$nextTick(() => {
              this.$set(this.formStates, indicatorItem.uuid, {
                ...indicatorItem,
                auditResult: this.checkResultColumns.find(item => item.value === indicatorItem.auditResult) && this.checkResultColumns.find(item => item.value === indicatorItem.auditResult).text,
                auditScore: this.checkGoalColumns.find(item => item.value === indicatorItem.auditScore) && this.checkGoalColumns.find(item => item.value === indicatorItem.auditScore).text,
                fileList: indicatorItem.expandStr ? indicatorItem.expandStr.split(',').map(item => {
                  return {
                    uuid: item
                  }
                }) : []
              })
            })
          })
          this.formStatesInitFlag = true
        }
      },
      immediate: true,
      deep: true
    },
    "$route.query.uuid": {
        handler(value) {
          if(value) {
            this.formStatesInitFlag = false
          }
        },
        deep: true
      }
  },
  data() {
    return {
      //表单状态初始化标志
      formStatesInitFlag: false,
      formStates: {},
      checkResultColumns: [
        {
          text: '整改',
          value: 1
        },
        {
          text: '整改扣分',
          value: 2
        },
        {
          text: '符合',
          value: 0
        }
      ],
      checkGoalColumns: [
        {
          text: '整改 0分',
          value: 0
        },
        {
          text: '整改扣分 -10分',
          value: -10
        },
        {
          text: '符合',
          value: 0
        }
      ],
      checkResultPopupVisible: false,
      checkScorePopupVisible: false,
    }
  },
  methods: {
    onCheckResultSubmit(indicateItem) {
      editVerifyTask([
        {
          uuid: indicateItem.uuid,
          promiseId: indicateItem.promiseId,
          indicatorId: indicateItem.indicatorId,
          indicatorInput: indicateItem.indicatorInput,
          indicatorInputBody: indicateItem.indicatorInputBody,
          auditor: uni.getStorageSync("userInfo").realName,
          auditResult: this.checkResultColumns.find(item => item.text === this.formStates[indicateItem.uuid].auditResult) && this.checkResultColumns.find(item => item.text === this.formStates[indicateItem.uuid].auditResult).value,
          auditScore: this.checkGoalColumns.find(item => item.text === this.formStates[indicateItem.uuid].auditScore) && this.checkGoalColumns.find(item => item.text === this.formStates[indicateItem.uuid].auditScore).value,
          auditRemark: this.formStates[indicateItem.uuid].auditRemark,
          //文件上传字段
          expandStr: this.formStates[indicateItem.uuid].fileList.map(item => item.uuid).join(','),
          isDelete: 0
        }
      ]).then(res => {
        if (res.code === 0) {
          this.$toast('核查成功')
          this.formStatesInitFlag = false
          this.$store.dispatch('template/getPromiseDetail',this.$route.query.uuid)
        }else {
          this.$toast('核查失败' + res.msg)
        }
      })
    },
    /* 附件下载 */
    handleFileDown(item) {
      downFileBase64({
        uuid: item
      }).then(res => {
        if (res.code === 0) {
          const a = document.createElement('a')
          a.href = res.data
          a.download = '附件'
          a.click()
        }
      })
    }
  }
}
</script>

<template>
  <view>
    <view v-for="(item,index) in indicatorList" :key="index" class="indicator-style">
      <view class="indicator-body">
        {{ item.indicatorInputBody.replace('&', item.inputBody + item.inputSegment) }}
      </view>
      <view class="title">监管核查
        <view>涉及整改、整改扣分结果，需要走审批二次确认</view>
      </view>
      <van-divider/>
      <CommitmentConfirmForm v-if="item.auditResult === 3"
                             v-model="formStates[item.uuid]">
        <template #footer>
          <view style="margin: 16px;">
            <van-button round block type="info" @click="onCheckResultSubmit(item)">核查确认</van-button>
          </view>
        </template>
      </CommitmentConfirmForm>
      <view v-else>
        <view class="other-title">
          监管核查
          <view style="color: #15BE50" v-if="item.approvalStatus === 0">
            审批状态：待审批
          </view>
          <view style="color: #15BE50" v-if="item.approvalStatus === 1">
            审批状态：已通过
          </view>
          <view style="color: #D40000" v-if="item.approvalStatus === 2">
            审批状态：已拒绝
          </view>
        </view>
        <van-divider/>
        <van-form v-if="formStates[item.uuid]">
          <!--核查结果-->
          <van-field
              name="auditResult"
              label="核查结果"
          >
            <template #input>
              <view v-if="item.auditResult === 0">符合</view>
              <view v-if="item.auditResult === 1">整改</view>
              <view v-if="item.auditResult === 2">整改扣分</view>
            </template>
          </van-field>
          <!--核查得分-->
          <van-field
              name="auditScore"
              label="核查得分"
          >
            <template #input>
              <view v-if="item.auditResult === 0 && item.auditScore === 0">符合</view>
              <view v-if="item.auditResult === 1 && item.auditScore === 0">整改 0分</view>
              <view v-if="item.auditResult === 2 && item.auditScore === -10">整改扣分 -10分</view>
            </template>
          </van-field>
          <!--核查说明-->
          <van-field
              name="auditRemark"
              label="核查说明"
          >
            <template #input>
              <view>{{ item.auditRemark }}</view>
            </template>
          </van-field>
          <van-field
              name="expandStr"
              label="附件"
          >
            <template #input>
              <view v-if="item.expandStr" class="file-style">
                <view v-for="(item,index) in item.expandStr.split(',')" @click="handleFileDown(item)" :key="index">
                  附件{{ index + 1 }}
                </view>
              </view>
            </template>
          </van-field>
        </van-form>
      </view>
    </view>
  </view>
</template>

<style scoped lang="scss">
.indicator-style {
  min-height: 40px;
  border: 1px solid #e8e8e8;
  margin: 10px 0;
  padding: 5px
}

.indicator-body {
  background: #F6F6F6;
  border-radius: 4px;
  font-weight: 400;
  font-size: 15px;
  color: #666666;
  text-align: justify;
  padding: 5px;
  min-height: 40px;
}

.title {
  font-size: 14px;
  font-weight: bold;
  color: #333;
  margin-top: 10px;

  view {
    color: #FF6B00;
    font-size: 12px;
    margin-top: 5px;
  }
}

.upload-description {
  font-weight: 400;
  font-size: 14px;
  color: #666666;
}

.upload-files {
  display: flex;
  flex-direction: column;
}

.other-title {
  font-size: 14px;
  font-weight: bold;
  color: #333;
  margin-top: 10px;
  display: flex;
  justify-content: space-between;

  view {
    font-size: 12px;
  }
}

.file-style {
  font-size: 14px;
  font-weight: 400;
  color: #1492FF;
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  cursor: pointer;
}
</style>