fix: ajuster le style du plugin analytics et corriger le nom du toggle
All checks were successful
Deploy Preprod / Build and Deploy to Preprod (push) Successful in 34s
All checks were successful
Deploy Preprod / Build and Deploy to Preprod (push) Successful in 34s
- Supprime le doublon de séparateur dans le menu - Retire les box-shadow/padding superflus, ajuste les marges - Corrige le name du toggle topPages en kebab-case (top-pages) Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
isUnknown
parent
aceb8c7fdb
commit
86d48e415c
4 changed files with 11 additions and 32 deletions
|
|
@ -59,7 +59,6 @@ $menu = [
|
|||
}
|
||||
],
|
||||
'-',
|
||||
'-',
|
||||
'analytics' => [
|
||||
'label' => 'Analytics',
|
||||
'icon' => 'chart',
|
||||
|
|
|
|||
|
|
@ -1,18 +1,13 @@
|
|||
|
||||
.k-analytics-dashboard {
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
.k-analytics-filters {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
.k-analytics-filters label {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
.k-date-inputs-wrapper {
|
||||
display: flex;
|
||||
|
|
@ -29,33 +24,32 @@
|
|||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
margin: 3rem 0;
|
||||
}
|
||||
.k-analytics-user-filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
margin-left: 2rem;
|
||||
}
|
||||
.k-field-name-user,
|
||||
.k-field-name-page {
|
||||
min-width: 15rem;
|
||||
}
|
||||
.k-field-name-top-pages {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
.k-analytics-page-filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
margin-left: 2rem;
|
||||
}
|
||||
.k-analytics-card {
|
||||
background: var(--color-background);
|
||||
border-radius: var(--rounded);
|
||||
padding: 1.5rem;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
.k-analytics-card h3 {
|
||||
font-size: 0.75rem;
|
||||
|
|
@ -74,13 +68,10 @@
|
|||
.k-analytics-chart-container {
|
||||
background: var(--color-background);
|
||||
border-radius: var(--rounded);
|
||||
padding: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
.k-analytics-chart-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
|
@ -98,7 +89,6 @@
|
|||
border-radius: var(--rounded);
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
.k-analytics-empty p {
|
||||
margin: 0;
|
||||
|
|
|
|||
|
|
@ -11679,7 +11679,7 @@ var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "sy
|
|||
} } })]), _c("label", [_vm._v(" Au "), _c("input", { directives: [{ name: "model", rawName: "v-model", value: _vm.endDate, expression: "endDate" }], attrs: { "type": "date" }, domProps: { "value": _vm.endDate }, on: { "change": _vm.fetchData, "input": function($event) {
|
||||
if ($event.target.composing) return;
|
||||
_vm.endDate = $event.target.value;
|
||||
} } })])])]), _c("div", { staticClass: "k-analytics-user-filter" }, [_c("k-multiselect-field", { attrs: { "options": _vm.userOptions, "value": _vm.selectedEmails, "label": "Filtrer par utilisateur(s)", "search": "true", "name": "user" }, on: { "input": _vm.onUserSelectionChange } })], 1), _c("div", { staticClass: "k-analytics-page-filter" }, [_c("k-multiselect-field", { attrs: { "options": _vm.pageOptions, "value": _vm.selectedPages, "label": "Filtrer par page(s)", "search": "true", "name": "page" }, on: { "input": _vm.onPageSelectionChange } })], 1)]), !_vm.hasData ? _c("div", { staticClass: "k-analytics-empty" }, [_c("p", [_vm._v("Aucune donnée à afficher")])]) : [_c("div", { staticClass: "k-analytics-grid" }, [_c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Sessions uniques")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.data.uniqueSessions))])]), _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages vues")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.data.totalVisits))])]), _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages / session")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.pagesPerSession))])])]), _c("div", { staticClass: "k-analytics-chart-container" }, [_c("div", { staticClass: "k-analytics-chart-header" }, [_c("h3", [_vm._v("Visites par jour")]), _vm.selectedPages.length === 0 ? _c("k-toggle-field", { attrs: { "value": _vm.showTopPagesOnly, "before": "Moyenne", "after": "Pages les + visitées", "text": " ", "name": "topPages" }, on: { "input": _vm.onToggleTopPages } }) : _vm._e()], 1), _c("canvas", { ref: "chartCanvas" })]), _vm.data.visitsByPage && Object.keys(_vm.data.visitsByPage).length ? _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages les plus visitées")]), _c("ul", { staticClass: "k-analytics-list" }, _vm._l(_vm.data.visitsByPage, function(count, page) {
|
||||
} } })])])]), _c("div", { staticClass: "k-analytics-user-filter" }, [_c("k-multiselect-field", { attrs: { "options": _vm.userOptions, "value": _vm.selectedEmails, "label": "Filtrer par utilisateur(s)", "search": "true", "name": "user" }, on: { "input": _vm.onUserSelectionChange } })], 1), _c("div", { staticClass: "k-analytics-page-filter" }, [_c("k-multiselect-field", { attrs: { "options": _vm.pageOptions, "value": _vm.selectedPages, "label": "Filtrer par page(s)", "search": "true", "name": "page" }, on: { "input": _vm.onPageSelectionChange } })], 1)]), !_vm.hasData ? _c("div", { staticClass: "k-analytics-empty" }, [_c("p", [_vm._v("Aucune donnée à afficher")])]) : [_c("div", { staticClass: "k-analytics-grid" }, [_c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Sessions uniques")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.data.uniqueSessions))])]), _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages vues")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.data.totalVisits))])]), _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages / session")]), _c("div", { staticClass: "k-analytics-metric" }, [_vm._v(_vm._s(_vm.pagesPerSession))])])]), _c("div", { staticClass: "k-analytics-chart-container" }, [_c("div", { staticClass: "k-analytics-chart-header" }, [_c("h3", [_vm._v("Visites par jour")]), _vm.selectedPages.length === 0 ? _c("k-toggle-field", { attrs: { "value": _vm.showTopPagesOnly, "before": "Moyenne", "after": "Pages les + visitées", "text": " ", "name": "top-pages" }, on: { "input": _vm.onToggleTopPages } }) : _vm._e()], 1), _c("canvas", { ref: "chartCanvas" })]), _vm.data.visitsByPage && Object.keys(_vm.data.visitsByPage).length ? _c("div", { staticClass: "k-analytics-card" }, [_c("h3", [_vm._v("Pages les plus visitées")]), _c("ul", { staticClass: "k-analytics-list" }, _vm._l(_vm.data.visitsByPage, function(count, page) {
|
||||
return _c("li", { key: page }, [_c("span", { staticClass: "k-analytics-list-label" }, [_vm._v(_vm._s(page))]), _c("span", { staticClass: "k-analytics-list-value" }, [_vm._v(_vm._s(count))])]);
|
||||
}), 0)]) : _vm._e()]], 2);
|
||||
};
|
||||
|
|
|
|||
|
|
@ -69,7 +69,7 @@
|
|||
before="Moyenne"
|
||||
after="Pages les + visitées"
|
||||
text=" "
|
||||
name="topPages"
|
||||
name="top-pages"
|
||||
@input="onToggleTopPages"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -344,14 +344,9 @@ export default {
|
|||
</script>
|
||||
|
||||
<style>
|
||||
.k-analytics-dashboard {
|
||||
padding: 1.5rem 0;
|
||||
}
|
||||
|
||||
.k-analytics-filters {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1.5rem;
|
||||
}
|
||||
|
||||
.k-analytics-filters label {
|
||||
|
|
@ -359,7 +354,6 @@ export default {
|
|||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
}
|
||||
|
||||
.k-date-inputs-wrapper {
|
||||
|
|
@ -379,7 +373,7 @@ export default {
|
|||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
gap: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
margin: 3rem 0;
|
||||
}
|
||||
|
||||
.k-analytics-user-filter {
|
||||
|
|
@ -387,7 +381,6 @@ export default {
|
|||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
|
|
@ -396,20 +389,21 @@ export default {
|
|||
min-width: 15rem;
|
||||
}
|
||||
|
||||
.k-field-name-top-pages {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
.k-analytics-page-filter {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.5rem;
|
||||
font-size: 0.875rem;
|
||||
color: var(--color-text-light);
|
||||
margin-left: 2rem;
|
||||
}
|
||||
|
||||
.k-analytics-card {
|
||||
background: var(--color-background);
|
||||
border-radius: var(--rounded);
|
||||
padding: 1.5rem;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.k-analytics-card h3 {
|
||||
|
|
@ -431,14 +425,11 @@ export default {
|
|||
.k-analytics-chart-container {
|
||||
background: var(--color-background);
|
||||
border-radius: var(--rounded);
|
||||
padding: 1.5rem;
|
||||
margin-bottom: 1.5rem;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.k-analytics-chart-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
|
@ -459,7 +450,6 @@ export default {
|
|||
border-radius: var(--rounded);
|
||||
padding: 3rem;
|
||||
text-align: center;
|
||||
box-shadow: var(--shadow);
|
||||
}
|
||||
|
||||
.k-analytics-empty p {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue