<template>
  <div class="h100 font14">
    <van-popup
      id="creditPopup"
      v-model="show"
      closeable
      position="bottom"
      :style="{ height: '100%' }"
      @close="popupClose"
    >
      <van-nav-bar title="资信额度申请"/>

      <form>
        <div class="item">
          <div class="left normal-normal-font">客户信息</div>
          <div
            class="right"
          >{{moreSearchInfo.post.comPartyId}}/({{clientInfo.partyOpcode}}){{clientInfo.clientName}}</div>
        </div>
        <div class="item">
          <div class="left normal-normal-font">
            申请资信额度
          </div>
          <div class="right">
            <van-field v-model="APPLYLIMITS" type="number" placeholder="请输入申请资信额度"/>
          </div>
        </div>
        <div class="item">
          <div class="left normal-normal-font">
            申请周转天数
          </div>
          <div class="right">
            <van-field v-model="APPLYTURNDAYS" type="digit" placeholder="请输入申请周转天数"/>
          </div>
        </div>
        <div class="item">
          <div class="left normal-normal-font">
            承诺回笼日期
            <b>*</b>
          </div>
          <div class="right">
            <van-field v-model="promiseDate"  readonly @click="chooseDate('promiseDate')" placeholder="请选择承诺回笼日期"/>
          </div>
        </div>
        <div class="item">
          <div class="left normal-normal-font">
            申请理由
            <b>*</b>
          </div>
          <div class="right">
            <van-field v-model="APPLYREASON" type="text" placeholder="请输入申请理由"/>
          </div>
        </div>
        <div class="item">
          <div class="left normal-normal-font">
            货款允诺核销日期
          </div>
          <div class="right">
            <van-field v-model="ATTR12" readonly  @click="chooseDate('attr12')" placeholder="请选择货款允诺核销日期"/>
          </div>
        </div>

        <div class="reason">
          <div class="item">
            <van-checkbox class="normal-normal-font" v-model="TP">跳票</van-checkbox>
          </div>
          <div class="item" v-show="TP">
            <div class="right">
              <van-field v-model="TPREASON" type="text" placeholder="跳票原因"/>
              <van-field v-model="TPRESOLVE" type="text" placeholder="跳票解决措施与时间"/>
            </div>
          </div>
          <div class="item" @click="CQHKWH = !CQHKWH">
            <van-checkbox class="normal-normal-font" v-model="CQHKWH">超期贷款未回</van-checkbox>
          </div>
          <div class="item" v-show="CQHKWH">
            <div class="right">
              <van-field v-model="CQHKWHREASON" type="text" placeholder="超期贷款未回原因"/>
              <van-field v-model="CQHKWHRESOLVE" type="text" placeholder="超期贷款未回解决方案"/>
            </div>
          </div>
          <div class="item" @click="CEWCQ = !CEWCQ">
            <van-checkbox class="normal-normal-font" v-model="CEWCQ">超额未超期</van-checkbox>
          </div>
          <div class="item" v-show="CEWCQ">
            <div class="right">
              <van-field v-model="CEWCQREASON1" type="text" placeholder="一次性申请原因"/>
              <van-field v-model="CEWCQREASON2" type="text" placeholder="季节性申请原因"/>
            </div>
          </div>
          
        </div>
        <div class="botton-btn" id="submitBtn">
          <div class="left" @click="consoleApped">取消</div>
          <div class="right" @click="appedCredit">提交</div>
        </div>
      </form>
    </van-popup>
    <van-popup v-model="showTimeDialog" get-container="body" close-icon="close" position="bottom">
      <van-datetime-picker
        v-model="currentDate"
        type="date"
        v-if="showTimeDialog"
        @confirm="confirm"
        @cancel="cancel"
        :formatter="formatter"
      />
    </van-popup>
  </div>
</template>

