[dolphinscheduler] branch dev updated: [Fix][UI] Support only one file upload on the file manage page. (#10007)

[xujunjie]

This is an automated email from the ASF dual-hosted git repository.

xujunjie pushed a commit to branch dev
in repository https://gitbox.apache.org/repos/asf/dolphinscheduler.git


The following commit(s) were added to refs/heads/dev by this push:
     new 18bfe6399d [Fix][UI] Support only one file upload on the file manage 
page. (#10007)
18bfe6399d is described below

commit 18bfe6399d5faa69f84d7b673269a96f8082ead6
Author: Amy0104 <97265214+amy0...@users.noreply.github.com>
AuthorDate: Thu May 12 16:54:03 2022 +0800

    [Fix][UI] Support only one file upload on the file manage page. (#10007)
---
 .../src/views/resource/file/upload/index.tsx             | 16 +++++++++++++++-
 .../src/views/resource/file/upload/use-form.ts           |  1 +
 2 files changed, 16 insertions(+), 1 deletion(-)

diff --git a/dolphinscheduler-ui/src/views/resource/file/upload/index.tsx 
b/dolphinscheduler-ui/src/views/resource/file/upload/index.tsx
index 035b5a715a..b2aee1fabe 100644
--- a/dolphinscheduler-ui/src/views/resource/file/upload/index.tsx
+++ b/dolphinscheduler-ui/src/views/resource/file/upload/index.tsx
@@ -44,16 +44,24 @@ export default defineComponent({
     const customRequest = ({ file }: any) => {
       state.uploadForm.name = file.name
       state.uploadForm.file = file.file
+      state.uploadFormNameRef.validate({
+        trigger: 'input'
+      })
     }
 
     const handleFile = () => {
       handleUploadFile(ctx.emit, hideModal, resetForm)
     }
 
+    const removeFile = () => {
+      state.uploadForm.name = ''
+    }
+
     return {
       hideModal,
       customRequest,
       handleFile,
+      removeFile,
       ...toRefs(state)
     }
   },
@@ -70,7 +78,11 @@ export default defineComponent({
         confirmLoading={this.saving}
       >
         <NForm rules={this.rules} ref='uploadFormRef'>
-          <NFormItem label={t('resource.file.file_name')} path='name'>
+          <NFormItem
+            label={t('resource.file.file_name')}
+            path='name'
+            ref='uploadFormNameRef'
+          >
             <NInput
               v-model={[this.uploadForm.name, 'value']}
               placeholder={t('resource.file.enter_name_tips')}
@@ -90,6 +102,8 @@ export default defineComponent({
               v-model={[this.uploadForm.file, 'value']}
               customRequest={this.customRequest}
               class='btn-upload'
+              max={1}
+              onRemove={this.removeFile}
             >
               <NButton>{t('resource.file.upload_files')}</NButton>
             </NUpload>
diff --git a/dolphinscheduler-ui/src/views/resource/file/upload/use-form.ts 
b/dolphinscheduler-ui/src/views/resource/file/upload/use-form.ts
index 58ec7dbe2b..6dff47db32 100644
--- a/dolphinscheduler-ui/src/views/resource/file/upload/use-form.ts
+++ b/dolphinscheduler-ui/src/views/resource/file/upload/use-form.ts
@@ -36,6 +36,7 @@ export function useForm() {
 
   const state = reactive({
     uploadFormRef: ref(),
+    uploadFormNameRef: ref(),
     uploadForm: defaultValue(),
     saving: false,
     rules: {