align="justify"> lt; ui: composition template=»/ WEB-INF/tpl/base.xhtml» xmlns: ui=«# justify gt; lt; ui: define name =« title » gt ; # {i18n.day} lt;/ui: define gt;
lt; ui: define name=«body» gt;
lt; s: chart backing= # {dayBacking} / gt;
lt;/ui: define gt;
lt;/ui: composition gt; .xhtml
lt; ui: composition template=»/ WEB-INF/tpl/base.xhtml» xmlns=«# justify gt; lt; ui: define name =« title » gt; Debt lt ;/ui: define gt;
lt; ui: define name=«body» gt;
lt; s: grid name=«debt» backing= # {debtBacking} / gt;
lt; s: grid name=«repay» backing="# {repayBacking}» editable=«false»/?? gt;
lt;/ui: define gt;
lt;/ui: composition gt; .xhtml
lt; ui: composition template=»/ WEB-INF/tpl/base.xhtml» xmlns=«# justify gt; lt; ui: define name =« title » gt; # {i18n.diary} lt;/ui: define gt;
lt; ui: define name=«body» gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; h: inputText styleClass=«form-control» value= # {dateBacking.date} gt;
lt; f: convertDateTime pattern=«yyyy-MM-dd»/ gt;
lt;/h: inputText gt;
lt; h: commandButton styleClass=«btn btn-primary» value= # {i18n.see} / gt;
lt;/div gt;
lt;/div gt;
lt;/div gt;
lt; s: grid name=«diary» backing= # {diaryPayBacking} / gt;
lt; s: grid name=«repay» backing="# {diaryRepayBacking}» editable=«false»/?? gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; p gt; lt; strong gt; # {i18n.balance} lt;/strong gt ;: # {diaryPayBacking.balance} lt;/p gt;
lt;/div gt;
lt;/div gt;
lt;/ui: define gt;
lt;/ui: composition gt; .xhtml
lt; ui: composition template=»/ WEB-INF/tpl/base.xhtml» xmlns=«# justify gt; lt; ui: define name =« title » gt; # {i18n.pay} lt;/ui: define gt;
lt; ui: define name=«body» gt;
lt; s: grid name=«pay» backing= # {payBacking} / gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; p gt; lt; strong gt; # {i18n.count} lt;/strong gt ;: # {payBacking.count} lt;/p gt;
lt;/div gt;
lt;/div gt;
lt;/ui: define gt;
lt;/ui: composition gt; .xhtml
lt; ui: composition template=»/ WEB-INF/tpl/base.xhtml» xmlns: ui=«# justify gt; lt; ui: define name =« title » gt ; # {i18n.unpaid} lt;/ui: define gt;
lt; ui: define name=«body» gt;
lt; s: chart backing= # {unpaidBacking} / gt;
lt;/ui: define gt;
lt;/ui: composition gt; .xhtml
lt; html xmlns=«# justify gt; lt; c: interface gt;
lt; c: attribute name=«backing»/ gt;
lt; c: attribute name=«hasPeriod» default=«true»/ gt;
lt;/c: interface gt;
lt; c: implementation gt;
lt; ui: fragment rendered= # {cctrs.hasPeriod} gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; div gt;
lt; h: inputText styleClass=«form-control» value= # {cctrs.backing.from} gt;
lt; f: convertDateTime pattern=«yyyy-MM-dd»/ gt;
lt;/h: inputText gt;
lt; h: inputText styleClass=«form-control» value= # {cctrs.backing.to} gt;
lt; f: convertDateTime pattern=«yyyy-MM-dd»/ gt;
lt;/h: inputText gt;
lt; p: commandButton styleClass=«btn btn-primary» ajax=«none» value= # {i18n.see} / gt;
lt;/div gt;
lt;/div gt;
lt;/div gt;
lt;/ui: fragment gt;
lt; div gt;
lt; div gt;