Персонализация веб-интерфейса

В ЛЭРС УЧЕТ 3.0 внешний вид веб-интерфейса можно будет настроить под конкретную обслуживающую компанию. Мы пошли навстречу компаниям, желающих выдать больше информации о себе и предоставляемых услугах.

Под катом представлен пример персонализации веб-интерфейса нашим клиентом НПО "Карат".

Стандартное оформление веб-интерфейса выглядит следующим образом.

 Каждая страница сайта разделена на отдельные блоки. Информация в этих блоках загружается из отдельных модулей, которые могут быть полностью переопределены. Это позволяет отобразить любую информацию в блоках.

На рисунках показаны блоки, которые могут быть переопределены.

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

• ApplicationTitle – Заголовок сайта. Отображается в верхнем левом углу страницы.
• CompanyLogoFile – Имя файла логотипа компании. Для отображения логотипа своей компании в левом верхнем углу сайта, скопируйте изображение в корень папки с веб-интерфейсом и укажите полное имя файла с расширением. Допустимый формат изображения gif, jpeg, png.
• CompanyTitle - Наименование компании. Отображается при наведении курсора на логотип компании.
• CompanyUrl - Сайт компании. При нажатии на логотип компании будет происходить перенаправление на указанный сайт.
• ContactEmail – E-mail для связи. Используется для связи разработчиков с администратором системы.
• ContactPhone – Телефон для связи. Используется для связи клиентов с администратором системы.

Для глубокой настройки внешнего вида понадобятся знания верстки и программирования: html, aspx, css, javascript, C#/VB.

Модули для отображения информации в блоках хранятся в папке Customization (полный путь по умолчанию "C:\Program Files\LERS\Web\Customization"). Доступны следующие модули (пользовательские элементы управления ascx):

• app_offline.htm - страница, которая будет показана клиенту во время обновления системы.
• FooterCenter.ascx – содержание центральной части «подвала» страницы.
• FooterLeft.ascx  – содержание левой части «подвала» страницы.
• FooterRight.ascx  – содержание правой части «подвала» страницы.
• Header.ascx  – содержание «шапки» страницы, левее главного меню.
• LeftColumn.ascx  – содержание левой колонки, ниже панели «Действия» на страницах списка объектов/точек учета.
• Login.ascx  – содержание рабочей области, между «шапкой» и «подвалом», страницы входа в систему. Элемент управления Login обязательно должен содержать в себе форму входа:
  
  
  <div class="login_form"> <lers:LoginForm ID="customLoginForm" runat="server" EnableViewState="false" /> </div>
  
  
• LoginFormLogo.ascx  – содержание блока с логотипом на форме входа, страница входа в систему.

Ascx файлы имеют синтаксис разметки aspx (asp.net) и могут содержать html разметку, серверный код на одном из языков .net (C#, VB), javascript, css стили. Весь текст файлов разрешено переопределять, для корректной работы каждый файл должен содержать первую строку вида:

<%@ Control Language="C#" AutoEventWireup="true" ClassName="Lers.Web.Client.Header" %>

Наше требование. На веб-интерфейсе должна остаться ссылка на наш сайт «работает на лэрс учет».

API

Для взаимодействия с системой ЛЭРС УЧЕТ реализован API, который можно использовать в пользовательских элементах управления. В данный момент доступно API серверной стороны, в дальнейшем планируется добавить клиентское API для использования в скриптах JavaScript.

Для начала использования API необходимо подключить пространство имен Lers.Web.Api. Для этого добавьте диррективу Import:

<%@ Import Namespace="Lers.Web.Api" %>

Использовать API в пользовательском элементе управления на языке C# можно следующим образом:

<%@ Import Namespace="Lers.Web.Api" %>

<asp:Label ID="userDisplayName" runat="server" Text="Label"></asp:Label>

<script runat="server">

protected void Page_PreRender(object sender, EventArgs e)
{
   this.userDisplayName.Text = User.DisplayName;
}

</script>

В данном примере будет выведено отображаемое имя пользователя.

Классы:

User
Текущий подключенный пользователь.
Статические свойства:
string DisplayName - Отображаемое имя.
string Login - Имя входа.
string Description - Описание.