mirror of
https://gitlab.com/MoonTestUse1/AdministrationItDepartmens.git
synced 2025-08-14 00:25:46 +02:00
Fix TypeScript errors in AdminDashboard
This commit is contained in:
65
frontend/src/plugins/websocket.ts
Normal file
65
frontend/src/plugins/websocket.ts
Normal file
@@ -0,0 +1,65 @@
|
|||||||
|
class WebSocketClient {
|
||||||
|
private ws: WebSocket | null = null;
|
||||||
|
private messageHandlers: ((data: any) => void)[] = [];
|
||||||
|
private reconnectTimeout: number | null = null;
|
||||||
|
public isConnected: boolean = false;
|
||||||
|
|
||||||
|
connect(role: string) {
|
||||||
|
if (this.ws) {
|
||||||
|
this.ws.close();
|
||||||
|
}
|
||||||
|
|
||||||
|
const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
|
||||||
|
const wsUrl = `${protocol}//${window.location.host}/api/ws/${role}`;
|
||||||
|
|
||||||
|
this.ws = new WebSocket(wsUrl);
|
||||||
|
|
||||||
|
this.ws.onopen = () => {
|
||||||
|
console.log('WebSocket connected');
|
||||||
|
this.isConnected = true;
|
||||||
|
};
|
||||||
|
|
||||||
|
this.ws.onclose = () => {
|
||||||
|
console.log('WebSocket disconnected');
|
||||||
|
this.isConnected = false;
|
||||||
|
|
||||||
|
// Попытка переподключения через 3 секунды
|
||||||
|
if (this.reconnectTimeout === null) {
|
||||||
|
this.reconnectTimeout = window.setTimeout(() => {
|
||||||
|
this.reconnectTimeout = null;
|
||||||
|
this.connect(role);
|
||||||
|
}, 3000);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
this.ws.onmessage = (event) => {
|
||||||
|
try {
|
||||||
|
const data = JSON.parse(event.data);
|
||||||
|
this.messageHandlers.forEach(handler => handler(data));
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Error parsing WebSocket message:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
disconnect() {
|
||||||
|
if (this.ws) {
|
||||||
|
this.ws.close();
|
||||||
|
this.ws = null;
|
||||||
|
}
|
||||||
|
if (this.reconnectTimeout !== null) {
|
||||||
|
clearTimeout(this.reconnectTimeout);
|
||||||
|
this.reconnectTimeout = null;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
addMessageHandler(handler: (data: any) => void) {
|
||||||
|
this.messageHandlers.push(handler);
|
||||||
|
}
|
||||||
|
|
||||||
|
removeMessageHandler(handler: (data: any) => void) {
|
||||||
|
this.messageHandlers = this.messageHandlers.filter(h => h !== handler);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const wsClient = new WebSocketClient();
|
||||||
10
frontend/src/utils/date.ts
Normal file
10
frontend/src/utils/date.ts
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
export function formatDate(dateString: string): string {
|
||||||
|
const date = new Date(dateString);
|
||||||
|
return date.toLocaleString('ru-RU', {
|
||||||
|
year: 'numeric',
|
||||||
|
month: 'long',
|
||||||
|
day: 'numeric',
|
||||||
|
hour: '2-digit',
|
||||||
|
minute: '2-digit'
|
||||||
|
});
|
||||||
|
}
|
||||||
@@ -72,8 +72,27 @@ import axios from '@/plugins/axios'
|
|||||||
import { wsClient } from '@/plugins/websocket'
|
import { wsClient } from '@/plugins/websocket'
|
||||||
import { formatDate } from '@/utils/date'
|
import { formatDate } from '@/utils/date'
|
||||||
|
|
||||||
const requests = ref([])
|
interface Request {
|
||||||
const statistics = ref({
|
id: number;
|
||||||
|
employee_name: string;
|
||||||
|
request_type: string;
|
||||||
|
priority: 'high' | 'medium' | 'low';
|
||||||
|
status: 'new' | 'in_progress' | 'completed' | 'rejected';
|
||||||
|
created_at: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
interface Statistics {
|
||||||
|
total: number;
|
||||||
|
by_status: {
|
||||||
|
new: number;
|
||||||
|
in_progress: number;
|
||||||
|
completed: number;
|
||||||
|
rejected: number;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
const requests = ref<Request[]>([])
|
||||||
|
const statistics = ref<Statistics>({
|
||||||
total: 0,
|
total: 0,
|
||||||
by_status: {
|
by_status: {
|
||||||
new: 0,
|
new: 0,
|
||||||
@@ -147,27 +166,26 @@ const fetchData = async () => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const getPriorityClass = (priority: string) => {
|
const getPriorityClass = (priority: 'high' | 'medium' | 'low'): string => {
|
||||||
const classes = {
|
const classes = {
|
||||||
high: 'text-red-600',
|
high: 'text-red-600',
|
||||||
medium: 'text-yellow-600',
|
medium: 'text-yellow-600',
|
||||||
low: 'text-green-600'
|
low: 'text-green-600'
|
||||||
}
|
}
|
||||||
return classes[priority] || ''
|
return classes[priority]
|
||||||
}
|
}
|
||||||
|
|
||||||
const getStatusClass = (status: string) => {
|
const getStatusClass = (status: 'new' | 'in_progress' | 'completed' | 'rejected'): string => {
|
||||||
const classes = {
|
const classes = {
|
||||||
new: 'text-blue-600',
|
new: 'text-blue-600',
|
||||||
in_progress: 'text-yellow-600',
|
in_progress: 'text-yellow-600',
|
||||||
completed: 'text-green-600',
|
completed: 'text-green-600',
|
||||||
rejected: 'text-red-600'
|
rejected: 'text-red-600'
|
||||||
}
|
}
|
||||||
return classes[status] || ''
|
return classes[status]
|
||||||
}
|
}
|
||||||
|
|
||||||
const openRequestDetails = (request: any) => {
|
const openRequestDetails = (request: Request) => {
|
||||||
// Здесь можно добавить логику открытия модального окна с деталями заявки
|
|
||||||
console.log('Opening request details:', request)
|
console.log('Opening request details:', request)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user