diff --git a/io.sc.platform.core.frontend/src/platform/components-ext/formater/JoinFormater.ts b/io.sc.platform.core.frontend/src/platform/components-ext/formater/JoinFormater.ts
new file mode 100644
index 00000000..ac18c409
--- /dev/null
+++ b/io.sc.platform.core.frontend/src/platform/components-ext/formater/JoinFormater.ts
@@ -0,0 +1,25 @@
+import { Tools } from '@/platform/utils';
+
+class JoinFormater {
+  #joiner: string;
+
+  constructor(joiner: string) {
+    this.#joiner = joiner;
+  }
+
+  public formater() {
+    const joiner = this.#joiner;
+    return (arrays: string[]) => {
+      if (Tools.isUndefinedOrNull(arrays) || !Tools.isArray(arrays)) {
+        return null;
+      }
+      let result = '';
+      arrays.forEach((item) => {
+        result += item + joiner;
+      });
+      return result;
+    };
+  }
+}
+
+export { JoinFormater };
diff --git a/io.sc.platform.developer.frontend/src/views/backend/Upload.vue b/io.sc.platform.developer.frontend/src/views/backend/Upload.vue
new file mode 100644
index 00000000..3b5c6194
--- /dev/null
+++ b/io.sc.platform.developer.frontend/src/views/backend/Upload.vue
@@ -0,0 +1,53 @@
+<template>
+  <div>
+    <div style="height: 100px"></div>
+    <div class="row py-1">
+      <div class="col-2"></div>
+      <div class="col-8 row justify-center q-gutter-md py-2">
+        <q-file ref="fileRef" v-model="fileValueRef" :label="$t('file.single.tip')" style="width: 100%" dense outlined clearable counter>
+          <template #prepend>
+            <q-icon name="cloud_upload" />
+          </template>
+        </q-file>
+      </div>
+      <div class="col-2"></div>
+    </div>
+    <div class="row py-1">
+      <div class="col-2"></div>
+      <div class="col-8 row justify-center q-gutter-md py-2">
+        <q-btn color="primary" :label="$t('upload')" @click="upload"></q-btn>
+      </div>
+      <div class="col-2"></div>
+    </div>
+  </div>
+</template>
+<script setup lang="ts">
+import { ref } from 'vue';
+import { $t, axios, Environment, DialogManager, NotifyManager } from 'platform-core';
+
+const fileRef = ref();
+const fileValueRef = ref();
+
+const upload = () => {
+  if (fileRef.value.nativeEl.files[0]) {
+    axios
+      .post(
+        Environment.apiContextPath('/api/developer/tools/upload'),
+        {
+          file: fileRef.value.nativeEl.files[0],
+        },
+        {
+          loading: true,
+          headers: {
+            'Content-Type': 'multipart/form-data',
+          },
+        },
+      )
+      .then(() => {
+        NotifyManager.info($t('operationSuccess'));
+      });
+  } else {
+    NotifyManager.error($t('menu.developer.backend.upload.pleaseSelectFile'));
+  }
+};
+</script>