<template>
  <div class="eibs-tab">
    <!--                                        
       <c-col :span="12">
        <el-form-item label="应付保证金金额">
            <c-input  v-model="model.liaall.liaccv.concur" maxlength="3"  placeholder="请输入应付保证金金额"></c-input>
        </el-form-item>
       </c-col>
       -->
    <c-col :span="12">
      <el-form-item label="合同金额" prop="liaall.liaccv.concur">
        <c-row>
          <!--                <c-col :span="8">-->
          <!--                    <c-input type="text" :readonly="true" value="CNY"></c-input>-->
          <!--                </c-col>-->
          <c-col :span="8">
            <c-select
              v-model="model.liaall.liaccv.concur"
              disabled
              style="width: 95%"
              placeholder="请选择Type of settlement"
            >
              <el-option
                v-for="item in codes.curtxt"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </c-col>
          <c-col :span="16">
            <c-input
              :readonly="true"
              v-model="model.liaall.liaccv.newamt"
            ></c-input>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col>
    <!--
       <c-col :span="12">
        <el-form-item label="合同金额">
            <c-input  v-model="model.liaall.liaccv.newamt"  placeholder="请输入合同金额"></c-input>
        </el-form-item>
       </c-col>                                             
       <c-col :span="12">
        <el-form-item label="保证金应收比例">
            <c-input  v-model="model.liaall.liaccv.cshpct"  placeholder="请输入保证金应收比例"></c-input>
        </el-form-item>
       </c-col>
       -->
    <c-col :span="12">
      <el-form-item label="保证金应收比例" prop="liaall.liaccv.cshpct">
        <c-row>
          <c-col :span="20">
            <c-input v-model="model.liaall.liaccv.cshpct"></c-input>
          </c-col>
          <c-col :span="2" style="margin-left: 20px">
            <span>%</span>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col>

    <!--                                             
       <c-col :span="12">
        <el-form-item label="Reserved Amount">
            <c-input  v-model="model.liaall.liaccv.newresamt"  placeholder="请输入Reserved Amount"></c-input>
        </el-form-item>
       </c-col>
       -->
    <c-col :span="12">
      <el-form-item label="Reserved Amount" prop="liaall.liaccv.newresamt">
        <c-row>
          <!--                <c-col :span="8">-->
          <!--                    <c-input type="text" :readonly="true" value="CNY"></c-input>-->
          <!--                </c-col>-->
          <c-col :span="8">
            <c-select
              v-model="model.liaall.liaccv.concur"
              disabled
              style="width: 95%"
              placeholder="请选择Type of settlement"
            >
              <el-option
                v-for="item in codes.curtxt"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </c-col>
          <c-col :span="16">
            <c-input
              :readonly="true"
              v-model="model.liaall.liaccv.newresamt"
            ></c-input>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col>
    <!--                            
       <c-col :span="12">
        <el-form-item label="保证金实收比例">
            <c-input  v-model="model.liaall.liaccv.relcshpct"  placeholder="请输入保证金实收比例"></c-input>
        </el-form-item>
       </c-col>
       -->
    <c-col :span="12">
      <el-form-item label="保证金实收比例" prop="liaall.liaccv.relcshpct">
        <c-row>
          <c-col :span="20">
            <c-input
              :readonly="true"
              v-model="model.liaall.liaccv.relcshpct"
            ></c-input>
          </c-col>
          <c-col :span="2" style="margin-left: 20px">
            <span>%</span>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col>

    <!--                            
       <c-col :span="12">
	    <c-checkbox v-model="model.liaall.liaccv.gleflg">Create gle flag</c-checkbox>
       </c-col> 
                                   
       <c-col :span="12">
        <el-form-item label="reserve amount based percent">
            <c-input  v-model="model.liaall.liaccv.pctresamt"  placeholder="请输入reserve amount based percent"></c-input>
        </el-form-item>
       </c-col>                 
                  
       <c-col :span="12">
	    <c-checkbox v-model="model.liaall.liaccv.chgcurflg">Change currency flag</c-checkbox>
       </c-col> 
       -->

    <c-col :span="12">
      <el-form-item label="应付保证金金额" prop="liaall.liaccv.concur">
        <c-row>
          <!--                <c-col :span="8">-->
          <!--                    <c-input type="text" :readonly="true" value="CNY"></c-input>-->
          <!--                </c-col>-->
          <c-col :span="8">
            <c-select
              v-model="model.liaall.liaccv.concur"
              disabled
              style="width: 95%"
              placeholder="请选择Type of settlement"
            >
              <el-option
                v-for="item in codes.curtxt"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </c-col>
          <c-col :span="16">
            <c-input
              :readonly="true"
              v-model="model.liaall.liaccv.pctresamt"
            ></c-input>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col>
    <!--
       <c-col :span="12">
        <c-button size="small" type="primary"  @click="openMask">
            Add
        </c-button>
       </c-col>
                  
       <c-col :span="12">
        <c-button size="small"  icon="el-icon-delete" @click="onLiaccvDel">
            Del
        </c-button>
       </c-col>
       -->
    <c-col :span="11" style="text-align:right">
      <!-- <c-row> -->
        <!-- <c-col :span="24" style="margin-left:35px;text-align:right"> -->
          <c-button size="small" type="primary" @click="onLiaccvAdd">
            Add
          </c-button>
        <!-- </c-col> -->
          

        <!-- <c-col :span="2">
          <c-button size="small" icon="el-icon-delete" @click="onLiaccvDel">
            Del
          </c-button>
        </c-col> -->
      <!-- </c-row> -->
    </c-col>
    <!-- <c-col :span="24"><div style="height: 10px"></div></c-col> -->
    <template>
        <el-dialog
            :visible.sync="dialogTableVisible"
            width="60%"
            center
          >
            <c-istream-table :list="stmData.data" :columns="stmData.columns" :paginationShow="false">
            <el-table-column prop="op" label="OP" width="80" fixed="right">
                <template slot-scope="scope">
                <!-- <a href="javascript:void(0)" type="primary" @click="pickDepItem(scope.$index,scope.row)"
                    >选择</a
                > -->
                    <c-button
                        style="margin-left: 0"
                        size="small"
                        type="primary"
                        @click="pickDepItem(scope.$index,scope.row)"
                        >
                        选择
                    </c-button>
                </template>
            </el-table-column>
            </c-istream-table>
          </el-dialog>
    </template>
    <c-col :span="24">
      <c-table
        :border="true"
        :list="model.liaall.liaccv.liaccvg"
        style="width:80%,text-align:center"
      >
        <el-table-column prop="ccdflg" label="CF000048" width="78px">
        </el-table-column>
        <el-table-column prop="ownref" label="保证金编号" width="130px">
        </el-table-column>
        <el-table-column prop="cur" label="币种" width="55px">
        </el-table-column>
        <el-table-column prop="oldamt" label="余额" width="150px">
        </el-table-column>
        <el-table-column prop="amt" label="变动金额" width="150px">
        </el-table-column>
        <el-table-column prop="acc" label="保证金账号" width="180px">
        </el-table-column>
        <el-table-column prop="rat" label="汇率" width="120px">
        </el-table-column>
        <el-table-column prop="concur" label="币种" width="55px">
        </el-table-column>
        <el-table-column prop="covamt" label="折算后金额" width="150px">
        </el-table-column>
        <el-table-column prop="acccovamt" label="Acc Amount" width="150px">
        </el-table-column>
        <el-table-column label="操作" width="75px" fixed="right">
          <template slot-scope="scope">
            <c-button style="margin-left:0" type="primary" size="small" @click="onLiaccvDel(scope.$index,scope.row)">
            Del</c-button>
          </template>
        </el-table-column>
      </c-table>
    </c-col>

    <!-- <c-col :span="12">
      <el-form-item label="Amount Covered">
        <c-row>
          <c-col :span="8">
            <c-select
              v-model="model.liaall.liaccv.concur"
              disabled
              style="width: 100%"
              placeholder="请选择Type of settlement"
            >
              <el-option
                v-for="item in codes.curtxt"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </c-select>
          </c-col>
          <c-col :span="14">
            <c-input
              v-model="model.liaall.liaccv.totcovamt"
              :readonly="true"
            ></c-input>
          </c-col>
        </c-row>
      </el-form-item>
    </c-col> -->

    <c-col :span="12" style="margin-top:15px">
      <el-form-item label="金额总和">
        <!-- <c-col :span="8"> -->
          <c-input
            style="width: 100%"
            v-model="model.liaall.liaccv.totcovamt"
            placeholder="请输入金额总和"
          ></c-input>
        <!-- </c-col> -->
      </el-form-item>

      <el-form-item label="Additional Information ">
        <c-input
          type="textarea"
          :rows="5"
          v-model="model.liaall.liaccv.addinf"
          maxlength="200"
          show-word-limit
          placeholder="请输入Additional Information "
        ></c-input>
      </el-form-item>
    </c-col>

    <!-- <c-col :span="12">
      <el-form-item label="Additional Information ">
        <c-input
          type="textarea"
          :rows="5"
          v-model="model.liaall.liaccv.addinf"
          maxlength="200"
          show-word-limit
          placeholder="请输入Additional Information "
        ></c-input>
      </el-form-item>
    </c-col> -->
  </div>
