<template>
  <div class="flex-container" >
    <div class="table-page-search-wrapper">
      <!-- 搜索区域 -->
      <a-form layout="inline">
        <a-row :gutter="24">
          <a-col :md="6" :sm="24">
            <span class="table-page-search-submitButtons ws-btn-row">
              <a-button  type="primary" @click="add">新增</a-button>
            </span>
          </a-col>
        </a-row>
      </a-form>
    </div>
    <s-table
      :columns="columns"
      :data="rowdata"
      bordered
      ref="table"
      size="small"
      class="flex-filling"
      :showPagination="false"
      rowKey="COLUMN_NAME"
    >
      <template slot="operation" slot-scope="text, record">
        <span>
          <a @click="edit(record.id,record.tableName)">修改</a>
          <a-divider type="vertical" />
          <a-popconfirm title="是否要删除此行？" @confirm="remove(record.id)">
            <a>删除</a>
        </a-popconfirm>
        </span>
      </template>
    </s-table>
  </div>
</template>

<script>
import {reportList,reportDelete} from "../../api/system";
import STable from '@/components/table'

export default {
  name: "reportList",
  components:{
    STable
  },
  data(){
    return {
      columns:[
        {dataIndex:"tableName",title:"表名"},
        {title:"操作",key:"action", scopedSlots: { customRender: 'operation' }}
      ],
      rowdata:(parameter) =>{
        return  reportList().then(res =>{
          if (res.state !== 'success') {
            return {
              data: [],
              pageSize: parameter.pageSize,
              pageNo: 1,
              totalCount: 0
            }
          }
          return {
            data: res.data.records,
            pageSize: parameter.pageSize,
            pageNo: parameter.pageNo,
            totalCount: res.data.total
          }
        })
      }
    }
  },
  methods:{
    add(){
      this.$router.push({name:"reportManage",params:{type:"add"}});
    },
    edit(id,tableName){
      this.$router.push({name:"reportManage",params:{type:"edit",id,tableName}});
    },
    reflashTable() { //刷新表格
      this.$refs.table.refresh({ search: true })
    },
    remove(id){ //删除
      reportDelete({id}).then(() =>{
        this.reflashTable();
      })
    }
  }
}
</script>

<style scoped>

</style>
