mirror of https://github.com/halo-dev/halo-admin
fix: the issue that role edit form cannot be submitted in the permission tab (#717)
#### What type of PR is this? /kind bug /milestone 2.0-rc.2 #### What this PR does / why we need it: 修复在角色编辑时，如果在权限勾选界面，无法提交表单的问题。 #### Which issue(s) this PR fixes: Fixes https://github.com/halo-dev/halo/issues/2778 #### Special notes for your reviewer: 测试方式： 1. 编辑任意角色或者新建角色。 2. 在编辑弹框中切换到权限勾选界面。 3. 点击提交按钮，观察是否能够正常提交。 #### Does this PR introduce a user-facing change? ```release-note 修复在 Console 端角色编辑时，如果在权限勾选界面，无法提交表单的问题。 ```pull/727/head
Ryan Wang
GitHub
parent
b604532a7b
commit
0fc4815a67
|
|
@ -1,5 +1,5 @@
|
|||
<script lang="ts" setup>
|
||||
import { VButton, VModal, VSpace, VTabItem, VTabs } from "@halo-dev/components";
|
||||
import { VButton, VModal, VSpace, VTabbar } from "@halo-dev/components";
|
||||
import SubmitButton from "@/components/button/SubmitButton.vue";
|
||||
import { computed, ref, watch } from "vue";
|
||||
import { rbacAnnotations } from "@/constants/annotations";
|
||||
|
|
@ -110,8 +110,22 @@ const handleResetForm = () => {
|
|||
:width="700"
|
||||
@update:visible="onVisibleChange"
|
||||
>
|
||||
<VTabs v-model:active-id="tabActiveId" type="outline">
|
||||
<VTabItem id="general" label="基础信息">
|
||||
<VTabbar
|
||||
v-model:active-id="tabActiveId"
|
||||
:items="[
|
||||
{
|
||||
id: 'general',
|
||||
label: '基本信息',
|
||||
},
|
||||
{
|
||||
id: 'permissions',
|
||||
label: '权限',
|
||||
},
|
||||
]"
|
||||
type="outline"
|
||||
/>
|
||||
<div class="mt-2">
|
||||
<div v-show="tabActiveId === 'general'">
|
||||
<FormKit
|
||||
v-if="formState.metadata.annotations"
|
||||
id="role-form"
|
||||
|
|
@ -131,66 +145,65 @@ const handleResetForm = () => {
|
|||
validation="required|length:0,50"
|
||||
></FormKit>
|
||||
</FormKit>
|
||||
</VTabItem>
|
||||
<VTabItem id="permissions" label="权限">
|
||||
<div>
|
||||
<dl class="divide-y divide-gray-100">
|
||||
<div
|
||||
v-for="(group, groupIndex) in roleTemplateGroups"
|
||||
:key="groupIndex"
|
||||
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
|
||||
>
|
||||
<dt class="text-sm font-medium text-gray-900">
|
||||
{{ group.module }}
|
||||
</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
|
||||
<ul class="space-y-2">
|
||||
<li v-for="(roleTemplate, index) in group.roles" :key="index">
|
||||
<label
|
||||
class="inline-flex w-full cursor-pointer flex-row items-center gap-4 rounded-base border p-5 hover:border-primary"
|
||||
>
|
||||
<input
|
||||
v-model="selectedRoleTemplates"
|
||||
:value="roleTemplate.metadata.name"
|
||||
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
|
||||
type="checkbox"
|
||||
@change="handleRoleTemplateSelect"
|
||||
/>
|
||||
<div class="flex flex-1 flex-col gap-y-3">
|
||||
<span class="font-medium text-gray-900">
|
||||
{{
|
||||
roleTemplate.metadata.annotations?.[
|
||||
rbacAnnotations.DISPLAY_NAME
|
||||
]
|
||||
}}
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
</div>
|
||||
|
||||
<div v-show="tabActiveId === 'permissions'">
|
||||
<dl class="divide-y divide-gray-100">
|
||||
<div
|
||||
v-for="(group, groupIndex) in roleTemplateGroups"
|
||||
:key="groupIndex"
|
||||
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
|
||||
>
|
||||
<dt class="text-sm font-medium text-gray-900">
|
||||
{{ group.module }}
|
||||
</dt>
|
||||
<dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
|
||||
<ul class="space-y-2">
|
||||
<li v-for="(roleTemplate, index) in group.roles" :key="index">
|
||||
<label
|
||||
class="inline-flex w-full cursor-pointer flex-row items-center gap-4 rounded-base border p-5 hover:border-primary"
|
||||
>
|
||||
<input
|
||||
v-model="selectedRoleTemplates"
|
||||
:value="roleTemplate.metadata.name"
|
||||
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
|
||||
type="checkbox"
|
||||
@change="handleRoleTemplateSelect"
|
||||
/>
|
||||
<div class="flex flex-1 flex-col gap-y-3">
|
||||
<span class="font-medium text-gray-900">
|
||||
{{
|
||||
roleTemplate.metadata.annotations?.[
|
||||
rbacAnnotations.DISPLAY_NAME
|
||||
]
|
||||
}}
|
||||
</span>
|
||||
<span
|
||||
v-if="
|
||||
roleTemplate.metadata.annotations?.[
|
||||
rbacAnnotations.DEPENDENCIES
|
||||
]
|
||||
"
|
||||
class="text-xs text-gray-400"
|
||||
>
|
||||
依赖于
|
||||
{{
|
||||
JSON.parse(
|
||||
roleTemplate.metadata.annotations?.[
|
||||
rbacAnnotations.DEPENDENCIES
|
||||
]
|
||||
"
|
||||
class="text-xs text-gray-400"
|
||||
>
|
||||
依赖于
|
||||
{{
|
||||
JSON.parse(
|
||||
roleTemplate.metadata.annotations?.[
|
||||
rbacAnnotations.DEPENDENCIES
|
||||
]
|
||||
).join(", ")
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</VTabItem>
|
||||
</VTabs>
|
||||
).join(", ")
|
||||
}}
|
||||
</span>
|
||||
</div>
|
||||
</label>
|
||||
</li>
|
||||
</ul>
|
||||
</dd>
|
||||
</div>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
<template #footer>
|
||||
<VSpace>
|
||||
<SubmitButton
|
||||
|
|
|
|||
Loading…
Reference in New Issue