Создание компонента с нуля

В системе управления NetCat, разумеется, существует возможность создания полнофункционального интернет-магазина, либо обычного каталога товаров. Для создания каталога уже существуют готовые компоненты:

• Товары и услуги: Простой каталог товаров
• Товары и услуги: Адаптивный каталог товаров

О создании компонента для каталога товаров будет рассказано в этом уроке.

В список компонентов можно попасть через меню "Разработка: Список компонентов" или через боковое меню "Разработка: Компоненты". 

Создать компонент в NetCat можно несколькими способами:

1. Создать компонент с помощью уже существующего, то есть просто можно скопировать любой из имеющихся компонентов и доделать под свои нужды.
2. Создать новый компонент "с нуля". В данном случае, можно воспользоваться очень удобным мастером создания компонента.
3. Компоненты можно экспортировать в файл, а затем импортировать на любой другой проект. Вы можете покупать компоненты, скачивать, меняться, заказывать и т. д. Посмотрите список готовых компонентов, уже поставляемых с системой.

Расскажем по порядку про каждый из способов.

1. Экспорт и импорт компонента из файла.

Вы можете в любое время экспортировать уже готовый компонент в файл. Сделать это можно, зайдя на вкладку "Редактирование компонента" (Рис. 1) и нажав на ссылку "Экспортировать компонент в файл":

Рис.1 - Экспортирование компонента в файл

Файл будет иметь расширение tpl.

Импортирование компонентов происходит следующим образом: откройте страницу «Компоненты», внизу страницы отобразится кнопка::

Рис.2 - Импортирование компонентов

Нужно нажать на неё, далее в появившейся форме выбираем файл компонента и ждём результата. При импорте может появиться подобное сообщение:

Рис.3 - Сообщение об ошибке пи импорте

Собственно, сообщение говорит само за себя - компонент, который вы пытаетесь установить, был создан на более ранних версиях. 

2. Копируем уже существующие компоненты.

Данным способом мы можем создать компонент "с нуля" безо всяких помощников, своими силами, либо редактируя уже имеющиеся данные.

Для выполнения этих действий, нужно нажать на иконку родительского раздела компонентов "Добавить компонент":

Рис.5 - Добавить новый компонент

или нажать на кнопку внизу списка компонентов:

Рис.6 - Кнопка добавления компонентов

Далее всё просто. Откроется окно, в котором вам будет предложены на выбор действия - создать компонент "с нуля" либо использовать уже имеющийся.

Рис.7 - Выбор варианта создания компонента

Выбираете то, что вам нужно, нажимаете на кнопку "Продолжить", записываете название компонента, группу (выбираете существующую или создаёте свою)

Рис.8 - Заполнение названия и выбор группы

и нажимаете на кнопку "Добавить компонент". На этом шаге новый компонент будет успешно добавлен и доступен для дальнейшей работы.

Далее необходимо создать все необходимые поля шаблона. На полях остановимся подробнее, так как поля - это наиважнейшие элементы при разработке сайта.

Как вы видите, при создании поля необходимо заполнить ряд данных. Рассмотрим их по порядку:

1. Название поля (латинскими буквами). Данное поле должно быть уникальным внутри одного компонента. Для ввода допускаются латинские буквы, цифры и символ подчёркивания.
2. Описание. Краткая характеристика поля. Это описание далее будет выводиться на сайте и в администраторском разделе.
3. Тип поля. Весьма обширное и очень важное понятие - тип поля, поэтому на нём остановимся подробнее. В данном поле возможны следующие варианты:
   • Строка. Обычное символьное поле;
   • Целое число;
   • Текстовый блок. Используется обычное текстовое поле textarea;
   • Список. Поле представляет собой элемент типа select с выпадающим списком;
   • Логическая переменная. Логическое поле (да/нет);
   • Файл. Поле типа «файл» (<input type=file>). Данное поле устанавливается как способ загрузки файлов, изображений в директории вашего сайта;
   • Число с плавающей запятой;
   • Дата и время;
   • Связь с другим объектом;
   • Множественный список.
4. Формат поля. Данное поле является логическим продолжением типа поля и в разных полях служит для разных целей. Например:
   • Полю типа "Строка" можно задать значения url, email, phone, password.
   • Полю типа "Файл" задаётся максимально возможный размер файла для загрузки и тип файла.
   • Полю типа "Дата и время" возможно задать автоматическое заполнение полей даты и времени путём добавление одной из записей: "event", "event_date", "event_time".
5. Обязательно для заполнения. В случае установки данного значения поле шаблона попадает в разряд обязательных. В этом случае скрипт не будет обрабатываться до тех пор, пока все обязательные поля не будут заполнены.
6. Возможен поиск по данному полю. Если вы установите данное значение, то по данному полю шаблона будет возможен поиск.
7. Приоритет. Значение данного поля определяет приоритетность вывода полей в компоненте и далее при добавлении/редактировании объекта.
8. Значение по умолчанию. Будет записано данное значение, если поле не заполнено.
9. Тип доступа к полю. В типе доступа выставляется видимость поля для посетителей или администратора сайта.

С полями выяснили, теперь добавим для нашего каталога все необходимые поля. Для начала выясним, какие поля должны быть у товара.

1. Название товара
2. Описание
3. Стоимость
4. Маленькая фотография
5. Большая фотография
6. Страна-производитель
7. Количество товара на складе

Предлагаю начать по порядку добить все необходимые поля.

Остановимся на значениях некоторых добавленных полей.

1. Фотографии добавляются в поле типа "Файл", при этом в значение "Формат" были выставлены значения "500000:image/*". Данная строка задаёт максимальный размер файла в байтах и тип файла. По аналогии вы можете создать поле для прайс-листа, к примеру.
2. Использовать поиск по полю. Означает, что данное поле будет участвовать в поиске по сайту.
3. Использовать пользовательский визуальный редактор. К полю будет "прикручен" визуальный редактор.
4. В поле страны-производителя используется тип поля "Список". Для отображения списка далее в форме добавления/редактирования нужно этот список создать. Мы сделаем это после создания компонента.

Вот такая таблица у нас должна получиться в итоге:

Рис.12 - Список добавленных полей