|
1 | | -import { MyIncidents, IMyIncident } from "../myincidents"; |
2 | | -import { ApplicationMember } from "../../../services/applications/ApplicationService"; |
3 | | -import { ApiClient } from '../../../services/ApiClient'; |
4 | | -import { AppRoot } from '../../../services/AppRoot'; |
5 | | -import { GetIncidentResult, GetIncidentStatistics, GetIncidentStatisticsResult } from "../../../dto/Core/Incidents"; |
6 | | -import { GetReportList, GetReportListResult, GetReportListResultItem, GetReport, GetReportResult, GetReportResultContextCollection } from "../../../dto/Core/Reports"; |
7 | | -import Vue from "vue"; |
8 | | -import { Component, Watch } from "vue-property-decorator"; |
9 | | - |
10 | | - |
11 | | - |
12 | | -@Component |
13 | | -export default class AnalyzeIncidentComponent extends Vue { |
14 | | - private static activeBtnTheme: string = 'btn-dark'; |
15 | | - private apiClient: ApiClient = AppRoot.Instance.apiClient; |
16 | | - private static readonly selectCollectionTitle: string = '(select collection)'; |
17 | | - private team: ApplicationMember[] = []; |
18 | | - |
19 | | - name = ''; |
20 | | - incidentId = 0; |
21 | | - incident = new GetIncidentResult(); |
22 | | - reports: GetReportListResultItem[] = []; |
23 | | - currentReport = new GetReportResult(); |
24 | | - currentCollection = new GetReportResultContextCollection(); |
25 | | - |
26 | | - currentReportName = '(select report)'; |
27 | | - currentCollectionName: string = ''; |
28 | | - |
29 | | - created() { |
30 | | - // required for contextnavigator |
31 | | - this.incidentId = parseInt(this.$route.params.incidentId, 10); |
32 | | - } |
33 | | - |
34 | | - mounted() { |
35 | | - var incidentId = parseInt(this.$route.params.incidentId, 10); |
36 | | - this.loadIncident(); |
37 | | - MyIncidents.Instance.subscribeOnSelectedIncident(this.selectIncident); |
38 | | - } |
39 | | - |
40 | | - destroyed() { |
41 | | - MyIncidents.Instance.unsubscribe(this.selectIncident); |
42 | | - } |
43 | | - |
44 | | - reAssign() { |
45 | | - AppRoot.modal({ |
46 | | - contentId: 'assignToModal', |
47 | | - showFooter: false |
48 | | - }).then(result => { |
49 | | - var value = result.pressedButton.value; |
50 | | - var accountId = parseInt(value, 10); |
51 | | - var member = <ApplicationMember>this.team.find((x, index) => x.id === accountId); |
52 | | - AppRoot.Instance.incidentService |
53 | | - .assign(this.incident.Id, accountId, member.name) |
54 | | - .then(x => AppRoot.notify('Incident have been assigned', 'fa-check')); |
55 | | - }); |
56 | | - } |
57 | | - |
58 | | - closeIncident() { |
59 | | - AppRoot.Instance.incidentService.showClose(this.incident.Id, "CloseBody") |
60 | | - .then(x => { |
61 | | - if (x.requiresStatusUpdate) { |
62 | | - this.$router.push({ |
63 | | - name: 'notifyUsers', |
64 | | - params: { incidentId: this.incident.Id.toString() } |
65 | | - }); |
66 | | - return; |
67 | | - } |
68 | | - }); |
69 | | - } |
70 | | - |
71 | | - addToTfs() { |
72 | | - |
73 | | - } |
74 | | - |
75 | | - private loadIncident() { |
76 | | - AppRoot.Instance.incidentService.get(this.incidentId) |
77 | | - .then(incident => { |
78 | | - this.incident = incident; |
79 | | - AppRoot.Instance.applicationService.getTeam(incident.ApplicationId) |
80 | | - .then(x => { |
81 | | - this.team = x; |
82 | | - }); |
83 | | - }); |
84 | | - |
85 | | - var q = new GetReportList(); |
86 | | - q.IncidentId = this.incidentId; |
87 | | - AppRoot.Instance.apiClient.query<GetReportListResult>(q) |
88 | | - .then(list => { |
89 | | - this.reports = list.Items; |
90 | | - if (this.reports.length > 0) { |
91 | | - this.loadReport(this.reports[0].Id); |
92 | | - } |
93 | | - }); |
94 | | - } |
95 | | - |
96 | | - |
97 | | - private loadReport(reportId: number) { |
98 | | - var q = new GetReport(); |
99 | | - q.ReportId = reportId; |
100 | | - AppRoot.Instance.apiClient.query<GetReportResult>(q) |
101 | | - .then(report => { |
102 | | - this.currentReport = report; |
103 | | - this.currentReportName = new Date(report.CreatedAtUtc).toLocaleString(); |
104 | | - //(<HTMLButtonElement>document.getElementById('reportChooser')).removeAttribute('disabled'); |
105 | | - if (report.ContextCollections.length > 0) { |
106 | | - this.loadCollection(this.currentCollectionName); |
107 | | - } else { |
108 | | - this.currentCollection = new GetReportResultContextCollection(); |
109 | | - this.currentCollectionName = AnalyzeIncidentComponent.selectCollectionTitle; |
110 | | - } |
111 | | - }); |
112 | | - } |
113 | | - |
114 | | - private embedScreenshots() { |
115 | | - |
116 | | - } |
117 | | - |
118 | | - private loadCollection(name: string) { |
119 | | - if (name === AnalyzeIncidentComponent.selectCollectionTitle || name === '') { |
120 | | - name = null; |
121 | | - var namesToFind = ['ContextData', 'ViewModel', 'HttpRequest', 'ExceptionProperties']; |
122 | | - this.currentReport.ContextCollections.forEach(x => { |
123 | | - if (namesToFind.indexOf(x.Name) !== -1 && name == null) { |
124 | | - name = x.Name; |
125 | | - } |
126 | | - }); |
127 | | - |
128 | | - if (name == null) { |
129 | | - name = this.currentReport.ContextCollections[0].Name; |
130 | | - } |
131 | | - } |
132 | | - |
133 | | - for (var i = 0; i < this.currentReport.ContextCollections.length; i++) { |
134 | | - var col = this.currentReport.ContextCollections[i]; |
135 | | - for (var j = 0; j < col.Properties.length; j++) { |
136 | | - var prop = col.Properties[j]; |
137 | | - prop.Value = prop.Value.replace(/;;/g, "\r\n</br>"); |
138 | | - } |
139 | | - |
140 | | - if (col.Name === name) { |
141 | | - this.currentCollection = col; |
142 | | - this.currentCollectionName = name; |
143 | | - if (name === "Screenshots") { |
144 | | - for (var j = 0; j < this.currentCollection.Properties.length; j++) { |
145 | | - var kvp = this.currentCollection.Properties[j]; |
146 | | - if (kvp.Value.substr(0, 1) !== '<') { |
147 | | - kvp.Value = '<img src="data:image/png;base64, ' + kvp.Value + '" />'; |
148 | | - } |
149 | | - } |
150 | | - } |
151 | | - return; |
152 | | - } |
153 | | - |
154 | | - |
155 | | - } |
156 | | - |
157 | | - } |
158 | | - |
159 | | - |
160 | | - selectIncident(myIncident: IMyIncident | null): void { |
161 | | - if (myIncident == null) { |
162 | | - this.$router.push({ name: 'analyzeHome' }); |
163 | | - } else { |
164 | | - this.incidentId = myIncident.incidentId; |
165 | | - this.loadIncident(); |
166 | | - } |
167 | | - } |
168 | | -} |
| 1 | +import { MyIncidents, IMyIncident } from "../myincidents"; |
| 2 | +import { ApplicationMember } from "@/services/applications/ApplicationService"; |
| 3 | +import { IHighlight, IncidentService } from "@/services/incidents/IncidentService"; |
| 4 | +import { ApiClient } from "@/services/ApiClient"; |
| 5 | +import { AppRoot } from "@/services/AppRoot"; |
| 6 | +import { GetIncidentResult } from "@/dto/Core/Incidents"; |
| 7 | +import { GetApplicationVersions, GetApplicationVersionsResult } from "@/dto/Core/Applications"; |
| 8 | +import { GetReportList, GetReportListResult, GetReportListResultItem, GetReport, GetReportResult, GetReportResultContextCollection } from "@/dto/Core/Reports"; |
| 9 | +import { Component, Vue } from "vue-property-decorator"; |
| 10 | + |
| 11 | +@Component |
| 12 | +export default class AnalyzeIncidentComponent extends Vue { |
| 13 | + private static activeBtnTheme: string = "btn-dark"; |
| 14 | + private apiClient: ApiClient = AppRoot.Instance.apiClient; |
| 15 | + private static readonly selectCollectionTitle: string = "(select collection)"; |
| 16 | + private team: ApplicationMember[] = []; |
| 17 | + |
| 18 | + name = ""; |
| 19 | + incidentId = 0; |
| 20 | + incident = new GetIncidentResult(); |
| 21 | + reports: GetReportListResultItem[] = []; |
| 22 | + currentReport = new GetReportResult(); |
| 23 | + currentCollection = new GetReportResultContextCollection(); |
| 24 | + |
| 25 | + currentReportName = "(select report)"; |
| 26 | + currentCollectionName: string = ""; |
| 27 | + |
| 28 | + closeVersion = ''; |
| 29 | + |
| 30 | + highlights: IHighlight[] = []; |
| 31 | + |
| 32 | + created() { |
| 33 | + // required for contextnavigator |
| 34 | + this.incidentId = parseInt(this.$route.params.incidentId, 10); |
| 35 | + } |
| 36 | + |
| 37 | + mounted() { |
| 38 | + var incidentId = parseInt(this.$route.params.incidentId, 10); |
| 39 | + this.loadIncident(); |
| 40 | + MyIncidents.Instance.subscribeOnSelectedIncident(this.selectIncident); |
| 41 | + } |
| 42 | + |
| 43 | + destroyed() { |
| 44 | + MyIncidents.Instance.unsubscribe(this.selectIncident); |
| 45 | + } |
| 46 | + |
| 47 | + reAssign() { |
| 48 | + AppRoot.modal({ |
| 49 | + contentId: "assignToModal", |
| 50 | + showFooter: false |
| 51 | + }).then(result => { |
| 52 | + var value = result.pressedButton.value; |
| 53 | + var accountId = parseInt(value, 10); |
| 54 | + var member = <ApplicationMember>this.team.find((x, index) => x.id === accountId); |
| 55 | + AppRoot.Instance.incidentService |
| 56 | + .assign(this.incident.Id, accountId, member.name) |
| 57 | + .then(x => AppRoot.notify("Incident have been assigned", "fa-check")); |
| 58 | + }); |
| 59 | + } |
| 60 | + |
| 61 | + closeIncident() { |
| 62 | + AppRoot.Instance.incidentService.showClose(this.incident.Id, "CloseBody") |
| 63 | + .then(x => { |
| 64 | + if (x.requiresStatusUpdate) { |
| 65 | + this.$router.push({ |
| 66 | + name: "notifyUsers", |
| 67 | + params: { incidentId: this.incident.Id.toString() } |
| 68 | + }); |
| 69 | + return; |
| 70 | + } |
| 71 | + }); |
| 72 | + } |
| 73 | + |
| 74 | + addToTfs() { |
| 75 | + |
| 76 | + } |
| 77 | + |
| 78 | + private trimVersion(version: string): string { |
| 79 | + let parts = version.split("."); |
| 80 | + if (parts.length > 3 && parts[parts.length-1] === "0") { |
| 81 | + parts.splice(parts.length - 1, 1); |
| 82 | + } |
| 83 | + return parts.join('.'); |
| 84 | + } |
| 85 | + |
| 86 | + private bumpVersion(version: string): string { |
| 87 | + const parts = version.split("."); |
| 88 | + var value = parseInt(parts[parts.length - 1]) + 1; |
| 89 | + parts[parts.length - 1] = value.toString(); |
| 90 | + return parts.join('.'); |
| 91 | + } |
| 92 | + |
| 93 | + private loadIncident() { |
| 94 | + AppRoot.Instance.incidentService.get(this.incidentId) |
| 95 | + .then(incident => { |
| 96 | + this.incident = incident; |
| 97 | + AppRoot.Instance.applicationService.getTeam(incident.ApplicationId) |
| 98 | + .then(x => { |
| 99 | + this.team = x; |
| 100 | + }); |
| 101 | + |
| 102 | + AppRoot.Instance.incidentService.collectHighlightedData(incident) |
| 103 | + .then(data => { |
| 104 | + this.highlights = data; |
| 105 | + }); |
| 106 | + |
| 107 | + var query = new GetApplicationVersions(); |
| 108 | + query.ApplicationId = this.incident.ApplicationId; |
| 109 | + this.apiClient.query<GetApplicationVersionsResult>(query).then(x => { |
| 110 | + var version = x.Items[0].Version; |
| 111 | + version = this.trimVersion(version); |
| 112 | + this.closeVersion = this.bumpVersion(version); |
| 113 | + |
| 114 | + // Couldn't get binding to work. |
| 115 | + // fix this if you know Vue better than me :) |
| 116 | + document.querySelector("[name='version']").setAttribute('value', this.closeVersion); |
| 117 | + }); |
| 118 | + |
| 119 | + }); |
| 120 | + |
| 121 | + var q = new GetReportList(); |
| 122 | + q.IncidentId = this.incidentId; |
| 123 | + AppRoot.Instance.apiClient.query<GetReportListResult>(q) |
| 124 | + .then(list => { |
| 125 | + this.reports = list.Items; |
| 126 | + if (this.reports.length > 0) { |
| 127 | + this.loadReport(this.reports[0].Id); |
| 128 | + } |
| 129 | + }); |
| 130 | + } |
| 131 | + |
| 132 | + |
| 133 | + private loadReport(reportId: number) { |
| 134 | + var q = new GetReport(); |
| 135 | + q.ReportId = reportId; |
| 136 | + AppRoot.Instance.apiClient.query<GetReportResult>(q) |
| 137 | + .then(report => { |
| 138 | + this.currentReport = report; |
| 139 | + this.currentReportName = new Date(report.CreatedAtUtc).toLocaleString(); |
| 140 | + //(<HTMLButtonElement>document.getElementById('reportChooser')).removeAttribute('disabled'); |
| 141 | + if (report.ContextCollections.length > 0) { |
| 142 | + this.loadCollection(this.currentCollectionName); |
| 143 | + } else { |
| 144 | + this.currentCollection = new GetReportResultContextCollection(); |
| 145 | + this.currentCollectionName = AnalyzeIncidentComponent.selectCollectionTitle; |
| 146 | + } |
| 147 | + }); |
| 148 | + } |
| 149 | + |
| 150 | + private embedScreenshots() { |
| 151 | + |
| 152 | + } |
| 153 | + |
| 154 | + private loadCollection(name: string) { |
| 155 | + if (name === AnalyzeIncidentComponent.selectCollectionTitle || name === "") { |
| 156 | + name = null; |
| 157 | + var namesToFind = ["ContextData", "ViewModel", "HttpRequest", "ExceptionProperties"]; |
| 158 | + this.currentReport.ContextCollections.forEach(x => { |
| 159 | + if (namesToFind.indexOf(x.Name) !== -1 && name == null) { |
| 160 | + name = x.Name; |
| 161 | + } |
| 162 | + }); |
| 163 | + |
| 164 | + if (name == null) { |
| 165 | + name = this.currentReport.ContextCollections[0].Name; |
| 166 | + } |
| 167 | + } |
| 168 | + |
| 169 | + for (var i = 0; i < this.currentReport.ContextCollections.length; i++) { |
| 170 | + var col = this.currentReport.ContextCollections[i]; |
| 171 | + for (var j = 0; j < col.Properties.length; j++) { |
| 172 | + var prop = col.Properties[j]; |
| 173 | + prop.Value = prop.Value.replace(/;;/g, "\r\n</br>"); |
| 174 | + } |
| 175 | + |
| 176 | + if (col.Name === name) { |
| 177 | + this.currentCollection = col; |
| 178 | + this.currentCollectionName = name; |
| 179 | + if (name === "Screenshots") { |
| 180 | + for (var j = 0; j < this.currentCollection.Properties.length; j++) { |
| 181 | + var kvp = this.currentCollection.Properties[j]; |
| 182 | + if (kvp.Value.substr(0, 1) !== "<") { |
| 183 | + kvp.Value = '<img src="data:image/png;base64, ' + kvp.Value + '" />'; |
| 184 | + } |
| 185 | + } |
| 186 | + } |
| 187 | + return; |
| 188 | + } |
| 189 | + |
| 190 | + |
| 191 | + } |
| 192 | + |
| 193 | + } |
| 194 | + |
| 195 | + |
| 196 | + selectIncident(myIncident: IMyIncident | null): void { |
| 197 | + if (myIncident == null) { |
| 198 | + this.$router.push({ name: "analyzeHome" }); |
| 199 | + } else { |
| 200 | + this.incidentId = myIncident.incidentId; |
| 201 | + this.loadIncident(); |
| 202 | + } |
| 203 | + } |
| 204 | +} |
0 commit comments