Tickets Module
Update Ticket Configurations
To update the ticket configurations use the following code snippet: - import {ZohoDeskPortalTicket} from '@zohocorp/zohodesk-portal-ticket';
//This is the default value for this configuration
ZohoDeskPortalTicket.updateConfiguration({
isReplyAllowed: true,
isCommentAllowed: true,
isTicketUpdateAllowed: true,
isCommentEditAllowed: true,
isCommentDeleteAllowed: true,
isAddTicketAllowed: true,
isCustomerHappinessThreadAllowed: true,
isTicketChannelAllowed: true,
isTicketPropertiesAllowed: true,
disableTicketDetailSearch: false
})
By default, all the configurations are enabled. If any of the functionalities need to be disabled, the above can be used to disable some specific functionalities.
Method name | Functions | Default enabled/disabled status |
isReplyAllowed
| To allow reply the reply option
| Enabled
|
isCommentAllowed
| To allow the comment option
| Enabled |
isTicketUpdateAllowed
| To allow ticket update
| Enabled |
isCommentEditAllowed
| To allow the comment option
| Enabled |
isAddTicketAllowed
| To allow add ticket option
| Enabled |
isCustomerHappinessThreadAllowed
| To allow customer happiness thread
| Enabled |
isTicketChannelAllowed
| To allow ticket channel
| Enabled |
isTicketPropertiesAllowed
| To Show ticket properties
| Enabled |
disableTicketDetailSearch
| To disable the ticket screen search
| Disabled |
GetCallbackOnCreate
In case the callback needs to be received when users submit tickets, use the following code snippet:
- import {ZohoDeskPortalSubmitTicket} from '@zohocorp/zohodesk-portal-ticket';
ZohoDeskPortalSubmitTicket.getCallbackOnCreate((success)=>{
console.log(success)
},(error)=>{
console.log(error)
});
Get Departments
Add the following code snippet to fetch the list of Departments available in the Help Center.
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit'
ZohoDeskPortalSDK.getDepartments((success)=>{
console.log(success)
},(error) => {
console.log(error)
}
Get Layouts
Add the following code snippet to fetch the list of Layouts available in the Help-center:
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit'
var QueryParams = {
'departmentId': 'your_departmentId',
'limit': '1'
}
ZohoDeskPortalSDK.getLayouts(QueryParams,
(success) => {
console.log(success);
},
(error) => {
console.log(error);
}
)
Query Params
- departmentId - ID of the department in which the layouts are configured.
- layoutName - Name of the layout used as the keyword for the search.
- from - from index.
- limit - no of layouts to be fetched.
Get Products
To get the products of a specific department, use the following code snippet:
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit'
var departmentID = 'Your_departmentID'
var queryParams = {
'limit': '1'
}
ZohoDeskPortalSDK.getProducts(departmentID,queryParams
,(success) => {
console.log(success);
}, (error) => {
console.log(error);
})
Query Params
- departmentID - The departmentID of the products.
- from - The from limit for listing agents.
- limit - The number of records to be fetched.
The Submit Ticket form in your ASAP help widget displays the same fields configured in the ticket layout in your Zoho Desk portal. To hide any of the fields in the form, you can use the setTicketsFieldsListTobeShown() method.
After you include this method, the form displays only the fields you passed:
- import {ZohoDeskPortalSubmitTicket} from '@zohocorp/zohodesk-portal-ticket';
import {ZDVisibleTicketField} from
'@zohocorp/zohodesk-portal-ticket/src/Components/ZDPortalSubmitTicketWrapper';
const visibleField = new ZDVisibleTicketField('departmentId', 'layoutId', ['subject']);
const visibleFields = [visibleField];
ZohoDeskPortalSubmitTicket.setFieldsListTobeShown(visibleFields);
setFieldsListTobeShown method takes a param which is a List of ZDVisibleTicketField.
- class ZDVisibleTicketField {
constructor(departmentId, layoutId, fieldNames) {
this.departmentId = departmentId;
this.layoutId = layoutId;
this.fieldNames = fieldNames;
}
Params
- departmentId - ID of the department for which you want to configure the Ticket Fields list.
- layoutId - ID of the particular layout for which you want to configure the Ticket Fields.
- fieldNames - List of apiNames of Fields which need to be shown.
If you want to hide a mandatory field in the form, you can do so, provided the field's value is prefilled. To do this, you must use the preFillTicketFields() method:
- import {ZohoDeskPortalSubmitTicket} from '@zohocorp/zohodesk-portal-ticket';
import {ZDCustomizedTicketField, ZDCustomizedTicketForm} from
'@zohocorp/zohodesk-portal-ticket/src/Components/ZDPortalSubmitTicketWrapper';
const ticketField1 = new ZDCustomizedTicketField('fieldName', 'This is pre fill value', true);
const ticketField2 = new ZDCustomizedTicketField('fieldName', '5678', true);
const ticketForm = new ZDCustomizedTicketForm('departmentId', 'layoutId',
[ticketField1, ticketField2]);
const ticketForms = [ticketForm];
ZohoDeskPortalSubmitTicket.preFillTicketFields(ticketForms)
preFillTicketFields method takes ticketForms (list of TicketForm object) as input:
- class ZDCustomizedTicketForm {
constructor(departmentId, layoutId, customizedTicketFields) {
this.departmentId = departmentId;
this.layoutId = layoutId;
this.customizedTicketFields = customizedTicketFields;
}
}
ZDPCustomisedTicketForm can be created with following input:
- departmentId - ID of the department for which you want to configure the Ticket Fields list.
- layoutId - ID of the particular layout for which you want to configure the Ticket Fields.
- customisedTicketFields - List of ZDCustomizedTicketField objects.
- class ZDCustomizedTicketField {
constructor(fieldName, value, isEditable) {
this.fieldName = fieldName;
this.value = value;
this.isEditable = isEditable;
}
}
ZDCustomizedTicketField can be created with following input:
- filedName - apiName of the TicketField
- value - Object default value of the Ticket Field
- isEditable - indicates, whether this field can be editable
AddAttachments
Add attachments for the tickets using the following code snippet:
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit'
var fileName = "HelloWorld.txt"
ZohoDeskPortalSDK.addAttachments(fileName,base64Data, (success)=>{
console.log(success);
},(error)=>{
console.log(error);
}
Params
- FileName - The pass the file name with .extension.
- base64Data - To convert the attachment to a base64 format.
CreateTicket
To create a new ticket for an authenticated user (only users logged in through the ASAP SDK can create tickets using this method):
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit';
var ticketData = {
"cf" : {
"data" : "cf_new_data s"
},
"phone" : "your_phone_number",
"subject" : "ticket_subject",
"departmentId" : "your_DepartmentID",
"description" : "your_ticket_description",
"priority" : "High",
"classification" : "ticket_classification"
}
ZohoDeskPortalSDK.createTicket(ticketData,(success)=>{
console.log(success)
},(error) =>{
console.log(error)
})
Create Guest Ticket
To create a new ticket for guest users (users who are not logged into the ASAP SDK are allowed to create tickets using this method):
- import {ZohoDeskPortalSDK} from '@zohocorp/zohodesk-portal-apikit';
var ticketGuestData = {
"cf" : {
"data" : "cf_new_data"
},
"phone" : "your_phone_number",
"contactName" : "your_contact_name",
"subject" : "New Ticket API",
"departmentId" : "your_DepartemnetID",
"description" : "description of the ticket",
"priority" : "High",
"classification" : "ticket_classification",
"email" : "yourmail@gmail.com"
}
ZohoDeskPortalSDK.createGuestTicket(ticketGuestData,(success)=>{
console.log(success)
},(error) =>{
console.log(error)
})
TicketData Query Params
- Subject - The subject of the ticket.
- contactName - Name of the ticket creator.
- email - Email address of the ticket creator.
- Phone - Customer’s contact phone number (optional).
- departmentId - The ID for the department handling the ticket.
ShowTicketDetail
To open the specific tickets detail screen, use the following code snippet:
- import {ZohoDeskPortalTicket} from '@zohocorp/zohodesk-portal-ticket';
ZohoDeskPortalTicket.showTicketDetail("Your_ticket_Id")