[Major] Added paging to users, sessions, fixed layout in roles
This commit is contained in:
parent
b856a925b0
commit
0c5a1e6d1c
|
|
@ -29,10 +29,6 @@
|
|||
display: block;
|
||||
}
|
||||
|
||||
.object-div {
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
.title-div {
|
||||
padding-left: 30px;
|
||||
}
|
||||
|
|
@ -49,8 +45,7 @@
|
|||
}
|
||||
|
||||
paper-material {
|
||||
border-radius: 2px;
|
||||
background-color: #ffffff;
|
||||
background: #ffffff;
|
||||
}
|
||||
|
||||
paper-tabs {
|
||||
|
|
@ -87,314 +82,322 @@
|
|||
|
||||
</style>
|
||||
|
||||
<div class="object-div">
|
||||
<paper-material elevation="2">
|
||||
|
||||
<div class="g-row title-div" on-tap="_toggleExpanded">
|
||||
<div class="g-12">
|
||||
<h1 class="title">
|
||||
<template is="dom-if" if="[[isRootElement]]">
|
||||
<paper-checkbox checked="{{object._checked}}" on-tap="onCheckTapped"></paper-checkbox>
|
||||
</template>
|
||||
<span style="text-transform: uppercase">[[object.objectType]]</span> <span class="sub g-ml-4">Id:</span>
|
||||
[[object.id]] <span class="sub g-ml-4">Name:</span> [[object.name]] <span class="sub g-ml-4">Type:</span>
|
||||
[[object.type]]
|
||||
<div class="object-div">
|
||||
|
||||
<paper-icon-button class="g-pull-right"
|
||||
id="expandedIcon"
|
||||
icon="expand-more"></paper-icon-button>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<template is="dom-if" if="[[expanded]]">
|
||||
<div class="g-row">
|
||||
<div class="g-row title-div" on-tap="_toggleExpanded">
|
||||
<div class="g-12">
|
||||
|
||||
<!-- Tabs -->
|
||||
|
||||
<paper-tabs selected="{{selectedDetailType}}"
|
||||
attr-for-selected="name"
|
||||
fallback-selection="none">
|
||||
<paper-tab name="details">Details</paper-tab>
|
||||
<paper-tab name="parameters">Parameters</paper-tab>
|
||||
<paper-tab name="policies">Policies</paper-tab>
|
||||
<template is="dom-if" if="[[_isResource(object.objectType)]]">
|
||||
<paper-tab name="timedstates">Timed States</paper-tab>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isActivity(object.objectType)]]">
|
||||
<paper-tab name="elements">Elements</paper-tab>
|
||||
</template>
|
||||
<h1 class="title">
|
||||
<template is="dom-if" if="[[isRootElement]]">
|
||||
<paper-tab name="model">Model</paper-tab>
|
||||
<paper-checkbox checked="{{object._checked}}" on-tap="onCheckTapped"></paper-checkbox>
|
||||
</template>
|
||||
</paper-tabs>
|
||||
|
||||
|
||||
<!-- Tab sections -->
|
||||
<iron-pages selected="{{selectedDetailType}}" attr-for-selected="name">
|
||||
|
||||
<!-- details -->
|
||||
<section name="details">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<div class="g-row">
|
||||
|
||||
<div class="g-6">
|
||||
|
||||
<dl class="g-dl">
|
||||
<dt>Id</dt>
|
||||
<dd>[[object.id]]</dd>
|
||||
<dt>Name</dt>
|
||||
<dd>[[object.name]]</dd>
|
||||
<dt>Type</dt>
|
||||
<dd>[[object.type]]</dd>
|
||||
<dt>Locator</dt>
|
||||
<dd>[[object.locator]]</dd>
|
||||
</dl>
|
||||
|
||||
<template is="dom-if"
|
||||
if="[[_isActivity(object.objectType)]]"
|
||||
restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>TimeOrdering</dt>
|
||||
<dd>[[object.timeOrdering]]</dd>
|
||||
<dt>Start</dt>
|
||||
<dd>[[_formatDate(object.start)]]</dd>
|
||||
<dt>End</dt>
|
||||
<dd>[[_formatDate(object.end)]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[_isOrder(object.objectType)]]" restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>Date</dt>
|
||||
<dd>[[_formatDate(object.date)]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
<template is="dom-if" if="[[_isAction(object.objectType)]]" restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>Start</dt>
|
||||
<dd>[[_formatDate(object.start)]]</dd>
|
||||
<dt>End</dt>
|
||||
<dd>[[_formatDate(object.end)]]</dd>
|
||||
<dt>Resource Type</dt>
|
||||
<dd>[[object.resourceType]]</dd>
|
||||
<dt>Resource Id</dt>
|
||||
<dd>[[object.resourceId]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="g-6">
|
||||
|
||||
<template is="dom-if" if="[[object.version]]" restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>Created</dt>
|
||||
<dd>[[_formatDate(object.version.created)]]</dd>
|
||||
<dt>Updated</dt>
|
||||
<dd>[[_formatDate(object.version.updated)]]</dd>
|
||||
<dt>CreatedBy</dt>
|
||||
<dd>[[object.version.createdBy]]</dd>
|
||||
<dt>Deleted</dt>
|
||||
<dd>[[object.version.deleted]]</dd>
|
||||
<dt>Version</dt>
|
||||
<dd>[[object.version.version]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- parameters -->
|
||||
<section name="parameters">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.parameterBags)]]">
|
||||
<p class="g-center">No parameters defined on [[object.objectType]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.parameterBags)]]">
|
||||
|
||||
<div class="g-row g-pt-2">
|
||||
<div class="g-2"><b>ParameterBag</b></div>
|
||||
<div class="g-2"><b>Parameter Id</b></div>
|
||||
<div class="g-2"><b>Name</b></div>
|
||||
<div class="g-2"><b>Interpretation</b></div>
|
||||
<div class="g-1"><b>UOM</b></div>
|
||||
<div class="g-1"><b>Type</b></div>
|
||||
<div class="g-2"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="{{_asArray(object.parameterBags)}}" as="bag">
|
||||
<template is="dom-repeat"
|
||||
items="{{_asArray(bag.value.parameters)}}"
|
||||
as="param">
|
||||
|
||||
<div class="g-row">
|
||||
<div class="g-2 cell">[[bag.value.id]]</div>
|
||||
<div class="g-2 cell">[[param.value.id]]</div>
|
||||
<div class="g-2 cell">[[param.value.name]]</div>
|
||||
<div class="g-2 cell">[[param.value.interpretation]]</div>
|
||||
<div class="g-1 cell">[[param.value.uom]]</div>
|
||||
<div class="g-1 cell">[[param.value.type]]</div>
|
||||
<div class="g-2 cell">[[param.value.value]]</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- policies -->
|
||||
<section name="policies">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-m-4 g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.policies)]]">
|
||||
<p class="g-pt-4 g-center">No policies defined on [[objectName]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.policies)]]">
|
||||
|
||||
<div class="g-row g-pt-2 data-list">
|
||||
<div class="g-6"><b>Type</b></div>
|
||||
<div class="g-6"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="{{_asArray(object.policies)}}" as="policy">
|
||||
<div class="g-row data-list">
|
||||
<div class="g-6 cell">[[policy.key]]</div>
|
||||
<div class="g-6 g-pl-2 cell">[[policy.value]]</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- timedstates -->
|
||||
<template is="dom-if" if="[[_isResource(object.objectType)]]">
|
||||
<section name="timedstates">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.timedStates)]]">
|
||||
<p class="g-pt-4 g-center">No timed states defined on [[objectName]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.timedStates)]]">
|
||||
<template is="dom-repeat"
|
||||
items="[[_asArray(object.timedStates)]]"
|
||||
as="timedState">
|
||||
|
||||
<div class="g-row g-pt-2">
|
||||
<div class="g-4"><b>Id</b> [[timedState.value.id]]</div>
|
||||
<div class="g-4"><b>Name</b> [[timedState.value.name]]</div>
|
||||
<div class="g-4"><b>Type</b> [[timedState.value.type]]</div>
|
||||
</div>
|
||||
|
||||
<div class="g-row g-pt-4 data-list">
|
||||
<div class="g-6"><b>Time</b></div>
|
||||
<div class="g-6"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat"
|
||||
items="[[timedState.value.values]]"
|
||||
as="timedStateValue">
|
||||
<div class="g-row data-list">
|
||||
<div class="g-6 cell">[[timedStateValue.time]]</div>
|
||||
<div class="g-6 g-pl-2 cell">[[timedStateValue.value]]</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<!-- activity children -->
|
||||
<template is="dom-if" if="[[_isActivity(object.objectType)]]">
|
||||
<section name="elements">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-repeat" items="[[object.elements]]" as="childElement">
|
||||
<strolch-wc-inspector-object base-path="[[basePath]]"
|
||||
realm="[[realm]]"
|
||||
object="[[childElement]]"
|
||||
class="g-m-2"></strolch-wc-inspector-object>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<!-- model -->
|
||||
<template is="dom-if" if="[[isRootElement]]">
|
||||
<section name="model">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
<textarea value="{{model::input}}"></textarea>
|
||||
|
||||
<div class="g-mt-3">
|
||||
<paper-radio-group selected="{{modelType}}" style="font-size: small">
|
||||
<paper-radio-button name="xml">XML</paper-radio-button>
|
||||
<paper-radio-button name="json">JSON</paper-radio-button>
|
||||
<paper-radio-button name="json-flat">JSON Flat</paper-radio-button>
|
||||
</paper-radio-group>
|
||||
|
||||
<paper-button raised class="g-pull-right" on-tap="_saveModel">Save
|
||||
</paper-button>
|
||||
<paper-button class="g-pull-right" on-tap="_removeModel">Remove
|
||||
</paper-button>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
</iron-pages>
|
||||
<span style="text-transform: uppercase">[[object.objectType]]</span>
|
||||
<span class="sub g-ml-4">Id:</span> [[object.id]] <span class="sub g-ml-4">Name:</span>
|
||||
[[object.name]] <span class="sub g-ml-4">Type:</span>
|
||||
[[object.type]]
|
||||
|
||||
<paper-icon-button class="g-pull-right"
|
||||
id="expandedIcon"
|
||||
icon="expand-more"></paper-icon-button>
|
||||
</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
<template is="dom-if" if="[[expanded]]">
|
||||
<div class="g-row">
|
||||
<div class="g-12">
|
||||
|
||||
<hr />
|
||||
</div>
|
||||
<!-- Tabs -->
|
||||
<paper-tabs selected="{{selectedDetailType}}"
|
||||
attr-for-selected="name"
|
||||
fallback-selection="none">
|
||||
<paper-tab name="details">Details</paper-tab>
|
||||
<paper-tab name="parameters">Parameters</paper-tab>
|
||||
<paper-tab name="policies">Policies</paper-tab>
|
||||
<template is="dom-if" if="[[_isResource(object.objectType)]]">
|
||||
<paper-tab name="timedstates">Timed States</paper-tab>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isActivity(object.objectType)]]">
|
||||
<paper-tab name="elements">Elements</paper-tab>
|
||||
</template>
|
||||
<template is="dom-if" if="[[isRootElement]]">
|
||||
<paper-tab name="model">Model</paper-tab>
|
||||
</template>
|
||||
</paper-tabs>
|
||||
|
||||
<!-- Tab sections -->
|
||||
<iron-pages selected="{{selectedDetailType}}" attr-for-selected="name">
|
||||
|
||||
<!-- details -->
|
||||
<section name="details">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<div class="g-row">
|
||||
|
||||
<div class="g-6">
|
||||
|
||||
<dl class="g-dl">
|
||||
<dt>Id</dt>
|
||||
<dd>[[object.id]]</dd>
|
||||
<dt>Name</dt>
|
||||
<dd>[[object.name]]</dd>
|
||||
<dt>Type</dt>
|
||||
<dd>[[object.type]]</dd>
|
||||
<dt>Locator</dt>
|
||||
<dd>[[object.locator]]</dd>
|
||||
</dl>
|
||||
|
||||
<template is="dom-if"
|
||||
if="[[_isActivity(object.objectType)]]"
|
||||
restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>TimeOrdering</dt>
|
||||
<dd>[[object.timeOrdering]]</dd>
|
||||
<dt>Start</dt>
|
||||
<dd>[[_formatDate(object.start)]]</dd>
|
||||
<dt>End</dt>
|
||||
<dd>[[_formatDate(object.end)]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
<template is="dom-if"
|
||||
if="[[_isOrder(object.objectType)]]"
|
||||
restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>Date</dt>
|
||||
<dd>[[_formatDate(object.date)]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
<template is="dom-if"
|
||||
if="[[_isAction(object.objectType)]]"
|
||||
restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>State</dt>
|
||||
<dd>[[object.state]]</dd>
|
||||
<dt>Start</dt>
|
||||
<dd>[[_formatDate(object.start)]]</dd>
|
||||
<dt>End</dt>
|
||||
<dd>[[_formatDate(object.end)]]</dd>
|
||||
<dt>Resource Type</dt>
|
||||
<dd>[[object.resourceType]]</dd>
|
||||
<dt>Resource Id</dt>
|
||||
<dd>[[object.resourceId]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="g-6">
|
||||
|
||||
<template is="dom-if" if="[[object.version]]" restamp="true">
|
||||
<dl class="g-dl">
|
||||
<dt>Created</dt>
|
||||
<dd>[[_formatDate(object.version.created)]]</dd>
|
||||
<dt>Updated</dt>
|
||||
<dd>[[_formatDate(object.version.updated)]]</dd>
|
||||
<dt>CreatedBy</dt>
|
||||
<dd>[[object.version.createdBy]]</dd>
|
||||
<dt>Deleted</dt>
|
||||
<dd>[[object.version.deleted]]</dd>
|
||||
<dt>Version</dt>
|
||||
<dd>[[object.version.version]]</dd>
|
||||
</dl>
|
||||
</template>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- parameters -->
|
||||
<section name="parameters">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.parameterBags)]]">
|
||||
<p class="g-center">No parameters defined on [[object.objectType]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.parameterBags)]]">
|
||||
|
||||
<div class="g-row g-pt-2">
|
||||
<div class="g-2"><b>ParameterBag</b></div>
|
||||
<div class="g-2"><b>Parameter Id</b></div>
|
||||
<div class="g-2"><b>Name</b></div>
|
||||
<div class="g-2"><b>Interpretation</b></div>
|
||||
<div class="g-1"><b>UOM</b></div>
|
||||
<div class="g-1"><b>Type</b></div>
|
||||
<div class="g-2"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat"
|
||||
items="{{_asArray(object.parameterBags)}}"
|
||||
as="bag">
|
||||
<template is="dom-repeat"
|
||||
items="{{_asArray(bag.value.parameters)}}"
|
||||
as="param">
|
||||
|
||||
<div class="g-row">
|
||||
<div class="g-2 cell">[[bag.value.id]]</div>
|
||||
<div class="g-2 cell">[[param.value.id]]</div>
|
||||
<div class="g-2 cell">[[param.value.name]]</div>
|
||||
<div class="g-2 cell">[[param.value.interpretation]]</div>
|
||||
<div class="g-1 cell">[[param.value.uom]]</div>
|
||||
<div class="g-1 cell">[[param.value.type]]</div>
|
||||
<div class="g-2 cell">[[param.value.value]]</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- policies -->
|
||||
<section name="policies">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-m-4 g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.policies)]]">
|
||||
<p class="g-pt-4 g-center">No policies defined on [[objectName]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.policies)]]">
|
||||
|
||||
<div class="g-row g-pt-2 data-list">
|
||||
<div class="g-6"><b>Type</b></div>
|
||||
<div class="g-6"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="{{_asArray(object.policies)}}" as="policy">
|
||||
<div class="g-row data-list">
|
||||
<div class="g-6 cell">[[policy.key]]</div>
|
||||
<div class="g-6 g-pl-2 cell">[[policy.value]]</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
|
||||
<!-- timedstates -->
|
||||
<template is="dom-if" if="[[_isResource(object.objectType)]]">
|
||||
<section name="timedstates">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-if" if="[[_isEmpty(object.timedStates)]]">
|
||||
<p class="g-pt-4 g-center">No timed states defined on [[objectName]]
|
||||
[[object.id]]</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[_isNotEmpty(object.timedStates)]]">
|
||||
<template is="dom-repeat"
|
||||
items="[[_asArray(object.timedStates)]]"
|
||||
as="timedState">
|
||||
|
||||
<div class="g-row g-pt-2">
|
||||
<div class="g-4"><b>Id</b> [[timedState.value.id]]</div>
|
||||
<div class="g-4"><b>Name</b> [[timedState.value.name]]</div>
|
||||
<div class="g-4"><b>Type</b> [[timedState.value.type]]</div>
|
||||
</div>
|
||||
|
||||
<div class="g-row g-pt-4 data-list">
|
||||
<div class="g-6"><b>Time</b></div>
|
||||
<div class="g-6"><b>Value</b></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat"
|
||||
items="[[timedState.value.values]]"
|
||||
as="timedStateValue">
|
||||
<div class="g-row data-list">
|
||||
<div class="g-6 cell">[[timedStateValue.time]]</div>
|
||||
<div class="g-6 g-pl-2 cell">[[timedStateValue.value]]</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
||||
</template>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<!-- activity children -->
|
||||
<template is="dom-if" if="[[_isActivity(object.objectType)]]">
|
||||
<section name="elements">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
|
||||
<template is="dom-repeat" items="[[object.elements]]" as="childElement">
|
||||
<strolch-wc-inspector-object base-path="[[basePath]]"
|
||||
realm="[[realm]]"
|
||||
object="[[childElement]]"
|
||||
class="g-m-2"></strolch-wc-inspector-object>
|
||||
</template>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
<!-- model -->
|
||||
<template is="dom-if" if="[[isRootElement]]">
|
||||
<section name="model">
|
||||
<template is="dom-if" if="[[!object]]">
|
||||
<p class="g-center">Loading...</p>
|
||||
</template>
|
||||
<template is="dom-if" if="[[object]]">
|
||||
<textarea value="{{model::input}}"></textarea>
|
||||
|
||||
<div class="g-mt-3">
|
||||
<paper-radio-group selected="{{modelType}}" style="font-size: small">
|
||||
<paper-radio-button name="xml">XML</paper-radio-button>
|
||||
<paper-radio-button name="json">JSON</paper-radio-button>
|
||||
<paper-radio-button name="json-flat">JSON Flat</paper-radio-button>
|
||||
</paper-radio-group>
|
||||
|
||||
<paper-button raised class="g-pull-right" on-tap="_saveModel">Save
|
||||
</paper-button>
|
||||
<paper-button class="g-pull-right" on-tap="_removeModel">Remove
|
||||
</paper-button>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
</iron-pages>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
</div>
|
||||
|
||||
</paper-material>
|
||||
|
||||
|
||||
<iron-ajax id="ajax"
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@
|
|||
<link rel="import" href="../strolch-wc-styles/strolch-wc-styles.html">
|
||||
|
||||
<link rel="import" href="strolch-wc-inspector-behavior.html">
|
||||
<link rel="import" href="strolch-wc-inspector-paging-behavior.html">
|
||||
<link rel="import" href="strolch-wc-inspector-object.html">
|
||||
|
||||
<dom-module id="strolch-wc-inspector-objects">
|
||||
|
|
@ -163,8 +164,9 @@
|
|||
|
||||
<div class="g-row">
|
||||
<div class="g-12">
|
||||
<template is="dom-repeat" items="[[objects.data]]">
|
||||
<strolch-wc-inspector-object base-path="[[basePath]]"
|
||||
<template is="dom-repeat" items="[[dataObj.data]]">
|
||||
<strolch-wc-inspector-object class="g-ml-3 g-mr-3 g-mt-4"
|
||||
base-path="[[basePath]]"
|
||||
realm="[[realm]]"
|
||||
is-root-element="true"
|
||||
on-strolch-wc-obj-remove="onRemoveElement"
|
||||
|
|
@ -174,7 +176,7 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="g-row g-mb-1">
|
||||
<div class="g-row g-mt-3 g-mb-1">
|
||||
<div class="g-3 g-pt-3 g-pl-4">
|
||||
<paper-button on-tap="_toggleAllSelected" raised>
|
||||
<template is="dom-if" if="[[allSelected]]">Select None</template>
|
||||
|
|
@ -189,13 +191,15 @@
|
|||
<div class="g-m-2 g-center">
|
||||
<paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button>
|
||||
<paper-icon-button icon="chevron-left" on-tap="_toPreviousPage"></paper-icon-button>
|
||||
<span>[[objects.offset]] to [[_getEnd(objects)]] of [[objects.size]]</span>
|
||||
<span>[[dataObj.offset]] to [[_getEnd(dataObj)]] of [[dataObj.size]] ([[dataObj.dataSetSize]])</span>
|
||||
<paper-icon-button icon="chevron-right" on-tap="_toNextPage"></paper-icon-button>
|
||||
<paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="g-3">
|
||||
|
||||
<paper-button on-tap="_setLimit">10</paper-button>
|
||||
<paper-button on-tap="_setLimit">50</paper-button>
|
||||
<paper-button on-tap="_setLimit">100</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -227,7 +231,8 @@
|
|||
is: 'strolch-wc-inspector-objects',
|
||||
|
||||
behaviors: [
|
||||
StrolchInspectorBehavior
|
||||
StrolchInspectorBehavior,
|
||||
StrolchInspectorPagingBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
|
@ -269,24 +274,6 @@
|
|||
return null;
|
||||
}
|
||||
},
|
||||
objects: {
|
||||
type: Object,
|
||||
value: function () {
|
||||
return null;
|
||||
}
|
||||
},
|
||||
offset: {
|
||||
type: Number,
|
||||
value: function () {
|
||||
return 0;
|
||||
}
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
value: function () {
|
||||
return 20;
|
||||
}
|
||||
},
|
||||
|
||||
allSelected: {
|
||||
type: Boolean,
|
||||
|
|
@ -324,8 +311,8 @@
|
|||
}
|
||||
|
||||
this.debounce("doSearch", function () {
|
||||
this.offset = 0;
|
||||
this.reloadTypeDetails();
|
||||
this.dataObj.offset = 0;
|
||||
this.queryPage();
|
||||
}, 500);
|
||||
},
|
||||
|
||||
|
|
@ -333,7 +320,7 @@
|
|||
this.selectedType = null;
|
||||
this.section = 'typesSummary';
|
||||
this.selectedType = null;
|
||||
this.objects = null;
|
||||
this.dataObj.data = null;
|
||||
},
|
||||
|
||||
_noElements: function (objectSummaries) {
|
||||
|
|
@ -341,7 +328,7 @@
|
|||
},
|
||||
|
||||
_showTypeDetails: function (evt) {
|
||||
this.offset = 0;
|
||||
this.dataObj.offset = 0;
|
||||
this.selectType(evt.model.item.type);
|
||||
},
|
||||
|
||||
|
|
@ -349,23 +336,23 @@
|
|||
var typeChanged = this.selectedType != type;
|
||||
this.selectedType = type;
|
||||
this.section = type == null ? 'typesSummary' : 'typeDetails';
|
||||
this.objects = null;
|
||||
this.dataObj.data = null;
|
||||
console.log('Showing type ' + this.selectedType);
|
||||
Strolch.setQueryParamValue('type', this.selectedType);
|
||||
if (this.selectedType == null) {
|
||||
this.offset = 0;
|
||||
this.dataObj.offset = 0;
|
||||
} else {
|
||||
if (typeChanged) {
|
||||
this.offset = 0;
|
||||
this.dataObj.offset = 0;
|
||||
}
|
||||
this.reloadTypeDetails();
|
||||
this.queryPage();
|
||||
}
|
||||
},
|
||||
|
||||
_closeTypeDetails: function () {
|
||||
this.section = 'typesSummary';
|
||||
this.selectedType = null;
|
||||
this.objects = null;
|
||||
this.dataObj.data = null;
|
||||
Strolch.setQueryParamValue('type', null);
|
||||
},
|
||||
|
||||
|
|
@ -381,35 +368,6 @@
|
|||
}
|
||||
},
|
||||
|
||||
_hasNext: function (objects) {
|
||||
return objects != null && objects.nextOffset > objects.offset;
|
||||
},
|
||||
_hasPrevious: function (objects) {
|
||||
return objects != null && objects.previousOffset < objects.offset;
|
||||
},
|
||||
|
||||
_getEnd: function (objects) {
|
||||
if (this._hasNext(objects)) return objects.nextOffset;
|
||||
return objects == null ? 0 : objects.size;
|
||||
},
|
||||
|
||||
_toFirstPage: function () {
|
||||
this.offset = 0;
|
||||
this.reloadTypeDetails();
|
||||
},
|
||||
_toPreviousPage: function () {
|
||||
this.offset = this.objects.previousOffset;
|
||||
this.reloadTypeDetails();
|
||||
},
|
||||
_toNextPage: function () {
|
||||
this.offset = this.objects.nextOffset;
|
||||
this.reloadTypeDetails(this.objects.nextOffset);
|
||||
},
|
||||
_toLastPage: function () {
|
||||
this.offset = this.objects.lastOffset;
|
||||
this.reloadTypeDetails(this.objects.lastOffset);
|
||||
},
|
||||
|
||||
onImportTapped: function (event) {
|
||||
this.set('importDlgTitle', 'Import Elements as XML');
|
||||
this.importType = 'import';
|
||||
|
|
@ -450,14 +408,14 @@
|
|||
var select = !this.allSelected;
|
||||
console.log(select ? 'Selecting ALL' : 'Selecting NONE');
|
||||
this.set('selectedObjectIds', []);
|
||||
for (var i = 0; i < this.objects.data.length; i++) {
|
||||
var path = 'objects.data.' + i + '._checked';
|
||||
for (var i = 0; i < this.dataObj.data.length; i++) {
|
||||
var path = 'dataObj.data.' + i + '._checked';
|
||||
this.set(path, !select);
|
||||
this.set(path, select);
|
||||
console.log('Set path ' + path + ' = ' + select);
|
||||
|
||||
if (select) {
|
||||
var object = this.objects.data[i];
|
||||
var object = this.dataObj.data[i];
|
||||
this.push('selectedObjectIds', object.id);
|
||||
console.log('Added ' + object.id + ' as selected');
|
||||
}
|
||||
|
|
@ -482,7 +440,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
this.set('allSelected', this.selectedObjectIds.length == this.objects.data.length);
|
||||
this.set('allSelected', this.selectedObjectIds.length == this.dataObj.data.length);
|
||||
console.log(this.allSelected ? 'All are selected' : 'None or some are selected');
|
||||
},
|
||||
|
||||
|
|
@ -491,26 +449,26 @@
|
|||
|
||||
var id = event.detail.object.id;
|
||||
var index = null;
|
||||
for (var i = 0; i < this.objects.data.length; i++) {
|
||||
if (this.objects.data[i].id == id) {
|
||||
for (var i = 0; i < this.dataObj.data.length; i++) {
|
||||
if (this.dataObj.data[i].id == id) {
|
||||
index = i;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (index != null) {
|
||||
this.splice("objects.data", index, 1);
|
||||
this.splice("dataObj.data", index, 1);
|
||||
}
|
||||
},
|
||||
|
||||
reloadTypeDetails: function () {
|
||||
queryPage: function () {
|
||||
this.dlgTitle = 'Reload failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
this.set('objects', data.detail.response);
|
||||
this.set('dataObj', data.detail.response);
|
||||
};
|
||||
|
||||
var url = this.basePath + 'rest/strolch/inspector/' + this.realm + '/' + this._typeSubPath(this.objectType) + '/' + this.selectedType;
|
||||
url += '?offset=' + this.offset + '&limit=' + this.limit + "&orderBy=id&query=" + encodeURIComponent(this.searchTerm) + '&overview=true';
|
||||
url += '?offset=' + this.dataObj.offset + '&limit=' + this.dataObj.limit + "&orderBy=id&query=" + encodeURIComponent(this.searchTerm) + '&overview=true';
|
||||
|
||||
this.$.ajax.url = url;
|
||||
this.$.ajax.method = 'GET';
|
||||
|
|
@ -541,10 +499,10 @@
|
|||
|
||||
this.dlgTitle = 'Remove elements failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
this.set('objects', null);
|
||||
this.set('this.dataObj.data = null;.data', null);
|
||||
this.set('selectedObjectIds', []);
|
||||
this.set('allSelected', false);
|
||||
this.reloadTypeDetails();
|
||||
this.queryPage();
|
||||
};
|
||||
|
||||
this.$.ajax.url = this.basePath + 'rest/strolch/inspector/' + this.realm + '/' + this._typeSubPath(this.objectType) + '/' + this.selectedType;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,71 @@
|
|||
<script>
|
||||
StrolchInspectorPagingBehavior = {
|
||||
|
||||
properties: {
|
||||
dataObj: {
|
||||
type: Object,
|
||||
value: {
|
||||
data: null,
|
||||
offset: 0,
|
||||
limit: 20,
|
||||
dataSetSize: 0,
|
||||
descending: true,
|
||||
sortBy: 'id',
|
||||
size: 0,
|
||||
nextOffset: 0,
|
||||
previousOffset: 0,
|
||||
lastOffset: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
_getDefaultObj: function () {
|
||||
return {
|
||||
data: null,
|
||||
offset: 0,
|
||||
limit: 20,
|
||||
dataSetSize: 0,
|
||||
descending: true,
|
||||
sortBy: 'id',
|
||||
size: 0,
|
||||
nextOffset: 0,
|
||||
previousOffset: 0,
|
||||
lastOffset: 0
|
||||
}
|
||||
},
|
||||
|
||||
_hasNext: function (dataObj) {
|
||||
return dataObj != null && dataObj.nextOffset > dataObj.offset;
|
||||
},
|
||||
_hasPrevious: function (dataObj) {
|
||||
return dataObj != null && dataObj.previousOffset < dataObj.offset;
|
||||
},
|
||||
|
||||
_getEnd: function (dataObj) {
|
||||
if (this._hasNext(dataObj)) return dataObj.nextOffset;
|
||||
return dataObj == null ? 0 : dataObj.size;
|
||||
},
|
||||
|
||||
_setLimit: function (e) {
|
||||
this.dataObj.limit = parseInt(e.target.textContent.trim());
|
||||
this.queryPage();
|
||||
},
|
||||
|
||||
_toFirstPage: function () {
|
||||
this.dataObj.offset = 0;
|
||||
this.queryPage();
|
||||
},
|
||||
_toPreviousPage: function () {
|
||||
this.dataObj.offset = this.dataObj.previousOffset;
|
||||
this.queryPage();
|
||||
},
|
||||
_toNextPage: function () {
|
||||
this.dataObj.offset = this.dataObj.nextOffset;
|
||||
this.queryPage();
|
||||
},
|
||||
_toLastPage: function () {
|
||||
this.dataObj.offset = this.dataObj.lastOffset;
|
||||
this.queryPage();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -21,6 +21,7 @@
|
|||
<link rel="import" href="../strolch-wc-styles/strolch-wc-styles.html">
|
||||
|
||||
<link rel="import" href="strolch-wc-inspector-behavior.html">
|
||||
<link rel="import" href="strolch-wc-inspector-paging-behavior.html">
|
||||
|
||||
<dom-module id="strolch-wc-operations-log">
|
||||
|
||||
|
|
@ -139,7 +140,7 @@
|
|||
<paper-icon-button class="g-pull-right"
|
||||
icon="refresh"
|
||||
title="Refresh"
|
||||
on-tap="reloadOperationsLog"></paper-icon-button>
|
||||
on-tap="queryPage"></paper-icon-button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -166,7 +167,7 @@
|
|||
<div class="g-1"></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="[[operationsLog.data]]" as="log">
|
||||
<template is="dom-repeat" items="[[dataObj.data]]" as="log">
|
||||
|
||||
<hr />
|
||||
|
||||
|
|
@ -192,15 +193,21 @@
|
|||
</template>
|
||||
|
||||
<div class="g-row">
|
||||
<div class="g-12">
|
||||
<div class="g-3"></div>
|
||||
<div class="g-6">
|
||||
<div class="g-m-2 g-center">
|
||||
<paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button>
|
||||
<paper-icon-button icon="chevron-left" on-tap="_toPreviousPage"></paper-icon-button>
|
||||
<span>[[operationsLog.offset]] to [[_getEnd(operationsLog)]] of [[operationsLog.size]]</span>
|
||||
<span>[[dataObj.offset]] to [[_getEnd(dataObj)]] of [[dataObj.size]] ([[dataObj.dataSetSize]])</span>
|
||||
<paper-icon-button icon="chevron-right" on-tap="_toNextPage"></paper-icon-button>
|
||||
<paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="g-3">
|
||||
<paper-button on-tap="_setLimit">10</paper-button>
|
||||
<paper-button on-tap="_setLimit">50</paper-button>
|
||||
<paper-button on-tap="_setLimit">100</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
|
@ -242,7 +249,8 @@
|
|||
is: 'strolch-wc-operations-log',
|
||||
|
||||
behaviors: [
|
||||
StrolchInspectorBehavior
|
||||
StrolchInspectorBehavior,
|
||||
StrolchInspectorPagingBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
|
@ -306,7 +314,7 @@
|
|||
cancel: "Cancel",
|
||||
|
||||
formatDate: function (datetime) {
|
||||
if (typeof(datetime) == 'string') {
|
||||
if (typeof (datetime) == 'string') {
|
||||
datetime = new Date(datetime);
|
||||
}
|
||||
|
||||
|
|
@ -331,45 +339,9 @@
|
|||
return monthName + " " + fullYear;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
operationsLog: {
|
||||
type: Object
|
||||
},
|
||||
offset: {
|
||||
type: Number,
|
||||
value: 0
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
value: 100
|
||||
}
|
||||
},
|
||||
|
||||
_hasNext: function (objects) {
|
||||
return objects != null && objects.nextOffset > objects.offset;
|
||||
},
|
||||
_getEnd: function (objects) {
|
||||
if (this._hasNext(objects)) return objects.nextOffset;
|
||||
return objects == null ? 0 : objects.size;
|
||||
},
|
||||
_toFirstPage: function () {
|
||||
this.offset = 0;
|
||||
this.reloadOperationsLog();
|
||||
},
|
||||
_toPreviousPage: function () {
|
||||
this.offset = this.operationsLog.previousOffset;
|
||||
this.reloadOperationsLog();
|
||||
},
|
||||
_toNextPage: function () {
|
||||
this.offset = this.operationsLog.nextOffset;
|
||||
this.reloadOperationsLog();
|
||||
},
|
||||
_toLastPage: function () {
|
||||
this.offset = this.operationsLog.lastOffset;
|
||||
this.reloadOperationsLog();
|
||||
},
|
||||
|
||||
toLocalDateTime: function (val) {
|
||||
return Strolch.toDateTime(val);
|
||||
},
|
||||
|
|
@ -379,24 +351,24 @@
|
|||
},
|
||||
severityChanged: function (newValue, oldValue) {
|
||||
if (newValue != null)
|
||||
this.reloadOperationsLog();
|
||||
this.queryPage();
|
||||
},
|
||||
searchTermChanged: function (newValue, oldValue) {
|
||||
if (newValue != null)
|
||||
this.reloadOperationsLog();
|
||||
this.queryPage();
|
||||
},
|
||||
fromChanged: function (newValue, oldValue) {
|
||||
if (newValue != null)
|
||||
this.reloadOperationsLog();
|
||||
this.queryPage();
|
||||
},
|
||||
toChanged: function (newValue, oldValue) {
|
||||
if (newValue != null)
|
||||
this.reloadOperationsLog();
|
||||
this.queryPage();
|
||||
},
|
||||
realmChanged: function (newValue, oldValue) {
|
||||
if (newValue != null) {
|
||||
Strolch.setQueryParamValue('realm', newValue);
|
||||
this.reloadOperationsLog();
|
||||
this.queryPage();
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -423,16 +395,14 @@
|
|||
this.searchTerm = '';
|
||||
},
|
||||
|
||||
reloadOperationsLog: function () {
|
||||
queryPage: function () {
|
||||
if (this.realms == null) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.dlgTitle = 'Fetching log failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
this.operationsLog = data.detail.response;
|
||||
this.offset = this.operationsLog.offset;
|
||||
this.limit = this.operationsLog.limit;
|
||||
this.dataObj = data.detail.response;
|
||||
};
|
||||
|
||||
this.$.ajax.url = this.basePath + 'rest/strolch/operations-log/' + this.selectedRealm;
|
||||
|
|
@ -443,8 +413,8 @@
|
|||
from: this.from,
|
||||
to: this.to,
|
||||
query: this.searchTerm,
|
||||
offset: this.offset,
|
||||
limit: this.limit
|
||||
offset: this.dataObj.offset,
|
||||
limit: this.dataObj.limit
|
||||
};
|
||||
this.$.ajax.generateRequest();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -41,11 +41,12 @@
|
|||
|
||||
.content {
|
||||
border-top: 1px black solid;
|
||||
background: #eeeeee;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<paper-material elevation="1">
|
||||
<paper-material elevation="2">
|
||||
<h3 class="g-m-3 g-pt-2 g-pl-2 g-pr-2" on-tap="_toggleOpened">
|
||||
<template is="dom-if" if="[[!opened]]">
|
||||
<paper-icon-button icon="arrow-drop-down"></paper-icon-button>
|
||||
|
|
|
|||
|
|
@ -113,6 +113,12 @@
|
|||
},
|
||||
roleName: {
|
||||
type: String
|
||||
},
|
||||
propagateShowDialog: {
|
||||
type: Boolean,
|
||||
value: function () {
|
||||
return false
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -120,7 +126,11 @@
|
|||
"strolch-show-dialog": "onShowDialog"
|
||||
},
|
||||
onShowDialog: function (event) {
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
if (!this.propagateShowDialog) {
|
||||
event.cancelBubble = true;
|
||||
event.stopPropagation();
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
}
|
||||
},
|
||||
showError: function (title, text) {
|
||||
this.dlgTitle = title;
|
||||
|
|
|
|||
|
|
@ -16,8 +16,10 @@
|
|||
<link rel="import" href="../paper-tabs/paper-tabs.html">
|
||||
|
||||
<link rel="import" href="../strolch-wc-styles/strolch-wc-styles.html">
|
||||
<link rel="import" href="../strolch-wc-debounced-input/strolch-wc-debounced-input.html">
|
||||
|
||||
<link rel="import" href="strolch-wc-inspector-behavior.html">
|
||||
<link rel="import" href="strolch-wc-inspector-paging-behavior.html">
|
||||
|
||||
<dom-module id="strolch-wc-sessions">
|
||||
|
||||
|
|
@ -39,11 +41,26 @@
|
|||
padding: 0.3em;
|
||||
}
|
||||
|
||||
strolch-wc-debounced-input {
|
||||
max-width: 200px;
|
||||
display: inline-flex;
|
||||
|
||||
--regular-color: #919191;
|
||||
--focus-color: #000000;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div class="g-row g-pt-4">
|
||||
<div class="g-12 g-right">
|
||||
<paper-icon-button icon="refresh" title="Refresh" on-tap="reload"></paper-icon-button>
|
||||
<div class="g-12">
|
||||
<paper-icon-button class="g-pull-right"
|
||||
icon="refresh"
|
||||
title="Refresh"
|
||||
on-tap="reload"></paper-icon-button>
|
||||
<strolch-wc-debounced-input id="debouncedInput"
|
||||
class="g-pull-right"
|
||||
debounced-input="{{searchTerm}}"
|
||||
disabled="[[arrayFilled(filters)]]"></strolch-wc-debounced-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -62,7 +79,7 @@
|
|||
<div class="g-1"></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="[[sessions]]">
|
||||
<template is="dom-repeat" items="[[dataObj.data]]">
|
||||
|
||||
<hr />
|
||||
|
||||
|
|
@ -85,6 +102,25 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div class="g-row">
|
||||
<div class="g-3">
|
||||
</div>
|
||||
<div class="g-6">
|
||||
<div class="g-m-2 g-center">
|
||||
<paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button>
|
||||
<paper-icon-button icon="chevron-left" on-tap="_toPreviousPage"></paper-icon-button>
|
||||
<span>[[dataObj.offset]] to [[_getEnd(dataObj)]] of [[dataObj.size]] ([[dataObj.dataSetSize]])</span>
|
||||
<paper-icon-button icon="chevron-right" on-tap="_toNextPage"></paper-icon-button>
|
||||
<paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="g-3">
|
||||
<paper-button on-tap="_setLimit">10</paper-button>
|
||||
<paper-button on-tap="_setLimit">50</paper-button>
|
||||
<paper-button on-tap="_setLimit">100</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</paper-material>
|
||||
|
||||
<paper-dialog id="dlg" modal>
|
||||
|
|
@ -110,12 +146,23 @@
|
|||
is: 'strolch-wc-sessions',
|
||||
|
||||
behaviors: [
|
||||
StrolchInspectorBehavior
|
||||
StrolchInspectorBehavior,
|
||||
StrolchInspectorPagingBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
sessions: {
|
||||
type: Array
|
||||
},
|
||||
searchTerm: {
|
||||
type: String,
|
||||
observer: 'searchTermChanged'
|
||||
},
|
||||
propagateShowDialog: {
|
||||
type: Boolean,
|
||||
value: function () {
|
||||
return false
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -140,7 +187,11 @@
|
|||
"strolch-show-dialog": "onShowDialog"
|
||||
},
|
||||
onShowDialog: function (event) {
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
if (!this.propagateShowDialog) {
|
||||
event.cancelBubble = true;
|
||||
event.stopPropagation();
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
}
|
||||
},
|
||||
showError: function (title, text) {
|
||||
this.dlgTitle = title;
|
||||
|
|
@ -149,19 +200,35 @@
|
|||
this.$.dlg.open();
|
||||
},
|
||||
|
||||
searchTermChanged: function (newValue, oldValue) {
|
||||
if (newValue != null && oldValue != null) {
|
||||
this.queryPage();
|
||||
}
|
||||
},
|
||||
|
||||
ready: function () {
|
||||
//
|
||||
},
|
||||
|
||||
reload: function () {
|
||||
this.queryPage();
|
||||
},
|
||||
|
||||
queryPage: function () {
|
||||
|
||||
this.dlgTitle = 'Sessions query failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
this.sessions = data.detail.response;
|
||||
this.dataObj = data.detail.response;
|
||||
};
|
||||
|
||||
this.$.ajax.url = this.basePath + 'rest/strolch/sessions';
|
||||
this.$.ajax.method = 'GET';
|
||||
this.$.ajax.params = {
|
||||
query: this.searchTerm,
|
||||
offset: this.dataObj.offset,
|
||||
limit: this.dataObj.limit,
|
||||
orderBy: 'username'
|
||||
};
|
||||
this.$.ajax.generateRequest();
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -19,8 +19,10 @@
|
|||
<link rel="import" href="../paper-tabs/paper-tabs.html">
|
||||
|
||||
<link rel="import" href="../strolch-wc-styles/strolch-wc-styles.html">
|
||||
<link rel="import" href="../strolch-wc-debounced-input/strolch-wc-debounced-input.html">
|
||||
|
||||
<link rel="import" href="strolch-wc-inspector-behavior.html">
|
||||
<link rel="import" href="strolch-wc-inspector-paging-behavior.html">
|
||||
|
||||
<dom-module id="strolch-wc-users">
|
||||
|
||||
|
|
@ -46,12 +48,27 @@
|
|||
padding: 0.3em;
|
||||
}
|
||||
|
||||
strolch-wc-debounced-input {
|
||||
max-width: 200px;
|
||||
display: inline-flex;
|
||||
|
||||
--regular-color: #919191;
|
||||
--focus-color: #000000;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<div class="g-row g-pt-4">
|
||||
<div class="g-12 g-right">
|
||||
<paper-button on-tap="_addUser" raised>Add</paper-button>
|
||||
<paper-icon-button icon="refresh" title="Refresh" on-tap="reload"></paper-icon-button>
|
||||
<div class="g-12">
|
||||
<paper-icon-button class="g-pull-right"
|
||||
icon="refresh"
|
||||
title="Refresh"
|
||||
on-tap="reload"></paper-icon-button>
|
||||
<paper-button class="g-pull-right" on-tap="_addUser" raised>Add</paper-button>
|
||||
<strolch-wc-debounced-input id="debouncedInput"
|
||||
class="g-pull-right"
|
||||
debounced-input="{{searchTerm}}"
|
||||
disabled="[[arrayFilled(filters)]]"></strolch-wc-debounced-input>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
@ -70,7 +87,7 @@
|
|||
<div class="g-2"></div>
|
||||
</div>
|
||||
|
||||
<template is="dom-repeat" items="[[users]]">
|
||||
<template is="dom-repeat" items="[[dataObj.data]]">
|
||||
|
||||
<hr />
|
||||
|
||||
|
|
@ -95,6 +112,26 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="g-row">
|
||||
<div class="g-3">
|
||||
</div>
|
||||
<div class="g-6">
|
||||
<div class="g-m-2 g-center">
|
||||
<paper-icon-button icon="first-page" on-tap="_toFirstPage"></paper-icon-button>
|
||||
<paper-icon-button icon="chevron-left" on-tap="_toPreviousPage"></paper-icon-button>
|
||||
<span>[[dataObj.offset]] to [[_getEnd(dataObj)]] of [[dataObj.size]] ([[dataObj.dataSetSize]])</span>
|
||||
<paper-icon-button icon="chevron-right" on-tap="_toNextPage"></paper-icon-button>
|
||||
<paper-icon-button icon="last-page" on-tap="_toLastPage"></paper-icon-button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="g-3">
|
||||
<paper-button on-tap="_setLimit">10</paper-button>
|
||||
<paper-button on-tap="_setLimit">50</paper-button>
|
||||
<paper-button on-tap="_setLimit">100</paper-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</paper-material>
|
||||
|
||||
<paper-dialog id="dlg" modal>
|
||||
|
|
@ -157,7 +194,7 @@
|
|||
|
||||
</div>
|
||||
|
||||
<div class="g-6 g-p-4">
|
||||
<div class="g-6 g-p-4" style="max-height: 360px; overflow:auto;">
|
||||
Roles:
|
||||
<paper-listbox always-float-label
|
||||
label="Roles"
|
||||
|
|
@ -173,7 +210,7 @@
|
|||
</div>
|
||||
|
||||
<div class="g-row g-m-0">
|
||||
<div class="g-12 g-pr-4 g-pl-4">
|
||||
<div class="g-12 g-pr-4 g-pl-4"style="max-height: 150px; overflow:auto;">
|
||||
Properties:
|
||||
<template is="dom-repeat" items="[[user.properties]]" as="property">
|
||||
<div class="g-row">
|
||||
|
|
@ -216,7 +253,8 @@
|
|||
is: 'strolch-wc-users',
|
||||
|
||||
behaviors: [
|
||||
StrolchInspectorBehavior
|
||||
StrolchInspectorBehavior,
|
||||
StrolchInspectorPagingBehavior
|
||||
],
|
||||
|
||||
properties: {
|
||||
|
|
@ -232,6 +270,16 @@
|
|||
selectedRoles: {
|
||||
type: Array,
|
||||
value: []
|
||||
},
|
||||
searchTerm: {
|
||||
type: String,
|
||||
observer: 'searchTermChanged'
|
||||
},
|
||||
propagateShowDialog: {
|
||||
type: Boolean,
|
||||
value: function () {
|
||||
return false
|
||||
}
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -243,7 +291,11 @@
|
|||
"strolch-show-dialog": "onShowDialog"
|
||||
},
|
||||
onShowDialog: function (event) {
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
if (!this.propagateShowDialog) {
|
||||
event.cancelBubble = true;
|
||||
event.stopPropagation();
|
||||
this.showError(event.detail.title, event.detail.text);
|
||||
}
|
||||
},
|
||||
showError: function (title, text) {
|
||||
this.dlgTitle = title;
|
||||
|
|
@ -252,15 +304,25 @@
|
|||
this.$.dlg.open();
|
||||
},
|
||||
|
||||
searchTermChanged: function (newValue, oldValue) {
|
||||
if (newValue != null && oldValue != null) {
|
||||
this.queryPage();
|
||||
}
|
||||
},
|
||||
|
||||
ready: function () {
|
||||
//
|
||||
},
|
||||
|
||||
reload: function () {
|
||||
this.queryPage();
|
||||
},
|
||||
|
||||
queryPage: function () {
|
||||
|
||||
this.dlgTitle = 'User query failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
this.users = data.detail.response;
|
||||
this.dataObj = data.detail.response;
|
||||
|
||||
this.dlgTitle = 'Role query failed';
|
||||
this._handleAjaxResponse = function (data) {
|
||||
|
|
@ -278,6 +340,12 @@
|
|||
|
||||
this.$.ajax.url = this.basePath + 'rest/strolch/privilege/users';
|
||||
this.$.ajax.method = 'GET';
|
||||
this.$.ajax.params = {
|
||||
query: this.searchTerm,
|
||||
offset: this.dataObj.offset,
|
||||
limit: this.dataObj.limit,
|
||||
orderBy: 'username'
|
||||
};
|
||||
this.$.ajax.generateRequest();
|
||||
},
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue