<!--  -->
<template>
  <div>
    <normalLayout  @onRefresh="inputChange">
      <div slot="titleRight">
        <Add v-if="tool.checkAuth($route.name,'insert')" @onSuccess="listData()"/>
      </div>
      <div slot="content">
        <div class="normal-card">
          <div style="display:flex;align-items:center;margin-bottom:10px">
            <el-input
              placeholder="请输入搜索内容"
              suffix-icon="el-icon-search"
              v-model="params.content.where.condition"
              style="width:200px"
              size="mini"
              class="input-with-select inline-16"
              @keyup.native.enter="listData(params.content.pageNumber=1)"
              @clear="listData(params.content.where.condition='',params.content.pageNumber=1)"
              clearable>
            </el-input>
          </div>
          <Table :tableData="list">

          </Table>
          <div style="margin-top:16px;text-align:right">
            <el-pagination
                background
                small
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="params.content.pageNumber"
                :page-size="params.content.pageSize"
                layout="total, prev, pager, next, jumper"
                :total="total">
            </el-pagination>
          </div>
        </div>
      </div>
    </normalLayout>
  </div>
</template>

<script>
import Table from './modules/table'
import Add from './components/add'
import {mapGetters} from "vuex";
export default {
  data () {
    return {
      params: {
        "id": "20230110100103",
        "version":1,
        "content": {
          "where":{
              "condition":""
          }
        }
      },
      total:0,
      list:[]
    }
  },
  components:{Table,Add},
  created () {
    this.listData()
  },
  methods: {
    async listData(){
      const res = await this.$api.requested(this.params)
      this.list = res.data
      this.total = res.total
      console.log(this.list)
    },
    handleSizeChange(val) {
      // console.log(`每页 ${val} 条`);
      this.params.content.pageSize = val
      this.listData()
    },
    handleCurrentChange(val) {
      // console.log(`当前页: ${val}`);
      this.params.content.pageNumber = val
      this.listData()
    },
    inputChange () {

    }
  },
  computed: {
    ...mapGetters({
      DrawerShow:'DrawerShow'
    })
  },
  watch: {
    $route (val) {
      console.log(val,'val的数据')
      if (val.path == '/collectionRule') {
        this.listData()
      }
    },
    DrawerShow (val) {
      val ? this.drawer = true : this.drawer = false
    }
  },
}
</script>

<style  scoped>

</style>
