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

fix: added empty state in all list views

Browse Source
This commit is contained in:
Shariq Ansari 2023-12-24 12:17:28 +05:30
parent b36eb58ace
commit 39c8ba1288
6 changed files with 79 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
frontend/src/pages/CallLogs.vue
View File

@ -14,13 +14,25 @@
</div>
</div>
<CallLogsListView
v-if="callLogs.data"
v-if="callLogs.data && rows.length"
:rows="rows"
:columns="callLogs.data.columns"
/>
<div v-else-if="callLogs.data" class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<PhoneIcon class="h-10 w-10" />
<span>No Logs Found</span>
<Button label="Create" @click="showNewDialog = true">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
</template>
<script setup>
import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import SortBy from '@/components/SortBy.vue'
import Filter from '@/components/Filter.vue'
@ -37,7 +49,7 @@ import { contactsStore } from '@/stores/contacts'
import { useOrderBy } from '@/composables/orderby'
import { useFilter } from '@/composables/filter'
import { useDebounceFn } from '@vueuse/core'
import { createResource, Breadcrumbs } from 'frappe-ui'
import { createResource, Breadcrumbs, FeatherIcon } from 'frappe-ui'
import { computed, watch } from 'vue'
const { getUser } = usersStore()

14
frontend/src/pages/Contacts.vue
View File

@ -34,14 +34,26 @@
</div>
</div>
<ContactsListView
v-if="contacts.data"
v-if="contacts.data && rows.length"
:rows="rows"
:columns="contacts.data.columns"
/>
<div v-else-if="contacts.data" class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<ContactsIcon class="h-10 w-10" />
<span>No Contacts Found</span>
<Button label="Create" @click="showNewDialog = true">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
<ContactModal v-model="showContactModal" :contact="{}" />
</template>
<script setup>
import ContactsIcon from '@/components/Icons/ContactsIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import ContactModal from '@/components/Modals/ContactModal.vue'
import ContactsListView from '@/components/ListViews/ContactsListView.vue'

14
frontend/src/pages/Deals.vue
View File

@ -33,7 +33,18 @@
<ViewSettings doctype="CRM Deal" v-model="deals" />
</div>
</div>
<DealsListView v-if="deals.data" :rows="rows" :columns="deals.data.columns" />
<DealsListView v-if="deals.data && rows.length" :rows="rows" :columns="deals.data.columns" />
<div v-else-if="deals.data" class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<DealsIcon class="h-10 w-10" />
<span>No Deals Found</span>
<Button label="Create" @click="showNewDialog = true">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
<Dialog
v-model="showNewDialog"
:options="{
@ -54,6 +65,7 @@
</template>
<script setup>
import DealsIcon from '@/components/Icons/DealsIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import DealsListView from '@/components/ListViews/DealsListView.vue'
import NewDeal from '@/components/NewDeal.vue'

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

@ -32,7 +32,22 @@
<ViewSettings doctype="CRM Lead" v-model="leads" />
</div>
</div>
<LeadsListView v-if="leads.data" :rows="rows" :columns="leads.data.columns" />
<LeadsListView
v-if="leads.data && rows.length"
:rows="rows"
:columns="leads.data.columns"
/>
<div v-else-if="leads.data" class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<LeadsIcon class="h-10 w-10" />
<span>No Leads Found</span>
<Button label="Create" @click="showNewDialog = true">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
<Dialog
v-model="showNewDialog"
:options="{
@ -53,6 +68,7 @@
</template>
<script setup>
import LeadsIcon from '@/components/Icons/LeadsIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import LeadsListView from '@/components/ListViews/LeadsListView.vue'
import NewLead from '@/components/NewLead.vue'

16
frontend/src/pages/Notes.vue
View File

@ -61,13 +61,15 @@
</div>
</div>
</div>
<div
v-else
class="flex flex-1 items-center justify-center p-5 text-xl font-medium text-gray-500"
>
<div class="flex flex-col items-center gap-2">
<NoteIcon class="h-10 w-10 text-gray-500" />
<span>No notes</span>
<div v-else class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<NoteIcon class="h-10 w-10" />
<span>No Notes Found</span>
<Button label="Create" @click="createNote">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
<NoteModal

14
frontend/src/pages/Organizations.vue
View File

@ -38,13 +38,25 @@
</div>
</div>
<OrganizationsListView
v-if="organizations.data"
v-if="organizations.data && rows.length"
:rows="rows"
:columns="organizations.data.columns"
/>
<div v-else-if="organizations.data" class="flex h-full items-center justify-center">
<div
class="flex flex-col items-center gap-3 text-xl font-medium text-gray-500"
>
<OrganizationsIcon class="h-10 w-10" />
<span>No Organizations Found</span>
<Button label="Create" @click="showNewDialog = true">
<template #prefix><FeatherIcon name="plus" class="h-4" /></template>
</Button>
</div>
</div>
<OrganizationModal v-model="showOrganizationModal" :organization="{}" />
</template>
<script setup>
import OrganizationsIcon from '@/components/Icons/OrganizationsIcon.vue'
import LayoutHeader from '@/components/LayoutHeader.vue'
import OrganizationModal from '@/components/Modals/OrganizationModal.vue'
import OrganizationsListView from '@/components/ListViews/OrganizationsListView.vue'