feat(front): add TextUploadView and FileUpload components for enhanced file and text sharing functionality

front/components/Home/File/FileUploadIndexView.vue

@@ -15,14 +15,20 @@ const step = ref('input')
 const renderComponent = computed(() => {
     return fileStepList.find((item) => item.key === step.value)?.component
 })
+const formRef = ref<InstanceType<typeof VeeForm>>()
+watch(() => step.value, (newVal) => {
+    if (newVal === 'input') {
+        formRef.value?.form?.resetForm()
+        formRef.value?.form?.setValues({ file: null })
+    }
+})
 </script>
 <template>
-    <VeeForm v-slot="{ values }" :keepValues="true">
+    <VeeForm ref="formRef" v-slot="{ values }" :keepValues="true">
         <div class="rounded-xl p-5 bg-white/50 backdrop-blur-xl w-full lg:w-200">
             <component :is="renderComponent" :data="values" @change="(key: string) => {
                 step = key
             }" />
         </div>
     </VeeForm>
-
 </template>

front/components/Home/File/FileUploadResultView.vue

@@ -5,6 +5,10 @@ const props = defineProps<{
   data: { file: File, config: any, file_handle_type: string, file_id: string }
 }>()
 
+const emit = defineEmits<{
+  (e: 'change', key: string): void
+}>()
+
 // console.log(props.data)
 
 const handleList = [
@@ -18,6 +22,8 @@ const handleComponent = computed(() => {
 </script>
 <template>
   <div class="">
-    <component :is="handleComponent" :data="data" />
+    <component :is="handleComponent" :data="data" @change="(key: string) => {
+      emit('change', key)
+    }" />
   </div>
 </template>

front/components/Home/TextUploadView.vue

@@ -11,14 +11,14 @@ import TextShareDrawer from '@/components/Drawer/TextShareDrawer.vue'
 import { cx } from 'class-variance-authority'
 </script>
 <template>
-    <VeeForm v-slot="{ setValues, getValues }">
+    <VeeForm v-slot="{ setValues, values }">
         <div class="rounded-xl p-5 bg-white/50 backdrop-blur-xl w-full lg:w-200 gap-5 flex flex-col">
             <div class="text-xl font-normal">输入文本</div>
             <div class="relative">
                 <MarkdownInputField name="text" placeholder="使用我们的文本处理器轻松分享，翻译，总结，生成图片，询问大模型"
                     class="max-h-[50vh] min-h-40 overflow-y-auto max-w-full [&>*]:pr-10" rules="required" />
                 <Button variant="ghost" size="icon" :class="cx('absolute right-2 top-2 hover:bg-black/10 transition-all duration-300',
-                    get(getValues(), 'text')?.length > 0 ? 'opacity-100' : 'opacity-0 pointer-events-none'
+                    values.text?.length > 0 ? 'opacity-100' : 'opacity-0 pointer-events-none'
                 )" @click="() => {
                     setValues({ text: '' })
                 }">