View | Details | Raw Unified | Return to bug 22168
Collapse All | Expand All

(-)a/koha-tmpl/intranet-tmpl/prog/css/reports.css (+36 lines)
Lines 72-75 del { Link Here
72
72
73
.clear_filter i {
73
.clear_filter i {
74
    color: #C00;
74
    color: #C00;
75
}
76
77
fieldset.rows {
78
    background-color: transparent;
79
    border: 0;
80
    font-size: 100%;
81
    margin: 0;
82
    padding: 0;
83
}
84
85
fieldset.rows label,
86
fieldset.rows span.label {
87
    width: 12em;
88
}
89
90
fieldset.rows legend {
91
    margin-left: 0;
92
}
93
94
fieldset.rows .column_config_row {
95
    display: flex;
96
    flex-wrap: wrap;
97
    justify-content: flex-start;
98
}
99
100
fieldset.rows .chart-column-conf {
101
    padding: .7em;
102
    width: auto;
103
}
104
105
fieldset.rows .chart-column-conf label {
106
    display: block;
107
    float: none;
108
    margin: .4em 0;
109
    text-align: left;
110
    width: auto;
75
}
111
}
(-)a/koha-tmpl/intranet-tmpl/prog/en/includes/chart.inc (-86 / +95 lines)
Lines 1-96 Link Here
1
<div id="makechart" style="display:none;">
1
<div class="modal" id="chartModal" tabindex="-1" role="dialog" aria-labelledby="chartModalLabel">
2
    [% supposed_x = header_row.shift.cell %]
2
    <div class="modal-dialog modal-wide" role="document">
3
3
        <div class="modal-content">
4
    <fieldset>
4
            <div class="modal-header">
5
        <legend>Draw a chart</legend>
5
                <button type="button" class="closebtn" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
6
        <ol>
6
                <h4 class="modal-title" id="chartModalLabel">Chart settings</h4>
7
            <li>
8
                <label for="chart-type">Chart type</label>
9
                <select name="chart-type" id="chart-type">
10
                    <option value="pie">Pie</option>
11
                    <option value="bar">Bar</option>
12
                    <option value="line">Line</option>
13
                </select>
14
15
                <div id="chart-column-horizontal">
16
                    <label for="horizontal">Horizontal bar:</label>
17
                    <input id="horizontal" name="column-horizontal" type="checkbox">
18
                </div>
19
            </li>
20
21
            <li>
22
                <label for="x_element">x column:</label>
23
                <select id="x_element" name="x">
24
                    <option value="[% supposed_x | html %]" selected>[% supposed_x | html %]</option>
25
                    [% FOREACH header IN header_row %]
26
                        <option value="[% header.cell | html %]">[% header.cell | html %]</option>
27
                    [% END %]
28
                </select>
29
            </li>
30
31
            <div>
32
                <label for="include-all">Include all rows (ignore pagination)</label>
33
                <input id="include-all" name="chart-include-all" type="checkbox">
34
            </div>
7
            </div>
8
            <div class="modal-body" id="makechart">
9
                [% supposed_x = header_row.shift.cell %]
10
                <fieldset class="rows">
11
                    <ol>
12
                        <li>
13
                            <label for="chart-type">Chart type: </label>
14
                            <select name="chart-type" id="chart-type">
15
                                <option value="pie">Pie</option>
16
                                <option value="bar">Bar</option>
17
                                <option value="line">Line</option>
18
                            </select>
19
                        </li>
35
20
21
                        <li id="chart-column-horizontal">
22
                            <label for="horizontal">Horizontal bar:</label>
23
                            <input id="horizontal" name="column-horizontal" type="checkbox" />
24
                        </li>
36
25
37
            <label for="exclude-last">Exclude last line (Rollup)</label>
26
                        <li>
38
            <input id="exclude-last" name="chart-exclude-last" type="checkbox">
27
                            <label for="x_element">x column:</label>
39
28
                            <select id="x_element" name="x">
40
            [% column = 1 %]
41
            <li>
42
                [% FOREACH header IN header_row %]
43
                    <fieldset class="chart-column-conf" id="column_[% column | html %]" style="display: inline !important;">
44
                        <legend>
45
                            Column [% column | html %]
46
                            <a class="chart-column-delete" href="#" data-column="[% column | html %]">
47
                                <img src="[% interface | html %]/[% theme | html %]/img/x.png" alt="Delete" />
48
                            </a>
49
                        </legend>
50
                        <div>
51
                            <label for="y_[% column | html %]" >y:</label>
52
                            <select id="y_[% column | html %]" name="y">
53
                                <option value="[% supposed_x | html %]" selected>[% supposed_x | html %]</option>
29
                                <option value="[% supposed_x | html %]" selected>[% supposed_x | html %]</option>
54
                                [% FOREACH h IN header_row %]
30
                                [% FOREACH header IN header_row %]
55
                                    [% IF header.cell == h.cell %]
31
                                    <option value="[% header.cell | html %]">[% header.cell | html %]</option>
56
                                        <option value="[% h.cell | html %]" selected>[% h.cell | html %]</option>
57
                                    [% ELSE %]
58
                                        <option value="[% h.cell | html %]">[% h.cell | html %]</option>
59
                                    [% END %]
60
                            [% END %]
61
                            </select>
62
                        </div>
63
64
                        <div class="chart-column-group">
65
                            [% i = 1 %]
66
                            <label for="group_[% column | html %]">Group:</label>
67
                            <select id="group_[% column | html %]" name="group">
68
                                [% FOREACH h IN header_row %]
69
                                    [% IF i == column %]
70
                                        <option value="[% i | html %]" selected>[% i | html %]</option>
71
                                    [% ELSE %]
72
                                        <option value="[% i | html %]">[% i | html %]</option>
73
                                    [% END %]
74
                                    [% i = i + 1 %]
75
                                [% END %]
32
                                [% END %]
76
                            </select>
33
                            </select>
77
                        </div>
34
                        </li>
35
36
                        <li>
37
                            <label for="include-all">Include all rows (ignore pagination):</label>
38
                            <input id="include-all" name="chart-include-all" type="checkbox" />
39
                        </li>
40
41
                        <li>
42
                            <label for="exclude-last">Exclude last line (Rollup): </label>
43
                            <input id="exclude-last" name="chart-exclude-last" type="checkbox" />
44
                        </li>
45
                        [% column = 1 %]
46
                        <li class="column_config_row">
47
                            [% FOREACH header IN header_row %]
48
                                <fieldset class="chart-column-conf" id="column_[% column | html %]">
49
                                    <legend>
50
                                        Column [% column | html %]
51
                                        <a class="chart-column-delete" href="#" data-column="[% column | html %]">
52
                                            <i class="fa fa-remove error"></i>
53
                                        </a>
54
                                    </legend>
55
                                    <div>
56
                                        <label for="y_[% column | html %]" >y:</label>
57
                                        <select id="y_[% column | html %]" name="y">
58
                                            <option value="[% supposed_x | html %]" selected>[% supposed_x | html %]</option>
59
                                            [% FOREACH h IN header_row %]
60
                                                [% IF header.cell == h.cell %]
61
                                                    <option value="[% h.cell | html %]" selected>[% h.cell | html %]</option>
62
                                                [% ELSE %]
63
                                                    <option value="[% h.cell | html %]">[% h.cell | html %]</option>
64
                                                [% END %]
65
                                        [% END %]
66
                                        </select>
67
                                    </div>
68
69
                                    <div class="chart-column-group">
70
                                        [% i = 1 %]
71
                                        <label for="group_[% column | html %]">Group:</label>
72
                                        <select id="group_[% column | html %]" name="group">
73
                                            [% FOREACH h IN header_row %]
74
                                                [% IF i == column %]
75
                                                    <option value="[% i | html %]" selected>[% i | html %]</option>
76
                                                [% ELSE %]
77
                                                    <option value="[% i | html %]">[% i | html %]</option>
78
                                                [% END %]
79
                                                [% i = i + 1 %]
80
                                            [% END %]
81
                                        </select>
82
                                    </div>
78
83
79
                        <div class="chart-column-line">
84
                                    <div class="chart-column-line">
80
                            <label for="line_[% column | html %]">line:</label>
85
                                        <label for="line_[% column | html %]">Line:</label>
81
                            <input class="column-line" id="column-line" name="[% header.cell | html %]" type="checkbox">
86
                                        <input class="column-line" id="line_[% column | html %]" name="[% header.cell | html %]" type="checkbox" />
82
                        </div>
87
                                    </div>
83
                    </fieldset>
88
                                </fieldset>
84
                    [% column = column + 1 %]
89
                                [% column = column + 1 %]
85
                [% END %]
90
                            [% END %]
86
            </li>
91
                        </li>
92
                    </ol>
93
                </fieldset>
87
94
88
            <li>
95
                [% item = { cell = supposed_x } %]
96
                [% header_row.unshift(item) | html %]
97
            </div>
98
            <div class="modal-footer">
89
                <button id="draw-chart" class="btn btn-default">Draw</button>
99
                <button id="draw-chart" class="btn btn-default">Draw</button>
90
            </li>
100
                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
91
        </ol>
101
            </div>
92
    </fieldset>
102
        </div>
93
    [% item = { cell = supposed_x } %]
103
    </div>
94
    [% header_row.unshift(item) | html %]
95
    <div id="chart"></div>
96
</div>
104
</div>
105
(-)a/koha-tmpl/intranet-tmpl/prog/en/includes/reports-toolbar.inc (-2 / +1 lines)
Lines 70-77 Link Here
70
                <a class="btn btn-default btn-sm toggle_sql" id="toggle_sql_vis" href="#" style="display:none;"><i class="fa fa-eye-slash"></i> Hide SQL code</a>
70
                <a class="btn btn-default btn-sm toggle_sql" id="toggle_sql_vis" href="#" style="display:none;"><i class="fa fa-eye-slash"></i> Hide SQL code</a>
71
            </div>
71
            </div>
72
            <div class="btn-group">
72
            <div class="btn-group">
73
                <a class="btn btn-default btn-sm toggle_chart_settings" id="toggle_chart_settings_hid" href="#"><i class="fa fa-eye"></i> Show chart settings</a>
73
                <a class="btn btn-default btn-sm" href="#" data-toggle="modal" data-target="#chartModal"><i class="fa fa-bar-chart"></i> Create chart</a>
74
                <a class="btn btn-default btn-sm toggle_chart_settings" id="toggle_chart_settings_vis" href="#" style="display:none;"><i class="fa fa-eye-slash"></i> Hide chart settings</a>
75
            </div>
74
            </div>
76
        [% END %]
75
        [% END %]
77
76
(-)a/koha-tmpl/intranet-tmpl/prog/en/modules/reports/guided_reports_start.tt (-38 / +40 lines)
Lines 40-47 Link Here
40
    resize:  vertical;
40
    resize:  vertical;
41
}
41
}
42
</style>
42
</style>
43
[% Asset.css("css/reports.css") | $raw %]
43
[% IF ( saved1 ) %]
44
[% IF ( saved1 ) %]
44
    [% Asset.css("css/reports.css") | $raw %]
