-
- {{ p.name }}
-
+
勾选该角色可访问的后台能力:
+
+
@@ -77,10 +83,20 @@ const showCreate = ref(false)
const creating = ref(false)
const createForm = reactive({ role_name: '', _checked: {} })
+/** 兼容旧接口大写字段 Key/Name */
+function permKey(p) {
+ return p?.key || p?.Key || ''
+}
+function permLabel(p) {
+ const k = permKey(p)
+ return p?.name || p?.Name || k || '权限'
+}
+
function buildChecked(permissions) {
const o = {}
allPermissions.value.forEach((p) => {
- o[p.key] = permissions.includes(p.key)
+ const k = permKey(p)
+ if (k) o[k] = (permissions || []).includes(k)
})
return o
}
@@ -106,9 +122,10 @@ const handleSave = async () => {
try {
for (const row of list.value) {
if (row.role_id === 9527) continue
- const permissions = allPermissions.value.filter((p) => row._checked[p.key]).map((p) => p.key)
+ const permissions = allPermissions.value.filter((p) => row._checked[permKey(p)]).map((p) => permKey(p))
const payload = { permissions }
- if (row.is_custom && row.role_name) payload.role_name = row.role_name
+ const name = (row.role_name || '').trim()
+ if (name) payload.role_name = name
await updateRolePermissions(row.role_id, payload)
}
ElMessage.success('保存成功')
@@ -123,7 +140,8 @@ const resetCreateForm = () => {
createForm.role_name = ''
createForm._checked = {}
allPermissions.value.forEach((p) => {
- createForm._checked[p.key] = false
+ const k = permKey(p)
+ if (k) createForm._checked[k] = false
})
}
@@ -135,7 +153,7 @@ const handleCreate = async () => {
}
creating.value = true
try {
- const permissions = allPermissions.value.filter((p) => createForm._checked[p.key]).map((p) => p.key)
+ const permissions = allPermissions.value.filter((p) => createForm._checked[permKey(p)]).map((p) => permKey(p))
await createRole({ role_name: name, permissions })
ElMessage.success('创建成功')
showCreate.value = false
@@ -176,9 +194,50 @@ onMounted(fetchList)
color: #666;
font-size: 13px;
margin-bottom: 16px;
+ line-height: 1.6;
}
-.perm-checkboxes {
+.perm-all {
+ color: #909399;
+ font-size: 13px;
+}
+.perm-grid {
display: flex;
flex-wrap: wrap;
+ gap: 10px 20px;
+ align-items: flex-start;
+}
+.dialog-perm-grid {
+ max-height: 360px;
+ overflow-y: auto;
+ padding: 8px 0;
+}
+.perm-item {
+ display: flex;
+ align-items: flex-start;
+ gap: 8px;
+ cursor: pointer;
+ min-width: 200px;
+ max-width: 240px;
+}
+.perm-text {
+ display: flex;
+ flex-direction: column;
+ gap: 2px;
+ line-height: 1.35;
+}
+.perm-name {
+ font-size: 13px;
+ color: #303133;
+}
+.perm-key {
+ font-size: 11px;
+ color: #909399;
+ font-family: ui-monospace, monospace;
+ word-break: break-all;
+}
+.dialog-perm-hint {
+ margin: 0 0 8px;
+ font-size: 12px;
+ color: #909399;
}
diff --git a/admin/src/views/sites/HomepageEdit.vue b/admin/src/views/sites/HomepageEdit.vue
index 3745e83..280199e 100644
--- a/admin/src/views/sites/HomepageEdit.vue
+++ b/admin/src/views/sites/HomepageEdit.vue
@@ -14,7 +14,7 @@
-