<!-- Content Header (Page header) -->
<div class="content-header">
    <div class="container-fluid">
        <div class="row mb-2">
            <div class="col-sm-6">
                <h1><i class="fas fa-cogs mr-2"></i>Управление услугами</h1>
            </div>
            <div class="col-sm-6">
                <div class="float-sm-right">
                    <a href="/admin/services/add" class="btn btn-primary">
                        <i class="fas fa-plus mr-1"></i>
                        Добавить услугу
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Main content -->
<section class="content">
    <div class="container-fluid">
        <div class="row">
            <div class="col-12">
                <div class="card">
                    <div class="card-header">
                        <h3 class="card-title">Список услуг</h3>
                        <div class="card-tools">
                            <div class="input-group input-group-sm" style="width: 150px;">
                                <input type="text" name="table_search" class="form-control float-right" placeholder="Поиск">
                                <div class="input-group-append">
                                    <button type="submit" class="btn btn-default">
                                        <i class="fas fa-search"></i>
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="card-body table-responsive p-0">
                        <% if (services && services.length > 0) { %>
                            <table class="table table-hover text-nowrap">
                                <thead>
                                    <tr>
                                        <th>ID</th>
                                        <th>Название</th>
                                        <th>Категория</th>
                                        <th>Статус</th>
                                        <th>Цена от</th>
                                        <th>Время</th>
                                        <th>Рекомендуемая</th>
                                        <th>Создано</th>
                                        <th>Действия</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <% services.forEach(service => { %>
                                        <tr>
                                            <td>
                                                <small class="text-muted">#<%= service.id.slice(-8) %></small>
                                            </td>
                                            <td>
                                                <div class="d-flex align-items-center">
                                                    <i class="<%= service.icon || 'fas fa-cog' %> mr-2 text-primary"></i>
                                                    <strong><%= service.name %></strong>
                                                </div>
                                                <% if (service.shortDescription) { %>
                                                    <small class="text-muted d-block">
                                                        <%= service.shortDescription.substring(0, 80) %><%= service.shortDescription.length > 80 ? '...' : '' %>
                                                    </small>
                                                <% } %>
                                            </td>
                                            <td>
                                                <span class="badge badge-info"><%= service.category %></span>
                                            </td>
                                            <td>
                                                <% if (service.isActive) { %>
                                                    <span class="badge badge-success">Активна</span>
                                                <% } else { %>
                                                    <span class="badge badge-secondary">Неактивна</span>
                                                <% } %>
                                            </td>
                                            <td>
                                                <% if (service.pricing && service.pricing.basePrice) { %>
                                                    <span class="text-success font-weight-bold">$<%= service.pricing.basePrice %></span>
                                                <% } else { %>
                                                    <span class="text-muted">Не указана</span>
                                                <% } %>
                                            </td>
                                            <td>
                                                <% if (service.estimatedTime) { %>
                                                    <i class="fas fa-clock mr-1 text-info"></i>
                                                    <%= service.estimatedTime %>
                                                <% } else { %>
                                                    <span class="text-muted">-</span>
                                                <% } %>
                                            </td>
                                            <td>
                                                <% if (service.featured) { %>
                                                    <i class="fas fa-star text-warning" title="Рекомендуемая услуга"></i>
                                                <% } else { %>
                                                    <i class="far fa-star text-muted"></i>
                                                <% } %>
                                            </td>
                                            <td>
                                                <small class="text-muted">
                                                    <%= new Date(service.createdAt).toLocaleDateString('ru-RU') %>
                                                </small>
                                            </td>
                                            <td>
                                                <div class="btn-group btn-group-sm">
                                                    <a href="/services#<%= service.id %>" target="_blank" class="btn btn-info btn-sm" title="Посмотреть на сайте">
                                                        <i class="fas fa-eye"></i>
                                                    </a>
                                                    <a href="/admin/services/edit/<%= service.id %>" class="btn btn-warning btn-sm" title="Редактировать">
                                                        <i class="fas fa-edit"></i>
                                                    </a>
                                                    <button onclick="deleteService('<%= service.id %>')" class="btn btn-danger btn-sm" title="Удалить">
                                                        <i class="fas fa-trash"></i>
                                                    </button>
                                                </div>
                                            </td>
                                        </tr>
                                    <% }) %>
                                </tbody>
                            </table>
                        <% } else { %>
                            <div class="p-4 text-center">
                                <i class="fas fa-cogs text-muted" style="font-size: 4rem;"></i>
                                <h4 class="mt-3 text-muted">Услуги не найдены</h4>
                                <p class="text-muted">Добавьте первую услугу для начала работы</p>
                                <a href="/admin/services/add" class="btn btn-primary">
                                    <i class="fas fa-plus mr-1"></i>
                                    Добавить услугу
                                </a>
                            </div>
                        <% } %>
                    </div>
                    
                    <!-- Pagination -->
                    <% if (pagination && pagination.total > 1) { %>
                        <div class="card-footer clearfix">
                            <ul class="pagination pagination-sm m-0 float-right">
                                <% if (pagination.hasPrev) { %>
                                    <li class="page-item">
                                        <a class="page-link" href="?page=<%= pagination.current - 1 %>">&laquo;</a>
                                    </li>
                                <% } %>
                                
                                <% for (let i = 1; i <= pagination.total; i++) { %>
                                    <li class="page-item <%= i === pagination.current ? 'active' : '' %>">
                                        <a class="page-link" href="?page=<%= i %>"><%= i %></a>
                                    </li>
                                <% } %>
                                
                                <% if (pagination.hasNext) { %>
                                    <li class="page-item">
                                        <a class="page-link" href="?page=<%= pagination.current + 1 %>">&raquo;</a>
                                    </li>
                                <% } %>
                            </ul>
                        </div>
                    <% } %>
                </div>
            </div>
        </div>
    </div>
</section>

<script>
function deleteService(id) {
    Swal.fire({
        title: 'Удалить услугу?',
        text: 'Это действие невозможно отменить!',
        icon: 'warning',
        showCancelButton: true,
        confirmButtonColor: '#d33',
        cancelButtonColor: '#3085d6',
        confirmButtonText: 'Да, удалить!',
        cancelButtonText: 'Отмена'
    }).then((result) => {
        if (result.isConfirmed) {
            fetch(`/api/admin/services/${id}`, {
                method: 'DELETE',
                headers: {
                    'Content-Type': 'application/json',
                }
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    Swal.fire('Удалено!', 'Услуга была удалена.', 'success').then(() => {
                        location.reload();
                    });
                } else {
                    Swal.fire('Ошибка!', data.message || 'Ошибка при удалении услуги', 'error');
                }
            })
            .catch(error => {
                console.error('Error:', error);
                Swal.fire('Ошибка!', 'Произошла ошибка при удалении услуги', 'error');
            });
        }
    });
}
</script>