From 31f840c33195b7c4058943d0894a5b44eabaead9 Mon Sep 17 00:00:00 2001 From: tejagerjovic Date: Fri, 2 Sep 2022 06:00:20 +0200 Subject: [PATCH] [Redizajn 1KA v2] Testiranje --> Komentarji - dropdown - v delu --- admin/survey/BranchingAjax.php | 18 +- admin/survey/SurveyAdmin.php | 81 +++++- admin/survey/script/script.js | 7 + public/css/admin_new.css | 125 +++++++++- .../sass/admin_new/basic/icons/standard.scss | 4 + .../pages/survey_testiranje/komentarji.scss | 234 ++++++++++++++---- 6 files changed, 397 insertions(+), 72 deletions(-) diff --git a/admin/survey/BranchingAjax.php b/admin/survey/BranchingAjax.php index 7aa3182f8..531b6a3ba 100644 --- a/admin/survey/BranchingAjax.php +++ b/admin/survey/BranchingAjax.php @@ -2317,7 +2317,7 @@ class BranchingAjax { } } - function add_comment_field ($spremenljivka, $type, $view, $form=true) { + function add_comment_field ($spremenljivka, $type, $view, $form=true, $buttons=true) { global $admin_type; global $global_user_id; global $lang; @@ -2327,15 +2327,17 @@ class BranchingAjax { echo ''; - echo '
'; + if ($buttons) { + echo '
'; - if($_GET['a'] == 'comment_manage') - echo ' '; - else - echo ' '; + if($_GET['a'] == 'comment_manage') + echo ' '; + else + echo ' '; - echo ' '; - echo '
'; + echo ' '; + echo '
'; + } if (($type == 0 || $view==3) && ($admin_type == 0 || $global_user_id==$rowanketa['insert_uid'])) { echo '
'; diff --git a/admin/survey/SurveyAdmin.php b/admin/survey/SurveyAdmin.php index 14b09b545..21566691b 100644 --- a/admin/survey/SurveyAdmin.php +++ b/admin/survey/SurveyAdmin.php @@ -1406,22 +1406,79 @@ class SurveyAdmin if ($nereseno > 99) $nereseno = '99+'; - echo '
'; + echo '
'; echo ''.$nereseno.''; - echo '
'; + } else { - echo '
'; - echo '
'; + echo '
'; } } else{ if ($nereseno > 0) - echo '
'; + echo '
'; else - echo '
'; + echo '
'; } + echo '
'; //zaključi ikono + + //dropdown na klik ikone + echo '
'; + + echo '
'; + echo ''; + echo $lang['comments']; + echo '
'; + + $comment_link = 'window.location.href=\'' . $site_url . 'admin/survey/index.php?anketa='.$row['id'].'&a=komentarji\'; return false;'; + echo '
'; + echo $lang['srv_testiranje_komentarji_anketa_title']; + echo ' (' . $comment_count['question']['unresolved']; + echo '/' . $comment_count['question']['all'] . ')'; + echo ''; + echo '
'; + + $comment_link = 'window.location.href=\'' . $site_url . 'admin/survey/index.php?anketa='.$row['id'].'&a=komentarji_anketa\'; return false;'; + echo '
'; + echo $lang['srv_testiranje_komentarji_title']; + echo ' (' . ($comment_count['survey_resp']['unresolved'] + $comment_count['survey_admin']['unresolved']); //nerešeni + echo '/' . ($comment_count['survey_resp']['all'] + $comment_count['survey_admin']['all']) . ')'; //vsi + echo ''; + echo '
'; + + echo '
'; + $ba = new BranchingAjax($this->anketa); + $ba->add_comment_field(0, '1', '4', false, false); + echo '
'; + + echo '
'; + echo ' '; + + echo '
'; + echo '
'; + echo ''; + echo '
'; + echo '
'; + echo ''; + echo '
'; + echo '
'; + + echo '
'; //button holder + + echo '
'; //comment_dropdown + + // Klik izven - zapremo dropdown + echo ''; + echo '
'; echo ''; } @@ -1433,12 +1490,14 @@ class SurveyAdmin // Preverimo, ce je funkcionalnost v paketu, ki ga ima uporabnik if($userAccess->checkUserAccess('komentarji')) { - echo '
'; + $comment_link = 'window.location.href=\'' . $site_url . 'admin/survey/ajax.php?anketa='.$row['id'].'&a=comments_onoff&do=on\'; return false;'; + echo '
'; } - else - echo '
'; - - echo '
'; + else { + $comment_link = 'window.location.href=\'' . $site_url . 'admin/survey/ajax.php?anketa='.$row['id'].'&a=urejanje\'; return false;'; + echo '
'; + } + echo '
'; echo '
'; echo ''; diff --git a/admin/survey/script/script.js b/admin/survey/script/script.js index 06a1c0a59..b80c0c43f 100644 --- a/admin/survey/script/script.js +++ b/admin/survey/script/script.js @@ -5711,4 +5711,11 @@ function toggleAddUser(){ $("#new_user_option").toggleClass('displayNone'); $("#existing_user_option").toggleClass('displayNone'); +} +function CommentDropdownClearText () { + $("#vsebina_0_4").value = ''; +} + +function toggleCommentDropdown () { + $("#comment_dropdown").toggleClass('displayNone'); } \ No newline at end of file diff --git a/public/css/admin_new.css b/public/css/admin_new.css index 0d72e95df..6a36ba837 100644 --- a/public/css/admin_new.css +++ b/public/css/admin_new.css @@ -6148,6 +6148,10 @@ span.faicon.screwdriver::before { font-weight: 600 !important; } +span.faicon.fa-x::before { + content: "X"; +} + /* To change this license header, choose License Headers in Project Properties. To change this template file, choose Tools | Templates @@ -25664,20 +25668,25 @@ div.page_komentarji_anketa ul div.question_comment_holder div.question_comment . margin: 0px 3px; } -#quick_comments_link a { +#quick_comments_link { + position: relative; text-decoration: none; } -#quick_comments_link a span.link { +#quick_comments_link span.link { display: inline-block; padding: 3px !important; padding-bottom: 5px !important; font-size: 11px; vertical-align: top; } -#quick_comments_link a .fa-stack .comments { +#quick_comments_link .fa-stack { + color: #FFFFFF !important; + cursor: pointer; +} +#quick_comments_link .fa-stack .comments { position: relative; } -#quick_comments_link a .fa-stack .comments .comment_number { +#quick_comments_link .fa-stack .comments .comment_number { position: absolute; color: #1E88E5; left: 0; @@ -25691,7 +25700,7 @@ div.page_komentarji_anketa ul div.question_comment_holder div.question_comment . text-align: center; width: 100%; } -#quick_comments_link a .fa-stack.has_comment::after { +#quick_comments_link .fa-stack.has_comment::after { content: "•"; font-size: 50px; color: #FF8787; @@ -25700,9 +25709,113 @@ div.page_komentarji_anketa ul div.question_comment_holder div.question_comment . right: -13px; z-index: 999; } -#quick_comments_link a .fa-stack.inactive_comments span.faicon::before { +#quick_comments_link .fa-stack.inactive_comments span.faicon::before { color: #0059ab !important; } +#quick_comments_link #comment_dropdown { + position: absolute; + background-color: #FFFFFF; + top: 35px; + right: 0; + width: 305px; + z-index: 9999; + box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.12); + border-radius: 2px; + font-family: Source Sans Pro, sans-serif; + padding: 12px; + cursor: auto !important; +} +#quick_comments_link #comment_dropdown .title { + width: 100%; + margin-bottom: 16px; + padding-bottom: 12px; + font-weight: 600; + font-size: 16px; + text-transform: uppercase; + border-bottom: 1px #E5E5E5 solid; + font-size: 14px !important; + color: #333333; + display: flex; + flex-direction: row; + align-content: center; +} +#quick_comments_link #comment_dropdown .title span.faicon.comment_dropdown { + margin-right: 6px; + line-height: 17px !important; +} +#quick_comments_link #comment_dropdown .title span.faicon.comment_dropdown::before { + color: #1E88E5 !important; + font-weight: 400; + font-size: 14px !important; + content: "\f27a"; +} +#quick_comments_link #comment_dropdown .links { + margin-bottom: 16px; + color: #1E88E5; + font-weight: 400; + font-size: 14px !important; + display: flex; + flex-direction: row; + align-content: center; + cursor: pointer; + width: fit-content; +} +#quick_comments_link #comment_dropdown .links span.faicon { + margin-left: 8px; + line-height: 17px !important; +} +#quick_comments_link #comment_dropdown .links span.faicon::before { + color: #1E88E5 !important; + font-size: 14px !important; +} +#quick_comments_link #comment_dropdown #comment_field { + padding-top: 16px; + border-top: 1px solid #E5E5E5; + margin-bottom: 10px; +} +#quick_comments_link #comment_dropdown #comment_field textarea { + height: 130px; + width: 100%; + margin: 0; +} +#quick_comments_link #comment_dropdown .button_holder { + display: flex; + flex-direction: row; + justify-content: space-between; + padding-top: 8px; + border-top: 1px solid #E5E5E5; + margin-bottom: 0; +} +#quick_comments_link #comment_dropdown .button_holder button { + min-width: 128px; +} +#quick_comments_link #comment_dropdown .button_holder .options { + display: flex; + flex-direction: row; +} +#quick_comments_link #comment_dropdown .button_holder .options .square { + box-sizing: border-box; + border: 1px solid #1E88E5; + width: 28px; + height: 28px; + margin-left: 8px; + display: flex; + justify-content: center; + align-content: center; + color: #1E88E5; + font-size: 14px !important; + cursor: pointer; +} +#quick_comments_link #comment_dropdown .button_holder .options .square.blue { + background-color: #1E88E5; +} +#quick_comments_link #comment_dropdown .button_holder .options .square.blue span.faicon::before { + font-size: 14px !important; + color: #FFFFFF; +} +#quick_comments_link #comment_dropdown .button_holder .options .square span.faicon::before { + font-size: 16px !important; +} #quick_comments_link.newCss { text-align: center; diff --git a/resources/sass/admin_new/basic/icons/standard.scss b/resources/sass/admin_new/basic/icons/standard.scss index d46b83ab3..34f01fdc8 100644 --- a/resources/sass/admin_new/basic/icons/standard.scss +++ b/resources/sass/admin_new/basic/icons/standard.scss @@ -706,4 +706,8 @@ span.faicon.screwdriver::before{ content: "\f7d9"; font-weight: 600 !important; +} + +span.faicon.fa-x::before{ + content: "\58"; } \ No newline at end of file diff --git a/resources/sass/admin_new/pages/survey_testiranje/komentarji.scss b/resources/sass/admin_new/pages/survey_testiranje/komentarji.scss index 73ba4a2d7..3a82ab665 100644 --- a/resources/sass/admin_new/pages/survey_testiranje/komentarji.scss +++ b/resources/sass/admin_new/pages/survey_testiranje/komentarji.scss @@ -681,60 +681,200 @@ div.page_komentarji_anketa { margin: 0px 3px; } #quick_comments_link { - a { - span.link { - display: inline-block; - padding: 3px !important; - padding-bottom: 5px !important; - font-size: 11px; - vertical-align: top; - } - - text-decoration: none; - .fa-stack { - .comments { + position:relative; + + span.link { + display: inline-block; + padding: 3px !important; + padding-bottom: 5px !important; + font-size: 11px; + vertical-align: top; + } + + text-decoration: none; + + .fa-stack { + .comments { + position: relative; + .comment_number { + position: absolute; + color: $blue; + left: 0; + transform: translateX(-50%); + top: 35%; + transform: translateY(-50%); + z-index: 99; + + font-family: $font_family; + font-size: 14px; + font-weight: 400; + + text-align: center; + width: 100%; + } + } + + &.has_comment { + &::after { + content: "•"; + font-size: 50px; + color: $coral; + position: relative; - .comment_number { - position: absolute; - color: $blue; - left: 0; - transform: translateX(-50%); - top: 35%; - transform: translateY(-50%); - z-index: 99; + top: -45px; + right: -13px; + z-index: 999; + + } + } - font-family: $font_family; - font-size: 14px; + color: $white !important; + cursor: pointer; + + &.inactive_comments { + span.faicon::before { + color: $dark-blue !important; + } + } + } + + #comment_dropdown { + position: absolute; + background-color: $white; + top: 35px; + right: 0; + width: 305px; + + z-index: 9999; + + box-shadow: 0px 0px 7px rgba(0, 0, 0, 0.12); + border-radius: 2px; + + font-family: $font_family; + + padding: 12px; + + cursor: auto !important; + + .title { + width: 100%; + margin-bottom: 16px; + padding-bottom: 12px; + + font-weight: 600; + font-size: 16px; + text-transform: uppercase; + + border-bottom: 1px $gray solid; + + font-size: 14px !important; + color: $black; + + display: flex; + flex-direction: row; + align-content: center; + + span.faicon.comment_dropdown { + margin-right: 6px; + line-height: 17px !important; + &::before{ + color: $blue !important; font-weight: 400; - - text-align: center; - width: 100%; - } - - } - - &.has_comment { - &::after { - content: "•"; - font-size: 50px; - color: $coral; - - position: relative; - top: -45px; - right: -13px; - z-index: 999; - - } - } - - &.inactive_comments { - span.faicon::before { - color: $dark-blue !important; + font-size: 14px !important; + content: "\f27a"; } } } - } + + .links { + margin-bottom: 16px; + color: $blue; + + font-weight: 400; + font-size: 14px !important; + + display: flex; + flex-direction: row; + align-content: center; + + cursor: pointer; + width: fit-content; + + + span.faicon { + margin-left: 8px; + line-height: 17px !important; + &::before{ + color: $blue !important; + font-size: 14px !important; + } + } + + } + + #comment_field { + + padding-top: 16px; + border-top: 1px solid $gray; + margin-bottom: 10px; + + textarea { + height: 130px; + width: 100%; + margin: 0; + } + } + + .button_holder { + display: flex; + flex-direction: row; + justify-content: space-between; + padding-top: 8px; + border-top: 1px solid $gray; + + margin-bottom: 0; + + button { + min-width: 128px; + } + + .options { + display: flex; + flex-direction: row; + + .square { + box-sizing: border-box; + border: 1px solid $blue; + width: 28px; + height: 28px; + margin-left: 8px; + + display: flex; + justify-content: center; + align-content: center; + + color: $blue; + font-size: 14px !important; + + cursor: pointer; + + &.blue { + background-color: $blue; + span.faicon::before { + font-size: 14px !important; + color: $white; + } + } + + span.faicon::before { + $font_weight: 400; + font-size: 16px !important; + } + } + } + } + } } #quick_comments_link.newCss { text-align: center;