<template>
  <div class="eibs-tab">
    <c-col :span="24" style="padding-top: 20px">
      <!-- ========================左边======================== -->
      <c-col :span="12" style="padding-right: 20px">
        <c-col :span="24">
          <el-form-item label="Available with" prop="lidgrp.rec.avbwth">
            <c-select
              disabled
              v-model="model.lidgrp.rec.avbwth"
              style="width: 100%"
              placeholder="请选择"
              dbCode="avbwth"
              :filterKey="['A', 'C', 'I', 'O', 'S']"
              @change="onAvbwthChange">
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="24" class="fieldName" v-if="model.lidgrp.rec.avbwth != 'O'">
          <c-ptap
            :argadr="{ title: '', grp: 'lidgrp', rol: 'avb' }"
            :haveAdrLabel="true"
            :isAdrblk="true"
            :model="model"
            bchinr="00000036"
            ptytyp="B"
            :disabledExtkey="true"
            disabled
            :disabledRef="true"
            :isLabel120="false"></c-ptap>
        </c-col>

        <c-col :span="24" v-if="model.lidgrp.rec.avbwth == 'O'">
          <el-form-item label="Available in" prop="lidgrp.blk.avbwthtxt">
            <c-input
              disabled
              type="textarea"
              v-model="model.lidgrp.blk.avbwthtxt"
              maxlength="135"
              :rows="4"
              show-word-limit
              placeholder="请输入Available in"></c-input>
          </el-form-item>
        </c-col>

        <c-col :span="12">
          <el-form-item label="Available by" prop="lidgrp.rec.avbby">
            <c-select
              disabled
              v-model="model.lidgrp.rec.avbby"
              style="width: 100%"
              placeholder="请选择兑付方式"
              dbCode="avbby0"
              @change="onAvbbyChange">
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="12">
          <el-form-item label="Tenor day" prop="lidgrp.rec.tenmaxday">
            <c-input
              disabled
              v-model.number="model.lidgrp.rec.tenmaxday"
              placeholder="请输入天数"
              maxlength="3"></c-input>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="Negotiation/Deferred Payment Details" prop="lidgrp.blk.defdet">
            <c-input
              disabled
              type="textarea"
              v-model="model.lidgrp.blk.defdet"
              maxlength="140"
              :rows="2"
              show-word-limit
              placeholder="请输入指示内容"></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="Mixed Payment Details" prop="lidgrp.blk.mixdet">
            <c-input
              type="textarea"
              v-model="model.lidgrp.blk.mixdet"
              maxlength="130"
              :rows="2"
              show-word-limit
              placeholder="请输入混合付款指示"
              disabled></c-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <c-ptap-commons
            :cols="35"
            :rows="3"
            :minRows="2"
            :maxRows="2"
            :model="model"
            :disabledButton="true"
            :extCodes="['lidgrp', 'blk']"
            lastModel="dftat"
            title="Drafts at">
          </c-ptap-commons>
        </c-col>

        <c-col :span="24" class="fieldName">
          <c-ptap
            disabled
            :disabledRef="true"
            :disabledExtkey="true"
            :disabledDetailTrn="true"
            :disabledAdrblk="true"
            :argadr="{ title: 'Drawee', grp: 'lidgrp', rol: 'drw' }"
            :haveAdrLabel="true"
            :isAdrblk="true"
            :model="model"
            bchinr="00000036"
            ptytyp="B,C"
            :isLabel120="false"></c-ptap>
        </c-col>
      </c-col>

      <!-- ========================右边======================== -->
      <c-col :span="12" style="padding-left: 20px">
        <c-col :span="24">
          <el-form-item label="" label-width="30px" style="margin-bottom: 0px !important">
            <span style="font-family: Helvetica, sans-serif; font-size: 12px"
              >Place of taking in Charge/Dispatch from/Place of Receipt(44A)</span
            >
          </el-form-item>
        </c-col>
        <c-col :span="20">
          <el-form-item label="" label-width="30px" prop="lidgrp.rec.shpfro" style="margin-bottom: 0px !important">
            <c-mul-row-input
              disabled
              type="textarea"
              v-model="model.lidgrp.rec.shpfro"
              :rows="65"
              :cols="30"
              :autosize="{ minRows: 2, maxRows: 2 }"
              show-word-limit
              :charmod="3"
              placeholder="请输入装船/发运地"></c-mul-row-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="" label-width="30px" style="margin-bottom: 0px !important; margin-top: 20px">
            <span style="font-family: Helvetica, sans-serif; font-size: 12px"
              >Port of Loading/Airport of Departure(44E)</span
            >
          </el-form-item>
        </c-col>
        <c-col :span="20">
          <el-form-item label="" label-width="30px" prop="lidgrp.rec.porloa" style="margin-bottom: 0px !important">
            <c-mul-row-input
              disabled
              type="textarea"
              v-model="model.lidgrp.rec.porloa"
              :rows="65"
              :cols="30"
              :autosize="{ minRows: 2, maxRows: 2 }"
              show-word-limit
              :charmod="3"
              placeholder="请输入始发（航空）站"></c-mul-row-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="" label-width="30px" style="margin-bottom: 0px !important; margin-top: 20px">
            <span style="font-family: Helvetica, sans-serif; font-size: 12px"
              >Port of Discharge/Airport of Destination(44F)</span
            >
          </el-form-item>
        </c-col>
        <c-col :span="20">
          <el-form-item label="" label-width="30px" prop="lidgrp.rec.pordis" style="margin-bottom: 0px !important">
            <c-mul-row-input
              disabled
              type="textarea"
              v-model="model.lidgrp.rec.pordis"
              :rows="65"
              :cols="30"
              :autosize="{ minRows: 2, maxRows: 2 }"
              show-word-limit
              :charmod="3"
              placeholder="请输入终点（航空）站"></c-mul-row-input>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="" label-width="30px" style="margin-bottom: 0px !important; margin-top: 20px">
            <span style="font-family: Helvetica, sans-serif; font-size: 12px"
              >Place of Final Destination/For Transportation to/Place of Delivery(44B)</span
            >
          </el-form-item>
        </c-col>
        <c-col :span="20">
          <el-form-item label="" label-width="30px" prop="lidgrp.rec.shpto">
            <c-mul-row-input
              disabled
              type="textarea"
              v-model="model.lidgrp.rec.shpto"
              :rows="65"
              :cols="30"
              :autosize="{ minRows: 2, maxRows: 2 }"
              show-word-limit
              :charmod="3"
              placeholder="请输入最终目的地"></c-mul-row-input>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="" label-width="30px" style="margin-bottom: 0px !important; margin-top: 20px">
            <span style="font-family: Helvetica, sans-serif; font-size: 12px">适用业务类型</span>
          </el-form-item>
        </c-col>
        <c-col :span="20">
          <el-form-item label="" label-width="30px" prop="appbt">
            <c-select disabled v-model="model.appbt" style="width: 100%" placeholder="请选择" :code="apptp"> </c-select>
          </el-form-item>
        </c-col>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import event from "../event";
