<template>
  <div class="eibs-tab">
    <!-- -----------上层------------- -->
    <!-- ============左边================= -->
    <c-col :span="12" style="padding-right: 20px;">
      <!-- <c-col :span="24">
				<el-form-item :label="$t('getset.保函编号')" prop="gidgrp.rec.ownref">
					<c-input disabled maxlength="16" placeholder="请输入保函编号" v-model="model.gidgrp.rec.ownref"></c-input>
				</el-form-item>
			</c-col> -->

      <c-col :span="24">
        <el-form-item :label="$t('getset.索偿编号')" prop="gcdgrp.rec.ownref">
          <c-input disabled maxlength="16" placeholder="请输入索偿编号" v-model="model.gcdgrp.rec.ownref"></c-input>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <div class="custom-box-wrap">
          <div style="width: 280px;">
            <el-form-item :label="$t('getset.索偿金额')" prop="gcdgrp.cbs.max.cur">
              <c-input disabled maxlength="3" placeholder="请输入索偿金额" v-model="model.gcdgrp.cbs.max.cur" dbCode="curtxt">
              </c-input>
            </el-form-item>
          </div>
          <div style="width: calc(100% - 280px);">
            <el-form-item label-width="5px" prop="gcdgrp.cbs.max.amt">
              <c-input-currency disabled :currency="model.gcdgrp.cbs.max.cur" placeholder="请输入"
                v-model="model.gcdgrp.cbs.max.amt" @input="changeTotalAmount"></c-input-currency>
            </el-form-item>
          </div>
        </div>
      </c-col>
      <c-col :span="24">
        <div class="custom-box-wrap">
          <div style="width: 280px;">
            <el-form-item :label="$t('getset.实际索偿金额')" prop="gcdgrp.cbs.opn1.cur">
              <c-input disabled maxlength="3" placeholder="请输入索偿金额" v-model="model.gcdgrp.cbs.opn1.cur" dbCode="curtxt">
              </c-input>
            </el-form-item>
          </div>
          <div style="width: calc(100% - 280px);">
            <el-form-item label-width="5px" prop="gcdgrp.cbs.opn1.amt">
              <c-input-currency :currency="model.gcdgrp.cbs.opn1.cur" placeholder="请输入"
                v-model="model.gcdgrp.cbs.opn1.amt"></c-input-currency>
            </el-form-item>
          </div>
        </div>
      </c-col>
      <!-- <c-col :span="24">
				<div class="custom-box-wrap">
					<div style="width: 280px;">
						<el-form-item :label="$t('getset.索偿余额')" prop="gcdgrp.cbs.opn1.cur">
							<c-input disabled maxlength="3" placeholder="请输入索偿余额" v-model="model.gcdgrp.cbs.opn1.cur"></c-input>
						</el-form-item>
					</div>
					<div style="width: calc(100% - 280px);">
						<el-form-item label-width="5px" prop="gcdgrp.cbs.opn1.amt">
							<c-input-currency :currency="model.gcdgrp.cbs.opn1.cur" disabled placeholder="请输入" v-model="model.gcdgrp.cbs.opn1.amt"></c-input-currency>
						</el-form-item>
					</div>
				</div>
			</c-col> -->

      <!-- <c-col :span="24" class="custom-box-wrap">
        <div style="width: 280px;">
          <el-form-item :label="$t('getset.附加金额')" prop="gcdgrp.cbs.opn2.cur">
            <c-select dbCode="curtxt" disabled placeholder="请选择附加金额" style="width: 100%"
              v-model="model.gcdgrp.cbs.opn2.cur">
            </c-select>
          </el-form-item>
        </div>
        <div style="width: calc(100% - 280px);">
          <el-form-item label-width="5px" prop="gcdgrp.cbs.max2.amt">
            <c-input-currency :currency="model.gcdgrp.cbs.max2.cur" disabled placeholder=""
              v-model="model.gcdgrp.cbs.max2.amt"></c-input-currency>
          </el-form-item>
        </div>
      </c-col>

      <c-col :span="24" class="custom-box-wrap">
        <div style="width: 280px;">
          <el-form-item label="Total Amount" prop="gcdgrp.cbs.total.cur">
            <c-select dbCode="curtxt" disabled placeholder="" style="width: 100%" v-model="model.gcdgrp.cbs.total.cur">
            </c-select>
          </el-form-item>
        </div>
        <div style="width: calc(100% - 280px);">
          <el-form-item label-width="5px" prop="gcdgrp.cbs.total.amt">
            <c-input-currency :currency="model.gcdgrp.cbs.total.cur" disabled placeholder=""
              v-model="model.gcdgrp.cbs.total.amt" @change="changeTotalAmount"></c-input-currency>
          </el-form-item>
        </div>
      </c-col> -->

    </c-col>

    <!-- ============右边================= -->
    <c-col :span="12" style="padding-left: 20px;">
      <c-col :span="24">
        <el-form-item :label="$t('getset.索偿日期')" prop="gcdgrp.rec.clmdat">
          <c-date-picker disabled placeholder="请选择索偿日期" style="width: 100%" type="date"
            v-model="model.gcdgrp.rec.clmdat"></c-date-picker>
        </el-form-item>
      </c-col>
      <c-col :span="24">
        <c-col :span="6">
          <el-form-item prop="gcdgrp.rec.cannowflg" style=" float:left;">
            <!-- todo -->
            <c-checkbox
              :disabled="(Number(model.gidgrp.cbs.opn1.amt)+Number(model.gidgrp.cbs.opn2.amt) !=0)||(model.gidgrp.rec.pndclm!=1)"
              true-label="X" false-label="" v-model="model.gcdgrp.rec.cannowflg">Payment under
              Cancelation of Guarantee
            </c-checkbox>
          </el-form-item>
        </c-col>
      </c-col>
      <c-col :span="24">
        <c-col :span="6">
          <el-form-item prop="clsflg" style=" float:left;">
            <c-checkbox v-model="model.clsflg" true-label="C" false-label="O">Close Contract
            </c-checkbox>
          </el-form-item>
        </c-col>
      </c-col>
      <c-col :span="24">
        <c-col :span="6">
          <el-form-item prop="gcdgrp.rec.frepayflg" style=" float:left;">
            <c-checkbox v-model="model.gcdgrp.rec.frepayflg" true-label='X' false-label='' @change="changeFrepayflg">
              Free of payment
            </c-checkbox>
          </el-form-item>
        </c-col>
      </c-col>
    </c-col>
  </div>
</template>
<script>
  import event from "../event";
  import Default from "../model/default";

  export default {
    inject: ["root"],
    props: ["model", "codes"],
    mixins: [event, Default],
    data() {
      return {};
    },
    computed: {},
    methods: {},
    watch: {
      'model.gcdgrp.cbs.opn1.amt'() {
        if (this.model.gcdgrp.cbs.opn1.amt == this.model.actualMax) {
          this.model.clsflg = 'C'
        } else {
          this.model.clsflg = 'O'
        }
      }
    },
    created: function () { }
  };
</script>
<style>
</style>