From 6906b186adbbc7088183cdbad840f9f369bcda2b Mon Sep 17 00:00:00 2001 From: Harry Bomrah Date: Wed, 2 Sep 2015 18:16:01 +0800 Subject: [PATCH] update by joshua for css --- .../images/tickets/ticket-select-arrow.png | Bin 0 -> 263 bytes app/assets/stylesheets/tickets/_common.scss | 172 ++- .../tickets/_ticket_variables.scss | 2 + .../stylesheets/tickets/ticket_index.scss | 227 ++-- .../stylesheets/tickets/ticket_show.scss | 1033 +++++++++-------- app/controllers/admin/tickets_controller.rb | 12 + app/models/ticket_query_response.rb | 1 + app/views/admin/tickets/_query.html.erb | 41 +- app/views/admin/tickets/_response.html.erb | 41 +- app/views/admin/tickets/_search_form.html.erb | 5 +- app/views/admin/tickets/_ticket.html.erb | 5 +- app/views/admin/tickets/index.html.erb | 2 +- app/views/admin/tickets/search.html.erb | 1 + app/views/admin/tickets/show.html.erb | 110 +- config/routes.rb | 1 + 15 files changed, 975 insertions(+), 678 deletions(-) create mode 100644 app/assets/images/tickets/ticket-select-arrow.png diff --git a/app/assets/images/tickets/ticket-select-arrow.png b/app/assets/images/tickets/ticket-select-arrow.png new file mode 100644 index 0000000000000000000000000000000000000000..7518472f4e07f9436a3c91321a1049c3aa6a49f9 GIT binary patch literal 263 zcmeAS@N?(olHy`uVBq!ia0vp^B0wz0!3HD`IPL*ak|nMYCBgY=CFO}lsSJ)O`AMk? zp1FzXsX?iUDV2pMQ*D5XR(iTPhE&{2`t$$4J+mpJF!R)dD;lRTiHA7wK$ li { - text-shadow: none; - font-size: 0.8125rem; - } + width: 96%; + margin: auto; + max-width: 980px; + background: none; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + > li { + text-shadow: none; + font-size: 0.8125rem; + } } // ticket notification .notice { - position: fixed; - top: -5rem; - font-size: 0.8125rem; - font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; - -webkit-transition: .15s all ease-in-out; - transition: .15s all ease-in-out; - -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1); - margin: 0; + position: fixed; + top: -5rem; + font-size: 0.8125rem; + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + -webkit-transition: .15s all ease-in-out; + transition: .15s all ease-in-out; + -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1); + margin: 0; } .notice-pop { - left: 100px; - padding: 20px 2rem; - color: $white; - background-color: rgba($black, .85); - box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1); - &.in { - top: 60px; - } + left: 100px; + padding: 20px 2rem; + color: $white; + background-color: rgba($black, 0.85); + box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1); + &.in { + top: 60px; + } } .notice-close { - margin-left: 0.625rem; - font-size: 1.0375rem; - vertical-align: middle; - &:hover { - cursor: pointer; - } + margin-left: 0.625rem; + font-size: 1.0375rem; + vertical-align: middle; + &:hover { + cursor: pointer; + } } .notice-bar-on { - #main-wrap { - padding-top: 70px; - } + #main-wrap { + padding-top: 70px; + } } .notice-bar { - position: fixed; - left: 61px; - width: 100%; - color: $white; - background-color: $red; - padding: 10px; - text-indent: 1rem; - &.in { - top: 40px; - } + position: fixed; + left: 61px; + width: 100%; + color: $white; + background-color: $red; + padding: 10px; + text-indent: 1rem; + &.in { + top: 40px; + } } .ticket-wrap { - position: relative; - max-width: 1000px; - width: 96%; - margin: 0 auto; + position: relative; + max-width: 1000px; + width: 96%; + margin: 0 auto; } .ticket-heading-wrap { - background-color: $primary; - -webkit-border-top-left-radius: 4px; - -webkit-border-top-right-radius: 4px; - -moz-border-radius-topleft: 4px; - -moz-border-radius-topright: 4px; - border-top-left-radius: 4px; - border-top-right-radius: 4px; - &.active { - background-color: $red; - } - .ticket-heading { - color: $white; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - font-weight: normal; - font-size: 1.5rem; - margin: 0; - padding: 12px 4rem 12px 1rem; - } + background-color: $primary; + -webkit-border-top-left-radius: 4px; + -webkit-border-top-right-radius: 4px; + -moz-border-radius-topleft: 4px; + -moz-border-radius-topright: 4px; + border-top-left-radius: 4px; + border-top-right-radius: 4px; + -webkit-transition: $t-normal all; + transition: $t-normal all; + &.active { + background-color: $red; + } + .ticket-heading { + color: $white; + font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; + font-weight: normal; + font-size: 1.5rem; + margin: 0; + padding: 12px 4rem 12px 1rem; + } +} + +.ticket-heading-avatar { + line-height: 1.3; + display: inline-block; +} + +.ticket-heading-avatar-name { + font-size: 12px; + font-family: $main-font; } .ticket-meta-wrap { - background-color: $second; - padding: 12px 1rem; - .ticket-meta { - color: #EDF0F1; - float: left; - font-size: 0.8125rem; - @media screen and(max-width: 39.375rem) { - margin-bottom: 10px; - } + background-color: $second; + padding: 12px 1rem; + .ticket-meta { + color: #EDF0F1; + float: left; + font-size: 0.8125rem; + // 700px + @media screen and (max-width: 43.75rem) { + margin-bottom: 10px; } - .ticket-state { - float: right; - > * { - // vertical-align: top; - } + } + .ticket-state { + float: right; + > * { + vertical-align: top; } - .ticket-urgent-btn { - margin-right: 3px; - color: $white; - background-color: $gray; - &.active { - background-color: $red; - color: $white; - } + } + .ticket-urgent-btn { + margin-right: 3px; + color: $white; + background-color: $gray; + &.active { + background-color: $red; + color: $white; } - // 630px - @media screen and (max-width: 39.375rem) { - > div[class^="ticket-"] { - float: none; - } + } + // 700px + @media screen and (max-width: 43.75rem) { + > div[class^="ticket-"] { + float: none; } + } +} + +.ticket-internal-wrap { + text-align: right; } .onoffswitch { - position: relative; - width: 70px; - -webkit-user-select: none; - -moz-user-select: none; - -ms-user-select: none; - display: inline-block; + position: relative; + width: 70px; + -webkit-user-select: none; + -moz-user-select: none; + -ms-user-select: none; + display: inline-block; + &:hover { + .ticket-tooltip-wrap { + display: block; + } + } +} + +.ticket-tooltip-wrap { + display: none; + position: absolute; + left: 0; + top: -130%; + background-color: rgba($black, 0.8); + color: $white; + z-index: 1000; + padding: 6px 0.625rem; + white-space: nowrap; + font-family: $main-font; } .onoffswitch-checkbox { - display: none; + display: none; } .onoffswitch-label { - display: block; - overflow: hidden; - cursor: pointer; - border-radius: 20px; - margin-bottom: 0; + display: block; + overflow: hidden; + cursor: pointer; + border-radius: 0.125rem; + margin-bottom: 0; } .onoffswitch-inner { - display: block; - width: 200%; - margin-left: -100%; - transition: margin .15s ease-in 0s; + display: block; + width: 200%; + margin-left: -100%; + transition: margin .15s ease-in 0s; } .onoffswitch-inner:before, .onoffswitch-inner:after { - display: block; - float: left; - width: 50%; - height: 30px; - padding: 0; - line-height: 30px; - font-size: 12px; - color: white; - font-family: $main-font; - box-sizing: border-box; + display: block; + float: left; + width: 50%; + height: 28px; + padding: 0; + line-height: 28px; + font-size: 12px; + color: white; + font-family: $main-font; + box-sizing: border-box; } .onoffswitch-inner:before { - content: "ON"; - padding-left: 10px; - background-color: $red; - color: $white; + content: "ON"; + padding-left: 10px; + background-color: $red; + color: $white; } .onoffswitch-inner:after { - content: "OFF"; - padding-right: 10px; - background-color: $gray; - color: $white; - text-align: right; + content: "OFF"; + padding-right: 10px; + background-color: $subtle-black; + color: $white; + text-align: right; } .onoffswitch-switch { - display: block; - width: 18px; - height: 18px; - margin: 6px; - background: $white; - position: absolute; - top: 0; - bottom: 0; - right: 40px; - border-radius: 50%; - transition: all .15s ease-in 0s; + display: block; + width: 18px; + height: 18px; + margin: 5px 6px; + background: $white; + position: absolute; + top: 0; + bottom: 0; + right: 40px; + border-radius: 0.125rem; + transition: all .15s ease-in 0s; } +.onoffswitch-checkbox.active + .onoffswitch-label .onoffswitch-inner, .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-inner { - margin-left: 0; + margin-left: 0; } +.onoffswitch-checkbox.active + .onoffswitch-label .onoffswitch-switch, .onoffswitch-checkbox:checked + .onoffswitch-label .onoffswitch-switch { - right: 0px; + right: 0px; } .ticket-action { - position: absolute; - right: 1.4rem; - top: 1.4rem; - transition: .3s all; - .dropdown-menu { - top: 120%; - left: auto; - right: 0; - padding: 15px 0; - border: none; - border-radius: 0.125rem; - min-width: 100px; - .t-btn { - i { - margin-right: 0.3125rem; - } - } - > li { - > a { - padding: 3px 0.75rem; - } - } - li { - > a { - &:hover { - background-color: $second; - background-image: none; - } - } - } - li { - > .ticket-delete { - &:hover { - background-color: $red; - } - } - > .ticket-close { - &:hover { - background-color: $yellow; - } - } - } - } -} - -.ticket-dropdown-icon { - color: rgba($white, .5); - font-size: 1.2rem; - text-align: center; - padding: 2px 0.3125rem; - border-radius: 0.25rem; - border: 3px solid rgba($white, .5); - transition: .2s all; - &:hover { - color: $white; - border-color: $white; - border-radius: 50%; - } -} - -.ticket-category { - position: relative; -} - -.ticket-category-dropdown { - text-transform: uppercase; - color: $white; - &:hover { - color: $white; - } -} - -.ticket-category-select { + position: absolute; + right: 1.4rem; + top: 1.4rem; + transition: .3s all; + .dropdown-menu { top: 120%; left: auto; right: 0; padding: 15px 0; border: none; border-radius: 0.125rem; - min-width: 140px; + min-width: 100px; .t-btn { - i { - margin-right: 0.3125rem; - } + i { + margin-right: 0.3125rem; + } } > li { - > a { - padding: 3px 0.75rem; - } + > a { + padding: 3px 0.75rem; + } } li { - > a { - &:hover { - background-color: $second; - background-image: none; - } + > a { + font-family: $main-font; + &:hover { + background-color: $second; + background-image: none; } + } } li { - > .ticket-delete { - &:hover { - background-color: $red; - } + > .ticket-delete { + &:hover { + background-color: $red; } - > .ticket-close { - &:hover { - background-color: $yellow; - } + } + > .ticket-close { + &:hover { + background-color: $yellow; } + } } + } +} + +.ticket-dropdown-icon { + color: rgba($white, 0.5); + font-size: 1.2rem; + text-align: center; + padding: 2px 0.3125rem; + border-radius: 0.25rem; + border: 3px solid rgba($white, 0.5); + transition: .2s all; + &:hover { + color: $white; + border-color: $white; + border-radius: 50%; + } +} + +.ticket-category { + position: relative; +} + +.ticket-category-dropdown { + text-transform: uppercase; + color: $white; + &:hover { + text-decoration: none; + color: $white; + } +} + +.ticket-category-select { + top: 120%; + left: auto; + right: 0; + padding: 15px 0; + border: none; + border-radius: 0.125rem; + min-width: 140px; + .t-btn { + i { + margin-right: 0.3125rem; + } + } + > li { + > a { + padding: 3px 0.75rem; + } + } + li { + > a { + &:hover { + background-color: $second; + background-image: none; + } + } + } + li { + > .ticket-delete { + &:hover { + background-color: $red; + } + } + > .ticket-close { + &:hover { + background-color: $yellow; + } + } + } } .ticket-query-wrap { - -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1); - box-shadow: 0 2px 15px 0 rgba(0, 0, 0, .1); - background-color: $white; - padding: 10px 1.875rem 30px 1.875rem; - margin-bottom: 30px; + -webkit-box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1); + box-shadow: 0 2px 15px 0 rgba(0, 0, 0, 0.1); + background-color: $white; + padding: 10px 1.875rem 30px 1.875rem; + margin-bottom: 30px; } .ticket-query { - padding: 15px 0 20px 0; - font-size: 0.9375rem; + padding: 15px 0 20px 0; + font-size: 0.9375rem; } .ticket-query-wrap:first-child { - -webkit-border-bottom-right-radius: 0.25rem; - -webkit-border-bottom-left-radius: 0.25rem; - -moz-border-radius-bottomright: 0.25rem; - -moz-border-radius-bottomleft: 0.25rem; - border-bottom-right-radius: 0.25rem; - border-bottom-left-radius: 0.25rem; + -webkit-border-bottom-right-radius: 0.25rem; + -webkit-border-bottom-left-radius: 0.25rem; + -moz-border-radius-bottomright: 0.25rem; + -moz-border-radius-bottomleft: 0.25rem; + border-bottom-right-radius: 0.25rem; + border-bottom-left-radius: 0.25rem; } .ticket-query-wrap:nth-child(1n+2) { - border-radius: 0.25rem; + border-radius: 0.25rem; } // response .ticket-response { - font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; - border: 1px solid lighten($gray, 40%); + font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; + border: 1px solid lighten($gray, 40%); } .ticket-response-heading { - background-color: $second; - outline: 1px solid $second; - display: block; - padding: 6px 0.625rem; - color: $white; - font-size: 0.9375rem; - margin: 0 0 20px; - cursor: pointer; - -webkit-transition: .15s all; - transition: .15s all; - &.collapsed { - margin: 0; - background-color: $gray; - outline-color: $gray; - &:hover { - background-color: $second; - outline-color: $second; - } - } - .ticket-response-heading-collapse { - font-size: 1.2rem; - padding: 2px 5px; + background-color: $second; + outline: 1px solid $second; + display: block; + padding: 6px 0.625rem; + color: $white; + font-size: 0.9375rem; + margin: 0 0 20px; + // cursor: pointer; + -webkit-transition: .15s all; + transition: .15s all; + &.collapsed { + margin: 0; + background-color: $gray; + outline-color: $gray; + &:hover { + background-color: $second; + outline-color: $second; } + } + .ticket-response-heading-collapse { + font-size: 1.2rem; + padding: 2px 5px; + } } .ticket-response-heading-icon { - margin-right: 0.5rem; + margin-right: 0.5rem; } .ticket-response-wrap { - &.collapsed { - height: 0; - overflow: hidden; - } + &.collapsed { + height: 0; + overflow: hidden; + } } .ticket-response-item { - margin: 35px auto; - width: 90%; + margin: 35px auto; + width: 90%; } .ticket-response-meta { - margin-bottom: 10px; - overflow: hidden; + margin-bottom: 10px; + overflow: hidden; } .ticket-response-author { - font-size: 1.25rem; - display: inline-block; - margin-right: 10px; - color: $black; + font-size: 1.25rem; + display: inline-block; + margin-right: 10px; + color: $black; } .ticket-response-avatar { - width: 38px; - height: 38px; - border-radius: 50%; - margin-right: 0.3125rem; + width: 38px; + height: 38px; + border-radius: 50%; + margin-right: 0.3125rem; } .ticket-response-created-date { - display: inline-block; - font-size: 0.8125rem; - font-style: italic; - color: $gray; - border-bottom: 1px dotted darken($light-gray, 5%); + display: inline-block; + font-size: 0.8125rem; + font-style: italic; + color: $gray; + border-bottom: 1px dotted darken($light-gray, 5%); +} + +.ticket-response-delete-wrap { + float: right; +} + +.ticket-response-delete { + font-family: $main-font; + color: $gray; + &:hover { + text-decoration: none; + color: $second; + } } .ticket-response-content { - border: 1px solid lighten($gray, 40%); - padding: 15px 1.5rem; - border-radius: 0.125rem; - font-size: 0.9375rem; - line-height: 1.6; - overflow: auto; + border: 1px solid lighten($gray, 40%); + padding: 15px 1.5rem; + border-radius: 0.125rem; + font-size: 0.9375rem; + line-height: 1.6; + overflow: auto; + &.in-house { + background-color: lighten($light-gray, 3%); + } +} + +.ticket-internal-response-wrap { + margin-top: 20px; +} + +.ticket-internal-response { + display: inline-block; + vertical-align: top; + margin: 0 5px 10px 0; + height: 44px; + line-height: 44px; + background: $gray; + color: $white; + padding: 0 0.625rem; + font-family: $main-font; + font-size: 14px; + border-radius: $t-round; +} + +.ticket-tag-member { + display: inline-block; + vertical-align: top; } .ticket-inhouse-heading { - display: block; - font-size: 12px; + display: block; + font-size: 12px; } // Override select2 styles, I need this evil power #main-wrap { - .select2-container-multi { - margin-right: 0.9375rem; - min-width: 200px; - - .select2-choices { - padding: 0; - border-radius: $t-round; - - .select2-search-field { - input { - padding: 10px 5px; - } - } - } - - .select2-search-choice { - padding: 10px 1.75rem 10px 0.7rem; - border-color: lighten($gray, 20%); - background: $white; - - > div { - &:before { - content: "\F007"; - font-family: FontAwesome; - display: inline-block; - font-size: 0.9375rem; - color: $second; - margin: 0 0.5rem 0 0; - } - } - } - - .select2-search-choice-close { - right: 15px; - left: auto; - - &:before { - content: "\f057"; - font-family: FontAwesome; - position: absolute; - cursor: pointer; - left: 6px; - top: 6px; - font-size: 0.9375rem; - color: $gray; - } - - &:hover { - &:before { - color: $red; - } - } + .select2-container-multi { + margin-right: 0.9375rem; + min-width: 200px; + .select2-choices { + border-radius: $t-round; + background-image: none; + .select2-search-field { + input { + padding: 10px 5px; } + } } + .select2-search-choice { + padding: 10px 1.75rem 10px 0.7rem; + border-color: lighten($gray, 20%); + background: $white; + } + .select2-search-choice-close { + right: 15px; + left: auto; + &:before { + content: "\f057"; + font-family: FontAwesome; + position: absolute; + cursor: pointer; + left: 6px; + top: 6px; + font-size: 0.9375rem; + color: $gray; + } + &:hover { + &:before { + color: $red; + } + } + } + } } .select2-result-label { - > span { - white-space: nowrap; - } + > span { + white-space: nowrap; + } } - .fileupload { - .thumbnail { - max-width: 60%; - height: auto; - } + .thumbnail { + max-width: 60%; + height: auto; + } } // editor .ticket-editor { - padding: 10px 1.8rem 20px; + padding: 10px 1.8rem 20px; +} + +.ticket-submit-btn { + font-size: 14px; + padding: 8px 1rem; + font-family: FontAwesome, Roboto; } // Go back top .go-back-top { - background: $gray; - color: $white; - border-radius: 4px; - width: 50px; - height: 50px; - line-height: 50px; - text-align: center; - text-transform: uppercase; - cursor: pointer; - position: fixed; - right: 1rem; - bottom: 1rem; - -webkit-transition: .15s all; - transition: .15s all; - &:hover { - border-radius: 50%; - background-color: $primary; - } + background: $gray; + color: $white; + border-radius: 4px; + width: 50px; + height: 50px; + line-height: 50px; + text-align: center; + text-transform: uppercase; + cursor: pointer; + position: fixed; + right: 1rem; + bottom: 1rem; + -webkit-transition: .15s all; + transition: .15s all; + &:hover { + border-radius: 50%; + background-color: $primary; + } } // ticket table .ticket-table { - td { - white-space: nowrap; - } + td { + white-space: nowrap; + } } // create ticket .ticket-create-form { - .ticket-create-subject { - width: 77%; - margin-right: 0.625rem; - height: 30px; - } - .ticket-create-type { - width: 20%; - height: 40px; - } + .ticket-create-subject { + width: 77%; + margin-right: 0.625rem; + height: 30px; + } + .ticket-create-type { + width: 20%; + height: 40px; + } } .scroll-element { - border: 5px solid #489ad8; - -webkit-transition: border-color 1s linear; - transition: border-color 1s linear; + border: 20px solid #fff36f; + padding: 0.625rem; + border-radius: 0.25rem; + -webkit-transition: border-color $t-normal linear; + transition: border-color $t-normal linear; +} + +// harry css starts here +.t-avatar { + -webkit-filter: grayscale(100%); + filter: grayscale(100%); + opacity: 0.6; + -webkit-transition: all 1s linear; + transition: all 1s linear; + &.read { + -webkit-filter: grayscale(0); + filter: grayscale(0); + opacity: 1; + } } diff --git a/app/controllers/admin/tickets_controller.rb b/app/controllers/admin/tickets_controller.rb index b93e21d..83bbeef 100644 --- a/app/controllers/admin/tickets_controller.rb +++ b/app/controllers/admin/tickets_controller.rb @@ -197,6 +197,18 @@ class Admin::TicketsController < OrbitAdminController end end + def mark_response_read + response = TicketQueryResponse.find(params[:response_id]) rescue nil + if !response.nil? + response.read_by << current_user.id.to_s if !response.read_by.include?(current_user.id.to_s) + response.save + data = {"success" => true, "user_id" => current_user.id.to_s} + else + data = {"success" => false} + end + render :json => data.to_json + end + def tickets_by_category @table_fields = [:ticket_number, :site_name, :subject, :created_at, :tags, :status, :taken_by, :urgent] statuses = params["type"] == "history" ? ["closed"] : ["open","commenced"] diff --git a/app/models/ticket_query_response.rb b/app/models/ticket_query_response.rb index 9175db1..99b40c7 100644 --- a/app/models/ticket_query_response.rb +++ b/app/models/ticket_query_response.rb @@ -6,6 +6,7 @@ class TicketQueryResponse field :internal_response, type: Boolean, :default => false field :response_by, type: BSON::ObjectId field :user_tags, type: Array, default: [] + field :read_by, type: Array, default: [] scope :for_clients, ->{ where(:internal_response.in => [nil, false]) } diff --git a/app/views/admin/tickets/_query.html.erb b/app/views/admin/tickets/_query.html.erb index 20daf3c..40b64e7 100644 --- a/app/views/admin/tickets/_query.html.erb +++ b/app/views/admin/tickets/_query.html.erb @@ -14,25 +14,30 @@
- - - Internal Response -
-

