site-accueil-insa/matomo/plugins/SegmentEditor/angularjs/segment-generator/segmentgenerator.directive.html

<div class="segment-generator">
    <div piwik-activity-indicator loading="segmentGenerator.model.isLoading"></div>

    <div ng-repeat="(conditionIndex,condition) in segmentGenerator.conditions" class="segmentRow{{conditionIndex}}">
        <div class="segment-rows">
            <div ng-repeat="orCondition in condition.orConditions" class="orCondId{{ orCondition.id }}">
                <div class="segment-row">
                    <a ng-click="segmentGenerator.removeOrCondition(condition, orCondition)" class="segment-close"></a>
                    <a href="#" class="segment-loading" ng-show="orCondition.isLoading"></a>
                    <div class="segment-row-inputs valign-wrapper">
                        <div class="segment-input metricListBlock valign-wrapper">
                            <div piwik-field uicontrol="expandable-select" name="segments"
                                 data-title="{{ segmentGenerator.segments[orCondition.segment].name }}"
                                 full-width="true"
                                 style="width: 100%;"
                                 ng-change="segmentGenerator.updateAutocomplete(orCondition)"
                                 ng-model="orCondition.segment"
                                 options="segmentGenerator.segmentList">
                            </div>
                        </div>
                        <div class="segment-input metricMatchBlock valign-wrapper">
                            <div piwik-field uicontrol="select" name="matchType"
                                 style="display: inline-block"
                                 full-width="true"
                                 ng-change="segmentGenerator.updateSegmentDefinition()"
                                 ng-model="orCondition.matches"
                                 options="segmentGenerator.matches[segmentGenerator.segments[orCondition.segment].type]">
                            </div>
                        </div>
                        <div class="segment-input metricValueBlock valign-wrapper">
                            <div class="form-group row" style="width: 100%;">
                                <div class="input-field col s12">
                                    <span role="status" aria-live="polite" class="ui-helper-hidden-accessible"></span>
                                    <input ng-model="orCondition.value" placeholder="Value"
                                           ng-change="segmentGenerator.updateSegmentDefinition()"
                                           type="text" class="autocomplete" title="Value" autocomplete="off">
                                </div>
                            </div>
                        </div>
                        <div class="clear"></div>
                    </div>
                </div>

                <div class="segment-or">{{ 'SegmentEditor_OperatorOR'|translate }}</div>
            </div>

            <div class="segment-add-or" ng-click="segmentGenerator.addNewOrCondition(condition)">
                <div>
                    <a ng-bind-html="'+' + ('SegmentEditor_AddANDorORCondition'|translate:'&lt;span>' + ('SegmentEditor_OperatorOR'|translate) +  '&lt;/span>')"></a>
                </div>
            </div>
        </div>
        <div class="segment-and">{{ 'SegmentEditor_OperatorAND'|translate }}</div>
    </div>

    <div class="segment-add-row initial" ng-click="segmentGenerator.addNewAndCondition()">
        <div>
            <a ng-bind-html="'+' + ('SegmentEditor_AddANDorORCondition'|translate:'&lt;span>' + segmentGenerator.andConditionLabel +  '&lt;/span>')"></a>
        </div>
    </div>
</div>