9800d1e727b39da0eac54a9cbb7102d82c76cfdb
[kivitendo-erp.git] / templates / webpages / rp / income_statement.html
1 [%- USE T8 %]
2 [%- USE HTML %]
3 [%- USE LxERP %]
4 [%- USE L %]
5 [% L.button_tag('', LxERP.t8('Hide buttons'), id="hide_buttons_button", class="hide") %]
6 [% L.button_tag('', LxERP.t8('Show charts'),  id="show_charts_button",  class="hide") %]
7 [% L.button_tag('', LxERP.t8('Hide charts'),  id="hide_charts_button",  class="hide") %]
8
9 <h3 align="center" id="show_buttons"> [% title %]</h3>
10 <h3 align=center>
11 [% period %]<br>
12 [% accounting_method %]<br>
13
14 <br>[% report_date %]
15 </h3>
16
17 <style type="text/css">
18
19 #eurtable {
20   border-collapse: collapse;
21   width: 100%;
22 }
23
24 tr.category {
25   /* background set via jquery */
26 }
27
28 tr.chart {
29   border: 0;
30 }
31
32 td.chartname {
33   padding-left: 50px;
34 }
35
36 tr.chartrow {
37   font-size: 75%;
38 }
39
40 .guv_row_background {
41   background:#f0f0f0;
42 }
43 </style>
44
45 <table id="eurtable">
46 <tr>
47   <td width=75% align=left colspan=2><font size="+1"><b>A. Betriebseinnahmen</font></b><br></td>
48   <td></td>
49 </tr>
50
51 [% FOREACH i IN categories_income %]
52   <tr class="category" data-catid="cat[% i %]">
53     <td>
54       [% HTML.escape(category_names.item(i)) %]
55     </td>
56     <td class="numeric">
57       [% eur_amounts.item(i) %]
58     </td>
59   </tr>
60   [% FOREACH chart = charts_by_category.item(i).list %]
61   <tr class="chartrow cat[% i %]">
62     <td class="chartname">[% chart.accno %] [% chart.description %]</td>
63     <td class="numeric"> [% LxERP.format_amount(chart.amount,2) %] </td>
64   </tr>
65   [% END %]
66 [% END %]
67 <tr>
68   <td> </td>
69   <td><hr noshade size=1></td>
70 </tr>
71
72 <tr valign=top>
73   <th align=left><b>Summe Einnahmen</b></th>
74   <td align=right>[% sumeura %]<hr noshade size=2></td>
75 </tr>
76 <tr>
77   <td></td>
78   <td><br><br></td>
79 </tr>
80 <tr>
81   <td align=left><font size="+1"><b>B. Betriebsausgaben</font></b><br></td>
82   <td></td>
83 </tr>
84
85 [% FOREACH i IN categories_expense %]
86   <tr class="category" data-catid="cat[% i %]">
87     <td>
88       [% HTML.escape(category_names.item(i)) %]
89     </td>
90     <td class="numeric">
91       [% eur_amounts.item(i) %]
92     </td>
93   </tr>
94   [% FOREACH chart = charts_by_category.item(i).list %]
95   <tr class="chartrow cat[% i %]">
96     <td class="chartname">[% chart.accno %] [% chart.description %]</td>
97     <td class="numeric"> [% LxERP.format_amount(chart.amount,2) %] </td>
98   </tr>
99   [% END %]
100 [% END %]
101 <tr>
102   <td> </td>
103   <td><hr noshade size=1></td>
104 </tr>
105
106 <tr valign=top>
107   <th align=left><b>Summe Ausgaben</b></th>
108   <td align=right>[% sumeurb %] <br><hr noshade size=2</td>
109 </tr>
110 <tr>
111   <td></td>
112   <td><br><br></td>
113 </tr>
114 <tr valign=top>
115   <td align=left>GEWINN / VERLUST</td>
116   <td align=right>[% guvsumme %]<br><hr noshade size=2></td>
117 </tr>
118
119 </table>
120
121
122 <br>
123
124 [% L.button_tag('', LxERP.t8('Show chart list'), id="show_chartlist_button", class="hide") %]
125 [% L.button_tag('', LxERP.t8('Hide chart list'), id="hide_chartlist_button", class="hide") %]
126
127 <div id="chartlist">
128 <div>[% 'Chart list' | $T8 %]</div>
129 <div>
130 <table>
131 <tr>
132   <th>[% 'Chart'    | $T8 %]</th>
133   <th>[% 'Amount'   | $T8 %]</th>
134   <th>[% 'Category' | $T8 %]</th>
135 </tr>
136 [% FOREACH key = charts.keys.sort %]
137 [% UNLESS charts.$key.pos_eur %]
138 [% NEXT %]
139 [% END %]
140 <tr>
141  <td>[% charts.$key.accno %]</td>
142  <td class="numeric">[%  LxERP.format_amount( charts.$key.amount, 2 ) %]</td>
143  <td>[% HTML.escape(category_names.item(charts.$key.pos_eur)) %]</td>
144 </tr>
145 [% END %]
146 </table>
147 </div>
148 </div>
149 </body>
150 </html>
151
152 <script language="javascript">
153 $( document ).ready(function() {
154   $( ".chartrow" ).hide();
155   $( "#hide_charts_button" ).hide();
156   $( "#hide_chartlist_button" ).hide();
157   $( "#chartlist" ).hide();
158   $( '.category:even' ).css('background-color','#f0f0f0');
159   $( '.category:odd' ).css('background-color','#f8f8f8');
160
161   $( "#show_chartlist_button" ).click(function() {
162     $( "#chartlist" ).toggle();
163     $('html, body').animate({
164         scrollTop: $(this).offset().top
165     }, 500);
166     $(this).hide();
167     $("#hide_chartlist_button").show();
168   });
169
170   $( "#hide_chartlist_button" ).click(function() {
171     $( "#chartlist" ).toggle();
172     $('html, body').animate({
173         scrollTop: $(this).offset().top
174     }, 500);
175     $(this).hide();
176     $("#show_chartlist_button").show();
177   });
178
179   $( "#hide_buttons_button" ).click(function() {
180     $( ".hide" ).hide();
181   });
182
183   $( "#show_buttons" ).click(function() {
184     $( ".hide" ).show();
185   });
186
187   $( "#show_charts_button" ).click(function() {
188     $( ".chartrow" ).show();
189     $(this).hide();
190     $("#hide_charts_button").show();
191   });
192
193   $( "#hide_charts_button" ).click(function() {
194     $( ".chartrow" ).hide();
195     $(this).hide();
196     $("#show_charts_button").show();
197   });
198
199   $( ".category" ).click(function() {
200     var chartrow_class = $(this).attr('data-catid');
201     $('.' + chartrow_class).toggle();
202   });
203 })
204
205 </script>