Tag member

- +
+
+ + + Internal Response +
+
+ + +
+ - +
<% end %>
- \ No newline at end of file + diff --git a/app/views/admin/tickets/_response.html.erb b/app/views/admin/tickets/_response.html.erb index cf512d4..ca97823 100644 --- a/app/views/admin/tickets/_response.html.erb +++ b/app/views/admin/tickets/_response.html.erb @@ -14,24 +14,33 @@
<% dt = DateTime.parse(response.created_at.to_s) %> <%= dt.strftime("%d %B %Y - %H:%M") %>
-

- <%= response.internal_response ? "Inhouse" : "" %> -

-
- <% response.user_tags.each do |u| - user = User.find(u) rescue nil - if !user.nil? - if user.member_profile.avatar.nil? || user.member_profile.avatar.thumb.url == "thumb_person.png" - avatar = "/assets/thumb_person.png" - else - avatar = user.member_profile.avatar.thumb.url - end - end %> - - <% end %> +
+ + + Delete + +
+ +
+
+ <% response.user_tags.each do |u| + user = User.find(u) rescue nil + if !user.nil? + if user.member_profile.avatar.nil? || user.member_profile.avatar.thumb.url == "thumb_person.png" + avatar = "/assets/thumb_person.png" + else + avatar = user.member_profile.avatar.thumb.url + end + end %> +
+ " src="<%= avatar %>" data-avatar-id="<%= user.id.to_s %>"> + <%= user.name %> +
+ <% end %> +
-
+
"> <%= response.response.html_safe %>
\ No newline at end of file diff --git a/app/views/admin/tickets/_search_form.html.erb b/app/views/admin/tickets/_search_form.html.erb index 9a6e5ed..5b96088 100644 --- a/app/views/admin/tickets/_search_form.html.erb +++ b/app/views/admin/tickets/_search_form.html.erb @@ -1,5 +1,4 @@ -
- +

