Bctsus.vue

<template>
  <div class="eibs-tab">
    <!-- ====================左边======================= -->
    <c-col :span="11">
      <c-col :span="24">
        <el-form-item label="Collection Number" prop="bcdgrp.rec.ownref">
          <c-input
            disabled
            v-model="model.bcdgrp.rec.ownref"
            maxlength="16"
            placeholder="请输入Collection Number"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Document Amount" prop="bcdgrp.cbs.max.cur">
          <c-select
            disabled
            v-model="model.bcdgrp.cbs.max.cur"
            style="width: 100%"
            placeholder="请选择Document Amount"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label-width="0" prop="bcdgrp.cbs.max.amt">
          <c-input
            disabled
            v-model="model.bcdgrp.cbs.max.amt"
            placeholder="请输入Document Amount"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="Open Amount" prop="bcdgrp.cbs.opn1.cur">
          <c-select
            disabled
            v-model="model.bcdgrp.cbs.opn1.cur"
            style="width: 100%"
            placeholder="请选择Open Amount"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label-width="0" prop="bcdgrp.cbs.opn1.amt">
          <c-input
            disabled
            v-model="model.bcdgrp.cbs.opn1.amt"
            placeholder="请输入Open Amount"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="Docs Received on" prop="bcdgrp.rec.rcvdat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.bcdgrp.rec.rcvdat"
            style="width: 100%"
            placeholder="请选择Docs Received on"
          ></c-date-picker>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="Advice on" prop="bcdgrp.rec.advdat">
          <c-date-picker
            disabled
            type="date"
            v-model="model.bcdgrp.rec.advdat"
            style="width: 100%"
            placeholder="请选择Date of Advice of Documents Received"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Maturity Date" prop="bcdgrp.rec.matdat">
          <c-date-picker
            type="date"
            disabled
            v-model="model.bcdgrp.rec.matdat"
            style="width: 100%"
            placeholder="请选择Maturity Date"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Remitted on " prop="bcdgrp.rec.predat">
          <c-date-picker
            type="date"
            disabled
            v-model="model.bcdgrp.rec.predat"
            style="width: 100%"
            placeholder="请选择Maturity Date"
          ></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Payment Condition" prop="bcdgrp.rec.doctypcod">
          <c-select
            :code="codes.doctypcod"
            disabled
           
            v-model="model.bcdgrp.rec.doctypcod"
            style="width: 100%"
            placeholder="请选择Payment Condition"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Document Set Status" prop="bcdgrp.rec.docsta">
          <c-select
            style="width: 100%"
            :code="codes.docstabot"
            disabled
           
            v-model="model.bcdgrp.rec.docsta"
            maxlength="1"
            placeholder="请输入Document Set Status"
          ></c-select>
        </el-form-item>
      </c-col>

      <!-- <c-col :span="24">
        <el-form-item label="Tenor Stream" prop="liaall.tenstm">
            <c-input  v-model="model.liaall.tenstm"  placeholder="请输入Tenor Stream"></c-input>
        </el-form-item>
       </c-col> -->
      <c-col :span="22" :offset="1">
        <c-istream-table
          ref="table"
          :list="model.liaall.tenstm.rows || []"
          :columns="trnData.columns"
          :showSelection="true"
          v-on:multipleSelect="multipleSelect"
          prop="liaall.tenstm"
        >
        </c-istream-table>
      </c-col>
    <c-col :span="24">
        <c-docpre
          :model="model"
          :argadr="{
            path: 'bcdgrp.blk.docpre',
            grp: 'bctp',
            code: 'docpre',
          }"></c-docpre>
    </c-col>
    </c-col>
    

    <!-- ========================右边======================= -->
    <c-col :span="11" :offset="1">
      <c-col :span="24">
        <el-form-item label="Name" prop="bcdgrp.rec.nam">
          <c-input
            disabled
            v-model="model.bcdgrp.rec.nam"
            maxlength="40"
            placeholder="请输入Name"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Drawee's Ref" prop="bcdgrp.dre.pts.ref">
          <c-input
            disabled
            v-model="model.bcdgrp.dre.pts.ref"
            maxlength="16"
            placeholder="请输入Drawee"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Drawee's Name" prop="bcdgrp.dre.pts.nam">
          <c-input
            disabled
            v-model="model.bcdgrp.dre.pts.nam"
            maxlength="40"
            placeholder="请输入Name of Party"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Remitting Bank's Ref " prop="bcdgrp.rmi.pts.ref">
          <c-input
            disabled
            v-model="model.bcdgrp.rmi.pts.ref"
            maxlength="16"
            placeholder="请输入Remitting Bank"
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="Remitting Bank's Name" prop="bcdgrp.rmi.pts.nam">
          <c-input
            disabled
            v-model="model.bcdgrp.rmi.pts.nam"
            maxlength="40"
            placeholder="请输入Name of Party"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Drawer's Ref " prop="bcdgrp.drr.pts.ref">
          <c-input
            disabled
            v-model="model.bcdgrp.drr.pts.ref"
            maxlength="16"
            placeholder="请输入Drawer"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="Drawer's Name" prop="bcdgrp.drr.pts.nam">
          <c-input
            disabled
            v-model="model.bcdgrp.drr.pts.nam"
            maxlength="40"
            placeholder="请输入Name of Party"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24" class="bctdav_bctp_bctovw_cheak">
        <c-checkbox v-model="focflg" @change="focflgDefault"
          >Free of Payment</c-checkbox
        >
      </c-col>
      <c-col :span="12">
        <el-form-item label="Reduction Amt" prop="setmod.doccur">
          <c-select
            disabled
            v-model="model.setmod.doccur"
            style="width: 100%"
            placeholder="请选择document currency"
          >
          </c-select>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label-width="0" >
          <c-input
            :disabled="model.bcdgrp.rec.focflg=='X'"
            v-model="model.setmod.redamt"
            placeholder="请输入Reduction Amt."
          ></c-input>
        </el-form-item>
      </c-col>

      <c-col :span="12" class="bctdav_bctp_bctovw_cheak">
        <c-checkbox :disabled="model.bcdgrp.rec.focflg=='X'" v-model="crefinflg"
        @change="crefinflgChange"
          >Create Financing</c-checkbox
        >
      </c-col>

      <c-col :span="12" class="bctdav_bctp_bctovw_cheak">
        <c-checkbox v-model="model.dftcre.dfflag" @change="dfflagChange">同业代付</c-checkbox>
      </c-col>

      <c-col :span="24" class="bctdav_bctp_bctovw_cheak">
        <c-checkbox true-label="C" v-model="clsflg" @change="clsflgOtherDefault"
          >Close Contract</c-checkbox
        >
      </c-col>
      
