112 lines
2.1 KiB
Vue
112 lines
2.1 KiB
Vue
<template>
|
|
<ListView :list="list_details" :columns="columns" :rows="rows" row-key="name" />
|
|
</template>
|
|
|
|
<script setup>
|
|
import ListView from '../components/ListView.vue'
|
|
import { computed } from 'vue'
|
|
import { createListResource } from 'frappe-ui'
|
|
import { usersStore } from '../stores/users'
|
|
|
|
const list_details = {
|
|
title: 'Leads',
|
|
plural_label: 'Leads',
|
|
singular_label: 'Lead',
|
|
}
|
|
const { getUser } = usersStore()
|
|
|
|
const leads = createListResource({
|
|
type: 'list',
|
|
doctype: 'CRM Lead',
|
|
fields: [
|
|
'name',
|
|
'first_name',
|
|
'lead_name',
|
|
'image',
|
|
'organization_name',
|
|
'organization_logo',
|
|
'status',
|
|
'email',
|
|
'mobile_no',
|
|
'lead_owner',
|
|
'modified',
|
|
],
|
|
orderBy: 'modified desc',
|
|
cache: 'Leads',
|
|
pageLength: 999,
|
|
auto: true,
|
|
})
|
|
leads.fetch()
|
|
|
|
const columns = [
|
|
{
|
|
label: 'Name',
|
|
key: 'lead_name',
|
|
type: 'avatar',
|
|
size: 'w-44',
|
|
},
|
|
{
|
|
label: 'Organization',
|
|
key: 'organization_name',
|
|
type: 'logo',
|
|
size: 'w-44',
|
|
},
|
|
{
|
|
label: 'Status',
|
|
key: 'status',
|
|
type: 'indicator',
|
|
size: 'w-44',
|
|
},
|
|
{
|
|
label: 'Email',
|
|
key: 'email',
|
|
type: 'email',
|
|
size: 'w-44',
|
|
},
|
|
{
|
|
label: 'Mobile no',
|
|
key: 'mobile_no',
|
|
type: 'phone',
|
|
size: 'w-44',
|
|
},
|
|
{
|
|
label: 'Lead owner',
|
|
key: 'lead_owner',
|
|
type: 'avatar',
|
|
size: 'w-44',
|
|
},
|
|
]
|
|
|
|
const rows = computed(() => {
|
|
return leads.data?.map((lead) => {
|
|
return {
|
|
name: lead.name,
|
|
lead_name: {
|
|
label: lead.lead_name,
|
|
image: lead.image,
|
|
image_label: lead.first_name,
|
|
},
|
|
organization_name: {
|
|
label: lead.organization_name,
|
|
logo: lead.organization_logo,
|
|
},
|
|
status: {
|
|
label: lead.status,
|
|
color: indicatorColor[lead.status],
|
|
},
|
|
email: lead.email,
|
|
mobile_no: lead.mobile_no,
|
|
lead_owner: lead.lead_owner && getUser(lead.lead_owner),
|
|
}
|
|
})
|
|
})
|
|
|
|
const indicatorColor = {
|
|
New: 'text-gray-600',
|
|
'Contact made': 'text-orange-500',
|
|
'Proposal made': 'text-blue-600',
|
|
Negotiation: 'text-red-600',
|
|
Converted: 'text-green-600',
|
|
}
|
|
</script>
|