<template>
  <div class="transaction-box">
    <div class="search">
      <div />
      <div class="right">
        <div>
          <el-input v-model="search.fastSearch" placeholder="请输入平台订单号/平台支付订单号" />
        </div>
        <div>
          <el-input v-model="search.fastSearch" placeholder="请输入对方账号/对方户名/对方行名" />
        </div>
        <div>
          <el-input v-model="search.fastSearch" placeholder="请输入账号/户名" />
        </div>
        <div>
          <el-select v-model="search.status" placeholder="请选择收支类型" clearable>
            <el-option
              v-for="item in []"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </div>
        <div>
          <el-select v-model="search.status" placeholder="请选择业务类型" clearable>
            <el-option
              v-for="item in []"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </div>
        <div>
          <el-select v-model="search.status" placeholder="请选择交易状态" clearable>
            <el-option
              v-for="item in []"
              :key="item.code"
              :label="item.name"
              :value="item.code"
            />
          </el-select>
        </div>
        <div>
          <el-date-picker
            v-model="search.date"
            type="daterange"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
            style="width: 260px"
          >
          </el-date-picker>
        </div>
        <div>
          <el-button type="primary" @click="fetchData('all')">查询</el-button>
        </div>
      </div>
    </div>
    <cy-comm-table
      ref="commTable"
      v-loading="loading"
      :columns="columns"
      :data="tableData"
      :count="total"
    />
  </div>
</template>

<script>
export default {
  data() {
    return {
      search: {
        date: []
      },
      loading: false,
      total: 0,
      tableData: [{ supplierName: '11111' }],
      columns: [
        {
          label: '序号',
          index: true
        },
        {
          label: '平台订单号',
          prop: 'supplierName',
          showTooltip: true,
          width: 110
        },
        {
          label: '平台支付订单号',
          prop: 'supplierName',
          showTooltip: true,
          width: 120
        },
        {
          label: '账号',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '账户名称',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '收支类型',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '业务类型',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '币种',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '金额',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '手续费',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '交易类型',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '对方账号',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '可用余额',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '对方地址',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '对方户名',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '对方行名',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '交易后余额',
          prop: 'supplierName',
          showTooltip: true,
          width: 110
        },
        {
          label: '对方行号',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '交易状态',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '附言',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '流水号',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '流水序号',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '关联订单号',
          prop: 'supplierName',
          showTooltip: true,
          width: 110
        },
        {
          label: '支付订单号',
          prop: 'supplierName',
          showTooltip: true,
          width: 110
        },
        {
          label: '失败原因',
          prop: 'supplierName',
          showTooltip: true
        },
        {
          label: '平台业务编号',
          prop: 'supplierName',
          showTooltip: true,
          width: 120
        },
        {
          label: '平台流水号',
          prop: 'supplierName',
          showTooltip: true,
          width: 110
        },
        {
          label: '交易创建时间',
          prop: 'supplierName',
          showTooltip: true,
          width: 120
        },
        {
          label: '交易完成时间',
          prop: 'supplierName',
          showTooltip: true,
          width: 120
        }
      ]
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
