Ви веб-розробник? Тоді вам може бути це цікаво.
SmartCafe це фреймворк для розробки систем керування сайтом (адмінки), CRM-систем, тощо. Для роботи з цією системою потрібно мати досвід роботи з наступними технологіями:
SmartCafe підтримує багатомовний інтерфейс. В базовій комплектації - українська та англійська мови. В системі передбачено багатокористувацький режим роботи з розмежуванням прав доступу у відповідності до повноважень користувачів. В SmartCafe включені безкоштовні бібліотеки та віджети для зручного внесення інформації та отримання звітності у зручні формати .pdf, .docx, .xml, .jpeg (графіки).
Якщо ви ще початківець у веб-розробці, але маєте бажання вчитися - цей фреймворк стане добрим фундаментом для вашого розвитку та розуміння процесу розробки веб-орієнтованих систем.
Для початку роботи з SmartCafe у вас повинен бути готовий хостінг. Завантажте smartcafe.zip, розархівуйте вміст папки у себе на локальній машині. Перед тим, як скопіювати систему на хостінг, потрібно створити таблиці у базі даних MySQL та прописати користувача та пароль для доступу:
//db define("db_server", 'localhost', true); define("db_database", 'admin_cafe', true); define("db_username", 'admin_cafe', true); define("db_password", '', true); define("charset", 'utf8', true); define("lc_time_names", 'uk_UA', true); define("group_concat_max_len", '4096', true); define("query_cache_type", 'OFF', true); //mail define("mail_host", 'mail.rising.com.ua', true); define("mail_port", "25", true); define("mail_user", 'support@rising.com.ua', true); define("mail_pass", '', true); //domain names define("work_folder", '', true); define("maindomain", 'cafe.rising.com.ua', true); define("cookie_domain", '.cafe.rising.com.ua', true); define("cookie_key", 'change_me', true); define("cookie_name", 'CAFEUSER', true); define("cookie_expiration", 2592000, true);
#RewriteCond %{HTTPS} off #RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI} [R,L]
В цій статті будемо вважати, що систему скопійовано в кореневу папку веб-сервера /public_html. Для ознайомлення та розробки підтримка SSL сервером не є критичною, але для робочого сервера рекомендуємо не нехтувати криптуванням трафіку. Отже, зайшовши бровзером за адресою вашого домену, ви отримаєте форму логування. При першому логуванні використовуємо пару логін-пароль: admin - admin. Після успішного логування, ви потрапляєте в інтерфейс Адмін-панелі SmartCafe. Рекомендуємо зразу змінити пароль для користувача admin, скориставшись відповідним лінком на верхній панелі. На цій же панелі, праворуч, знаходиться перемикач мов.
Адмін Панель на разі складається з шести пунктів:
Для прикладу розробимо панель керування своїм блогом. Відразу скажу, що цей приклад більше для демонстрації можливостей системи, аніж завершений повноційнний проект. Важливо: Всі таблиці, на основі яких створюються пункти меню повинні мати первинний індекс з автоінкрементом.
В цьому прикладі нам потрібно буде створити три таблиці: таблиця категорій, тегів та власне основна таблиця записів блогу.
Переходимо в пункт "Меню" та натискаємо кнопку "Додати". Поля, що потрібно заповнити розглянемо детальніше:
CREATE TABLE `category` ( `idcat` INT(10) UNSIGNED NOT NULL AUTO_INCREMENT, `idparent` INT(10) UNSIGNED NOT NULL DEFAULT '0', `name` VARCHAR(250) NOT NULL DEFAULT '', PRIMARY KEY (`idcat`) ) COLLATE='utf8_general_ci';
В закладці "JS-READY" вказуємо скрипт, який змінює висоту робочої таблиці на весь екран. В разі потреби - змінюємо від'ємник:
$('.table1 .table_body').height($(window).height()-133);
Вкладка "JS-INCLUDES" потрібна для вказання віджетів, що будуть використовуватися в даному пункті меню. На разі нічого не змінюємо в ній. Потрібні віджети автоматично додадуться при створені коду для цього пункту меню.
Підтверджуємо внесені дані натисканням кнопки "OK".
Створюємо (за домопогою phpmyadmin) в базі даних таблицю category, код див.вище.
Клікніть на новостворений пункт "Категорії" та натисніть кнопку "Джерело" з верхньої панелі таблиці. Тепер потрібно описати таблицю та поля вводу.
Вкладка Джерело
Після вкладки Джерело, йдуть вкладки з полями таблиці, опишемо їх, якими контролами вносити дані в ці поля.
Вкладка idcat
Вкладка idparent.Тут залишаємо все без змін. Метод get_idparent буде повертати всі можливі значення для батьківського вузла.
Вкладка name
Натискаємо кнопку "ОК". Заходимо ftp-менеджером на сайт, копіюємо новостворену папку з усім вмістом /public_html/modules/category в папку /modules нашого проекта на локальному комп'ютері. Відкриємо наш проект за допомогою NetBeans IDE.
Модуль (каталог) в системі SmartCafe складається з п'яти файлів. У новостворених файлів код є неформатованим, але це легко усувається засобами NetBeans. Відкриваємо файл, наприклад category_class.php, натисніть комбінацію клавіш "Alt+Shift+F" або пункт меню Source->Format.
Передача даних з форм відбувається за допомогою технології AJAX. Дані надсилаються в обробку файлу з закінченням _json.php відповідно кожного каталога.
Файли з закінченням _table.php та _dlg.php це представлення таблиць та діалогів модуля.
Файл з закінченням _class.php - відповідно клас роботи з таблицею MySQL, в якій зберігіються дані модуля.
І останній файл ready_js.php - це javascript-код, який обрамлює таблиці та діалоги, забезпечує фунціонування полів вводу, передачу та отримання даних з сервера. Модулі, на основі яких формується ready_js.php знаходяться в каталозі /js/smartcafe/. Ви можете дописувати їх - розширюючи функціонал вашого проекту.
Перейдемо в новостворений пункт "Категорії" та внесемо декілька записів.
Зверніть увагу, що у заголовку таблиці вказано ua:category:NotSet. Це означає, що в словнику немає значення української мови (ua:) для слова "category". Перейдіть в пункт меню "Словник" та додайте запис [назва: category, укр: Категорія, анг: Category].
Алгоритм сворення подібний до створення попереднього пункту, тому опишемо коротко параметри. Створимо в базі наступну таблицю:
CREATE TABLE `tag` ( `idtag` INT(10) UNSIGNED NOT NULL AUTO_INCREMENT, `name` VARCHAR(250) NOT NULL DEFAULT '', PRIMARY KEY (`idtag`) ) COLLATE='utf8_general_ci';
Переходимо в пункт "Меню" та створюємо новий з наступними параметрами:
В закладці js-ready:
$('.table1 .table_body').height($(window).height()-133);
Створюємо ресурсні файли: відмічаємо пункт та натискаємо кнопку "Джерело". Вказуємо наступні параметри у діалоговому вікні.
Вкладка Джерело:
Вкладка idtag залишаємо без змін, поле вводу має мати тип hidden.
Вкладка name:
Підтверджуємо натисканням кнопки "OK".
Переходимо в пункт tad та додаємо записи.
Додаємо запис в пункті "Меню" з наступними параметрами:
В закладці js-ready:
$('.table1 .table_body').height($(window).height()-133);
Створимо в базі наступну таблицю:
CREATE TABLE `post` ( `idpost` INT(11) UNSIGNED NOT NULL AUTO_INCREMENT, `idcat` INT(11) UNSIGNED NOT NULL DEFAULT '0', `dt` DATETIME NOT NULL, `title` VARCHAR(250) NOT NULL DEFAULT '', `post` TEXT NOT NULL, `active` ENUM('Y','N') NOT NULL DEFAULT 'Y', PRIMARY KEY (`idpost`) ) COLLATE='utf8_general_ci';
Відмічаємо новостворений пункт та натискаємо кнопку "Джерело":
Вкладка "Джерело":
Вкладка "idpost", в секції "Підтаблиці":
Вкладка "idcat":
Вкладка "dt":
Вкладка "title":
Вкладка "post":
Вкладка "active":
Перевіряємо правильність опису та натискаємо кнопку "OK".
Як зазначалось раніше, потрібно відкорегувати файл post_class.php. Тому скачуємо каталог /public_htmp/modeles/post. Замінюємо метод get_idcat($id) на наступний:
public function get_idcat() { $rs = mysqli_query($this->connection, 'SELECT a.idcat, a.name FROM category a ORDER BY a.name'); return $rs; }
і відповідно в файлі post_dlg.php в секції поля вводу idcat, замість
$record['name_idcat']вказати
$record['name']Виправлені файли копіюємо на хостінг.
Також, в базі буде створено таблиця post_gallery, в якій будуть зберігатися записи прикріплених фото до постів. При бажанні, можна створити ще один пункт з джерелом (таблицею) post_gallery, для редагування завантажених фото. Оновіть сторінку та спробуйте додати новий запис в блог.
Зверніть увагу, при створені попереднього модуля була використана опція gallary-control. Для обліку файлів-картинок галереї система автоматично створила таблицю post_gallary:
CREATE TABLE `post_gallary` ( `rowid` INT(10) UNSIGNED NOT NULL AUTO_INCREMENT, `idpost` INT(10) UNSIGNED NOT NULL DEFAULT '0', `name` VARCHAR(50) NOT NULL DEFAULT '', `note` VARCHAR(250) NOT NULL DEFAULT '', PRIMARY KEY (`rowid`) ) COLLATE='utf8_general_ci';
На основі цієї таблиці створимо новий пункт, а також продемонструємо як додавати звіти до пунктів меню.
Додаємо новий пункт меню з наступними параметрами:
В закладці js-ready:
$('.table1 .table_body').height($(window).height()-133);
Відмічаємо новостворений пункт та натискаємо кнопку "Джерело":
вкладка "Джерело":
вкладки "rowid" та "idpost" залишаємо без змін. В закладці "name" вказуємо наступне:
В закладці "note":
Натискаємо кнопку "OK". Скачуємо ресурсні файли для цього пункту, каталог /modules/post_gallary. Для коректної роботи пункту потрібно замінити метод get_idpost в файлі post_gallary_class.php на:
public function get_idpost() { $rs = mysqli_query($this->connection, 'SELECT a.idpost, a.title FROM post a ORDER BY a.title'); return $rs; }
А також в файлі post_gallary_dlg.php код
$record['name_idpost']
Замінити на
htmlspecialchars($record['title'])
Закопійовуємо правлені файли на хостінг і перевіряємо роботоздатність пункту.
Зверніть увагу, що біля кнопок редагування записами, з'явилась кнопка "Друку". Натиснувши на неї отримаєте пусту таблицю звітів. Додати запис звіту можна в однойменному пункті "Звіти", перед тим підготувавши файл з відповідним кодом. В первинну збірку включено три шаблонних файла звіту. Ці файли знаходяться в папці /report. Рекомендуємо створювати звіти на їх основі. Щоб звіт появився в певному пункті для певної групи користувачів, потрібно в описі звіта (пункт "Звіти") вказати "Групу користувачів" та в закладці "Назва пункту" - активувати звіт для вказаного пункту.
Після завершення розробки проекту, потрібно створити користувачів, які будуть вносити дані. Переходимо в пункт "Користувач". Додаємо запис. При описі полів користувача зупинемося на полі група. Не рекомендується включати інших користувачів в групу "admin". Тому створимо групу, наприклад: "postmaster". Клікніть на кнопці з трьома крапками [...], що знаходиться після поля назв груп, у діалоговому вікні додайте нову групу "postmaster". Закрийте вікно менеджера груп. Новому користувачу присвойте вище вказану групу. Заповніть інші поля та натисніть кнопку "OK".
Залишилося вказати пункти меню, котрі бачить група "postmaster". Переходимо в пункт "Меню", двічі клацємо на запис "Категорії", у вікні редагування, в полі "Група" ставимо галочку навпроти "postmaster". Аналогічно роздаємо права для інших новостворених пунктів нашого проекту. Для перевірки, можна вилогуватися та зайти під новоствореним користувачем, переконатися чи всі вказані пункти доступно.