Commit 357ceffd authored by ari_darmawan's avatar ari_darmawan

add tabs dashboard ticket

parent ad9a0d09
<button class="btn btn-sm btn-success arataka-btn-success" style="width: 100px;">
<button class="btn btn-sm btn-success arataka-btn-success" style="width: 100px;" (click)="GettingTicketReportCategoryDataAPI()">
<i class="bi bi-search"></i>
Search
</button>
<div class="row">
<!-- <div class="col-12 col-sm-12 text-center mt-5" *ngIf="isTicketReportEmpty == true">
<p style="font-size:18px;" class="text-muted"><i class="fas fa-table fa-3x"></i> <br> No List of Report</p>
<div class="col-12 col-sm-12 text-center mt-5" *ngIf="isEmpty">
<p style="font-size:18px;" class="text-muted">
<i class="fas fa-table fa-3x"></i>
<br> No List of Dashboard Ticket
</p>
</div>
<div class="col-12 col-sm-12 text-center mt-5" *ngIf="isTicketReportLoading == true">
<p style="font-size:18px;" class="text-muted"><i class="fas fa-spinner fa-spin"></i> Retrieving data</p>
</div> -->
<div class="col-12 col-sm-12 Table-Background">
<div class="col-12 col-sm-12 text-center mt-5" *ngIf="isLoading">
<p style="font-size:18px;" class="text-muted">
<i class="fas fa-spinner fa-spin"></i>
Retrieving data
</p>
</div>
<div class="col-12 col-sm-12 Table-Background" *ngIf="!isEmpty && !isLoading">
<div class="table-responsive mt-4">
<table class="table table-bordered table-striped table-sm">
<thead>
......@@ -22,9 +28,9 @@
</tr>
</thead>
<tbody>
<ng-container *ngFor="let data of TicketReportData; let i = index">
<ng-container *ngFor="let data of listTicket.item; let i = index">
<tr>
<td>{{((i+1) + ((TicketReportRequest.perpage * TicketReportRequest.page) - TicketReportRequest.perpage))}}.</td>
<td scope="row">{{((i+1) + ((request.perpage * request.page) - request.perpage))}}.</td>
<td>{{data.ticket_no}}</td>
<td>{{data.ticket_title}}</td>
<td>{{data.ticket_created_time | date: 'dd MMMM yyyy HH:mm:ss'}}</td>
......@@ -39,7 +45,6 @@
<td>{{data.customer_mobile_phone}}</td>
<td>{{data.customer_mobile_phone2}}</td>
<td>{{data.customer_email}}</td>
<td>{{data.penyebab_pengaduan }}</td>
<td>{{data.ticket_service_name}}</td>
<td>{{data.ticket_servicesubcategory_name}}</td>
<td>{{data.ticket_description}}</td>
......@@ -60,7 +65,7 @@
</div>
</div>
<br>
<!-- <div class="row" *ngIf="isTicketReportLoading == false && isTicketReportEmpty == false">
<div class="row" *ngIf="!isLoading && !isEmpty">
<div class="col-12">
<p class="text-center text-muted">
<small>
......@@ -69,13 +74,13 @@
</p>
</div>
<div class="col-6">
<h5 class="text-center arataka-paging-arrow mb-5" (click)="PagingArrowLeft()">
<h5 class="text-center arataka-paging-arrow mb-5">
<i class="fas fa-chevron-left"></i> Previous
</h5>
</div>
<div class="col-6">
<h5 class="text-center arataka-paging-arrow mb-5" (click)="PagingArrowRight()">
<h5 class="text-center arataka-paging-arrow mb-5">
Next <i class="fas fa-chevron-right"></i>
</h5>
</div>
</div> -->
\ No newline at end of file
</div>
\ No newline at end of file
import { Component, OnInit } from '@angular/core';
import { Component, OnInit, OnChanges, SimpleChanges, Input } from '@angular/core';
import { DashboardService } from '../../../../shared/serviceproxy/service-proxy.service';
import { ServiceProxyWeb } from '../../../../shared/serviceproxy/service-proxy.service';
import { HttpErrorResponse } from '@angular/common/http';
@Component({
selector: 'app-admin-dashboard-ticket',
templateUrl: './admin-dashboard-ticket.component.html',
styleUrls: ['./admin-dashboard-ticket.component.css']
})
export class AdminDashboardTicketComponent implements OnInit {
export class AdminDashboardTicketComponent implements OnInit, OnChanges {
@Input() requestTicket!: string;
fieldTable: any[] = [
{name: 'ticket_no', value: false, field: "Ticket No"},
......@@ -32,9 +36,47 @@ export class AdminDashboardTicketComponent implements OnInit {
{name: 'ticket_total_days_resolved', value: false, field: "Day Resolve"}
]
constructor() { }
isLoading: boolean = false;
isEmpty: boolean = false;
PagingDisplay: string = "";
request: any = {};
listTicket: any = {};
constructor(
private _DashboardService : DashboardService,
public _SP : ServiceProxyWeb
) { }
ngOnInit() {
this.request.type_id = 1;
}
ngOnChanges(change: SimpleChanges) {
this.request = JSON.parse(this.requestTicket);
this.request.page = 1;
this.request.perpage = 10;
}
GettingTicketReportCategoryDataAPI() {
this.isLoading = true;
this.isEmpty = false;
this._DashboardService.getDashboardTicket(this.request)
.subscribe((result: any) => {
if(result.values != undefined) {
this.listTicket = {...result.values};
this.PagingDisplay = "Page "+this.request.page+" from " + Math.ceil(result.values.count / this.request.perpage) + ', Total ' + result.values.count + ' Data';
this.isEmpty = false;
} else {
this.listTicket = {}
this.PagingDisplay = "Page "+this.request.page+" from 1, Total 0 Data";
this.isEmpty = true;
}
this.isLoading = false;
}, (err: HttpErrorResponse) => {
this.isLoading = false;
this.isEmpty = false;
this.listTicket = {}
});
}
}
......@@ -74,7 +74,7 @@
</p>
<!--Region Report Category-->
<!-- <ng-container *ngIf="TicketTabsCategoryData[0].selected">
<ng-container *ngIf="TicketTabsCategoryData[0].selected">
<p *ngIf="isDashboardCardColorsEmpty" style="font-size:18px;" class="text-muted text-center">
<i class="fas fa-columns fa-3x"></i> <br>
There is no Dashboard
......@@ -89,16 +89,16 @@
<span
class="TabsCustom"
[ngClass]="{'active': data.selected, '': !data.selected}"
(click)="SelectTicketCategory(i)">
(click)="selectedTicket(i, data)">
{{data.Name}} ({{data.Count}})
</span>
</ng-container>
</p>
</ng-container> -->
</ng-container>
<!--End Region Report Category-->
<!--Region Report Category-->
<ng-container *ngIf="TicketTabsCategoryData[0].selected">
<ng-container *ngIf="TicketTabsCategoryData[1].selected">
<p *ngIf="isTicketCategoryEmpty == true" style="font-size:18px;" class="text-muted text-center"><i class="fas fa-columns fa-3x"></i> <br> There is no Report category</p>
<p *ngIf="isTicketCategoryLoading == true" style="font-size:18px;" class="text-muted text-center"><i class="fas fa-spinner fa-spin"></i> Retrieving data</p>
......@@ -117,7 +117,7 @@
<!--Region Report Category LogBooks-->
<ng-container *ngIf="RoleID == _SP.PARAM_SERVICEDESK || RoleID == _SP.PARAM_SPV || (TeamID == Env.Team.CsCabangBranchAgent || TeamID == Env.Team.SociomileStaff)">
<ng-container *ngIf="TicketTabsCategoryData[1].selected">
<ng-container *ngIf="TicketTabsCategoryData[2].selected">
<p *ngIf="isTicketCategoryLogBookEmpty == true" style="font-size:18px;" class="text-muted text-center"><i class="fas fa-columns fa-3x"></i> <br> There is no Report category</p>
<p *ngIf="isTicketCategoryLogBookLoading == true" style="font-size:18px;" class="text-muted text-center"><i class="fas fa-spinner fa-spin"></i> Retrieving data</p>
......@@ -175,18 +175,18 @@
</ng-container> -->
<!--Region Report Pagination-->
<!-- <ng-container *ngIf="TicketTabsCategoryData[0].selected">
<app-admin-dashboard-ticket>
</app-admin-dashboard-ticket>
</ng-container> -->
<ng-container *ngIf="TicketTabsCategoryData[0].selected">
<app-admin-dashboard-ticket [requestTicket] = "requestTicket">
</app-admin-dashboard-ticket>
</ng-container>
<ng-container *ngIf="TicketTabsCategoryData[1].selected">
<app-admin-dashboard-report
#_AdminDashboardReportComponent
(ChildEvent)="FromChildReportComponent($event)">
</app-admin-dashboard-report>
</ng-container>
<ng-container *ngIf="RoleID == _SP.PARAM_SERVICEDESK || RoleID == _SP.PARAM_SPV || (TeamID == Env.Team.CsCabangBranchAgent || TeamID == Env.Team.SociomileStaff)">
<ng-container *ngIf="TicketTabsCategoryData[1].selected">
<ng-container *ngIf="TicketTabsCategoryData[2].selected">
<app-admin-dashboard-logboook
#_AdminDashboardLogboookComponent
(ChildEvent)="FromChildReportLogBookComponent($event)"
......
......@@ -7,7 +7,7 @@ import { FormBuilder, FormGroup } from '@angular/forms';
import { DashboardService } from '../../../shared/serviceproxy/service-proxy.service';
import { ServiceProxyWeb } from '../../../shared/serviceproxy/service-proxy.service';
import { Router } from '@angular/router';
import { Data, Router } from '@angular/router';
import { ChangeDetectorRef } from '@angular/core';
......@@ -65,7 +65,7 @@ export class AdminDashboardComponent implements OnInit {
user_id : null,
start_date : null,
end_date : null,
isExport: null,
type_id: 1
}
public TicketReportRequest = {
......@@ -89,6 +89,8 @@ export class AdminDashboardComponent implements OnInit {
user_id : this._SP.getUserInformation.values.user_id
}
requestTicket: string = "";
//Data
public DashboardCardColorsData = []
......@@ -172,11 +174,11 @@ export class AdminDashboardComponent implements OnInit {
TabsSelection(){
if(this.RoleID == this._SP.PARAM_SERVICEDESK || this.RoleID == this._SP.PARAM_SPV || (this.TeamID == this.Env.Team.CsCabangBranchAgent || this.TeamID == this.Env.Team.SociomileStaff)){
this. TicketTabsCategoryData = [
// {
// ID : 0,
// Name : "Dashboard",
// selected : false
// },
{
ID : 0,
Name : "Dashboard",
selected : false
},
{
ID : 1,
Name : "Report",
......@@ -228,6 +230,15 @@ export class AdminDashboardComponent implements OnInit {
}
selectedTicket(i: number, item: Data) {
this.DashboardCardColorsData.map((item) => {
item.selected = false;
})
this.DashboardCardColorsData[i].selected = true;
this.DashboardCardColorsData[i].type_id = item.TypeId;
this.DashboardCountRequest.type_id = item.TypeId;
this.requestTicket = JSON.stringify(this.DashboardCountRequest)
}
SelectTabsTitle(_i){
this.TicketTabsCategoryData.map(function(x,index) {
......@@ -304,17 +315,15 @@ export class AdminDashboardComponent implements OnInit {
}else{
userID = this._SP.getUserInformation.values.user_id
}
this.GettingExcelForDashboardDataAPI({
let request = {
user_id : userID,
user_name : this._SP.getUserInformation.values.contact_name,
start_date : this.DashboardCountRequest.start_date,
end_date : this.DashboardCountRequest.end_date,
type_id : this.DashboardCardColorsData[_i].TypeId,
type_name : this.DashboardCardColorsData[_i].Name,
isExport: true,
page: null,
perpage: null
})
}
this.GettingExcelForDashboardDataAPI(request)
}
......@@ -476,6 +485,7 @@ export class AdminDashboardComponent implements OnInit {
}
GettingTicketReportCategoryDataAPI(_Request){
this.requestTicket = JSON.stringify(_Request)
this.TicketCategory = undefined
this.isTicketCategoryLoading = true
this.isTicketCategoryEmpty = false
......
{
"APIBASEURL" : "http://innodev.vnetcloud.com/nobucall-api-v2/",
"APIBASEURL" : "http://localhost:9825/",
"MICROSERVICEURL" : "hhttp://innodev.vnetcloud.com/nobu-history-login/api/v1/",
"SITE_NAME" : "Visionet Helpdesk System",
"SITE_LOGO" : "https://i0.wp.com/jogorogo.info/wp-content/uploads/2017/07/logo_visionet.png?fit=879%2C227",
......
......@@ -1028,7 +1028,18 @@ export class DashboardService {
}
getDashboardTicket(_data) {
const service = this.injector.get(ServiceProxyWeb)
let headers = new HttpHeaders({
'Content-Type': 'application/json',
'Authorization' : 'Bearer '+ service.getUserInformation.values.access_token
});
let options = { headers: headers };
return this.http.post(API_URL +'v3/dashboard/ticket', _data, options);
}
downloadFileExcelDashboard(_data: any) :Observable<any> {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment