<template>
  <div class="app-container">
    <div class="filter-container" style="margin: 10px 0 10px 0">

      <el-input v-model="supplierName" style="width:65%;" placeholder="供应商名称" size="small" clearable />
      <el-button class="filter-item" icon="el-icon-search" type="primary" plain @click="Search({supplierName:supplierName})">搜索</el-button>
      <!-- <el-button type="primary" round @click="Search({supplierName:supplierName})">DEBUG重请求</el-button> -->
    </div>

    <el-table v-loading="loading" :data="tableData" border style="width: 100%">
      <el-table-column type="selection" />

      <el-table-column label="供应商编码" width="100" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <!-- supplierCode -->
          <span>{{ scope.row.supplierCode }}</span>
        </template>
      </el-table-column>

      <el-table-column label="供应商名称" width="100" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.supplierName }}</span>
        </template>
      </el-table-column>

      <!-- <el-table-column label="联系人" width="70" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.linkName }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="供应商电话" width="125" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.mobile }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="供应商邮箱" width="125" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.email }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="供应商地址" width="100" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.address }}</span>
        </template>
      </el-table-column> -->

      <el-table-column label="可用余额" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.balance }}</span>
        </template>
      </el-table-column>

      <!-- <el-table-column label="累计消费" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.consumeAmount }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="累计充值" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.rechargeAmount }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="创建者" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.creator }}</span>
        </template>
      </el-table-column> -->

      <el-table-column label="创建时间" width="160" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.createTime }}</span>
        </template>
      </el-table-column>

      <!-- <el-table-column label="修改者" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.updator }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="修改时间" width="160" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.updateTime }}</span>
        </template>
      </el-table-column> -->

      <el-table-column label="是否有效" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span v-if="scope.row.isValid==1">有效</span>
          <span v-if="scope.row.isValid==2">无效</span>
        </template>
      </el-table-column>

      <!-- <el-table-column label="接入帐号" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.account }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="接入密码" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.passwd }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="接入密钥" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.appKey }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="下单URL" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.makeOrderUrl }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="查询URL" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.queryUrl }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="扩展URL" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.extUrl }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="回调URL" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.callBackUrl }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="版本" width="50" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.version }}</span>
        </template>
      </el-table-column> -->

      <el-table-column label="限速" width="100" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.ratio }}</span>
        </template>
      </el-table-column>

      <!-- <el-table-column label="后台地址" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.manageUrl }}</span>
        </template>
      </el-table-column> -->

      <!-- <el-table-column label="报警额度" width="80" align="center" show-overflow-tooltip>
        <template slot-scope="scope">
          <span>{{ scope.row.alertBalance }}</span>
        </template>
      </el-table-column> -->
      <el-table-column label="操作" fixed="right" min-width="150" align="center">
        <template slot-scope="scope">
          <el-button type="text" icon="el-icon-edit" @click="handleEdit(scope.row)">至无效</el-button>
          <el-button type="text" icon="el-icon-edit" @click="handleDelete(scope.row)">编辑</el-button>
          <el-button type="text" icon="el-icon-delete" @click="handleDelete(scope.row)">删除</el-button>
        </template>
      </el-table-column>

    </el-table>
  </div>
</template>

<script>

import api from '@/api/channel.js'

export default {
  data() {
    return {
      supplierName: '',
      tableData: []
    }
  },
  created() {
    // page, channelSupplier, param1, param2
    this.Search()
  },
  methods: {
    Search(operator) {
      api.Search(operator).then((res) => {
        // console.log(res)
        this.tableData = res.data.data.records
      })
    }
  }
}
</script>

<style>

</style>
