<template>
  <c-col :span="24">
    <!-- ================底部--左================= -->
    <c-col :span="12" style="padding-right: 20px;" v-if="model.cptp.liqtyp != 'S'">
      <c-col :span="24">
        <el-form-item label="付款行" prop="cpdgrp.ori.pts.ref">
          <c-input
            v-model="model.cpdgrp.ori.pts.ref"
            maxlength="16"
            placeholder=""
            :disabled="this.model.cpdgrp.rec.swftyp == ''"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <!-- <c-col :span="18"> -->
        <c-fullbox>
          <el-form-item label="">
            <c-input
              v-model="model.cpdgrp.ori.pts.extkey"
              placeholder=""
              style="width: 100%"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.ori.pts.extkey')
              "
              :disabled="this.model.cpdgrp.rec.swftyp == ''"
            ></c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              size="small"
              type="primary"
              icon="el-icon-search"
              style="margin: 0 10px 0 10px; padding: 0 12px"
              @click="
                showGridPromptDialog(
                  'ptsget.sdamod.seainf',
                  null,
                  null,
                  { TXT: 'cpdgrp.ori.pts.extkey' },
                  { TXT: false },
                  'doxpDialog'
                )
              "
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            v-model="model.cpdgrp.ori.pts.adrblk"
            show-word-limit
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="汇款人" prop="cpdgrp.orc.pts.ref">
          <c-input
            v-model="model.cpdgrp.orc.pts.ref"
            maxlength="16"
            placeholder=""
            :disabled="this.model.cpdgrp.rec.swftyp == ''"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="账号" prop="cpdgrp.rec.orcact">
          <c-input
            v-model="model.cpdgrp.rec.orcact"
            maxlength="35"
            placeholder="汇款人账号"
            :disabled="this.model.cpdgrp.rec.swftyp == ''"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-fullbox>
          <el-form-item label="" prop="cpdgrp.orc.pts.extkey">
            <c-input
              v-model="model.cpdgrp.orc.pts.extkey"
              placeholder="请输入"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.orc.pts.extkey')
              "
              :disabled="this.model.cpdgrp.rec.swftyp == ''"
            >
            </c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            v-model="model.cpdgrp.orc.pts.adrblk"
            show-word-limit
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24" v-if="false">
        <el-form-item label="汇款人名称" prop="orcnam">
          <c-input
            v-model="model.orcnam"
            maxlength="16"
            placeholder=""
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24" v-show="false">
        <el-form-item label="收款人名称" prop="pyenam">
          <c-input
            v-model="model.pyenam"
            placeholder=""
            @blur="pyenamEvent"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24" v-show="false">
        <el-form-item label="清算费用锁定服务" prop="cptp.qsfysd">
          <c-select
            v-model="model.cptp.qsfysd"
            style="width: 100%"
            placeholder="请选择服务提供银行"
          >
            <el-option
              v-for="item in codes.qsfysd"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="24" v-if="model.cptp.qsfysd === '1'">
        <el-form-item label="服务提供银行">
          <c-input v-model="model.cptp.fwtgyh" placeholder=""></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <!-- ================底部--右================= -->
    <c-col :span="12" style="padding-left: 20px;"
      v-if="
        root.trnName === 'cptopn'
          ? model.cpdgrp.rec.swftyp === '' ||
            model.cpdgrp.rec.swftyp === '103' ||
            model.cpdgrp.rec.swftyp === '202'
          : model.cpdgrp.rec.swftyp === '' || model.cpdgrp.rec.swftyp === '103'
      "
    >
      <c-col :span="24" v-if="this.model.cptp.liqtyp != 'C'">
        <c-fullbox>
          <el-form-item label="发报行" prop="cpdgrp.snd.pts.extkey">
            <c-input
              placeholder="请输入发报行"
              disabled
              v-model="model.cpdgrp.snd.pts.extkey"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.snd.pts.extkey')
              "
            ></c-input>
          </el-form-item>

          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24" v-if="this.model.cptp.liqtyp != 'C'">
        <el-form-item label="" prop="cpdgrp.snd.pts.nam">
          <c-input
            placeholder=""
            disabled
            v-model="model.cpdgrp.snd.pts.nam"
          ></c-input>
        </el-form-item>
      </c-col>

      <!--清算模式（代理行模式）报文类型Mt103-->
      <c-col :span="24" v-if="this.model.cptp.liqtyp == 'C'">
        <c-col :span="24">
          <el-form-item label="清算代理行">
            <c-select
              v-model="model.cptp.cleage"
              style="width: 100%"
              placeholder="请选择清算代理行"
              @change="commonExecuteRule('cptp.cleage')"
            >
              <el-option
                v-for="item in cleageOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="24">
          <el-form-item label="光大开户行">
            <c-select
              v-model="model.cptp.evebch"
              style="width: 100%"
              placeholder="请选择光大开户行"
            >
            </c-select>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="清算代理行账号">
            <c-input
              v-model="model.cptp.coract"
              maxlength="32"
              style="width: 100%"
              placeholder="请输入清算代理行账号"
              disabled
            >
            </c-input>
          </el-form-item>
        </c-col>
      </c-col>

      <c-col :span="24">
        <el-form-item label="指令代码" prop="cpdgrp.rec.f23e">
          <c-input
            v-model="model.cpdgrp.rec.f23e"
            maxlength="35"
            placeholder="请输入指令代码"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-col :span="13">
          <el-form-item label="原始金额" prop="cpdgrp.rec.curf33b">
            <c-select
              v-model="model.cpdgrp.rec.curf33b"
              style="width: 100%"
              placeholder=""
              :disabled="this.flag3"
            >
              <el-option
                v-for="item in codes.currencycode"
                :key="item.value"
                :label="item.value + item.label"
                :value="item.value"
              ></el-option>
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="11">
          <el-form-item label="" label-width="8px" prop="cpdgrp.rec.amtf33b">
            <c-input
              v-model="model.cpdgrp.rec.amtf33b"
              placeholder="请输入原始金额"
              :disabled="this.flag3"
            ></c-input>
          </el-form-item>
        </c-col>
      </c-col>

      <c-col :span="24">
        <el-form-item label="汇率" prop="cpdgrp.rec.f36">
          <c-input
            v-model="model.cpdgrp.rec.f36"
            placeholder=""
            :disabled="this.flag3"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-col :span="13">
          <el-form-item label="发报行扣费金额" prop="cpdgrp.rec.cur71f">
            <c-select
              v-model="model.cpdgrp.rec.cur71f"
              placeholder=""
              style="width: 100%"
              :disabled="this.flag3"
            >
              <el-option
                v-for="item in codes.currencycode"
                :key="item.value"
                :label="item.value + item.label"
                :value="item.value"
              ></el-option>
            </c-select>
          </el-form-item>
        </c-col>
        <c-col :span="11">
          <el-form-item label="" label-width="8px" prop="cpdgrp.rec.amt71f">
            <c-input
              v-model="model.cpdgrp.rec.amt71f"
              placeholder="请输入发报行扣费金额"
              :disabled="this.flag3"
            ></c-input>
          </el-form-item>
        </c-col>
      </c-col>

      <c-col :span="24">
        <el-form-item label="银行操作码" prop="cpdgrp.rec.f23b">
          <c-input
            v-model="model.cpdgrp.rec.f23b"
            maxlength="4"
            placeholder=""
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="账号" prop="cpdgrp.rec.pyeact">
          <c-input
            v-model="model.cpdgrp.rec.pyeact"
            maxlength="35"
            placeholder="请输入账号"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-fullbox>
          <el-form-item label="收款人" prop="cpdgrp.pye.pts.extkey">
            <c-input
              v-model="model.cpdgrp.pye.pts.extkey"
              maxlength="14"
              placeholder="请输入收款人"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.pye.pts.extkey')
              "
            ></c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="cpdgrp.pye.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            v-model="model.cpdgrp.pye.pts.adrblk"
            show-word-limit
            placeholder="请输入"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="12" style="padding-left: 20px;"
      v-if="
        root.trnName === 'cptopn'
          ? model.cpdgrp.rec.swftyp === '200'
          : model.cpdgrp.rec.swftyp === '202' ||
            model.cpdgrp.rec.swftyp === '200'
      "
    >
      <c-col :span="24" v-if="this.model.cptp.liqtyp != 'C'">
        <c-fullbox>
          <el-form-item label="发报行" prop="cpdgrp.snd.pts.extkey">
            <c-input
              placeholder="请输入发报行"
              disabled
              v-model="model.cpdgrp.snd.pts.extkey"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.snd.pts.extkey')
              "
            ></c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24" v-if="this.model.cptp.liqtyp != 'C'">
        <el-form-item label="" prop="cpdgrp.snd.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            show-word-limit
            placeholder="请输入"
            v-model="model.cpdgrp.snd.pts.adrblk"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <!--清算模式（代理行模式）报文类型Mt202-->
      <c-col :span="24" v-if="this.model.cptp.liqtyp == 'C'">
        <c-col :span="24">
          <el-form-item label="清算代理行">
            <c-select
              v-model="model.cptp.cleage"
              style="width: 100%"
              placeholder="请选择清算代理行"
              @change="commonExecuteRule('cptp.cleage')"
            >
              <el-option
                v-for="item in cleageOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="光大开户分行">
            <c-select
              v-model="model.cptp.evebch"
              style="width: 100%"
              placeholder="请选择光大开户分行"
            >
            </c-select>
          </el-form-item>
        </c-col>

        <c-col :span="24">
          <el-form-item label="清算代理行账号">
            <c-input
              v-model="model.cptp.coract"
              maxlength="32"
              style="width: 100%"
              placeholder="请输入清算代理行账号"
              disabled
            >
            </c-input>
          </el-form-item>
        </c-col>
      </c-col>

      <c-col :span="24">
        <el-form-item label="收款人" prop="cpdgrp.pye.pts.extkey">
          <c-input
            v-model="model.cpdgrp.pye.pts.extkey"
            maxlength="14"
            placeholder="请输入收款人"
            @keyup.enter.native="showGridPromptDialog('cpdgrp.pye.pts.extkey')"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="账号" prop="cpdgrp.rec.pyeact">
          <c-input
            v-model="model.cpdgrp.rec.pyeact"
            maxlength="35"
            placeholder="请输入账号"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-fullbox>
          <el-form-item label="">
            <c-input
              v-model="model.cpdgrp.pye.pts.extkey"
              placeholder="请输入收款人客户号"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.pye.pts.extkey')
              "
            >
            </c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            v-model="model.cpdgrp.pye.pts.adrblk"
            show-word-limit
            placeholder="请输入"
          ></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="12" style="padding-left: 20px;"
      v-if="model.cpdgrp.rec.swftyp === 'OTH'"
    >
      <c-col :span="24">
        <c-fullbox>
          <el-form-item label="发报行" prop="cpdgrp.snd.pts.extkey">
            <c-input
              placeholder="请输入发报行"
              disabled
              v-model="model.cpdgrp.snd.pts.extkey"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.snd.pts.extkey')
              "
            ></c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>

            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
              disabled
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="cpdgrp.snd.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            show-word-limit
            placeholder="请输入"
            v-model="model.cpdgrp.snd.pts.adrblk"
            disabled
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="付款详情" prop="cpdgrp.blk.contag70">
          <c-input
            type="textarea"
            placeholder=""
            rows="3"
            v-model="model.cpdgrp.blk.contag70"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="收款人参考号" prop="cpdgrp.pye.pts.ref">
          <c-input
            v-model="model.cpdgrp.pye.pts.ref"
            maxlength="16"
            placeholder=""
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="账号" prop="cpdgrp.rec.pyeact">
          <c-input
            v-model="model.cpdgrp.rec.pyeact"
            maxlength="35"
            placeholder="请输入账号"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <c-fullbox>
          <el-form-item label="" prop="cpdgrp.pye.pts.extkey">
            <c-input
              v-model="model.cpdgrp.pye.pts.extkey"
              placeholder="请输入收款人客户号"
              @keyup.enter.native="
                showGridPromptDialog('cpdgrp.pye.pts.extkey')
              "
            >
            </c-input>
          </el-form-item>
          <template slot="footer">
            <c-button
              style="margin: 0 10px 0 10px; padding: 0 12px"
              size="small"
              type="primary"
              icon="el-icon-search"
            >
            </c-button>
            <c-button
              style="margin: 0 0"
              size="small"
              type="primary"
              @click="onSndpDet"
            >
              详情
            </c-button>
          </template>
        </c-fullbox>
      </c-col>

      <c-col :span="24">
        <el-form-item label="" prop="cpdgrp.pye.pts.adrblk">
          <c-input
            type="textarea"
            :rows="4"
            maxlength="140"
            v-model="model.cpdgrp.pye.pts.adrblk"
            show-word-limit
            placeholder="请输入"
            :disabled="model.cpdgrp.pye.pts.extkey!=''"
          ></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <el-dialog
      :fullscreen="true"
      :visible.sync="infptaVisible"
      top="10vh"
      width="80%"
      custom-class="infptaDialog"
      :before-close="handleClose"
    >
      <Infpta></Infpta>
    </el-dialog>
  </c-col>
