<!-- 保证金公共页面 -->

<template>
  <div class="eibs-tab">
    <c-col :span="24">
      <c-col :span="12">
        <el-form-item label="合同金额" prop="liaall.liaccv.concur">
          <c-row>
            <c-col :span="8">
              <c-select
                v-model="model.liaccv.concur"
                disabled
                style="width: 95%"
                placeholder=""
              >
                <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.liaccv.newamt"></c-input>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="应收比例" prop="liaccv.cshpct">
          <c-row>
            <c-col :span="22">
              <c-input v-model="model.liaccv.cshpct"></c-input>
            </c-col>
            <c-col :span="1" style="float: right; text-align: right">
              <span>%</span>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="24">
      <c-col :span="12">
        <el-form-item label="保留金额" prop="liaccv.newresamt">
          <c-row>
            <c-col :span="8">
              <c-select
                v-model="model.liaccv.concur"
                disabled
                style="width: 95%"
                placeholder=""
              >
                <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.liaccv.newresamt"
              ></c-input>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="实收比例" prop="liaccv.relcshpct">
          <c-row>
            <c-col :span="22">
              <c-input
                :readonly="true"
                v-model="model.liaccv.relcshpct"
              ></c-input>
            </c-col>
            <c-col :span="1" style="float: right; text-align: right">
              <span>%</span>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>
    </c-col>

    <c-col :span="24">
      <c-col :span="12">
        <el-form-item label="应付金额" prop="liaccv.concur">
          <c-row>
            <c-col :span="8">
              <c-select
                v-model="model.liaccv.concur"
                disabled
                style="width: 95%"
                placeholder=""
              >
                <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.liaccv.pctresamt"
              ></c-input>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>

      <c-col :span="12">
        <el-form-item label="" style="text-align: left" prop="liaccv.gleflg">
          <c-col :span="7" class="">
            <el-form-item
              label=""
              prop="liaccv.gleflg"
              class="checkbox-left"
              label-width="0px"
            >
              <c-checkbox v-model="model.liaccv.gleflg">过账</c-checkbox>
            </el-form-item>
          </c-col>
          <c-button
            size="small"
            type="primary"
            @click="onLiaccvAdd"
            style="margin-left: 0px; float: right"
          >
            添加
          </c-button>
        </el-form-item>
      </c-col>
    </c-col>

    <template>
      <el-dialog :visible.sync="dialogTableVisible" width="60%" center>
        <el-table
          :data="stmData.data"
          :columns="stmData.columns"
          :showButtonFlg="true"
        >
          <el-table-column
            v-for="(item, key) in stmData.columns"
            :key="key"
            :label="item.label"
            :prop="item.prop"
            :width="item.width"
          ></el-table-column>
          <el-table-column prop="op" label="OP" width="80" fixed="right">
            <template slot-scope="scope">
              <c-button
                style="margin-left: 0"
                size="small"
                type="primary"
                @click="pickDepItem(scope.$index, scope.row)"
              >
                选择
              </c-button>
            </template>
          </el-table-column>
        </el-table>
      </el-dialog>
    </template>
    <c-col :span="24">
      <c-table
        :border="true"
        :list="model.liaccv.liaccvg"
        :total="model.liaccv.liaccvg.length"
        style="width:100%,text-align:center"
      >
        <el-table-column prop="ccdflg" label="调整标识" width="70px">
        </el-table-column>
        <el-table-column prop="ownref" label="保证金编号" width="180px">
        </el-table-column>
        <el-table-column prop="cur" label="币种" width="70px">
        </el-table-column>
        <el-table-column prop="oldamt" label="余额" width="110px">
        </el-table-column>
        <el-table-column prop="amt" label="变动金额" width="110px">
        </el-table-column>
        <el-table-column prop="acc" label="保证金账号" width="180px">
        </el-table-column>
        <el-table-column prop="rat" label="汇率" width="150px">
        </el-table-column>
        <el-table-column prop="concur" label="币种" width="70px">
        </el-table-column>
        <el-table-column prop="covamt" label="折算后金额" width="110px">
        </el-table-column>
        <el-table-column prop="acccovamt" label="实际折算金额" width="150px">
        </el-table-column>
        <el-table-column label="操作" width="auto" fixed="right" align="center">
          <template slot-scope="scope">
            <c-button
              style="margin-left: 0"
              type="primary"
              size="small"
              @click="onLiaccvDel(scope.$index, scope.row)"
            >
              删除</c-button
            >
          </template>
        </el-table-column>
      </c-table>
    </c-col>

    <c-col :span="12" style="margin-top: 25px">
      <c-col :span="24">
        <el-form-item label="折算金额总和">
          <c-row>
            <c-col :span="8">
              <c-select
                v-model="model.liaccv.concur"
                disabled
                style="width: 95%"
                placeholder=""
              >
                <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
                v-model="model.liaccv.totcovamt"
                :readonly="true"
              ></c-input>
            </c-col>
          </c-row>
        </el-form-item>
      </c-col>

      <c-col :span="24">
        <el-form-item label="附加信息 " v-if="model.liaccv.addinf != ''">
          <c-input
            type="textarea"
            :rows="5"
            v-model="model.liaccv.addinf"
            maxlength="200"
            show-word-limit
            placeholder="请输入附加信息"
          ></c-input>
        </el-form-item>
      </c-col>
    </c-col>
  </div>
