45 lines
1.3 KiB
Vue
45 lines
1.3 KiB
Vue
|
<script setup lang="ts">
|
||
|
|
import { ref, onMounted } from "vue";
|
||
|
|
import { getUserList } from '@/api/modules/message'
|
||
|
|
const selectUserList = ref([]);
|
||
|
|
const userList = ref([])
|
||
|
|
function getRef() {
|
||
|
|
return selectUserList.value;
|
||
|
|
}
|
||
|
|
const multipleTable = ref(null)
|
||
|
|
const props = defineProps(["userList"]);
|
||
|
|
const getAllUserList = async () => {
|
||
|
|
const { code, data } = await getUserList()
|
||
|
|
userList.value = code ? data : []
|
||
|
|
setTimeout(() => {
|
||
|
|
if (userList.value.length) {
|
||
|
|
userList.value.forEach(ele => {
|
||
|
|
const listData = props.userList.map(e => { return Number(e) })
|
||
|
|
if (listData.includes(ele.id)) {
|
||
|
|
selectUserList.value.push()
|
||
|
|
multipleTable.value.toggleRowSelection(ele, true)
|
||
|
|
}
|
||
|
|
})
|
||
|
|
}
|
||
|
|
}, 500)
|
||
|
|
}
|
||
|
|
function handleSelectionChange(val) {
|
||
|
|
selectUserList.value = val
|
||
|
|
}
|
||
|
|
onMounted(() => {
|
||
|
|
getAllUserList()
|
||
|
|
})
|
||
|
|
defineExpose({ getRef });
|
||
|
|
</script>
|
||
|
|
<template>
|
||
|
|
<div style="margin-bottom: 20px;">
|
||
|
|
<el-table ref="multipleTable" :data="userList" row-key="id" border style="width: 100%" max-height="550"
|
||
|
|
@selection-change="handleSelectionChange">
|
||
|
|
<el-table-column type="selection" width="55">
|
||
|
|
</el-table-column>
|
||
|
|
<el-table-column prop="nickname" label="用户名">
|
||
|
|
</el-table-column>
|
||
|
|
</el-table>
|
||
|
|
</div>
|
||
|
|
</template>
|