@tekkare/romulus 0.1.184 → 0.1.186

package/dist/module.json

@@ -4,7 +4,7 @@
   "compatibility": {
     "nuxt": ">=3.16.0"
   },
-  "version": "0.1.183",
+  "version": "0.1.185",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "2.0.0"

package/dist/runtime/components/AlertForm.vue

@@ -14,7 +14,11 @@
     voudrait dire autant de requetes et autant de references sur le meme jeu
     de documents, et plusieurs messages le meme matin pour le meme produit ;
   - la cadence appartient au mail. La pastille de l'app encaisse au fil de
-    l'eau, elle n'a pas de digest.
+    l'eau, elle n'a pas de digest ;
+  - une alerte de produit ne choisit ni champs ni declencheurs : ils sont deja
+    forces a « tout » (cf. `watchesProduct`), le formulaire ne fait que les
+    cacher. Choisir « seulement l'apparition » sur une marque suivie partout
+    ferait manquer un dereboursement.
 -->
 <script setup lang="ts">
 import { computed, ref, watch } from 'vue'
@@ -103,20 +107,27 @@ const emit = defineEmits<{
   'select-view': [id: string]
   /** Saisie du selecteur de marques, a porter jusqu'a l'index. */
   'search-brands': [value: string]
+  /**
+   * Le formulaire s'ecarte de sa reference de depart. L'appelant n'a pas
+   * acces aux refs internes (titre, marques, declencheurs...) : c'est le
+   * seul moyen pour lui de savoir s'il y a quelque chose a perdre avant de
+   * fermer.
+   */
+  'update:dirty': [value: boolean]
 }>()
 
 const FR = {
   kind: 'Que surveiller',
   kindView: 'Une vue',
   kindViewHint: 'Un écran filtré, aussi fin que vous voulez, mais limité à cette page.',
-  kindProduct: 'Une marque',
+  kindProduct: 'Alerte 360°',
   kindProductHint: 'Une à {max} marques, suivies partout : prix, avis HAS, indications, ANSM, PUT, MITM, Journal officiel, ventes ville et hospitalières.',
   brands: 'Marques surveillées',
   brandsSearch: 'Rechercher',
   brandsHint: 'Cherchez par marque, molécule, classe ATC ou laboratoire. L’alerte couvre tout le hub pour chaque marque retenue.',
   brandsRequired: 'Choisissez au moins une marque.',
   brandsTooMany: 'Une alerte suit {max} marques au maximum.',
-  productFields: 'Tous les champs sont suivis : une alerte de marque ne se restreint pas, elle rapporte tout ce qui bouge.',
+  productFields: 'Rien à choisir : une alerte de marque suit tout, tous champs et tous déclencheurs confondus (nouvel élément, changement de valeur, sortie du périmètre).',
   screenOption: 'Écran actuel (une vue sera créée)',
   viewSelect: 'Vue à surveiller',
   viewApplied: 'La vue choisie est appliquée à l’écran : c’est lui qui fournit la requête surveillée.',
@@ -162,14 +173,14 @@ const EN = {
   kind: 'What to watch',
   kindView: 'A view',
   kindViewHint: 'A filtered screen, as precise as you like, but tied to that page.',
-  kindProduct: 'A brand',
+  kindProduct: '360° alert',
   kindProductHint: 'One to {max} brands, watched everywhere: prices, HAS opinions, indications, ANSM, PUT, MITM, official journal, retail and hospital sales.',
   brands: 'Watched brands',
   brandsSearch: 'Search',
   brandsHint: 'Search by brand, molecule, ATC class or company. The alert covers the whole hub for each brand kept.',
   brandsRequired: 'Pick at least one brand.',
   brandsTooMany: 'An alert watches at most {max} brands.',
-  productFields: 'Every field is watched: a brand alert does not narrow down, it reports whatever moves.',
+  productFields: 'Nothing to choose: a brand alert watches everything, every field and every trigger (new item, value change, left the scope).',
   screenOption: 'Current screen (a view will be created)',
   viewSelect: 'View to watch',
   viewApplied: 'The chosen view is applied to the screen: the screen is what provides the watched query.',
@@ -249,7 +260,19 @@ watch(brandSearch, (value) => emit('search-brands', value))
 const watchesProduct = computed(() => kind.value === 'product')
 
 const title = ref(props.initial?.title ?? props.viewTitle)
-const triggers = ref<RmAlertTrigger[]>(props.initial?.triggers ?? ['appeared'])
+/**
+ * Une alerte de produit suit tout, declencheurs compris : le choix ne se pose
+ * pas plus que celui des champs, et cocher que « nouvel element » laisserait
+ * croire qu'un changement de prix sur une marque deja suivie ne compte pas.
+ */
+const ALL_TRIGGERS: RmAlertTrigger[] = ['appeared', 'changed', 'disappeared']
+const triggers = ref<RmAlertTrigger[]>(
+  props.initial?.triggers ??
+    (kind.value === 'product' ? ALL_TRIGGERS : ['appeared']),
+)
+watch(kind, (value) => {
+  if (value === 'product') triggers.value = ALL_TRIGGERS
+})
 const watchedFields = ref<string[]>(
   (props.initial?.watchedFields ?? []).filter((field) => field !== RM_ALERT_ANY_FIELD),
 )
@@ -264,6 +287,37 @@ const initialFields = JSON.stringify([...(props.initial?.watchedFields ?? [])].s
 /** Titre libre des que l'utilisateur y touche : on ne l'ecrase plus. */
 const titleTouched = ref(props.mode === 'edit')
 
+/**
+ * Etat de depart, capture une seule fois : ce a quoi `dirty` compare le
+ * formulaire. Le titre n'y figure pas, il se suit par `titleTouched` (il
+ * bouge tout seul tant que l'utilisateur n'y a pas touche, cf. plus bas).
+ */
+const baseline = {
+  kind: kind.value,
+  brands: JSON.stringify([...brands.value].sort()),
+  triggers: JSON.stringify([...triggers.value].sort()),
+  watchedFields: JSON.stringify([...watchedFields.value].sort()),
+  anyField: anyField.value,
+  emailOn: emailOn.value,
+  cadence: cadence.value,
+  selectedViewId: selectedViewId.value,
+}
+
+const dirty = computed(
+  () =>
+    titleTouched.value ||
+    kind.value !== baseline.kind ||
+    JSON.stringify([...brands.value].sort()) !== baseline.brands ||
+    JSON.stringify([...triggers.value].sort()) !== baseline.triggers ||
+    JSON.stringify([...watchedFields.value].sort()) !== baseline.watchedFields ||
+    anyField.value !== baseline.anyField ||
+    emailOn.value !== baseline.emailOn ||
+    cadence.value !== baseline.cadence ||
+    selectedViewId.value !== baseline.selectedViewId,
+)
+
+watch(dirty, (value) => emit('update:dirty', value), { immediate: true })
+
 watch(
   () => props.viewTitle,
   (value) => {
@@ -495,7 +549,7 @@ function submit() {
       {{ watchesProduct ? `${T.brands} : ${brands.join(', ')}` : `${T.view} : ${viewTitle}` }}
     </p>
 
-    <fieldset class="rm-alert-form__group" data-field="triggers">
+    <fieldset v-if="!watchesProduct" class="rm-alert-form__group" data-field="triggers">
       <legend class="rm-alert-form__label">{{ T.triggers }}</legend>
       <p class="rm-alert-form__hint">{{ T.triggersHint }}</p>
       <RmCheckbox
@@ -512,7 +566,7 @@ function submit() {
       />
     </fieldset>
 
-    <p v-if="watchesProduct && watchesChanges" class="rm-alert-form__hint">
+    <p v-if="watchesProduct" class="rm-alert-form__hint">
       {{ T.productFields }}
     </p>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tekkare/romulus",
-  "version": "0.1.184",
+  "version": "0.1.186",
   "description": "Romulus Design System - Nuxt module by Tekkare",
   "license": "MIT",
   "type": "module",