Merge from ECOMP's repository
[vid.git] / vid-app-common / src / main / webapp / app / vid / scripts / modals / vf-module-homing-data-action / vf-module-homing-data-action.html
1 <link rel="stylesheet" type="text/css" href="app/vid/styles/buttons.css"/>
2 <link rel="stylesheet" type="text/css" href="app/vid/styles/modals.css"/>
3 <link rel="stylesheet" type="text/css" href="app/vid/styles/networkNode.css"/>
4     <link rel="stylesheet" type="text/css" href="app/vid/scripts/modals/vf-module-homing-data-action/vf-module-homing-data-action.css"/>
5
6 <div class="modal-header">
7     <span class="title" data-tests-id="modalTitle">{{action}} VF-Module</span>
8     <span class="top-btn sprite modal-x" data-ng-click="cancel()"></span>
9 </div>
10
11 <form name="regionSectionForm" class="region-section" novalidate data-ng-class="{'is-loading': !lcpAndTenant && !isHomingData}">
12     <div class="modal-body" id="modal-body">
13         <div class="user-explanation">
14             <span data-ng-if="isSoftDeleteEnabled">
15                 <h4>Please select from the following options for {{vfModuleName}}:</h4>
16                 <b>Delete</b>: Permanently delete the VF-Module and its assignments.<br>
17                 <b>Soft-Delete</b>: Delete the VF-Module from the cloud but retain all its assignments.
18                 This will allow you to rebuild the same VF-module later on by clicking the Resume button.
19             </span>
20             <span data-ng-if="!isSoftDeleteEnabled && !isResumeEnabled">
21                 Are you sure you want to permanently delete this VF-Module ({{vfModuleName}})?
22             </span>
23             <span data-ng-if="isResumeEnabled && isHomingData">
24                  Are you sure you would like to resume instantiation of ({{vfModuleName}})?
25             </span>
26         </div>
27
28         <div class="spinner">
29             <img src="app/vid/images/spinner.gif">
30         </div>
31
32         <div class="region-user-selection"  data-ng-if="!isHomingData">
33             <span data-ng-if="!isResumeEnabled">Please provide the following information as entered on instantiation:</span>
34             <span data-ng-if="isResumeEnabled">Instantiation of the VF module ({{vfModuleName}}) with the same information provided requires the following homing information: </span>
35             <div class="lcp-region field">
36                 <label>LCP Region</label>
37                 <select name="lcp-region" required class="form-item wide"
38                         data-tests-id="lcpRegion" data-ng-model="regionSelection.lcpRegion"
39                         data-ng-change="regionSelection.tenant = null; regionSelection.legacyRegion = null;">
40                     <option class="lcp-region-placeholder" value="" selected>Select LCP Region</option>
41                     <option ng-repeat="option in lcpRegionList" value="{{option.cloudRegionId}}"
42                             data-ng-if="option.isPermitted && !isFeatureFlagCloudOwner">{{option.cloudRegionId}}
43                     </option>
44
45                     <option ng-repeat="option in lcpRegionList" value="{{option.cloudRegionId}}"
46                             data-ng-if="option.isPermitted && isFeatureFlagCloudOwner">
47                         {{option.cloudRegionId}} ({{option.cloudOwner.trim().toUpperCase().replace("ATT-", "")}})
48                     </option>
49                 </select>
50             </div>
51
52             <div class="legacy-region field" data-ng-if="(megaRegion).indexOf(regionSelection.lcpRegion) > -1">
53                 <label>Legacy Region</label>
54                 <input type="text" data-tests-id="lcpRegionText" required data-ng-model="regionSelection.legacyRegion"
55                        placeholder="Enter legacy region">
56             </div>
57
58             <div class="tenant field">
59                 <label>Tenant</label>
60                 <select name="tenant" required class="form-item wide"
61                         data-tests-id="tenant" data-ng-model="regionSelection.tenant">
62                     <option class="tenant-placeholder" value="" selected>Select Tenant Name</option>
63                     <option ng-repeat="option in lcpAndTenant" class="tenantOption" value="{{option.tenantId}}"
64                             data-ng-if="option.isPermitted && option.cloudRegionId === regionSelection.lcpRegion">{{option.tenantName}}
65                     </option>
66                 </select>
67             </div>
68         </div>
69     </div>
70
71     <div class="modal-footer">
72         <button class="soft-delete-btn blue" data-ng-if="isSoftDeleteEnabled" data-tests-id="softDeleteButton"
73                 data-ng-click="softDelete()" ng-disabled="regionSectionForm.$invalid">Soft Delete</button>
74         <button class="delete-resume-btn blue" data-tests-id="confirmResumeDeleteButton" data-ng-click="deleteOrResume()"
75                 ng-disabled="regionSectionForm.$invalid">{{action}}</button>
76         <button class="cancel-btn white" data-tests-id="cancel" data-ng-click="cancel()">Cancel</button>
77     </div>
78 </form>