Search tickets @@ -22,4 +21,4 @@

<% end %> -
\ No newline at end of file + diff --git a/app/views/admin/tickets/_ticket.html.erb b/app/views/admin/tickets/_ticket.html.erb index 94e6150..6bca2b0 100644 --- a/app/views/admin/tickets/_ticket.html.erb +++ b/app/views/admin/tickets/_ticket.html.erb @@ -19,7 +19,10 @@
<% if ticket.is_urgent? %> - Urgent + + + Urgent + <% end %> diff --git a/app/views/admin/tickets/index.html.erb b/app/views/admin/tickets/index.html.erb index a1703f8..b80d1c4 100644 --- a/app/views/admin/tickets/index.html.erb +++ b/app/views/admin/tickets/index.html.erb @@ -11,7 +11,7 @@ Urgent Tickets <% @categories.each do |category| %> - <% if !@urgent_tickets[category].nil? %> + <% if !@urgent_tickets[category].blank? %>

diff --git a/app/views/admin/tickets/search.html.erb b/app/views/admin/tickets/search.html.erb index 27a66ad..ea86362 100644 --- a/app/views/admin/tickets/search.html.erb +++ b/app/views/admin/tickets/search.html.erb @@ -8,6 +8,7 @@ <% @categories.each do |category| %>

