catalog-ui/src/app/view-models/workspace/tabs/distribution/distribution-view.html

   1 <!--
   2   ~ Copyright (C) 2018 AT&T Intellectual Property. All rights reserved.
   3   ~
   4   ~ Licensed under the Apache License, Version 2.0 (the "License");
   5   ~ you may not use this file except in compliance with the License.
   6   ~ You may obtain a copy of the License at
   7   ~
   8   ~      http://www.apache.org/licenses/LICENSE-2.0
   9   ~
  10   ~ Unless required by applicable law or agreed to in writing, software
  11   ~ distributed under the License is distributed on an "AS IS" BASIS,
  12   ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13   ~ See the License for the specific language governing permissions and
  14   ~ limitations under the License.
  15 -->
  16
  17 <div class="w-sdc-distribution-view">
  18     <div class="w-sdc-distribution-view-header">
  19         <div class="w-sdc-distribution-view-title">DISTRIBUTION <span data-ng-bind="'[' + distributions.length +']'"
  20                                                                       class="blue-font"></span></div>
  21         <div class="header-spacer"></div>
  22         <div class="top-search">
  23             <input type="text"
  24                    style="width: auto;"
  25                    class="search-text"
  26                    data-tests-id="searchTextbox"
  27                    placeholder="Search"
  28                    data-ng-model="searchBind"
  29                    data-tests-id="main-menu-input-search"
  30                    ng-model-options="{ debounce: 500 }"/>
  31             <span class="w-sdc-search-icon magnification"></span>
  32         </div>
  33         <div class="sprite-new refresh-btn" data-tests-id="refreshButton" data-ng-click="initDistributions()" sdc-smart-tooltip=""
  34              title="Refresh"></div>
  35     </div>
  36
  37
  38     <perfect-scrollbar include-padding="true" class="w-sdc-distribution-view-content">
  39         <div class="w-sdc-distribution-view-content-section" data-tests-id="ditributionTable">
  40             <ul>
  41                 <li data-ng-repeat="item in distributions | orderBy: '-timestamp' | filter:searchBind"
  42                     data-ng-init="item.dateFormat = ( item.timestamp | stringToDateFilter | date: 'MM/dd/yyyy h:mma':'UTC' )"
  43                     class="w-sdc-distribute-parent-block" data-tests-id="record_{{$index}}" data-ng-class="{'extends': item.showDetails}">
  44                     <div class="w-sdc-distribute-row w-sdc-distribute-row-extends"
  45                          data-ng-class="{'extends': item.showDetails  && item.distributionComponents.length}">
  46                         <div class="w-sdc-distribution-arrow-btn" data-tests-id="ShowRecordButton_{{$index}}" data-ng-click="showComponents(item); item.showDetails=!item.showDetails"
  47                              data-ng-class="{'extends': item.showDetails}"
  48                              ></div>
  49                         <div class="w-sdc-distribute-row-content">
  50                             <div class="w-sdc-distribute-content">
  51                                 <div class="title-section item-1">
  52                                     <div class="title">Distribution ID</div>
  53                                     <div data-ng-bind="item.distributionID"></div>
  54                                 </div>
  55                                 <div class="title-section item-2">
  56                                     <div class="title" translate="DISTRIBUTION_VIEW_TITLE_USER_ID"></div>
  57                                     <div data-ng-bind="item.userId"></div>
  58                                 </div>
  59                                 <div class="title-section item-3">
  60                                     <div class="title">Time[UTC]:</div>
  61                                     <div
  62                                         data-ng-bind="item.dateFormat"></div>
  63                                 </div>
  64                                 <div class="title-section item-4">
  65                                     <span class="sprite-new status-icon" data-ng-class="item.deployementStatus"></span>
  66                                     <span class="sprite-new" data-ng-bind="item.deployementStatus"></span>
  67                                 </div>
  68                                 <div>
  69                                     <div class="sprite-new distribution-bth item-5"
  70                                          data-ng-class="{'disable':item.deployementStatus==='Deployed'}"
  71                                          data-ng-click="(item.deployementStatus==='Deployed') || markAsDeployed(item)"></div>
  72                                 </div>
  73                             </div>
  74                             <div class="w-sdc-distribute-status-block" data-ng-if="item.statusCount">
  75                                 <div class="status-item-1">Total Artifacts:<span data-ng-bind="(item.statusCount.NOT_NOTIFIED || 0) + (item.statusCount.NOTIFIED || 0) "
  76                                                                        class="blue-font" data-tests-id="totalArtifacts_{{$index}}"></span></div>
  77                                 <div class="status-item-2 " ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'NOTIFIED')">Notified:</sapn><span
  78                                     data-ng-bind="item.statusCount.NOTIFIED || 0" class="blue-font" data-tests-id="notified_{{$index}}"></span></div>
  79
  80                                 <div class="status-item-3 link" ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DOWNLOAD_OK')">Downloaded:</sapn><span
  81                                     data-ng-bind="item.statusCount.DOWNLOAD_OK || 0" class="blue-font" data-tests-id="downloaded_{{$index}}"></span></div>
  82
  83                                 <div class="status-item-4 link"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DEPLOY_OK')">Deployed:</sapn><span
  84                                     data-ng-bind="item.statusCount.DEPLOY_OK || 0" class="blue-font" data-tests-id="deployed_{{$index}}" ></span><span
  85                                     data-ng-class="{'deployed':(item.statusCount.DEPLOY_OK > 0)}"></span></div>
  86                                 <div class="status-item-5 link" ><sapn class="link" data-ng-click="openDisributionStatusModal(item,'NOT_NOTIFIED')">Not Notified:</sapn><span
  87                                     data-ng-bind="item.statusCount.NOT_NOTIFIED || 0" class="blue-font" data-tests-id="NotNotified_{{$index}}"></span></div>
  88                                 <div class="status-item-6"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DEPLOY_ERROR')" >Deploy Errors:</sapn><span
  89                                     data-ng-bind="item.statusCount.DEPLOY_ERROR || 0" class="red-font "></span><span
  90                                     data-ng-class="{'error':(item.statusCount.DEPLOY_ERROR > 0)}" data-tests-id="errors_{{$index}}"></span></div>
  91                                 <div class="status-item-7"><sapn class="link" data-ng-click="openDisributionStatusModal(item,'DOWNLOAD_ERROR')" >Download Errors:</sapn><span
  92                                     data-ng-bind="item.statusCount.DOWNLOAD_ERROR || 0" class="red-font "></span><span
  93                                     data-ng-class="{'error':(item.statusCount.DOWNLOAD_ERROR > 0)}" data-tests-id="errors_{{$index}}"></span></div>
  94                             </div>
  95                         </div>
  96                     </div>
  97
  98                     <ul data-ng-if="item.showDetails && item.distributionComponents.length"
  99                         class="w-sdc-distribute-components-block disable-hover">
 100
 101                         <li data-ng-repeat="(omfComponentID,omfComponentList) in ::item.distributionComponents | orderBy: '-timestamp' | filter:searchBind | groupBy:'omfComponentID' "
 102                             class="disable-hover"
 103                             data-ng-init="statusCount = getStatusCount(omfComponentList);">
 104                             <div class="w-sdc-distribute-row omf-component-row w-sdc-distribute-row-extends"
 105                                  data-ng-class="{'extends': omfComponentListExtends}">
 106                                 <div class="w-sdc-distribution-arrow-btn" data-ng-click="omfComponentListExtends=!omfComponentListExtends"
 107                                      ng-class="{'extends': omfComponentListExtends}"
 108                                      data-ng-init="omfComponentListExtends=false"
 109                                      ></div>
 110                                 <div class="w-sdc-distribute-status-block">
 111                                     <div class="status-item-1">{{omfComponentID}} <span class="blue-font">{{(statusCount.NOT_NOTIFIED || 0) + (statusCount.NOTIFIED || 0) }}</span>
 112                                     </div>
 113                                     <div class="status-item-2">Notified:<span data-ng-bind="statusCount.NOTIFIED || 0"
 114                                                                               class="blue-font"></span></div>
 115                                     <div class="status-item-3">Downloaded:<span
 116                                         data-ng-bind="statusCount.DOWNLOAD_OK || 0" class="blue-font"></span></div>
 117                                     <div class="status-item-4">Deployed:<span data-ng-bind="statusCount.DEPLOY_OK || 0"
 118                                                                               class="blue-font"></span><span
 119                                         data-ng-class="{'deployed':(statusCount.DEPLOY_OK > 0)}"></span></div>
 120                                     <div class="status-item-5">Not Notified:<span
 121                                         data-ng-bind="statusCount.NOT_NOTIFIED || 0" class="blue-font"></span></div>
 122                                     <div class="status-item-6">Deploy Errors:<span
 123                                         data-ng-bind="statusCount.DEPLOY_ERROR || 0" class="red-font"></span><span
 124                                         data-ng-class="{'error':(statusCount.DEPLOY_ERROR > 0)}"></span></div>
 125                                     <div class="status-item-7">Download Errors:<span
 126                                         data-ng-bind="statusCount.DOWNLOAD_ERROR || 0" class="red-font"></span><span
 127                                         data-ng-class="{'error':(statusCount.DOWNLOAD_ERROR > 0)}"></span></div>
 128                                 </div>
 129                             </div>
 130                             <div data-ng-if="omfComponentListExtends"
 131                                  class="w-sdc-distribute-omfComponent-block disable-hover">
 132                                 <div class="w-sdc-distribute-row-extends disable-hover">
 133                                     <div class="disable-hover">
 134                                         <div class="w-sdc-distribute-row omfComponent-table-head">
 135                                             <div class="title item-1">Component ID</div>
 136                                             <div class="title item-2">Artifact Name</div>
 137                                             <div class="title item-3">URL</div>
 138                                             <div class="title item-4">Time(UTC)</div>
 139                                             <div class="title item-5">Status</div>
 140                                         </div>
 141
 142                                         <div class="w-sdc-distribute-row omfComponent-table-row"
 143                                              data-ng-repeat-start="(url,urlList) in ::omfComponentList | orderBy: '-timestamp' |  groupBy:'url'"
 144                                              data-ng-class="urlListExtends?'extends row-{{$index}}':'row-{{$index}}'">
 145                                             <div class="w-sdc-distribute-cell item-1"  sdc-smart-tooltip>
 146                                                 <div class="w-sdc-distribution-arrow-btn" data-ng-click="urlListExtends=!urlListExtends"
 147                                                      data-ng-class="{'extends': urlListExtends}"
 148                                                      data-ng-init="urlListListExtends=false;urlList[0].displayUrl=getUrlName(urlList[0].url)"
 149                                                      ></div>
 150                                                 {{urlList[0].omfComponentID}}
 151                                             </div>
 152                                             <div class="w-sdc-distribute-cell item-2" sdc-smart-tooltip>
 153                                                 {{urlList[0].displayUrl}}
 154                                             </div>
 155                                             <div class="w-sdc-distribute-cell item-3 disable-hover">
 156                                                 <div sdc-smart-tooltip class="distribution-url">{{urlList[0].url}}</div>
 157                                                 <div sdc-smart-tooltip title="Copy url" clipboard text="urlList[0].url"
 158                                                      class="sprite-new link-btn copy-link disable-hover"></div>
 159                                             </div>
 160                                             <div class="w-sdc-distribute-cell item-4"><span
 161                                                 data-ng-bind="urlList[0].timestamp  | date: 'MM/dd/yyyy h:mma':'UTC'"></span>
 162                                             </div>
 163                                             <div class="w-sdc-distribute-cell item-5"  sdc-smart-tooltip>
 164                                                 {{urlList[0].status}}
 165                                             </div>
 166                                         </div>
 167
 168
 169                                         <div data-ng-repeat-end data-ng-if="urlListExtends" class="disable-hover" >
 170                                             <div class="w-sdc-distribute-row extends disable-hover">
 171                                                 <ul data-ng-if="urlListExtends"
 172                                                     class="w-sdc-distribute-url-block disable-hover">
 173                                                     <li data-ng-repeat="distributionComponent in ::urlList | orderBy: '-timestamp'"
 174                                                         class="disable-hover">
 175                                                         <span
 176                                                             data-ng-bind="distributionComponent.timestamp | date: 'MM/dd/yyyy h:mma':'UTC'"
 177                                                             class="disable-hover"></span>
 178                                                         <span
 179                                                             class="disable-hover">{{distributionComponent.status}}</span>
 180                                                            <span
 181                                                                class="disable-hover reason" data-ng-if="distributionComponent.status == 'NOT_NOTIFIED'">Reason: Component has determined artifact is not needed.</span>
 182                                                           <span
 183                                                               class="disable-hover reason" data-ng-if="distributionComponent.errorReason">Reason: {{distributionComponent.errorReason}}</span>
 184                                                     </li>
 185                                                 </ul>
 186                                             </div>
 187                                         </div>
 188                                     </div>
 189                                 </div>
 190                             </div>
 191                         </li>
 192                     </ul>
 193                 </li>
 194             </ul>
 195         </div>
 196
 197     </perfect-scrollbar>
 198 </div>