<template>
  <div class="div_page_bg">
    <div class="div_input">
      <van-field v-model="submitForm.approvalResult" :placeholder="placeholder" type="textarea"
                 :autosize="{ minHeight: 100 }"
      />
      <van-uploader
        v-model="fileList"
        multiple
        :max-count="9"
        style="margin-left: 10px"
        preview-size="60px"
        :before-read="beforeRead"
        :after-read="onSubmitFile"
      />
      <div v-if="type == 3">
        <div class="div_divider"></div>
        <van-field v-model="secondContent" placeholder="请输入防水验收意见" type="textarea"
                   :autosize="{ minHeight: 100 }"
        />
        <van-uploader
          v-model="fileSecondList"
          multiple
          :max-count="9"
          style="margin-left: 10px"
          preview-size="60px"
          :before-read="beforeRead"
          :after-read="onSubmitFile"
        />
      </div>

    </div>
    <van-field v-if="showReason" label="驳回原因" :value="submitForm.approvalIllustrate" placeholder="请选择"
               input-align="right" readonly is-link @click="showReasonReject=true"/>


    <van-action-sheet v-model="showReasonReject" :actions="rejectReasonList" @select="onSelectRejectReason"/>
<!--    <van-button type="primary" size="small" style="position: relative" @click="submit">提交</van-button>-->
  </div>

</template>

