refactor: notification on file exist and main view

Services/client/src/components/FileForm.vue

@@ -4,6 +4,7 @@ import { onMounted, onUnmounted, ref } from 'vue'
 const props = withDefaults(
   defineProps<{
     open: boolean
+    error: { fileExist?: boolean }
     mode: 'create' | 'edit'
     title?: string
     description?: string
@@ -12,7 +13,7 @@ const props = withDefaults(
   }>(),
   {
     open: false,
-  }
+  },
 )
 
 const emit = defineEmits([
@@ -21,6 +22,7 @@ const emit = defineEmits([
   'update:description',
   'update:keyword',
   'update:category',
+  'filechange',
   'submit',
 ])
 
@@ -96,7 +98,12 @@ const file = ref<File | undefined>()
           dense
           outlined
           v-model="file"
+          @update:model-value="(v) => $emit('filechange', v.name)"
           :label="file?.name ? undefined : 'เลือกไฟล์'"
+          :error="!!error.fileExist"
+          :error-message="
+            error.fileExist ? 'พบไฟล์ในระบบ ข้อมูลในระบบจะถูกเขียนทับ' : ''
+          "
         >
           <template v-slot:prepend>
             <q-icon name="attach_file" />
@@ -168,7 +175,7 @@ const file = ref<File | undefined>()
 </template>
 
 <style scoped>
-.no-resize >>> textarea {
+.no-resize :deep(textarea) {
   resize: none;
 }
 </style>