Infsea.vue

<template>
  <div class="eibs-tab">
    <!-- 持续展示区 -->
    <c-list-search
      @form-reset="handleReset"
      @form-search="handleSearch"
    >
      <template v-slot="searchSlot">
        <el-form
          class="m-table-search-form"
          ref="paramsForm"
          label-position="right"
          label-width="110px"
          size="small"
          :model="model"
        >
          <c-row>
            <c-col :span="24">
              <c-col :span="12" style="padding-right: 20px">
                <el-form-item label="Account No." prop="extkey">
                  <c-input
                    v-model="model.extkey"
                    placeholder="请输入Account No"
                  >
                  </c-input>
                </el-form-item>
              </c-col>
              <c-col :span="12" style="padding-left: 20px">
                <el-form-item label="Name of Account Owner" prop="nam">
                  <c-input
                    v-model="model.nam"
                    placeholder="请输入Name of Account Owner"
                  >
                  </c-input>
                </el-form-item>
              </c-col>
            </c-col>
          </c-row>

          <!-- 可控展示区 -->
          <c-row v-show="searchSlot.searchToggle">
            <c-col :span="24">
              <c-col :span="12" style="padding-right: 20px">
                <c-col :span="24">
                  <el-form-item label="Holding Party" prop="hdlpty.extkey">
                    <c-input
                      v-model="model.hdlpty.extkey"
                      placeholder="请输入 Holding Party"
                    >
                    </c-input>
                  </el-form-item>
                </c-col>
                <c-col :span="24">
                  <el-form-item label="Type" prop="typ">
                    <c-select
                      v-model="model.typ"
                      style="width: 100%"
                      placeholder="请输入type"
                    >
                      <el-option
                        v-for="item in codes.recgrptyp"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </c-select>
                  </el-form-item>
                </c-col>
              </c-col>
              <c-col :span="12" style="padding-left: 20px">
                <c-col :span="24">
                  <c-form-item label="IBAN" prop="iban">
                    <c-input
                      v-model="model.iban"
                      placeholder="请输入IBAN"
                    ></c-input>
                  </c-form-item>
                </c-col>
                <c-col :span="24">
                  <el-form-item :label="'Currency'" prop="cur">
                    <c-select
                      v-model="model.cur"
                      style="width: 100%"
                      :placeholder="'请输入Currency'"
                    >
                      <el-option
                        v-for="item in codes.curtxt1"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      >
                      </el-option>
                    </c-select>
                  </el-form-item>
                </c-col>
              </c-col>
            </c-col>
          </c-row>
        </el-form>
      </template>
    </c-list-search>

    <el-row>
      <c-col :span="24">
        <c-istream-table
          :list="stmData.data"
          :columns="stmData.columns"
          :showButtonFlg="true"
        >
          <el-table-column fixed="right" prop="op" width="150px">
            <template slot="header">
              <c-col :span="11" style="text-align: center"
                ><span>操作</span></c-col
              >

            </template>
            <template slot-scope="scope">
              <el-popover
                placement="top-start"
                title="历史信息"
                width="800"
                trigger="click"
                :ref="'popover_' + scope.row.IDX"
              >
                <div
                  style="
                    text-align: right;
                    margin-top: -30px;
                    margin-right: 5px;
                    font-size: 16px;
                  "
                >
                  <span
                    class="el-icon-close"
                    @click="closeTrn('popover_' + scope.row.IDX)"
                  />
                </div>
                <c-istream-table
                  :list="trnData.data"
                  :columns="trnData.columns"
                >
                  <el-table-column prop="op" label="操作" width="0">
                    <template slot-scope="scope">
                      <c-button
                        style="margin-left: 0"
                        size="small"
                        type="primary"
                        @click="display(scope.row['INR'])"
                      >
                        查看详情
                      </c-button>
                    </template>
                  </el-table-column>
                </c-istream-table>
                <c-button
                  style="margin-left: 0"
                  size="small"
                  @click="getTrnInfo(scope.$index, scope.row)"
                  slot="reference"
                >
                  详情
                </c-button>
              </el-popover>
            </template>
          </el-table-column>
        </c-istream-table>
      </c-col>
    </el-row>
  </div>
</template>
<script>
import Api from "~/service/Api";
import commonProcess from "~/mixin/commonProcess";
import CodeTable from "~/config/CodeTable";
import Event from "~/model/Infact/Event";

export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [commonProcess],
  data() {
    return {
      trnData: {
        columns: [
          '0 8 "交易ID" 100',
          '1 1 "编号" 150',
          '2 2 "交易名称" 195',
          '3 3 "条目" 80 4 7',
          {
            index: 4,
            position: 4,
            width: 100,
            pattern: "code",
            label: "状态",
            code: this.codes.relstaEN,
          },
          '5 5 "币种" 80',
          '6 6 "相关金额" 150 2 8 1 5',
          '7 7 "标识" 100',
        ],

        data: [],
      },

      stmData: {
        columns: [
          '8 1 "Account Owner" 180 ',
          '3 2"Typ" 160',
          '4 3 "Cur" 160',
          '5 4 "Account No." 180',
          '6 5 " Owner Number" 180 ',

          '9 6 "Servicing Party " 160',
          '10 7 "Servicing Number" 160',
        ],
        data: [],
      },
    };
  },
  computed: {
    tableData() {
      return this.model.infbut.dspstm.rows;
    },
    /*  stmData() {

console.log(this.model.infbut.dspstm.rows);
return this.model.infbut.dspstm.rows;
} */
  },
  methods: {
    chooseRowEvent(row) {
      this.model.infbut.selrow = row.IDX + 1;
    },
    closeTrn(refId) {
      this.$refs[refId].doClose();
    },
    async getTrnInfo(idx, row) {
      this.model.infcon.objinr = row["INR"];
      this.model.ledgrp.rec.inr = row["INR"];
      this.model.infcon.chksubcon = "X";

      this.dialogTableVisible = true;
      let rtnmsg = await this.executeDefault("infbut.dspstm");

      if ((rtnmsg.respCode = SUCCESS)) {
        this.trnData.data = rtnmsg.data.infbut_dspstm.rows;
      }
    },

    ...Event,
  },
  created: function () {},
};
</script>
<style>
</style>