feat(tests): create useCase for UsersInServices

users-manage/src/adapters/adapterOfUsers/Users.js

@@ -1,5 +1,5 @@
 import {get, post, put, remove} from './apiHelpers.js'
-import {convertList} from '@helpers/adapter/adapter.js'
+import {convertList, convertObject} from '@helpers/adapter/adapter.js'
 import {devUsersList} from './StaticData.js'
 
 /**
@@ -8,15 +8,22 @@ import {devUsersList} from './StaticData.js'
  * @param {Number}  id
  */
 
+const adapter_config = {
+  id: "id",
+  first_name: "firstName",
+  last_name: "lastName",
+  email: "email",
+  role: "role",
+}
+
 class Users {
   /**
    * Класс управления роутерами
    * @param {String} apiAddr - path to service
-   * @param {Object | undefined} adapter_config - oldKey: newKey
    * @param {Object | undefined} params - Конфиг настроек
    * @param {'prod' | 'test'} params.mode - Конфиг настроек
    */
-  constructor(apiAddr, adapter_config = {}, params = {mode: 'prod'}) {
+  constructor(apiAddr, params = {mode: 'prod'}) {
     this.apiAddr = apiAddr
     this.config  = adapter_config
     this.mode    = params.mode
@@ -28,7 +35,7 @@ class Users {
    * @param {'prod' | 'dev'} params.mode - Конфиг настроек
    * @returns {Promise<*[]> | *[]}
    */
-  async getUsers(params) {
+  async getUsers(params = {mode: 'prod'}) {
     if (params.mode === "dev") {
       return devUsersList
     }
@@ -41,9 +48,9 @@ class Users {
    *
    * @param {Number} id - Сервис id, если id не указан, отображается список всех роутеров
    * @param {'dev' | 'prod'} mode - Сервис id, если id не указан, отображается список всех роутеров
-   * @returns {Promise<*[]>}
+   * @returns {Promise<Array<User>> | any}
    */
-  async getUsersBySiteId(id, mode) {
+  async getUsersByServiceId(id, mode) {
     if (mode === "dev") {
       return devUsersList
     }
@@ -55,33 +62,33 @@ class Users {
   /**
    *
    * @param {User} userData
-   * @returns {Promise<void>}
+   * @returns {Promise<Object>}
    */
   async createUser(userData) {
     const newUser = await post(`${this.apiAddr}/users`, userData)
-    return newUser
+    return convertObject(newUser, {config: this.config})
   }
 
   /**
    *
    * @param {User} userData
-   * @returns {Promise<void>}
+   * @returns {Promise<Object>}
    */
   async updateUser(userData) {
     const updatedUserData = {...userData}
     delete updatedUserData.id
     const newUser = await put(`${this.apiAddr}/users/${userData.id}`, updatedUserData)
-    return newUser
+    return convertObject(newUser, {config: this.config})
   }
 
   /**
    *
    * @param {Number} userId - Сервис id, если id не указан, отображается список всех роутеров
-   * @returns {Promise<*[]>}
+   * @returns {Promise<Object>}
    */
   async removeUser(userId) {
     const removedUser = await remove(`${this.apiAddr}/users/${userId}`)
-    return removedUser
+    return convertObject(removedUser, {config: this.config})
   }
 
 

users-manage/src/components/2_molecules/Tabulator/VTabulator.vue

@@ -94,7 +94,6 @@ export default {
   },
   methods: {
     makeTable () {
-      console.log(Tabulator)
       this.table = new Tabulator(this.$refs[this.refId], this.getConfig())
     },
     getConfig () {

users-manage/src/components/3_organisms/UsersManager/UsersManager.vue

@@ -9,6 +9,12 @@ import {mapGetters} from 'vuex'
 export default {
   name: 'UsersManager',
   components: {ModuleContainer, UsersTable, UsersEditor, ManagerTitle, VButton},
+  props: {
+    serviceOfUsers: {
+      type: Object,
+      default: () => ({})
+    }
+  },
   data() {
     return {
       componentState: 'view' // view | create | select
@@ -26,6 +32,7 @@ export default {
     },
     openUserPanelOfSelect() {
       this.componentState = 'select'
+      this.serviceOfUsers.fetchUsersOffSite()
     },
     closeUserPanel() {
       this.componentState = 'view'
@@ -36,10 +43,10 @@ export default {
 
 <template>
   <div
-    class="grid gap-4"
+    class="grid grid-cols-12 gap-4"
     :class="`${gridCols}`"
   >
-    <ModuleContainer>
+    <ModuleContainer :class="[{'col-span-12': componentState === 'view', 'col-span-4': componentState !== 'view' }]">
       <ManagerTitle class="mb-4">
         <template #title>
           <span>Список пользователей</span>
@@ -48,12 +55,14 @@ export default {
           <div class="flex items-center gap-2">
             <VButton
               color="blue"
+              test-id="toggle-new-user"
               @click="openUserPanelOfCreate"
             >
-              Добавить пользователя
+              Создать пользователя
             </VButton>
             <VButton
               color="purple"
+              test-id="toggle-add-user"
               @click="openUserPanelOfSelect"
             >
               Добавить существующего
@@ -63,8 +72,11 @@ export default {
       </ManagerTitle>
       <UsersTable :usersList="usersList" />
     </ModuleContainer>
-    <ModuleContainer v-if="componentState === 'create'">
-      <ManagerTitle>
+    <ModuleContainer
+      v-if="componentState === 'create'"
+      class="col-span-8"
+    >
+      <ManagerTitle test-id="new-user-container">
         <template #title>
           <span>Создать пользователя</span>
         </template>
@@ -80,7 +92,10 @@ export default {
       </ManagerTitle>
       <UsersEditor />
     </ModuleContainer>
-    <ModuleContainer v-if="componentState === 'select'">
+    <ModuleContainer
+      v-if="componentState === 'select'"
+      class="col-span-8"
+    >
       <ManagerTitle>
         <template #title>
           <span>Выбрать пользователя</span>

users-manage/src/components/3_organisms/UsersManager/UsersManagerUsersTable.vue

@@ -11,11 +11,10 @@ export default {
     },
   },
   data() {
-    const editItem = (item) =>  this.editItem(item);
-
-    const deleteItem = (item) =>  this.deleteItem(item);
-
+    const editItem = (item)   =>  this.editItem(item)
+    const deleteItem = (item) =>  this.deleteItem(item)
     return {
+      rerenderStep: 3,
       columns: [
         {
           field: "id",
@@ -44,15 +43,33 @@ export default {
         {
           title: "Actions",
           formatter: (cell) => {
-            return `<button @click="editItem(${cell.getRow().getIndex()})">Edit</button>
-                  <button @click="deleteItem(${cell.getRow().getIndex()})">Delete</button>`;
+            const record = cell.getRow().getData();
+            const id = record.id;
+            return `
+                    <button action="edit" class="text-white mr-2 text-xs bg-blue-700 hover:bg-blue-800 focus:outline-none focus:ring-4 focus:ring-blue-300 font-medium rounded-full text-sm px-3 py-2 text-center mb-2 dark:bg-blue-600 dark:hover:bg-blue-700 dark:focus:ring-blue-900">
+                      <i action="edit" class="ri-pencil-line"></i>
+                    </button>
+                    <input action="toggle-remove" type="checkbox" id="remove-option-${id}" value="" class="hidden peer" required="">
+                    <label for="remove-option-${id}"  class="peer-checked:hidden cursor-pointer inline-text text-white text-xs bg-red-700 hover:bg-red-800 focus:outline-none focus:ring-4 focus:ring-red-300 font-medium rounded-full text-sm px-3 py-2 text-center mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
+                    >
+                        <i class="ri-delete-bin-line"></i>
+                    </label>
+                    <label action="remove" for="remove-option-${id}" class="hidden cursor-pointer mr-2 peer-checked:flex text-white text-xs bg-red-700 hover:bg-red-800 focus:outline-none focus:ring-4 focus:ring-red-300 font-medium rounded-full text-sm px-3 py-2 text-center mb-2 dark:bg-red-600 dark:hover:bg-red-700 dark:focus:ring-red-900"
+                     >
+                        <i action="remove" class="ri-check-line"></i>
+                    </label>
+                    <label action="close-remove" for="remove-option-${id}" class="hidden cursor-pointer peer-checked:flex text-white text-xs bg-gray-700 hover:bg-gray-800 focus:outline-none focus:ring-4 focus:ring-gray-300 font-medium rounded-full text-sm px-3 py-2 text-center mb-2 dark:bg-gray-600 dark:hover:bg-gray-700 dark:focus:ring-gray-900">
+                        <i class="ri-close-line"></i>
+                    </label>
+
+
+`;
           },
           cellClick: function(e, cell) {
-            // Handle the click event and call Vue methods
-            const action = e.target.textContent.toLowerCase();
+            const action = e.target.getAttribute('action');
             if (action === 'edit') {
               editItem(cell.getRow().getData());
-            } else if (action === 'delete') {
+            } else if (action === 'remove') {
               deleteItem(cell.getRow().getData());
             }
           },
@@ -66,7 +83,7 @@ export default {
     deleteItem(item) {
       console.log('Delete item:', item);
     },
-  },
+  }
 }
 </script>
 

users-manage/src/components/5_pages/SitesManagerPage/SitesManagerPage.vue

@@ -58,10 +58,12 @@ export default {
     <SiteList
       :serviceOfUsers="serviceOfServices"
       :caseOfUsersInService="caseOfUsersInService"
+      :selectSite="selectSite"
     />
     <SiteManager
       v-if="selectedSiteState === 'active'"
       :serviceOfUsers="serviceOfUsers"
+      :caseOfUsersInService="caseOfUsersInService"
     />
   </div>
 </template>

users-manage/src/services/serviceOfServices/Services.js

@@ -9,6 +9,10 @@ class ServiceOfServices {
     this.store.dispatch('services/saveServices', services)
     return services
   }
+
+  async getSelectedService() {
+    return this.store.getters['services/selectedService']
+  }
 }
 
 export default ServiceOfServices

users-manage/src/services/serviceOfUsers/Users.js

@@ -1,5 +1,38 @@
 class UsersOfServices {
-  constructor() {
+  constructor(adapter, store) {
+    this.adapter = adapter
+    this.store = store
+  }
+
+  /**
+   *
+   * @param {Array} users
+   * @returns {Promise<Array>}
+   */
+  async saveSiteUsers(users) {
+    await this.store.dispatch('users/saveSiteUsers', users)
+    return users
+  }
+
+  /**
+   *
+   * @param {Array} users
+   * @returns {Promise<Array>}
+   */
+  async saveUsersWithoutSite(users) {
+    await this.store.dispatch('users/saveUsersWithoutSite', users)
+    return users
+  }
+
+  /**
+   *
+   * @param serviceId
+   * @returns {Promise<void>}
+   */
+  async fetchUsersByService(serviceId) {
+    const users = await this.adapter.getUsersByServiceId(serviceId)
+    await this.saveSiteUsers(users)
+    return users
   }
 }
 

users-manage/src/store/modules/services/index.js

@@ -61,8 +61,7 @@ const actions = {
     const newRoute = {"path": null, "role": null, id: -1}
     state.newRoute = newRoute
   },
-  createNewRoute: ({state}, payload) => {
-    console.log(payload)
+  createNewRoute: ({state}) => {
     state.newRoute = null
   },
   stopAddingRoute: ({state}) => {

users-manage/src/useCases/CaseOfUsersInService.js

@@ -4,6 +4,19 @@ class UsersInService {
     this.serviceOfServices = serviceOfServices
   }
 
+  async fetchUsersByService() {
+    const selectedService = this.serviceOfServices.getSelectedService()
+    if (!selectedService) {
+      console.error('fetchUsersByService: Service not found')
+      return []
+    }
+    this.serviceOfUsers.fetchUsersByService(selectedService.id)
+  }
+
+  async fetchUsersWithoutService() {
+
+  }
+
 }
 
 export default UsersInService

users-manage/tests/adapters/Users.test.js

@@ -1,11 +1,59 @@
-import {describe, expect, test} from "vitest";
+import {describe, expect, test, vi} from "vitest";
 import AdapterOfUsers from '@adapters/adapterOfUsers/Users'
+import axios from "axios";
+import {apiUser, appUser} from '@mocks/users.js'
 
+vi.mock('axios')
 
 describe('test for AdapterOfUsers', () => {
-  test('init', () => {
-    const adapterOfUsers = new AdapterOfUsers('http://localhost:8080')
+  const adapterOfUsers = new AdapterOfUsers('http://localhost:8080')
 
+  test('init', () => {
     expect(adapterOfUsers).toBeDefined()
   })
+
+  test('getUsersBySiteId', async () => {
+    axios.get.mockResolvedValue({
+      data: [apiUser],
+    })
+
+    const users = await adapterOfUsers.getUsersByServiceId(1)
+    expect(users).toEqual([appUser])
+  })
+
+  test('getUsers', async () => {
+    axios.get.mockResolvedValue({
+      data: [apiUser],
+    })
+
+    const users = await adapterOfUsers.getUsers()
+    expect(users).toEqual([appUser])
+  })
+
+  test('updateUser', async () => {
+    axios.put.mockResolvedValue({
+      data: apiUser,
+    })
+
+    const user = await adapterOfUsers.updateUser(appUser)
+    expect(user).toEqual(appUser)
+  })
+
+  test('createUser', async () => {
+    axios.post.mockResolvedValue({
+      data: apiUser,
+    })
+
+    const user = await adapterOfUsers.createUser()
+    expect(user).toEqual(appUser)
+  })
+
+  test('removeUser', async () => {
+    axios.delete.mockResolvedValue({
+      data: apiUser,
+    })
+
+    const user = await adapterOfUsers.removeUser(appUser.id)
+    expect(user).toEqual(appUser)
+  })
 })

users-manage/tests/mocks/adapters.js

@@ -0,0 +1,23 @@
+import {appUser} from "@mocks/users.js";
+
+class AdapterOfUsers {
+  constructor() {
+  }
+
+  // eslint-disable-next-line no-unused-vars
+  async getUsersByServiceId() {
+    return [appUser]
+  }
+}
+
+class AdapterOfServices {
+  constructor() {
+  }
+}
+
+const adapterOfUsers    = new AdapterOfUsers()
+const adapterOfServices = new AdapterOfServices()
+
+export {
+  adapterOfUsers,
+  adapterOfServices}

users-manage/tests/mocks/users.js

@@ -0,0 +1,17 @@
+const apiUser = {
+  id: 1,
+  first_name: 'user1',
+  last_name: 'user1',
+  email: 'test@gmail.com',
+  role: 'user',
+}
+
+const appUser = {
+  id: 1,
+  firstName: 'user1',
+  lastName: 'user1',
+  email: 'test@gmail.com',
+  role: 'user',
+}
+
+export {apiUser, appUser}

users-manage/tests/services/serviceOfServices.test.js

@@ -59,6 +59,7 @@ describe('tests for ServiceOfServices', () => {
     const serviceOfServices = new ServiceOfServices(adapterOfServices, store)
 
     await serviceOfServices.fetchServicesList()
+
     const usersList = store.getters['services/servicesList']
 
     expect(usersList).toEqual([{id: 1, name: 'service1'}, {id: 2, name: 'service2'}])

users-manage/tests/services/serviceOfUsers.test.js

@@ -1,18 +0,0 @@
-import {describe, expect, test} from "vitest";
-import ServiceOfUsers from '@services/serviceOfUsers/Users.js'
-
-class AdapterOfUsers {
-  constructor() {
-  }
-}
-
-describe('test for ServiceOfUsers', () => {
-  test('init', () => {
-    const adapterOfUsers = new AdapterOfUsers()
-
-    const serviceOfUsers = new ServiceOfUsers(adapterOfUsers)
-
-    expect(serviceOfUsers).toBeDefined()
-  })
-})
-

users-manage/tests/services/serviceOfUsers/MockData.js

@@ -0,0 +1,71 @@
+import {createStore} from "vuex";
+import {appUser} from "@mocks/users.js";
+
+class AdapterOfUsers {
+  constructor() {
+  }
+
+  getUsersList() {
+    return [appUser]
+  }
+
+  getUsersByServiceId() {
+    return [appUser]
+  }
+}
+
+const users = {
+  namespaced: true,
+  state: {
+    siteUsers: [],
+    usersWithoutSite: [],
+  },
+  mutations: {
+    setSiteUsers(state, users) {
+      state.siteUsers = users
+    },
+    setUsersWithoutSite(state, users) {
+      state.usersWithoutSite = users
+    },
+  },
+  getters: {
+    siteUsers: state => {
+      return state.siteUsers
+    },
+    usersWithoutSite: state => {
+      return state.usersWithoutSite
+    }
+  },
+  actions: {
+    resetStore({state}) {
+      state.siteUsers = []
+    },
+    saveSiteUsers({commit}, users) {
+      commit('setSiteUsers', users)
+    },
+    saveUsersWithoutSite({commit}, users) {
+      commit('setUsersWithoutSite', users)
+    }
+  },
+}
+
+
+const services = {
+  namespaced: true,
+  getters: {
+    selectedService: () => {
+      return {id: 1, name: 'service1'}
+    }
+  },
+}
+
+const store = createStore({
+  modules: {
+    users,
+    services
+  },
+})
+
+const adapterOfUsers = new AdapterOfUsers()
+
+export {adapterOfUsers, store}

users-manage/tests/services/serviceOfUsers/serviceOfUsers.test.js

@@ -0,0 +1,36 @@
+import {describe, expect, test, beforeEach} from "vitest";
+import ServiceOfUsers from '@services/serviceOfUsers/Users.js'
+import {adapterOfUsers, store} from './MockData.js'
+import {appUser} from '@mocks/users.js'
+
+describe('test for ServiceOfUsers', () => {
+  const serviceOfUsers = new ServiceOfUsers(adapterOfUsers, store)
+
+  beforeEach( async() => {
+    await store.dispatch('users/resetStore')
+  })
+
+  test('init', () => {
+    expect(serviceOfUsers).toBeDefined()
+  })
+
+  test('saveSiteUsers', async () => {
+    await serviceOfUsers.saveSiteUsers([appUser])
+    const storeUsers = store.getters['users/siteUsers']
+    expect(storeUsers).toEqual([appUser])
+  })
+
+  test('saveUsersWithoutSite', async () => {
+    await serviceOfUsers.saveUsersWithoutSite([appUser])
+    const storeUsers = store.getters['users/usersWithoutSite']
+    expect(storeUsers).toEqual([appUser])
+  })
+
+  test('fetchUsersByService', async () => {
+    const serviceId = 1
+    await serviceOfUsers.fetchUsersByService(serviceId)
+    const storeUsers = store.getters['users/siteUsers']
+    expect(storeUsers).toEqual([appUser])
+  })
+})
+

users-manage/tests/useCases/CaseOfUsersInService.test.js

@@ -1,106 +0,0 @@
-import {describe, expect, test, beforeEach} from "vitest";
-import CaseOfUsersInService from '@useCases/CaseOfUsersInService.js'
-import {createStore} from 'vuex'
-
-class ServiceOfUsers {
-  constructor(adapter, store) {
-    this.adapter = adapter
-    this.store = store
-  }
-}
-
-class ServiceOfServices {
-  constructor(adapter, store) {
-    this.adapter = adapter
-    this.store = store
-  }
-}
-
-class AdapterOfUsers {
-  constructor() {
-  }
-
-  // eslint-disable-next-line no-unused-vars
-  async getUsersListByServiceId(serviceId) {
-    return [{id: 1, name: 'user1'}, {id: 2, name: 'user2'}]
-  }
-}
-
-class AdapterOfServices {
-  constructor() {
-  }
-}
-
-describe('tests for caseOfUsersInService', () => {
-  const store = createStore({
-    modules: {
-      services: {
-        namespaced: true,
-        state: {
-          services: [],
-        },
-        mutations: {
-          setServices(state, services) {
-            state.services = services
-          },
-        },
-        actions: {
-          resetStore({state}) {
-            state.services = []
-          },
-          saveServices({commit}, services) {
-            commit('setServices', services)
-          }
-        },
-      },
-      users: {
-        namespaced: true,
-        state: {
-          siteUsersList: [],
-        },
-        mutations: {
-          setSiteUsersList(state, users) {
-            state.users = users
-          },
-        },
-        actions: {
-          resetStore({state}) {
-            state.siteUsersList = []
-          },
-          saveUsers({commit}, users) {
-            commit('setSiteUsersList', users)
-          }
-        },
-      },
-    },
-  })
-
-  const adapterOfUsers    = new AdapterOfUsers()
-  const adapterOfServices = new AdapterOfServices()
-
-  const serviceOfUsers    = new ServiceOfUsers(adapterOfUsers, store)
-  const serviceOfServices = new ServiceOfServices(adapterOfServices, store)
-
-  beforeEach( async() => {
-    await store.dispatch('services/resetStore')
-    await store.dispatch('users/resetStore')
-  })
-
-  test('init', () => {
-    const caseOfUsersInService = new CaseOfUsersInService(serviceOfUsers, serviceOfServices)
-
-    expect(caseOfUsersInService).toBeDefined()
-  })
-
-  // test('selectServiceAndFetchRoutes', async () => {
-  //   const caseOfUsersInService = new CaseOfUsersInService(serviceOfUsers, serviceOfServices)
-  //
-  //   await caseOfUsersInService.selectServiceAndFetchRoutes(1)
-  //
-  //   const selectedService = store.getters['services/selectedService']
-  //   const usersList       = store.getters['users/siteUsersList']
-  //
-  //   expect(selectedService).toEqual({id: 1, name: 'service1'})
-  //   expect(usersList).toEqual([{id: 1, name: 'user1'}, {id: 2, name: 'user2'}])
-  // })
-})

users-manage/tests/useCases/CaseOfUsersInService/CaseOfUsersInService.test.js

@@ -0,0 +1,31 @@
+import {describe, expect, test, beforeEach} from "vitest";
+import CaseOfUsersInService from '@useCases/CaseOfUsersInService.js'
+import {serviceOfUsers, serviceOfServices, store} from './MockData.js'
+import {appUser} from '@mocks/users.js'
+
+
+describe('tests for caseOfUsersInService', () => {
+
+  beforeEach( async() => {
+    await store.dispatch('services/resetStore')
+    await store.dispatch('users/resetStore')
+  })
+
+  const caseOfUsersInService = new CaseOfUsersInService(serviceOfUsers, serviceOfServices)
+
+  test('init', () => {
+    expect(caseOfUsersInService).toBeDefined()
+  })
+
+  test('fetchUsersByService', async () => {
+    await caseOfUsersInService.fetchUsersByService()
+    const storeUsers = store.getters['users/siteUsers']
+    expect(storeUsers).toEqual([appUser])
+  })
+
+  // test('fetchUsersWithoutService', async () => {
+  //   await caseOfUsersInService.fetchUsersWithoutService()
+  //   const storeUsers = store.getters['users/usersWithoutSite']
+  //   expect(storeUsers).toEqual([appUser])
+  // })
+})

users-manage/tests/useCases/CaseOfUsersInService/MockData.js

@@ -0,0 +1,76 @@
+import {createStore} from "vuex";
+import {adapterOfUsers, adapterOfServices} from "@mocks/adapters.js";
+import ServiceOfUsers from "@services/serviceOfUsers/Users";
+import ServiceOfServices from "@services/serviceOfServices/Services";
+
+const services = {
+  namespaced: true,
+  state: {
+    services: [],
+  },
+  mutations: {
+    setServices(state, services) {
+      state.services = services
+    },
+  },
+  getters: {
+    selectedService: () => {
+      return {id: 1, name: 'service1'}
+    }
+  },
+  actions: {
+    resetStore({state}) {
+      state.services = []
+    },
+    saveServices({commit}, services) {
+      commit('setServices', services)
+    }
+  },
+}
+
+const users = {
+  namespaced: true,
+  state: {
+    siteUsers: [],
+    usersWithoutSite: [],
+  },
+  mutations: {
+    setSiteUsers(state, users) {
+      state.siteUsers = users
+    },
+    setUsersWithoutSite(state, users) {
+      state.usersWithoutSite = users
+    },
+  },
+  getters: {
+    siteUsers: state => {
+      return state.siteUsers
+    },
+    usersWithoutSite: state => {
+      return state.usersWithoutSite
+    }
+  },
+  actions: {
+    resetStore({state}) {
+      state.siteUsers = []
+    },
+    saveSiteUsers({commit}, users) {
+      commit('setSiteUsers', users)
+    },
+    saveUsersWithoutSite({commit}, users) {
+      commit('setUsersWithoutSite', users)
+    }
+  },
+}
+
+const store = createStore({
+  modules: {
+    services,
+    users,
+  },
+})
+
+const serviceOfUsers    = new ServiceOfUsers(adapterOfUsers, store)
+const serviceOfServices = new ServiceOfServices(adapterOfServices, store)
+
+export {serviceOfUsers, serviceOfServices, store}

users-manage/tests/views/2_molecules/Tabulator.test.js

@@ -2,7 +2,6 @@ import {test, describe, expect, vi } from 'vitest'
 import { mount} from '@vue/test-utils'
 import VTabulator from '@molecules/Tabulator/VTabulator.vue';
 
-
 describe("tests VTabulator component", () => {
 
   vi.mock('tabulator-tables', () => {

users-manage/tests/views/2_molecules/TabulatorMock.js

@@ -1,4 +0,0 @@
-class Tabulator {
-}
-
-export default Tabulator;

users-manage/tests/views/3_organisms/StaticMocks.js

@@ -0,0 +1,50 @@
+import {createStore} from "vuex";
+
+const users = {
+  namespaced: true,
+  state: {
+    usersOffSite: [],
+  },
+  mutations: {
+    setUsersOffSite(state, users) {
+      state.usersOffSite = users
+    }
+  },
+  getters: {
+    usersOffSite: state => {
+      return state.usersOffSite
+    }
+  },
+  actions: {
+    resetStore({state}) {
+      state.notIncludedSiteUsersList = []
+    },
+    saveUsersOffSite({commit}, users) {
+      console.log(users)
+      commit('setUsersOffSite', users)
+    }
+  },
+}
+
+const store = createStore({
+  plugins: [],
+  modules: {
+    users
+  },
+})
+
+class ServiceOfUsers {
+  constructor(adapter, store) {
+    this.adapter = adapter
+    this.store = store
+  }
+
+  async fetchUsersOffSite() {
+    const usersList = [{id: 1, name: 'user1'}, {id: 2, name: 'user2'}]
+    this.store.dispatch('users/saveUsersOffSite', usersList)
+  }
+}
+
+const serviceOfUsers = new ServiceOfUsers({}, store)
+
+export {store, serviceOfUsers}

users-manage/tests/views/3_organisms/UsersManager.test.js

@@ -1,21 +1,13 @@
 import { mount} from '@vue/test-utils'
 import { expect, test, describe, vi, beforeEach } from 'vitest'
 import UsersManager from '@organisms/UsersManager/UsersManager.vue';
-import { createStore } from 'vuex'
-import {store as services} from '@/store/modules/services';
-import {store as users} from '@/store/modules/users';
 import axios from "axios";
+import {store, serviceOfUsers} from './StaticMocks.js'
 
 vi.mock('axios')
 
+
 describe("tests SitesManagerPage component mounted with vuex", () => {
-  const store = createStore({
-    plugins: [],
-    modules: {
-      services,
-      users
-    },
-  })
 
   vi.mock('tabulator-tables', () => {
     const mockTabulator = vi.fn().mockImplementation(() => ({
@@ -26,7 +18,6 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
 
   beforeEach(async () => {
     store.dispatch('users/resetStore')
-    store.dispatch('services/resetStore')
 
     const mockData = [
       {
@@ -55,12 +46,13 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
   test('test UsersManager mounted with vuex', async () => {
     const wrapper = mount(UsersManager, {
       global: {
-        plugins: [store]
+        plugins: [store],
+        props: {
+          serviceOfUsers
+        }
       }
     })
 
-    console.log(wrapper.html())
-
     const componentState = wrapper.vm.componentState
     const gridCols = wrapper.vm.gridCols
     expect(componentState).toBe('view')
@@ -71,6 +63,9 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
     const wrapper = mount(UsersManager, {
       global: {
         plugins: [store]
+      },
+      props: {
+        serviceOfUsers
       }
     })
 
@@ -82,7 +77,7 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
     let wrapperHtml = wrapper.html()
     expect(componentState).toBe('create')
     expect(gridCols).toBe('grid-cols-2')
-    expect(wrapperHtml).toContain("Создать пользователя")
+    expect(wrapperHtml).toContain("new-user-container")
 
     await wrapper.vm.openUserPanelOfSelect()
     wrapperHtml = wrapper.html()
@@ -100,7 +95,7 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
     expect(componentState).toBe('view')
     expect(gridCols).toBe('grid-cols-1')
     expect(wrapperHtml).not.toContain("Выбрать пользователя")
-    expect(wrapperHtml).not.toContain("Создать пользователя")
+    expect(wrapperHtml).not.toContain("new-user-container")
   })
 
   test('test UsersManager select user button', async () => {
@@ -108,14 +103,22 @@ describe("tests SitesManagerPage component mounted with vuex", () => {
       shallow: true,
       global: {
         plugins: [store]
+      },
+      props: {
+        serviceOfUsers
       }
     })
 
-    wrapper.vm.openUserPanelOfSelect()
+    await wrapper.vm.openUserPanelOfSelect()
+
+    const usersOffSite = store.getters['users/usersOffSite']
+
     const componentState = wrapper.vm.componentState
     const gridCols = wrapper.vm.gridCols
+
     expect(componentState).toBe('select')
     expect(gridCols).toBe('grid-cols-2')
+    expect(usersOffSite).toEqual([{id: 1, name: 'user1'}, {id: 2, name: 'user2'}])
   })
 })
 

users-manage/tests/views/3_organisms/UsersManagerTable.test.js

@@ -11,6 +11,7 @@ describe("tests UsersManagerUsersTable component", () => {
 
     expect(wrapper.exists()).toBe(true)
   })
+
 })
 
 

users-manage/vite.config.js

@@ -15,10 +15,11 @@ export default defineConfig({
       '@molecules': fileURLToPath(new URL('./src/components/2_molecules', import.meta.url)),
       '@organisms': fileURLToPath(new URL('./src/components/3_organisms', import.meta.url)),
       '@pages': fileURLToPath(new URL('./src/components/5_pages', import.meta.url)),
-      '@router': fileURLToPath(new URL('/src/router/index.js', import.meta.url)),
-      '@adapters': fileURLToPath(new URL('/src/adapters', import.meta.url)),
-      '@services': fileURLToPath(new URL('/src/services', import.meta.url)),
-      '@useCases': fileURLToPath(new URL('/src/useCases', import.meta.url)),
+      '@router': fileURLToPath(new URL('./src/router/index.js', import.meta.url)),
+      '@adapters': fileURLToPath(new URL('./src/adapters', import.meta.url)),
+      '@services': fileURLToPath(new URL('./src/services', import.meta.url)),
+      '@useCases': fileURLToPath(new URL('./src/useCases', import.meta.url)),
+      '@mocks': fileURLToPath(new URL('./tests/mocks', import.meta.url)),
     }
   },
   test: {