fix(admin-vue): 编辑用户菜单权限已授权回显失效——树数据就绪后 await nextTick 再 setCheckedKeys(el-tree store 异步同步 props.data,旧实现作用在空 store 上勾选丢失),补源码断言防回归测试

This commit is contained in:
2026-09-09 18:32:44 +08:00
parent b3f7b81b9c
commit 02441565a0
2 changed files with 17 additions and 2 deletions
@@ -1,5 +1,5 @@
<script setup lang="ts"> <script setup lang="ts">
import { computed, onMounted, ref, watch } from 'vue' import { computed, nextTick, onMounted, ref, watch } from 'vue'
import type { MenuOptionNode } from './user-menu-auth' import type { MenuOptionNode } from './user-menu-auth'
import { compactDirectGrantIds } from './user-menu-auth' import { compactDirectGrantIds } from './user-menu-auth'
import { fetchGrantableMenus } from './user-menu-auth-api' import { fetchGrantableMenus } from './user-menu-auth-api'
@@ -43,8 +43,11 @@ async function load(): Promise<void> {
try { try {
data.value = await fetchGrantableMenus() data.value = await fetchGrantableMenus()
loaded.value = true loaded.value = true
applyChecked()
emit('load', true) emit('load', true)
// el-tree 的 store 通过异步 watch 同步 props.datasetCheckedKeys 必须等树
// 渲染完成后再应用已勾选 id,否则作用在空 store 上导致已授权不回显。
await nextTick()
applyChecked()
} catch { } catch {
loaded.value = false loaded.value = false
emit('load', false) emit('load', false)
@@ -36,3 +36,15 @@ test('align_user_menu_auth_both_types_fetch_and_submit_source', () => {
const auth = readSource('src/pages/account/user-menu-auth.ts') const auth = readSource('src/pages/account/user-menu-auth.ts')
assert.match(auth, /type: string/, '授权节点携带 type') assert.match(auth, /type: string/, '授权节点携带 type')
}) })
test('align_user_menu_auth_echo_waits_tree_render', () => {
// 验收反馈:编辑用户时已授权菜单无回显——load() 在 data 赋值后同步 setCheckedKeys
// el-tree 的 store 异步同步 props.data,勾选作用在空 store 上丢失。
// 修复:data 就绪后先 await nextTick() 再 applyChecked()。
const tree = readSource('src/pages/account/UserMenuAuthTree.vue')
const loadBlock = tree.slice(tree.indexOf('async function load'), tree.indexOf('catch {', tree.indexOf('async function load')))
assert.match(loadBlock, /await nextTick\(\).*applyChecked\(\)/s, ' id')
assert.ok(loadBlock.indexOf('await nextTick') < loadBlock.indexOf('applyChecked()'), 'nextTick 先于 applyChecked')
assert.match(tree, /watch\(/, 'checked 变化时仍兜底回显')
assert.match(tree, /if \(loaded\.value\) applyChecked\(\)/, '兜底回显仅在树加载完成后')
})