Service Catalog from

Service Catalog offers forms that allow users to submit service requests.

Generally, a request form page consists of the following elements:

The <breadcrumbs> widget allows navigating within the Portal pages structure.
The <sidemenu> widget adding a sidemenu.

>> screenshot <<

Breadcrumbs widget configuration

To configure breadcrumbs correctly, it is preferable to use the attribute values as in the example below (type these values in the Template field of the <breadcrumbs> widget form):

breadcrumbs

<div class="portal__breadcrumbs customized">
  <breadcrumbs>
</div>

After that, you can define the breadcrumbs view in the CSS field of this form:

Breadcrumbs CSS

.customized {
  font-family: Tahoma,Verdana,Segoe,sans-serif;
}

Sidemenu widget configuration

To configure a <sidemenu> widget, use the example below as a pattern:

sidemenu

<SideMenu parentsDepth="1" childrenDepth="1" includeCategories="1" includeItems="1">\
</SideMenu>

Service Catalog form widget configuration

...

Service Catalog form

<div simple-if = {data.ok} class ="catalog__record">
    <div simple-if="{data.sizeDesktop}">
        <div class="body">
            <div id="recordContent">
            <div class="recordTitle">{data.headerTitle}</div>
            <div class="recordType">{data.headerTypeText}</div>
            <div class="recordDescription">{data.headerDescription}</div> 
            </div>
            <div class="recordIcon"><img width="176" height="176" alt ='' src={data.headerPhoto}></img></div>      
        </div>
        <div class ="recordBorder"></div>
    </div>
    <div simple-if="{data.sizeMobile}">
        <div class="mobile-recordIcon"><img width="112" height="112" alt ='' src={data.headerPhoto}></img></div>
        <div class="mobile-recordContent">
            <div class="mobile-recordTitle">{data.headerTitle}</div>
            <div class="mobile-recordType">{data.headerTypeText}</div>
            <div class="mobile-recordDescription">{data.headerDescription}</div>
            <div event-click="s_widget_custom.readMore()" class="mobile-recordDescription__readMore" simple-if ={data.descriptionReadMore}>
                {data.readMoreText}
            </div>
        </div>
    </div>
<Form tableName="{data.table}" view="options.view" save="{data.Save}" uiActions="options.uiActionsOn" userScripts="options.clientScriptsOn" ></Form>
</div>
<div simple-if = {data.error} class ="catalog__record">
<div class = catalog__record-error>
            Exception: {data.exceptions}
</div>
</div>
<div simple-if={data.afterSave} class ="catalog__record-aftersave">
<div class="catalog__record-aftersave-icon"></div>
<div class="catalog__record-aftersave-title"> {data.requestSent}</div>
<div class="catalog__record-aftersave-button">
    <div id="custom_button" class="catalog__record-aftersave-button-text">{data.newRequest}</div>
</div>
<div class="catalog__record-aftersave-link"><a href="/portal/my_tickets">{data.myTickets}<a></div>
</div>

Page tree

Service Catalog from

Breadcrumbs widget configuration

Sidemenu widget configuration

Service Catalog form widget configuration