diff options
author | 2019-03-13 16:45:14 +0530 | |
---|---|---|
committer | 2019-03-13 16:45:28 +0530 | |
commit | a1db2c9fa30675062811839929a914e0ad2e07de (patch) | |
tree | a1553549113ba52dcc6e51e97ee957c04a719cad /cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer | |
parent | 7fff47d76d227a93926802bdee7ed0191c21b0e6 (diff) |
Designer component changes
Added the nodetemplate list panel and node template property panel as
part of designer component
Issue-ID: CCSDK-1135
Change-Id: Ifc02d203be2510ad7452247aa0816886e48838a6
Signed-off-by: Arundathi Patil <arundpil@in.ibm.com>
Diffstat (limited to 'cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer')
2 files changed, 125 insertions, 2 deletions
diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.html b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.html index b1c894099..3ab8f2414 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.html +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.html @@ -17,6 +17,123 @@ 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. ============LICENSE_END============================================ --> +<div class="designerTmp"> + <div class="outerDiv divone"> + <mat-accordion> + <mat-expansion-panel> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Node types + </mat-panel-title> + </mat-expansion-panel-header> + <div class="flex-container"> + <div class="item-box" *ngFor="let item of todo" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> -<svg id="svgArea" width="1000px" height="100%" style="background-color:white"> -</svg>
\ No newline at end of file + <mat-expansion-panel> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Policy + </mat-panel-title> + </mat-expansion-panel-header> + <div class="flex-container"> + <div class="item-box">Policy 1</div> + <div class="item-box">Policy 1</div> + <div class="item-box">Policy 1</div> + </div> + </mat-expansion-panel> + </mat-accordion> + </div> + <div class="outerDiv divtwo"> + <svg id="svgArea" width="1000px" height="100%" style="background-color:white"> + </svg> + </div> + <div id="overlay" class="outerDiv divThree"> + <mat-accordion style="width: 100%"> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Type + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box">vnf-netconf-device</div> + </div> + </mat-expansion-panel> + + <mat-expansion-panel> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Properties + </mat-panel-title> + </mat-expansion-panel-header> + </mat-expansion-panel> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Interface + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box" *ngFor="let item of review" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Interface + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box" *ngFor="let item of review" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Artifacts + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box" *ngFor="let item of review" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Inputs + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box" *ngFor="let item of review" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> + + <mat-expansion-panel (opened)="panelOpenState = true" (closed)="panelOpenState = false"> + <mat-expansion-panel-header style="background-color: #f1f1f1"> + <mat-panel-title> + Capabilities + </mat-panel-title> + </mat-expansion-panel-header> + + <div class="item-list"> + <div class="item-box" *ngFor="let item of review" cdkDrag>{{item}}</div> + </div> + </mat-expansion-panel> + + + + </mat-accordion> + </div> +</div>
\ No newline at end of file diff --git a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.scss b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.scss index eecaa169d..1a3674c56 100644 --- a/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.scss +++ b/cds-ui/client/src/app/feature-modules/blueprint/modify-template/designer/designer.component.scss @@ -63,4 +63,10 @@ limitations under the License. background-position: 39px 32px; background-repeat: repeat; width: 100% +} +.designerTmp { + display: flex; + flex-direction: row; + height: 524px; + width: 100% }
\ No newline at end of file |