55 lines
1.7 KiB
Vue
55 lines
1.7 KiB
Vue
<script setup lang="ts">
|
|
import { ref, onMounted } from "vue";
|
|
import SearchForm from "@/components/SearchForm/index.vue";
|
|
import { getUserList } from '@/api/modules/message'
|
|
const selectUserList = ref([]);
|
|
const userList = ref([])
|
|
function getRef() {
|
|
return selectUserList.value;
|
|
}
|
|
const searchLabel = ref([
|
|
{ label: "用户ID", prop: "user_code", type: "input" }
|
|
]);
|
|
const searchForm = ref({})
|
|
const multipleTable = ref(null)
|
|
const onSearch = (formData) => {
|
|
userList.value = []
|
|
selectUserList.value = []
|
|
getAllUserList(formData)
|
|
}
|
|
const props = defineProps(["userList"]);
|
|
const getAllUserList = async (form) => {
|
|
const { code, data } = await getUserList({ ...form })
|
|
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)) {
|
|
multipleTable.value.toggleRowSelection(ele, true)
|
|
}
|
|
})
|
|
}
|
|
}, 500)
|
|
}
|
|
function handleSelectionChange(val) {
|
|
selectUserList.value = val
|
|
}
|
|
onMounted(() => {
|
|
getAllUserList(searchForm.value)
|
|
})
|
|
defineExpose({ getRef });
|
|
</script>
|
|
<template>
|
|
<div style="margin-bottom: 20px;">
|
|
<SearchForm class="pb-2" :LabelList="searchLabel" :formData="searchForm" @handleSearch="onSearch"></SearchForm>
|
|
<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>
|