题库维护。刷题软件数据后台
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
ss-tiku-manage-web/src/views/Basic/Role/Comp/RoleEmployee.vue

84 lines
1.7 KiB

2 weeks ago
<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-column label="状态" key="status">
<template #default="scope">
<el-switch
v-model="scope.row.status"
:active-value="0"
active-text="在职"
inactive-text="离职"
:inactive-value="1"
disabled
/>
</template>
</el-table-column>
</el-table>
<Pagination
v-model:limit="pageSize"
v-model:page="currentPage"
:total="total"
@pagination="getList"
/>
</div>
</template>
<script setup name="RoleEmployee">
import { getRoleUsers } from '@/api/system/role'
const props = defineProps({
roleId: {
type: Number
}
})
watch(
() => props.roleId,
(newValue) => {
getList(newValue)
}
)
const loading = ref(false)
const tableList = ref([])
const total = ref(0)
const pageSize = ref(20)
const currentPage = ref(1)
const columns = ref([
{ prop: 'name', label: '姓名', width: '200px' },
{ prop: 'mobile', label: '手机号', width: '150px' },
{ prop: 'deptName', label: '部门' },
{ prop: 'roles', label: '角色' }
])
async function getList() {
loading.value = true
try {
const data = await getRoleUsers({
pageNo: currentPage.value,
pageSize: pageSize.value,
id: props.roleId
})
tableList.value = data.list
total.value = data.total
} finally {
loading.value = false
}
}
onMounted(() => {
getList()
})
</script>
<style lang="scss" scoped></style>