Merge pull request #36 from dderbentsov/UC-13

Добавлен mock для таблицы клиентов

src/main.js

@@ -6,6 +6,11 @@ import "./assets/sass/fonts.sass";
 import "./assets/sass/tailwind.sass";
 import "./assets/sass/variables.sass";
 import "./assets/css/iconfonts.css";
+import { clientsServer } from "../server.js";
+
+if (process.env.NODE_ENV === "development") {
+  clientsServer({ environment: "development" });
+}
 
 moment.locale("ru");
 

src/pages/clients/components/ClientsTable.vue

@@ -66,39 +66,17 @@ export default {
     return {
       selectAll: false,
       marked: [],
-      dataClients: [
-        {
-          id: "1",
-          fullName: "Вильгейльм Арнольд Витальевич",
-          age: "34",
-          jobTitle: "Менеджер",
-          priority: "Высокий",
-          phone: "+7 (915) 657–21–14",
-          email: "Superboyband@yandex.ru",
-          networks: [],
-          meetingTime: {
-            date: "02.06.22",
-            time: "18:30–19:30",
-          },
-        },
-        {
-          id: "2",
-          fullName: "Астафоркина Екатерина Геннадьевна",
-          age: "54",
-          jobTitle: "Менеджер",
-          priority: "-",
-          phone: "+7 (574) 364–53–36",
-          email: "antimag@gmail.com",
-          networks: [],
-          meetingTime: {
-            date: "14.07.22",
-            time: "17:30–21:30",
-          },
-        },
-      ],
+      dataClients: [],
     };
   },
   methods: {
+    saveDataClients(data) {
+      this.dataClients = data.dataClients;
+    },
+    fetchDataClients() {
+      // eslint-disable-next-line
+      fetch("/api/clients").then((res) => res.json()).then((data) => this.saveDataClients(data))
+    },
     selectedCheck(e) {
       if (e.target.id === "all") {
         this.selectAll = !this.selectAll;
@@ -119,6 +97,9 @@ export default {
       }
     },
   },
+  mounted() {
+    this.fetchDataClients();
+  },
 };
 </script>
 

src/pages/clients/components/ClientsTableRow.vue

@@ -26,7 +26,7 @@
         span.meeting-time.text-xs.leading-5 {{meetingTime.time}}
     td.py-5
       .px-4
-        .relative.dots-button.icon-dots.text-center.cursor-pointer.leading-6(@click="openPopup")
+        .relative.dots-button.icon-dots.text-center.cursor-pointer.leading-6(:tabindex="1" @click="(e) => openPopup(e)" @blur="handleUnFocusPopup")
           clients-action-popup(v-if="isOpenPopup")
 </template>
 
@@ -55,9 +55,13 @@ export default {
     meetingTime: Object,
   },
   methods: {
-    openPopup() {
+    openPopup(e) {
+      e.target.focus();
       this.isOpenPopup = !this.isOpenPopup;
     },
+    handleUnFocusPopup() {
+      this.isOpenPopup = false;
+    },
   },
 };
 </script>