<template>
	<div class="eibs-tab">
		<!-- left -->
		<c-col :span="12" style="padding-right: 20px;">
			<c-col :span="24">
				<el-form-item label="保函编号">
					<c-input disabled v-model="model.nidgrp.rec.ownref" maxlength="16" placeholder="请输入编号"></c-input>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<c-col :span="12">
					<el-form-item label="保函金额">
						<c-select disabled v-model="model.oldnidgrp.cbs.max.cur" maxlength="3" dbCode="curtxt" placeholder="请输入保证金额">
						</c-select>
					</el-form-item>
				</c-col>
				<c-col :span="12">
					<el-form-item label="" label-width="5px">
						<c-input-currency disabled v-model="model.oldnidgrp.cbs.max.amt" :currency="model.oldnidgrp.cbs.max.cur" placeholder="请输入金额"></c-input-currency>
					</el-form-item>
				</c-col>
			</c-col>

			<c-col :span="24">
				<c-col :span="12">
					<el-form-item label="保函余额">
						<c-select disabled v-model="model.oldnidgrp.cbs.opn1.cur" maxlength="3" dbCode="curtxt" placeholder="请输入保函余额"></c-select>
					</el-form-item>
				</c-col>
				<c-col :span="12">
					<el-form-item label="" label-width="5px">
						<c-input-currency disabled v-model="model.oldnidgrp.cbs.opn1.amt" :currency="model.oldnidgrp.cbs.max.cur" placeholder="请输入金额"></c-input-currency>
					</el-form-item>
				</c-col>
			</c-col>

      <c-col :span="24">
				<c-col :span="12">
					<el-form-item label="修改金额">
						<c-select disabled v-model="model.amecur" maxlength="3" dbCode="curtxt" placeholder="请输入修改金额"></c-select>
					</el-form-item>
				</c-col>
				<c-col :span="12">
					<el-form-item label-width="5px">
						<c-input-currency disabled v-model="model.ameamt" :currency="model.amecur" placeholder="请输入修改金额"></c-input-currency>
					</el-form-item>
				</c-col>
			</c-col>

			<c-col :span="24">
        <c-col :span="18">
				  <el-form-item label="原有效期">
					  <c-date-picker disabled style="width: 100%" v-model="model.oldnidgrp.rec.expdat" type="date"></c-date-picker>
				  </el-form-item>
        </c-col>
        <c-col :span="6">
					<el-form-item class="checkbox-left" label-width="10px">
						<c-checkbox disabled  class="checkbox-left" false-label="" true-label="X" v-model="model.oldnidgrp.rec.expflg">
								效期敞口
						</c-checkbox>
					</el-form-item>
				</c-col>         
			</c-col>

      <c-col :span="24" v-if="model.nidgrp.rec.hndtyp!='OL'">
        <c-col :span="18">
				  <el-form-item label="原反担保有效期">
					  <c-date-picker disabled style="width: 100%" v-model="model.oldnidgrp.rec.liadat" type="date"></c-date-picker>
				  </el-form-item>
        </c-col>
        <c-col :span="6">
					<el-form-item class="checkbox-left" label-width="10px">
						<c-checkbox disabled  class="checkbox-left" false-label="" true-label="X" v-model="model.oldnidgrp.rec.liaflg">
								效期敞口
						</c-checkbox>
					</el-form-item>
				</c-col>         
			</c-col>

			<c-col :span="24">
        <c-col :span="18">
				  <el-form-item label="新有效期">
				  	<c-date-picker disabled type="date" v-model="model.swiadd.newexpdat" style="width:100%" placeholder="请选择日期"></c-date-picker>
				  </el-form-item>
        </c-col>
        <c-col :span="6">
					<el-form-item class="checkbox-left" label-width="10px">
						<c-checkbox disabled  class="checkbox-left" false-label="" true-label="X" v-model="model.swiadd.newexpflg">
								效期敞口
						</c-checkbox>
					</el-form-item>
				</c-col>
			</c-col>

      <c-col :span="24">
        <c-col :span="18">
				  <el-form-item label="新反担保有效期">
				  	<c-date-picker disabled type="date" v-model="model.swiadd.newliadat" style="width:100%" placeholder="请选择日期"></c-date-picker>
				  </el-form-item>
        </c-col>
        <c-col :span="6">
					<el-form-item class="checkbox-left" label-width="10px">
						<c-checkbox disabled  class="checkbox-left" false-label="" true-label="X" v-model="model.swiadd.newliaflg">
								效期敞口
						</c-checkbox>
					</el-form-item>
				</c-col>
			</c-col>

			<c-col :span="24">
				<c-col :span="12">
					<el-form-item label="修改日期">
						<c-input disabled v-model="model.amedat" maxlength="12" placeholder="请输入修改日期"></c-input>
					</el-form-item>
				</c-col>
				<c-col :span="12">
					<el-form-item label="是否接受此笔保函修改" label-width="160px">
						<c-select v-model="model.ameflg" disabled dbCode="ameflg">
						</c-select>
					</el-form-item>
				</c-col>
			</c-col>

		</c-col>

		<!-- right -->
		<c-col :span="12" style="padding-left: 20px;">

			<c-col :span="24">
				<el-form-item label="开立方式">
					<c-select disabled v-model="model.nidgrp.rec.hndtyp" maxlength="40" dbCode="hndtyp" placeholder="请输入处理类型"></c-select>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<el-form-item label="保函类型">
					<c-select disabled dbCode="typgar" v-model="model.nidgrp.rec.gartyp" style="width:100%" placeholder="请选择业务类型">
					</c-select>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<el-form-item label="申请人名称">
					<c-input disabled v-model="model.nidgrp.apl.pts.cnnam" maxlength="40" placeholder="请输入名称"></c-input>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<el-form-item label="受益人名称">
					<c-input disabled v-model="model.nidgrp.ben.pts.nam" maxlength="40" placeholder="请输入受益人名称"></c-input>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<el-form-item label="通知行名称">
					<c-input disabled v-model="model.nidgrp.adv.pts.nam" maxlength="40" placeholder="请输入到期日"></c-input>
				</el-form-item>
			</c-col>

			<c-col :span="24">
				<el-form-item label="修改次数">
					<c-input v-model.number="model.amenbr" disabled placeholder="请输入修改次数(减额）"></c-input>
				</el-form-item>
			</c-col>
		</c-col>

		<c-col :span="24">
			<el-table ref="table" :data="codes.tableData" style="width: 100%" class="eContainer-table" row-key="IDX" :highlight-current-row="false" :border="true" @row-click="rowClick">
				<el-table-column type="index" width="55">
					<template slot-scope="scope">
						<el-checkbox :value="scope.row['checked']" @click.stop></el-checkbox>
					</template>
				</el-table-column>
				<c-table-column v-for="(item, key) in trnData.columns" :key="key" :prop="item.prop" :label="item.label" :min-width="item.width" sortable>
					<template v-slot="{ scope }">
						<span>{{ scope.row[item.prop] }}</span>
					</template>
				</c-table-column>
			</el-table>
		</c-col>

	</div>
