site-accueil-insa/matomo/plugins/Goals/vue/src/GoalPageLink/GoalPageLink.ts

69 lines
1.6 KiB
TypeScript

/*!
* Matomo - free/libre analytics platform
*
* @link https://matomo.org
* @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/
import { DirectiveBinding } from 'vue';
import { Matomo, translate, MatomoUrl } from 'CoreHome';
interface GoalPageLinkArgs {
idGoal: string|number;
}
const { $ } = window;
// usage v-goal-page-link="{ idGoal: 5 }"
const GoalPageLink = {
mounted(el: HTMLElement, binding: DirectiveBinding<GoalPageLinkArgs>): void {
if (!Matomo.helper.isAngularRenderingThePage()) {
return;
}
const title = $(el).text();
const link = $('<a></a>');
link.text(title);
link.attr('title', translate('Goals_ClickToViewThisGoal'));
link.click((e) => {
e.preventDefault();
MatomoUrl.updateHash({
...MatomoUrl.hashParsed.value,
category: 'Goals_Goals',
subcategory: binding.value.idGoal,
});
});
$(el).html(link[0]);
},
};
export default GoalPageLink;
// manually handle occurrence of goal-page-link on datatable html attributes since dataTable.js is
// not managed by vue.
// eslint-disable-next-line @typescript-eslint/no-explicit-any
Matomo.on('Matomo.processDynamicHtml', ($element: JQuery) => {
$element.find('[goal-page-link]').each((i, e) => {
if ($(e).attr('goal-page-link-handled')) {
return;
}
const idGoal = $(e).attr('goal-page-link');
if (idGoal) {
GoalPageLink.mounted(e, {
instance: null,
value: {
idGoal,
},
oldValue: null,
modifiers: {},
dir: {},
});
}
$(e).attr('goal-page-link-handled', '1');
});
});