<script>
import { getFormateDate } from "@/utils/common";
import { YNApplyCreditHttp } from "@/api/clientprofile";
import { Dialog } from "vant";
export default {
  name: "AppedCredit",
  data() {
    return {
      show: false,
      applyLimit: "", //申请额度
      promiseDate: "", //承诺回笼日期
      thisMon: "", //月回收金额
      APPLYLIMITS: "", //申请资信额度
      APPLYTURNDAYS: "", //申请周转天数
      ATTR12: "", //货款允诺核销日期
      APPLYREASON: "", //申请理由
      ATTR12Show: false, //货款允诺核销日期选择框
      TP: false, //跳票
      TPREASON: "", //跳票原因
      TPRESOLVE: "", //跳票解决
      CQHKWH: false, //超期贷款未回
      CQHKWHREASON: "", //超期贷款未回原因
      CQHKWHRESOLVE: "", //超期货款未回解决
      CEWCQ: false, //超额未超期
      CEWCQREASON1: "", //一次性申请原因
      CEWCQREASON2: "", //季节性申请原因
      showTimeDialog: false, //日期选择弹窗
      currentDate: new Date(), //当前日期
      selector: "",
      bpmTestDb: "" //新老接口数据源
    };
  },
  computed: {
    linkInfo() {
      return this.$store.state.linkInfo;
    }
  },
  props: {
    value: {
      type: Boolean,
      default: false
    },
    moreSearchInfo: {
      type: Object,
      default: { post: { comPartyId: "" } }
    },
    clientInfo: {
      type: Object,
      default: {
        partyOpcode: "",
        clientName: ""
      }
    }
  },
  watch: {
    value(val) {
      this.show = val;
    },
    TP(val) {
      if (!val) {
        (this.TPREASON = ""), (this.TPRESOLVE = "");
      }
    },
    CQHKWH(val) {
      if (!val) {
        (this.CQHKWHREASON = ""), (this.CQHKWHRESOLVE = "");
      }
    },
    CEWCQ(val) {
      if (!val) {
        (this.CEWCQREASON1 = ""), (this.CEWCQREASON2 = "");
      }
    }
  },
  methods: {
    // 提交申请
    appedCredit() {
      Dialog.confirm({
        message: "确认提交申请吗？"
      })
        .then(() => {
          let param = {
            attr: {
              INVOWNER: "", //部门id  无  不必填
              COMPARTYID: this.linkInfo.sysOrgId, //erpuserid
              COMCLIENTID: this.moreSearchInfo.post.comPartyId, //客户id
              APPLYDATE: "", //申请时间 无
              SALERID: this.linkInfo.sysUserId, //销售代表id 无  与上面COMPARTYID有什么区别？
              CONTACTTEL: "", //联系电话  无
              APPLIERID: this.linkInfo.sysUserId, //申请人id   给bpm的接口传的是erpuserid  与上面COMPARTYID有什么区别？
              YEARSALEPLAN: "",
              APPLYTURNDAYS: this.APPLYTURNDAYS, //申请天数
              APPLYLIMITS: this.APPLYLIMITS, //申请额度
              APPLYREASON: this.APPLYREASON, //申请理由   可能要加输入文本框
              PROMISERETURN: this.thisMon, //本月承诺回笼金额
              PROMISEDATE: this.promiseDate, //承诺回笼日期  是否是当前时间加上申请天数
              CHECKEDTURNDAYS: "",
              CHECKEDLIMITS: "",
              SUGGESTION: "",
              CHECKERID: "",
              CHECKDATE: "",
              MANAGER1ID: "",
              MANAGER2ID: "",
              MEMO1: "",
              MEMO2: "",
              ATTR1: "", // 医院等级/企业性质
              ATTR2: "",
              ATTR3: "",
              ATTR4: "",
              ATTR5: "",
              ATTR6: "",
              ATTR7: "",
              ATTR8: "",
              ATTR9: "",
              ATTR10: "",
              CREATEDBY: "",
              CREATIONDATE: "",
              LASTUPDATEDBY: "",
              LASTUPDATEDATE: "",
              LASTUPDATELOGIN: "",
              ATTR11: "",
              ATTR12: this.ATTR12,
              TP2: this.TP.toString().toUpperCase(), //是否跳票？？  我们有是否跳票和跳票解决日期
              TPREASON: this.TPREASON,
              TPRESOLVE: this.TPRESOLVE,
              CQHKWH: this.CQHKWH.toString().toUpperCase(), //超期货款未回
              CQHKWHREASON: this.CQHKWHREASON,
              CQHKWHRESOLVE: this.CQHKWHRESOLVE,
              CEWCQ: this.CEWCQ.toString().toUpperCase(), //超额未超期
              CEWCQREASON1: this.CEWCQREASON1,
              CEWCQREASON2: this.CEWCQREASON2,
              AFFIRMAMOUNT: "", //未知参数
              BEGINDATE: "", //开始日期 无
              ENDDATE: "", //结束日期 无
              AFFIRMDAY: "",
              DAYBEGINDATE: "",
              DAYENDDATE: "",
              EXECER: "",
              APPNO: "",
              APPLYNO: "",
              EXECERROR: "",
              EXECFLAG: "",
              APPLIERNAME: this.linkInfo.userName,
              CLIENTCODE: this.moreSearchInfo.post.partyOpcode,
              CLIENTNAME: this.moreSearchInfo.post.partyName,
              DBNAME: this.linkInfo.sysDbSource
            }
          };
          YNApplyCreditHttp(param).then(rt => {
            console.log(rt);
            if (rt.code == 1) {
              if (rt.message.code == 1) {
                this.$toast(rt.message.msg);
                this.consoleApped();
              } else {
                this.$toast(rt.message.msg);
              }
            } else {
              this.$toast("请求失败，请联系管理员！");
            }
          });
        })
        .catch(() => {});
      // 校验
      if (this.APPLYREASON == "货款已回笼尚未核销" && this.ATTR12 == "") {
        Dialog.alert({
          message: "申请理由是货款已回笼尚未核销时货款允诺核销日期不能为空！"
        }).then(() => {
          return;
        });
      }
      if (this.APPLYREASON.trim() == "") {
        Dialog.alert({
          message: "申请理由不能为空！"
        }).then(() => {
          return;
        });
      }
      if (this.promiseDate == "") {
        Dialog.alert({
          message: "承诺回笼日期不能为空！"
        }).then(() => {
          return;
        });
      }
      if (Number(this.APPLYTURNDAYS) < 0) {
        Dialog.alert({
          message: "申请周转天数不能为负数！"
        }).then(() => {
          return;
        });
      }
      if (!this.APPLYLIMITS && !this.APPLYTURNDAYS) {
        Dialog.alert({
          message: "申请资信额度和申请周转天数不能同时为空！"
        }).then(() => {
          return;
        });
      }
      let reg = /^(([1-9][0-9]*)|(([0]\.\d{1,2}|[1-9][0-9]*\.\d{1,2})))$/;
      if (this.APPLYLIMITS && !reg.test(this.APPLYLIMITS)) {
        Dialog.alert({
          message: "申请额度：请输入大于0的整数或保留两位小数"
        }).then(() => {
          this.applyLimit = "";
        });
      }

      if (this.TP && this.TPREASON == "" && this.TPRESOLVE == "") {
        Dialog.alert({
          message: "跳票原因和解决方案不能同时为空！"
        }).then(() => {
          return;
        });
      }
      if (this.CQHKWH && !this.CQHKWHREASON && !this.CQHKWHRESOLVE) {
        Dialog.alert({
          message: "超期货款未回原因和解决方案不能同时为空！"
        }).then(() => {
          return;
        });
      }
      if (this.CEWCQ && !this.CEWCQREASON1 && !this.CEWCQREASON2) {
        Dialog.alert({
          message: "一次性申请原因和季节性申请原因不能同时为空！"
        }).then(() => {
          return;
        });
      }
    },
    // 关闭
    consoleApped() {
      this.APPLYLIMITS = "";
      this.APPLYREASON = "";
      this.APPLYTURNDAYS = "";
      this.ATTR12 = "";
      this.CEWCQ = false;
      this.CEWCQREASON1 = "";
      this.CEWCQREASON2 = "";
      this.CQHKWH = false;
      this.CQHKWHREASON = "";
      this.CQHKWHRESOLVE = "";
      this.TP = false;
      this.TPREASON = "";
      this.TPRESOLVE = "";
      this.promiseDate = "";
      this.show = false;
    },
    // 关闭
    popupClose() {
      this.consoleApped();
      this.$emit("onappedClose", false);
    },
    // 日期选择器相关
    formatter(type, val) {
      if (type === "year") {
        return `${val}年`;
      } else if (type === "month") {
        return `${val}月`;
      } else if (type === "day") {
        return `${val}日`;
      }
      return val;
    },
    confirm(data) {
      if (this.selector == "attr12") {
        this.ATTR12 = getFormateDate(this.currentDate, "yyyy-MM-dd");
      } else if (this.selector == "promiseDate") {
        this.promiseDate = getFormateDate(this.currentDate, "yyyy-MM-dd");
      }
      this.showTimeDialog = false;
    },
    cancel() {
      if (this.selector == "attr12") {
        this.ATTR12 = "";
      } else if (this.selector == "promiseDate") {
        this.promiseDate = "";
      }
      this.showTimeDialog = false;
    },
    chooseDate(type) {
      this.selector = type;
      this.showTimeDialog = true;
    },
    getDataSource() {}
  },
  // 判断公司相应的逻辑
  created() {},
  mounted() {
    // 处理安卓虚拟键盘顶起提交按钮的问题
    let screenHeight = document.body.offsetHeight;
    // 为window绑定resize事件
    window.onresize = function() {
      let nowHeight = document.body.offsetHeight;
      if (nowHeight < screenHeight) {
        // 将底部弹起的按钮隐藏（可使用给按钮添加相应消失类）
        // this.$refs.submitBtn.style.position = 'static'
        if (document.getElementById("submitBtn")) {
          document.getElementById("submitBtn").style.position = "static";
        }
        // document.getElementById('creditPopup').scrollTop = document.body.scrollHeight
      } else {
        // 将按钮正常显示（可使用给按钮移除相应消失类）
        if (document.getElementById("submitBtn")) {
          document.getElementById("submitBtn").style.position = "fixed";
        }
      }
    };
  }
};
</script>

