gitea_admin/nuxt-mongoose
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore: ui

Browse Source
This commit is contained in:
arashsheyda
2023-04-21 13:27:43 +03:00
parent c2fc88292f
commit 2234826810
2 changed files with 98 additions and 78 deletions
Download Patch File Download Diff File Expand all files Collapse all files

52
client/pages/index.vue
View File

@ -24,32 +24,30 @@ onMounted(() => {
</script>
<template>
<div h-full>
<PanelLeftRight :min-left="13" :max-left="20">
<template #left>
<div py1 px4>
<div flex items-center p2>
<!-- TODO: -->
<NIconButton w-full mb2 icon="carbon-reset" title="Refresh" />
<NIconButton w-full mb2 icon="carbon-data-base" title="Connection Name" :class="connected ? 'text-green-5' : 'text-orange-5'" />
<NIconButton w-full mb2 icon="carbon-add" title="Create Table" @click="drawer = !drawer" />
</div>
<NTextInput v-model="search" w-full p2 mb2 :placeholder="`${collections?.length ?? '-'} collection in total`" icon="carbon-search" />
<div grid gird-cols-1 my2 mx1>
<NuxtLink v-for="table in filtered" :key="table.name" :to="{ name: 'index', query: { table: table.name } }" flex justify-between p2 my1 hover-bg-green hover-bg-opacity-5 hover-text-green rounded-lg :class="{ 'bg-green bg-opacity-5 text-green': selectedCollection === table.name }" @click="selectedCollection = table.name">
<span>
<NIcon icon="carbon-db2-database" />
{{ table.name }}
</span>
<!-- TODO: -->
<NIconButton icon="carbon-overflow-menu-horizontal" />
</NuxtLink>
</div>
<PanelLeftRight :min-left="13" :max-left="20">
<template #left>
<div py1 px4>
<div flex items-center p2>
<!-- TODO: -->
<NIconButton w-full mb2 icon="carbon-reset" title="Refresh" />
<NIconButton w-full mb2 icon="carbon-data-base" title="Connection Name" :class="connected ? 'text-green-5' : 'text-orange-5'" />
<NIconButton w-full mb2 icon="carbon-add" title="Create Table" @click="drawer = !drawer" />
</div>
</template>
<template #right>
<DatabaseDetail v-if="selectedCollection" :collection="selectedCollection" />
</template>
</PanelLeftRight>
</div>
<NTextInput v-model="search" w-full p2 mb2 :placeholder="`${collections?.length ?? '-'} collection in total`" icon="carbon-search" />
<div grid gird-cols-1 my2 mx1>
<NuxtLink v-for="table in filtered" :key="table.name" :to="{ name: 'index', query: { table: table.name } }" flex justify-between p2 my1 hover-bg-green hover-bg-opacity-5 hover-text-green rounded-lg :class="{ 'bg-green bg-opacity-5 text-green': selectedCollection === table.name }" @click="selectedCollection = table.name">
<span>
<NIcon icon="carbon-db2-database" />
{{ table.name }}
</span>
<!-- TODO: -->
<NIconButton icon="carbon-overflow-menu-horizontal" />
</NuxtLink>
</div>
</div>
</template>
<template #right>
<DatabaseDetail v-if="selectedCollection" :collection="selectedCollection" />
</template>
</PanelLeftRight>
</template>