Как красиво программировать в angularjs то, что обычно...

19
Как (красиво) программировать в AngularJS то, что обычно программируют в 1С

Upload: fdconf

Post on 29-Nov-2014

783 views

Category:

Technology


0 download

DESCRIPTION

Константин Якушев «Как красиво программировать в AngularJS то, что обычно программируют в 1С» Frontend Dev Conf'14 www.fdconf.by

TRANSCRIPT

Page 1: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Как (красиво) программировать в AngularJS то, что обычно программируют в 1С

Page 2: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Инфраструктурная компания1. Складская система

2. Контакт-центр

3. Система отчётности

4. Личный кабинет для клиентов

5. Ещё несколько проектов без фронтэнда

Page 3: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Почему AngularJS, а не 1С?Во-первых, это круто

Поди найди умных программистов 1С

Масштабировать 1С можно, но плохо

1С в браузере можно, но плохо

1С — очень некрасивый

Page 4: Как красиво программировать в AngularJS то, что обычно программируют в 1С
Page 5: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Что легко в 1С и сложно в AngularJS?Таблицы и фильтрация (справочники и всё такое)

CRUD

Загрузка и выгрузка Excel

Контроль доступа

Блокировки

Промышленное оборудование

Page 6: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Как мы это делаемСтандартные компоненты для фильтрации и таблиц

Стандартные компоненты для CRUD

Стандартный сервис для загрузки/выгрузки Excel

Стандартный сервис аутентификации

Стандартный сервис блокировок

Творческое переосмысление работы с оборудованием

Page 7: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Распространяем через bowerПока нет своего bower-репозитория

Собираем на teamcity, кладём в папку и раздаём по http

"dependencies": { … "everada-auth": "http://bower.everada.ru/ev-auth-0.1.5.zip"

}

Page 8: Как красиво программировать в AngularJS то, что обычно программируют в 1С
Page 9: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Таблица (html)<ev-ng-table table-params="tableParams" ev-loading="loading.load" columns-data="tableFields"> <each-row ng-click="editTransaction($data[$index])"/></ev-ng-table>

Page 10: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Таблица (контроллер)

$scope.tableFields = [ { title: 'ID', value: 'id' }, { title: 'Тип', value: 'type' },

(…)

{ title: 'Статус', value: 'status' }, { title: 'Привязка', value: 'isMapped'}];

Page 11: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Фильтры

<div ev-datepicker model="dateFilter"> </div>

Page 12: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Фильтры<div button-checkbox-group filter-params="statusGroupConfig" model="tableParams.filter()" header="Статус:">

</div>

Page 13: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Фильтры$scope.statusGroupConfig = { buttonPrefix: 'status', buttons: [ { filterValue: 'All', textValue: 'Все', isAll: true }, { filterValue: 'Correct', textValue: 'ОК' }, { filterValue: 'Warning', textValue: 'Требуется уточнение' }, { filterValue: 'Error', textValue: 'Ошибка' } ]};

Page 14: Как красиво программировать в AngularJS то, что обычно программируют в 1С
Page 15: Как красиво программировать в AngularJS то, что обычно программируют в 1С

Загрузка из Excel1. Отправка файла на /excel/headers

2. Получение заголовков и разметка на модель

3. Отправка разметки и файла на /excel/map. Сервер возвращает json

4. Отправка json’а в API

Page 16: Как красиво программировать в AngularJS то, что обычно программируют в 1С
Page 17: Как красиво программировать в AngularJS то, что обычно программируют в 1С

БлокировкиПробуем заблокировать на 10 минут.

Если заблокировалось:

1. Продляем при редактировании

2. Снимаем при выходе

Если не заблокировалось:

1. Пингуем блокировку каждые 10 секунд

2. Администратор всегда может снять

Page 18: Как красиво программировать в AngularJS то, что обычно программируют в 1С

android + chrome

bluetooth-сканер

Page 19: Как красиво программировать в AngularJS то, что обычно программируют в 1С

/Как (красиво) программировать в AngularJS то, что обычно программируют в 1СКонстантин ЯкушевEverada19 апреля 2014 г.