github
/
halo-admin
mirror of https://github.com/halo-dev/halo-admin
1
0
Fork 0
Code Issues Releases Wiki Activity

refactor: refine ui in mobile device

pull/887/head
Ryan Wang 2023-02-24 16:56:16 +08:00
parent 94903646f6
commit 31df8f969d
16 changed files with 45 additions and 49 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/components/src/components/card/Card.vue
View File

@ -54,6 +54,7 @@ defineProps<{
} }
.card-body { .card-body {
@apply overflow-x-auto;
padding: 12px 16px; padding: 12px 16px;
} }

3
packages/components/src/components/space/Space.vue
View File

@ -33,7 +33,8 @@ const wrapperClasses = computed(() => {
<style lang="scss"> <style lang="scss">
.space-wrapper { .space-wrapper {
@apply inline-flex @apply inline-flex
box-border; box-border
flex-wrap;
&.space-direction-row { &.space-direction-row {
@apply flex-row; @apply flex-row;

6
src/modules/contents/attachments/AttachmentList.vue
View File

@ -336,7 +336,7 @@ onMounted(() => {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:attachments:manage']" v-permission="['system:attachments:manage']"
@ -352,11 +352,11 @@ onMounted(() => {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedAttachments.size" v-if="!selectedAttachments.size"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

6
src/modules/contents/comments/CommentList.vue
View File

@ -313,7 +313,7 @@ function handleClearFilters() {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:comments:manage']" v-permission="['system:comments:manage']"
@ -329,11 +329,11 @@ function handleClearFilters() {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedCommentNames.length" v-if="!selectedCommentNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

6
src/modules/contents/pages/DeletedSinglePageList.vue
View File

@ -261,7 +261,7 @@ function handleClearKeyword() {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:singlepages:manage']" v-permission="['system:singlepages:manage']"
@ -277,11 +277,11 @@ function handleClearKeyword() {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedPageNames.length" v-if="!selectedPageNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

6
src/modules/contents/pages/SinglePageList.vue
View File

@ -474,7 +474,7 @@ function handleClearFilters() {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:singlepages:manage']" v-permission="['system:singlepages:manage']"
@ -490,11 +490,11 @@ function handleClearFilters() {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedPageNames.length" v-if="!selectedPageNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

1
src/modules/contents/pages/module.ts
View File

@ -29,7 +29,6 @@ export default definePlugin({
group: "content", group: "content",
icon: markRaw(IconPages), icon: markRaw(IconPages),
priority: 1, priority: 1,
mobile: true,
}, },
}, },
}, },

6
src/modules/contents/posts/DeletedPostList.vue
View File

@ -219,7 +219,7 @@ function handleClearKeyword() {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:posts:manage']" v-permission="['system:posts:manage']"
@ -235,11 +235,11 @@ function handleClearKeyword() {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedPostNames.length" v-if="!selectedPostNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

6
src/modules/contents/posts/PostList.vue
View File

@ -460,7 +460,7 @@ watch(selectedPostNames, (newValue) => {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:posts:manage']" v-permission="['system:posts:manage']"
@ -476,11 +476,11 @@ watch(selectedPostNames, (newValue) => {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedPostNames.length" v-if="!selectedPostNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

2
src/modules/contents/posts/categories/CategoryList.vue
View File

@ -102,7 +102,7 @@ const onEditingModalClose = () => {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div class="flex w-full flex-1 sm:w-auto"> <div class="flex w-full flex-1 sm:w-auto">
<span class="text-base font-medium"> <span class="text-base font-medium">

6
src/modules/contents/posts/tags/TagList.vue
View File

@ -137,10 +137,8 @@ onMounted(async () => {
<VCard :body-class="['!p-0']"> <VCard :body-class="['!p-0']">
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div class="relative flex flex-wrap items-center justify-between">
class="relative flex flex-col items-start sm:flex-row sm:items-center" <div>
>
<div class="flex w-full flex-1 sm:w-auto">
<span class="text-base font-medium"> <span class="text-base font-medium">
{{ tags?.length || 0 }} 个标签 {{ tags?.length || 0 }} 个标签
</span> </span>

28
src/modules/interface/menus/Menus.vue
View File

@ -217,7 +217,7 @@ const handleResetMenuItems = async () => {
</VPageHeader> </VPageHeader>
<div class="m-0 md:m-4"> <div class="m-0 md:m-4">
<div class="flex flex-col gap-4 sm:flex-row"> <div class="flex flex-col gap-4 sm:flex-row">
<div class="w-96"> <div class="w-full sm:w-96">
<MenuList <MenuList
ref="menuListRef" ref="menuListRef"
v-model:selected-menu="selectedMenu" v-model:selected-menu="selectedMenu"
@ -228,25 +228,21 @@ const handleResetMenuItems = async () => {
<VCard :body-class="['!p-0']"> <VCard :body-class="['!p-0']">
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div class="relative flex flex-wrap items-center justify-between">
class="relative flex flex-col items-start sm:flex-row sm:items-center" <div>
>
<div class="flex w-full flex-1 sm:w-auto">
<span class="text-base font-medium"> <span class="text-base font-medium">
{{ selectedMenu?.spec.displayName }} {{ selectedMenu?.spec.displayName }}
</span> </span>
</div> </div>
<div class="mt-4 flex sm:mt-0"> <div>
<VSpace> <VButton
<VButton v-permission="['system:menus:manage']"
v-permission="['system:menus:manage']" size="xs"
size="xs" type="default"
type="default" @click="menuItemEditingModal = true"
@click="menuItemEditingModal = true" >
> 新增
新增 </VButton>
</VButton>
</VSpace>
</div> </div>
</div> </div>
</div> </div>

1
src/modules/system/actuator/module.ts
View File

@ -22,7 +22,6 @@ export default definePlugin({
group: "system", group: "system",
icon: markRaw(IconTerminalBoxLine), icon: markRaw(IconTerminalBoxLine),
priority: 3, priority: 3,
mobile: true,
}, },
}, },
}, },

8
src/modules/system/plugins/PluginList.vue
View File

@ -173,12 +173,14 @@ const { data, isLoading, isFetching, refetch } = useQuery<Plugin[]>({
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div class="flex w-full flex-1 items-center gap-2 sm:w-auto"> <div
class="flex w-full flex-1 flex-wrap items-center gap-2 sm:w-auto"
>
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"
type="text" type="text"
name="keyword" name="keyword"

2
src/modules/system/roles/RoleList.vue
View File

@ -175,7 +175,7 @@ const handleDelete = async (role: Role) => {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div class="flex w-full flex-1 sm:w-auto"> <div class="flex w-full flex-1 sm:w-auto">
<FormKit <FormKit

6
src/modules/system/users/UserList.vue
View File

@ -344,7 +344,7 @@ const hasFilters = computed(() => {
<template #header> <template #header>
<div class="block w-full bg-gray-50 px-4 py-3"> <div class="block w-full bg-gray-50 px-4 py-3">
<div <div
class="relative flex flex-col items-start sm:flex-row sm:items-center" class="relative flex flex-col flex-wrap items-start sm:flex-row sm:items-center"
> >
<div <div
v-permission="['system:users:manage']" v-permission="['system:users:manage']"
@ -360,11 +360,11 @@ const hasFilters = computed(() => {
<div class="flex w-full flex-1 items-center sm:w-auto"> <div class="flex w-full flex-1 items-center sm:w-auto">
<div <div
v-if="!selectedUserNames.length" v-if="!selectedUserNames.length"
class="flex items-center gap-2" class="flex w-full flex-wrap items-center gap-2 sm:w-auto"
> >
<FormKit <FormKit
id="keywordInput" id="keywordInput"
outer-class="!p-0" outer-class="!p-0 w-full sm:w-auto"
:model-value="keyword" :model-value="keyword"
name="keyword" name="keyword"
placeholder="输入关键词搜索" placeholder="输入关键词搜索"