1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
|
<template>
<td>{{ failure.site_name }} ({{ translate('General_Id') }} {{ failure.idsite }})</td>
<td>{{ failure.problem }}</td>
<td>{{ failure.solution }} <a
v-show="failure.solution_url"
rel="noopener noreferrer"
::href="failure.solution_url"
>{{ translate('CoreAdminHome_LearnMore') }}</a></td>
<td class="datetime">{{ failure.pretty_date_first_occurred }}</td>
<td>{{ failure.url }}</td>
<td>
<span
v-show="!showFullRequestUrl"
@click="showFullRequestUrl = true"
:title="translate('CoreHome_ClickToSeeFullInformation')"
>{{ limtedRequestUrl }}...</span>
<span v-show="failure.showFullRequestUrl">{{ failure.request_url }}</span>
</td>
<td><span
class="table-action icon-delete"
@click="deleteFailure(failure.idsite, failure.idfailure)"
:title="translate('General_Delete')"
/></td>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
export interface TrackingFailure {
[index: string]: string|number|undefined;
idfailure: string|number;
site_name: string;
idsite: string|number;
problem: string;
solution: string;
solution_url?: string;
url: string;
pretty_date_first_occurred: string;
request_url: string;
}
export default defineComponent({
props: {
failure: {
type: Object,
required: true,
},
},
emits: ['delete'],
data() {
return {
showFullRequestUrl: false,
};
},
computed: {
limtedRequestUrl() {
return (this.failure as TrackingFailure).request_url.substring(0, 100);
},
},
methods: {
deleteFailure(idSite: string|number, idFailure: string|number) {
this.$emit('delete', { idSite, idFailure });
},
},
});
</script>
|