Добавлен новый тип всплывающих сообщений.

Исправлена генерация UPDATE запросов в mysql обертке.

4 files changed, 32 insertions, 15 deletions

diff --git a/day9/task5_vue/src/App.vue b/day9/task5_vue/src/App.vue
index 42ba3b1..9322db3 100644
--- a/day9/task5_vue/src/App.vue
+++ b/day9/task5_vue/src/App.vue
@@ -7,12 +7,12 @@
                 @show-popup="showPopup($event)"
                 v-if="isFormShown"
         />
-        <Table v-bind:table-data="tableData" @show-form="showForm('update', $event)"/>
+        <Table v-bind:table-data="tableData" @show-form="showForm('update', $event)" @show-popup="showPopup($event)"/>
         <UploadFileButton v-if="!isFormShown"/>
         <AddNewEntryButton v-if="!isFormShown" @show-form="showForm('create', $event)"/>
 
         <transition name="fade">
-            <PopupMessage v-if="isPopupShown" v-bind:message="popupMessage"/>
+            <PopupMessage v-if="isPopupShown" v-bind:data="popupData"/>
         </transition>
     </div>
 </template>
@@ -39,7 +39,7 @@
                 isFormShown: false,
 
                 isPopupShown: false,
-                popupMessage: '',
+                popupData: null,
             }
         },
 
@@ -61,14 +61,14 @@
                     })
             },
 
-            showPopup(message) {
+            showPopup(data) {
                 if (!this.isPopupShown) {
                     this.isPopupShown = true;
-                    this.popupMessage = message;
+                    this.popupData = data;
 
                     setTimeout(() => {
                         this.isPopupShown = false;
-                        this.popupMessage = '';
+                        this.popupData = null;
                     }, 2000)
                 }
             },
diff --git a/day9/task5_vue/src/components/EditFormBox.vue b/day9/task5_vue/src/components/EditFormBox.vue
index 42bb3c6..276dbbe 100644
--- a/day9/task5_vue/src/components/EditFormBox.vue
+++ b/day9/task5_vue/src/components/EditFormBox.vue
@@ -170,7 +170,7 @@
                         })
                         .then(response => {
                             this.$emit('close-form');
-                            this.$emit('show-popup', 'Database updated successfully');
+                            this.$emit('show-popup', {'type': 'success', 'meg': 'Database updated successfully'});
                         });
                 }
             }
diff --git a/day9/task5_vue/src/components/PopupMessage.vue b/day9/task5_vue/src/components/PopupMessage.vue
index a905b4d..90e28da 100644
--- a/day9/task5_vue/src/components/PopupMessage.vue
+++ b/day9/task5_vue/src/components/PopupMessage.vue
@@ -1,19 +1,23 @@
 <template>
-    <div ref="container" class="popupContainer">
-        {{ message }}
+    <div
+            ref="container" class="popupContainer"
+            v-bind:class="{
+                'type-success': data.type === 'success',
+                'type-failure': data.type === 'failure'
+            }">
+        {{ data.msg }}
     </div>
 </template>
 
 <script>
     export default {
         name: "PopupMessage",
-        props: ['message'],
+        props: ['message', 'data'],
     }
 </script>
 
 <style scoped>
     .popupContainer {
-        background-color: #00ff5e;
         padding: 30px;
 
         font-size: 30px;
@@ -25,4 +29,12 @@
         left: 0;
         right: 0;
     }
+
+    .type-success {
+        background-color: #00ff5e;
+    }
+
+    .type-failure {
+        background-color: #ff002d;
+    }
 </style>
\ No newline at end of file
diff --git a/day9/task5_vue/src/components/Table.vue b/day9/task5_vue/src/components/Table.vue
index 97bc24d..d94afe2 100644
--- a/day9/task5_vue/src/components/Table.vue
+++ b/day9/task5_vue/src/components/Table.vue
@@ -50,15 +50,20 @@
             },
 
             removeField(serviceId) {
-                this.tableData.content = this.tableData.content.filter(row => row[0].toString() !== serviceId);
                 axios
                     .request({
                         url: '/api/delete', method: 'post',
-                        data: {'service_id': serviceId}
+                        data: {'service_id': parseInt(serviceId)}
                     })
                     .then(response => {
-                        if (response.status === 200)
-                            this.tableData = this.tableData.content.filter(row => row[0] !== serviceId);
+                        if (response.status === 200) {
+                            let err = response.data.error;
+
+                            if (err) this.$emit('show-popup', {'type': 'failure', 'msg': response.data.service_id});
+                            else this.tableData.content = this.tableData.content.filter(row => row[0].toString() !== serviceId);
+
+                        }
+
                     });
             }