fix: alert fileExists upload

Services/client/src/components/FileItem.vue

@@ -5,6 +5,7 @@ import { storeToRefs } from 'pinia'
 import FileIcon from '@/components/FileIcon.vue'
 import FileItemAction from '@/components/FileItemAction.vue'
 import FromEdit from '@/components/FromEdit.vue'
+import FormUpload from '@/components/FormUpload.vue'
 import { useTreeDataStore } from '@/stores/tree-data'
 import { useFileInfoStore } from '@/stores/file-info-data'
 
@@ -15,16 +16,11 @@ const DEPT_NAME = ['ตู้เอกสาร', 'ลิ้นชัก', 'แ
 const { currentFolder, currentFile, currentDept, currentPath } = storeToRefs(
   useTreeDataStore()
 )
-const { getFolder, createFolder, editFolder, uploadFile } = useTreeDataStore()
+const { getFolder, uploadFile } = useTreeDataStore()
 
 const drawer = ref<boolean>(false)
 const drawerFile = ref<boolean>(false)
 const drawerStatus = ref<'edit' | 'create'>('create')
-const inputFile = ref<File>()
-const fileTitle = ref<string>('')
-const fileDesc = ref<string>('')
-const fileCategory = ref<string>('')
-const fileKeyword = ref<string>('')
 const editPathname = ref<string>('')
 
 const currentIcon = computed(() =>
@@ -40,17 +36,6 @@ const props = withDefaults(
     action: false,
   }
 )
-
-async function handleSubmit() {
-  if (!inputFile.value) return
-
-  await uploadFile(currentPath.value, inputFile.value, {
-    title: fileTitle.value,
-    description: fileDesc.value,
-    keyword: [fileKeyword.value],
-    category: [fileCategory.value],
-  })
-}
 </script>
 
 <template>
@@ -266,88 +251,10 @@ async function handleSubmit() {
     @update:drawer="() => (drawer = false)"
   />
 
-  <q-drawer
-    class="q-pa-md"
-    side="right"
-    v-model="drawerFile"
-    bordered
-    :width="300"
-    :breakpoint="500"
-    overlay
-  >
-    <q-toolbar class="q-mb-md q-pa-none">
-      <q-toolbar-title>
-        <span class="text-weight-bold">สร้างเอกสาร</span>
-      </q-toolbar-title>
-      <q-btn
-        flat
-        round
-        dense
-        icon="close"
-        v-close-popup
-        color="red"
-        @click="() => (drawerFile = !drawerFile)"
-      />
-    </q-toolbar>
-    <span class="text-weight-bold">อัพโหลดไฟล์</span>
-    <q-file
-      v-model="inputFile"
-      class="q-my-md"
-      label="Pick files"
-      dense
-      outlined
-    >
-      <template v-slot:prepend>
-        <q-icon name="attach_file" />
-      </template>
-    </q-file>
-    <span class="text-weight-bold">ชื่อเรื่อง</span>
-    <q-input
-      class="q-my-md"
-      outlined
-      v-model="fileTitle"
-      placeholder="กรอกชื่อเรื่อง"
-      dense
-    />
-    <span class="text-weight-bold">รายละเอียดของเอกสาร</span>
-    <q-input
-      class="q-my-md"
-      outlined
-      type="textarea"
-      v-model="fileDesc"
-      placeholder="กรอกรายละเอียด"
-      dense
-    />
-    <span class="text-weight-bold">กลุ่ม/หมวดหมู่</span>
-    <q-input
-      class="q-my-md"
-      outlined
-      v-model="fileCategory"
-      placeholder="เลือกกลุ่ม/หมวดหมู่"
-      dense
-    />
-    <span class="text-weight-bold">คำสำคัญ</span>
-    <q-input
-      class="q-my-md"
-      outlined
-      v-model="fileKeyword"
-      placeholder="กรอกคำสำคัญ"
-      dense
-    />
-    <q-btn
-      class="q-px-md"
-      label="บันทึก"
-      type="submit"
-      color="primary"
-      dense
-      @click="
-        () => {
-          drawerFile = !drawerFile
-          handleSubmit()
-        }
-      "
-    />
-  </q-drawer>
+  <form-upload
+    :drawerFile="drawerFile"
+    @update:drawerFile="() => (drawerFile = false)"
+  />
 </template>
 
 <style lang="scss" scoped>