Введение
В этом руководстве показано, как реализовать канбан-доску в 1С с помощью Vue.js и классического подхода на HTML + JavaScript. Видео‑демонстрация доступна в RuTube, а исходный код можно скачать с Яндекс.Диска.
Технологический стек
- 1С:Предприятие – серверная часть, хранение данных и бизнес‑логика.
- Vue.js – фреймворк для построения пользовательского интерфейса.
- HTML + JavaScript – базовый набор технологий для клиентской части.
Архитектура решения
Канбан‑доска реализована как отдельный модуль, подключаемый к 1С. Данные о задачах и их статусах хранятся в базе 1С, а клиентская часть, построенная на Vue, получает их через API‑интерфейс.
Ключевые компоненты
- Модель данных – таблица задач с полями: ID, название, статус, дата создания.
- API‑слой – обработчики 1С, отдающие JSON‑ответы для Vue.
- Vue‑компоненты – колонки «To Do», «In Progress», «Done» и карточки задач.
- HTML‑шаблоны – базовая разметка, подключаемая к Vue.
Как подключить к 1С
1. Создайте новый модуль в конфигураторе 1С и добавьте таблицу задач. 2. Реализуйте обработчики, которые будут отдавать данные в формате JSON. 3. В клиентской части подключите Vue через CDN и настройте маршрутизацию к API‑слою. 4. Разместите HTML‑шаблоны в папке, доступной из 1С, и подключите их к Vue‑компонентам.
Скачивание исходников
Исходный код проекта доступен на Яндекс.Диске: скачать. В архиве находятся все файлы, необходимые для запуска канбан‑доски.
Заключение
Создание канбан‑доски в 1С с использованием Vue и HTML+JS – простой и быстрый способ визуализировать задачи и управлять ими. Следуйте шагам, приведённым выше, и вы сможете быстро интегрировать этот инструмент в свои бизнес‑процессы.
Автор: @nizamov_studio_1c
