Merge pull request #1222 from gradido/1221-month-names-of-the-open-creation-in-multiple-creation

1221 month names of the open creation in multiple creation

admin/src/components/UserTable.spec.js

@@ -6,28 +6,275 @@ const localVue = global.localVue
 describe('UserTable', () => {
   let wrapper
 
-  const propsData = {
+  const defaultItemsUser = [
-    type: 'Type',
+    {
-    itemsUser: [],
+      email: 'bibi@bloxberg.de',
-    fieldsTable: [],
+      firstName: 'Bibi',
-    creation: [],
+      lastName: 'Bloxberg',
+      creation: [1000, 1000, 1000],
+    },
+    {
+      email: 'bibi@bloxberg.de',
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      creation: [1000, 1000, 1000],
+    },
+    {
+      email: 'bibi@bloxberg.de',
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      creation: [1000, 1000, 1000],
+    },
+  ]
+
+  const confirmationItemsUser = [
+    {
+      email: 'bibi@bloxberg.de',
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      amount: 10,
+      memo: 'Test 1',
+      date: '11-09-2001',
+      moderator: 1,
+    },
+    {
+      email: 'bibi@bloxberg.de',
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      amount: 10,
+      memo: 'Test 2',
+      date: '21-09-2001',
+      moderator: 1,
+    },
+    {
+      email: 'bibi@bloxberg.de',
+      firstName: 'Bibi',
+      lastName: 'Bloxberg',
+      amount: 10,
+      memo: 'Test 3',
+      date: '30-09-2001',
+      moderator: 1,
+    },
+  ]
+
+  const propsDataPageUserSearch = {
+    type: 'PageUserSearch',
+    itemsUser: defaultItemsUser,
+    fieldsTable: [
+      'email',
+      'firstName',
+      'lastName',
+      'creation',
+      'show_details',
+      'confirm_mail',
+      'transactions_list',
+    ],
+  }
+
+  const propsDataUserListSearch = {
+    type: 'UserListSearch',
+    itemsUser: defaultItemsUser,
+    fieldsTable: ['bookmark', 'email', 'firstName', 'lastName', 'creation'],
+    creation: [1000, 1000, 1000],
+  }
+
+  const propsDataUserListMassCreation = {
+    type: 'UserListMassCreation',
+    itemsUser: defaultItemsUser,
+    fieldsTable: ['email', 'firstName', 'lastName', 'creation', 'bookmark'],
+    creation: [1000, 1000, 1000],
+  }
+
+  const propsDataPageCreationConfirm = {
+    type: 'PageCreationConfirm',
+    itemsUser: confirmationItemsUser,
+    fieldsTable: [
+      'bookmark',
+      'email',
+      'firstName',
+      'lastName',
+      'amount',
+      'memo',
+      'date',
+      'moderator',
+      'edit_creation',
+      'confirm',
+    ],
   }
 
   const mocks = {
     $t: jest.fn((t) => t),
+    $moment: jest.fn(() => {
+      return {
+        format: jest.fn((m) => m),
+        subtract: jest.fn(() => {
+          return {
+            format: jest.fn((m) => m),
+          }
+        }),
+      }
+    }),
   }
 
-  const Wrapper = () => {
+  const Wrapper = (propsData) => {
     return mount(UserTable, { localVue, propsData, mocks })
   }
 
   describe('mount', () => {
+    describe('type PageUserSearch', () => {
       beforeEach(() => {
-      wrapper = Wrapper()
+        wrapper = Wrapper(propsDataPageUserSearch)
       })
 
       it('has a DIV element with the class.component-user-table', () => {
         expect(wrapper.find('.component-user-table').exists()).toBeTruthy()
       })
+
+      it('has a DIV element with the id overlay that is not displayed', () => {
+        expect(wrapper.find('#overlay').exists()).toBeTruthy()
+        expect(wrapper.find('#overlay').attributes('style')).toBe('display: none;')
+      })
+
+      describe('table', () => {
+        it('has a table', () => {
+          expect(wrapper.find('table').exists()).toBeTruthy()
+        })
+
+        describe('header definition', () => {
+          it('has 4 column', () => {
+            expect(wrapper.findAll('th').length).toBe(7)
+          })
+
+          it('has Email as first column', () => {
+            expect(wrapper.find('th[aria-colindex="1"] div').text()).toBe('Email')
+          })
+
+          it('has First Name as second column', () => {
+            expect(wrapper.find('th[aria-colindex="2"] div').text()).toBe('First Name')
+          })
+
+          it('has Last Name as third column', () => {
+            expect(wrapper.find('th[aria-colindex="3"] div').text()).toBe('Last Name')
+          })
+
+          it('has Creation as fourth column', () => {
+            expect(wrapper.find('th[aria-colindex="4"] div').text()).toBe('Creation')
+          })
+
+          it('has Creation as fifth column', () => {
+            expect(wrapper.find('th[aria-colindex="5"] div').text()).toBe('Show Details')
+          })
+
+          it('has Creation as sixth column', () => {
+            expect(wrapper.find('th[aria-colindex="6"] div').text()).toBe('Confirm Mail')
+          })
+
+          it('has Creation as seventh column', () => {
+            expect(wrapper.find('th[aria-colindex="7"] div').text()).toBe('Transactions List')
+          })
+        })
+
+        describe('content', () => {
+          it('has 3 rows', () => {
+            expect(wrapper.findAll('tbody tr').length).toBe(3)
+          })
+
+          it('has 7 columns', () => {
+            expect(wrapper.findAll('tr:nth-child(1) > td').length).toBe(7)
+          })
+
+          it('click button on fifth column', () => {
+            wrapper.find('tbody tr td[aria-colindex="5"] button').trigger('click')
+          })
+        })
+      })
+
+      // it('expect(wrapper.html()).', () => {
+      //   // eslint-disable-next-line no-console
+      //   console.log(wrapper.html())
+      // })
+    })
+
+    describe('type UserListSearch', () => {
+      beforeEach(() => {
+        wrapper = Wrapper(propsDataUserListSearch)
+      })
+
+      it('has a DIV element with the class.component-user-table', () => {
+        expect(wrapper.find('.component-user-table').exists()).toBeTruthy()
+      })
+
+      // it('expect(wrapper.html()).', () => {
+      //   // eslint-disable-next-line no-console
+      //   console.log(wrapper.html())
+      // })
+    })
+
+    describe('type UserListMassCreation', () => {
+      beforeEach(() => {
+        wrapper = Wrapper(propsDataUserListMassCreation)
+      })
+
+      it('has a DIV element with the class.component-user-table', () => {
+        expect(wrapper.find('.component-user-table').exists()).toBeTruthy()
+      })
+
+      // it('expect(wrapper.html()).', () => {
+      //   // eslint-disable-next-line no-console
+      //   console.log(wrapper.html())
+      // })
+    })
+
+    describe('type PageCreationConfirm', () => {
+      beforeEach(() => {
+        wrapper = Wrapper(propsDataPageCreationConfirm)
+      })
+
+      it('has a DIV element with the class.component-user-table', () => {
+        expect(wrapper.find('.component-user-table').exists()).toBeTruthy()
+      })
+
+      // it('expect(wrapper.html()).', () => {
+      //   // eslint-disable-next-line no-console
+      //   console.log(wrapper.html())
+      // })
+    })
+    /** 
+    <user-table
+      v-if="itemsList.length > 0"
+      type="UserListSearch"
+      :itemsUser="itemsList"
+      :fieldsTable="Searchfields"
+      :criteria="criteria"
+      :creation="creation"
+      @update-item="updateItem"
+    /> 
+    
+    <user-table
+      v-show="itemsMassCreation.length > 0"
+      class="shadow p-3 mb-5 bg-white rounded"
+      type="UserListMassCreation"
+      :itemsUser="itemsMassCreation"
+      :fieldsTable="fields"
+      :criteria="null"
+      :creation="creation"
+      @update-item="updateItem"
+    />
+    
+    <user-table
+      class="mt-4"
+      type="PageCreationConfirm"
+      :itemsUser="confirmResult"
+      :fieldsTable="fields"
+      @remove-confirm-result="removeConfirmResult"
+    />
+
+    <user-table
+      type="PageUserSearch"
+      :itemsUser="searchResult"
+      :fieldsTable="fields"
+      :criteria="criteria"
+    />
+    */
   })
 })

admin/src/pages/Creation.spec.js

@@ -35,6 +35,16 @@ const mocks = {
   $toasted: {
     error: toastErrorMock,
   },
+  $moment: jest.fn(() => {
+    return {
+      format: jest.fn((m) => m),
+      subtract: jest.fn(() => {
+        return {
+          format: jest.fn((m) => m),
+        }
+      }),
+    }
+  }),
 }
 
 describe('Creation', () => {

admin/src/pages/Creation.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="creation">
     <b-row>
-      <b-col cols="12" lg="5">
+      <b-col cols="12" lg="6">
         <label>Usersuche</label>
         <b-input
           type="text"
@@ -19,7 +19,7 @@
           @update-item="updateItem"
         />
       </b-col>
-      <b-col cols="12" lg="7" class="shadow p-3 mb-5 rounded bg-info">
+      <b-col cols="12" lg="6" class="shadow p-3 mb-5 rounded bg-info">
         <user-table
           v-show="itemsMassCreation.length > 0"
           class="shadow p-3 mb-5 bg-white rounded"
@@ -62,14 +62,38 @@ export default {
         { key: 'bookmark', label: 'bookmark' },
         { key: 'firstName', label: this.$t('firstname') },
         { key: 'lastName', label: this.$t('lastname') },
-        { key: 'creation', label: this.$t('open_creations') },
+        {
+          key: 'creation',
+          // label: this.$t('open_creation') + 'Jan | Feb | März',
+          label:
+            this.$moment().subtract(2, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().subtract(1, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().format('MMM'),
+          formatter: (value, key, item) => {
+            return String(value[0]) + ` | ` + String(value[1]) + ` |  ` + String(value[2])
+          },
+        },
         { key: 'email', label: this.$t('e_mail') },
       ],
       fields: [
         { key: 'email', label: this.$t('e_mail') },
         { key: 'firstName', label: this.$t('firstname') },
         { key: 'lastName', label: this.$t('lastname') },
-        { key: 'creation', label: this.$t('open_creations') },
+        {
+          key: 'creation',
+          // label: this.$t('open_creation') + 'Jan | Feb | März',
+          label:
+            this.$moment().subtract(2, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().subtract(1, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().format('MMM'),
+          formatter: (value, key, item) => {
+            return String(value[0]) + ` | ` + String(value[1]) + ` |  ` + String(value[2])
+          },
+        },
         { key: 'bookmark', label: this.$t('remove') },
       ],
       itemsList: [],

admin/src/pages/UserSearch.vue

@@ -42,27 +42,15 @@ export default {
         { key: 'lastName', label: this.$t('lastname') },
         {
           key: 'creation',
-          label: this.$t('open_creation'),
+          // label: this.$t('open_creation') + 'Jan | Feb | März',
+          label:
+            this.$moment().subtract(2, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().subtract(1, 'month').format('MMM') +
+            ' | ' +
+            this.$moment().format('MMM'),
           formatter: (value, key, item) => {
-            return (
+            return String(value[0]) + ` | ` + String(value[1]) + ` |  ` + String(value[2])
-              `
-            <div>` +
-              this.$moment().subtract(2, 'month').format('MMMM') +
-              ` - ` +
-              String(value[0]) +
-              ` GDD</div>
-            <div>` +
-              this.$moment().subtract(1, 'month').format('MMMM') +
-              ` - ` +
-              String(value[1]) +
-              ` GDD</div>
-            <div>` +
-              this.$moment().format('MMMM') +
-              ` - ` +
-              String(value[2]) +
-              ` GDD</div>
-            `
-            )
           },
         },
         { key: 'show_details', label: this.$t('details') },