<template>
  <div class="eibs">
    <!-- ==================================左 =============================================-->
    <el-col :span="12" style="padding-right: 20px">
      <c-col :span="24">
        <el-form-item label="信用证编号" prop="lidgrp.rec.ownref">
          <c-fullbox>
            <c-input
              disabled
              v-model="model.lidgrp.rec.ownref"
              maxlength="16"
              placeholder="请输入信用证编号"
            ></c-input>
            <template slot="footer">
              <c-button
                size="small"
                style="margin-left: 10px; padding: 0 10px"
                type="primary"
                @click="onSeainf"
              >
                <i class="el-icon-info"></i>
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="9">
        <el-form-item label="信用证名义金额" prop="lidgrp.cbs.nom1.cur">
          <c-input
            disabled
            v-model="model.lidgrp.cbs.nom1.cur"
            style="width: 100%"
            placeholder="请选择信用证金额"
          >
          </c-input>
        </el-form-item>
      </c-col>

      <c-col :span="10">
        <el-form-item label="" label-width="10px" prop="lidgrp.cbs.nom1.amt">
          <c-input
            disabled
            v-model="model.lidgrp.cbs.nom1.amt"
            placeholder="请输入信用证金额"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="5">
        <c-checkbox disabled v-model="model.brtp.aammod.addamtflg"
          >附加金额</c-checkbox
        >
      </c-col>

      <c-col :span="9">
        <el-form-item label="信用证开立金额" prop="lidgrp.cbs.opn1.cur">
          <c-input
            disabled
            v-model="model.lidgrp.cbs.opn1.cur"
            maxlength="3"
            placeholder="请输入信用证余额"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="10">
        <el-form-item label="" label-width="10px" prop="lidgrp.cbs.opn1.amt">
          <c-input
            disabled
            v-model="model.lidgrp.cbs.opn1.amt"
            placeholder="请输入金额"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="5">
        <c-checkbox disabled v-model="model.lidgrp.rec.revflg"
          >循环信用证</c-checkbox
        >
      </c-col>
      <c-col :span="24">
        <el-form-item label="可用银行" prop="lidgrp.avbnam">
          <c-input
            disabled
            v-model="model.lidgrp.avbnam"
            maxlength="40"
            placeholder="请输入可用银行"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="19">
        <el-form-item label="兑付方式" prop="lidgrp.rec.avbby">
          <c-select
            disabled
            :code="codes.avbby"
            v-model="model.lidgrp.rec.avbby"
            style="width: 100%"
            placeholder="请选择兑付方式"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="5">
        <c-checkbox disabled v-model="model.lidgrp.rec.redclsflg"
          >红/绿条款</c-checkbox
        >
      </c-col>

      <c-col :span="12">
        <el-form-item label="开证日期" prop="lidgrp.rec.opndat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.lidgrp.rec.opndat"
            style="width: 100%"
            placeholder="请选择开证日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="最迟装船日期" prop="lidgrp.rec.shpdat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.lidgrp.rec.shpdat"
            style="width: 100%"
            placeholder="请选择最迟装船日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="有效日期" prop="lidgrp.rec.expdat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.lidgrp.rec.expdat"
            style="width: 100%"
            placeholder="请选择有效日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="到期地址" prop="lidgrp.rec.expplc">
          <c-input
            disabled
            v-model="model.lidgrp.rec.expplc"
            maxlength="29"
            placeholder="请输入到期地址"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="信用证类型" prop="lidgrp.rec.lcrtyp">
          <c-select
            disabled
            :code="codes.lcrtyp"
            v-model="model.lidgrp.rec.lcrtyp"
            style="width: 100%"
            placeholder="请选择信用证类型"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="单据编号" prop="brdgrp.rec.ownref">
          <c-fullbox>
            <c-input
              disabled
              v-model="model.brdgrp.rec.ownref"
              maxlength="16"
              placeholder="请获取单据编号"
            ></c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
                @click="onSeainf"
                icon="el-icon-search"
              >
              </c-button>
              <c-button
                style="margin: 0 0"
                size="small"
                type="primary"
                @click="onBrtmodButgetref"
                :disabled="model.brdgrp.rec.ownref !== ''"
              >
                获取
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="单据类型" prop="brdgrp.rec.docflg">
          <c-select
            :code="codes.docflg"
            v-model="model.brdgrp.rec.docflg"
            style="width: 100%"
            disabled
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="发票类型" prop="invtyp">
          <c-select
            v-model="model.invtyp"
            style="width: 100%"
            :code="codes.invtyp2"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="申报类型" prop="outlen.szflg">
          <c-select
            v-model="model.outlen.szflg"
            style="width: 100%"
            :code="codes.szflg"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="单据金额" prop="brdgrp.cbs.max.cur">
          <c-input
            disabled
            v-model="model.brdgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择金额"
          >
          </c-input>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="" label-width="10px" prop="brdgrp.cbs.max.amt">
          <c-input
            v-model="model.brdgrp.cbs.max.amt"
            placeholder="请输入金额"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="附加金额" prop="brdgrp.cbs.opn2.cur">
          <c-input
            disabled
            v-model="model.brdgrp.cbs.opn2.cur"
            style="width: 100%"
            placeholder=""
          >
          </c-input>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="" label-width="10px" prop="brdgrp.cbs.max2.amt">
          <c-input
            v-model="model.brdgrp.cbs.max2.amt"
            placeholder="请输入金额"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="收单日期" prop="brdgrp.rec.rcvdat">
          <c-date-picker
            type="date"
            v-model="model.brdgrp.rec.rcvdat"
            style="width: 100%"
            placeholder="请选择收单日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="寄单日期" prop="brdgrp.rec.predat">
          <c-date-picker
            type="date"
            v-model="model.brdgrp.rec.predat"
            style="width: 100%"
            placeholder="请选择寄单日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="订购日期" prop="brdgrp.rec.orddat">
          <c-date-picker
            type="date"
            v-model="model.brdgrp.rec.orddat"
            style="width: 100%"
            placeholder="请选择订购日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="装船日期" prop="brdgrp.rec.shpdat">
          <c-date-picker
            type="date"
            v-model="model.brdgrp.rec.shpdat"
            style="width: 100%"
            placeholder="请选择装船日期"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="付款期限" prop="brdgrp.rec.matdat">
          <c-date-picker
            :disabled="this.flag3"
            type="date"
            v-model="model.brdgrp.rec.matdat"
            style="width: 100%"
            placeholder="请选择付款期限"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="开始日期" prop="brdgrp.rec.stadat">
          <c-input v-model="model.brdgrp.rec.stadat" disabled></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="款项去向" prop="outlen.acttyp">
          <c-select
            :disabled="this.flag1"
            v-model="model.outlen.acttyp"
            :code="codes.acttyp"
          ></c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item
          label="远期汇票最大期限（天）"
          prop="brdgrp.rec.tenmaxday"
        >
          <c-input v-model="model.brdgrp.rec.tenmaxday" disabled></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="到期期限" prop="brdgrp.blk.matper">
          <c-input
            :disabled="this.flag2"
            type="textarea"
            v-model="model.brdgrp.blk.matper"
            maxlength="65"
            show-word-limit
            placeholder="请输入到期期限"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="合同编号" prop="brdgrp.rec.rptref">
          <c-fullbox>
            <c-input
              v-model="model.brdgrp.rec.rptref"
              maxlength="3"
              style="width: 100%"
              placeholder="请输入合同编号"
            ></c-input>
            <template slot="footer">
              <c-checkbox
                :disabled="this.model.brdgrp.blk.docdisflg == 'X'"
                v-model="model.brdgrp.rec.dscinsflg"
                @change="dscinsflgChange"
                style="margin-left: 10px"
                >记录单据和不符点</c-checkbox
              >
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="最迟送达日期" prop="zcsdrq">
          <c-date-picker
            type="date"
            v-model="model.zcsdrq"
            style="width: 100%"
          ></c-date-picker>
        </el-form-item>
      </c-col>
    </el-col>

    <!-- ==================================右 =============================================-->
    <el-col :span="12" style="padding-left: 20px">
      <c-col :span="24">
        <el-form-item label="简略信息" prop="lidgrp.rec.nam">
          <c-input
            disabled
            v-model="model.lidgrp.rec.nam"
            maxlength="40"
            placeholder="请输入简略信息"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="申请人参考号" prop="brdgrp.apl.pts.ref">
          <c-input
            disabled
            v-model="model.brdgrp.apl.pts.ref"
            maxlength="16"
            placeholder="请输入申请人参考号"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="申请人名称" prop="brdgrp.apl.pts.nam">
          <c-input
            disabled
            v-model="model.brdgrp.apl.pts.nam"
            maxlength="40"
            placeholder="请输入申请人名称"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="受益人参考号" prop="brdgrp.ben.pts.ref">
          <c-input
            disabled
            v-model="model.brdgrp.ben.pts.ref"
            maxlength="16"
            placeholder="请输入受益人参考号"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="受益人名称" prop="brdgrp.ben.pts.nam">
          <c-input
            disabled
            v-model="model.brdgrp.ben.pts.nam"
            maxlength="40"
            placeholder="请输入受益人名称"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="寄单行参考号" prop="brdgrp.prb.pts.ref">
          <c-input
            disabled
            v-model="model.brdgrp.prb.pts.ref"
            maxlength="16"
            placeholder="请输入寄单行参考号"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="寄单行名称" prop="brdgrp.prb.pts.nam">
          <c-input
            disabled
            v-model="model.brdgrp.prb.pts.nam"
            maxlength="40"
            placeholder="请输入寄单行名称"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="简略信息" prop="brdgrp.rec.nam">
          <c-input
            disabled
            v-model="model.brdgrp.rec.nam"
            maxlength="40"
            placeholder="请输入简略信息"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="寄单行" prop="brdgrp.rec.docprbrol">
          <c-select
            :code="codes.docprbrol"
            v-model="model.brdgrp.rec.docprbrol"
            style="width: 100%"
            placeholder="请选择"
            @change="selectOrCheckboxRule('brdgrp.rec.docprbrol')"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="寄单行参考号" prop="brdgrp.prb.pts.ref">
          <c-input
            v-model="model.brdgrp.prb.pts.ref"
            maxlength="16"
            placeholder="请输入寄单行参考号"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="寄单行地址编码" prop="brdgrp.prb.pts.extkey">
          <c-fullbox>
            <c-input
              v-model="model.brdgrp.prb.pts.extkey"
              maxlength="16"
              placeholder="请输入地址编码"
              @keyup.enter.native="
                showGridPromptDialog('brdgrp.prb.pts.extkey')
              "
              :disabled="model.brdgrp.rec.docprbrol != 'PRB'"
            ></c-input>
            <template slot="footer">
              <c-button
                style="margin: 0 10px 0 10px; padding: 0 12px"
                size="small"
                type="primary"
                @click="model.brtp.prbp.ptsget.sdamod.seainf"
                icon="el-icon-search"
              >
              </c-button>
              <c-button
                style="margin: 0 0"
                size="small"
                type="primary"
                icon="el-icon-info"
                @click="onPrbpDet"
              >
              </c-button>
            </template>
          </c-fullbox>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="名称地址" prop="brdgrp.prb.pts.adrblk">
          <c-input
            :rows="4"
            type="textarea"
            v-model="model.brdgrp.prb.pts.adrblk"
            maxlength="300"
            show-word-limit
            placeholder="请输入名称地址"
            :disabled="model.brdgrp.rec.docprbrol != 'PRB'"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="单据状态" prop="brdgrp.rec.docsta">
          <c-select
            disabled
            :code="codes.docsta1"
            v-model="model.brdgrp.rec.docsta"
            style="width: 100%"
            placeholder="请输入单据状态"
          ></c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="本证前手单据" prop="lidgrp.rec.utlnbr">
          <c-input
            disabled
            v-model="model.lidgrp.rec.utlnbr"
            placeholder="请输入单据份数"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="发票编号" prop="brdgrp.rec.invref">
          <c-input v-model="model.brdgrp.rec.invref"></c-input>
        </el-form-item>
      </c-col>
    </el-col>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Litdck/Event";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {
      flag1: true,
      flag2: false,
      flag3: false,
    };
  },
  watch: {
    "model.outlen.szflg": {
      immediate: true,
      handler(val, oldval) {
        if (this.model.outlen.szflg == "1") {
          this.flag1 = false;
        } else {
          this.flag1 = true;
        }
      },
    },
    "model.brdgrp.rec.matdat": {
      immediate: true,
      handler(val, oldval) {
        if (this.model.brdgrp.rec.matdat != "") {
          this.flag2 = true;
        } else {
          this.flag2 = false;
        }
      },
    },
    "model.brdgrp.rec.docflg": {
      immediate: true,
      handler(val, oldval) {
        if (this.model.brdgrp.rec.docflg == "P") {
          this.flag3 = true;
          this.flag2 = true;
        } else {
          this.flag3 = false;
          this.flag2 = false;
        }
      },
    },
    "model.brdgrp.blk.matper": {
      immediate: true,
      handler(val, oldval) {
        if (this.model.brdgrp.blk.matper != "") {
          this.flag3 = true;
        } else {
          this.flag3 = false;
        }
      },
    },
  },
  methods: { ...Event },
  created: function () {},
  dscinsflgChang() {
    if (this.model.brdgrp.rec.dscinsflg === "X") {
      this.model.brdgrp.rec.docsta = "H";
    } else {
      this.model.brdgrp.rec.docsta = "G";
    }
  },
};
</script>
<style>
</style>