feat: Upload Alert done.

src/components/File/UploadModal.vue

@@ -0,0 +1,51 @@
+<template>
+  <Dialog :visible="uploadModal" modal :style="{ width: '90vw', height: '90vh' }" :contentClass="contentClass" @update:visible="$emit('closeModal', $event)">
+    <template #header>
+      <div class="py-5">
+      </div>
+    </template>
+    <div class=" h-full flex flex-col justify-center items-center p-4 space-y-4">
+      <IconUploarding class="loader-arrow-upward"></IconUploarding>
+      <p class="text-neutral-900">Click or drag a file here.</p>
+      <p class="text-neutral-500">(Only <span class="text-primary">.csv</span> is supported)</p>
+      <p class="btn btn-lg btn-c-primary">下一頁</p>
+      <p class="btn btn-lg btn-c-primary" @click="uploadFailde">上傳失敗 Modal</p>
+      <p class="btn btn-lg btn-c-primary" @click="uploadSuccess">上傳成功 Modal</p>
+      <p class="btn btn-lg btn-c-primary" @click="uploadConfirm">是否上傳 Modal</p>
+    </div>
+  </Dialog>
+</template>
+<script>
+import IconUploarding from '../icons/IconUploarding.vue';
+import { uploadFailde, uploadSuccess, uploadConfirm } from '@/module/alertModal.js'
+
+export default {
+  props: ['uploadModal'],
+  data() {
+    return {
+      contentClass: 'h-full',
+    }
+  },
+  components: {
+    IconUploarding,
+  },
+  methods: {
+    uploadFailde,
+    uploadSuccess,
+    uploadConfirm,
+  }
+}
+</script>
+<style scoped>
+.loader-arrow-upward {
+  animation: bump 0.6s linear infinite alternate;
+}
+@keyframes bump {
+  0% {
+    transform: translate(0%, 5px);
+  }
+  100% {
+    transform: translate(0%, -5px);
+  }
+}
+</style>