fix: added vertical and horizontal scroll in listview
This commit is contained in:
parent
0669f3d7a1
commit
bb471ee4ef
@ -1,5 +1,4 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="inline-flex h-full flex-col border-r w-[220px]">
|
|
||||||
<div class="flex p-2">
|
<div class="flex p-2">
|
||||||
<UserDropdown />
|
<UserDropdown />
|
||||||
</div>
|
</div>
|
||||||
@ -22,7 +21,6 @@
|
|||||||
</NavLinks>
|
</NavLinks>
|
||||||
</nav>
|
</nav>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
|
|||||||
@ -1,9 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="flex h-full">
|
<div class="flex h-screen w-screen">
|
||||||
<div>
|
<div class="h-full border-r w-[220px]">
|
||||||
<AppSidebar />
|
<AppSidebar />
|
||||||
</div>
|
</div>
|
||||||
<div class="w-full">
|
<div class="flex-1 flex flex-col h-full overflow-auto">
|
||||||
<slot />
|
<slot />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -37,12 +37,13 @@
|
|||||||
<Button icon="more-horizontal" />
|
<Button icon="more-horizontal" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="content" class="">
|
<div id="content" class="flex flex-col w-full overflow-x-auto flex-1">
|
||||||
|
<div class="flex flex-col overflow-y-hidden w-max min-w-full">
|
||||||
<div
|
<div
|
||||||
id="list-header"
|
id="list-header"
|
||||||
class="flex space-x-2 items-center px-5 py-2 border-b"
|
class="flex space-x-4 items-center px-5 py-2 border-b"
|
||||||
>
|
>
|
||||||
<Checkbox class="mr-2" />
|
<Checkbox class="" />
|
||||||
<div
|
<div
|
||||||
v-for="column in columns"
|
v-for="column in columns"
|
||||||
:key="column"
|
:key="column"
|
||||||
@ -52,13 +53,13 @@
|
|||||||
{{ column.label }}
|
{{ column.label }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div id="list-rows">
|
<div id="list-rows" class="h-full overflow-y-auto">
|
||||||
<div
|
<div
|
||||||
v-for="row in rows"
|
v-for="row in rows"
|
||||||
:key="row"
|
:key="row"
|
||||||
class="flex space-x-2 items-center mx-2 px-3 py-2 border-b"
|
class="flex space-x-4 items-center mx-2 px-3 py-2 border-b"
|
||||||
>
|
>
|
||||||
<Checkbox class="mr-2" />
|
<Checkbox class="" />
|
||||||
<div
|
<div
|
||||||
v-for="column in columns"
|
v-for="column in columns"
|
||||||
:key="column.key"
|
:key="column.key"
|
||||||
@ -70,6 +71,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script setup>
|
<script setup>
|
||||||
import { FeatherIcon, Dropdown, Checkbox } from 'frappe-ui'
|
import { FeatherIcon, Dropdown, Checkbox } from 'frappe-ui'
|
||||||
@ -84,11 +86,11 @@ const props = defineProps({
|
|||||||
},
|
},
|
||||||
columns: {
|
columns: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: []
|
default: [],
|
||||||
},
|
},
|
||||||
rows: {
|
rows: {
|
||||||
type: Array,
|
type: Array,
|
||||||
default: []
|
default: [],
|
||||||
},
|
},
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user