refactor: improve the accessibility of action items in some data list (#3919)

#### What type of PR is this?

/kind improvement
/area console
/milestone 2.6.x

#### What this PR does / why we need it:

1. 移除 Entity 组件最外层容器的手型样式,避免出现可点击性的误导。
2. 为部分数据列表项操作提供更多的访问选项。
    1. 文章 / 页面列表添加编辑按钮。
    2. 插件列表项添加详情按钮。
    3. 附件列表项添加详情按钮。

#### Which issue(s) this PR fixes:

Fixes #3914 

#### Does this PR introduce a user-facing change?

```release-note
优化 Console 端部分数据列表的可访问性
```
pull/3939/head
Ryan Wang 2023-05-16 18:16:55 +08:00 committed by GitHub
parent 88597ac137
commit 0ff11db111
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
8 changed files with 49 additions and 7 deletions

View File

@ -57,7 +57,7 @@ const classes = computed(() => {
</template>
<style lang="scss">
.entity-wrapper {
@apply relative block cursor-pointer px-4 py-3 transition-all hover:bg-gray-50 w-full;
@apply relative block px-4 py-3 transition-all hover:bg-gray-50 w-full;
&.entity-selected {
@apply bg-gray-100;

View File

@ -1107,6 +1107,7 @@ core:
upload: Upload
add: Add
submit: Submit
detail: Detail
radio:
"yes": Yes
"no": No

View File

@ -1107,6 +1107,7 @@ core:
upload: 上传
add: 添加
submit: 提交
detail: 详情
radio:
"yes":
"no":

View File

@ -1107,6 +1107,7 @@ core:
upload: 上傳
add: 添加
submit: 提交
detail: 詳情
radio:
"yes":
"no":

View File

@ -767,13 +767,16 @@ onMounted(() => {
</template>
</VEntityField>
</template>
<template
v-if="
currentUserHasPermission(['system:attachments:manage'])
"
#dropdownItems
>
<template #dropdownItems>
<VDropdownItem @click="handleClickItem(attachment)">
{{ $t("core.common.buttons.detail") }}
</VDropdownItem>
<VDropdownItem
v-if="
currentUserHasPermission([
'system:attachments:manage',
])
"
type="danger"
@click="handleDelete(attachment)"
>

View File

@ -24,6 +24,7 @@ import {
Toast,
VDropdown,
VDropdownItem,
VDropdownDivider,
} from "@halo-dev/components";
import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
@ -846,9 +847,20 @@ const { mutate: changeVisibleMutation } = useMutation({
v-if="currentUserHasPermission(['system:singlepages:manage'])"
#dropdownItems
>
<VDropdownItem
@click="
$router.push({
name: 'SinglePageEditor',
query: { name: singlePage.page.metadata.name },
})
"
>
{{ $t("core.common.buttons.edit") }}
</VDropdownItem>
<VDropdownItem @click="handleOpenSettingModal(singlePage.page)">
{{ $t("core.common.buttons.setting") }}
</VDropdownItem>
<VDropdownDivider />
<VDropdownItem
type="danger"
@click="handleDelete(singlePage.page)"

View File

@ -24,6 +24,7 @@ import {
Toast,
VDropdownItem,
VDropdown,
VDropdownDivider,
} from "@halo-dev/components";
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
import CategoryDropdownSelector from "@/components/dropdown-selector/CategoryDropdownSelector.vue";
@ -941,9 +942,20 @@ const { mutate: changeVisibleMutation } = useMutation({
v-if="currentUserHasPermission(['system:posts:manage'])"
#dropdownItems
>
<VDropdownItem
@click="
$router.push({
name: 'PostEditor',
query: { name: post.post.metadata.name },
})
"
>
{{ $t("core.common.buttons.edit") }}
</VDropdownItem>
<VDropdownItem @click="handleOpenSettingModal(post.post)">
{{ $t("core.common.buttons.setting") }}
</VDropdownItem>
<VDropdownDivider />
<VDropdownItem type="danger" @click="handleDelete(post.post)">
{{ $t("core.common.buttons.delete") }}
</VDropdownItem>

View File

@ -11,6 +11,7 @@ import {
Toast,
VDropdownItem,
VDropdown,
VDropdownDivider,
} from "@halo-dev/components";
import PluginUploadModal from "./PluginUploadModal.vue";
import { ref, toRefs } from "vue";
@ -170,9 +171,20 @@ const getFailedMessage = (plugin: Plugin) => {
v-if="currentUserHasPermission(['system:plugins:manage'])"
#dropdownItems
>
<VDropdownItem
@click="
$router.push({
name: 'PluginDetail',
params: { name: plugin?.metadata.name },
})
"
>
{{ $t("core.common.buttons.detail") }}
</VDropdownItem>
<VDropdownItem @click="upgradeModal = true">
{{ $t("core.common.buttons.upgrade") }}
</VDropdownItem>
<VDropdownDivider />
<VDropdown placement="left" :triggers="['click']">
<VDropdownItem type="danger">
{{ $t("core.common.buttons.uninstall") }}