test/crm
1
0
Fork 1
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: extracted out view breadcrumb which contain view selector

Browse Source
This commit is contained in:
Shariq Ansari 2024-08-21 16:48:46 +05:30
parent 6abf9d1870
commit bee2de6f6f
3 changed files with 51 additions and 39 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
frontend/src/components/ViewBreadcrumbs.vue Normal file
View File

@ -0,0 +1,48 @@
<template>
<div class="flex items-center">
<router-link
:to="{ name: routeName }"
class="px-0.5 py-1 text-lg font-medium focus:outline-none focus-visible:ring-2 focus-visible:ring-gray-400 text-gray-600 hover:text-gray-700"
>
{{ __(routeName) }}
</router-link>
<span class="mx-0.5 text-base text-gray-500" aria-hidden="true"> / </span>
<Dropdown v-if="viewControls" :options="viewControls.viewsDropdownOptions">
<template #default="{ open }">
<Button
variant="ghost"
class="text-lg font-medium"
:label="__(viewControls.currentView.label)"
>
<template #prefix>
<Icon :icon="viewControls.currentView.icon" class="h-4" />
</template>
<template #suffix>
<FeatherIcon
:name="open ? 'chevron-up' : 'chevron-down'"
class="h-4 text-gray-800"
/>
</template>
</Button>
</template>
</Dropdown>
<Dropdown :options="viewControls.viewActions">
<template #default>
<Button variant="ghost" icon="more-horizontal" />
</template>
</Dropdown>
</div>
</template>
<script setup>
import Icon from '@/components/Icon.vue'
import { Dropdown } from 'frappe-ui'
const props = defineProps({
routeName: {
type: String,
required: true,
},
})
const viewControls = defineModel()
</script>

6
frontend/src/components/ViewControls.vue
View File

@ -59,11 +59,6 @@
</div>
</div>
<div v-else class="flex items-center justify-between gap-2 px-5 py-4">
<!-- <Dropdown :options="viewActions">
<template #default>
<Button icon="more-horizontal" />
</template>
</Dropdown> -->
<FadedScrollableDiv
class="flex flex-1 items-center overflow-x-auto -ml-1"
orientation="horizontal"
@ -1085,6 +1080,7 @@ defineExpose({
likeDoc,
updateKanbanSettings,
loadMoreKanban,
viewActions,
viewsDropdownOptions,
currentView,
})

36
frontend/src/pages/Leads.vue
View File

@ -1,39 +1,7 @@
<template>
<LayoutHeader>
<template #left-header>
<div class="flex items-center">
<router-link
:to="{ name: 'Leads' }"
class="px-0.5 py-1 text-lg font-medium focus:outline-none focus-visible:ring-2 focus-visible:ring-gray-400 text-gray-600 hover:text-gray-700"
>
{{ __('Leads') }}
</router-link>
<span class="mx-0.5 text-base text-gray-500" aria-hidden="true">
/
</span>
<Dropdown
v-if="viewControls"
:options="viewControls.viewsDropdownOptions"
>
<template #default="{ open }">
<Button
variant="ghost"
class="text-lg font-medium"
:label="__(viewControls.currentView.label)"
>
<template #prefix>
<Icon :icon="viewControls.currentView.icon" class="h-4" />
</template>
<template #suffix>
<FeatherIcon
:name="open ? 'chevron-up' : 'chevron-down'"
class="h-4 text-gray-800"
/>
</template>
</Button>
</template>
</Dropdown>
</div>
<ViewBreadcrumbs v-model="viewControls" routeName="Leads" />
</template>
<template #right-header>
<CustomActions
@ -317,7 +285,7 @@
</template>
<script setup>
import Icon from '@/components/Icon.vue'
import ViewBreadcrumbs from '@/components/ViewBreadcrumbs.vue'
import MultipleAvatar from '@/components/MultipleAvatar.vue'
import CustomActions from '@/components/CustomActions.vue'
import EmailAtIcon from '@/components/Icons/EmailAtIcon.vue'