|
|
|
@ -1,6 +1,11 @@
|
|
|
|
<template>
|
|
|
|
<template>
|
|
|
|
<Dialog :title="title" v-model="dialogVisible" :appendToBody="true" width="1080">
|
|
|
|
<Dialog :title="title" v-model="dialogVisible" :appendToBody="true" width="1080">
|
|
|
|
<ContentWrap>
|
|
|
|
<ContentWrap>
|
|
|
|
|
|
|
|
<!-- 新增查询表单区域 -->
|
|
|
|
|
|
|
|
<div v-if="$slots.header" class="search-container">
|
|
|
|
|
|
|
|
<slot name="header"></slot>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
<el-table
|
|
|
|
<el-table
|
|
|
|
ref="tableRef"
|
|
|
|
ref="tableRef"
|
|
|
|
v-loading="loading"
|
|
|
|
v-loading="loading"
|
|
|
|
@ -58,12 +63,14 @@ const props = withDefaults(
|
|
|
|
rowKey?: string
|
|
|
|
rowKey?: string
|
|
|
|
pageSize?: number
|
|
|
|
pageSize?: number
|
|
|
|
initialRows?: any[]
|
|
|
|
initialRows?: any[]
|
|
|
|
|
|
|
|
queryParams?: Record<string, any> // 新增
|
|
|
|
}>(),
|
|
|
|
}>(),
|
|
|
|
{
|
|
|
|
{
|
|
|
|
selectionType: 'multiple',
|
|
|
|
selectionType: 'multiple',
|
|
|
|
rowKey: 'id',
|
|
|
|
rowKey: 'id',
|
|
|
|
pageSize: 10,
|
|
|
|
pageSize: 10,
|
|
|
|
initialRows: () => []
|
|
|
|
initialRows: () => [],
|
|
|
|
|
|
|
|
queryParams: () => ({}) // 默认值
|
|
|
|
}
|
|
|
|
}
|
|
|
|
)
|
|
|
|
)
|
|
|
|
|
|
|
|
|
|
|
|
@ -108,7 +115,8 @@ const refreshSelectionOnTable = async () => {
|
|
|
|
const getList = async () => {
|
|
|
|
const getList = async () => {
|
|
|
|
loading.value = true
|
|
|
|
loading.value = true
|
|
|
|
try {
|
|
|
|
try {
|
|
|
|
const data = await props.fetchApi(queryParams)
|
|
|
|
const params = getQueryParams()
|
|
|
|
|
|
|
|
const data = await props.fetchApi(params)
|
|
|
|
list.value = data.list || []
|
|
|
|
list.value = data.list || []
|
|
|
|
total.value = data.total || 0
|
|
|
|
total.value = data.total || 0
|
|
|
|
await refreshSelectionOnTable()
|
|
|
|
await refreshSelectionOnTable()
|
|
|
|
@ -172,5 +180,31 @@ const submitSelection = () => {
|
|
|
|
dialogVisible.value = false
|
|
|
|
dialogVisible.value = false
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
defineExpose({ open })
|
|
|
|
// 暴露给父组件的方法
|
|
|
|
|
|
|
|
const reload =async () => {
|
|
|
|
|
|
|
|
loading.value = true
|
|
|
|
|
|
|
|
// 这里是你组件内部原有的加载数据逻辑
|
|
|
|
|
|
|
|
await getList()
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// 3. 合并参数:将父组件传入的 queryParams 与内部参数合并
|
|
|
|
|
|
|
|
const getQueryParams = () => {
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
|
|
|
pageNum: queryParams.pageNo || 1,
|
|
|
|
|
|
|
|
pageSize: queryParams.pageSize || 10,
|
|
|
|
|
|
|
|
...props.queryParams // 父组件传入的查询条件
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
// 4. 监听父组件参数变化
|
|
|
|
|
|
|
|
watch(() => props.queryParams, async () => {
|
|
|
|
|
|
|
|
await getList()
|
|
|
|
|
|
|
|
}, { deep: true })
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
defineExpose({ open, reload })
|
|
|
|
</script>
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
|
|
|
|
|
|
.search-container {
|
|
|
|
|
|
|
|
margin-bottom: 10px;
|
|
|
|
|
|
|
|
padding: 0 0px;
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
</style>
|
|
|
|
|