changes

app/components/snackbar/Error.vue

@@ -1,24 +1,25 @@
 <template>
-  <div>
-    <Caption v-bind="{ title: 'Lỗi', type: 'has-text-findata' }"></Caption>
-    <div class="field is-grouped mb-0">
-      <div
-        class="control is-expanded pr-3"
-        v-html="content"
-      ></div>
-      <div class="control">
-        <SvgIcon v-bind="{ name: 'error.svg', type: 'danger', size: 24 }"></SvgIcon>
-      </div>
-    </div>
+  <div class="field is-grouped is-gap-1">
+    <Icon
+      name="material-symbols:cancel-rounded"
+      :size="22"
+      class="has-text-danger-70"
+    />
+    <p
+      v-html="content"
+      class="control is-expanded"
+    ></p>
   </div>
 </template>
-<script>
-export default {
-  props: ["content"],
-  methods: {
-    cancel() {
-      this.$store.commit("updateStore", { name: "showmodal", data: undefined });
-    },
-  },
-};
+<script setup>
+const props = defineProps({
+  content: String,
+  title: String,
+});
+
+const { $store } = useNuxtApp();
+
+function cancel() {
+  $store.commit("updateStore", { name: "showmodal", data: undefined });
+}
 </script>