gui/app/views/uploadImage.html

   1 <!--upload image  page-->
   2
   3 <div class="content">
   4     <div style="display:flex;flex-direction:row;">
   5         <div style="width:750px;">
   6
   7             <h3>{{environmentInfo.name}} -- Image
   8                 <button class="btn btn-default" style="float:right" ng-click="goNext()">Next</button>
   9             </h3>
  10             <!--<p>In this process, you can input your define openrc config or upload a openrc file</p>-->
  11
  12             <hr>
  13             <h4>Alternative Images</h4>
  14             <div>
  15                 <table class="table table-striped">
  16
  17                     <tr>
  18                         <th>name</th>
  19                         <th>description</th>
  20                         <th>size</th>
  21                         <th>status</th>
  22                         <th>time</th>
  23                         <th>action</th>
  24                     </tr>
  25                     <tr ng-repeat="image in yardstickImage">
  26                         <td>{{image.name}}</td>
  27                         <td>{{image.description}}</td>
  28                         <td>{{image.size | number:2}} MB</td>
  29                         <td>{{image.status}}</td>
  30                         <td>{{image.time}}</td>
  31                         <td>
  32                             <div class="btn-group" uib-dropdown>
  33                                 <button id="single-button" type="button" class="btn btn-default btn-sm" uib-dropdown-toggle>
  34                                     action<span class="caret"></span>
  35                                 </button>
  36                                 <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
  37                                     <li role="menuitem" ng-show="image.status == 'N/A'"><a ng-click="loadYardstickImage(image.name)">load</a></li>
  38                                     <li role="menuitem" ng-show="image.status != 'N/A'"><a ng-click="deleteYardstickImage(image.name)">delete</a></li>
  39                                 </ul>
  40                             </div>
  41                         </td>
  42                     </tr>
  43                 </table>
  44             </div>
  45
  46             <hr>
  47             <h4 style="display:inline">Custom Images</h4>
  48             <div class="btn-group button-margin" style="float:right;margin-top:-10px;margin-bottom:5px">
  49                 <button class="btn btn-default" style="width:60px" ngf-select="uploadCustomImage($file, $invalidFiles)" ngf-max-size="2048MB">
  50                         <div ng-show="!showloading">Local</div>
  51                         <img src="images/loading2.gif" width="25" height="25" ng-if="showloading" />
  52                 </button>
  53                 <button class="btn btn-default" style="width:60px" ng-click="openImageDialog()">Url</button>
  54             </div>
  55             <div>
  56                 <table class="table table-striped">
  57
  58                     <tr>
  59                         <th>name</th>
  60                         <th>description</th>
  61                         <th>size</th>
  62                         <th>status</th>
  63                         <th>time</th>
  64                         <th>action</th>
  65                     </tr>
  66                     <tr ng-repeat="image in customImage">
  67                         <td>{{image.name}}</td>
  68                         <td>{{image.description}}</td>
  69                         <td>{{image.size | number:2}} MB</td>
  70                         <td>{{image.status}}</td>
  71                         <td>{{image.time}}</td>
  72                         <td>
  73                             <div class="btn-group" uib-dropdown>
  74                                 <button id="single-button" type="button" class="btn btn-default btn-sm" uib-dropdown-toggle>
  75                                     action<span class="caret"></span>
  76                                 </button>
  77                                 <ul class="dropdown-menu" uib-dropdown-menu role="menu" aria-labelledby="single-button">
  78                                     <li role="menuitem" ><a ng-click="deleteCustomImage(image.id)">delete</a></li>
  79                                 </ul>
  80                             </div>
  81                         </td>
  82                     </tr>
  83                 </table>
  84             </div>
  85
  86         </div>
  87     </div>
  88
  89 </div>
  90 <toaster-container></toaster-container>
  91
  92 <style>
  93     .form-control {
  94         border-radius: 5px;
  95         width: 200px;
  96         margin-bottom: 10px;
  97     }
  98
  99     .uploadbutton {
 100         background-color: #007ACC;
 101         color: #fff;
 102         border: 0px;
 103         border-radius: 5px;
 104         height: 27px;
 105     }
 106
 107     .edit-title {
 108         border: 0px;
 109         background-color: #ffffff;
 110         margin-bottom: 5px;
 111         font-size: 12px;
 112     }
 113
 114     .null-edit-title {
 115         border: 1px solid #e5e6e7;
 116         border-radius: 5px;
 117         margin-bottom: 3px;
 118     }
 119
 120     .item-info {
 121         display: flex;
 122         flex-direction: row;
 123     }
 124
 125     .delete-img {
 126         width: 15px;
 127         height: 15px;
 128         opacity: 0.8;
 129         margin-left: -10px;
 130         margin-top: -3px;
 131         cursor: pointer;
 132     }
 133
 134     .nextButton {
 135         margin-top: 30px;
 136         border: none;
 137         border-radius: 5px;
 138         padding: 6px;
 139         background-color: #339933;
 140         color: #ffffff;
 141         text-align: center;
 142         /* margin-left: 300px; */
 143     }
 144
 145     .bs-sidenav {
 146         margin-top: 40px;
 147         margin-bottom: 20px;
 148         width: 124px;
 149     }
 150
 151     .nav {
 152         margin-bottom: 0;
 153         padding-left: 0;
 154         list-style: none;
 155     }
 156
 157     .nav>li {
 158         position: relative;
 159         display: block;
 160     }
 161
 162     li {
 163         display: list-item;
 164         text-align: -webkit-match-parent;
 165     }
 166
 167     a {
 168         cursor: pointer;
 169     }
 170
 171     a.active {
 172         background-color: #EEEEEE;
 173         border-radius: 5px;
 174     }
 175 </style>