Kintone от Cybozu позволяет быстро и легко создавать собственные бизнес-приложения, такие как ежедневные отчеты, протоколы, учетные записи и опросы. Он также позволяет создавать приложения с использованием файлов Excel или CSV для удовлетворения ваших собственных потребностей.
Kintone предоставляет множество функций в веб-браузере, но здесь мы сосредоточимся на разработке с использованием Kintone API и Monaca для преобразования вашего пользовательского бизнес-приложения в гибридное мобильное приложение.
Что вам нужно
Создание системы управления записями продаж
В этом сообщении блога мы создаем систему управления записями продаж. Давайте продолжим и создадим проект минимального шаблона в Monaca IDE.
Затем наведите курсор на «Config» и выберите «Manage JS/CSS Components».
Затем добавьте в проект пользовательский интерфейс Onsen. На момент написания этой статьи самой последней версией пользовательского интерфейса Onsen была 1.3.11.
Изменить HTML
Теперь мы можем изменить наш файл index.html, как показано ниже.
Мы добавили модуль myApp для AngularJS, а также пользовательский интерфейс Onsen.
Мы также создадим login.html, чтобы показать целевую страницу нашего приложения.
Мы использовали компоненты пользовательского интерфейса Onsen, чтобы упростить себе жизнь в приведенном выше коде. Чтобы получить доступ к Kintone API, нам действительно нужно на этой странице:
domainloginNameloginPass
Давайте посмотрим, что у нас есть прямо сейчас в Monaca Debugger.
Реализация процесса входа в систему
Пришло время сделать внутренний процесс входа в систему. Прежде всего, нам нужна библиотека Base64 для использования Kintone API. Для этой демонстрации мы используем BASE64 (RFC2045) Encode/Decode for string in JavaScript от MIZUTANI Tociyuki. Загрузите и загрузите в проект в папку js (создав новую папку). Также мы создадим файл kintone.js для последующей модификации.
Включите эти файлы в index.html.
Когда вы нажимаете кнопку «Войти», мы хотим показать записи отчета о продажах. В приведенном ниже коде определяется функция showList, которая будет выполнять HTTP-запрос для получения данных из Kintone API.
Чтобы убедиться, что это работает, попробуйте войти в систему, используя данные своей учетной записи. В окне консоли вы увидите сообщения «Начать процесс входа в систему» и «Вы успешно вошли в систему». Сервер Kintone отклонит, если вы получите доступ из настольного браузера.
Получение данных
Теперь, когда мы успешно вошли в систему, мы можем получить данные. Добавьте следующий код:
список.html
Содержимое list.html выглядит следующим образом.
Последний штрих в kintone.js
Мы используем переменную items для хранения списка записей в list.html, поэтому мы немного изменим js/kintone.js.
Во-первых, сбросьте $scope.items в самом начале функции showList.
Затем мы сохраним возвращенные данные в переменную в успешном вызове, который мы определили ранее.
Наконец, определите MainController.
И это все.
Давайте попробуем
Если мы не ошиблись, мы должны увидеть список записей.
Дальнейшая практика
Изменение внешнего вида или добавление подробной страницы в приложение сделает его внешний вид намного приятнее и богаче.
Хорошая вещь о Kintone заключается в том, что мы можем контролировать данные не только через их красивое настольное приложение, но и через их богатый веб-API. Кроме того, использование Monaca позволяет легко создавать индивидуальные бизнес-приложения, поэтому воспользуйтесь преимуществами Monaca и Kintone для создания собственного гибридного приложения.
Первоначально опубликовано на onsen.io 19 октября 2015 г.