</template>
<script>
import Api from "~/service/Api";
import CommonProcess from "~/mixin/CommonProcess";
import CodeTable from "~/config/CodeTable";
import Utils from "~/utils/index"

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [CommonProcess],
  data() {
    return {
      dialogTableVisible: false,
      stmData: {
        columns: [
          '1 1:1 "Ref" 150',
          '2 2:1 "User" 80',
          '3 3:1 "Applicant" 100',
          '4 4:1 "Account" 200',
          '5 5:1 "Cur" 200',
          '6 6:1 "Amt" 100 2 0 1 18.3',
          '7 7:1 "Open date" 80 4 7',
          '8 8:1 "flg" 150',
          '9 9:1 "Remarks" 250',
          "P COLORED TRUE",
          "P VERTLINES TRUE",
          "P HORZLINES TRUE",
          "P MULTISELECT FALSE",
          "P COLUMNSIZING TRUE",
        ],
        data: [],
      },
      relrowDisabled: true,
    };
  },
  methods: {
    async onLiaccvAdd() {
        let rtnmsg = await this.executeRule("liaall.liaccv.add")
        //const that = this.root;
        if (rtnmsg.respCode == SUCCESS) {
            //TODO 处理数据逻辑
            if(typeof(rtnmsg.data.vals) != "undefined"){
                this.stmData.data = rtnmsg.data.vals.rows;
            }else{
                this.stmData.data = [];
            }
            this.dialogTableVisible = true;
        }
        else {
            this.$notify.error({ title: '错误', message: '服务请求失败！' });
        }
    },
    async pickDepItem(idx,row) {
        var params = {selDst:"",selIds:[idx+1]}
        let rtnmsg = await this.executeRule("liaall.liaccv.add", params)
        if (rtnmsg.respCode == SUCCESS) {
            this.dialogTableVisible = false;
            Utils.copyValueFromVO(this.model, rtnmsg.data);
        }
    },
    async onLiaccvDel(index,row) {
        let ids = [index+1];
        let params = {selDst:"liaall.liaccv.liaccvg",selIds:ids};
        let rtnmsg = await this.executeRule("liaall.liaccv.del",params)
        if (rtnmsg.respCode == SUCCESS) {
            //TODO 处理数据逻辑
            this.$message({
                type: 'success',
                message: '删除成功！'
            });
            //this.model.liaall.liaccv.liaccvg = [];
            Utils.copyValueFromVO(this.model, rtnmsg.data);

        }
        else {
            this.$notify.error({ title: '错误', message: '服务请求失败！' });
        }
    },
  },
  created: function () {},
};
</script>
<style>
</style>
