<template>
  <div>
    <el-table v-loading="loading" :data="tableList" border>
      <el-table-column type="index" width="50" />
      <el-table-column
        v-for="col in columns"
        :prop="col.prop"
        :key="col.prop"
        :label="col.label"
        :width="col.width"
      />
    </el-table>
    <Pagination
      v-model:limit="pageSize"
      v-model:page="currentPage"
      :total="total"
      @pagination="getList"
    />
  </div>
</template>

<script setup name="RoleEmployee">
const loading = ref(false)
const tableList = ref([])
const total = ref(0)
const pageSize = ref(20)
const currentPage = ref(1)

const columns = ref([
  { prop: 'userName', label: '姓名' },
  { prop: '', label: '手机号' },
  { prop: '', label: '部门' },
  { prop: '', label: '角色', width: '300px' },
  { prop: '', label: '性别' }
])

function getList() {
  tableList.value = [{ userName: '测试', phone: '18899998888' }]
}

onMounted(() => {
  getList()
})
</script>

<style lang="scss" scoped></style>
