<template>
  <c-col :span="24">
    <!-- ================底部--左================= -->
    <c-col :span="11" style="margin-top: 10px" 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
                        style="margin:0 10px 0 10px;padding: 0 12px;"
                        size="small"
                        type="primary"
                        icon="el-icon-search"
                    >
                    </c-button>  -->
            <c-button size="small" type="primary" icon="el-icon-search"
              @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="请输入Address Block" 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>
          <!-- </c-col>
                <c-col :span="6" style="text-align: right"> -->
          <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="请输入Address Block" 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="11" :offset="1" 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'
    " style="margin-top: 10px">
      <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: 70%" 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: 70%" 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: 90%" 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">
            <!-- :disabled="model.cpdgrp.orc.pts.extkey != '' && model.cpdgrp.pye.pts.extkey != ''"  -->
            <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="请输入Address Block" disabled></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="11" :offset="1" v-if="
        root.trnName === 'cptopn'
            ? model.cpdgrp.rec.swftyp === '200'
            : model.cpdgrp.rec.swftyp === '202' ||
              model.cpdgrp.rec.swftyp === '200'
    " style="margin-top: 10px">
      <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="请输入Address Block"
            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: 70%" 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: 90%" 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="请输入Address Block"></c-input>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="11" :offset="1" v-if="model.cpdgrp.rec.swftyp === 'OTH'" style="margin-top: 10px">
      <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="请输入Address Block"
            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="" readonly rows="3" v-model="model.cpdgrp.blk.contag70"></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="收款人Ref." 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="请输入Address Block"></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>