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>{{baseElementInfo.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             <button class="btn btn-default" ng-click="uploadImage()">
  14                  <div ng-if="!showloading">Load Image</div>
  15                  <img src="images/loading2.gif" width="25" height="25" ng-if="showloading" />
  16             </button>
  17             <i class="fa fa-check" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: #2ecc71;" ng-show="imageStatus==1&&ifshowStatus==1">done</i>
  18             <i class="fa fa-spinner" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: #2ecc71;" ng-show="imageStatus==0&&ifshowStatus==1">loading</i>
  19             <i class="fa fa-exclamation-triangle" aria-hidden="true" style="margin-top:34px;margin-left:5px;color: red;" ng-show="imageStatus==2&&ifshowStatus==1">error</i>
  20
  21             <hr>
  22             <h4>Current Images</h4>
  23
  24             <div>
  25                 <table class="table table-striped">
  26
  27                     <tr>
  28                         <th>name</th>
  29                         <th>size</th>
  30                         <th>status</th>
  31                         <th>time</th>
  32                     </tr>
  33                     <tr ng-repeat="image in imageListData">
  34                         <td>{{image.name}}</td>
  35                         <td>{{image.size/1024}} MB</td>
  36                         <td>{{image.status}}</td>
  37                         <td>{{image.time}}</td>
  38
  39                     </tr>
  40
  41
  42
  43                 </table>
  44             </div>
  45
  46
  47
  48
  49
  50
  51
  52
  53
  54         </div>
  55
  56
  57     </div>
  58
  59 </div>
  60 <toaster-container></toaster-container>
  61
  62 <style>
  63     .form-control {
  64         border-radius: 5px;
  65         width: 200px;
  66         margin-bottom: 10px;
  67     }
  68
  69     .uploadbutton {
  70         background-color: #007ACC;
  71         color: #fff;
  72         border: 0px;
  73         border-radius: 5px;
  74         height: 27px;
  75     }
  76
  77     .edit-title {
  78         border: 0px;
  79         background-color: #ffffff;
  80         margin-bottom: 5px;
  81         font-size: 12px;
  82     }
  83
  84     .null-edit-title {
  85         border: 1px solid #e5e6e7;
  86         border-radius: 5px;
  87         margin-bottom: 3px;
  88     }
  89
  90     .item-info {
  91         display: flex;
  92         flex-direction: row;
  93     }
  94
  95     .delete-img {
  96         width: 15px;
  97         height: 15px;
  98         opacity: 0.8;
  99         margin-left: -10px;
 100         margin-top: -3px;
 101         cursor: pointer;
 102     }
 103
 104     .nextButton {
 105         margin-top: 30px;
 106         border: none;
 107         border-radius: 5px;
 108         padding: 6px;
 109         background-color: #339933;
 110         color: #ffffff;
 111         text-align: center;
 112         /* margin-left: 300px; */
 113     }
 114
 115     .bs-sidenav {
 116         margin-top: 40px;
 117         margin-bottom: 20px;
 118         width: 124px;
 119     }
 120
 121     .nav {
 122         margin-bottom: 0;
 123         padding-left: 0;
 124         list-style: none;
 125     }
 126
 127     .nav>li {
 128         position: relative;
 129         display: block;
 130     }
 131
 132     li {
 133         display: list-item;
 134         text-align: -webkit-match-parent;
 135     }
 136
 137     a {
 138         cursor: pointer;
 139     }
 140
 141     a.active {
 142         background-color: #EEEEEE;
 143         border-radius: 5px;
 144     }
 145 </style>