mirror of https://github.com/halo-dev/halo
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
parent
88597ac137
commit
0ff11db111
|
@ -57,7 +57,7 @@ const classes = computed(() => {
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss">
|
<style lang="scss">
|
||||||
.entity-wrapper {
|
.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 {
|
&.entity-selected {
|
||||||
@apply bg-gray-100;
|
@apply bg-gray-100;
|
||||||
|
|
|
@ -1107,6 +1107,7 @@ core:
|
||||||
upload: Upload
|
upload: Upload
|
||||||
add: Add
|
add: Add
|
||||||
submit: Submit
|
submit: Submit
|
||||||
|
detail: Detail
|
||||||
radio:
|
radio:
|
||||||
"yes": Yes
|
"yes": Yes
|
||||||
"no": No
|
"no": No
|
||||||
|
|
|
@ -1107,6 +1107,7 @@ core:
|
||||||
upload: 上传
|
upload: 上传
|
||||||
add: 添加
|
add: 添加
|
||||||
submit: 提交
|
submit: 提交
|
||||||
|
detail: 详情
|
||||||
radio:
|
radio:
|
||||||
"yes": 是
|
"yes": 是
|
||||||
"no": 否
|
"no": 否
|
||||||
|
|
|
@ -1107,6 +1107,7 @@ core:
|
||||||
upload: 上傳
|
upload: 上傳
|
||||||
add: 添加
|
add: 添加
|
||||||
submit: 提交
|
submit: 提交
|
||||||
|
detail: 詳情
|
||||||
radio:
|
radio:
|
||||||
"yes": 是
|
"yes": 是
|
||||||
"no": 否
|
"no": 否
|
||||||
|
|
|
@ -767,13 +767,16 @@ onMounted(() => {
|
||||||
</template>
|
</template>
|
||||||
</VEntityField>
|
</VEntityField>
|
||||||
</template>
|
</template>
|
||||||
<template
|
<template #dropdownItems>
|
||||||
v-if="
|
<VDropdownItem @click="handleClickItem(attachment)">
|
||||||
currentUserHasPermission(['system:attachments:manage'])
|
{{ $t("core.common.buttons.detail") }}
|
||||||
"
|
</VDropdownItem>
|
||||||
#dropdownItems
|
|
||||||
>
|
|
||||||
<VDropdownItem
|
<VDropdownItem
|
||||||
|
v-if="
|
||||||
|
currentUserHasPermission([
|
||||||
|
'system:attachments:manage',
|
||||||
|
])
|
||||||
|
"
|
||||||
type="danger"
|
type="danger"
|
||||||
@click="handleDelete(attachment)"
|
@click="handleDelete(attachment)"
|
||||||
>
|
>
|
||||||
|
|
|
@ -24,6 +24,7 @@ import {
|
||||||
Toast,
|
Toast,
|
||||||
VDropdown,
|
VDropdown,
|
||||||
VDropdownItem,
|
VDropdownItem,
|
||||||
|
VDropdownDivider,
|
||||||
} from "@halo-dev/components";
|
} from "@halo-dev/components";
|
||||||
import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
|
import SinglePageSettingModal from "./components/SinglePageSettingModal.vue";
|
||||||
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
|
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
|
||||||
|
@ -846,9 +847,20 @@ const { mutate: changeVisibleMutation } = useMutation({
|
||||||
v-if="currentUserHasPermission(['system:singlepages:manage'])"
|
v-if="currentUserHasPermission(['system:singlepages:manage'])"
|
||||||
#dropdownItems
|
#dropdownItems
|
||||||
>
|
>
|
||||||
|
<VDropdownItem
|
||||||
|
@click="
|
||||||
|
$router.push({
|
||||||
|
name: 'SinglePageEditor',
|
||||||
|
query: { name: singlePage.page.metadata.name },
|
||||||
|
})
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ $t("core.common.buttons.edit") }}
|
||||||
|
</VDropdownItem>
|
||||||
<VDropdownItem @click="handleOpenSettingModal(singlePage.page)">
|
<VDropdownItem @click="handleOpenSettingModal(singlePage.page)">
|
||||||
{{ $t("core.common.buttons.setting") }}
|
{{ $t("core.common.buttons.setting") }}
|
||||||
</VDropdownItem>
|
</VDropdownItem>
|
||||||
|
<VDropdownDivider />
|
||||||
<VDropdownItem
|
<VDropdownItem
|
||||||
type="danger"
|
type="danger"
|
||||||
@click="handleDelete(singlePage.page)"
|
@click="handleDelete(singlePage.page)"
|
||||||
|
|
|
@ -24,6 +24,7 @@ import {
|
||||||
Toast,
|
Toast,
|
||||||
VDropdownItem,
|
VDropdownItem,
|
||||||
VDropdown,
|
VDropdown,
|
||||||
|
VDropdownDivider,
|
||||||
} from "@halo-dev/components";
|
} from "@halo-dev/components";
|
||||||
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
|
import UserDropdownSelector from "@/components/dropdown-selector/UserDropdownSelector.vue";
|
||||||
import CategoryDropdownSelector from "@/components/dropdown-selector/CategoryDropdownSelector.vue";
|
import CategoryDropdownSelector from "@/components/dropdown-selector/CategoryDropdownSelector.vue";
|
||||||
|
@ -941,9 +942,20 @@ const { mutate: changeVisibleMutation } = useMutation({
|
||||||
v-if="currentUserHasPermission(['system:posts:manage'])"
|
v-if="currentUserHasPermission(['system:posts:manage'])"
|
||||||
#dropdownItems
|
#dropdownItems
|
||||||
>
|
>
|
||||||
|
<VDropdownItem
|
||||||
|
@click="
|
||||||
|
$router.push({
|
||||||
|
name: 'PostEditor',
|
||||||
|
query: { name: post.post.metadata.name },
|
||||||
|
})
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ $t("core.common.buttons.edit") }}
|
||||||
|
</VDropdownItem>
|
||||||
<VDropdownItem @click="handleOpenSettingModal(post.post)">
|
<VDropdownItem @click="handleOpenSettingModal(post.post)">
|
||||||
{{ $t("core.common.buttons.setting") }}
|
{{ $t("core.common.buttons.setting") }}
|
||||||
</VDropdownItem>
|
</VDropdownItem>
|
||||||
|
<VDropdownDivider />
|
||||||
<VDropdownItem type="danger" @click="handleDelete(post.post)">
|
<VDropdownItem type="danger" @click="handleDelete(post.post)">
|
||||||
{{ $t("core.common.buttons.delete") }}
|
{{ $t("core.common.buttons.delete") }}
|
||||||
</VDropdownItem>
|
</VDropdownItem>
|
||||||
|
|
|
@ -11,6 +11,7 @@ import {
|
||||||
Toast,
|
Toast,
|
||||||
VDropdownItem,
|
VDropdownItem,
|
||||||
VDropdown,
|
VDropdown,
|
||||||
|
VDropdownDivider,
|
||||||
} from "@halo-dev/components";
|
} from "@halo-dev/components";
|
||||||
import PluginUploadModal from "./PluginUploadModal.vue";
|
import PluginUploadModal from "./PluginUploadModal.vue";
|
||||||
import { ref, toRefs } from "vue";
|
import { ref, toRefs } from "vue";
|
||||||
|
@ -170,9 +171,20 @@ const getFailedMessage = (plugin: Plugin) => {
|
||||||
v-if="currentUserHasPermission(['system:plugins:manage'])"
|
v-if="currentUserHasPermission(['system:plugins:manage'])"
|
||||||
#dropdownItems
|
#dropdownItems
|
||||||
>
|
>
|
||||||
|
<VDropdownItem
|
||||||
|
@click="
|
||||||
|
$router.push({
|
||||||
|
name: 'PluginDetail',
|
||||||
|
params: { name: plugin?.metadata.name },
|
||||||
|
})
|
||||||
|
"
|
||||||
|
>
|
||||||
|
{{ $t("core.common.buttons.detail") }}
|
||||||
|
</VDropdownItem>
|
||||||
<VDropdownItem @click="upgradeModal = true">
|
<VDropdownItem @click="upgradeModal = true">
|
||||||
{{ $t("core.common.buttons.upgrade") }}
|
{{ $t("core.common.buttons.upgrade") }}
|
||||||
</VDropdownItem>
|
</VDropdownItem>
|
||||||
|
<VDropdownDivider />
|
||||||
<VDropdown placement="left" :triggers="['click']">
|
<VDropdown placement="left" :triggers="['click']">
|
||||||
<VDropdownItem type="danger">
|
<VDropdownItem type="danger">
|
||||||
{{ $t("core.common.buttons.uninstall") }}
|
{{ $t("core.common.buttons.uninstall") }}
|
||||||
|
|
Loading…
Reference in New Issue