Как красиво программировать в angularjs то, что обычно...
DESCRIPTION
Константин Якушев «Как красиво программировать в AngularJS то, что обычно программируют в 1С» Frontend Dev Conf'14 www.fdconf.byTRANSCRIPT
Как (красиво) программировать в AngularJS то, что обычно программируют в 1С
Инфраструктурная компания1. Складская система
2. Контакт-центр
3. Система отчётности
4. Личный кабинет для клиентов
5. Ещё несколько проектов без фронтэнда
Почему AngularJS, а не 1С?Во-первых, это круто
Поди найди умных программистов 1С
Масштабировать 1С можно, но плохо
1С в браузере можно, но плохо
1С — очень некрасивый
Что легко в 1С и сложно в AngularJS?Таблицы и фильтрация (справочники и всё такое)
CRUD
Загрузка и выгрузка Excel
Контроль доступа
Блокировки
Промышленное оборудование
Как мы это делаемСтандартные компоненты для фильтрации и таблиц
Стандартные компоненты для CRUD
Стандартный сервис для загрузки/выгрузки Excel
Стандартный сервис аутентификации
Стандартный сервис блокировок
Творческое переосмысление работы с оборудованием
Распространяем через bowerПока нет своего bower-репозитория
Собираем на teamcity, кладём в папку и раздаём по http
"dependencies": { … "everada-auth": "http://bower.everada.ru/ev-auth-0.1.5.zip"
}
Таблица (html)<ev-ng-table table-params="tableParams" ev-loading="loading.load" columns-data="tableFields"> <each-row ng-click="editTransaction($data[$index])"/></ev-ng-table>
Таблица (контроллер)
$scope.tableFields = [ { title: 'ID', value: 'id' }, { title: 'Тип', value: 'type' },
(…)
{ title: 'Статус', value: 'status' }, { title: 'Привязка', value: 'isMapped'}];
Фильтры
<div ev-datepicker model="dateFilter"> </div>
Фильтры<div button-checkbox-group filter-params="statusGroupConfig" model="tableParams.filter()" header="Статус:">
</div>
Фильтры$scope.statusGroupConfig = { buttonPrefix: 'status', buttons: [ { filterValue: 'All', textValue: 'Все', isAll: true }, { filterValue: 'Correct', textValue: 'ОК' }, { filterValue: 'Warning', textValue: 'Требуется уточнение' }, { filterValue: 'Error', textValue: 'Ошибка' } ]};
Загрузка из Excel1. Отправка файла на /excel/headers
2. Получение заголовков и разметка на модель
3. Отправка разметки и файла на /excel/map. Сервер возвращает json
4. Отправка json’а в API
БлокировкиПробуем заблокировать на 10 минут.
Если заблокировалось:
1. Продляем при редактировании
2. Снимаем при выходе
Если не заблокировалось:
1. Пингуем блокировку каждые 10 секунд
2. Администратор всегда может снять
android + chrome
bluetooth-сканер
/Как (красиво) программировать в AngularJS то, что обычно программируют в 1СКонстантин ЯкушевEverada19 апреля 2014 г.