feat(projects): 服务机构筛选改多选 remote el-select (前端)

- 服务机构 el-input → 多选 remote el-select (跟 sponsor 镜像)
- q.execOrgName → q.execAdminUserIds (List<Long>)
- 新增 executorOrgOptions / execSearching / _executorFilterTimer
- 新增 searchExecutorOrgsForFilter (200ms debounce + 已选 userId 重拉回保证 label)
This commit is contained in:
郭庆泰
2026-08-20 22:31:52 +08:00
parent 8d50450606
commit e462eeaa09
+50 -3
View File
@@ -20,7 +20,23 @@
<el-option v-for="o in sponsorOrgOptions" :key="o.userId" :label="o.orgName" :value="o.userId" />
</el-select>
</el-form-item>
<el-form-item label="服务机构:"><el-input v-model="q.execOrgName" placeholder="输入服务机构" clearable /></el-form-item>
<el-form-item label="服务机构:">
<el-select
v-model="q.execAdminUserIds"
multiple
filterable
remote
:remote-method="searchExecutorOrgsForFilter"
:loading="execSearching"
clearable
collapse-tags
collapse-tags-tooltip
placeholder="输入服务机构名称搜索"
style="width:260px"
>
<el-option v-for="o in executorOrgOptions" :key="o.userId" :label="o.orgName" :value="o.userId" />
</el-select>
</el-form-item>
<el-form-item label="项目编号:"><el-input v-model="q.projectNo" placeholder="输入项目编号" clearable /></el-form-item>
<el-form-item label="项目名称:"><el-input v-model="q.projectName" placeholder="输入项目名称" clearable /></el-form-item>
<el-form-item label="项目形式:">
@@ -304,7 +320,7 @@ const userStore = useUserStore()
const router = useRouter()
const route = useRoute()
const q = ref({ sponsorAdminUserIds: [], execOrgName: '', projectNo: '', projectName: '', projectForm: '', startTime: '', endTime: '', isFinished: '', isSettled: '', managerScore: '' })
const q = ref({ sponsorAdminUserIds: [], execAdminUserIds: [], projectNo: '', projectName: '', projectForm: '', startTime: '', endTime: '', isFinished: '', isSettled: '', managerScore: '' })
const rows = ref([])
const loading = ref(false)
const page = reactive({ pageNum: 1, pageSize: 10, total: 0 })
@@ -354,7 +370,7 @@ async function doDelete(row) {
}
}
function reset() { q.value = { sponsorAdminUserIds:[], execOrgName:'', projectNo:'', projectName:'', projectForm:'', startTime:'', endTime:'', isFinished:'', isSettled:'', managerScore:'' }; page.pageNum = 1; load() }
function reset() { q.value = { sponsorAdminUserIds:[], execAdminUserIds:[], projectNo:'', projectName:'', projectForm:'', startTime:'', endTime:'', isFinished:'', isSettled:'', managerScore:'' }; page.pageNum = 1; load() }
// 导出
function exportProjects() { ElMessage.info('导出项目功能开发中') }
@@ -646,6 +662,10 @@ const sponsorOrgOptions = ref([])
const sponsorSearching = ref(false)
let _supporterTimer = null
let _supporterFilterTimer = null
// 顶部筛选区专用: 与 assignForm.row._options 隔离 (row 级是每行一个 _options)
const executorOrgOptions = ref([])
const execSearching = ref(false)
let _executorFilterTimer = null
// 已分配场次合计 (实时)
@@ -747,6 +767,33 @@ function searchSponsorOrgsForFilter(query) {
}, 200)
}
// 顶部筛选区远程搜索 (服务机构多选 el-select, 加 loading + 已选项重拉回)
function searchExecutorOrgsForFilter(query) {
if (_executorFilterTimer) clearTimeout(_executorFilterTimer)
execSearching.value = true
_executorFilterTimer = setTimeout(async () => {
try {
const params = {}
if (query) params.orgName = query
const r = await listExecutorOrgs(params)
executorOrgOptions.value = r.data || []
// 已选项不在结果里时按 userId 单独拉回 (multi-select 必须保证每个已选 tag 都有 label)
const ids = q.value.execAdminUserIds || []
for (const uid of ids) {
if (!executorOrgOptions.value.find(u => u.userId === uid)) {
const r2 = await listExecutorOrgs({ userId: uid })
const sel = (r2.data || []).find(u => u.userId === uid)
if (sel) executorOrgOptions.value = [sel, ...executorOrgOptions.value]
}
}
} catch (e) {
executorOrgOptions.value = []
} finally {
execSearching.value = false
}
}, 200)
}
// 选中支持方后回填 user_name (缓存到 biz_project.sponsor_admin_user_name)
function onSponsorOrgPick(userId) {
const u = sponsorOrgOptions.value.find(x => x.userId === userId)