based on the dsr option is fetched from the backend
This commit is contained in:
parent
8640629005
commit
eaf0ee3d63
@ -245,6 +245,7 @@ export const PIPELINE = {
|
|||||||
endpoints: {
|
endpoints: {
|
||||||
nearestStores: '/api/papi2/nearest-stores',
|
nearestStores: '/api/papi2/nearest-stores',
|
||||||
dailySalesReport: '/api/papi2/daily-sales-report',
|
dailySalesReport: '/api/papi2/daily-sales-report',
|
||||||
productiveCallSummary: '/api/papi2/productive-call-summary'
|
productiveCallSummary: '/api/papi2/productive-call-summary',
|
||||||
|
salesOfficers: '/api/papi2/sales-officers'
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|||||||
@ -1,10 +1,11 @@
|
|||||||
import { useState, type FormEvent } from 'react';
|
import { useState, useEffect, type FormEvent } from 'react';
|
||||||
import { Card, Input, Select } from '../components/reusable';
|
import { Card, Input, Select } from '../components/reusable';
|
||||||
import { Button } from '../components/buttons/Button';
|
import { Button } from '../components/buttons/Button';
|
||||||
import {
|
import {
|
||||||
SALES_REPORT_ROUTES,
|
SALES_REPORT_ROUTES,
|
||||||
ROUTE_WISE_DISTRIBUTORS,
|
ROUTE_WISE_DISTRIBUTORS,
|
||||||
SALES_REPORT_SO_NAMES
|
BASE_URL,
|
||||||
|
PIPELINE
|
||||||
} from '../api/config';
|
} from '../api/config';
|
||||||
import { Download, Printer } from 'lucide-react';
|
import { Download, Printer } from 'lucide-react';
|
||||||
import jsPDF from 'jspdf';
|
import jsPDF from 'jspdf';
|
||||||
@ -14,12 +15,36 @@ export function DailySalesReportPage() {
|
|||||||
const [date, setDate] = useState('');
|
const [date, setDate] = useState('');
|
||||||
const [route, setRoute] = useState('');
|
const [route, setRoute] = useState('');
|
||||||
const [distributor, setDistributor] = useState('');
|
const [distributor, setDistributor] = useState('');
|
||||||
const [soName, setSoName] = useState('');
|
const [soEmail, setSoEmail] = useState('');
|
||||||
|
const [soOptions, setSoOptions] = useState<{value: string, label: string}[]>([]);
|
||||||
|
|
||||||
const [busy, setBusy] = useState(false);
|
const [busy, setBusy] = useState(false);
|
||||||
const [error, setError] = useState<string | null>(null);
|
const [error, setError] = useState<string | null>(null);
|
||||||
const [reportData, setReportData] = useState<any>(null);
|
const [reportData, setReportData] = useState<any>(null);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
async function fetchSOs() {
|
||||||
|
try {
|
||||||
|
const res = await fetch(`${BASE_URL}${PIPELINE.endpoints.salesOfficers}`, {
|
||||||
|
headers: {
|
||||||
|
'TemplateID': '194',
|
||||||
|
'X-Pipeline-Version': 'latest',
|
||||||
|
'OrgID': '57',
|
||||||
|
'GroupID': '25',
|
||||||
|
'Content-Type': 'application/json'
|
||||||
|
}
|
||||||
|
});
|
||||||
|
const data = await res.json();
|
||||||
|
if (data?.response?.options) {
|
||||||
|
setSoOptions(data.response.options);
|
||||||
|
}
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Failed to fetch SOs', err);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
fetchSOs();
|
||||||
|
}, []);
|
||||||
|
|
||||||
const downloadPDF = () => {
|
const downloadPDF = () => {
|
||||||
const doc = new jsPDF({ orientation: 'landscape' });
|
const doc = new jsPDF({ orientation: 'landscape' });
|
||||||
const pageWidth = doc.internal.pageSize.getWidth();
|
const pageWidth = doc.internal.pageSize.getWidth();
|
||||||
@ -48,7 +73,8 @@ export function DailySalesReportPage() {
|
|||||||
doc.setFontSize(10);
|
doc.setFontSize(10);
|
||||||
doc.text(`Distributor Name : ${distributor}`, 14, 40);
|
doc.text(`Distributor Name : ${distributor}`, 14, 40);
|
||||||
doc.text(`Date : ${date}`, rightX, 40, { align: 'right' });
|
doc.text(`Date : ${date}`, rightX, 40, { align: 'right' });
|
||||||
doc.text(`SO Name : ${soName}`, rightX, 45, { align: 'right' });
|
const selectedSo = soOptions.find(o => o.value === soEmail);
|
||||||
|
doc.text(`SO Name : ${selectedSo ? selectedSo.label : soEmail}`, rightX, 45, { align: 'right' });
|
||||||
|
|
||||||
// Table
|
// Table
|
||||||
autoTable(doc, {
|
autoTable(doc, {
|
||||||
@ -90,7 +116,8 @@ export function DailySalesReportPage() {
|
|||||||
doc.setFontSize(10);
|
doc.setFontSize(10);
|
||||||
doc.text(`Distributor Name : ${distributor}`, 14, 40);
|
doc.text(`Distributor Name : ${distributor}`, 14, 40);
|
||||||
doc.text(`Date : ${date}`, rightX, 40, { align: 'right' });
|
doc.text(`Date : ${date}`, rightX, 40, { align: 'right' });
|
||||||
doc.text(`SO Name : ${soName}`, rightX, 45, { align: 'right' });
|
const selectedSo = soOptions.find(o => o.value === soEmail);
|
||||||
|
doc.text(`SO Name : ${selectedSo ? selectedSo.label : soEmail}`, rightX, 45, { align: 'right' });
|
||||||
|
|
||||||
// Table
|
// Table
|
||||||
autoTable(doc, {
|
autoTable(doc, {
|
||||||
@ -124,7 +151,7 @@ export function DailySalesReportPage() {
|
|||||||
setError(null);
|
setError(null);
|
||||||
setReportData(null);
|
setReportData(null);
|
||||||
try {
|
try {
|
||||||
const res = await fetch('https://sandbox.getzino.in/api/papi2/daily-sales-report', {
|
const res = await fetch(`${BASE_URL}${PIPELINE.endpoints.dailySalesReport}`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'TemplateID': '157',
|
'TemplateID': '157',
|
||||||
@ -135,7 +162,7 @@ export function DailySalesReportPage() {
|
|||||||
date,
|
date,
|
||||||
route,
|
route,
|
||||||
distributor,
|
distributor,
|
||||||
so_name: soName,
|
so_name: soEmail,
|
||||||
})
|
})
|
||||||
});
|
});
|
||||||
|
|
||||||
@ -181,9 +208,9 @@ export function DailySalesReportPage() {
|
|||||||
/>
|
/>
|
||||||
<Select
|
<Select
|
||||||
label="SO Name"
|
label="SO Name"
|
||||||
value={soName}
|
value={soEmail}
|
||||||
onChange={(e) => setSoName(e.target.value)}
|
onChange={(e) => setSoEmail(e.target.value)}
|
||||||
options={[{ value: '', label: 'Select SO Name' }, ...SALES_REPORT_SO_NAMES.map(s => ({ value: s, label: s }))]}
|
options={[{ value: '', label: 'Select SO Name' }, ...soOptions]}
|
||||||
/>
|
/>
|
||||||
|
|
||||||
{error && <div className="text-xs text-ruby-600 font-medium">{error}</div>}
|
{error && <div className="text-xs text-ruby-600 font-medium">{error}</div>}
|
||||||
@ -211,7 +238,7 @@ export function DailySalesReportPage() {
|
|||||||
<div>Distributor Name : {distributor}</div>
|
<div>Distributor Name : {distributor}</div>
|
||||||
<div className="text-right flex flex-col gap-1.5">
|
<div className="text-right flex flex-col gap-1.5">
|
||||||
<div>Date : {date}</div>
|
<div>Date : {date}</div>
|
||||||
<div>SO Name : {soName}</div>
|
<div>SO Name : {soOptions.find(o => o.value === soEmail)?.label || soEmail}</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user