feat(EditVersionModal): gère les permissions de modification de dates…

… d'audit/certification

package.json

@@ -86,6 +86,7 @@
       "src/components/Features/SingleItem*.test.js",
       "src/components/Features/Table.test.js",
       "src/components/OperatorSetup/*.test.js",
+      "src/components/record/Header.test.js",
       "src/pages/certification/exploitations/index.test.js",
       "src/pages/exploitations/\\[numeroBio\\]/index.test.js"
     ],

src/components/Features/__fixtures__/record-with-features.json

@@ -1,5 +1,6 @@
 {
   "record_id": "054f0d70-c3da-448f-823e-81fcf7c2bf6e",
+  "version_name": "Version créée le 01/01/2024",
   "numerobio": "34857",
   "certification_date_debut": null,
   "certification_date_fin": null,

src/components/record/Header.test.js

@@ -0,0 +1,94 @@
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest"
+import { defineComponent } from "vue"
+import { flushPromises, mount } from "@vue/test-utils"
+import { createTestingPinia } from "@pinia/testing"
+import { useOperatorStore } from "@/stores/operator.js"
+import { useRecordStore } from "@/stores/record.js"
+import { useUserStore } from "@/stores/user.js"
+
+import operator from '@/components/Features/__fixtures__/operator.json' assert { type: 'json' }
+import record from '@/components/Features/__fixtures__/record-with-features.json' assert { type: 'json' }
+
+import RecordHeader from "./Header.vue"
+import EditVersionModal from "@/components/versions/EditVersionModal.vue"
+
+const pinia = createTestingPinia({ createSpy: vi.fn, stubActions: false })
+const operatorStore = useOperatorStore(pinia)
+const recordStore = useRecordStore(pinia)
+const userStore = useUserStore(pinia)
+
+describe("RecordHeader", () => {
+  const AsyncComponent = defineComponent({
+    components: { RecordHeader },
+    template: '<Suspense><RecordHeader v-bind="$attrs" /></Suspense>'
+  })
+
+  beforeEach(() => {
+    recordStore.update(record)
+    operatorStore.operator = operator
+  })
+
+  afterEach(() => {
+    operatorStore.$reset()
+    userStore.$reset()
+    recordStore.reset()
+  })
+
+  it('should display store informations', () => {
+    const wrapper = mount(AsyncComponent)
+
+    expect(wrapper.find('.operator-name').text()).toEqual('test')
+    expect(wrapper.find('.operator-name').attributes('data-numerobio')).toEqual('34857')
+    expect(wrapper.find('.version-name').text()).toEqual('Version créée le 01/01/2024')
+  })
+
+  describe('Modifier la version', () => {
+    afterEach(() => userStore.$reset())
+
+    it("should print version name field to everybody", async () => {
+      let wrapper = mount(AsyncComponent)
+      await wrapper.find('.edit-version-info').trigger('click')
+
+      const modal = wrapper.getComponent(EditVersionModal)
+      expect(modal.find('#version_name').exists()).toBe(true)
+    })
+
+    it("should print audit date field only for Certification Body", async () => {
+      recordStore.update({ certification_state: 'AUDITED', audit_date: '2024-01-01' })
+      userStore.isOc = false
+      userStore.isOcCertif = false
+
+      let wrapper = mount(AsyncComponent)
+      await wrapper.find('.edit-version-info').trigger('click')
+
+      const modal = wrapper.getComponent(EditVersionModal)
+      expect(modal.find('#audit_date').exists()).toBe(false)
+
+      userStore.isOc = true
+      userStore.isOcCertif = true
+      await flushPromises()
+      expect(modal.find('#audit_date').exists()).toBe(true)
+    })
+
+    it("should print certification date fields only for Certification Body", async () => {
+      recordStore.update({ certification_state: 'CERTIFIED', audit_date: '2024-01-01' })
+      userStore.isOc = false
+      userStore.isOcCertif = false
+
+      let wrapper = mount(AsyncComponent)
+      await wrapper.find('.edit-version-info').trigger('click')
+
+      const modal = wrapper.getComponent(EditVersionModal)
+      expect(modal.find('#certification_date_debut').exists()).toBe(false)
+      expect(modal.find('#certification_date_fin').exists()).toBe(false)
+
+      userStore.isOc = true
+      userStore.isOcCertif = true
+      await flushPromises()
+      console.log(modal.html())
+      expect(modal.find('#certification_date_debut').exists()).toBe(true)
+      expect(modal.find('#certification_date_fin').exists()).toBe(true)
+    })
+  })
+
+})

src/components/record/Header.vue

@@ -1,12 +1,12 @@
 <template>
   <header class="fr-mb-2w">
-    <span class="fr-text--bold" :data-numerobio="operator.numeroBio">{{ operator.nom }}</span>
+    <span class="fr-text--bold operator-name" :data-numerobio="operator.numeroBio">{{ operator.nom }}</span>
     <h1 class="fr-h4 fr-my-0 fr-mb-1v">
-      {{ record.version_name }}
+      <span class="version-name">{{ record.version_name }}</span>
 
       <button
           v-if="!disableActions"
-          class="fr-btn fr-btn--tertiary-no-outline fr-icon fr-icon-edit-line"
+          class="fr-btn fr-btn--tertiary-no-outline fr-icon fr-icon-edit-line edit-version-info"
           @click="showEditVersionModal = true"
           :disabled="!isOnline"
       >

src/components/versions/EditVersionModal.vue

@@ -4,11 +4,14 @@ import { useFocus } from '@vueuse/core'
 import Modal from "@/components/Modal.vue"
 import { reactive } from "vue"
 import toast from "@/components/toast.js"
+import { usePermissions } from "@/stores/permissions.js"
 import { useRecordStore } from "@/stores/record.js"
 
 const emit = defineEmits(['close'])
 
 const recordStore = useRecordStore()
+const permissions = usePermissions()
+
 const { record } = recordStore
 const autofocusedElement = ref()
 useFocus(autofocusedElement, { initialValue: true })
@@ -43,17 +46,17 @@ async function save() {
         <input type="text" id="version_name" class="fr-input" v-model="patch.version_name" ref="autofocusedElement" />
       </div>
 
-      <div v-if="patch.audit_date" class="fr-input-group">
+      <div v-if="patch.audit_date && permissions.canChangeAuditDate" class="fr-input-group">
         <label for="audit_date" class="fr-input-group__label">Date d'audit</label>
         <input type="date" id="audit_date" class="fr-input" v-model="patch.audit_date" />
       </div>
 
-      <div v-if="record.certification_state === 'CERTIFIED'" class="fr-input-group">
+      <div v-if="record.certification_state === 'CERTIFIED' && permissions.canChangeCertificationDate" class="fr-input-group">
         <label for="certification_date_debut" class="fr-input-group__label">Date de début de validité du certificat</label>
-        <input type="date" id="certification_date_debut" class="fr-input" :value="record.certification_date_debut" disabled />
+        <input type="date" id="certification_date_debut" class="fr-input" :value="record.certification_date_debut" />
       </div>
 
-      <div v-if="record.certification_state === 'CERTIFIED'" class="fr-input-group">
+      <div v-if="record.certification_state === 'CERTIFIED' && permissions.canChangeCertificationDate" class="fr-input-group">
         <label for="certification_date_fin" class="fr-input-group__label">Date de fin de validité du certificat</label>
         <input type="date" id="certification_date_fin" class="fr-input" v-model="patch.certification_date_fin" />
       </div>