diff --git a/components/AddMemberToTeamModal.vue b/components/AddMemberToTeamModal.vue
index c0ecd61..fe623a2 100644
--- a/components/AddMemberToTeamModal.vue
+++ b/components/AddMemberToTeamModal.vue
@@ -76,17 +76,19 @@
   </div>
 </template>
 <script>
-import HttpService from "@services/httpService";
+// import HttpService from "@services/httpService";
 
 export default {
   name: "sharemodal",
   props: ["item", "itemType"],
   mounted() {
-    this.httpService = new HttpService(this.loginMicroServiceName);
+    // this.httpService = new HttpService(this.loginMicroServiceName);
+    this.httpService = useNuxtApp()["$http"];
   },
   data() {
     return {
-      httpService: undefined,
+      // httpService: undefined,
+      httpService: {},
       newItemType: 0,
       suggestionMode: false,
       query: "",
diff --git a/components/SortingByDayTasksAdmin.vue b/components/SortingByDayTasksAdmin.vue
index 427e3b2..854ae45 100644
--- a/components/SortingByDayTasksAdmin.vue
+++ b/components/SortingByDayTasksAdmin.vue
@@ -61,19 +61,24 @@
 </template>
 
 <script>
-import HttpService from "@services/httpService";
-import taskApi from "@apis/taskApi";
+// import HttpService from "@services/httpService";
+import taskApi from "@task/apis/taskApi";
 export default {
   props: {
     workList: [],
     userId: "",
   },
-  
+
   beforeMount() {
-    this.httpService = new HttpService( this.taskMicroServiceName
-    );
+    // this.httpService = new HttpService( this.taskMicroServiceName
+    // );
+    this.httpService = useNuxtApp()["$http"];
+  },
+  data() {
+    return {
+      httpService: {},
+    };
   },
-  
   computed: {
     taskMicroServiceName() {
       return process.env.VUE_APP_TASK;
@@ -97,13 +102,10 @@ export default {
       };
       const url = taskApi.workingHours.day;
 
-      this.httpService
-        .postRequest(url, payload)
-        .then((res) => {
-          this.$set(hourItem, "tasks", res.data);
-          //   this.sortForms = res.data;
-        })
-        
+      this.httpService.postRequest(url, payload).then((res) => {
+        this.$set(hourItem, "tasks", res.data);
+        //   this.sortForms = res.data;
+      });
     },
   },
 };
diff --git a/components/TaskGroupReport.vue b/components/TaskGroupReport.vue
index 007891e..6197f41 100644
--- a/components/TaskGroupReport.vue
+++ b/components/TaskGroupReport.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class=" container-fluid">
+  <div class="container-fluid">
     <div class="all-selects justify-content-between col-12">
       <div class="selects col-md-4 justify-content-start align-items-center">
         <div>
@@ -30,7 +30,11 @@
         </div>
         <div>
           <label class="teams-label">تیم ها:</label>
-          <select v-model="group_id" @change="getMainList" class="form-select form-control">
+          <select
+            v-model="group_id"
+            @change="getMainList"
+            class="form-select form-control"
+          >
             <option selected value="">همه</option>
             <option v-for="item in groups" :value="item.id">
               {{ item.title }}
@@ -142,7 +146,6 @@
               height="300px"
             ></pie-donut>
           </div>
-
         </div>
       </div>
     </main>
@@ -150,17 +153,20 @@
 </template>
 
 <script>
-import { mapGetters, mapActions } from "vuex";
-import HttpService from "@services/httpService";
+// import { mapGetters, mapActions } from "vuex";
+import { mapState, mapActions } from "pinia";
+import { useCommonStore } from "~/stores/commonStore";
+// import HttpService from "@services/httpService";
 import menu from "@task/json/menu.json";
-import adminApi from "@apis/adminApi";
-import taskApi from "@apis/taskApi";
-import { p2e } from "@plugins/persianNumber";
+// import adminApi from "@apis/adminApi";
+import taskApi from "@task/apis/taskApi";
+// import { p2e } from "@plugins/persianNumber";
 
 export default {
   beforeMount() {
-    this.httpService = new HttpService( this.taskMicroServiceName
-    );
+    // this.httpService = new HttpService( this.taskMicroServiceName
+    // );
+    this.httpService = useNuxtApp()["$http"];
   },
   mounted() {
     this.checkPermisionBeforGetList();
@@ -196,7 +202,8 @@ export default {
       mainList: [],
       menu: menu,
       firstTimeSearching: false,
-      httpService: undefined,
+      // httpService: undefined,
+      httpService: {},
       tableActions: [
         {
           showOutside: true,
@@ -288,7 +295,6 @@ export default {
           { label: "تعداد فرآیند", key: "task_count", class: "col-2" },
           { label: "مدت", key: "duration", class: "col-2" },
         ];
-
       else if (this.groupType == "organ")
         return [
           { label: "سازمان", key: "organ", class: "col-6" },
@@ -296,7 +302,6 @@ export default {
           { label: "تعداد فرآیند", key: "task_count", class: "col-2" },
           { label: "مدت", key: "duration", class: "col-2" },
         ];
-
       else if (this.groupType == "title")
         return [
           { label: "عنوان", key: "title", class: "col-6" },
@@ -304,13 +309,13 @@ export default {
           { label: "تعداد فرآیند", key: "category_count", class: "col-2" },
           { label: "مدت", key: "duration", class: "col-2" },
         ];
-
-      else return [
-        { label: "تاریخ", key: "normalDate", class: "col-2" },
-        { label: "دسته", key: "category", class: "col-3" },
-        { label: "عنوان", key: "title", class: "col-6" },
-        { label: "مدت", key: "duration", class: "col-1" },
-      ];
+      else
+        return [
+          { label: "تاریخ", key: "normalDate", class: "col-2" },
+          { label: "دسته", key: "category", class: "col-3" },
+          { label: "عنوان", key: "title", class: "col-6" },
+          { label: "مدت", key: "duration", class: "col-1" },
+        ];
     },
 
     buildName() {
@@ -318,8 +323,8 @@ export default {
     },
   },
   methods: {
-    ...mapGetters(["isSidebarCollapsed"]),
-    ...mapActions(["checkPermissions"]),
+    ...mapState(useCommonStore, ["isSidebarCollapsed"]),
+    ...mapActions(useCommonStore, ["checkPermissions"]),
 
     checkPermisionBeforGetList() {
       if (this.fetchingData) return;
@@ -473,7 +478,6 @@ export default {
       // this.getGroupsWithoutAdmin(query);
     },
 
-
     toggleUsersPanel(index = undefined) {
       if (index !== undefined) {
         if (this.prevSelectedItemIndex !== undefined)
@@ -532,7 +536,7 @@ export default {
       this.resetPagination();
       this.getMainList();
     },
-    
+
     openCreatePanel() {
       if (this.showPanelTeams) {
         this.showPanelTeams = false;
@@ -665,22 +669,38 @@ export default {
     },
   },
   components: {
-    UsersSearch: () =>
-      import(
-         "@admin/components/UsersSearch"
-      ),
-    TeamForm: () =>
-      import( "@task/components/TeamForm"),
-    SortingTasksAdmin: () =>
-      import(
-         "@task/components/SortingTasksAdmin"
-      ),
-    SortingByDayTasksAdmin: () =>
-      import(
-         "@task/components/SortingByDayTasksAdmin"
-      ),
-    PieDonut: () => import("@components/charts/PieDonut.vue"),
-    SwitchComponent: () => import("@components/SwitchComponent.vue"),
+    UsersSearch: defineAsyncComponent(() =>
+      import("~/components/admin/components/UsersSearch.vue")
+    ),
+    // UsersSearch: () =>
+    //   import(
+    //      "@admin/components/UsersSearch"
+    //   ),
+    TeamForm: defineAsyncComponent(() => import("@task/components/TeamForm")),
+    // TeamForm: () =>
+    //   import( "@task/components/TeamForm"),
+    SortingTasksAdmin: defineAsyncComponent(() =>
+      import("@task/components/SortingTasksAdmin")
+    ),
+    // SortingTasksAdmin: () =>
+    //   import(
+    //      "@task/components/SortingTasksAdmin"
+    //   ),
+    SortingByDayTasksAdmin: defineAsyncComponent(() =>
+      import("@task/components/SortingByDayTasksAdmin")
+    ),
+    // SortingByDayTasksAdmin: () =>
+    //   import(
+    //      "@task/components/SortingByDayTasksAdmin"
+    //   ),
+    PieDonut: defineAsyncComponent(() =>
+      import("@components/charts/PieDonut.vue")
+    ),
+    // PieDonut: () => import("@components/charts/PieDonut.vue"),
+    // SwitchComponent: () => import("@components/SwitchComponent.vue"),
+    SwitchComponent: defineAsyncComponent(() =>
+      import("@task/components/SwitchComponent.vue")
+    ),
   },
 };
 </script>
@@ -766,7 +786,7 @@ export default {
   margin-top: 2em;
   margin-right: 1em;
 }
-.form-control{
+.form-control {
   width: 6em;
 }
 </style>
diff --git a/components/TaskUserReport.vue b/components/TaskUserReport.vue
index 2b00572..4a2fee1 100644
--- a/components/TaskUserReport.vue
+++ b/components/TaskUserReport.vue
@@ -206,7 +206,7 @@ import { mapState, mapActions } from "pinia";
 import taskApi from "@task/apis/taskApi";
 import { useCommonStore } from "~/stores/commonStore";
 
-import { p2e } from "@plugins/persianNumber";
+// import { p2e } from "@plugins/persianNumber";
 
 export default {
   beforeMount() {
diff --git a/components/TeamForm.vue b/components/TeamForm.vue
index 5bc8a0e..2c07b59 100644
--- a/components/TeamForm.vue
+++ b/components/TeamForm.vue
@@ -47,12 +47,13 @@
 
 <script>
 // import taskApi from "@apis/taskApi";
-import HttpService from "@services/httpService";
+// import HttpService from "@services/httpService";
 
 export default {
   beforeMount() {
-    this.httpService = new HttpService( this.taskMicroServiceName
-    );
+    // this.httpService = new HttpService( this.taskMicroServiceName
+    // );
+    this.httpService = useNuxtApp()["$http"];
   },
   props: {
     parentLoading: false,
@@ -87,6 +88,7 @@ export default {
         organ: null,
         title: null,
       },
+      httpService: {},
     };
   },
   computed: {