1
0
mirror of https://gitlab.com/MoonTestUse1/AdministrationItDepartmens.git synced 2025-08-14 00:25:46 +02:00

Переделка6

This commit is contained in:
MoonTestUse1
2025-01-02 03:08:51 +06:00
parent ea7907a08a
commit e3a55901c1

View File

@@ -1,152 +1,82 @@
<template> <template>
<div class="min-h-screen bg-gray-50"> <div class="min-h-screen bg-gray-100">
<!-- Header --> <!-- Верхняя панель -->
<header class="bg-white shadow"> <header class="bg-white border-b">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center"> <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<h1 class="text-2xl font-bold text-gray-900">Панель администратора</h1> <div class="flex justify-between items-center h-16">
<button <h1 class="text-xl font-medium text-gray-900">Панель администратора</h1>
@click="handleLogout" <button
class="px-4 py-2 bg-red-600 text-white rounded-lg hover:bg-red-700 transition-colors flex items-center gap-2" @click="handleLogout"
> class="text-gray-500 hover:text-gray-700 font-medium"
Выйти >
</button> Выйти
</button>
</div>
</div> </div>
</header> </header>
<main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8"> <main class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<!-- Статистика --> <!-- Статистика -->
<div class="mb-8"> <div class="grid grid-cols-1 gap-4 sm:grid-cols-3 mb-8">
<h2 class="text-lg font-semibold text-gray-900 mb-4">Статистика заявок</h2> <div class="bg-white p-6 rounded-lg">
<div class="grid grid-cols-1 gap-5 sm:grid-cols-3"> <div class="text-sm font-medium text-gray-500 mb-1">Новые заявки</div>
<!-- Новые заявки --> <div class="text-2xl font-medium text-gray-900">{{ statistics.new || 0 }}</div>
<div class="bg-white overflow-hidden shadow-lg rounded-lg"> </div>
<div class="p-5"> <div class="bg-white p-6 rounded-lg">
<div class="flex items-center"> <div class="text-sm font-medium text-gray-500 mb-1">В работе</div>
<div class="flex-shrink-0"> <div class="text-2xl font-medium text-gray-900">{{ statistics.inProgress || 0 }}</div>
<div class="rounded-md bg-blue-500 p-3"> </div>
<svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <div class="bg-white p-6 rounded-lg">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" /> <div class="text-sm font-medium text-gray-500 mb-1">Решенные</div>
</svg> <div class="text-2xl font-medium text-gray-900">{{ statistics.resolved || 0 }}</div>
</div>
</div>
<div class="ml-5 w-0 flex-1">
<dl>
<dt class="text-sm font-medium text-gray-500 truncate">Новые заявки</dt>
<dd class="flex items-baseline">
<div class="text-2xl font-semibold text-gray-900">{{ statistics.new || 0 }}</div>
</dd>
</dl>
</div>
</div>
</div>
</div>
<!-- В работе -->
<div class="bg-white overflow-hidden shadow-lg rounded-lg">
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="rounded-md bg-yellow-500 p-3">
<svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
</svg>
</div>
</div>
<div class="ml-5 w-0 flex-1">
<dl>
<dt class="text-sm font-medium text-gray-500 truncate">В работе</dt>
<dd class="flex items-baseline">
<div class="text-2xl font-semibold text-gray-900">{{ statistics.inProgress || 0 }}</div>
</dd>
</dl>
</div>
</div>
</div>
</div>
<!-- Решенные -->
<div class="bg-white overflow-hidden shadow-lg rounded-lg">
<div class="p-5">
<div class="flex items-center">
<div class="flex-shrink-0">
<div class="rounded-md bg-green-500 p-3">
<svg class="h-6 w-6 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
</svg>
</div>
</div>
<div class="ml-5 w-0 flex-1">
<dl>
<dt class="text-sm font-medium text-gray-500 truncate">Решенные</dt>
<dd class="flex items-baseline">
<div class="text-2xl font-semibold text-gray-900">{{ statistics.resolved || 0 }}</div>
</dd>
</dl>
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<!-- Заявки --> <!-- Заявки -->
<div class="mb-8"> <div class="mb-8">
<div class="sm:flex sm:items-center sm:justify-between mb-4"> <div class="flex justify-between items-center mb-4">
<h2 class="text-lg font-semibold text-gray-900">Список заявок</h2> <h2 class="text-lg font-medium text-gray-900">Заявки</h2>
<div class="mt-3 sm:mt-0 sm:ml-4">
<button
@click="activeTab = 'requests'"
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500"
>
Все заявки
</button>
</div>
</div> </div>
<div class="bg-white rounded-lg overflow-hidden">
<div class="bg-white shadow-lg rounded-lg overflow-hidden">
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50"> <thead>
<tr> <tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">ID</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Сотрудник</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Сотрудник</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Отдел</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Отдел</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Тип</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Тип</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Приоритет</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Приоритет</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Статус</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Статус</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Действия</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Действия</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white divide-y divide-gray-200"> <tbody class="divide-y divide-gray-200">
<tr v-for="request in requests" :key="request.id"> <tr v-for="request in requests" :key="request.id" class="hover:bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ request.id }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ request.id }}</td>
<td class="px-6 py-4 whitespace-nowrap"> <td class="px-6 py-4">
<div class="text-sm text-gray-900">{{ request.employee?.last_name }}</div> <div class="text-sm text-gray-900">{{ request.employee?.last_name }}</div>
<div class="text-sm text-gray-500">{{ request.employee?.first_name }}</div> <div class="text-sm text-gray-500">{{ request.employee?.first_name }}</div>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ request.department }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ request.department }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ request.request_type }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ request.request_type }}</td>
<td class="px-6 py-4 whitespace-nowrap"> <td class="px-6 py-4">
<span :class="getPriorityClass(request.priority)"> <span :class="getPriorityClass(request.priority)">{{ request.priority }}</span>
{{ request.priority }}
</span>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap"> <td class="px-6 py-4">
<span :class="getStatusClass(request.status)"> <span :class="getStatusClass(request.status)">{{ request.status }}</span>
{{ request.status }}
</span>
</td> </td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td class="px-6 py-4 text-sm">
<button <button
@click="openRequestDetails(request)" @click="openRequestDetails(request)"
class="text-blue-600 hover:text-blue-900 mr-3" class="text-gray-700 hover:text-gray-900 mr-3"
> >
Подробнее Подробнее
</button> </button>
<button <button
v-if="request.status !== 'resolved'" v-if="request.status !== 'resolved'"
@click="updateRequestStatus(request)" @click="updateRequestStatus(request)"
class="text-green-600 hover:text-green-900" class="text-blue-600 hover:text-blue-700"
> >
{{ request.status === 'new' ? 'Взять в работу' : 'Завершить' }} {{ request.status === 'new' ? 'Взять в работу' : 'Завершить' }}
</button> </button>
@@ -160,42 +90,39 @@
<!-- Сотрудники --> <!-- Сотрудники -->
<div> <div>
<div class="sm:flex sm:items-center sm:justify-between mb-4"> <div class="flex justify-between items-center mb-4">
<h2 class="text-lg font-semibold text-gray-900">Список сотрудников</h2> <h2 class="text-lg font-medium text-gray-900">Сотрудники</h2>
<div class="mt-3 sm:mt-0 sm:ml-4"> <button
<button @click="openAddEmployeeModal"
@click="openAddEmployeeModal" class="inline-flex items-center px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
class="inline-flex items-center px-4 py-2 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-blue-600 hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500" >
> + Добавить сотрудника
Добавить сотрудника </button>
</button>
</div>
</div> </div>
<div class="bg-white rounded-lg overflow-hidden">
<div class="bg-white shadow-lg rounded-lg overflow-hidden">
<div class="overflow-x-auto"> <div class="overflow-x-auto">
<table class="min-w-full divide-y divide-gray-200"> <table class="min-w-full divide-y divide-gray-200">
<thead class="bg-gray-50"> <thead>
<tr> <tr>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">ID</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">ID</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Имя</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Имя</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Фамилия</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Фамилия</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Отдел</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Отдел</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Кабинет</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Кабинет</th>
<th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">Действия</th> <th class="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider bg-gray-50">Действия</th>
</tr> </tr>
</thead> </thead>
<tbody class="bg-white divide-y divide-gray-200"> <tbody class="divide-y divide-gray-200">
<tr v-for="employee in employees" :key="employee.id"> <tr v-for="employee in employees" :key="employee.id" class="hover:bg-gray-50">
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.id }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ employee.id }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.first_name }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ employee.first_name }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.last_name }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ employee.last_name }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.department }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ employee.department }}</td>
<td class="px-6 py-4 whitespace-nowrap text-sm text-gray-900">{{ employee.office }}</td> <td class="px-6 py-4 text-sm text-gray-900">{{ employee.office }}</td>
<td class="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> <td class="px-6 py-4 text-sm">
<button <button
@click="openEditEmployeeModal(employee)" @click="openEditEmployeeModal(employee)"
class="text-blue-600 hover:text-blue-900" class="text-gray-700 hover:text-gray-900"
> >
Редактировать Редактировать
</button> </button>
@@ -209,57 +136,59 @@
</main> </main>
<!-- Модальное окно для заявки --> <!-- Модальное окно для заявки -->
<div v-if="showRequestModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center p-4"> <div v-if="showRequestModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4">
<div class="bg-white rounded-lg max-w-2xl w-full p-6"> <div class="bg-white rounded-lg max-w-2xl w-full">
<div class="flex justify-between items-center mb-4"> <div class="flex justify-between items-center p-6 border-b">
<h3 class="text-lg font-medium">Детали заявки #{{ selectedRequest?.id }}</h3> <h3 class="text-lg font-medium text-gray-900">Заявка #{{ selectedRequest?.id }}</h3>
<button @click="showRequestModal = false" class="text-gray-400 hover:text-gray-500"> <button @click="showRequestModal = false" class="text-gray-400 hover:text-gray-500">
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg> </svg>
</button> </button>
</div> </div>
<div class="space-y-4"> <div class="p-6">
<div> <div class="space-y-4">
<label class="block text-sm font-medium text-gray-700">Описание</label>
<p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.description }}</p>
</div>
<div class="grid grid-cols-2 gap-4">
<div> <div>
<label class="block text-sm font-medium text-gray-700">Сотрудник</label> <div class="text-sm font-medium text-gray-500">Описание</div>
<p class="mt-1 text-sm text-gray-900"> <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.description }}</div>
{{ selectedRequest?.employee?.last_name }} {{ selectedRequest?.employee?.first_name }}
</p>
</div> </div>
<div> <div class="grid grid-cols-2 gap-4">
<label class="block text-sm font-medium text-gray-700">Отдел</label> <div>
<p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.department }}</p> <div class="text-sm font-medium text-gray-500">Сотрудник</div>
</div> <div class="mt-1 text-sm text-gray-900">
<div> {{ selectedRequest?.employee?.last_name }} {{ selectedRequest?.employee?.first_name }}
<label class="block text-sm font-medium text-gray-700">Тип заявки</label> </div>
<p class="mt-1 text-sm text-gray-900">{{ selectedRequest?.request_type }}</p> </div>
</div> <div>
<div> <div class="text-sm font-medium text-gray-500">Отдел</div>
<label class="block text-sm font-medium text-gray-700">Приоритет</label> <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.department }}</div>
<p class="mt-1"> </div>
<span :class="getPriorityClass(selectedRequest?.priority)"> <div>
{{ selectedRequest?.priority }} <div class="text-sm font-medium text-gray-500">Тип заявки</div>
</span> <div class="mt-1 text-sm text-gray-900">{{ selectedRequest?.request_type }}</div>
</p> </div>
<div>
<div class="text-sm font-medium text-gray-500">Приоритет</div>
<div class="mt-1">
<span :class="getPriorityClass(selectedRequest?.priority)">
{{ selectedRequest?.priority }}
</span>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
<div class="mt-6 flex justify-end gap-3"> <div class="flex justify-end gap-3 p-6 border-t bg-gray-50">
<button <button
@click="showRequestModal = false" @click="showRequestModal = false"
class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50" class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-900"
> >
Закрыть Закрыть
</button> </button>
<button <button
v-if="selectedRequest?.status !== 'resolved'" v-if="selectedRequest?.status !== 'resolved'"
@click="updateRequestStatus(selectedRequest)" @click="updateRequestStatus(selectedRequest)"
class="px-4 py-2 bg-blue-600 text-white rounded-md text-sm font-medium hover:bg-blue-700" class="px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
> >
{{ selectedRequest?.status === 'new' ? 'Взять в работу' : 'Завершить' }} {{ selectedRequest?.status === 'new' ? 'Взять в работу' : 'Завершить' }}
</button> </button>
@@ -268,82 +197,84 @@
</div> </div>
<!-- Модальное окно для сотрудника --> <!-- Модальное окно для сотрудника -->
<div v-if="showEmployeeModal" class="fixed inset-0 bg-gray-500 bg-opacity-75 flex items-center justify-center p-4"> <div v-if="showEmployeeModal" class="fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center p-4">
<div class="bg-white rounded-lg max-w-md w-full p-6"> <div class="bg-white rounded-lg max-w-md w-full">
<div class="flex justify-between items-center mb-4"> <div class="flex justify-between items-center p-6 border-b">
<h3 class="text-lg font-medium"> <h3 class="text-lg font-medium text-gray-900">
{{ isEditingEmployee ? 'Редактировать сотрудника' : 'Добавить сотрудника' }} {{ isEditingEmployee ? 'Редактировать сотрудника' : 'Добавить сотрудника' }}
</h3> </h3>
<button @click="showEmployeeModal = false" class="text-gray-400 hover:text-gray-500"> <button @click="showEmployeeModal = false" class="text-gray-400 hover:text-gray-500">
<svg class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor"> <svg class="h-5 w-5" fill="none" viewBox="0 0 24 24" stroke="currentColor">
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" /> <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12" />
</svg> </svg>
</button> </button>
</div> </div>
<form @submit.prevent="handleEmployeeSubmit" class="space-y-4"> <form @submit.prevent="handleEmployeeSubmit" class="p-6">
<div> <div class="space-y-4">
<label class="block text-sm font-medium text-gray-700">Имя</label> <div>
<input <label class="block text-sm font-medium text-gray-700">Имя</label>
v-model="employeeForm.first_name" <input
type="text" v-model="employeeForm.first_name"
required type="text"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" required
/> class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
</div> />
<div> </div>
<label class="block text-sm font-medium text-gray-700">Фамилия</label> <div>
<input <label class="block text-sm font-medium text-gray-700">Фамилия</label>
v-model="employeeForm.last_name" <input
type="text" v-model="employeeForm.last_name"
required type="text"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" required
/> class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
</div> />
<div> </div>
<label class="block text-sm font-medium text-gray-700">Отдел</label> <div>
<input <label class="block text-sm font-medium text-gray-700">Отдел</label>
v-model="employeeForm.department" <input
type="text" v-model="employeeForm.department"
required type="text"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" required
/> class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
</div> />
<div> </div>
<label class="block text-sm font-medium text-gray-700">Кабинет</label> <div>
<input <label class="block text-sm font-medium text-gray-700">Кабинет</label>
v-model="employeeForm.office" <input
type="text" v-model="employeeForm.office"
required type="text"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" required
/> class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
</div> />
<div> </div>
<label class="block text-sm font-medium text-gray-700"> <div>
Пароль {{ isEditingEmployee ? '(оставьте пустым, чтобы не менять)' : '' }} <label class="block text-sm font-medium text-gray-700">
</label> Пароль {{ isEditingEmployee ? '(оставьте пустым, чтобы не менять)' : '' }}
<input </label>
v-model="employeeForm.password" <input
type="password" v-model="employeeForm.password"
:required="!isEditingEmployee" type="password"
class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-blue-500 focus:ring-blue-500" :required="!isEditingEmployee"
/> class="mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-gray-400 focus:ring-0"
</div> />
<div class="flex justify-end gap-3"> </div>
<button
type="button"
@click="showEmployeeModal = false"
class="px-4 py-2 border border-gray-300 rounded-md text-sm font-medium text-gray-700 hover:bg-gray-50"
>
Отмена
</button>
<button
type="submit"
class="px-4 py-2 bg-blue-600 text-white rounded-md text-sm font-medium hover:bg-blue-700"
>
{{ isEditingEmployee ? 'Сохранить' : 'Добавить' }}
</button>
</div> </div>
</form> </form>
<div class="flex justify-end gap-3 p-6 border-t bg-gray-50">
<button
type="button"
@click="showEmployeeModal = false"
class="px-4 py-2 text-sm font-medium text-gray-700 hover:text-gray-900"
>
Отмена
</button>
<button
type="submit"
class="px-4 py-2 text-sm font-medium text-blue-600 hover:text-blue-700"
>
{{ isEditingEmployee ? 'Сохранить' : 'Добавить' }}
</button>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -390,7 +321,6 @@ interface EmployeeForm {
} }
const router = useRouter() const router = useRouter()
const activeTab = ref('statistics')
const statistics = ref<Statistics>({ new: 0, inProgress: 0, resolved: 0 }) const statistics = ref<Statistics>({ new: 0, inProgress: 0, resolved: 0 })
const requests = ref<Request[]>([]) const requests = ref<Request[]>([])
const employees = ref<Employee[]>([]) const employees = ref<Employee[]>([])
@@ -505,7 +435,6 @@ const updateRequestStatus = async (request: Request | null) => {
const headers = { Authorization: `Bearer ${token}` } const headers = { Authorization: `Bearer ${token}` }
// Определяем следующий статус
let newStatus: Request['status'] = 'in_progress' let newStatus: Request['status'] = 'in_progress'
if (request.status === 'new') { if (request.status === 'new') {
newStatus = 'in_progress' newStatus = 'in_progress'
@@ -520,18 +449,17 @@ const updateRequestStatus = async (request: Request | null) => {
} }
} }
// Вспомогательные функции для стилей
const priorityClasses = { const priorityClasses = {
low: 'px-2 py-1 text-sm rounded-full bg-gray-100 text-gray-800', low: 'px-2 py-1 text-xs rounded-full bg-gray-100 text-gray-800',
medium: 'px-2 py-1 text-sm rounded-full bg-yellow-100 text-yellow-800', medium: 'px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800',
high: 'px-2 py-1 text-sm rounded-full bg-orange-100 text-orange-800', high: 'px-2 py-1 text-xs rounded-full bg-orange-100 text-orange-800',
critical: 'px-2 py-1 text-sm rounded-full bg-red-100 text-red-800' critical: 'px-2 py-1 text-xs rounded-full bg-red-100 text-red-800'
} as const } as const
const statusClasses = { const statusClasses = {
new: 'px-2 py-1 text-sm rounded-full bg-blue-100 text-blue-800', new: 'px-2 py-1 text-xs rounded-full bg-gray-100 text-gray-800',
in_progress: 'px-2 py-1 text-sm rounded-full bg-yellow-100 text-yellow-800', in_progress: 'px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800',
resolved: 'px-2 py-1 text-sm rounded-full bg-green-100 text-green-800' resolved: 'px-2 py-1 text-xs rounded-full bg-green-100 text-green-800'
} as const } as const
const getPriorityClass = (priority: Request['priority'] | undefined) => { const getPriorityClass = (priority: Request['priority'] | undefined) => {
@@ -543,6 +471,5 @@ const getStatusClass = (status: Request['status']) => {
return statusClasses[status] return statusClasses[status]
} }
// Загрузка данных при монтировании
onMounted(fetchData) onMounted(fetchData)
</script> </script>