</template>
<script>
import event from "../event";
import Default from "../model/default";
import moment from "moment";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [event, Default],
  data() {
    return {
      trnData: {
        columns: [
          {
            label: "修改次数",
            prop: "修改次数",
            width: "150"
          },
          {
            label: "保函编号",
            prop: "编号",
            width: "200"
          },
          {
            label: "修改日期",
            prop: "修改日期",
            width: "200"
          },
          {
            label: "币种",
            prop: "币种",
            width: "100"
          },
          {
            label: "修改金额",
            prop: "修改金额",
            width: "150"
          },
          {
            label: "新有效期",
            prop: "新有效期",
            width: "200"
          },
          {
            label: "新有效期敞口",
            prop: "新有效期敞口",
            width: "200"
          },
          {
            label: "新反担保有效期",
            prop: "新反担保有效期",
            width: "200"
          },
          {
            label: "新反担保有效期敞口",
            prop: "新反担保有效期敞口",
            width: "200"
          }
        ],
        data: []
      },
      date: ""
    };
  },
  methods: {
    rowClick(row) {
      this.codes.tableData.map(item => {
        if (item.IDX === row.IDX) {
          this.$set(item, "checked", true);
        } else {
          this.$set(item, "checked", false);
        }
      });
      this.decstmRowSelected(row);
      this.$forceUpdate();
    }
  },
  created: function() {},
};
</script>
<style>
.stream {
  cursor: pointer;
}
</style>