Infsea.vue

<template>
  <div class="eibs-tab">
    <c-list-search @form-reset="handleReset" @form-search="formSubmit">
      <!-- 持续展示区 -->
      <template v-slot="searchSlot">
        <el-form class="m-table-search-form" ref="paramsForm" label-position="right" label-width="110px" size="small"
          :model="model">
          <el-row>
            <c-col :span="8">
              <el-form-item label="主流水号" style="width: 100%">
                <c-input v-model="model.zlsh" maxlength="18" placeholder="请输入主流水号"></c-input>
              </el-form-item>
            </c-col>
            <c-col :span="8">
              <el-form-item label="客户ID" style="width: 100%">
                <c-input v-model="model.khid" maxlength="18" placeholder="请输入客户ID"></c-input>
              </el-form-item>
            </c-col>
            <c-col :span="8">
              <el-form-item label="协议号" style="width: 100%">
                <c-input v-model="model.xyh" maxlength="18" placeholder="请输入协议号"></c-input>
              </el-form-item>
            </c-col>
            
          </el-row>

          <!-- 可控展示区 -->
          <el-row v-show="searchSlot.searchToggle">
            <c-col :span="24">
              <c-col :span="8">
                <el-form-item label="开立日期" style="width: 100%">
                  <c-date-picker type="date" v-model="model.klrq"></c-date-picker>
                </el-form-item>
              </c-col>
              <c-col :span="8">
                <el-form-item label="机构号" style="width: 100%">
                  <c-select v-model="model.jgh" placeholder="请选择机构号" :clearable="true" :code="[]">
                  </c-select>
                </el-form-item>
              </c-col>
            </c-col>
          </el-row>
        </el-form>
      </template>
      <template v-slot:extendsRight>
        <c-button class="medium_bcs" size="medium" type="primary" style="margin-left: 2px">
          导出
        </c-button>
      </template>
    </c-list-search>
    <el-col :span="24" style="margin-top: 10px">
      <c-col :span="24">
        <el-table id='infgidBSTableRef' v-loading="load" :data="tableData" style="width:100%" size="small" :border="true"
          height="calc(100vh - 330px)" :highlight-current-row="true">
          <el-table-column label="机构号" prop="jgh" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="机构名称" prop="jgmc" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="所属分行机构号" prop="ssfhjgh" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="业务类型" prop="ywlx" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="主流水号" prop="zlsh" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="客户ID" prop="khid" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="客户英文名称" prop="khywmc" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="客户中文名称" prop="khzwmc" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="受益人" prop="syr" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="交易币种" prop="jybz" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="交易金额" prop="jyje" align="left" min-width="150">
          </el-table-column>
          <el-table-column label="开立日期" prop="klrq" align="left" min-width="150">
          </el-table-column>
        </el-table>
      </c-col>
    </el-col>

  </div>
</template>
<script>
export default {
  inject: ["root"],
  props: ["model", "codes"],
  mixins: [],
  components: {
  },
  data() {
    return {
      load: false,
      tableData: [],
    };
  },
  watch: {
    
  },
  computed: {},

  mounted() {
    
  },
  methods: {
    handleReset() {

    },
    formSubmit() {

    },
  }
};
</script>
<style scoped lang="less">
.eibs-tabs /deep/ {
  .m-table-search {
    padding: 20px 0px 10px 0px;
  }
}

.header-wrap {
  height: 36px;
  display: flex;
  justify-content: space-between;
  align-items: center;

  .title {
    font-size: 16px;
    color: #000;
  }

  .close-btn {
    padding: 3px;
    cursor: pointer;
  }
}

.m-list-btns {
  height: 300px;
  overflow: auto;
}

.medium_bcs {
  border-radius: 5px;
}
</style>