<c-col :span="24">
        <el-form-item
          label="跨境人民币清算模式"
          prop="trnmod.cmtflg"
          v-if="model.setmod.doccur == 'CNY'"
          style="margin-top: 15px"  
        >
          <c-select
            v-model="model.trnmod.cmtflg"
            style="width: 100%"
            :disabled="model.bcdgrp.rec.focflg=='X'"
            placeholder=""     
          >
          <el-option
              v-for="item in codes.cmtflg"
              :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="报文类型"
          prop="trnmod.swftyp"
          v-if="model.trnmod.cmtflg =='P'||model.trnmod.cmtflg =='X'"
        >
          <c-select v-model="model.trnmod.swftyp" disabled  placeholder="" 
          :code="codes.swftyp1"
          style="width: 100%"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="Settle Amt." prop="setmod.doccur">
          <c-select
            disabled
            v-model="model.setmod.doccur"
            style="width: 100%"
            placeholder="请选择document currency"
            @change="1"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label-width="0" prop="setmod.docamt">
          <c-input
            v-model="model.setmod.docamt"
            placeholder="请输入document amount"
          ></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="合同号" prop="bcdgrp.rec.rptref">
          <c-input
            v-model="model.bcdgrp.rec.rptref"
            style="width: 100%"
            placeholder="请输入Contract No."
          >
          </c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <el-form-item label="发票号" prop="bcdgrp.rec.invref">
          <c-input
            v-model="model.bcdgrp.rec.invref"
            style="width: 100%"
            placeholder="请输入Invoice No."
          >
          </c-input>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="是否需要检核" prop="bctp.ischktyp">
          <c-select
            v-model="model.bctp.ischktyp"
            style="width: 100%"
            placeholder="请选择document currency"
            :code="codes.ischktyp"
          >
          </c-select>
        </el-form-item>
      </c-col>
      <c-col :span="12">
        <el-form-item label="预计核验日期" prop="bctp.prechkdat">
          <c-date-picker
            :disabled="this.typ1"
            type="date"
            v-model="model.bctp.prechkdat"
            style="width: 100%"
            placeholder="请选择预计核验日期"
          >
          </c-date-picker>
        </el-form-item>
      </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 "~/model/Bctset/Event";
import Utils from "~/utils";

