Skip to content

Instantly share code, notes, and snippets.

@SrdjanCoric

SrdjanCoric/operator.xhtml

Last active May 22, 2018 18:24
Show Gist options
  • Save SrdjanCoric/6b796b105428495a1a39927c9acae960 to your computer and use it in GitHub Desktop.
Save SrdjanCoric/6b796b105428495a1a39927c9acae960 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
operator.xhtml
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:b="http://bootsfaces.net/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<h:head>
<title>Ticket Service</title>
<link href="https://fonts.googleapis.com/css?family=Lato:100,100i,300,300i,400,700" rel="stylesheet" />
<h:outputStylesheet library="css" name="style.css" />
<f:metadata>
<!-- <f:event type="preRenderView" listener="#{facesContext.externalContext.response.setHeader('Cache-Control', 'no-cache, no-store')}" />-->
<f:viewAction action="#{cityController.takeAllCities()}"></f:viewAction>
<f:viewAction action="#{statusControler.takeAllStatus()}"></f:viewAction>
<f:viewAction action="#{ticketTypeController.takeAllTicketType()}"></f:viewAction>
<f:viewAction action="#{requestTypeController.takeAllRequestType()}"></f:viewAction>
</f:metadata>
</h:head>
<h:body class="body">
<div class="header-wrapper">
<b:container class="header-container">
<b:row>
<p:growl id="messages" globalOnly="true" showDetail="false" autoUpdate="true" life="2000" />
<b:column tiny-screen="12" small-screen="8">
<h1>Ticketing Service</h1>
</b:column>
<b:column tiny-screen="12" small-screen="4" class="logged-in">
<span class="avatar"><h:graphicImage class="img" library="img" name="avatar.png" /></span>
<span id="operator-username">#{login.username}</span>
<span class="separator">|</span>
<h:form class="logout-form"><h:commandButton action="#{login.logout()}" id="logout" value="Log out"></h:commandButton></h:form>
</b:column>
</b:row>
<b:row>
<b:column class="nav" tiny-screen="12" small-screen="12">
<b:dropButton look="primary" class="nav-btn" value="Users">
<!-- OVO JE NAV LINK -->
<b:navCommandLink style="font-weight: 700;" class="nav-link" value="Create User" onclick ="PF('createDialog').show();" />
<b:navCommandLink style="font-weight: 700;" class="nav-link" value="Find User" onclick ="PF('searchDialog').show();" href="#" ></b:navCommandLink>
</b:dropButton>
<b:dropButton look="primary" class="nav-btn" value="Tickets">
<b:navLink style="font-weight: 700;" class="nav-link" value="My Tickets" href="#"></b:navLink>
<b:navLink style="font-weight: 700;" class="nav-link" value="Create Ticket" href="#"></b:navLink>
<b:navLink style="font-weight: 700;" class="nav-link" value="Find Ticket" href="#"></b:navLink>
</b:dropButton>
<b:dropButton look="primary" class="nav-btn" value="Groups">
<b:navLink style="font-weight: 700;" class="nav-link" value="Create Group" href="#"></b:navLink>
<b:navLink style="font-weight: 700;" class="nav-link" value="Find Group" href="#"></b:navLink>
<b:navLink style="font-weight: 700;" class="nav-link" value="Add Ticket to group" href="#"></b:navLink>
<b:navLink style="font-weight: 700;" class="nav-link" value="Delete Ticket" href="#"></b:navLink>
</b:dropButton>
<b:dropButton look="primary" class="nav-btn" value="Reports">
<b:navLink style="font-weight: 700;" class="nav-link" value="My reports" href="#"></b:navLink>
</b:dropButton>
</b:column>
<!-- CREATE USER -->
<p:dialog style="dialog" dynamic="true" closable="false" header="Create user" id="createDialog" widgetVar="createDialog" position="center center top left">
<h:form id="create-form">
<h:panelGrid columns="2">
<p:outputLabel style="margin: .5rem;" value="First name"></p:outputLabel>
<p:inputText style="margin: .5rem;" value="#{userController.firstName}" id="firstName" validatorMessage="First Name needs to be at least three characters long" required="true" requiredMessage="First Name is required">
<f:validateLength minimum="3" />
</p:inputText>
<p:outputLabel style="margin: .5rem;" value="Last name"></p:outputLabel>
<p:inputText style="margin: .5rem;" value="#{userController.lastName}" id="lastName" validatorMessage="Last Name needs to be at least three characters long" required="true" requiredMessage="Last Name is required">
<f:validateLength minimum="3" />
</p:inputText>
<p:outputLabel style="margin: .5rem;" value="Phone number"></p:outputLabel>
<p:inputText style="margin: .5rem;" value="#{userController.phoneNumber}" id="phoneNumber" validatorMessage="Please enter valid phone number" required="true" requiredMessage="Phone Number is required">
<f:validateRegex pattern="^[+]?[0-9]+$" />
<f:validateLength minimum="6" />
</p:inputText>
<p:outputLabel style="margin: .5rem;" value="Email"></p:outputLabel>
<p:inputText style="margin: .5rem;" value="#{userController.email}" id="email" required="true" validatorMessage="Please enter valid email" requiredMessage="Email is required">
<f:validateRegex pattern="^[_A-Za-z0-9-\+]+(\.[_A-Za-z0-9-]+)*@[\p{L}\p{M}\p{N}.-]*(\.[\p{L}\p{M}]{2,})$" />
</p:inputText>
<p:outputLabel style="margin: .5rem;" value="Address"></p:outputLabel>
<p:inputText style="margin: .5rem;" value="#{userController.address}" id="address" validatorMessage="Please enter valid address" required="true" requiredMessage="Address is required">
<f:validateLength minimum="5" />
</p:inputText>
<p:outputLabel style="margin: .5rem;" value="City"></p:outputLabel>
<p:selectOneMenu style="margin: .5rem;" value="#{userController.idCity}" >
<f:selectItems value="#{cityController.allCities}" var="city" itemValue="#{city.idCity}" itemLabel="#{city.name}" />
</p:selectOneMenu>
<p:commandButton style="margin: .5rem;" value="Create" update=":create-form" action="#{userController.insertUser}" />
<p:commandButton style="margin: .5rem;" value="Cancel" immediate="true" onclick="createDialog.hide()">
<p:resetInput target=":createDialog" />
</p:commandButton>
</h:panelGrid>
<p:message for="firstName" />
<p:message for="lastName" />
<p:message for="phoneNumber" />
<p:message for="email" />
<p:message for="address" />
</h:form>
</p:dialog>
<!-- FIND USER -->
<p:dialog style="dialog" dynamic="true" closable="false" header="Find user" id="searchDialog" widgetVar="searchDialog" position="center center top left">
<h:form id="searchForm">
<h:panelGrid id="searchUserPanelGrid" columns="2">
<p:outputLabel style="margin: .5rem;" value="User ID:" /><p:inputText style="margin: .5rem;" value="#{userController.id}" />
<p:outputLabel style="margin: .5rem;" value="First name:" /><p:inputText style="margin: .5rem;" value="#{userController.firstName}" />
<p:outputLabel style="margin: .5rem;" value="Last name:" /><p:inputText style="margin: .5rem;" value="#{userController.lastName}" />
<p:outputLabel style="margin: .5rem;" value="E-mail:" /><p:inputText style="margin: .5rem;" value="#{userController.email}" />
<p:outputLabel style="margin: .5rem;" value="City:" />
<p:selectOneMenu style="margin: .5rem;" value="#{userController.idCity}">
<f:selectItems value="#{cityController.allCities}" var="city" itemValue="#{city.idCity}" itemLabel="#{city.name}" />
</p:selectOneMenu>
</h:panelGrid>
<p:commandButton style="margin: .5rem;" value="Search" ajax="false" update=":searchForm" action="#{userController.searchUser}" actionListener="#{ticketController.closeTable()}" />
<p:commandButton style="margin: .5rem;" type="reset" value="Reset" />
<p:commandButton style="margin: .5rem;" value="Cancel" immediate="true" onclick="createDialog.hide()">
<p:resetInput target=":searchDialog" />
</p:commandButton>
</h:form>
</p:dialog>
</b:row>
</b:container>
</div>
<!-- USER TABELA -->
<b:container>
<b:row>
<h:form id="form-table" style="margin-top: 5rem; position: relative;">
<b:dataTable rendered="#{userController.renderUserTable}" id="searchTable" value="#{userController.allUsers}" style="width: 100%;" responsive="true" var="user" excel="true" searching="true" csv="true" pdf="true" columnVisibility="true" copy="true" print="true">
<f:facet name="header" >
<tr>
<th>User ID</th>
<th>First name</th>
<th>Last name</th>
<th>Phone number</th>
<th>E-mail</th>
<th>Address</th>
<th>City</th>
<th>Tickets</th>
<th>Actions</th>
</tr>
</f:facet>
<b:dataTableColumn value="#{user.id}"></b:dataTableColumn>
<b:dataTableColumn value="#{user.firstName}"></b:dataTableColumn>
<b:dataTableColumn value="#{user.lastName}"></b:dataTableColumn>
<b:dataTableColumn value="#{user.phoneNumber}"></b:dataTableColumn>
<b:dataTableColumn value="#{user.email}"></b:dataTableColumn>
<b:dataTableColumn value="#{user.address}"></b:dataTableColumn>
<b:dataTableColumn value="#{userController.takeCityNameById(user.idCity)}"></b:dataTableColumn>
<b:dataTableColumn>
<p:commandLink style="margin: 0 15px;">
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="addTicket.png" />
<p:ajax update=":form-table:addTicketDialog" listener="#{ticketController.renderTickets(user)}" oncomplete="PF('addTicketDialog').show();"></p:ajax>
</p:commandLink>
<h:commandLink action="#{ticketController.renderTickets(user)}" actionListener="#{userController.closeTable()}">
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="viewTicket.png" />
</h:commandLink>
</b:dataTableColumn>
<b:dataTableColumn>
<p:commandLink style="margin: 0 15px;">
<h:graphicImage style="width:20px; height: 20px;" library="img" name="update.png"/>
<p:ajax update=":form-table:updateDialog" listener="#{userController.saveUser(user)}" oncomplete="PF('updateDialog').show();"></p:ajax>
</p:commandLink>
<h:commandLink class="delete" onclick="if (!confirm('Delete user?'))
return false" action="#{userController.deleteUser(user.id)}" >
<f:ajax render="form-table" />
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="delete.png" />
</h:commandLink>
</b:dataTableColumn>
</b:dataTable>
<!-- UPDATE USER -->
<p:dialog style="dialog" dynamic="true" closable="false" header="Update user" id="updateDialog" widgetVar="updateDialog" position="center center top left">
<h:panelGrid columns="2">
<h:outputText style="margin:5px" value="First name"></h:outputText>
<p:inputText style="margin:5px" value="#{userController.firstName}"></p:inputText>
<h:outputText style="margin:5px" value="Last name"></h:outputText>
<p:inputText style="margin:5px" value="#{userController.lastName}"></p:inputText>
<h:outputText style="margin:5px" value="Phone number"></h:outputText>
<p:inputText style="margin:5px" value="#{userController.phoneNumber}"></p:inputText>
<h:outputText style="margin:5px" value="Email"></h:outputText>
<p:inputText style="margin:5px" value="#{userController.email}"></p:inputText>
<h:outputText style="margin:5px" value="Address"></h:outputText>
<p:inputText style="margin:5px" value="#{userController.address}"></p:inputText>
<h:outputText style="margin:5px" value="City"></h:outputText>
<p:selectOneMenu style="margin:5px" value="#{userController.idCity}">
<f:selectItems value="#{cityController.takeAllForUser(userController.currentUser.idCity)}" var="city" itemValue="#{city.idCity}" itemLabel="#{city.name}" />
</p:selectOneMenu>
<p:commandButton class="btn btn-warning" value="Update" actionListener="#{userController.updateUser()}" update=":form-table" />
<p:commandButton class="btn btn-warning" value="Cancel" oncomplete="PF('updateDialog').hide();" actionListener="#{userController.clear()}" update=":form-table">
</p:commandButton>
</h:panelGrid>
</p:dialog>
<!-- ADD TICKET -->
<p:dialog style="dialog" dynamic="true" closable="false" header="Add Ticket" id="addTicketDialog" widgetVar="addTicketDialog" position="center center top left">
<h:panelGrid columns="2">
<h:outputText value="" />#{ticketController.setFk_id_user(ticketController.currentUser.id)}
<h:outputText style="margin:5px" value="User ID" /><p:inputText style="margin:5px" value="#{ticketController.currentUser.id}" readonly="true" />
<h:outputText style="margin:5px" value="First name" /><p:inputText style="margin:5px" value="#{ticketController.currentUser.firstName}" readonly="true" />
<h:outputText style="margin:5px" value="Last name" /><p:inputText style="margin:5px" value="#{ticketController.currentUser.lastName}" readonly="true" />
<h:outputText style="margin:5px" value="Request type" />
<p:selectOneMenu style="margin:5px" value="#{ticketController.fk_idrequest_type}">
<f:selectItems value="#{requestTypeController.allRequestType}" var="requestType" itemValue="#{requestType.idrequest_type}" itemLabel="#{requestType.request_type}" />
</p:selectOneMenu>
<h:outputText style="margin:5px" value="Ticket status" />
<p:selectOneMenu style="margin:5px" value="#{ticketController.fk_idstatus}">
<f:selectItems value="#{statusControler.allStatus}" var="status" itemValue="#{status.idStatus}" itemLabel="#{status.status_type}" />
</p:selectOneMenu>
<h:outputText style="margin:5px" value="Ticket type" />
<p:selectOneMenu style="margin:5px" value="#{ticketController.fk_idticket_type}">
<f:selectItems value="#{ticketTypeController.allTicketType}" var="ticketType" itemValue="#{ticketType.idticket_type}" itemLabel="#{ticketType.ticket_type}" />
</p:selectOneMenu>
<h:outputText style="margin:5px" value="Comment"/><p:inputTextarea rows="5" cols="23" counter="display" maxlength="1024" counterTemplate="{0} characters remaining." autoResize="false" value="#{ticketController.comment}" />
<h:outputText id="display" /><h:outputText value="" />
<p:commandButton style="margin: .5rem;" value="Create" oncomplete="PF('addTicketDialog').hide();" actionListener="#{userController.clear()}" action="#{ticketController.insertTicket()}" />
<p:commandButton style="margin: .5rem; float: right" value="Close" oncomplete="PF('addTicketDialog').hide();" actionListener="#{userController.clear()}" />
</h:panelGrid>
</p:dialog>
</h:form>
<h:form id="ticket-table" style="margin-top: 5rem;">
<b:dataTable rendered="#{ticketController.renderTicketTable}" value="#{ticketController.allTickets}" id="allTickets" style="width: 100%;" responsive="true" var="tickets" excel="true" searching="true" csv="true" pdf="true" columnVisibility="true" copy="true" print="true">
<f:facet name="header">
<tr>
<th>#{ticketController.currentUser.firstName} #{ticketController.currentUser.lastName}</th>
</tr>
<tr>
<th>Ticket ID</th>
<th>Ticket Type</th>
<th>Status</th>
<th>Group</th>
<th>Date Created</th>
<th>Actions</th>
</tr>
</f:facet>
<b:dataTableColumn value="#{tickets.idTicket}"></b:dataTableColumn>
<b:dataTableColumn value="#{ticketController.takeTicketTypeById(tickets.idTicketType)}"></b:dataTableColumn>
<b:dataTableColumn value="#{ticketController.takeStatusById(tickets.idStatus)}"></b:dataTableColumn>
<b:dataTableColumn value="#{ticketController.takeGroupById(tickets.idGroup)}"></b:dataTableColumn>
<b:dataTableColumn value="#{tickets.ticketDate}"></b:dataTableColumn>
<!--
<p:commandLink style="margin: 0 15px;">
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="addTicket.png" />
<p:ajax update=":form-table:addTicketDialog" listener="#{userController.saveUser(user)}" oncomplete="PF('addTicketDialog').show();"></p:ajax>
</p:commandLink>
<h:commandLink>
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="viewTicket.png" />
</h:commandLink>
</b:dataTableColumn>
<b:dataTableColumn>
<p:commandLink style="margin: 0 15px;">
<h:graphicImage style="width:20px; height: 20px;" library="img" name="update.png"/>
<p:ajax update=":form-table:updateDialog" listener="#{userController.saveUser(user)}" oncomplete="PF('updateDialog').show();"></p:ajax>
</p:commandLink>
<h:commandLink class="delete" onclick="if (!confirm('Delete user?'))
return false" action="#{userController.deleteUser(user.id)}" >
<f:ajax render="form-table" />
<h:graphicImage style="width: 20px; height: 20px;" library="img" name="delete.png" />
</h:commandLink>
</b:dataTableColumn>-->
</b:dataTable>
</h:form>
</b:row>
<b:row>
<p:commandButton rendered="#{ticketController.renderTicketTable}" value="BACK" action="#{ticketController.closeTable}" actionListener="#{userController.openTable}" />
</b:row>
</b:container>
</h:body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment