Redesign - tabela s podatki - fullscreen mode
This commit is contained in:
parent
1979c669bd
commit
fb03e770d1
@ -90,6 +90,8 @@ class SurveyDataDisplay{
|
||||
'dataIcons_write'=>false); #ali prikazujemo ikone za urejanje
|
||||
|
||||
static private $displayEditIconsSettings = false; # ali prikazujemo okno s checkboxi za nastavitve tabele s podatki
|
||||
|
||||
static private $displayDataFullscreen = false; # ali prikazujemo podatke v fullscreen pogledu
|
||||
|
||||
static private $printPreview = false; # ali prikazujemo podatke kot print preview;
|
||||
|
||||
@ -215,6 +217,9 @@ class SurveyDataDisplay{
|
||||
|
||||
if(isset($_SESSION['sid_'.self::$sid]['dataIcons_settings']))
|
||||
self::$displayEditIconsSettings = ($_SESSION['sid_'.self::$sid]['dataIcons_settings']);
|
||||
|
||||
if(isset($_SESSION['sid_'.self::$sid]['data_fullscreen']))
|
||||
self::$displayDataFullscreen = ($_SESSION['sid_'.self::$sid]['data_fullscreen']);
|
||||
|
||||
# ali filtriramo cms usejreve datotekoe
|
||||
session_start();
|
||||
@ -1116,13 +1121,19 @@ class SurveyDataDisplay{
|
||||
// Zgornje nastavitve nad tabelo
|
||||
echo '<div class="data_table_top_holder">';
|
||||
|
||||
|
||||
// Navaden pogled / fullscreen
|
||||
echo '<div class="dataFullscreen">';
|
||||
|
||||
echo ' <button id="data_fullscreen_0" class="small white-blue '.(!self::$displayDataFullscreen ? 'active' : '').'" onClick="data_fullscreen(\'0\');">'.$lang['srv_displaydata_fullscreen_0'].'</button>';
|
||||
echo ' <button id="data_fullscreen_1" class="small white-blue '.(self::$displayDataFullscreen ? 'active' : '').'" onClick="data_fullscreen(\'1\');">'.$lang['srv_displaydata_fullscreen_1'].'</button>';
|
||||
|
||||
echo '</div>';
|
||||
|
||||
|
||||
// Checkboxa za urejanje in izpise podatkov ter razpiranje dodatnih nastavitev
|
||||
echo '<div class="dataSettingsBasic">';
|
||||
|
||||
$arrow = (isset($_SESSION['sid_' . self::$sid]['dataIcons_settings'])) ? $_SESSION['sid_' . self::$sid]['dataIcons_settings'] : 0;
|
||||
echo ' <button id="toggleDataCheckboxes" class="small white-blue" onClick="toggleDataCheckboxes(\'data\');"><span class="faicon plus"></span>'.$lang['srv_displaydata_columns'].'</button>';
|
||||
|
||||
echo '</div>';
|
||||
|
||||
|
||||
|
@ -4653,6 +4653,24 @@ function toggleDataCheckboxes(podstran){
|
||||
}
|
||||
}
|
||||
|
||||
// Preklop tabele s podatki - fullscreen / navaden pogled
|
||||
function data_fullscreen(data_fullscreen){
|
||||
|
||||
// Fullscreen
|
||||
if(data_fullscreen == 1){
|
||||
$('body').addClass('data_fullscreen');
|
||||
$('#data_fullscreen_1').addClass('active');
|
||||
$('#data_fullscreen_0').removeClass('active');
|
||||
}
|
||||
else{
|
||||
$('body').removeClass('data_fullscreen');
|
||||
$('#data_fullscreen_0').addClass('active');
|
||||
$('#data_fullscreen_1').removeClass('active');
|
||||
}
|
||||
|
||||
$.post('ajax.php?t=dataSettingProfile&a=changeDataFullscreen', {anketa: srv_meta_anketa_id, data_fullscreen:data_fullscreen});
|
||||
}
|
||||
|
||||
// Iskanje po tabeli s podatki
|
||||
function data_search_filter(){
|
||||
|
||||
|
@ -4401,6 +4401,9 @@ $lang = array (
|
||||
"srv_invitation_preview" => "Predogled",
|
||||
"srv_invitation_send" => "Pošlji e-maile",
|
||||
"srv_displaydata_columns" => "Prikaz stolpcev",
|
||||
"srv_displaydata_fullscreen_0" => "Osnovni",
|
||||
"srv_displaydata_fullscreen_1" => "Cel zaslon",
|
||||
"srv_displaydata_columns" => "Prikaz stolpcev",
|
||||
"srv_displaydata_relevance" => "Ustreznost enote (DA/NE)",
|
||||
"srv_displaydata_invitation" => "Vabilo",
|
||||
"srv_displaydata_data" => "Odgovori respondentov",
|
||||
|
@ -4379,6 +4379,8 @@ $lang = array (
|
||||
"srv_invitation_preview" => "Preview",
|
||||
"srv_invitation_send" => "Send e-mails",
|
||||
"srv_displaydata_columns" => "Show columns",
|
||||
"srv_displaydata_fullscreen_0" => "Basic",
|
||||
"srv_displaydata_fullscreen_1" => "Fullscreen",
|
||||
"srv_displaydata_relevance" => "Eligible",
|
||||
"srv_displaydata_invitation" => "Invitation",
|
||||
"srv_displaydata_data" => "Respondent data",
|
||||
|
@ -16657,6 +16657,41 @@ dl.arch_email dd {
|
||||
border: 1px solid #E5E5E5;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen {
|
||||
display: flex;
|
||||
margin-right: 8px;
|
||||
padding-right: 8px;
|
||||
border-right: 1px #C4C4C4 solid;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue {
|
||||
height: 28px;
|
||||
width: auto;
|
||||
min-width: auto;
|
||||
padding: 0 16px;
|
||||
line-height: 12px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #A9A9A9;
|
||||
border: 1px #E5E5E5 solid;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue.active {
|
||||
color: #1E88E5;
|
||||
border: 1px #1E88E5 solid;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue#data_fullscreen_0 {
|
||||
border-radius: 2px 0 0 2px;
|
||||
border-right: 0;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue#data_fullscreen_0.active {
|
||||
border-right: 1px #1E88E5 solid;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue#data_fullscreen_1 {
|
||||
border-radius: 0 2px 2px 0;
|
||||
border-left: 0;
|
||||
}
|
||||
.data_table_top_holder .dataFullscreen button.white-blue#data_fullscreen_1.active {
|
||||
border-left: 1px #1E88E5 solid;
|
||||
}
|
||||
.data_table_top_holder .dataSettingsBasic {
|
||||
display: flex;
|
||||
margin-right: 8px;
|
||||
@ -16666,6 +16701,7 @@ dl.arch_email dd {
|
||||
.data_table_top_holder .dataSettingsBasic button.white-blue {
|
||||
height: 28px;
|
||||
width: 140px;
|
||||
min-width: auto;
|
||||
padding: 0;
|
||||
line-height: 12px;
|
||||
font-size: 14px;
|
||||
@ -16727,6 +16763,7 @@ dl.arch_email dd {
|
||||
z-index: 99999;
|
||||
position: absolute;
|
||||
top: 41px;
|
||||
left: 205px;
|
||||
border-radius: 2px;
|
||||
}
|
||||
.data_table_top_holder #dataSettingsCheckboxes a {
|
||||
@ -16873,115 +16910,6 @@ dl.arch_email dd {
|
||||
}
|
||||
}
|
||||
}*/
|
||||
/*.dataCell {
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
||||
width: 100%;
|
||||
min-width: 20px;
|
||||
max-height: 1.1em;
|
||||
|
||||
padding: 3px 0;
|
||||
text-indent: 3px;
|
||||
|
||||
&:hover {
|
||||
.tableResize {
|
||||
background-color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.headerCell {
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
col {
|
||||
width: 100px;
|
||||
}
|
||||
col.data_edit {
|
||||
width: 23px;
|
||||
}
|
||||
td {
|
||||
padding: 3px;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
line-height: 18px;
|
||||
.highlighted {
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
background-color: yellow;
|
||||
}
|
||||
}
|
||||
td.data_edit {
|
||||
.pdf {
|
||||
cursor: pointer;
|
||||
}
|
||||
.rtf {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli2 {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli3 {
|
||||
cursor: pointer;
|
||||
}
|
||||
.mfdps {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
select {
|
||||
font-size: 11px !important;
|
||||
width: 100%;
|
||||
}
|
||||
th.hover {
|
||||
background-color: $gray;
|
||||
}
|
||||
tbody {
|
||||
.active {
|
||||
background-color: $gray !important;
|
||||
}
|
||||
tr {
|
||||
&:nth-child(odd) {
|
||||
}
|
||||
&:nth-child(even) {
|
||||
background-color: $gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
.delete_data_row {
|
||||
margin: 0;
|
||||
}
|
||||
.scrollContent.coding {
|
||||
td {
|
||||
&:hover {
|
||||
background-color: $gray;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
td.enkaIcon {
|
||||
&:hover {
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
td.cellGreen {
|
||||
&:hover {
|
||||
background-color: #E6FFCC;
|
||||
cursor: auto;
|
||||
}
|
||||
}
|
||||
}*/
|
||||
}
|
||||
#div_vnosi_data #tableContainer table#dataTable tr td,
|
||||
#div_vnosi_data #tableContainer table#dataTable tr th {
|
||||
@ -17122,6 +17050,36 @@ dl.arch_email dd {
|
||||
background-color: #F8F8F8;
|
||||
}
|
||||
|
||||
body.data_fullscreen header,
|
||||
body.data_fullscreen footer {
|
||||
display: none;
|
||||
}
|
||||
body.data_fullscreen #analiza_data {
|
||||
overflow: hidden;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 16px;
|
||||
margin: 0;
|
||||
background-color: #FFFFFF;
|
||||
}
|
||||
body.data_fullscreen #analiza_data .top_note {
|
||||
display: none;
|
||||
}
|
||||
body.data_fullscreen #analiza_data #div_vnosi_data #tableContainer {
|
||||
overflow-x: auto;
|
||||
max-height: calc(100vh - 100px);
|
||||
}
|
||||
body.data_fullscreen #analiza_data #div_vnosi_data #tableContainer #dataTableScroller {
|
||||
display: none;
|
||||
}
|
||||
body.data_fullscreen #analiza_data .data_table_bottom_holder {
|
||||
display: none;
|
||||
}
|
||||
|
||||
fieldset#calculations div.icon_holder {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
@ -238,120 +238,54 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
/*.dataCell {
|
||||
position: relative;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
|
||||
width: 100%;
|
||||
min-width: 20px;
|
||||
max-height: 1.1em;
|
||||
|
||||
padding: 3px 0;
|
||||
text-indent: 3px;
|
||||
|
||||
&:hover {
|
||||
.tableResize {
|
||||
background-color: $blue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.headerCell {
|
||||
white-space: nowrap;
|
||||
padding: 3px;
|
||||
}
|
||||
|
||||
th {
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
cursor: pointer;
|
||||
}
|
||||
col {
|
||||
width: 100px;
|
||||
}
|
||||
col.data_edit {
|
||||
width: 23px;
|
||||
}
|
||||
td {
|
||||
padding: 3px;
|
||||
font-weight: normal;
|
||||
text-align: left;
|
||||
max-width: 200px;
|
||||
overflow: hidden;
|
||||
line-height: 18px;
|
||||
.highlighted {
|
||||
font-weight: bold;
|
||||
color: red;
|
||||
background-color: yellow;
|
||||
}
|
||||
}
|
||||
td.data_edit {
|
||||
.pdf {
|
||||
cursor: pointer;
|
||||
}
|
||||
.rtf {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli2 {
|
||||
cursor: pointer;
|
||||
}
|
||||
.evoli3 {
|
||||
cursor: pointer;
|
||||
}
|
||||
.mfdps {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
select {
|
||||
font-size: 11px !important;
|
||||
width: 100%;
|
||||
}
|
||||
th.hover {
|
||||
background-color: $gray;
|
||||
}
|
||||
tbody {
|
||||
.active {
|
||||
background-color: $gray !important;
|
||||
}
|
||||
tr {
|
||||
&:nth-child(odd) {
|
||||
}
|
||||
&:nth-child(even) {
|
||||
background-color: $gray;
|
||||
}
|
||||
}
|
||||
}
|
||||
.delete_data_row {
|
||||
margin: 0;
|
||||
}
|
||||
.scrollContent.coding {
|
||||
td {
|
||||
&:hover {
|
||||
background-color: $gray;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
td.enkaIcon {
|
||||
&:hover {
|
||||
background-color: white;
|
||||
}
|
||||
}
|
||||
td.cellGreen {
|
||||
&:hover {
|
||||
background-color: #E6FFCC;
|
||||
cursor: auto;
|
||||
}
|
||||
}
|
||||
}*/
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// Fullscreen tabela
|
||||
body.data_fullscreen{
|
||||
|
||||
header,
|
||||
footer{
|
||||
display: none;
|
||||
}
|
||||
|
||||
#analiza_data{
|
||||
overflow: hidden;
|
||||
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
box-sizing: border-box;
|
||||
padding: 16px;
|
||||
margin: 0;
|
||||
|
||||
background-color: $white;
|
||||
|
||||
.top_note{
|
||||
display: none;
|
||||
}
|
||||
|
||||
#div_vnosi_data{
|
||||
|
||||
#tableContainer{
|
||||
overflow-x: auto;
|
||||
max-height: calc(100vh - 100px);
|
||||
|
||||
// Puscice za scroll
|
||||
#dataTableScroller{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.data_table_bottom_holder{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -12,6 +12,51 @@
|
||||
border: 1px solid $gray;
|
||||
border-radius: 2px;
|
||||
|
||||
.dataFullscreen{
|
||||
display: flex;
|
||||
|
||||
margin-right: 8px;
|
||||
padding-right: 8px;
|
||||
|
||||
border-right: 1px $dark-gray solid;
|
||||
|
||||
button.white-blue{
|
||||
height: 28px;
|
||||
width: auto;
|
||||
min-width: auto;
|
||||
padding: 0 16px;
|
||||
|
||||
line-height: 12px;
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #A9A9A9;
|
||||
|
||||
border: 1px $gray solid;
|
||||
|
||||
&.active{
|
||||
color: $blue;
|
||||
border: 1px $blue solid;
|
||||
}
|
||||
|
||||
&#data_fullscreen_0{
|
||||
border-radius: 2px 0 0 2px;
|
||||
border-right: 0;
|
||||
|
||||
&.active{
|
||||
border-right: 1px $blue solid;
|
||||
}
|
||||
}
|
||||
&#data_fullscreen_1{
|
||||
border-radius: 0 2px 2px 0;
|
||||
border-left: 0;
|
||||
|
||||
&.active{
|
||||
border-left: 1px $blue solid;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dataSettingsBasic{
|
||||
display: flex;
|
||||
|
||||
@ -23,6 +68,7 @@
|
||||
button.white-blue{
|
||||
height: 28px;
|
||||
width: 140px;
|
||||
min-width: auto;
|
||||
padding: 0;
|
||||
|
||||
line-height: 12px;
|
||||
@ -97,6 +143,7 @@
|
||||
z-index: 99999;
|
||||
position: absolute;
|
||||
top: 41px;
|
||||
left: 205px;
|
||||
|
||||
border-radius: 2px;
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user