import Pts from "~/components/business/commonModel/Pts.js";
import { cloneDeep } from "lodash";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess, event],
  data() {
    return {
      disabledExtkey: false,
      avbDisabled: false,
      drwDisabledAll: false,
      dbCodes: {
        avbwth: [],
      },
    };
  },
  methods: {
    getCodeTableValue(value, codenam) {
      const codeobj = this.dbCodes[codenam].find((obj) => obj.value === value);
      return codeobj ? codeobj.label : value;
    },
    onAvbwthChange() {
      // 1.控制是否可输入
      let val = this.model.lidgrp.rec.avbwth;
      //Issuing Bank
      if (val == "I") {
        this.avbDisabled = true;
        this.disabledExtkey = false;
      } else if (val == "A" || val == "C") {
        //Advising Bank
        //Confirming Bank
        this.avbDisabled = true;
        this.disabledExtkey = true;
      } else {
        this.avbDisabled = false;
        this.disabledExtkey = false;
      }
      if (val == "O" && (this.model.lidgrp.blk.avbwthtxt == null || this.model.lidgrp.blk.avbwthtxt == "")) {
        let value = this.getCodeTableValue("O", "avbwth");
        this.model.lidgrp.blk.avbwthtxt = value;
      }
      // 2.填充字段
      // 先将原有数据清空
      this.model.lidgrp.avb.pts = new Pts().data;
      let ptsList = [];
      ptsList.push(this.model.lidgrp.adv);
      ptsList.push(this.model.lidgrp.cmb);
      ptsList.push(this.model.lidgrp.rmb);
      ptsList.push(this.model.litp.own);
      let rol = "";
      if ("A" == this.model.lidgrp.rec.avbwth) {
        rol = "ADV";
      } else if ("C" == this.model.lidgrp.rec.avbwth) {
        rol = "CMB";
      } else if ("R" == this.model.lidgrp.rec.avbwth) {
        rol = "RMB";
      } else if ("I" == this.model.lidgrp.rec.avbwth) {
        rol = "OWN";
      }
      let res = ptsList.find((item) => item.pts.rol == rol);
      if (res != null && res != "") {
        let newRes = cloneDeep(res);
        this.model.lidgrp.avb = newRes;
        this.model.lidgrp.avb.pts.rol = "AVB";
      }
    },
    onAvbbyChange() {
      let val = this.model.lidgrp.rec.avbby;
      if (val == "D") {
        this.model.lidgrp.blk.mixdet = "";
        this.drwDisabledAll = true;
        this.model.lidgrp.blk.defdet = "days after B/L date";
        this.model.lidgrp.blk.dftat = "";
      } else if (val == "N") {
        this.model.lidgrp.blk.mixdet = "";
        this.drwDisabledAll = false;
        this.model.lidgrp.blk.defdet = "days after B/L date";
        this.model.lidgrp.blk.dftat = "Sight for 100PCT of Invoice Value";
      } else if (val == "P") {
        this.model.lidgrp.blk.mixdet = "";
        this.drwDisabledAll = false;
        this.model.lidgrp.rec.tenmaxday = "0";
        this.model.lidgrp.blk.defdet = "";
        this.model.lidgrp.blk.dftat = "";
      } else if (val == "M") {
        this.drwDisabledAll = true;
        this.model.lidgrp.blk.defdet = "";
        this.model.lidgrp.blk.dftat = "";
      } else if (val == "A") {
        this.model.lidgrp.blk.mixdet = "";
        this.drwDisabledAll = false;
        this.model.lidgrp.blk.defdet = "";
        if (this.model.lidgrp.rec.cnfdet == "C" || this.model.lidgrp.rec.cnfdet == "W") {
          this.model.lidgrp.blk.dftat = "Days after sight for 100PCT of Invoice Value ";
        } else {
          this.model.lidgrp.blk.dftat = "";
        }
      }

      if (this.drwDisabledAll) {
        this.model.lidgrp.drw.pts.extkey = "";
        this.model.lidgrp.drw.pts.adrblk = "";
        this.model.lidgrp.drw.pts.nam = "";
        this.model.lidgrp.drw.pts.ptainr = "";
        this.model.lidgrp.drw.pts.ptyinr = "";
        this.model.lidgrp.drw.pts.rol = "";
      }
    },
  },
  created: function () {},
};
</script>
<style>
.marginLable {
  padding-left: 160px;
}
.custom-label {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: inline-block;
  width: 100%;
}
</style>