import Docpre from "~/views/Public/Docpre";
export default {
  components: {
    "c-docpre": Docpre,
  },
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
 
  data() {
    return {
      typ1: true,
     // flag1: false,
      trnData: {
        columns: [
          '1 1 "Type" 60',
          '2 2 "Dbt" 60',
          '3 3 "Cdt" 80',
          '4 4 "Cur" 50',
          '5 5 "Amt" 120 2 8 1 4',
          // '6 6 "Mat.Dat." 120 4 7 1',
          {
            index: 6,
            position: 6,
            width: 250,
            render: (item, scope) => {
              return scope.row[item.prop] === "null"
                ? ""
                : scope.row[item.prop];
            },
            label: "Mat.Dat.",
          },
        ],
        data: [],
      },
    };
  },
  mounted() {
    this.$nextTick(() => {});
  },
 computed: {
    crefinflg: {
      get() {
        
        if (this.model.bcdgrp.rec.focflg == 'X') {
          return false;
        }else{
          return this.model.trtcre.crefinflg != ''
        }
        
      },
      set(val) {
      
        this.model.trtcre.crefinflg = val ? "X" : ""
        
         
        
      }
    },
   clsflg: {
      get() {
        return this.model.mtabut.clsflg=='C'; 
      },
      set(val) {
        this.model.mtabut.clsflg = val ? "C" : "O"
      }
    },
    focflg: {
      get() {
        return this.model.bcdgrp.rec.focflg != ''
      },
      set(val) {
        if (this.model.bcdgrp.rec.focflg == 'X' ) {
          this.model.trtcre.crefinflg = ''
          this.model.trnmod.cmtflg='O'
        }else{
          this.model.trnmod.cmtflg=''
        }
        this.model.bcdgrp.rec.focflg = val ? "X" : ""
      }
    },
    // dfflag: {
    //   get() {
    //     return this.model.dftcre.dfflag != ''
    //   },
    //   set(val) {
    //     this.model.dftcre.dfflag = val ? "X" : ""
    //   }
    // },
  },
  methods: {
    ...Event,

    //   focflgDefault(){
    //   this.executeDefault("trnmod.cmtflg").then((res) => {
    //     if ((res.respCode == SUCCESS)) {
    //       Utils.copyValueFromVO(this.model, res.data);
    //     }
    //   });
    // },
      focflgDefault(){
      this.executeDefault("bcdgrp.rec.docsta").then((res) => {
        if ((res.respCode == SUCCESS)) {
          Utils.copyValueFromVO(this.model, res.data);
        }
      });
    },
    

      crefinflgChange(){
      this.executeRule("trtcre.crefinflg").then((res) => {
        if ((res.respCode == SUCCESS)) {
          Utils.copyValueFromVO(this.model, res.data);
        }
      });
    },
     clsflgOtherDefault(){
      this.executeDefault("mtabut.clsflg").then((res) => {
        if ((res.respCode == SUCCESS)) {
          Utils.copyValueFromVO(this.model, res.data);
        }
      });
    },
    // async dfflagChange() {
    //   let rtnmsg = await this.executeRule("dftcre.dfflag");
    //   if (rtnmsg.respCode == SUCCESS) {
    //     Utils.copyValueFromVO(this.model, rtnmsg.data);
    //   }
    // },
    async multipleSelect(selection) {
      console.log(selection);
      if (selection.length > 1) {
        this.$notify({
          title: "error",
          message: "You cannot select more than one tenor",
          type: "error",
        });
      } else {
        let chkIds;
        if (selection.length === 0) {
          chkIds = [];
          // this.model.liaall.tensetstm.rows = []
          // this.model.liaall.tenstm.rows = []
        } else {
          chkIds = [selection[0] + 1];
        }
        //
        console.log(this.model.liaall.tensetstm);
        let params = { chkDst: "liaall.tenstm", chkIds };
        const rtnmsg = await this.executeRule("liaall.tenstm", params);
        if (rtnmsg.respCode == SUCCESS) {
          this.updateModel(rtnmsg.data);
        } else {
          this.$notify.error({ title: "错误", message: "服务请求失败！" });
        }
      }
    },
    
  },
   watch: {
//  "focflg":{
//           immediate: true,
//               handler(val, oldVal) {
//         if(this.model.focflg=="X"){
//         this.model.trnmod.cmtflg="O"
//         }
//        }
//      },
  // "bcdgrp.rec.doctypcod":{
  //   immediate: true,         
  //    handler(val, oldVal) {
  //     if(this.bcdgrp.rec.predat!=''){
  //       this.model.bcdgrp.rec.docsta="A"
  //      }else if(this.bcdgrp.rec.opndat!=''){
  //        this.model.bcdgrp.rec.docsta="B"
  //     }
  //     else if(this.model.bcdgrp.rec.doctypcod=="A"||this.model.bcdgrp.rec.doctypcod=="D"||this.model.bcdgrp.rec.doctypcod=="M"){
  //        this.model.bcdgrp.rec.docsta="C"
  //     }
  //  }
  // },
        "model.trnmod.cmtflg":{
          immediate: true,
              handler(val, oldVal) {
        if(this.model.trnmod.cmtflg=="P"){
        this.model.trnmod.swftyp="CIV"
        }
       }
     },

       "model.bctp.ischktyp": {
      immediate: true,
      handler(val, oldVal) {
        if (this.model.bctp.ischktyp == "Y") {
          this.typ1 = false;
        } else {
          this.typ1 = true;
        }
      }
     },
   },
  created: function () {
    
  },
};
</script>
<style>
.bctdav_bctp_bctovw_cheak {
  margin: 0px 0 10px 150px;
}
</style>