+ <%= category.title %>

<%= render :partial => "ticket", :collection => @tickets[category] %> diff --git a/app/views/admin/tickets/show.html.erb b/app/views/admin/tickets/show.html.erb index cc29b92..2ca95d4 100644 --- a/app/views/admin/tickets/show.html.erb +++ b/app/views/admin/tickets/show.html.erb @@ -6,10 +6,10 @@ <% content_for :page_specific_javascript do %> <%= javascript_include_tag "lib/jquery.form.js" %> <%= javascript_include_tag "validator" %> - <%= javascript_include_tag "select2/select2.min" %> + <%= javascript_include_tag "select2/select2.min" %> <% end %> <% if !@ticket .nil? %> -<% case @ticket.status +<% case @ticket.status when "open" badge_class = "t-status-open" when "closed" @@ -18,17 +18,32 @@ badge_class = "t-status-processing" end %> - +
+ + + Back to Dashboard + + + + <%= @ticket.registered_site.title %> + +
" >

#<%= @ticket.uid %> - <%= @ticket.subject[0..50] %> <% if !@ticket.taken_by.nil? %> <% user = User.find(@ticket.taken_by) %> - + <% if user.member_profile.avatar.nil? || user.member_profile.avatar.thumb.url == "thumb_person.png" + avatar = "/assets/thumb_person.png" + else + avatar = user.member_profile.avatar.thumb.url + end + %> +
+ + <%= user.name %> +
<% end %>