</template>

<script>
import commonProcess from "~/mixin/commonProcess";
import Utils from "~/utils";
export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {
      cleageOptions: [
        { label: "BKCHHKHHXXX", value: "BKCHHKHHXXX" },
        { label: "CCBQHKAXXXX", value: "CCBQHKAXXXX" },
        { label: "EVERHKHHXXX", value: "EVERHKHHXXX" },
        { label: "KWHKHKHHXXX", value: "KWHKHKHHXXX" },
        { label: "NYCBHKHHXXX", value: "NYCBHKHHXXX" },
        { label: "WUBAHKHHXXX", value: "WUBAHKHHXXX" },
      ],
      infptaVisible: false,
      flag1: true,
      flag3: false,
      bustyp: [
        { label: "GODX", value: "货期贸易" },
        { label: "STRX", value: "服务贸易" },
        { label: "CTFX", value: "资本项下" },
        { label: "FTFX", value: "金融机构头寸调拨" },
        { label: "BDES", value: "债卷还本利息" },
        { label: "BPRR", value: "债卷还本金" },
        { label: "BINP", value: "债卷利息" },
        { label: "BISF", value: "债卷发行手续费" },
        { label: "BCAF", value: "债卷兑付手续费" },
        { label: "CBCF", value: "附息式债卷兑付手续费" },
        { label: "OTFX", value: "其他" },
      ],
    };
  },
  watch: {
    "model.cptp.qsfysd": function () {
      if (this.model.cptp.qsfysd == "") {
        this.model.cptp.fwtgyh == "";
      } else {
        this.model.cptp.fwtgyh = "CHASUS33XXX";
        console.log(this.model.cptp.fwtgyh);
      }
    },
    "model.cpdgrp.rec.swftyp": function () {
      console.log(this.model.cpdgrp.rec.swftyp);
      if (this.model.cpdgrp.rec.swftyp == "") {
        this.flag1 = true;
      } else {
        this.flag1 = false;
      }
    },
    "model.cpdgrp.rec.swftyp": {
      immediate: true,
      handler(val, oldVal) {
        if (this.model.cpdgrp.rec.swftyp == "CIU") {
          this.bustyp = [
            { label: "GODX", value: "货期贸易" },
            { label: "STRX", value: "服务贸易" },
            { label: "CTFX", value: "资本项下" },
            { label: "OTFX", value: "其他" },
          ];
        } else if (this.model.cpdgrp.rec.swftyp == "CIV") {
          this.bustyp = [
            { label: "GODX", value: "货期贸易" },
            { label: "STRX", value: "服务贸易" },
            { label: "CTFX", value: "资本项下" },
            { label: "FTFX", value: "金融机构头寸调拨" },
            { label: "BDES", value: "债卷还本利息" },
            { label: "BPRR", value: "债卷还本金" },
            { label: "BINP", value: "债卷利息" },
            { label: "BISF", value: "债卷发行手续费" },
            { label: "BCAF", value: "债卷兑付手续费" },
            { label: "CBCF", value: "附息式债卷兑付手续费" },
            { label: "OTFX", value: "其他" },
          ];
        }
      },
    },
  },
  watch: {
    //通过账号、收款人账号控制原始金额、发报行扣费金额、汇率
    "model.cpdgrp.pye.pts.extkey": {
      immediate: true,
      handler(val, oldVal) {
        if (
          this.model.cpdgrp.pye.pts.extkey != "" &&
          this.model.cpdgrp.rec.swftyp != ""
        ) {
          this.flag3 = true;
        } else {
          this.flag3 = false;
        }
      },
    },
    "model.cpdgrp.rec.swftyp": {
      immediate: true,
      handler(val, oldVal) {
        if (
          this.model.cpdgrp.pye.pts.extkey != "" &&
          this.model.cpdgrp.rec.swftyp != ""
        ) {
          this.flag3 = true;
        } else {
          this.flag3 = false;
        }
      },
    },
  },
  methods: {
    onSndpDet() {
      this.$emit("onSndpDet");
    },
    onCptpGetInfpta() {
      this.infptaVisible = true;
    },
    handleClose(done) {
      done();
    },
    pyenamEvent() {
      this.executeRule("pyenam").then((res) => {});
    },
    commonExecuteRule(ruleName) {
      this.executeRule(ruleName).then((res) => {
        if (res.respCode == SUCCESS) {
          Utils.copyValueFromVO(this.model, res.data);
        }
      });
    },
  },
};
</script>

<style>
</style>