diff --git a/api-client.js b/api-client.js
new file mode 100644
index 0000000..09dea02
--- /dev/null
+++ b/api-client.js
@@ -0,0 +1,690 @@
+// api-client.js - API для внешнего клиента управления задачами
+const express = require('express');
+const router = express.Router();
+const path = require('path');
+const fs = require('fs');
+const axios = require('axios');
+
+module.exports = function(app, db, upload) {
+    
+    // Middleware для проверки аутентификации
+    const requireAuth = (req, res, next) => {
+        if (!req.session || !req.session.user) {
+            return res.status(401).json({ error: 'Требуется аутентификация' });
+        }
+        next();
+    };
+
+    // Middleware для проверки прав администратора
+    const requireAdmin = (req, res, next) => {
+        if (!req.session || !req.session.user || req.session.user.role !== 'admin') {
+            return res.status(403).json({ error: 'Недостаточно прав' });
+        }
+        next();
+    };
+
+    // ==================== СТРАНИЦА КЛИЕНТА ====================
+    
+    // GET /client - Страница клиента для работы с API
+    app.get('/client', requireAuth, (req, res) => {
+        res.sendFile(path.join(__dirname, 'public', 'client.html'));
+    });
+
+    // ==================== API ДЛЯ РАБОТЫ С ВНЕШНИМИ СЕРВИСАМИ ====================
+
+    /**
+     * POST /api/client/connect - Проверка подключения к внешнему сервису
+     * Тело запроса:
+     * {
+     *   "api_url": "https://example.com",
+     *   "api_key": "ваш_ключ"
+     * }
+     */
+    router.post('/api/client/connect', requireAuth, async (req, res) => {
+        const { api_url, api_key } = req.body;
+        const userId = req.session.user.id;
+
+        if (!api_url || !api_key) {
+            return res.status(400).json({ 
+                error: 'Не указан URL сервиса или API ключ' 
+            });
+        }
+
+        try {
+            // Нормализуем URL (убираем слеш в конце если есть)
+            const baseUrl = api_url.replace(/\/$/, '');
+            
+            // Пробуем подключиться к сервису
+            const response = await axios.get(`${baseUrl}/api/external/tasks`, {
+                headers: {
+                    'X-API-Key': api_key
+                },
+                params: {
+                    limit: 1 // Запрашиваем только одну задачу для проверки
+                },
+                timeout: 10000 // 10 секунд таймаут
+            });
+
+            if (response.data && response.data.success) {
+                // Сохраняем подключение в сессии
+                if (!req.session.clientConnections) {
+                    req.session.clientConnections = {};
+                }
+                
+                const connectionId = Date.now().toString();
+                req.session.clientConnections[connectionId] = {
+                    id: connectionId,
+                    name: `Подключение ${new Date().toLocaleString()}`,
+                    url: baseUrl,
+                    api_key: api_key,
+                    created_at: new Date().toISOString(),
+                    last_used: new Date().toISOString()
+                };
+
+                // Логируем действие
+                const { logActivity } = require('./database');
+                if (logActivity) {
+                    logActivity(0, userId, 'API_CLIENT_CONNECT', 
+                        `Подключение к ${baseUrl} (ID: ${connectionId})`);
+                }
+
+                res.json({
+                    success: true,
+                    message: 'Подключение успешно установлено',
+                    connection: req.session.clientConnections[connectionId],
+                    server_info: {
+                        tasks_count: response.data.meta?.total || 0,
+                        user: response.data.meta?.user || 'Unknown'
+                    }
+                });
+            } else {
+                res.status(400).json({ 
+                    error: 'Неверный ответ от сервера',
+                    details: response.data 
+                });
+            }
+        } catch (error) {
+            console.error('❌ Ошибка подключения к внешнему сервису:', error.message);
+            
+            let errorMessage = 'Ошибка подключения к серверу';
+            let statusCode = 500;
+            
+            if (error.code === 'ECONNREFUSED') {
+                errorMessage = 'Сервер недоступен (отказ в соединении)';
+                statusCode = 503;
+            } else if (error.code === 'ETIMEDOUT') {
+                errorMessage = 'Превышено время ожидания ответа от сервера';
+                statusCode = 504;
+            } else if (error.response) {
+                if (error.response.status === 401) {
+                    errorMessage = 'Неверный API ключ';
+                    statusCode = 401;
+                } else {
+                    errorMessage = `Ошибка сервера: ${error.response.status}`;
+                    statusCode = error.response.status;
+                }
+            }
+
+            res.status(statusCode).json({ 
+                error: errorMessage,
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * GET /api/client/connections - Получить список сохраненных подключений
+     */
+    router.get('/api/client/connections', requireAuth, (req, res) => {
+        const connections = req.session.clientConnections || {};
+        
+        // Маскируем API ключи
+        const maskedConnections = Object.values(connections).map(conn => ({
+            ...conn,
+            api_key: conn.api_key ? 
+                conn.api_key.substring(0, 8) + '...' + conn.api_key.substring(conn.api_key.length - 8) : 
+                null
+        }));
+
+        res.json({
+            success: true,
+            connections: maskedConnections
+        });
+    });
+
+    /**
+     * DELETE /api/client/connections/:id - Удалить сохраненное подключение
+     */
+    router.delete('/api/client/connections/:id', requireAuth, (req, res) => {
+        const { id } = req.params;
+        
+        if (req.session.clientConnections && req.session.clientConnections[id]) {
+            delete req.session.clientConnections[id];
+            
+            const { logActivity } = require('./database');
+            if (logActivity) {
+                logActivity(0, req.session.user.id, 'API_CLIENT_DISCONNECT', 
+                    `Удалено подключение ${id}`);
+            }
+            
+            res.json({ 
+                success: true, 
+                message: 'Подключение удалено' 
+            });
+        } else {
+            res.status(404).json({ 
+                error: 'Подключение не найдено' 
+            });
+        }
+    });
+
+    /**
+     * GET /api/client/tasks - Получить список задач из внешнего сервиса
+     * Параметры запроса:
+     * - connection_id: ID сохраненного подключения (из сессии)
+     * - api_url: URL сервиса (если нет connection_id)
+     * - api_key: API ключ (если нет connection_id)
+     * - status: фильтр по статусу (опционально)
+     * - search: поиск по тексту (опционально)
+     */
+    router.get('/api/client/tasks', requireAuth, async (req, res) => {
+        const { connection_id, api_url, api_key, status, search, limit = 50, offset = 0 } = req.query;
+        const userId = req.session.user.id;
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        // Если указан connection_id, берем данные из сессии
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+            
+            // Обновляем время последнего использования
+            connection.last_used = new Date().toISOString();
+        }
+
+        if (!targetUrl || !targetKey) {
+            return res.status(400).json({ 
+                error: 'Не указан URL сервиса или API ключ' 
+            });
+        }
+
+        try {
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            // Формируем параметры запроса
+            const params = { limit, offset };
+            if (status) params.status = status;
+            
+            // Получаем список задач
+            const response = await axios.get(`${baseUrl}/api/external/tasks`, {
+                headers: {
+                    'X-API-Key': targetKey
+                },
+                params: params,
+                timeout: 15000
+            });
+
+            if (response.data && response.data.success) {
+                let tasks = response.data.tasks || [];
+                
+                // Дополнительная фильтрация по поиску на стороне клиента
+                if (search && tasks.length > 0) {
+                    const searchLower = search.toLowerCase();
+                    tasks = tasks.filter(task => 
+                        task.title.toLowerCase().includes(searchLower) ||
+                        (task.description && task.description.toLowerCase().includes(searchLower))
+                    );
+                }
+
+                // Логируем действие
+                const { logActivity } = require('./database');
+                if (logActivity) {
+                    logActivity(0, userId, 'API_CLIENT_GET_TASKS', 
+                        `Получено ${tasks.length} задач из ${baseUrl}`);
+                }
+
+                res.json({
+                    success: true,
+                    tasks: tasks,
+                    meta: {
+                        total: tasks.length,
+                        limit,
+                        offset,
+                        source: connection_id ? 'saved_connection' : 'direct',
+                        server_info: response.data.meta
+                    }
+                });
+            } else {
+                res.status(400).json({ 
+                    error: 'Неверный ответ от сервера' 
+                });
+            }
+        } catch (error) {
+            console.error('❌ Ошибка получения задач:', error.message);
+            
+            let errorMessage = 'Ошибка получения задач';
+            let statusCode = 500;
+            
+            if (error.code === 'ECONNREFUSED') {
+                errorMessage = 'Сервер недоступен';
+                statusCode = 503;
+            } else if (error.code === 'ETIMEDOUT') {
+                errorMessage = 'Превышено время ожидания';
+                statusCode = 504;
+            } else if (error.response) {
+                if (error.response.status === 401) {
+                    errorMessage = 'Неверный API ключ';
+                    statusCode = 401;
+                } else {
+                    errorMessage = `Ошибка сервера: ${error.response.status}`;
+                    statusCode = error.response.status;
+                }
+            }
+
+            res.status(statusCode).json({ 
+                error: errorMessage,
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * GET /api/client/tasks/:taskId - Получить детальную информацию о задаче
+     */
+    router.get('/api/client/tasks/:taskId', requireAuth, async (req, res) => {
+        const { taskId } = req.params;
+        const { connection_id, api_url, api_key } = req.query;
+        const userId = req.session.user.id;
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+        }
+
+        if (!targetUrl || !targetKey) {
+            return res.status(400).json({ error: 'Не указан URL сервиса или API ключ' });
+        }
+
+        try {
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            const response = await axios.get(`${baseUrl}/api/external/tasks/${taskId}`, {
+                headers: {
+                    'X-API-Key': targetKey
+                },
+                timeout: 10000
+            });
+
+            if (response.data && response.data.success) {
+                res.json({
+                    success: true,
+                    task: response.data.task
+                });
+            } else {
+                res.status(404).json({ error: 'Задача не найдена' });
+            }
+        } catch (error) {
+            console.error('❌ Ошибка получения задачи:', error.message);
+            
+            let errorMessage = 'Ошибка получения задачи';
+            let statusCode = 500;
+            
+            if (error.response) {
+                if (error.response.status === 404) {
+                    errorMessage = 'Задача не найдена';
+                    statusCode = 404;
+                } else if (error.response.status === 401) {
+                    errorMessage = 'Неверный API ключ';
+                    statusCode = 401;
+                } else {
+                    errorMessage = `Ошибка сервера: ${error.response.status}`;
+                    statusCode = error.response.status;
+                }
+            }
+
+            res.status(statusCode).json({ 
+                error: errorMessage,
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * PUT /api/client/tasks/:taskId/status - Изменить статус задачи
+     * Тело запроса:
+     * {
+     *   "status": "in_progress" | "completed",
+     *   "comment": "Комментарий к изменению статуса" (опционально)
+     * }
+     */
+    router.put('/api/client/tasks/:taskId/status', requireAuth, async (req, res) => {
+        const { taskId } = req.params;
+        const { connection_id, api_url, api_key } = req.query;
+        const { status, comment } = req.body;
+        const userId = req.session.user.id;
+
+        if (!status || !['in_progress', 'completed'].includes(status)) {
+            return res.status(400).json({ 
+                error: 'Статус должен быть "in_progress" или "completed"' 
+            });
+        }
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+        }
+
+        if (!targetUrl || !targetKey) {
+            return res.status(400).json({ error: 'Не указан URL сервиса или API ключ' });
+        }
+
+        try {
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            const response = await axios.put(
+                `${baseUrl}/api/external/tasks/${taskId}/status`,
+                { status, comment },
+                {
+                    headers: {
+                        'X-API-Key': targetKey,
+                        'Content-Type': 'application/json'
+                    },
+                    timeout: 10000
+                }
+            );
+
+            if (response.data && response.data.success) {
+                // Логируем действие
+                const { logActivity } = require('./database');
+                if (logActivity) {
+                    logActivity(0, userId, 'API_CLIENT_UPDATE_STATUS', 
+                        `Статус задачи ${taskId} изменен на ${status} в ${baseUrl}`);
+                }
+
+                res.json({
+                    success: true,
+                    message: `Статус задачи ${taskId} изменен на "${status}"`,
+                    data: response.data
+                });
+            } else {
+                res.status(400).json({ error: 'Не удалось изменить статус' });
+            }
+        } catch (error) {
+            console.error('❌ Ошибка изменения статуса:', error.message);
+            
+            let errorMessage = 'Ошибка изменения статуса';
+            let statusCode = 500;
+            
+            if (error.response) {
+                if (error.response.status === 401) {
+                    errorMessage = 'Неверный API ключ';
+                    statusCode = 401;
+                } else if (error.response.status === 403) {
+                    errorMessage = 'Нет прав для изменения статуса';
+                    statusCode = 403;
+                } else if (error.response.status === 404) {
+                    errorMessage = 'Задача не найдена';
+                    statusCode = 404;
+                } else {
+                    errorMessage = error.response.data?.error || `Ошибка сервера: ${error.response.status}`;
+                    statusCode = error.response.status;
+                }
+            }
+
+            res.status(statusCode).json({ 
+                error: errorMessage,
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * POST /api/client/tasks/:taskId/files - Загрузить файлы в задачу
+     */
+    router.post('/api/client/tasks/:taskId/files', requireAuth, upload.array('files', 15), async (req, res) => {
+        const { taskId } = req.params;
+        const { connection_id, api_url, api_key } = req.query;
+        const userId = req.session.user.id;
+
+        if (!req.files || req.files.length === 0) {
+            return res.status(400).json({ error: 'Нет файлов для загрузки' });
+        }
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+        }
+
+        if (!targetUrl || !targetKey) {
+            // Очищаем временные файлы
+            req.files.forEach(file => {
+                if (file.path && fs.existsSync(file.path)) {
+                    fs.unlinkSync(file.path);
+                }
+            });
+            return res.status(400).json({ error: 'Не указан URL сервиса или API ключ' });
+        }
+
+        try {
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            // Создаем FormData для отправки файлов
+            const FormData = require('form-data');
+            const formData = new FormData();
+            
+            req.files.forEach(file => {
+                formData.append('files', fs.createReadStream(file.path), {
+                    filename: file.originalname,
+                    contentType: file.mimetype
+                });
+            });
+
+            // Отправляем файлы на внешний сервис
+            const response = await axios.post(
+                `${baseUrl}/api/external/tasks/${taskId}/files`,
+                formData,
+                {
+                    headers: {
+                        ...formData.getHeaders(),
+                        'X-API-Key': targetKey
+                    },
+                    timeout: 60000, // 60 секунд для загрузки файлов
+                    maxContentLength: Infinity,
+                    maxBodyLength: Infinity
+                }
+            );
+
+            // Удаляем временные файлы
+            req.files.forEach(file => {
+                if (file.path && fs.existsSync(file.path)) {
+                    fs.unlinkSync(file.path);
+                }
+            });
+
+            if (response.data && response.data.success) {
+                // Логируем действие
+                const { logActivity } = require('./database');
+                if (logActivity) {
+                    logActivity(0, userId, 'API_CLIENT_UPLOAD_FILES', 
+                        `Загружено ${req.files.length} файлов в задачу ${taskId} в ${baseUrl}`);
+                }
+
+                res.json({
+                    success: true,
+                    message: `Успешно загружено ${req.files.length} файлов`,
+                    data: response.data
+                });
+            } else {
+                res.status(400).json({ error: 'Не удалось загрузить файлы' });
+            }
+        } catch (error) {
+            // Удаляем временные файлы в случае ошибки
+            req.files.forEach(file => {
+                if (file.path && fs.existsSync(file.path)) {
+                    fs.unlinkSync(file.path);
+                }
+            });
+
+            console.error('❌ Ошибка загрузки файлов:', error.message);
+            
+            let errorMessage = 'Ошибка загрузки файлов';
+            let statusCode = 500;
+            
+            if (error.response) {
+                if (error.response.status === 401) {
+                    errorMessage = 'Неверный API ключ';
+                    statusCode = 401;
+                } else if (error.response.status === 403) {
+                    errorMessage = 'Нет прав для загрузки файлов';
+                    statusCode = 403;
+                } else if (error.response.status === 404) {
+                    errorMessage = 'Задача не найдена';
+                    statusCode = 404;
+                } else if (error.response.status === 413) {
+                    errorMessage = 'Файлы слишком большие';
+                    statusCode = 413;
+                } else {
+                    errorMessage = error.response.data?.error || `Ошибка сервера: ${error.response.status}`;
+                    statusCode = error.response.status;
+                }
+            } else if (error.code === 'ECONNREFUSED') {
+                errorMessage = 'Сервер недоступен';
+                statusCode = 503;
+            } else if (error.code === 'ETIMEDOUT') {
+                errorMessage = 'Превышено время ожидания при загрузке';
+                statusCode = 504;
+            }
+
+            res.status(statusCode).json({ 
+                error: errorMessage,
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * GET /api/client/tasks/:taskId/files - Получить список файлов задачи
+     */
+    router.get('/api/client/tasks/:taskId/files', requireAuth, async (req, res) => {
+        const { taskId } = req.params;
+        const { connection_id, api_url, api_key } = req.query;
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+        }
+
+        if (!targetUrl || !targetKey) {
+            return res.status(400).json({ error: 'Не указан URL сервиса или API ключ' });
+        }
+
+        try {
+            // Сначала получаем детали задачи, чтобы увидеть файлы
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            const response = await axios.get(`${baseUrl}/api/external/tasks/${taskId}`, {
+                headers: {
+                    'X-API-Key': targetKey
+                },
+                timeout: 10000
+            });
+
+            if (response.data && response.data.success) {
+                res.json({
+                    success: true,
+                    files: response.data.task.files || []
+                });
+            } else {
+                res.status(404).json({ error: 'Задача не найдена' });
+            }
+        } catch (error) {
+            console.error('❌ Ошибка получения файлов:', error.message);
+            res.status(500).json({ 
+                error: 'Ошибка получения файлов',
+                details: error.message 
+            });
+        }
+    });
+
+    /**
+     * GET /api/client/tasks/:taskId/files/:fileId/download - Скачать файл (через редирект)
+     */
+    router.get('/api/client/tasks/:taskId/files/:fileId/download', requireAuth, async (req, res) => {
+        const { taskId, fileId } = req.params;
+        const { connection_id, api_url, api_key } = req.query;
+
+        let targetUrl = api_url;
+        let targetKey = api_key;
+
+        if (connection_id && req.session.clientConnections && req.session.clientConnections[connection_id]) {
+            const connection = req.session.clientConnections[connection_id];
+            targetUrl = connection.url;
+            targetKey = connection.api_key;
+        }
+
+        if (!targetUrl || !targetKey) {
+            return res.status(400).json({ error: 'Не указан URL сервиса или API ключ' });
+        }
+
+        try {
+            const baseUrl = targetUrl.replace(/\/$/, '');
+            
+            // Делаем запрос на скачивание файла
+            const response = await axios({
+                method: 'GET',
+                url: `${baseUrl}/api/external/tasks/${taskId}/files/${fileId}/download`,
+                headers: {
+                    'X-API-Key': targetKey
+                },
+                responseType: 'stream',
+                timeout: 30000
+            });
+
+            // Проксируем ответ клиенту
+            const contentType = response.headers['content-type'] || 'application/octet-stream';
+            const contentDisposition = response.headers['content-disposition'] || 'attachment';
+            
+            res.setHeader('Content-Type', contentType);
+            res.setHeader('Content-Disposition', contentDisposition);
+            
+            response.data.pipe(res);
+        } catch (error) {
+            console.error('❌ Ошибка скачивания файла:', error.message);
+            
+            if (error.response) {
+                res.status(error.response.status).json({ 
+                    error: 'Ошибка при скачивании файла',
+                    details: error.response.statusText
+                });
+            } else {
+                res.status(500).json({ 
+                    error: 'Ошибка при скачивании файла',
+                    details: error.message
+                });
+            }
+        }
+    });
+
+    // Подключаем роутер
+    app.use(router);
+    
+    console.log('✅ API клиент для внешних сервисов подключен');
+};
\ No newline at end of file
diff --git a/package.json b/package.json
index e3e8002..e430874 100644
--- a/package.json
+++ b/package.json
@@ -14,7 +14,7 @@
     "dotenv": "~16.3.1",
     "express": "^4.21.2",
     "express-session": "^1.18.2",
-    "form-data": "^4.0.0",
+    "form-data": "^4.0.5",
     "mime-types": "^3.0.2",
     "multer": "^2.0.2",
     "node-fetch": "~2.6.7",
diff --git a/public/client.html b/public/client.html
new file mode 100644
index 0000000..62ab776
--- /dev/null
+++ b/public/client.html
@@ -0,0 +1,1467 @@
+<!DOCTYPE html>
+<html lang="ru">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Клиент внешнего API - Управление задачами</title>
+    <style>
+        * {
+            margin: 0;
+            padding: 0;
+            box-sizing: border-box;
+        }
+
+        body {
+            font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
+            background: #f5f7fa;
+            color: #2c3e50;
+            line-height: 1.6;
+            padding: 20px;
+        }
+
+        .container {
+            max-width: 1400px;
+            margin: 0 auto;
+        }
+
+        .header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 30px;
+            background: white;
+            padding: 20px;
+            border-radius: 10px;
+            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+        }
+
+        .header h1 {
+            font-size: 24px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+
+        .header h1 i {
+            color: #3498db;
+        }
+
+        .user-info {
+            display: flex;
+            align-items: center;
+            gap: 15px;
+        }
+
+        .user-info span {
+            font-weight: 500;
+            color: #7f8c8d;
+        }
+
+        .logout-btn {
+            background: #e74c3c;
+            color: white;
+            border: none;
+            padding: 8px 16px;
+            border-radius: 5px;
+            cursor: pointer;
+            font-size: 14px;
+            transition: background 0.3s;
+        }
+
+        .logout-btn:hover {
+            background: #c0392b;
+        }
+
+        .connection-panel {
+            background: white;
+            border-radius: 10px;
+            padding: 20px;
+            margin-bottom: 30px;
+            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+        }
+
+        .panel-title {
+            font-size: 18px;
+            font-weight: 600;
+            margin-bottom: 20px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+
+        .panel-title i {
+            color: #3498db;
+        }
+
+        .connection-form {
+            display: grid;
+            grid-template-columns: 1fr 1fr auto;
+            gap: 15px;
+            align-items: end;
+        }
+
+        .form-group {
+            display: flex;
+            flex-direction: column;
+            gap: 5px;
+        }
+
+        .form-group label {
+            font-size: 14px;
+            font-weight: 500;
+            color: #7f8c8d;
+        }
+
+        .form-group input, .form-group select {
+            padding: 10px 12px;
+            border: 1px solid #dce4ec;
+            border-radius: 5px;
+            font-size: 14px;
+            transition: border-color 0.3s;
+        }
+
+        .form-group input:focus, .form-group select:focus {
+            outline: none;
+            border-color: #3498db;
+        }
+
+        .form-group input.error {
+            border-color: #e74c3c;
+        }
+
+        .btn {
+            padding: 10px 20px;
+            border: none;
+            border-radius: 5px;
+            font-size: 14px;
+            font-weight: 500;
+            cursor: pointer;
+            transition: all 0.3s;
+        }
+
+        .btn-primary {
+            background: #3498db;
+            color: white;
+        }
+
+        .btn-primary:hover {
+            background: #2980b9;
+        }
+
+        .btn-secondary {
+            background: #95a5a6;
+            color: white;
+        }
+
+        .btn-secondary:hover {
+            background: #7f8c8d;
+        }
+
+        .btn-success {
+            background: #27ae60;
+            color: white;
+        }
+
+        .btn-success:hover {
+            background: #229954;
+        }
+
+        .btn-danger {
+            background: #e74c3c;
+            color: white;
+        }
+
+        .btn-danger:hover {
+            background: #c0392b;
+        }
+
+        .btn-warning {
+            background: #f39c12;
+            color: white;
+        }
+
+        .btn-warning:hover {
+            background: #e67e22;
+        }
+
+        .btn:disabled {
+            opacity: 0.5;
+            cursor: not-allowed;
+        }
+
+        .saved-connections {
+            margin-top: 20px;
+            border-top: 1px solid #ecf0f1;
+            padding-top: 20px;
+        }
+
+        .connections-list {
+            display: flex;
+            flex-wrap: wrap;
+            gap: 10px;
+            margin-top: 10px;
+        }
+
+        .connection-item {
+            background: #ecf0f1;
+            padding: 10px 15px;
+            border-radius: 5px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+            cursor: pointer;
+            transition: background 0.3s;
+        }
+
+        .connection-item:hover {
+            background: #d5dbdb;
+        }
+
+        .connection-item.active {
+            background: #3498db;
+            color: white;
+        }
+
+        .connection-item .remove-conn {
+            color: #e74c3c;
+            cursor: pointer;
+            font-size: 18px;
+            padding: 0 5px;
+        }
+
+        .connection-item .remove-conn:hover {
+            color: #c0392b;
+        }
+
+        .filter-panel {
+            background: white;
+            border-radius: 10px;
+            padding: 20px;
+            margin-bottom: 30px;
+            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+            display: grid;
+            grid-template-columns: 1fr 1fr 1fr auto;
+            gap: 15px;
+            align-items: end;
+        }
+
+        .tasks-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 20px;
+        }
+
+        .tasks-header h2 {
+            font-size: 20px;
+            display: flex;
+            align-items: center;
+            gap: 10px;
+        }
+
+        .tasks-header h2 i {
+            color: #3498db;
+        }
+
+        .tasks-count {
+            background: #3498db;
+            color: white;
+            padding: 5px 10px;
+            border-radius: 20px;
+            font-size: 14px;
+        }
+
+        .tasks-grid {
+            display: grid;
+            grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+            gap: 20px;
+            margin-bottom: 30px;
+        }
+
+        .task-card {
+            background: white;
+            border-radius: 10px;
+            padding: 20px;
+            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
+            transition: transform 0.3s, box-shadow 0.3s;
+            display: flex;
+            flex-direction: column;
+        }
+
+        .task-card:hover {
+            transform: translateY(-5px);
+            box-shadow: 0 5px 20px rgba(0,0,0,0.15);
+        }
+
+        .task-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: start;
+            margin-bottom: 15px;
+        }
+
+        .task-title {
+            font-size: 18px;
+            font-weight: 600;
+            color: #2c3e50;
+            flex: 1;
+            word-break: break-word;
+        }
+
+        .task-status {
+            padding: 4px 8px;
+            border-radius: 4px;
+            font-size: 12px;
+            font-weight: 600;
+            text-transform: uppercase;
+        }
+
+        .status-assigned { background: #3498db; color: white; }
+        .status-in_progress { background: #f39c12; color: white; }
+        .status-completed { background: #27ae60; color: white; }
+        .status-overdue { background: #e74c3c; color: white; }
+        .status-rework { background: #9b59b6; color: white; }
+        .status-default { background: #95a5a6; color: white; }
+
+        .task-description {
+            color: #7f8c8d;
+            font-size: 14px;
+            margin-bottom: 15px;
+            max-height: 100px;
+            overflow-y: auto;
+            word-break: break-word;
+        }
+
+        .task-meta {
+            display: flex;
+            flex-wrap: wrap;
+            gap: 10px;
+            margin-bottom: 15px;
+            font-size: 12px;
+            color: #95a5a6;
+        }
+
+        .task-meta-item {
+            display: flex;
+            align-items: center;
+            gap: 5px;
+        }
+
+        .task-files {
+            margin-bottom: 15px;
+        }
+
+        .files-title {
+            font-size: 14px;
+            font-weight: 600;
+            margin-bottom: 8px;
+            display: flex;
+            align-items: center;
+            gap: 5px;
+        }
+
+        .files-list {
+            list-style: none;
+            max-height: 150px;
+            overflow-y: auto;
+            border: 1px solid #ecf0f1;
+            border-radius: 5px;
+            padding: 5px;
+        }
+
+        .file-item {
+            display: flex;
+            align-items: center;
+            gap: 8px;
+            padding: 5px;
+            border-bottom: 1px solid #ecf0f1;
+            font-size: 12px;
+        }
+
+        .file-item:last-child {
+            border-bottom: none;
+        }
+
+        .file-icon {
+            color: #3498db;
+        }
+
+        .file-name {
+            flex: 1;
+            word-break: break-word;
+        }
+
+        .file-size {
+            color: #95a5a6;
+            font-size: 10px;
+        }
+
+        .file-download {
+            color: #27ae60;
+            cursor: pointer;
+            text-decoration: none;
+            font-size: 14px;
+        }
+
+        .file-download:hover {
+            color: #229954;
+        }
+
+        .task-actions {
+            display: flex;
+            gap: 10px;
+            margin-top: auto;
+            flex-wrap: wrap;
+        }
+
+        .task-action-btn {
+            flex: 1;
+            padding: 8px;
+            border: none;
+            border-radius: 5px;
+            font-size: 12px;
+            font-weight: 500;
+            cursor: pointer;
+            transition: background 0.3s;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            gap: 5px;
+        }
+
+        .action-progress {
+            background: #f39c12;
+            color: white;
+        }
+
+        .action-progress:hover {
+            background: #e67e22;
+        }
+
+        .action-complete {
+            background: #27ae60;
+            color: white;
+        }
+
+        .action-complete:hover {
+            background: #229954;
+        }
+
+        .action-upload {
+            background: #3498db;
+            color: white;
+        }
+
+        .action-upload:hover {
+            background: #2980b9;
+        }
+
+        .pagination {
+            display: flex;
+            justify-content: center;
+            gap: 10px;
+            margin-top: 30px;
+        }
+
+        .pagination-btn {
+            padding: 8px 12px;
+            border: 1px solid #dce4ec;
+            background: white;
+            border-radius: 5px;
+            cursor: pointer;
+            transition: all 0.3s;
+        }
+
+        .pagination-btn:hover:not(:disabled) {
+            background: #3498db;
+            color: white;
+            border-color: #3498db;
+        }
+
+        .pagination-btn:disabled {
+            opacity: 0.5;
+            cursor: not-allowed;
+        }
+
+        .pagination-info {
+            padding: 8px 12px;
+            background: #ecf0f1;
+            border-radius: 5px;
+        }
+
+        .loading {
+            text-align: center;
+            padding: 50px;
+            color: #7f8c8d;
+        }
+
+        .loading i {
+            animation: spin 1s linear infinite;
+            font-size: 30px;
+            color: #3498db;
+        }
+
+        @keyframes spin {
+            0% { transform: rotate(0deg); }
+            100% { transform: rotate(360deg); }
+        }
+
+        .no-tasks {
+            text-align: center;
+            padding: 50px;
+            color: #7f8c8d;
+            grid-column: 1 / -1;
+        }
+
+        .modal {
+            display: none;
+            position: fixed;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            background: rgba(0,0,0,0.5);
+            z-index: 1000;
+            justify-content: center;
+            align-items: center;
+        }
+
+        .modal.active {
+            display: flex;
+        }
+
+        .modal-content {
+            background: white;
+            border-radius: 10px;
+            padding: 30px;
+            max-width: 500px;
+            width: 90%;
+            max-height: 80vh;
+            overflow-y: auto;
+        }
+
+        .modal-header {
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            margin-bottom: 20px;
+        }
+
+        .modal-header h3 {
+            font-size: 20px;
+        }
+
+        .modal-close {
+            font-size: 24px;
+            cursor: pointer;
+            color: #7f8c8d;
+        }
+
+        .modal-close:hover {
+            color: #2c3e50;
+        }
+
+        .upload-area {
+            border: 2px dashed #dce4ec;
+            border-radius: 5px;
+            padding: 30px;
+            text-align: center;
+            cursor: pointer;
+            transition: border-color 0.3s;
+            margin-bottom: 20px;
+        }
+
+        .upload-area:hover {
+            border-color: #3498db;
+        }
+
+        .upload-area i {
+            font-size: 40px;
+            color: #3498db;
+            margin-bottom: 10px;
+        }
+
+        .upload-area p {
+            color: #7f8c8d;
+        }
+
+        .file-input {
+            display: none;
+        }
+
+        .selected-files {
+            margin-bottom: 20px;
+        }
+
+        .selected-file {
+            display: flex;
+            align-items: center;
+            gap: 10px;
+            padding: 8px;
+            background: #ecf0f1;
+            border-radius: 5px;
+            margin-bottom: 5px;
+        }
+
+        .selected-file .file-name {
+            flex: 1;
+            font-size: 13px;
+        }
+
+        .selected-file .file-size {
+            color: #7f8c8d;
+            font-size: 12px;
+        }
+
+        .selected-file .remove-file {
+            color: #e74c3c;
+            cursor: pointer;
+        }
+
+        .upload-progress {
+            margin-top: 15px;
+            padding: 10px;
+            background: #ecf0f1;
+            border-radius: 5px;
+        }
+
+        .progress-bar {
+            height: 10px;
+            background: #dce4ec;
+            border-radius: 5px;
+            overflow: hidden;
+        }
+
+        .progress-fill {
+            height: 100%;
+            background: #27ae60;
+            width: 0%;
+            transition: width 0.3s;
+        }
+
+        .alert {
+            padding: 15px;
+            border-radius: 5px;
+            margin-bottom: 20px;
+            display: none;
+        }
+
+        .alert.show {
+            display: block;
+        }
+
+        .alert-success {
+            background: #d4edda;
+            color: #155724;
+            border: 1px solid #c3e6cb;
+        }
+
+        .alert-danger {
+            background: #f8d7da;
+            color: #721c24;
+            border: 1px solid #f5c6cb;
+        }
+
+        .alert-warning {
+            background: #fff3cd;
+            color: #856404;
+            border: 1px solid #ffeeba;
+        }
+
+        .server-info {
+            margin-top: 15px;
+            padding: 10px;
+            background: #ecf0f1;
+            border-radius: 5px;
+            font-size: 13px;
+            color: #2c3e50;
+        }
+
+        .refresh-btn {
+            background: #3498db;
+            color: white;
+            border: none;
+            padding: 8px 16px;
+            border-radius: 5px;
+            cursor: pointer;
+            font-size: 14px;
+            display: flex;
+            align-items: center;
+            gap: 5px;
+        }
+
+        .refresh-btn:hover {
+            background: #2980b9;
+        }
+
+        .badge {
+            padding: 3px 8px;
+            border-radius: 12px;
+            font-size: 11px;
+            font-weight: 600;
+        }
+
+        .badge-success {
+            background: #27ae60;
+            color: white;
+        }
+
+        .badge-warning {
+            background: #f39c12;
+            color: white;
+        }
+
+        .badge-info {
+            background: #3498db;
+            color: white;
+        }
+    </style>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
+</head>
+<body>
+    <div class="container">
+        <!-- Шапка -->
+        <div class="header">
+            <h1>
+                <i class="fas fa-cloud-upload-alt"></i>
+                Клиент внешнего API
+            </h1>
+            <div class="user-info">
+                <span id="userName">Загрузка...</span>
+                <button class="logout-btn" onclick="logout()">
+                    <i class="fas fa-sign-out-alt"></i> Выход
+                </button>
+            </div>
+        </div>
+
+        <!-- Подключение к серверу -->
+        <div class="connection-panel">
+            <div class="panel-title">
+                <i class="fas fa-plug"></i>
+                Подключение к внешнему сервису
+            </div>
+            
+            <div class="connection-form">
+                <div class="form-group">
+                    <label>URL сервиса</label>
+                    <input type="url" id="apiUrl" placeholder="https://example.com" value="">
+                </div>
+                <div class="form-group">
+                    <label>API ключ</label>
+                    <input type="text" id="apiKey" placeholder="Введите API ключ">
+                </div>
+                <button class="btn btn-primary" onclick="connect()" id="connectBtn">
+                    <i class="fas fa-link"></i> Подключиться
+                </button>
+            </div>
+
+            <!-- Сохраненные подключения -->
+            <div class="saved-connections">
+                <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px;">
+                    <span style="font-weight: 500;">Сохраненные подключения:</span>
+                    <button class="btn btn-secondary" onclick="loadSavedConnections()" style="padding: 5px 10px;">
+                        <i class="fas fa-sync-alt"></i> Обновить
+                    </button>
+                </div>
+                <div class="connections-list" id="connectionsList">
+                    <div class="loading-small">Загрузка...</div>
+                </div>
+            </div>
+
+            <!-- Информация о сервере -->
+            <div id="serverInfo" class="server-info" style="display: none;"></div>
+        </div>
+
+        <!-- Фильтры -->
+        <div class="filter-panel">
+            <div class="form-group">
+                <label>Статус задач</label>
+                <select id="statusFilter">
+                    <option value="">Все</option>
+                    <option value="assigned">Назначена</option>
+                    <option value="in_progress">В работе</option>
+                    <option value="completed">Выполнена</option>
+                    <option value="overdue">Просрочена</option>
+                    <option value="rework">На доработке</option>
+                </select>
+            </div>
+            <div class="form-group">
+                <label>Поиск</label>
+                <input type="text" id="searchFilter" placeholder="Поиск по названию и описанию">
+            </div>
+            <div class="form-group">
+                <label>Лимит</label>
+                <select id="limitFilter">
+                    <option value="20">20 задач</option>
+                    <option value="50" selected>50 задач</option>
+                    <option value="100">100 задач</option>
+                    <option value="200">200 задач</option>
+                </select>
+            </div>
+            <button class="btn btn-primary" onclick="loadTasks()" id="loadTasksBtn" disabled>
+                <i class="fas fa-search"></i> Загрузить задачи
+            </button>
+        </div>
+
+        <!-- Заголовок задач -->
+        <div class="tasks-header">
+            <h2>
+                <i class="fas fa-tasks"></i>
+                Задачи из внешнего сервиса
+            </h2>
+            <div style="display: flex; gap: 15px; align-items: center;">
+                <span class="tasks-count" id="tasksCount">0</span>
+                <button class="refresh-btn" onclick="loadTasks()" id="refreshTasksBtn" disabled>
+                    <i class="fas fa-sync-alt"></i> Обновить
+                </button>
+            </div>
+        </div>
+
+        <!-- Список задач -->
+        <div id="tasksContainer" class="tasks-grid">
+            <div class="loading">
+                <i class="fas fa-circle-notch"></i>
+                <p>Подключитесь к серверу для загрузки задач</p>
+            </div>
+        </div>
+
+        <!-- Пагинация -->
+        <div class="pagination" id="pagination" style="display: none;">
+            <button class="pagination-btn" id="prevPage" onclick="changePage(-1)" disabled>
+                <i class="fas fa-chevron-left"></i> Предыдущая
+            </button>
+            <span class="pagination-info" id="pageInfo">Страница 1 из 1</span>
+            <button class="pagination-btn" id="nextPage" onclick="changePage(1)" disabled>
+                Следующая <i class="fas fa-chevron-right"></i>
+            </button>
+        </div>
+    </div>
+
+    <!-- Модальное окно загрузки файлов -->
+    <div class="modal" id="uploadModal">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h3>Загрузка файлов</h3>
+                <span class="modal-close" onclick="closeUploadModal()">&times;</span>
+            </div>
+            
+            <div class="upload-area" onclick="document.getElementById('fileInput').click()">
+                <i class="fas fa-cloud-upload-alt"></i>
+                <p>Нажмите для выбора файлов или перетащите их сюда</p>
+                <p style="font-size: 12px; color: #95a5a6;">Максимум 15 файлов</p>
+            </div>
+            
+            <input type="file" id="fileInput" class="file-input" multiple onchange="handleFileSelect()">
+            
+            <div class="selected-files" id="selectedFiles" style="display: none;">
+                <div style="font-weight: 500; margin-bottom: 10px;">Выбранные файлы:</div>
+                <div id="filesList"></div>
+            </div>
+            
+            <div class="upload-progress" id="uploadProgress" style="display: none;">
+                <div style="margin-bottom: 5px;">Загрузка: <span id="progressPercent">0%</span></div>
+                <div class="progress-bar">
+                    <div class="progress-fill" id="progressBar" style="width: 0%;"></div>
+                </div>
+            </div>
+            
+            <div style="display: flex; gap: 10px; justify-content: flex-end;">
+                <button class="btn btn-secondary" onclick="closeUploadModal()">Отмена</button>
+                <button class="btn btn-success" onclick="uploadFiles()" id="uploadBtn" disabled>
+                    <i class="fas fa-upload"></i> Загрузить
+                </button>
+            </div>
+        </div>
+    </div>
+
+    <!-- Уведомления -->
+    <div id="alert" class="alert"></div>
+
+    <script>
+        let currentConnectionId = null;
+        let currentTasks = [];
+        let currentPage = 0;
+        let totalTasks = 0;
+        let pageSize = 50;
+        let currentTaskId = null;
+        let selectedFiles = [];
+
+        // Проверка авторизации
+        async function checkAuth() {
+            try {
+                const response = await fetch('/api/user');
+                const data = await response.json();
+                
+                if (data.user) {
+                    document.getElementById('userName').textContent = data.user.name || data.user.login;
+                } else {
+                    window.location.href = '/';
+                }
+            } catch (error) {
+                console.error('Ошибка проверки авторизации:', error);
+                window.location.href = '/';
+            }
+        }
+
+        // Выход
+        async function logout() {
+            try {
+                await fetch('/api/logout', { method: 'POST' });
+                window.location.href = '/';
+            } catch (error) {
+                console.error('Ошибка при выходе:', error);
+            }
+        }
+
+        // Загрузка сохраненных подключений
+        async function loadSavedConnections() {
+            try {
+                const response = await fetch('/api/client/connections');
+                const data = await response.json();
+                
+                const connectionsList = document.getElementById('connectionsList');
+                
+                if (data.success && data.connections.length > 0) {
+                    connectionsList.innerHTML = data.connections.map(conn => `
+                        <div class="connection-item ${currentConnectionId === conn.id ? 'active' : ''}" 
+                             onclick="selectConnection('${conn.id}')">
+                            <i class="fas fa-database"></i>
+                            <span>${conn.name}</span>
+                            <span class="remove-conn" onclick="event.stopPropagation(); removeConnection('${conn.id}')">
+                                <i class="fas fa-times"></i>
+                            </span>
+                        </div>
+                    `).join('');
+                } else {
+                    connectionsList.innerHTML = '<div class="connection-item">Нет сохраненных подключений</div>';
+                }
+            } catch (error) {
+                console.error('Ошибка загрузки подключений:', error);
+                document.getElementById('connectionsList').innerHTML = 
+                    '<div class="connection-item">Ошибка загрузки</div>';
+            }
+        }
+
+        // Выбор сохраненного подключения
+        function selectConnection(connectionId) {
+            currentConnectionId = connectionId;
+            
+            // Подсвечиваем активное подключение
+            document.querySelectorAll('.connection-item').forEach(el => {
+                el.classList.remove('active');
+            });
+            event.currentTarget.classList.add('active');
+            
+            // Активируем кнопки
+            document.getElementById('loadTasksBtn').disabled = false;
+            document.getElementById('refreshTasksBtn').disabled = false;
+            
+            // Загружаем задачи
+            loadTasks();
+        }
+
+        // Удаление подключения
+        async function removeConnection(connectionId) {
+            if (!confirm('Удалить это подключение?')) return;
+            
+            try {
+                const response = await fetch(`/api/client/connections/${connectionId}`, {
+                    method: 'DELETE'
+                });
+                
+                const data = await response.json();
+                
+                if (data.success) {
+                    if (currentConnectionId === connectionId) {
+                        currentConnectionId = null;
+                        document.getElementById('loadTasksBtn').disabled = true;
+                        document.getElementById('refreshTasksBtn').disabled = true;
+                        document.getElementById('tasksContainer').innerHTML = 
+                            '<div class="loading"><i class="fas fa-plug"></i><p>Подключитесь к серверу</p></div>';
+                        document.getElementById('tasksCount').textContent = '0';
+                        document.getElementById('serverInfo').style.display = 'none';
+                    }
+                    loadSavedConnections();
+                    showAlert('Подключение удалено', 'success');
+                }
+            } catch (error) {
+                console.error('Ошибка удаления подключения:', error);
+                showAlert('Ошибка при удалении подключения', 'danger');
+            }
+        }
+
+        // Подключение к серверу
+        async function connect() {
+            const apiUrl = document.getElementById('apiUrl').value.trim();
+            const apiKey = document.getElementById('apiKey').value.trim();
+            
+            if (!apiUrl || !apiKey) {
+                showAlert('Заполните URL сервиса и API ключ', 'warning');
+                return;
+            }
+
+            const connectBtn = document.getElementById('connectBtn');
+            connectBtn.disabled = true;
+            connectBtn.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Подключение...';
+
+            try {
+                const response = await fetch('/api/client/connect', {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json'
+                    },
+                    body: JSON.stringify({ api_url: apiUrl, api_key: apiKey })
+                });
+
+                const data = await response.json();
+
+                if (data.success) {
+                    showAlert('Подключение успешно установлено', 'success');
+                    
+                    // Сохраняем ID подключения
+                    currentConnectionId = data.connection.id;
+                    
+                    // Показываем информацию о сервере
+                    const serverInfo = document.getElementById('serverInfo');
+                    serverInfo.innerHTML = `
+                        <i class="fas fa-server"></i>
+                        <strong>Сервер:</strong> ${data.connection.url}<br>
+                        <strong>Пользователь:</strong> ${data.server_info.user}<br>
+                        <strong>Задач на сервере:</strong> ${data.server_info.tasks_count}
+                    `;
+                    serverInfo.style.display = 'block';
+                    
+                    // Обновляем список сохраненных подключений
+                    loadSavedConnections();
+                    
+                    // Активируем кнопки
+                    document.getElementById('loadTasksBtn').disabled = false;
+                    document.getElementById('refreshTasksBtn').disabled = false;
+                    
+                    // Очищаем поля ввода
+                    document.getElementById('apiUrl').value = '';
+                    document.getElementById('apiKey').value = '';
+                    
+                    // Загружаем задачи
+                    loadTasks();
+                } else {
+                    showAlert(data.error || 'Ошибка подключения', 'danger');
+                }
+            } catch (error) {
+                console.error('Ошибка подключения:', error);
+                showAlert('Ошибка при подключении к серверу', 'danger');
+            } finally {
+                connectBtn.disabled = false;
+                connectBtn.innerHTML = '<i class="fas fa-link"></i> Подключиться';
+            }
+        }
+
+        // Загрузка задач
+        async function loadTasks() {
+            if (!currentConnectionId) {
+                showAlert('Сначала выберите подключение', 'warning');
+                return;
+            }
+
+            const statusFilter = document.getElementById('statusFilter').value;
+            const searchFilter = document.getElementById('searchFilter').value;
+            const limit = parseInt(document.getElementById('limitFilter').value);
+            
+            pageSize = limit;
+
+            const tasksContainer = document.getElementById('tasksContainer');
+            tasksContainer.innerHTML = '<div class="loading"><i class="fas fa-circle-notch fa-spin"></i><p>Загрузка задач...</p></div>';
+
+            try {
+                let url = `/api/client/tasks?connection_id=${currentConnectionId}&limit=${limit}&offset=${currentPage * limit}`;
+                if (statusFilter) url += `&status=${statusFilter}`;
+                if (searchFilter) url += `&search=${encodeURIComponent(searchFilter)}`;
+
+                const response = await fetch(url);
+                const data = await response.json();
+
+                if (data.success) {
+                    currentTasks = data.tasks || [];
+                    totalTasks = data.meta.total;
+                    
+                    document.getElementById('tasksCount').textContent = totalTasks;
+                    
+                    if (currentTasks.length === 0) {
+                        tasksContainer.innerHTML = '<div class="no-tasks"><i class="fas fa-folder-open"></i><p>Задачи не найдены</p></div>';
+                    } else {
+                        renderTasks(currentTasks);
+                    }
+                    
+                    updatePagination();
+                } else {
+                    tasksContainer.innerHTML = `<div class="no-tasks"><i class="fas fa-exclamation-triangle"></i><p>Ошибка: ${data.error || 'Неизвестная ошибка'}</p></div>`;
+                }
+            } catch (error) {
+                console.error('Ошибка загрузки задач:', error);
+                tasksContainer.innerHTML = '<div class="no-tasks"><i class="fas fa-exclamation-triangle"></i><p>Ошибка загрузки задач</p></div>';
+            }
+        }
+
+        // Отрисовка задач
+        function renderTasks(tasks) {
+            const container = document.getElementById('tasksContainer');
+            
+            container.innerHTML = tasks.map(task => {
+                const statusClass = `status-${task.assignment_status || 'default'}`;
+                const statusText = getStatusText(task.assignment_status);
+                
+                // Форматируем даты
+                const createdDate = task.created_at ? new Date(task.created_at).toLocaleString() : 'Н/Д';
+                const dueDate = task.due_date ? new Date(task.due_date).toLocaleString() : 'Нет срока';
+                
+                return `
+                    <div class="task-card" id="task-${task.id}">
+                        <div class="task-header">
+                            <div class="task-title">${escapeHtml(task.title || 'Без названия')}</div>
+                            <div class="task-status ${statusClass}">${statusText}</div>
+                        </div>
+                        
+                        <div class="task-description">
+                            ${escapeHtml(task.description || 'Нет описания')}
+                        </div>
+                        
+                        <div class="task-meta">
+                            <div class="task-meta-item">
+                                <i class="fas fa-calendar-alt"></i>
+                                <span>Создана: ${createdDate}</span>
+                            </div>
+                            <div class="task-meta-item">
+                                <i class="fas fa-clock"></i>
+                                <span>Срок: ${dueDate}</span>
+                            </div>
+                            <div class="task-meta-item">
+                                <i class="fas fa-user"></i>
+                                <span>Автор: ${escapeHtml(task.creator_name || 'Н/Д')}</span>
+                            </div>
+                        </div>
+                        
+                        ${renderFiles(task.files, task.id)}
+                        
+                        <div class="task-actions">
+                            ${task.assignment_status !== 'completed' ? `
+                                <button class="task-action-btn action-progress" onclick="updateTaskStatus('${task.id}', 'in_progress')">
+                                    <i class="fas fa-play"></i> В работу
+                                </button>
+                                <button class="task-action-btn action-complete" onclick="updateTaskStatus('${task.id}', 'completed')">
+                                    <i class="fas fa-check"></i> Завершить
+                                </button>
+                            ` : ''}
+                            <button class="task-action-btn action-upload" onclick="openUploadModal('${task.id}')">
+                                <i class="fas fa-upload"></i> Файлы
+                            </button>
+                        </div>
+                    </div>
+                `;
+            }).join('');
+        }
+
+        // Отрисовка файлов задачи
+        function renderFiles(files, taskId) {
+            if (!files || files.length === 0) {
+                return '';
+            }
+            
+            return `
+                <div class="task-files">
+                    <div class="files-title">
+                        <i class="fas fa-paperclip"></i>
+                        Файлы (${files.length})
+                    </div>
+                    <ul class="files-list">
+                        ${files.map(file => `
+                            <li class="file-item">
+                                <i class="fas fa-file file-icon"></i>
+                                <span class="file-name" title="${escapeHtml(file.filename)}">
+                                    ${escapeHtml(file.filename)}
+                                </span>
+                                <span class="file-size">${formatFileSize(file.file_size)}</span>
+                                <a href="#" class="file-download" onclick="downloadFile('${taskId}', '${file.id}', '${escapeHtml(file.filename)}'); return false;">
+                                    <i class="fas fa-download"></i>
+                                </a>
+                            </li>
+                        `).join('')}
+                    </ul>
+                </div>
+            `;
+        }
+
+        // Обновление статуса задачи
+        async function updateTaskStatus(taskId, status) {
+            if (!currentConnectionId) return;
+            
+            const comment = status === 'completed' ? 
+                prompt('Введите комментарий к завершению (необязательно):') : 
+                null;
+            
+            const button = document.querySelector(`#task-${taskId} .action-${status === 'in_progress' ? 'progress' : 'complete'}`);
+            if (button) {
+                button.disabled = true;
+                button.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Обновление...';
+            }
+
+            try {
+                const response = await fetch(`/api/client/tasks/${taskId}/status?connection_id=${currentConnectionId}`, {
+                    method: 'PUT',
+                    headers: {
+                        'Content-Type': 'application/json'
+                    },
+                    body: JSON.stringify({ status, comment })
+                });
+
+                const data = await response.json();
+
+                if (data.success) {
+                    showAlert(`Статус задачи изменен на "${getStatusText(status)}"`, 'success');
+                    // Обновляем список задач
+                    loadTasks();
+                } else {
+                    showAlert(data.error || 'Ошибка обновления статуса', 'danger');
+                    if (button) {
+                        button.disabled = false;
+                        button.innerHTML = status === 'in_progress' ? 
+                            '<i class="fas fa-play"></i> В работу' : 
+                            '<i class="fas fa-check"></i> Завершить';
+                    }
+                }
+            } catch (error) {
+                console.error('Ошибка обновления статуса:', error);
+                showAlert('Ошибка при обновлении статуса', 'danger');
+                if (button) {
+                    button.disabled = false;
+                    button.innerHTML = status === 'in_progress' ? 
+                        '<i class="fas fa-play"></i> В работу' : 
+                        '<i class="fas fa-check"></i> Завершить';
+                }
+            }
+        }
+
+        // Открыть модальное окно загрузки файлов
+        function openUploadModal(taskId) {
+            currentTaskId = taskId;
+            document.getElementById('uploadModal').classList.add('active');
+            selectedFiles = [];
+            document.getElementById('selectedFiles').style.display = 'none';
+            document.getElementById('filesList').innerHTML = '';
+            document.getElementById('uploadBtn').disabled = true;
+            document.getElementById('uploadProgress').style.display = 'none';
+            document.getElementById('progressBar').style.width = '0%';
+            document.getElementById('progressPercent').textContent = '0%';
+        }
+
+        // Закрыть модальное окно
+        function closeUploadModal() {
+            document.getElementById('uploadModal').classList.remove('active');
+            currentTaskId = null;
+        }
+
+        // Обработка выбора файлов
+        function handleFileSelect() {
+            const files = document.getElementById('fileInput').files;
+            selectedFiles = Array.from(files);
+            
+            if (selectedFiles.length > 0) {
+                const filesList = document.getElementById('filesList');
+                filesList.innerHTML = selectedFiles.map((file, index) => `
+                    <div class="selected-file">
+                        <i class="fas fa-file"></i>
+                        <span class="file-name">${escapeHtml(file.name)}</span>
+                        <span class="file-size">${formatFileSize(file.size)}</span>
+                        <span class="remove-file" onclick="removeFile(${index})">
+                            <i class="fas fa-times"></i>
+                        </span>
+                    </div>
+                `).join('');
+                
+                document.getElementById('selectedFiles').style.display = 'block';
+                document.getElementById('uploadBtn').disabled = false;
+            } else {
+                document.getElementById('selectedFiles').style.display = 'none';
+                document.getElementById('uploadBtn').disabled = true;
+            }
+        }
+
+        // Удалить файл из списка
+        function removeFile(index) {
+            selectedFiles.splice(index, 1);
+            
+            if (selectedFiles.length > 0) {
+                const filesList = document.getElementById('filesList');
+                filesList.innerHTML = selectedFiles.map((file, i) => `
+                    <div class="selected-file">
+                        <i class="fas fa-file"></i>
+                        <span class="file-name">${escapeHtml(file.name)}</span>
+                        <span class="file-size">${formatFileSize(file.size)}</span>
+                        <span class="remove-file" onclick="removeFile(${i})">
+                            <i class="fas fa-times"></i>
+                        </span>
+                    </div>
+                `).join('');
+            } else {
+                document.getElementById('selectedFiles').style.display = 'none';
+                document.getElementById('uploadBtn').disabled = true;
+            }
+        }
+
+        // Загрузка файлов
+        async function uploadFiles() {
+            if (!currentConnectionId || !currentTaskId || selectedFiles.length === 0) return;
+
+            const formData = new FormData();
+            selectedFiles.forEach(file => {
+                formData.append('files', file);
+            });
+
+            const uploadBtn = document.getElementById('uploadBtn');
+            const progressDiv = document.getElementById('uploadProgress');
+            const progressBar = document.getElementById('progressBar');
+            const progressPercent = document.getElementById('progressPercent');
+
+            uploadBtn.disabled = true;
+            progressDiv.style.display = 'block';
+
+            try {
+                const xhr = new XMLHttpRequest();
+                
+                xhr.upload.addEventListener('progress', (e) => {
+                    if (e.lengthComputable) {
+                        const percent = Math.round((e.loaded / e.total) * 100);
+                        progressBar.style.width = percent + '%';
+                        progressPercent.textContent = percent + '%';
+                    }
+                });
+
+                xhr.addEventListener('load', () => {
+                    if (xhr.status === 200) {
+                        const data = JSON.parse(xhr.responseText);
+                        if (data.success) {
+                            showAlert(`Успешно загружено ${data.data?.files_uploaded || selectedFiles.length} файлов`, 'success');
+                            closeUploadModal();
+                            loadTasks(); // Обновляем список задач
+                        } else {
+                            showAlert(data.error || 'Ошибка загрузки файлов', 'danger');
+                            uploadBtn.disabled = false;
+                        }
+                    } else {
+                        showAlert('Ошибка загрузки файлов', 'danger');
+                        uploadBtn.disabled = false;
+                    }
+                });
+
+                xhr.addEventListener('error', () => {
+                    showAlert('Ошибка сети при загрузке', 'danger');
+                    uploadBtn.disabled = false;
+                });
+
+                xhr.open('POST', `/api/client/tasks/${currentTaskId}/files?connection_id=${currentConnectionId}`, true);
+                xhr.send(formData);
+
+            } catch (error) {
+                console.error('Ошибка загрузки файлов:', error);
+                showAlert('Ошибка при загрузке файлов', 'danger');
+                uploadBtn.disabled = false;
+            }
+        }
+
+        // Скачать файл
+        async function downloadFile(taskId, fileId, fileName) {
+            if (!currentConnectionId) return;
+
+            try {
+                const response = await fetch(`/api/client/tasks/${taskId}/files/${fileId}/download?connection_id=${currentConnectionId}`);
+                
+                if (!response.ok) {
+                    throw new Error('Ошибка скачивания');
+                }
+
+                const blob = await response.blob();
+                const url = window.URL.createObjectURL(blob);
+                const a = document.createElement('a');
+                a.href = url;
+                a.download = fileName;
+                document.body.appendChild(a);
+                a.click();
+                window.URL.revokeObjectURL(url);
+                a.remove();
+
+            } catch (error) {
+                console.error('Ошибка скачивания файла:', error);
+                showAlert('Ошибка при скачивании файла', 'danger');
+            }
+        }
+
+        // Смена страницы
+        function changePage(delta) {
+            const newPage = currentPage + delta;
+            if (newPage >= 0 && newPage * pageSize < totalTasks) {
+                currentPage = newPage;
+                loadTasks();
+            }
+        }
+
+        // Обновление пагинации
+        function updatePagination() {
+            const totalPages = Math.ceil(totalTasks / pageSize);
+            
+            if (totalPages > 1) {
+                document.getElementById('pagination').style.display = 'flex';
+                document.getElementById('pageInfo').textContent = `Страница ${currentPage + 1} из ${totalPages}`;
+                document.getElementById('prevPage').disabled = currentPage === 0;
+                document.getElementById('nextPage').disabled = currentPage >= totalPages - 1;
+            } else {
+                document.getElementById('pagination').style.display = 'none';
+            }
+        }
+
+        // Показать уведомление
+        function showAlert(message, type) {
+            const alert = document.getElementById('alert');
+            alert.className = `alert alert-${type} show`;
+            alert.innerHTML = message;
+            
+            setTimeout(() => {
+                alert.classList.remove('show');
+            }, 5000);
+        }
+
+        // Вспомогательные функции
+        function getStatusText(status) {
+            const statusMap = {
+                'assigned': 'Назначена',
+                'in_progress': 'В работе',
+                'completed': 'Выполнена',
+                'overdue': 'Просрочена',
+                'rework': 'На доработке'
+            };
+            return statusMap[status] || status || 'Неизвестно';
+        }
+
+        function formatFileSize(bytes) {
+            if (bytes === 0) return '0 Б';
+            const k = 1024;
+            const sizes = ['Б', 'КБ', 'МБ', 'ГБ'];
+            const i = Math.floor(Math.log(bytes) / Math.log(k));
+            return parseFloat((bytes / Math.pow(k, i)).toFixed(2)) + ' ' + sizes[i];
+        }
+
+        function escapeHtml(unsafe) {
+            return unsafe
+                .replace(/&/g, "&amp;")
+                .replace(/</g, "&lt;")
+                .replace(/>/g, "&gt;")
+                .replace(/"/g, "&quot;")
+                .replace(/'/g, "&#039;");
+        }
+
+        // Инициализация
+        document.addEventListener('DOMContentLoaded', () => {
+            checkAuth();
+            loadSavedConnections();
+        });
+    </script>
+</body>
+</html>
\ No newline at end of file
diff --git a/public/navbar.js b/public/navbar.js
index 05e61cd..6b2076d 100644
--- a/public/navbar.js
+++ b/public/navbar.js
@@ -128,6 +128,16 @@ if (currentUser && currentUser.role === 'admin') {
             id: "admin-btn"
         });
     }
+    // 👇 Кнопка админ-панели ТОЛЬКО для admin 👇
+    if (currentUser && currentUser.role === 'admin') {
+        navButtons.push({
+            onclick: "window.location.href = '/client.html'",
+            className: "nav-btn profile",
+            icon: "fas fa-cog",
+            text: "client",
+            id: "admin-btn"
+        });
+    }
     // Кнопка выхода
     navButtons.push({
         onclick: "logout()",
diff --git a/server.js b/server.js
index 4550bae..6905b51 100644
--- a/server.js
+++ b/server.js
@@ -1543,6 +1543,11 @@ async function initializeServer() {
         apiKeysModule(app, db, upload);
         console.log('✅ Модуль API ключей подключен');
         
+// 10. Подключаем API клиент для внешних сервисов
+const apiClient = require('./api-client');
+apiClient(app, db, upload);
+console.log('✅ API клиент для внешних сервисов подключен');
+
         // 10. Помечаем сервер как готовый
         serverReady = true;