45
    [% Asset.css("css/datatables.css") | $raw %]
45
    [% Asset.css("css/datatables.css") | $raw %]
46
[% END %]
46
[% END %]
47
[% Asset.css("lib/d3c3/c3.min.css") | $raw %]
47
[% Asset.css("lib/d3c3/c3.min.css") | $raw %]
Lines 697-707 canned reports and writing custom SQL reports.</p> Link Here
697
697
698
[% IF ( execute ) %]
698
[% IF ( execute ) %]
699
<h1>[% name | html %]</h1>
699
<h1>[% name | html %]</h1>
700
[% INCLUDE 'chart.inc' %]
701
[% IF ( notes ) %]<p><span class="label">Notes:</span> [% notes | html %]</p>[% END %]
700
[% IF ( notes ) %]<p><span class="label">Notes:</span> [% notes | html %]</p>[% END %]
702
[% IF ( unlimited_total ) %]<p><span class="label">Total number of results:</span> [% unlimited_total | html %][% IF unlimited_total > limit %] ([% limit | html %] shown)[% END %].</p>[% END %]
701
[% IF ( unlimited_total ) %]<p><span class="label">Total number of results:</span> [% unlimited_total | html %][% IF unlimited_total > limit %] ([% limit | html %] shown)[% END %].</p>[% END %]
703
<div id="sql_output" style="display:none;"><span class="label">Report SQL:</span><pre>[% sql | html %]</pre></div>
702
<div id="sql_output" style="display:none;"><span class="label">Report SQL:</span><pre>[% sql | html %]</pre></div>
704
</br>
703
704
<div>
705
    <a href="#" id="toggle_chart_settings_hid" class="toggle_chart_settings" style="display:none"><i class="fa fa-eye-slash"></i> Hide chart</a>
