+
+
+ !disabled && setDropdownOpen(true)}
+ onChange={(e) => {
+ const text = e.target.value;
+ setSearchText(text);
+ searchLink(text);
+ onChange(text);
+ }}
+ />
+
+ {isDropdownOpen && searchResults.length > 0 && !disabled && (
+
+ );
+};
+
+export default LinkField;
+
+
+// import React, { useState, useEffect, useRef } from 'react';
+// import apiService from '../services/apiService'; // ✅ your ApiService
+
+// interface LinkFieldProps {
+// label: string;
+// doctype: string;
+// value: string;
+// onChange: (value: string) => void;
+// placeholder?: string;
+// disabled?: boolean;
+// filters?: Record-
+ {searchResults.map((item, idx) => (
+
- { + onChange(item.value); + setDropdownOpen(false); + }} + className={`px-3 py-2 cursor-pointer + text-gray-900 dark:text-gray-100 + hover:bg-blue-500 dark:hover:bg-blue-600 hover:text-white + ${value === item.value ? 'bg-blue-50 dark:bg-blue-700 font-semibold' : ''}`} + > + {item.value} + {item.description && ( + + {item.description} + + )} + + ))} +
+ No results found
+
+ )}
+
+//
+
+// !disabled && setDropdownOpen(true)}
+// onChange={(e) => {
+// const text = e.target.value;
+// setSearchText(text);
+// searchLink(text);
+// onChange(text);
+// }}
+// />
+
+// {isDropdownOpen && searchResults.length > 0 && !disabled && (
+//
+// );
+// };
+
+// export default LinkField;
diff --git a/src/components/Sidebar.tsx b/src/components/Sidebar.tsx
index f492784..705e2f1 100644
--- a/src/components/Sidebar.tsx
+++ b/src/components/Sidebar.tsx
@@ -2,23 +2,23 @@ import React, { useState } from 'react';
import { Link, useLocation, useNavigate } from 'react-router-dom';
import { useTheme } from '../contexts/ThemeContext';
import {
- FaTools,
- FaBox,
- FaWrench,
- FaCog,
- FaUsers,
- FaChartBar,
- FaBuilding,
- FaTruck,
- FaFileContract,
- FaInfoCircle,
- FaBars,
- FaTimes,
- FaHome,
- FaMoon,
- FaSun,
- FaSignOutAlt
-} from 'react-icons/fa';
+ LayoutDashboard,
+ Package,
+ Wrench,
+ Users,
+ BarChart3,
+ Building2,
+ Truck,
+ FileText,
+ MapPin,
+ Menu,
+ X,
+ Moon,
+ Sun,
+ LogOut,
+ ClipboardList,
+ Calendar
+} from 'lucide-react';
interface SidebarLink {
id: string;
@@ -75,80 +75,87 @@ const Sidebar: React.FC-
+// {searchResults.map((item, idx) => (
+//
- { +// onChange(item.value); +// setDropdownOpen(false); +// }} +// className={`px-3 py-2 cursor-pointer +// text-gray-900 dark:text-gray-100 +// hover:bg-blue-500 dark:hover:bg-blue-600 +// ${value === item.value ? 'bg-blue-50 dark:bg-blue-700 font-semibold' : ''}`} +// > +// {item.value} +// {item.description && ( +// {item.description} +// )} +// +// ))} +//
{!isCollapsed && (
- ([]);
+ const [totalCount, setTotalCount] = useState(0);
+ const [hasMore, setHasMore] = useState(false);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+ const [refetchTrigger, setRefetchTrigger] = useState(0);
+ const hasAttemptedRef = useRef(false);
+
+ const filtersJson = JSON.stringify(filters);
+
+ useEffect(() => {
+ if (hasAttemptedRef.current && error) {
+ return;
+ }
+
+ let isCancelled = false;
+ hasAttemptedRef.current = true;
+
+ const fetchLogs = async () => {
+ try {
+ setLoading(true);
+
+ const response = await assetMaintenanceService.getMaintenanceLogs(filters, undefined, limit, offset, orderBy);
+
+ if (!isCancelled) {
+ setLogs(response.asset_maintenance_logs);
+ setTotalCount(response.total_count);
+ setHasMore(response.has_more);
+ setError(null);
+ }
+ } catch (err) {
+ if (!isCancelled) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to fetch maintenance logs';
+
+ if (errorMessage.includes('417') || errorMessage.includes('Expectation Failed') || errorMessage.includes('has no attribute')) {
+ setError('API endpoint not deployed. Please deploy asset_maintenance_api.py to your Frappe server.');
+ } else {
+ setError(errorMessage);
+ }
+
+ setLogs([]);
+ setTotalCount(0);
+ setHasMore(false);
+ }
+ } finally {
+ if (!isCancelled) {
+ setLoading(false);
+ }
+ }
+ };
+
+ fetchLogs();
+
+ return () => {
+ isCancelled = true;
+ };
+ }, [filtersJson, limit, offset, orderBy, refetchTrigger]);
+
+ const refetch = useCallback(() => {
+ hasAttemptedRef.current = false;
+ setRefetchTrigger(prev => prev + 1);
+ }, []);
+
+ return { logs, totalCount, hasMore, loading, error, refetch };
+}
+
+/**
+ * Hook to fetch a single maintenance log by name
+ */
+export function useMaintenanceLogDetails(logName: string | null) {
+ const [log, setLog] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ const fetchLog = useCallback(async () => {
+ if (!logName) {
+ setLog(null);
+ setLoading(false);
+ return;
+ }
+
+ try {
+ setLoading(true);
+ setError(null);
+
+ const data = await assetMaintenanceService.getMaintenanceLogDetails(logName);
+ setLog(data);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : 'Failed to fetch maintenance log details');
+ } finally {
+ setLoading(false);
+ }
+ }, [logName]);
+
+ useEffect(() => {
+ fetchLog();
+ }, [fetchLog]);
+
+ const refetch = useCallback(() => {
+ fetchLog();
+ }, [fetchLog]);
+
+ return { log, loading, error, refetch };
+}
+
+/**
+ * Hook to manage maintenance log operations
+ */
+export function useMaintenanceMutations() {
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState(null);
+
+ const createLog = async (logData: CreateMaintenanceData) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ console.log('[useMaintenanceMutations] Creating maintenance log:', logData);
+ const response = await assetMaintenanceService.createMaintenanceLog(logData);
+ console.log('[useMaintenanceMutations] Create response:', response);
+
+ if (response.success) {
+ return response.asset_maintenance_log;
+ } else {
+ const backendError = (response as any).error || 'Failed to create maintenance log';
+ throw new Error(backendError);
+ }
+ } catch (err) {
+ console.error('[useMaintenanceMutations] Create error:', err);
+ const errorMessage = err instanceof Error ? err.message : 'Failed to create maintenance log';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const updateLog = async (logName: string, logData: Partial) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ console.log('[useMaintenanceMutations] Updating maintenance log:', logName, logData);
+ const response = await assetMaintenanceService.updateMaintenanceLog(logName, logData);
+ console.log('[useMaintenanceMutations] Update response:', response);
+
+ if (response.success) {
+ return response.asset_maintenance_log;
+ } else {
+ const backendError = (response as any).error || 'Failed to update maintenance log';
+ throw new Error(backendError);
+ }
+ } catch (err) {
+ console.error('[useMaintenanceMutations] Update error:', err);
+ const errorMessage = err instanceof Error ? err.message : 'Failed to update maintenance log';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const deleteLog = async (logName: string) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await assetMaintenanceService.deleteMaintenanceLog(logName);
+
+ if (!response.success) {
+ throw new Error('Failed to delete maintenance log');
+ }
+
+ return response;
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to delete maintenance log';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const updateStatus = async (logName: string, maintenanceStatus?: string, workflowState?: string) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await assetMaintenanceService.updateMaintenanceStatus(logName, maintenanceStatus, workflowState);
+
+ if (response.success) {
+ return response.asset_maintenance_log;
+ } else {
+ throw new Error('Failed to update maintenance status');
+ }
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to update status';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ return { createLog, updateLog, deleteLog, updateStatus, loading, error };
+}
+
+/**
+ * Hook to fetch maintenance logs for a specific asset
+ */
+export function useAssetMaintenanceHistory(assetName: string | null) {
+ const [logs, setLogs] = useState([]);
+ const [totalCount, setTotalCount] = useState(0);
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState(null);
+
+ const fetchHistory = useCallback(async () => {
+ if (!assetName) {
+ setLogs([]);
+ setLoading(false);
+ return;
+ }
+
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await assetMaintenanceService.getMaintenanceLogsByAsset(assetName);
+ setLogs(response.asset_maintenance_logs);
+ setTotalCount(response.total_count);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : 'Failed to fetch maintenance history');
+ } finally {
+ setLoading(false);
+ }
+ }, [assetName]);
+
+ useEffect(() => {
+ fetchHistory();
+ }, [fetchHistory]);
+
+ return { logs, totalCount, loading, error, refetch: fetchHistory };
+}
+
+/**
+ * Hook to fetch overdue maintenance logs
+ */
+export function useOverdueMaintenanceLogs() {
+ const [logs, setLogs] = useState([]);
+ const [totalCount, setTotalCount] = useState(0);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ const fetchOverdue = useCallback(async () => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await assetMaintenanceService.getOverdueMaintenanceLogs();
+ setLogs(response.asset_maintenance_logs);
+ setTotalCount(response.total_count);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : 'Failed to fetch overdue maintenance');
+ } finally {
+ setLoading(false);
+ }
+ }, []);
+
+ useEffect(() => {
+ fetchOverdue();
+ }, [fetchOverdue]);
+
+ return { logs, totalCount, loading, error, refetch: fetchOverdue };
+}
+
diff --git a/src/hooks/usePPM.ts b/src/hooks/usePPM.ts
new file mode 100644
index 0000000..dca0d66
--- /dev/null
+++ b/src/hooks/usePPM.ts
@@ -0,0 +1,174 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import ppmService from '../services/ppmService';
+import type { AssetMaintenance, PPMFilters, CreatePPMData } from '../services/ppmService';
+
+/**
+ * Hook to fetch list of asset maintenances (PPM schedules) with filters and pagination
+ */
+export function usePPMs(
+ filters?: PPMFilters,
+ limit: number = 20,
+ offset: number = 0,
+ orderBy?: string
+) {
+ const [ppms, setPPMs] = useState([]);
+ const [totalCount, setTotalCount] = useState(0);
+ const [hasMore, setHasMore] = useState(false);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+ const [refetchTrigger, setRefetchTrigger] = useState(0);
+ const hasAttemptedRef = useRef(false);
+
+ const filtersJson = JSON.stringify(filters);
+
+ useEffect(() => {
+ if (hasAttemptedRef.current && error) {
+ return;
+ }
+
+ let isCancelled = false;
+ hasAttemptedRef.current = true;
+
+ const fetchPPMs = async () => {
+ try {
+ setLoading(true);
+
+ const response = await ppmService.getAssetMaintenances(filters, undefined, limit, offset, orderBy);
+
+ if (!isCancelled) {
+ setPPMs(response.asset_maintenances);
+ setTotalCount(response.total_count);
+ setHasMore(response.has_more);
+ setError(null);
+ }
+ } catch (err) {
+ if (!isCancelled) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to fetch PPM schedules';
+
+ if (errorMessage.includes('417') || errorMessage.includes('Expectation Failed') || errorMessage.includes('has no attribute')) {
+ setError('API endpoint not deployed. Please deploy ppm_api.py to your Frappe server.');
+ } else {
+ setError(errorMessage);
+ }
+
+ setPPMs([]);
+ setTotalCount(0);
+ setHasMore(false);
+ }
+ } finally {
+ if (!isCancelled) {
+ setLoading(false);
+ }
+ }
+ };
+
+ fetchPPMs();
+
+ return () => {
+ isCancelled = true;
+ };
+ // eslint-disable-next-line react-hooks/exhaustive-deps
+ }, [filtersJson, limit, offset, orderBy, refetchTrigger]);
+
+ const refetch = useCallback(() => {
+ hasAttemptedRef.current = false;
+ setRefetchTrigger(prev => prev + 1);
+ }, []);
+
+ return { ppms, totalCount, hasMore, loading, error, refetch };
+}
+
+/**
+ * Hook to fetch a single PPM schedule by name
+ */
+export function usePPMDetails(ppmName: string | null) {
+ const [ppm, setPPM] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ const fetchPPM = useCallback(async () => {
+ if (!ppmName) {
+ setPPM(null);
+ setLoading(false);
+ return;
+ }
+
+ try {
+ setLoading(true);
+ setError(null);
+
+ const data = await ppmService.getAssetMaintenanceDetails(ppmName);
+ setPPM(data);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : 'Failed to fetch PPM details');
+ } finally {
+ setLoading(false);
+ }
+ }, [ppmName]);
+
+ useEffect(() => {
+ fetchPPM();
+ }, [fetchPPM]);
+
+ const refetch = useCallback(() => {
+ fetchPPM();
+ }, [fetchPPM]);
+
+ return { ppm, loading, error, refetch };
+}
+
+/**
+ * Hook to manage PPM operations (create, update, delete)
+ */
+export function usePPMMutations() {
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState(null);
+
+ const createPPM = useCallback(async (data: CreatePPMData) => {
+ try {
+ setLoading(true);
+ setError(null);
+ const result = await ppmService.createAssetMaintenance(data);
+ return result;
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to create PPM schedule';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ }, []);
+
+ const updatePPM = useCallback(async (ppmName: string, data: Partial) => {
+ try {
+ setLoading(true);
+ setError(null);
+ const result = await ppmService.updateAssetMaintenance(ppmName, data);
+ return result;
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to update PPM schedule';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ }, []);
+
+ const deletePPM = useCallback(async (ppmName: string) => {
+ try {
+ setLoading(true);
+ setError(null);
+ const result = await ppmService.deleteAssetMaintenance(ppmName);
+ return result;
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to delete PPM schedule';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ }, []);
+
+ return { createPPM, updatePPM, deletePPM, loading, error };
+}
+
diff --git a/src/hooks/useWorkOrder.ts b/src/hooks/useWorkOrder.ts
new file mode 100644
index 0000000..5aaab75
--- /dev/null
+++ b/src/hooks/useWorkOrder.ts
@@ -0,0 +1,220 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import workOrderService from '../services/workOrderService';
+import type { WorkOrder, WorkOrderFilters, CreateWorkOrderData } from '../services/workOrderService';
+
+/**
+ * Hook to fetch list of work orders with filters and pagination
+ */
+export function useWorkOrders(
+ filters?: WorkOrderFilters,
+ limit: number = 20,
+ offset: number = 0,
+ orderBy?: string
+) {
+ const [workOrders, setWorkOrders] = useState([]);
+ const [totalCount, setTotalCount] = useState(0);
+ const [hasMore, setHasMore] = useState(false);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+ const [refetchTrigger, setRefetchTrigger] = useState(0);
+ const hasAttemptedRef = useRef(false);
+
+ const filtersJson = JSON.stringify(filters);
+
+ useEffect(() => {
+ if (hasAttemptedRef.current && error) {
+ return;
+ }
+
+ let isCancelled = false;
+ hasAttemptedRef.current = true;
+
+ const fetchWorkOrders = async () => {
+ try {
+ setLoading(true);
+
+ const response = await workOrderService.getWorkOrders(filters, undefined, limit, offset, orderBy);
+
+ if (!isCancelled) {
+ setWorkOrders(response.work_orders);
+ setTotalCount(response.total_count);
+ setHasMore(response.has_more);
+ setError(null);
+ }
+ } catch (err) {
+ if (!isCancelled) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to fetch work orders';
+
+ if (errorMessage.includes('417') || errorMessage.includes('Expectation Failed') || errorMessage.includes('has no attribute')) {
+ setError('API endpoint not deployed. Please deploy work_order_api.py to your Frappe server.');
+ } else {
+ setError(errorMessage);
+ }
+
+ setWorkOrders([]);
+ setTotalCount(0);
+ setHasMore(false);
+ }
+ } finally {
+ if (!isCancelled) {
+ setLoading(false);
+ }
+ }
+ };
+
+ fetchWorkOrders();
+
+ return () => {
+ isCancelled = true;
+ };
+ }, [filtersJson, limit, offset, orderBy, refetchTrigger]);
+
+ const refetch = useCallback(() => {
+ hasAttemptedRef.current = false;
+ setRefetchTrigger(prev => prev + 1);
+ }, []);
+
+ return { workOrders, totalCount, hasMore, loading, error, refetch };
+}
+
+/**
+ * Hook to fetch a single work order by name
+ */
+export function useWorkOrderDetails(workOrderName: string | null) {
+ const [workOrder, setWorkOrder] = useState(null);
+ const [loading, setLoading] = useState(true);
+ const [error, setError] = useState(null);
+
+ const fetchWorkOrder = useCallback(async () => {
+ if (!workOrderName) {
+ setWorkOrder(null);
+ setLoading(false);
+ return;
+ }
+
+ try {
+ setLoading(true);
+ setError(null);
+
+ const data = await workOrderService.getWorkOrderDetails(workOrderName);
+ setWorkOrder(data);
+ } catch (err) {
+ setError(err instanceof Error ? err.message : 'Failed to fetch work order details');
+ } finally {
+ setLoading(false);
+ }
+ }, [workOrderName]);
+
+ useEffect(() => {
+ fetchWorkOrder();
+ }, [fetchWorkOrder]);
+
+ const refetch = useCallback(() => {
+ fetchWorkOrder();
+ }, [fetchWorkOrder]);
+
+ return { workOrder, loading, error, refetch };
+}
+
+/**
+ * Hook to manage work order operations (create, update, delete)
+ */
+export function useWorkOrderMutations() {
+ const [loading, setLoading] = useState(false);
+ const [error, setError] = useState(null);
+
+ const createWorkOrder = async (workOrderData: CreateWorkOrderData) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ console.log('[useWorkOrderMutations] Creating work order with data:', workOrderData);
+ const response = await workOrderService.createWorkOrder(workOrderData);
+ console.log('[useWorkOrderMutations] Create work order response:', response);
+
+ if (response.success) {
+ return response.work_order;
+ } else {
+ const backendError = (response as any).error || 'Failed to create work order';
+ throw new Error(backendError);
+ }
+ } catch (err) {
+ console.error('[useWorkOrderMutations] Create work order error:', err);
+ const errorMessage = err instanceof Error ? err.message : 'Failed to create work order';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const updateWorkOrder = async (workOrderName: string, workOrderData: Partial) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ console.log('[useWorkOrderMutations] Updating work order:', workOrderName, 'with data:', workOrderData);
+ const response = await workOrderService.updateWorkOrder(workOrderName, workOrderData);
+ console.log('[useWorkOrderMutations] Update work order response:', response);
+
+ if (response.success) {
+ return response.work_order;
+ } else {
+ const backendError = (response as any).error || 'Failed to update work order';
+ throw new Error(backendError);
+ }
+ } catch (err) {
+ console.error('[useWorkOrderMutations] Update work order error:', err);
+ const errorMessage = err instanceof Error ? err.message : 'Failed to update work order';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const deleteWorkOrder = async (workOrderName: string) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await workOrderService.deleteWorkOrder(workOrderName);
+
+ if (!response.success) {
+ throw new Error('Failed to delete work order');
+ }
+
+ return response;
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to delete work order';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ const updateStatus = async (workOrderName: string, repairStatus?: string, workflowState?: string) => {
+ try {
+ setLoading(true);
+ setError(null);
+
+ const response = await workOrderService.updateWorkOrderStatus(workOrderName, repairStatus, workflowState);
+
+ if (response.success) {
+ return response.work_order;
+ } else {
+ throw new Error('Failed to update work order status');
+ }
+ } catch (err) {
+ const errorMessage = err instanceof Error ? err.message : 'Failed to update status';
+ setError(errorMessage);
+ throw err;
+ } finally {
+ setLoading(false);
+ }
+ };
+
+ return { createWorkOrder, updateWorkOrder, deleteWorkOrder, updateStatus, loading, error };
+}
+
diff --git a/src/index.css b/src/index.css
index 0d70891..3cb6b70 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,3 +1,5 @@
+@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
+
@tailwind base;
@tailwind components;
@tailwind utilities;
diff --git a/src/pages/AssetDetail.tsx b/src/pages/AssetDetail.tsx
index b09ff44..ff5ed7b 100644
--- a/src/pages/AssetDetail.tsx
+++ b/src/pages/AssetDetail.tsx
@@ -4,6 +4,9 @@ import { useAssetDetails, useAssetMutations } from '../hooks/useAsset';
import { FaArrowLeft, FaSave, FaEdit, FaQrcode } from 'react-icons/fa';
import type { CreateAssetData } from '../services/assetService';
+import LinkField from '../components/LinkField';
+import apiService from '../services/apiService'; // ✅ your ApiService
+
// Helper function to get the base URL for files
const getFileBaseUrl = () => {
// Always use the full URL to avoid proxy path duplication issues
@@ -24,8 +27,12 @@ const AssetDetail: React.FC = () => {
isDuplicating ? duplicateFromAsset : (isNewAsset ? null : assetName || null)
);
const { createAsset, updateAsset, loading: saving } = useAssetMutations();
-
+
const [isEditing, setIsEditing] = useState(isNewAsset);
+
+ const [userSiteName, setUserSiteName] = useState('');
+ const [departmentFilters, setDepartmentFilters] = useState>({});
+
const [formData, setFormData] = useState({
asset_name: '',
company: '',
@@ -44,9 +51,53 @@ const AssetDetail: React.FC = () => {
custom_modality: '',
custom_attach_image: '',
custom_site_contractor: '',
- custom_total_amount: 0
+ custom_total_amount: 0,
+ calculate_depreciation: false,
+ available_for_use_date: isNewAsset ? new Date().toISOString().split('T')[0] : undefined
});
+ // Load user details on mount
+ useEffect(() => {
+ async function loadUserDetails() {
+ try {
+ const user = await apiService.getUserDetails();
+ setUserSiteName(user.custom_site_name || '');
+ } catch (err) {
+ console.error('Error loading user details', err);
+ }
+ }
+
+ loadUserDetails();
+ }, []);
+
+ // Update department filters when company or userSiteName changes
+ useEffect(() => {
+ const filters: Record = {};
+
+ // Base filter: company must match
+ if (formData.company) {
+ filters['company'] = formData.company;
+ }
+
+ // Apply department name filters based on site name and company
+ const isMobileSite =
+ (userSiteName && userSiteName.startsWith('Mobile')) ||
+ (formData.company && formData.company.startsWith('Mobile'));
+
+ if (isMobileSite) {
+ // For Mobile sites, exclude Non Bio departments (show Bio departments)
+ // Frappe filter format: ['not like', 'pattern']
+ filters['department_name'] = ['not like', 'Non Bio%'];
+ } else if (userSiteName || formData.company) {
+ // For non-Mobile sites, exclude Bio departments (show Non-Bio departments)
+ filters['department_name'] = ['not like', 'Bio%'];
+ }
+
+ console.log('Department filters updated:', filters); // Debug log
+
+ setDepartmentFilters(filters);
+ }, [formData.company, userSiteName]);
+
// Load asset data for editing or duplicating
useEffect(() => {
if (asset) {
@@ -71,11 +122,52 @@ const AssetDetail: React.FC = () => {
custom_modality: asset.custom_modality || '',
custom_attach_image: asset.custom_attach_image || '',
custom_site_contractor: asset.custom_site_contractor || '',
- custom_total_amount: asset.custom_total_amount || 0
+ custom_total_amount: asset.custom_total_amount || 0,
+ gross_purchase_amount:asset.gross_purchase_amount || 0,
+ available_for_use_date: asset.available_for_use_date || '',
+ calculate_depreciation: asset.calculate_depreciation || false
});
}
}, [asset, isDuplicating]);
+ const [qrCodeUrl, setQrCodeUrl] = useState(null);
+
+ useEffect(() => {
+ if (!assetName || assetName === "new") return;
+
+ const fetchQRCode = async () => {
+ try {
+ // Try fixed predictable URL
+ const directUrl = `/files/${assetName}-qr.png`;
+ console.log(directUrl)
+
+ // Quickly test if file exists
+ const response = await fetch(directUrl, { method: "HEAD" });
+ console.log(response)
+
+ if (response.ok) {
+ setQrCodeUrl(directUrl);
+ return;
+ }
+
+ // If not available, fallback to File doctype API
+ const fileRes = await apiService.apiCall(
+ `/api/resource/File?filters=[["File","attached_to_name","=","${assetName}"]]`
+ );
+
+ if (fileRes?.data?.length > 0) {
+ setQrCodeUrl(fileRes.data[0].file_url);
+ }
+
+ } catch (error) {
+ console.error("Error loading QR code:", error);
+ }
+ };
+
+ fetchQRCode();
+ }, [assetName, asset]);
+
+
const handleChange = (e: React.ChangeEvent) => {
const { name, value } = e.target;
setFormData(prev => ({
@@ -104,6 +196,10 @@ const AssetDetail: React.FC = () => {
try {
if (isNewAsset || isDuplicating) {
const newAsset = await createAsset(formData);
+ if (newAsset.name) {
+ const qrUrl = `/files/${newAsset.name}-qr.png`;
+ setQrCodeUrl(qrUrl);
+ }
const successMessage = isDuplicating
? 'Asset duplicated successfully!'
: 'Asset created successfully!';
@@ -273,7 +369,7 @@ const AssetDetail: React.FC = () => {
/>
-
- = ({ userEmail }) => {
`}
title={isCollapsed ? link.title : ''}
>
- {link.icon}
+ {link.icon}
{!isCollapsed && (
{link.title}
)}
@@ -227,7 +267,7 @@ const Sidebar: React.FC = ({ userEmail }) => {
className="w-full flex items-center justify-center px-4 py-2 rounded-lg bg-gray-100 dark:bg-gray-700 hover:bg-gray-200 dark:hover:bg-gray-600 transition-colors text-gray-700 dark:text-gray-300"
title={isCollapsed ? (theme === 'light' ? 'Dark Mode' : 'Light Mode') : ''}
>
- {theme === 'light' ? = ({ userEmail }) => {
className="w-full flex items-center justify-center px-4 py-2 rounded-lg bg-red-50 dark:bg-red-900/20 hover:bg-red-100 dark:hover:bg-red-900/30 transition-colors text-red-600 dark:text-red-400"
title={isCollapsed ? 'Logout' : ''}
>
- = ({ userEmail }) => {
{!isCollapsed && (
diff --git a/src/config/api.ts b/src/config/api.ts
index 2717047..afc9602 100644
--- a/src/config/api.ts
+++ b/src/config/api.ts
@@ -40,6 +40,35 @@ const API_CONFIG: ApiConfig = {
GET_ASSET_STATS: '/api/method/asset_lite.api.asset_api.get_asset_stats',
SEARCH_ASSETS: '/api/method/asset_lite.api.asset_api.search_assets',
+ // Work Order Management
+ GET_WORK_ORDERS: '/api/method/asset_lite.api.work_order_api.get_work_orders',
+ GET_WORK_ORDER_DETAILS: '/api/method/asset_lite.api.work_order_api.get_work_order_details',
+ CREATE_WORK_ORDER: '/api/method/asset_lite.api.work_order_api.create_work_order',
+ UPDATE_WORK_ORDER: '/api/method/asset_lite.api.work_order_api.update_work_order',
+ DELETE_WORK_ORDER: '/api/method/asset_lite.api.work_order_api.delete_work_order',
+ UPDATE_WORK_ORDER_STATUS: '/api/method/asset_lite.api.work_order_api.update_work_order_status',
+
+ // Asset Maintenance Management
+ GET_ASSET_MAINTENANCE_LOGS: '/api/method/asset_lite.api.asset_maintenance_api.get_asset_maintenance_logs',
+ GET_ASSET_MAINTENANCE_LOG_DETAILS: '/api/method/asset_lite.api.asset_maintenance_api.get_asset_maintenance_log_details',
+ CREATE_ASSET_MAINTENANCE_LOG: '/api/method/asset_lite.api.asset_maintenance_api.create_asset_maintenance_log',
+ UPDATE_ASSET_MAINTENANCE_LOG: '/api/method/asset_lite.api.asset_maintenance_api.update_asset_maintenance_log',
+ DELETE_ASSET_MAINTENANCE_LOG: '/api/method/asset_lite.api.asset_maintenance_api.delete_asset_maintenance_log',
+ UPDATE_MAINTENANCE_STATUS: '/api/method/asset_lite.api.asset_maintenance_api.update_maintenance_status',
+ GET_MAINTENANCE_LOGS_BY_ASSET: '/api/method/asset_lite.api.asset_maintenance_api.get_maintenance_logs_by_asset',
+ GET_OVERDUE_MAINTENANCE_LOGS: '/api/method/asset_lite.api.asset_maintenance_api.get_overdue_maintenance_logs',
+
+ // PPM (Asset Maintenance) Management
+ GET_ASSET_MAINTENANCES: '/api/method/asset_lite.api.ppm_api.get_asset_maintenances',
+ GET_ASSET_MAINTENANCE_DETAILS: '/api/method/asset_lite.api.ppm_api.get_asset_maintenance_details',
+ CREATE_ASSET_MAINTENANCE: '/api/method/asset_lite.api.ppm_api.create_asset_maintenance',
+ UPDATE_ASSET_MAINTENANCE: '/api/method/asset_lite.api.ppm_api.update_asset_maintenance',
+ DELETE_ASSET_MAINTENANCE: '/api/method/asset_lite.api.ppm_api.delete_asset_maintenance',
+ GET_MAINTENANCE_TASKS: '/api/method/asset_lite.api.ppm_api.get_maintenance_tasks',
+ GET_SERVICE_COVERAGE: '/api/method/asset_lite.api.ppm_api.get_service_coverage',
+ GET_MAINTENANCES_BY_ASSET: '/api/method/asset_lite.api.ppm_api.get_maintenances_by_asset',
+ GET_ACTIVE_SERVICE_CONTRACTS: '/api/method/asset_lite.api.ppm_api.get_active_service_contracts',
+
// Authentication
LOGIN: '/api/method/login',
LOGOUT: '/api/method/logout',
diff --git a/src/hooks/useAssetMaintenance.ts b/src/hooks/useAssetMaintenance.ts
new file mode 100644
index 0000000..2741139
--- /dev/null
+++ b/src/hooks/useAssetMaintenance.ts
@@ -0,0 +1,288 @@
+import { useState, useEffect, useCallback, useRef } from 'react';
+import assetMaintenanceService from '../services/assetMaintenanceService';
+import type { AssetMaintenanceLog, MaintenanceFilters, CreateMaintenanceData } from '../services/assetMaintenanceService';
+
+/**
+ * Hook to fetch list of asset maintenance logs with filters and pagination
+ */
+export function useAssetMaintenanceLogs(
+ filters?: MaintenanceFilters,
+ limit: number = 20,
+ offset: number = 0,
+ orderBy?: string
+) {
+ const [logs, setLogs] = useState
- AL
+
@@ -211,7 +251,7 @@ const Sidebar: React.FC
+
+ )}
+ {isCollapsed && (
+
+ {/* Seera Arabia Logo */}
+ 
{
+ // Fallback to SVG if image not found
+ e.currentTarget.style.display = 'none';
+ e.currentTarget.nextElementSibling?.classList.remove('hidden');
+ }}
+ />
+
- {
+ // Fallback to SVG if image not found
+ e.currentTarget.style.display = 'none';
+ e.currentTarget.nextElementSibling?.classList.remove('hidden');
+ }}
+ />
+
Asset Lite
+Seera Arabia
+
+ {
+ e.currentTarget.style.display = 'none';
+ e.currentTarget.nextElementSibling?.classList.remove('hidden');
+ }}
+ />
+
)}
{
+ e.currentTarget.style.display = 'none';
+ e.currentTarget.nextElementSibling?.classList.remove('hidden');
+ }}
+ />
+
- Asset Lite v1.0
+ Seera Arabia AMS v1.0
)}
+ {/*
*/}
-
@@ -291,9 +387,18 @@ const AssetDetail: React.FC = () => {
-
+
+ setFormData({ ...formData, custom_asset_type: val })}
+ disabled={!isEditing}
+ />
+
+
+ {/*
*/}
+
@@ -311,7 +416,15 @@ const AssetDetail: React.FC = () => {
-
+
+ {/*
*/}
+
+
@@ -406,7 +519,15 @@ const AssetDetail: React.FC = () => {
disabled={!isEditing}
className="w-full px-3 py-2 border border-gray-300 dark:border-gray-600 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 bg-white dark:bg-gray-700 text-gray-900 dark:text-white"
/>
-
+
-
- {asset?.name ? (
+
+ {qrCodeUrl ? (
<>
}/files/${asset.name}-qr.png`})
{
// Hide image and show fallback icon if QR code doesn't exist
@@ -878,6 +1082,7 @@ const AssetDetail: React.FC = () => {
)}
+
{
// Hide image and show fallback icon if QR code doesn't exist
@@ -878,6 +1082,7 @@ const AssetDetail: React.FC = () => {
)}