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
|
/*!
* Matomo - free/libre analytics platform
*
* @link https://matomo.org
* @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/
import { createApp } from 'vue';
import ActivityIndicator from './ActivityIndicator.vue';
import translate from '../translate';
interface ActivityIndicatorAdapterScope extends ng.IScope {
loading: boolean;
loadingMessage: string;
}
export default function activityIndicatorAdapter(): ng.IDirective {
return {
restrict: 'A',
scope: {
loading: '<',
loadingMessage: '<',
},
template: '',
link: function activityIndicatorAdapterLink(
scope: ActivityIndicatorAdapterScope,
element: ng.IAugmentedJQuery,
) {
const app = createApp({
template: '<activity-indicator :loading="loading" :loadingMessage="loadingMessage"/>',
data() {
return {
loading: scope.loading,
loadingMessage: scope.loadingMessage,
};
},
});
app.config.globalProperties.$sanitize = window.vueSanitize;
app.component('activity-indicator', ActivityIndicator);
const vm = app.mount(element[0]);
scope.$watch('loading', (newValue: boolean) => {
vm.loading = newValue;
});
scope.$watch('loadingMessage', (newValue: string) => {
vm.loadingMessage = newValue || translate('General_LoadingData');
});
},
};
}
activityIndicatorAdapter.$inject = [];
angular.module('piwikApp').directive('piwikActivityIndicator', activityIndicatorAdapter);
|