706
    <a href="#" id="toggle_chart_settings_vis" class="toggle_chart_settings" style="display:none"><i class="fa fa fa-eye"></i> Show chart</a>
707
</div>
708
<div id="chart" class="clearfix"></div>
705
709
706
<form action="/cgi-bin/koha/reports/guided_reports.pl" method="get" id="limitselect">
710
<form action="/cgi-bin/koha/reports/guided_reports.pl" method="get" id="limitselect">
707
    <input type="hidden" name="phase" value="Run this report"/>
711
    <input type="hidden" name="phase" value="Run this report"/>
Lines 758-763 canned reports and writing custom SQL reports.</p> Link Here
758
    </form>
762
    </form>
759
763
760
[% END %]
764
[% END %]
765
766
[% INCLUDE 'chart.inc' %]
767
761
[% END %]
768
[% END %]
762
769
763
[% IF ( create ) %]
770
[% IF ( create ) %]
Lines 1059-1067 canned reports and writing custom SQL reports.</p> Link Here
1059
            [% IF results && !errors %]
1066
            [% IF results && !errors %]
1060
                $('#draw-chart').click(function() {
1067
                $('#draw-chart').click(function() {
1061
1068
1062
                    var btn_text = $("#draw-chart").html();
1063
                    $("#draw-chart").html(_("Loading..."));
1064
1065
                    var x_elements = $('select[name="x"]').val();
1069
                    var x_elements = $('select[name="x"]').val();
1066
                    var y_elements = [];
1070
                    var y_elements = [];
1067
                    var groups = [];
1071
                    var groups = [];
Lines 1125-1134 canned reports and writing custom SQL reports.</p> Link Here
1125
                    options.lines = lines;
1129
                    options.lines = lines;
1126
1130
1127
                    chart = create_chart(kept_headers, kept_results, x_elements, y_elements, groups, options);
1131
                    chart = create_chart(kept_headers, kept_results, x_elements, y_elements, groups, options);
1128
                    $('#chart').prepend('<div style="font-size: 1rem; text-align: center;">' + "[% name | html %]" + '</div>');
1132
                    $("#download-chart,#toggle_chart_settings_hid,#chart").show();
1129
                    $('#download-chart').show();
1133
                    $("#toggle_chart_settings_vis").hide();
1130
                    $("#draw-chart").html(_(btn_text));
1134
                    $("#chartModal").modal("hide");
1131
                    $("html, body").animate({ scrollTop: $(document).height() }, "slow");
1132
                });
1135
                });
