Initial OpenECOMP Portal commit
[portal.git] / ecomp-portal-FE / client / app / views / functionalMenu / functionalMenu-dialog / menu-details.modal.html
diff --git a/ecomp-portal-FE/client/app/views/functionalMenu/functionalMenu-dialog/menu-details.modal.html b/ecomp-portal-FE/client/app/views/functionalMenu/functionalMenu-dialog/menu-details.modal.html
new file mode 100644 (file)
index 0000000..58588ce
--- /dev/null
@@ -0,0 +1,106 @@
+<!--
+  ================================================================================
+  eCOMP Portal
+  ================================================================================
+  Copyright (C) 2017 AT&T Intellectual Property
+  ================================================================================
+  Licensed under the Apache License, Version 2.0 (the "License");
+  you may not use this file except in compliance with the License.
+  You may obtain a copy of the License at
+  
+       http://www.apache.org/licenses/LICENSE-2.0
+  
+  Unless required by applicable law or agreed to in writing, software
+  distributed under the License is distributed on an "AS IS" BASIS,
+  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  See the License for the specific language governing permissions and
+  limitations under the License.
+  ================================================================================
+  -->
+<div class="functionalMenu-details-modal">
+    <div class="title">{{ngDialogData.title}}</div>
+    <div class="functionalMenu-properties-main" scroll-top="functionalMenuDetails.scrollApi">
+        <form name="functionalMenuForm">
+            <div class="item">
+                <div class="item-label">Parent</div>
+                <input id="input-parent" readonly="readonly" class="input-field"
+                       value="{{functionalMenuDetails.menuLocation}}" type="text" name="menuItem" required/>
+            </div>
+            <div class="item">
+                <div class="item-label">Title</div>
+                <input id="input-title" ng-readonly="!functionalMenuDetails.formEditable ? 'checked':'' "
+                       placeholder="Enter text" class="input-field" ng-model="functionalMenuDetails.menutitle" type="text" name="text"/>
+                <div id="div-error-conflict" class="error-container" ng-show="functionalMenuDetails.conflictMessages.text">
+                    <small id="msg-error-conflict" id="functionalMenuDetails-input-title-conflict"
+                           class="err-message" ng-bind="functionalMenuDetails.conflictMessages.text"></small>
+                </div>
+            </div>
+            <div class="item">
+                <div class="left-item">
+                    <div class="item-label">URL</div>
+                    <input id="input-url" ng-readonly="!functionalMenuDetails.formEditable ? 'checked':'' "
+                           placeholder="http://" class="input-field" ng-model="functionalMenuDetails.menuItem.menu.url" type="url" name="url"/>
+                    <span id="error-url-conflict" class="err-message" ng-show="functionalMenuForm.url.$error.url"> Not valid URL!</span>
+                </div>
+                <div class="right-item">
+                    <div class="item-label">App</div>
+                    <div class="custom-select-wrap" ng-readonly="checked">
+                        <select id="select-app" class="select-field"
+                                ng-model="functionalMenuDetails.selectedApp"
+                                ng-change="functionalMenuDetails.updateSelectedApp(functionalMenuDetails.selectedApp);"
+                                ng-options="app.title for app in functionalMenuDetails.availableApps track by app.index"
+                                ng-disabled="!functionalMenuDetails.availableApps || !functionalMenuDetails.availableApps.length
+                                || !functionalMenuDetails.formEditable"
+                                name="app"
+                                required>
+                            <option value="" >No Application</option>
+                        </select>
+                    </div>
+                </div>
+            </div>
+            <div class="item" ng-show="functionalMenuDetails.displayRoles==true">
+                <div class="item-label">Roles</div>
+                    <dropdown-multiselect id="dropdown-roles" dropdown-title="Select Roles"
+                                          pre-selected="functionalMenuDetails.preSelectedRoles.roles"
+                                          model="functionalMenuDetails.selectedRole"
+                                          options="functionalMenuDetails.availableRoles" source="ngDialogData.source">
+                    </dropdown-multiselect>
+            </div>
+            <div ng-show="functionalMenuDetails.selectedApp && functionalMenuDetails.selectedApp.isDisabled" class="err-message">Application is disabled</div>
+        </form>
+    </div>
+    <div class="dialog-control">
+        <div ng-if="ngDialogData.source!='view'">
+            <span class="ecomp-save-spinner" ng-show="functionalMenuDetails.isSaving"></span>
+            <span ng-if="ngDialogData.source=='edit' && functionalMenuDetails.isLeafMenuItem()">
+                <button class="save-button" id="add-menu-button-save"
+                        ng-show="!functionalMenuDetails.menuItem.menu.url ||
+                        !(functionalMenuDetails.selectedApp.index>0) ||
+                        functionalMenuDetails.displayRoles"
+                        ng-disabled="!functionalMenuForm.text.$valid"
+                        ng-click="functionalMenuDetails.saveChanges()">Save</button>
+                <button class="save-button" id="add-menu-button-continue"
+                        ng-show="!!functionalMenuDetails.menuItem.menu.url &&
+                        functionalMenuDetails.selectedApp.index>0 &&
+                        functionalMenuDetails.menutitle &&
+                        !functionalMenuDetails.displayRoles"
+                        ng-disabled="!functionalMenuForm.url.$valid" ng-click="functionalMenuDetails.continue()">Continue</button>
+            </span>
+            <span ng-if="ngDialogData.source=='add' || (ngDialogData.source=='edit' && !functionalMenuDetails.isLeafMenuItem())">
+                <button id="button-save-add"
+                        class="save-button" ng-show="!functionalMenuDetails.menuItem.menu.url || !(functionalMenuDetails.selectedApp.index>0)
+                || functionalMenuDetails.selectedRole.length>0 || !functionalMenuDetails.menutitle" ng-disabled="!functionalMenuForm.text.$valid || !functionalMenuDetails.menutitle"
+                        ng-click="functionalMenuDetails.saveChanges()">Save</button>
+                <button id="button-save-continue" class="save-button"
+                        ng-show="!!functionalMenuDetails.menuItem.menu.url && functionalMenuDetails.selectedApp.index>0
+                        && functionalMenuDetails.menutitle
+                && !functionalMenuDetails.selectedRole.length>0" ng-disabled="!functionalMenuForm.url.$valid"
+                        ng-click="functionalMenuDetails.continue()">Continue</button>
+            </span>
+            <button id="button-cancel-close-dialog" class="cancel-button" ng-click="closeThisDialog()">Cancel</button>
+        </div>
+        <div ng-if="ngDialogData.source=='view'">
+            <div  id="div-close-dialog"  class="cancel-button" ng-click="closeThisDialog()">Close</div>
+        </div>
+    </div>
+</div>