11$output.file("web/src/app/entities/${entity.model.var}/${entity.model.var}-detail.component.html")##
22## -- [MACRO]
33#macro(xToOneEdit $relation)
4- <div class="ui-grid-row">
5- <div class="ui-grid-col-2"><label for="$relation.to.var">${relation.labels.label}#{if}($relation.isMandatory()) *#{end}</label></div>
6- <div class="ui-grid-col-4">
4+ <div class="ui-g-12 ui-md-2 ui-lg-1"><label for="$relation.to.var"#{if}($relation.isMandatory()) class="required"#{end}>${relation.labels.label}</label></div>
5+ <div class="ui-g-12 ui-md-10 ui-lg-5">
6+ <div class="ui-g">
7+ <div class="ui-g-12 ui-md-5 ui-lg-5">
78 <${relation.toEntity.model.var}-auto-complete [(ngModel)]="${entity.model.var}.${relation.to.var}" id="${relation.to.var}" name="${relation.to.var}" [disabled]="sub"></${relation.toEntity.model.var}-auto-complete>
89 </div>
9- <div class="ui-grid-col-1 ">
10+ <div class="ui-g-12 ui-md-2 ui-lg-2 ">
1011 <button pButton id="goto${relation.to.varUp}" type="button" (click)="goto${relation.to.varUp}()" *ngIf="!sub && ${entity.model.var}.${relation.to.var}" icon="fa-pencil" label="Edit"></button>
1112 </div>
12- <div class="ui-grid-col-1 ">
13+ <div class="ui-g-12 ui-md-2 ui-lg-2 ">
1314 <button pButton id="clear${relation.to.varUp}" type="button" (click)="clear${relation.to.varUp}()" *ngIf="!sub && ${entity.model.var}.${relation.to.var}" icon="fa-chain-broken" label="Clear"></button>
1415 </div>
16+ </div>
1517 </div>
1618#end
1719#macro(required $attribute)
18- #if($attribute.isRequired() && $attribute.isString() ) required #end
20+ #if($attribute.isRequired()) required #end
1921#end
2022#macro(minlength $attribute)
2123#if($attribute.columnConfig.hasMin()) minlength="$attribute.columnConfig.min"#end
2224#end
23- #macro(asterisk $attribute)
24- #if($attribute.isRequired()) * #end
25+ #macro(requiredclass $attribute)
26+ #if($attribute.isRequired()) class="required" #end
2527#end
2628#macro(mderror $attribute)
2729
28- #if($attribute.isRequired() && $attribute.isString() )
30+ #if($attribute.isRequired())
2931 <md-error *ngIf="!${attribute.var}.valid && ${attribute.var}.dirty && ${attribute.var}.errors['required']">
3032 $attribute.labels.label is required.
3133 </md-error>
@@ -50,7 +52,7 @@ $output.file("web/src/app/entities/${entity.model.var}/${entity.model.var}-detai
5052 <md-card *ngIf="$entity.model.var" ngForm #${entity.model.var}Form="ngForm">
5153 <md-card-title>$entity.model.type Details</md-card-title>
5254 <md-card-content>
53- <div class="ui-grid ui-grid-responsive ui-fluid ui-grid-pad ">
55+ <div class="ui-g alignlabels ">
5456## ---------------------------------------------------------
5557#foreach($attr in $entity.formAttributes.flatUp.list)
5658#if ($attr.isSimplePk() && !$attr.jpa.isManuallyAssigned())
@@ -63,71 +65,70 @@ $output.file("web/src/app/entities/${entity.model.var}/${entity.model.var}-detai
6365#else
6466#set( $valuePath = "$attr.fullVar")##
6567#end
66- <div class="ui-grid-row">
67- <div class="ui-grid-col-2"><label for="$attr.var">$attr.labels.label #asterisk($attr)</label></div>
68+ <div class="ui-g-12 ui-md-2 ui-lg-1"><label for="$attr.var" #requiredclass($attr)>$attr.labels.label</label></div>
6869#if($attr.springMvc.isPassword())
69- <div class="ui-grid-col-2 ">
70- <md-input-container style="width: 100 %">
70+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
71+ <md-input-container style="width: 90 %">
7172 <input mdInput type="password" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) name="$attr.var" ${p}$attr.var="ngModel"/>
7273 #mderror($attr)
7374 </md-input-container>
7475#elseif($attr.isHtml())
7576 todo html
7677#elseif($attr.isTextArea())
77- <div class="ui-grid-col-6 ">
78- <md-input-container style="width: 100 %">
79- <textarea mdInput id="$attr.var" [(ngModel)]="$valuePath" autoResize="true" name="$attr.var" ${p}$attr.var="ngModel"></textarea>
78+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
79+ <md-input-container style="width: 90 %">
80+ <textarea mdInput id="$attr.var" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) autoResize="true" name="$attr.var" ${p}$attr.var="ngModel"></textarea>
8081 #mderror($attr)
8182 </md-input-container>
8283#elseif($attr.isEnum())
83- <div class="ui-grid-col-2 ">
84- <md-select [(ngModel)]="$valuePath" name="$attr.var" ${p}$attr.var="ngModel" style="width: 100 %">
84+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
85+ <md-select [(ngModel)]="$valuePath" name="$attr.var" ${p}$attr.var="ngModel" style="width: 90 %">
8586 <md-option *ngFor="let ${attr.var}Option of ${attr.var}Options" [value]="${attr.var}Option.value">{{ ${attr.var}Option.label }}</md-option>
8687 </md-select>
8788#elseif($attr.isEmail())
88- <div class="ui-grid-col-3 ">
89- <md-input-container style="width: 100 %">
89+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
90+ <md-input-container style="width: 90 %">
9091 <input mdInput id="$attr.var" type="email" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) validateEmail name="$attr.var" ${p}$attr.var="ngModel"/>
9192 #mderror($attr)
9293 </md-input-container>
9394#elseif($attr.isUrl())
94- <div class="ui-grid-col-4 ">
95- <md-input-container style="width: 100 %">
96- <input mdInput id="$attr.var" type="url" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) name="$attr.var" ${p}$attr.var="ngModel"/>
95+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
96+ <md-input-container style="width: 90 %">
97+ <input mdInput id="$attr.var" type="url" pattern="^http.*" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) name="$attr.var" ${p}$attr.var="ngModel"/>
9798 #mderror($attr)
9899 </md-input-container>
99100#elseif($attr.isString())
100- <div class="ui-grid-col-4 ">
101- <md-input-container style="width: 100 %">
101+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
102+ <md-input-container style="width: 90 %">
102103 <input mdInput id="$attr.var" type="text" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) name="$attr.var" ${p}$attr.var="ngModel"/>
103104 #mderror($attr)
104105 </md-input-container>
105106#elseif($attr.isNumeric())
106- <div class="ui-grid-col-2 ">
107- <md-input-container style="width: 100 %">
107+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
108+ <md-input-container style="width: 90 %">
108109 <input mdInput id="$attr.var" type="number" [(ngModel)]="$valuePath" #required($attr) name="$attr.var" ${p}$attr.var="ngModel" />
109110 #mderror($attr)
110111 </md-input-container>
111112#elseif($attr.isDate() && !$attr.isVersion())
112113#if($attr.isJavaUtilOnlyDate() || $attr.isLocalDate())
113- <div class="ui-grid-col-2 ">
114+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
114115 <md-input-container>
115116 <input mdInput id="$attr.var" [mdDatepicker]="${attr.var}Picker" [(ngModel)]="$valuePath" #required($attr) name="$attr.var" ${p}$attr.var="ngModel">
116117 <button mdSuffix [mdDatepickerToggle]="${attr.var}Picker"></button>
117118 </md-input-container>
118119 <md-datepicker ${pound}${attr.var}Picker></md-datepicker>
119120#elseif($attr.isLocalDateTime() || $attr.isInstant())
120- <div class="ui-grid-col-2 ">
121+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
121122 <p-calendar [(ngModel)]="$valuePath" dateFormat="yy-mm-dd" showTime="true" [ngModelOptions]="{standalone: true}"></p-calendar>
122123#else
123- <div class="ui-grid-col-2 ">
124+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
124125 Date type not supported, do it manually and send us the solution!
125126#end
126127#elseif($attr.isBoolean())
127- <div class="ui-grid-col-2 ">
128+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
128129 <p-triStateCheckbox [(ngModel)]="$valuePath" name="$attr.var"></p-triStateCheckbox>{{$valuePath}}
129130#elseif($attr.isFile() && $attr.filename)
130- <div class="ui-grid-col-8 ">
131+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
131132 <ul *ngIf="${entity.model.var}.${attr.filename.var}">
132133 <li><a href="/api/${entity.model.vars}/{{${entity.model.var}.${identifiableProperty.var}}}/download/${attr.var}">Download {{${entity.model.var}.${attr.filename.var}}}</a></li>
133134 <li>Content-Type: {{${entity.model.var}.${attr.fileContentType.var}}}</li>
@@ -140,14 +141,13 @@ $output.file("web/src/app/entities/${entity.model.var}/${entity.model.var}-detai
140141 Please save the form before being able to upload a file
141142 </p>
142143#else
143- <div class="ui-grid-col-4 ">
144- <md-input-container style="width: 100 %">
144+ <div class="ui-g-12 ui-md-10 ui-lg-5 ">
145+ <md-input-container style="width: 90 %">
145146 <input mdInput id="$attr.var" type="text" [(ngModel)]="$valuePath" #required($attr) #minlength($attr) name="$attr.var" ${p}$attr.var="ngModel"/>
146147 #mderror($attr)
147148 </md-input-container>
148149#end
149150 </div>
150- </div>
151151#end ##---------- [/NON VERSION]
152152#end ## foreach(....
153153## ---------------------------------------------------------
@@ -162,6 +162,7 @@ $output.file("web/src/app/entities/${entity.model.var}/${entity.model.var}-detai
162162## TABS FOR RELATIONS
163163##
164164#if($entity.inverseOneToOne.flatUp.size > 0 || $entity.oneToMany.flatUp.size > 0 || $entity.manyToMany.flatUp.size > 0)
165+ <br/>
165166 <md-card *ngIf="$entity.model.var && ${entity.model.var}.$identifiableProperty.var">
166167 <md-card-subtitle>$entity.model.type db relations</md-card-subtitle>
167168 <md-card-content>
0 commit comments