1133
            [% END %]
1136
            [% END %]
1134
            [% IF ( create ) %]
1137
            [% IF ( create ) %]
Lines 1267-1293 canned reports and writing custom SQL reports.</p> Link Here
1267
                });
1270
                });
1268
            [% END %]
1271
            [% END %]
1269
1272
1270
                $(".toggle_sql").click(function(){
1273
            $(".toggle_sql").click(function(){
1271
                    $("#sql_output").toggle();
1274
                $("#sql_output").toggle();
1272
                    $("#toggle_sql_hid").toggle();
1275
                $("#toggle_sql_hid").toggle();
1273
                    $("#toggle_sql_vis").toggle();
1276
                $("#toggle_sql_vis").toggle();
1274
                });
1277
            });
1275
1278
1276
                $(".toggle_chart_settings").click(function(){
1279
            $(".toggle_chart_settings").click(function(){
1277
                    $("#makechart").toggle();
1280
                $("#chart, #toggle_chart_settings_hid, #toggle_chart_settings_vis").toggle();
1278
                    $("#toggle_chart_settings_hid").toggle();
1281
            });
1279
                    $("#toggle_chart_settings_vis").toggle();
1280
                });
1281
1282
1282
                $("#table_reports").delegate(".confirmdelete", 'click', function(){
1283
            $("#table_reports").delegate(".confirmdelete", 'click', function(){
1283
                    $(this).parents('tr').attr("class","warn");
1284
                $(this).parents('tr').attr("class","warn");
1284
                    if(confirm(_("Are you sure you want to delete this saved report?"))){
1285
                if(confirm(_("Are you sure you want to delete this saved report?"))){
1285
                        return true;
1286
                    return true;
1286
                    } else {
1287
                } else {
1287
                        $(this).parents('tr').attr("class","");
1288
                    $(this).parents('tr').attr("class","");
1288
                        return false;
1289
                    return false;
1289
                    }
1290
                }
1290
                });
1291
            });