<style lang="scss" scoped>
/deep/ #creditPopup .item .right input {
  text-align: right;
}
/deep/ #creditPopup .reason .item .right input {
  text-align: left;
}
/deep/ #creditPopup textarea {
  border: 1px solid #bcc1cc;
  border-radius: 5px;
}
/deep/ #creditPopup input {
  border: none !important;
}
#creditPopup {
  .van-cell {
    font-size: 14px;
  }
  background-color: $bc2;
  .botton-btn {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 50px;
    .left,
    .right {
      float: left;
      width: 50%;
      line-height: 50px;
      font-size: 16px;
      text-align: center;
      background-color: #fff;
    }
    .right {
      color: white;
      background: linear-gradient(to right, #02baf4 0%, #5341e7 100%);
    }
  }
  .van-nav-bar__title {
    color: $txtBlack;
    font-weight: 600;
    font-size: 15px;
  }
  form {
    height: calc(100vh - 51px);
    overflow: scroll;
    .taps {
      color: red;
    }
    .files {
      margin-bottom: 3px;
      .right {
        .van-icon-close {
          vertical-align: text-top;
          font-weight: 700;
          font-size: 18px;
        }
      }
    }
    .files-top {
      margin-top: 7px;
    }
    .item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-bottom: 0;
      padding: 7px 14px;
      b {
        color: #e96625;
        vertical-align: middle;
      }
      .left {
        flex-shrink: 0;
        width: 150px;
        .van-ellipsis {
          width: 80%;
        }
      }
      .right {
        flex-grow: 1;
        padding-left: 10px;
        text-align: right;
        .van-field {
          padding: 0;
        }
        .van-field {
          text-align: right;
          padding: 3px 14px 3px 0;
          border: 1px solid rgba(188, 193, 204, 1);
          border-radius: 2px;
        }
      }
      .van-checkbox {
        width: 33.333%;
        .van-checkbox__label {
          color: #677282;
          margin-left: 15px;
        }
      }
    }
    .reason {
      padding-bottom: 20px;
      background-color: #fff;
      margin-bottom: 50px;
      .item {
        .right {
          .van-field {
            text-align: right;
            padding: 3px 3px 3px 14px;
            border: 1px solid rgba(188, 193, 204, 1);
            border-radius: 2px;
            margin-bottom: 10px;
          }
        }
      }
    }
  }
}
</style>