<script>
  import {
    addDecorationBreakRule,
    addDecorationModifyCheckRecord,
    approvalDecoration, decorationCheckAccept,
    uploadMutiFile
  } from "../../../service/getData";

  import store from '@/store'

  export default {
    name: "decorateOperate",
    data() {
      return {
        type: '', //0-驳回 1-通过 2-新增 3-初验 4-复验 5-整改复查
        decorationId: '',
        breakRuleId: '',
        placeholder: '',
        secondContent: '',
        showReason: false,
        detail: '',
        fileList: [],
        fileSecondList: [],
        rejectReason: '',
        showReasonReject: false,
        rejectReasonList: [
          {name: '信息不全', value: '信息不全'},
          {name: '重复提交', value: '重复提交'},
          {name: '业主原因', value: '业主原因'},
          {name: '其他', value: '其他'},
        ],
        submitForm: {
          userId: localStorage.getItem("userId"),
          approvalIllustrate: "",
          approvalResult: "",
          approvalResultCode: '',
          areaId: '',
          buildingId: '',
          projectId: '',
          roomId: '',
          type: '',
          userName: '',
          fileName: "",
          filePath: "",
          attachementReject:[],
          attachementApprove:[],
        },
        addForm: {
          checkType: "",
          content: "",
          decorateId: "",
          attachementIllegalk: [],
          operateDate: "",
          operators: localStorage.getItem("fullName")
        },
        //初验复验 违规整改
        checkForm: {

          breakRuleId: "",
          checkType: "",
          content: "",   //复验 整改复查内容
          decorateId: "",
          fileName: "",
          filePath: "",
          helpUsers: "",
          operateDate: "",
          operateType: "",
          operators: localStorage.getItem("fullName"),
          basicsContent: "",   //初验第一个内容
          waterproofContent: "", //初验第二个内容
          attachementAbarbeitung:[],//初验第一个文件列表
          attachementFirstCheckBasics:[],//初验第二个文件列表
          attachementFirstCheckWaterproof:[], //复验
          attachementSecondCheck:[], //复验
        }
      }
    },
    beforeRouteLeave(to, from, next) {
      try {
        EbeiPlugins.cleanNavigationRightButton();
        EbeiPlugins.setBackButtonAction('');
      } catch (e) {

      }
      next()
    },
    created() {
      this.type = this.$route.query.type;
      this.decorationId = this.$route.query.decorationId;
      this.breakRuleId = this.$route.query.breakRuleId;
      switch (parseInt(this.type)) {
        case 0:
          this.placeholder = '请输入内容';
          this.showReason = true;
          break;
        case 1:
          this.placeholder = '请输入内容';
          this.showReason = false;
          break;
        case 3:
          this.placeholder = '请输入基础结构外观验收意见';
          this.showReason = false;

          break;
        case 4:
          this.placeholder = '请输入防水验收意见';
          this.showReason = false;
          break;

          break;
        case 2:
          this.placeholder = '请输入违规整改内容';
          this.showReason = false;
          break;
        case 5:
          this.placeholder = '请输入整改复查内容';
          this.showReason = false;
          break;

      }
      try {
        EbeiPlugins.setNavigationRightButtons([{'name': '提交', 'script': 'submit()'}]);
      } catch (e) {

      }
      let that = this;
      window['submit'] = () => {
        that.submit();
      };

    },
    methods: {
      onSelectRejectReason(data) {
        this.showReasonReject = false;
        this.submitForm.approvalIllustrate = data.name;
      },
      submit() {
        switch (this.type + "") {
          case "0":
          case "1":
            this.approvalDecorationJS();
            break;
          case "2":
            this.addDecorationBreakRuleJS();
            break;
          case "3":
          case "4":
            this.decorationCheckAcceptJS();
            break;
          case "5":
            this.addDecorationModifyCheckRecordJS();
            break;

        }
      },
      //违规整改
      addDecorationModifyCheckRecordJS() {
        let that = this;
        this.checkForm.content = this.submitForm.approvalResult;
        this.checkForm.decorateId = this.decorationId;
        this.checkForm.breakRuleId = this.breakRuleId;
        this.checkForm.attachementAbarbeitung = this.generateUploadAttachment(this.fileList);
        this.$toast.loading({
          message: '加载中...',
          duration: 0,
          forbidClick: true
        });
        addDecorationModifyCheckRecord(this.checkForm).then(res => {
          that.$toast.clear()
          if (res.status == 200) {
            that.$toast({
              message: '整改成功',
              position: 'bottom'
            })
            store.commit('REMOVE_INCLUDE_COMPONENT', 'breakRulesListCheck')

            that.$router.go(-1);
          } else {
            that.$toast({
              message: res.message,
              position: 'bottom'
            })
          }
        }).catch(err => {
          that.$toast.clear();
        })
      },
      //初验/复验
      decorationCheckAcceptJS() {
        let that = this;
        this.checkForm.decorateId = this.decorationId;
        if (this.type == 3) {
          this.checkForm.checkType = '1';
          this.checkForm.basicsContent = this.submitForm.approvalResult;
          this.checkForm.attachementFirstCheckBasics = this.generateUploadAttachment(this.fileList);
          this.checkForm.waterproofContent = this.secondContent;
          this.checkForm.attachementFirstCheckWaterproof = this.generateUploadAttachment(this.fileSecondList);
        } else {
          this.checkForm.checkType = '2';
          this.checkForm.content = this.submitForm.approvalResult;
          this.checkForm.attachementSecondCheck = this.generateUploadAttachment(this.fileList);
        }

        this.$toast.loading({
          message: '加载中...',
          duration: 0,
          forbidClick: true
        });
        console.log(this.checkForm);
        decorationCheckAccept(this.checkForm).then(res => {
          that.$toast.clear()
          if (res.status == 200) {
            that.$toast({
              message: '新增成功',
              position: 'bottom'
            })
            localStorage.setItem("shouldRefresh", 'true');
            that.$router.go(-1);
          } else {
            that.$toast({
              message: res.message,
              position: 'bottom'
            })
          }
        }).catch(err => {
          that.$toast.clear();
        })
      },
      //新增违规
      addDecorationBreakRuleJS() {
        let that = this;
        this.addForm.content = this.submitForm.approvalResult;
        this.addForm.decorateId = this.decorationId;
        if (this.addForm.content == '' || this.addForm.content == undefined) {
          this.$toast({
            message: '请输入违规内容',
            position: 'bottom'
          })
          return;
        }
        this.addForm.attachementIllegalk = this.generateUploadAttachment(this.fileList);
        this.$toast.loading({
          message: '加载中...',
          duration: 0,
          forbidClick: true
        });

        addDecorationBreakRule(this.addForm).then(res => {
          that.$toast.clear()
          if (res.status == 200) {
            that.$toast({
              message: '新增成功',
              position: 'bottom'
            })
            localStorage.setItem("shouldRefresh", 'true');
            that.$router.go(-1);
          } else {
            that.$toast({
              message: res.message,
              position: 'bottom'
            })
          }
        }).catch(err => {
          that.$toast.clear();
        })
      },
      //通过/驳回
      approvalDecorationJS() {
        let that = this;
        if (this.type == 0 && (this.submitForm.approvalIllustrate == '' || this.submitForm.approvalIllustrate == undefined)) {
          this.$toast({
            message: '请选择驳回原因',
            position: 'bottom'
          })
          return;
        }
        this.submitForm.approvalResultCode = this.type == 0 ? '1' : '2';
        this.submitForm.decorateId = this.decorationId;
        if (this.type == 0) {
          this.submitForm.attachementReject = this.generateUploadAttachment(this.fileList);
        } else {
          this.submitForm.attachementApprove = this.generateUploadAttachment(this.fileList);
        }
        this.$toast.loading({
          message: '加载中...',
          duration: 0,
          forbidClick: true
        });
        approvalDecoration([this.decorationId], this.submitForm).then(res => {
          this.$toast.clear();
          if (res.status == 200) {
            that.$toast({
              message: '提交成功',
              position: 'bottom'
            })
            localStorage.setItem("shouldRefresh", 'true');
            that.$router.go(-1);
          }
        }).catch(err => {
          that.$toast.clear();
        })
      },
      //生成提交文件name和path 逗号隔开
      generateFile() {
        if (this.fileList.length > 0) {
          let fileName = '';
          let filePath = '';
          this.fileList.forEach(data => {
            fileName += data.fileName + ',';
            filePath += data.filePath + ',';
          })
          fileName = fileName.substr(0, fileName.length - 1);
          filePath = filePath.substr(0, filePath.length - 1);
          this.addForm.fileName = fileName;
          this.addForm.filePath = filePath;
        }
      },
      //生成提交文件json
      generateUploadAttachment(fileList) {
        let attachments = [];
        fileList.forEach(data => {
          let attachment = {
            fileDetailType: "",
            resPath: data.filePath,
            fileName: data.fileId,
            fullName: data.fileName
          }
          attachments.push(attachment)
        })
        return attachments;
      },

      //
      beforeRead(file) {
        this.$toast.loading({
          message: '上传图片中...',
          duration: 0,
          forbidClick: true
        });
        return true;
      },
      //提交文件
      onSubmitFile(file) {
        console.log(file)
        this.$toast.clear();
        let that = this;
        let formData = new FormData();
        formData.append('file', file.file);
        uploadMutiFile(formData).then(res => {
          if (res.result == 1) {
            file.fileId = res.fileInfo.fid;
            file.fileName = res.fileInfo.fName;
            file.filePath = res.fileInfo.resPath;
          }
        }).catch(err => {

        })
      },
    }
  }
</script>

<style scoped>
  .div_page_bg {
    width: 100%;
    height: 100vh;
    background-color: rgba(252, 252, 252, 1);
  }

  .div_divider {
    width: 100%;
    height: 10px;
    background-color: rgba(252, 252, 252, 1);
  }

  .div_input {
    background-color: white;

  }

  .div_input::after {
    position: absolute;
    box-sizing: border-box;
    content: ' ';
    pointer-events: none;
    right: 0;
    bottom: 0;
    left: 16px;
    border-bottom: 1px solid #ebedf0;
    -webkit-transform: scaleY(.5);
    transform: scaleY(.5);
  }

  .div_input /deep/ .van-cell {
    background-color: #00000000;
  }

  .div_input /deep/ .van-cell:not(:last-child)::after {
    border-bottom: 0;
  }

  .div_input /deep/ .van-cell ::-webkit-input-placeholder {
    color: rgba(183, 183, 183, 1);
  }
</style>
