diff --git a/client/src/app/admin/panel/tickets/admin-panel-view-ticket.js b/client/src/app/admin/panel/tickets/admin-panel-view-ticket.js index f9f34b20..5d2583ec 100644 --- a/client/src/app/admin/panel/tickets/admin-panel-view-ticket.js +++ b/client/src/app/admin/panel/tickets/admin-panel-view-ticket.js @@ -71,7 +71,7 @@ class AdminPanelViewTicket extends React.Component { retrieveTicket() { API.call({ path: '/ticket/get', - date: { + data: { ticketNumber: this.props.params.ticketNumber } }).then(this.onRetrieveSuccess.bind(this)).catch(this.onRetrieveFail.bind(this)) @@ -82,6 +82,15 @@ class AdminPanelViewTicket extends React.Component { loading: false, ticket: result.data }); + + if(result.data.unreadStaff) { + API.call({ + path: '/ticket/seen', + data: { + ticketNumber: this.props.params.ticketNumber + } + }) + } } onRetrieveFail() { diff --git a/client/src/app/demo/components-demo-page.js b/client/src/app/demo/components-demo-page.js index 1d5da38f..ef679cbd 100644 --- a/client/src/app/demo/components-demo-page.js +++ b/client/src/app/demo/components-demo-page.js @@ -15,6 +15,7 @@ const DropDown = require('core-components/drop-down'); const Menu = require('core-components/menu'); const Tooltip = require('core-components/tooltip'); const Table = require('core-components/table'); +const InfoTooltip = require('core-components/info-tooltip'); let dropDownItems = [{content: 'English'}, {content: 'Spanish'}, {content: 'German'}, {content: 'Portuguese'}, {content: 'Japanese'}]; let secondaryMenuItems = [ @@ -168,6 +169,12 @@ let DemoPage = React.createClass({ return ans; }}/> ) + }, + { + title: 'InfoTooltip', + render: ( + + ) } ], @@ -197,4 +204,4 @@ let DemoPage = React.createClass({ } }); -export default DemoPage; \ No newline at end of file +export default DemoPage; diff --git a/client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.js b/client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.js index c6ea17bc..959fe32f 100644 --- a/client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.js +++ b/client/src/app/main/dashboard/dashboard-ticket/dashboard-ticket-page.js @@ -2,6 +2,9 @@ import React from 'react'; import _ from 'lodash'; import {connect} from 'react-redux'; +import i18n from 'lib-app/i18n'; +import API from 'lib-app/api-call'; + import SessionActions from 'actions/session-actions'; import TicketViewer from 'app-components/ticket-viewer'; @@ -11,16 +14,35 @@ class DashboardTicketPage extends React.Component { tickets: React.PropTypes.array }; + componentDidMount() { + let ticket = this.getTicketData(); + + if(ticket.unread) { + API.call({ + path: '/ticket/seen', + data: { + ticketNumber: ticket.ticketNumber + } + }); + } + } + render() { + let ticketView = i18n('NO_PERMISSION'); + + if(!_.isEmpty(this.getTicketData())) { + ticketView = ; + } + return (
- + {ticketView}
); } getTicketData() { - return _.find(this.props.tickets, {ticketNumber: this.props.params.ticketNumber}); + return _.find(this.props.tickets, {ticketNumber: this.props.params.ticketNumber}) || {}; } retrieveUserData() { @@ -32,4 +54,4 @@ export default connect((store) => { return { tickets: store.session.userTickets }; -})(DashboardTicketPage); \ No newline at end of file +})(DashboardTicketPage); diff --git a/client/src/core-components/info-tooltip.js b/client/src/core-components/info-tooltip.js new file mode 100644 index 00000000..92c6ca24 --- /dev/null +++ b/client/src/core-components/info-tooltip.js @@ -0,0 +1,54 @@ +import React from 'react'; +import classNames from 'classnames'; + +import i18n from 'lib-app/i18n'; +import Icon from 'core-components/icon'; +import Tooltip from 'core-components/tooltip'; + +class InfoTooltip extends React.Component { + static propTypes = { + type: React.PropTypes.oneOf(['default', 'warning']), + text: React.PropTypes.string.isRequired + }; + + static defaultProps = { + type: 'default' + }; + + render() { + let name = (this.props.type === 'default') ? 'question-circle' : 'exclamation-triangle'; + + return ( +
+ + + + + +
+ ); + } + + renderText() { + let message = (this.props.type === 'default') ? i18n('INFO') : i18n('WARNING'); + return ( +
+
+ {message} +
+ {this.props.text} +
+ ); + } + + getClass() { + let classes = { + 'info-tooltip': true, + 'info-tooltip_warning': (this.props.type === 'warning') + }; + + return classNames(classes); + } +} + +export default InfoTooltip; diff --git a/client/src/core-components/info-tooltip.scss b/client/src/core-components/info-tooltip.scss new file mode 100644 index 00000000..63691bad --- /dev/null +++ b/client/src/core-components/info-tooltip.scss @@ -0,0 +1,26 @@ +@import "../scss/vars"; + +.info-tooltip { + &__text { + &-title { + color: $secondary-blue; + font-size: $font-size--md; + } + } + + &__icon { + color: $secondary-blue; + } + + &_warning { + .info-tooltip__icon { + color: $primary-red; + } + + .info-tooltip__text { + &-title { + color: $primary-red; + } + } + } +} diff --git a/client/src/data/fixtures/ticket-fixtures.js b/client/src/data/fixtures/ticket-fixtures.js index 573ccd61..b83a8a76 100644 --- a/client/src/data/fixtures/ticket-fixtures.js +++ b/client/src/data/fixtures/ticket-fixtures.js @@ -78,6 +78,16 @@ module.exports = [ }; } }, + { + path: '/ticket/seen', + time: 200, + response: function () { + return { + status: 'success', + data: {} + }; + } + }, { path: '/ticket/get', time: 1000, @@ -96,6 +106,7 @@ module.exports = [ file: 'http://www.opensupports.com/some_file.zip', language: 'en', unread: false, + unreadStaff: true, closed: false, priority: 'medium', author: { @@ -203,4 +214,4 @@ module.exports = [ }; } } -]; \ No newline at end of file +]; diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js index 3721809b..e964ceec 100644 --- a/client/src/data/languages/en.js +++ b/client/src/data/languages/en.js @@ -72,6 +72,8 @@ export default { 'UN_ASSIGN': 'Unassign', 'VIEW_TICKET': 'View Ticket', 'SELECT_CUSTOM_RESPONSE': 'Select a custom response...', + 'WARNING': 'Warning', + 'INFO': 'Information', 'ALL_DEPARTMENTS': 'All Departments', //VIEW DESCRIPTIONS @@ -112,4 +114,4 @@ export default { 'OLD_PASSWORD_INCORRECT': 'Old password is incorrect', 'WILL_LOSE_CHANGES': 'You haven\'t save. Your changes will be lost.', 'WILL_DELETE_CUSTOM_RESPONSE': 'The custom response will be deleted.' -}; \ No newline at end of file +};