</template>
<script>
import Event from '../event';
import Api from '~/service/Api';
import commonProcess from '~/mixin/commonProcess';
import Utils from '~/utils/index';

export default {
  inject: ['root'],
  props: ['model', 'codes'],
  mixins: [commonProcess],
  data() {
    return {
      dialogTableVisible: false,
      stmData: {
        columns: [
          {
            label: '编号',
            prop: 'ownref',
          },
          {
            label: '用户',
            prop: 'ownusr',
          },
          {
            label: '申请人',
            prop: 'aplnam',
            width: 180,
          },
          {
            label: '账户',
            prop: 'engact',
          },
          {
            label: '币种',
            prop: 'cur',
          },
          {
            label: '金额',
            prop: 'amt',
          },
          {
            label: '开立日期',
            prop: 'opndat',
          },
          {
            label: '标志',
            prop: 'gleflg',
          },
          {
            label: '备注',
            prop: 'reason',
          },
        ],
        data: [],
      },
      relrowDisabled: true,
    };
  },
  methods: {
    ...Event,
    async onLiaccvAdd() {
      let liaccvRequest = this.root.buildLiaccv();
      let objtyp = liaccvRequest.rec.objtyp;
      let rulePath = `/service/${ objtyp.toLowerCase() }/getFcdList`;
      let rtnmsg = await Api.post(rulePath, liaccvRequest);
      if (rtnmsg.respCode == SUCCESS) {
        this.dialogTableVisible = true;
        this.stmData.data = rtnmsg.data;
      }
    },
    async pickDepItem(idx, row) {
      let liaccvRequest = this.root.buildLiaccv();
      let objtyp = liaccvRequest.rec.objtyp;
      let rulePath = `/service/${ objtyp.toLowerCase() }/addLiaccvg`;
      liaccvRequest.fcdVo = row;
      let rtnmsg = await Api.post(rulePath, liaccvRequest);
      if (rtnmsg.respCode == SUCCESS) {
        this.dialogTableVisible = false;
        Utils.copyValueFromVO(this.model.liaccv, rtnmsg.data);
      }
    },
    async onLiaccvDel(index, row) {
      let fcdVo = {
        inr: row.fcdinr,
      };
      let liaccvRequest = this.root.buildLiaccv();
      let objtyp = liaccvRequest.rec.objtyp;
      let rulePath = `/service/${ objtyp.toLowerCase() }/deleteLiaccvg`;
      liaccvRequest.fcdVo = fcdVo;
      let rtnmsg = await Api.post(rulePath, liaccvRequest);
      if (rtnmsg.respCode == SUCCESS) {
        Utils.copyValueFromVO(this.model.liaccv, rtnmsg.data);
        this.$message({
          type: 'success',
          message: '删除成功！',
        });
      } else {
        this.$notify.error({ title: '错误', message: '服务请求失败！' });
      }
    },
  },
  created() {},
};
</script>
<style></style>