1291
1292
1292
            [% IF (create || editsql || save) %]
1293
            [% IF (create || editsql || save) %]
1293
                $("#select_group").change(function() {
1294
                $("#select_group").change(function() {
Lines 1341-1361 canned reports and writing custom SQL reports.</p> Link Here
1341
            $(".delete").on("click",function(){
1342
            $(".delete").on("click",function(){
1342
                return confirmDelete(MSG_CONFIRM_DELETE);
1343
                return confirmDelete(MSG_CONFIRM_DELETE);
1343
            });
1344
            });
1345
1346
            $("#column_submit").submit(function() {
1347
                if ($("#selectedColumns option").size() < 1) {
1348
                    alert(_("No columns selected!"));
1349
                    return false;
1350
                }
1351
                $("#selectedColumns option").attr("selected", "selected");  // Select everything still in #selectedColumns
1352
                return true;
1353
            });
1344
        });
1354
        });
1355
1345
        function addColumn() {
1356
        function addColumn() {
1346
            $("#availableColumns option:selected").clone().appendTo("#selectedColumns").attr("selected", "selected");
1357
            $("#availableColumns option:selected").clone().appendTo("#selectedColumns").attr("selected", "selected");
1347
        }
1358
        }
1348
        function delColumn() {
1359
        function delColumn() {
1349
            $("#selectedColumns option:selected").remove();
1360
            $("#selectedColumns option:selected").remove();
1350
        }
1361
        }
1351
        $("#column_submit").submit(function() {
1352
            if ($("#selectedColumns option").size() < 1) {
1353
                alert(_("No columns selected!"));
1354
                return false;
1355
            }
1356
            $("#selectedColumns option").attr("selected", "selected");  // Select everything still in #selectedColumns
1357
            return true;
1358
        });
1359
    </script>
1362
    </script>
1360
[% END %]
1363
[% END %]
1361
1364
1362
- 

Return to bug 22168