@@ -79,7 +94,7 @@ <% end %> <% end %>
  • - + Delete @@ -91,27 +106,28 @@
    - + <%= !@ticket.ticket_creater_name.nil? ? @ticket.ticket_creater_name : @ticket.ticket_creater_id %> - + <% dt = DateTime.parse(@ticket.created_at.to_s) %> <%= dt.strftime("%d %B %Y - %H:%M") %>
    <% if @ticket.status != "closed" %> - " id="toggle-urgent"> - - Urgent - + +
    + + " id="myonoffswitch" data-url="/admin/tickets/<%= @ticket.id.to_s %>/toggleurgent">
    - -->     + <% end %> @@ -134,7 +150,7 @@
    -
    +
    • @@ -159,7 +175,7 @@ <% end %>
    <% else %> -
    +
    Error in fetching ticket.
    <% end %> @@ -205,8 +221,18 @@ $(document).ready(function(){ el = $("div[data-scroll-id=" + item + "]"); $('html, body').scrollTop(el.offset().top - 100); el.addClass("scroll-element"); + $.ajax({ + url : "/admin/comments/read", + dataType : "json", + type : "post", + data : {"response_id" : item.split("_")[1]} + }).done(function(data){ + if(data.success){ + el.find("img[data-avatar-id="+ data.user_id +"]").addClass("read"); + } + }) el.one("mouseover",function(){ - el.css( "border-color", "rgba(0,0,0,0)"); + el.css('border-color', 'transparent'); }) } @@ -225,6 +251,7 @@ $(document).ready(function(){ }, placeholder: "Add Members" }); + }) $(".reopen-back-btn").on("click",function(){ for (instance in CKEDITOR.instances) { @@ -237,7 +264,22 @@ $(document).ready(function(){ }else{ return false; } - }) + }); + + + function switchTooltip() { + var $switch = $('.onoffswitch'); + var $input = $switch.children('input'); + var $tooltip = $switch.find('.ticket-tooltip-wrap'); + var activeCls = 'active'; + + if ($input.hasClass(activeCls)) { + $tooltip.text('This ticket is marked urgent, click to unmark'); + } else { + $tooltip.text('Click to mark this ticket urgent'); + } + + } $(".ticket-category-select-option").on("click",function(){ var el = $(this); @@ -245,34 +287,38 @@ $(document).ready(function(){ window.location.href = window.location.pathname + "/changecategory?category_id=" + el.data("category-id"); } return false; - }) - $("#toggle-urgent").on("click",function(){ - var el = $(this); - var mark_urgent = !el.hasClass("active"); + }); + + switchTooltip(); + + $("#myonoffswitch").on("click",function(){ + var $el = $(this); + var mark_urgent = !$el.hasClass("active"); $.ajax({ - url : el.attr("href"), - type : "post", - data : {"mark_urgent" : mark_urgent}, + url : $el.attr("data-url"), + type : "POST", + data : {"mark_urgent": mark_urgent}, dataType : "json" }).done(function(response){ if(response.success){ if(mark_urgent){ if(response.can_make_urgent){ $("#ticket-urgent-marker").addClass('active'); - el.addClass("active"); + $el.addClass("active"); }else{ alert("Urgent quota for this category is already over."); } }else{ $("#ticket-urgent-marker").removeClass('active'); - el.removeClass("active"); + $el.removeClass("active"); } + + switchTooltip(); } }) return false; }) + + - - - diff --git a/config/routes.rb b/config/routes.rb index a79eadb..5149815 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -15,6 +15,7 @@ Rails.application.routes.draw do post "ticket/submit_response" => 'tickets#submit_response' get "tickets/category/:category_id" => 'tickets#tickets_by_category' get "tickets/my_tickets" => 'tickets#my_tickets' + post "comments/read" => 'tickets#mark_response_read' resources :tickets do get "start" get "leave"