refactor: ♻️ aPI 文件根据模块划分

src/views/demo/upload.vue

@@ -1,8 +1,56 @@
 <!-- 文件上传组件示例 -->
-<script setup lang="ts">
-import ImageUpload from "@/components/Upload/ImageUpload.vue";
-import FileUpload from "@/components/Upload/FileUpload.vue";
+<template>
+  <div class="app-container">
+    <el-link
+      href="https://gitee.com/youlaiorg/vue3-element-admin/blob/master/src/views/demo/upload.vue"
+      type="primary"
+      target="_blank"
+      class="mb-10"
+    >
+      示例源码 请点击>>>>
+    </el-link>
 
+    <el-form>
+      <el-form-item label="单图上传">
+        <SingleImageUpload v-model="picUrl" />
+      </el-form-item>
+      <el-form-item label="参数说明">
+        <el-table :data="singleImageUploadArgData" border>
+          <el-table-column prop="argsName" label="参数名称" width="300" />
+          <el-table-column prop="type" label="参数类型" width="200" />
+          <el-table-column prop="default" label="默认值" width="400" />
+          <el-table-column prop="desc" label="描述" width="300" />
+        </el-table>
+      </el-form-item>
+
+      <el-form-item label="多图上传">
+        <MultiImageUpload v-model="picUrls" />
+      </el-form-item>
+      <el-form-item label="参数说明">
+        <el-table :data="imageUploadArgData" border>
+          <el-table-column prop="argsName" label="参数名称" width="300" />
+          <el-table-column prop="type" label="参数类型" width="200" />
+          <el-table-column prop="default" label="默认值" width="400" />
+          <el-table-column prop="desc" label="描述" width="300" />
+        </el-table>
+      </el-form-item>
+
+      <el-form-item label="文件上传">
+        <FileUpload v-model="fileUrls" />
+      </el-form-item>
+      <el-form-item label="参数说明">
+        <el-table :data="fileUploadArgData" border>
+          <el-table-column prop="argsName" label="参数名称" width="300" />
+          <el-table-column prop="type" label="参数类型" width="200" />
+          <el-table-column prop="default" label="默认值" width="400" />
+          <el-table-column prop="desc" label="描述" width="300" />
+        </el-table>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup lang="ts">
 // 单图
 const picUrl = ref("https://s2.loli.net/2023/05/24/yNsxFC8rLHMZQcK.jpg");
 
@@ -16,11 +64,11 @@ const singleImageUploadArgData = [
   {
     argsName: "size",
     type: "String",
-    default: "148px",
+    default: "150px",
     desc: "图片上传组件的尺寸大小",
   },
   {
-    argsName: "maxSize",
+    argsName: "max-size",
     type: "Number",
     default: "10",
     desc: "单个图片上传大小限制(单位M)",
@@ -92,10 +140,10 @@ const imageUploadArgData = [
     desc: "是否显示上传按钮",
   },
   {
-    argsName: "upload-max-size",
+    argsName: "max-size",
     type: "Number",
-    default: "2 * 1024 * 1024",
-    desc: "单个图片上传大小限制(单位byte)",
+    default: "10",
+    desc: "单个图片上传大小限制(单位MB)",
   },
   {
     argsName: "accept",
@@ -148,10 +196,10 @@ const fileUploadArgData = [
     desc: "是否显示上传按钮",
   },
   {
-    argsName: "upload-max-size",
+    argsName: "max-size",
     type: "Number",
-    default: "2 * 1024 * 1024",
-    desc: "单个文件上传大小限制(单位byte)",
+    default: "10",
+    desc: "单个文件上传大小限制(单位MB)",
   },
   {
     argsName: "accept",
@@ -203,53 +251,3 @@ const fileUploadArgData = [
   },
 ];
 </script>
-<template>
-  <div class="app-container">
-    <el-link
-      href="https://gitee.com/youlaiorg/vue3-element-admin/blob/master/src/views/demo/upload.vue"
-      type="primary"
-      target="_blank"
-      class="mb-10"
-    >
-      示例源码 请点击>>>>
-    </el-link>
-
-    <el-form>
-      <el-form-item label="单图上传">
-        <SingleImageUpload v-model="picUrl" />
-      </el-form-item>
-      <el-form-item label="参数说明">
-        <el-table :data="singleImageUploadArgData" border>
-          <el-table-column prop="argsName" label="参数名称" width="300" />
-          <el-table-column prop="type" label="参数类型" width="200" />
-          <el-table-column prop="default" label="默认值" width="400" />
-          <el-table-column prop="desc" label="描述" width="300" />
-        </el-table>
-      </el-form-item>
-
-      <el-form-item label="多图上传">
-        <image-upload v-model="picUrls" />
-      </el-form-item>
-      <el-form-item label="参数说明">
-        <el-table :data="imageUploadArgData" border>
-          <el-table-column prop="argsName" label="参数名称" width="300" />
-          <el-table-column prop="type" label="参数类型" width="200" />
-          <el-table-column prop="default" label="默认值" width="400" />
-          <el-table-column prop="desc" label="描述" width="300" />
-        </el-table>
-      </el-form-item>
-
-      <el-form-item label="文件上传">
-        <file-upload v-model="fileUrls" />
-      </el-form-item>
-      <el-form-item label="参数说明">
-        <el-table :data="fileUploadArgData" border>
-          <el-table-column prop="argsName" label="参数名称" width="300" />
-          <el-table-column prop="type" label="参数类型" width="200" />
-          <el-table-column prop="default" label="默认值" width="400" />
-          <el-table-column prop="desc" label="描述" width="300" />
-        </el-table>
-      </el-form-item>
-    </el-form>
-  </div>
-</template>