feat: first commit

src/components/SingleUpload.vue

@@ -0,0 +1,47 @@
+<template>
+    <div :class="$style['upload']" @change="onFileChange">
+        <input ref="fileRef" :accept="accept"  v-show="false" type="file" />
+        <el-input :model-value="fileName" :disabled="true" :style="{ width: '200px' }" />
+        <el-button :class="$style['scan']" @click="onPreUpload">浏览</el-button>
+    </div>
+</template>
+<script setup lang="ts">
+import { ref } from "vue";
+
+withDefaults(defineProps<{
+    accept?: any
+}>(), {
+    accept: '*'
+});
+
+const emit = defineEmits<{
+    (n: "fileChange", file: File): void
+}>();
+
+const fileRef = ref();
+const fileName = ref();
+
+const onFileChange = (e: any) => {
+    const files = e.target.files;
+    fileName.value = files?.[0]?.name;
+    emit('fileChange', files?.[0]);
+}
+
+const onPreUpload = () => {
+    fileRef.value.value = "";
+    fileRef.value?.click();
+}
+</script>
+<style module lang="scss">
+:global {
+    :local(.upload) {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+
+        :local(.scan) {
+            margin-left: 10px;
+        }
+    }
+}
+</style>