logo
ELMA: Внутренний портал › Кастомизация › Использование разметки Razor для создания интерфейса пользовательской задачи в бизнес-процессе

Использование разметки Razor для создания интерфейса пользовательской задачи в бизнес-процессе

Внимание!
 Компания не несет ответственности за изменения, внесенные Вами в системные формы. После обновления системы на новую версию некоторые измененные Вами представления могут работать некорректно.
Чтобы использовать разметку Razor, необходимо в настройках пользовательской задачи на вкладке Настройки формы установить флаг Использовать шаблон Razor и прописать путь до этого шаблона в формате: ~\WebApplication\Views\Shared\Forms\Workflow\P_Process\TaskForm.cshtml . При этом файл TaskForm.cshtml необходимо предварительно создать в каталоге ../<Общая папка с файлами системы ELMA>\UserConfig\WebApplication\Views\Shared\Forms\Workflow\P_Process .
 
Контекстные переменные процесса можно вывести так (с помощью свойства style="margin-top:10px" можно регулировать ширину поля):
?
1
2
3
<table style="margin-top:10px">
@Html.EditableProperty("Entity.value1")
</table>
где value1 - это имя свойства контекстной переменной процесса.
 
Для вывода переменных в режиме Только для чтения вместо EditableProperty необходимо использовать метод Property:
?
1
2
3
<table style="margin-top:10px">
@Html.Property("Entity.value1")
</table>
При этом следует помнить, что @Html.EditableProperty вставляет строку таблицы с названием переменной и полем ввода. Если возникает необходимость вывести две контекстные переменные в одну строку, можно использовать методы Caption (выводит название переменной) и Editor (выводить поле ввода для этой переменной) в отдельных столбцах таблицы:
?
1
2
3
4
5
6
7
8
<table>
<tr>
<td>@Html.Caption("Entity.value1")</td>
<td>@Html.Editor("Entity.value1")</td>
<td>@Html.Caption("Entity.value2")</td>
<td>@Html.Editor("Entity.value2")</td>
</tr>
</table>
Если необходимо вывести в задаче несколько контекстных переменных в одну строку, но в режиме Только для чтения, то код будет таким же, но вместо метода Editor нужно использовать метод Display.
 
 
Для того, чтобы вывести две контекстные переменные типа какого-либо объекта в одну строку, можно использовать следующую конструкцию:
?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<table style="margin-top:10px; width:75%">
   <tr>
      <td style="width:50%">
        <table>
        @Html.EditableProperty("Entity.Klient", a=>a.Required=true)
        </table>
      </td>
      <td>
      <div style="width:10px;" />
      </td>
      <td style="width:50%">
        <table>
        @Html.EditableProperty("Entity.Usluga")
        </table>
      <td>
   </tr>
</table>
Каждая переменная выводится в отдельной таблице в колонке общей таблицы: это позволяет избежать влияния встроенных свойств метода EditableProperty (как и метода Property), которые всегда формируют отдельную строку таблицы для выводимого значения. 
 
Для применения нескольких CSS свойств синтаксис следующий:
?
1
@Html.EditableProperty("Entity.value1", a => {a.Html.style["width"]="250px"; a.Html.style["height"]="250px";})
Перемення типа Блок отображается так же, как и остальные контекстные переменные:
?
1
@Html.EditableProperty("Entity.blok")
При этом можно выводить не все свойства блока, а только добавленные в контекст этой задачи, делается это так:
?
1
2
3
4
5
6
7
8
<table>
@Html.Property("Entity.blok", a =>
{
a.TablePartParentId = Model.Entity.Id;
a.ViewProviderUid = EleWise.ELMA.Workflow.Web.Integration.WorkflowTaskObjectViewItemProvider.UID;
a.ViewItemId = Model.Task.Id.ToString();
})
</table>
Признак обязательности заполнения выводимого поля (Required) указывается следующим образом:
?
1
@Html.EditableProperty("Entity.value1", a=>a.Required=true)
Кнопки исполнения задачи выводятся так:
?
1
@Html.Partial("WorkflowTask/Buttons", Model)
Если необходимо, чтобы название переменной на форме задачи и ее значение отображались с разными стилями форматирования, можно использовать следующую конструкцию (в тегах можно задать любые нужные параметры форматирования):
?
1
2
3
4
5
6
<td style="color:red">
@Html.Caption("Entity.value1")
</td>
<td style="color:blue">
@Html.Display("Entity.value1", a => {})
</td>
Ниже приведен пример содержимого файла шаблона Razor, в котором создается 2 вкладки на форме задачи (Общие поля и Дополнительно). На вкладке Общие поля отображаются те переменные, которые выбраны в настройках задачи на вкладке Контекст. На вкладке Дополнительно отображается контекстная переменная value1 как в приведенных выше примерах. С помощью первых двух строк выводится информация о задаче.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
@using (var data = new ObjectViewData(this))
@inherits EleWise.ELMA.Web.Mvc.DynamicViewControl<EleWise.ELMA.Workflow.Web.Models.WorkflowTaskInfo>
 
@Html.Partial("WorkflowTask/ExecutedInfo", Model.ExecutedInfo)
 
@(TabPanel("WorkflowTask1").Items(tabs =>
{
 
    tabs.Add(
        new EleWise.ELMA.Web.Mvc.Models.Selectors.TabPanelItem()
        {
            Text = SR.T("Общие поля"),
            Selected = Model.SelectedTab == 0
        }).Content(@<text> @Html.Partial("~/Modules/EleWise.ELMA.Workflow.Web/Views/WorkflowTask/DefaultFieldsView.cshtml") </text>);   
 
    tabs.Add(
        new EleWise.ELMA.Web.Mvc.Models.Selectors.TabPanelItem()
        {
            Text = SR.T("Дополнительно")
        }).Content(@<table style="margin-top:10px">@Html.EditableProperty("Entity.value1")</table>);
 
}).Render())
 
@Html.Partial("WorkflowTask/Buttons", Model)