@xclqmc/base-form 1.0.3 → 1.0.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xclqmc/base-form",
-  "version": "1.0.3",
+  "version": "1.0.6",
   "description": "声明式表单组件 BaseForm（弹窗/抽屉/内嵌三态）及配套基础组件（BasePopup/BaseDrawer/BaseRadio/BaseSelect/BaseEditor）—— 纯源码分发的 Vue3 + ElementPlus 表单组件库",
   "license": "MIT",
   "type": "module",
@@ -20,7 +20,8 @@
   },
   "scripts": {
     "dev": "vite",
-    "build": "vite build"
+    "build": "vite build",
+    "release": "npm version patch --no-git-tag-version && npm publish --access public && curl -X PUT https://registry-direct.npmmirror.com/@xclqmc/base-form/sync"
   },
   "peerDependencies": {
     "@element-plus/icons-vue": ">=2.0.0",

package/src/components/BaseForm/BaseForm.vue

@@ -204,6 +204,12 @@ provide("baseFormDict", (code: string) =>
   mergedOptions.value?.api?.dict?.(code),
 );
 
+// 向字段控件提供文件上传函数：editor 插入图片/视频时自行调用拿到文件 URL，
+// 读取实时 api.upload（宿主可换接口）；单独使用控件（无 BaseForm）时未注入，无法上传
+provide("baseFormUpload", (file: File) =>
+  mergedOptions.value?.api?.upload?.(file),
+);
+
 //================================================================================================计算函数
 // 显示形态（统一三态，只认 config.mode）：dialog=弹窗 / drawer=抽屉 / form=原始表单（内嵌）
 const cptMode = computed<"dialog" | "drawer" | "form">(() => {

package/src/components/BaseForm/types.ts

@@ -143,7 +143,7 @@ export interface BaseFormRule {
   [key: string]: any;
 }
 
-/** 表单接口配置（get=详情 / add=新增 / put=修改，按 CRUD 自然顺序；dict=字典） */
+/** 表单接口配置（get=详情 / add=新增 / put=修改，按 CRUD 自然顺序；dict=字典 / upload=文件上传） */
 export interface BaseFormApi {
   /** 详情接口：可返回 axios 响应（{ data }）或直接返回数据本体 */
   get?: ((id: any) => Promise<any>) | null;
@@ -153,6 +153,8 @@ export interface BaseFormApi {
   put?: ((data: any) => Promise<any>) | null;
   /** 字典接口：radio / select 的 format 为字符串（字典 code）时，字段控件经 BaseForm 注入按 code 拉取选项列表 */
   dict?: ((code: string) => Promise<any[]>) | null;
+  /** 文件上传接口（editor 富文本图片/视频上传用）：入参为原始 File，返回上传后的文件访问 URL，BaseEditor 经 BaseForm 注入后调用 */
+  upload?: ((file: File) => Promise<string>) | null;
 }
 
 /** 弹窗/表单全局配置（属性按使用频率/重要程度排列：主键/标签宽 → 形态/尺寸 → 标题/高度 → 布局 → 抽屉方向） */
@@ -248,6 +250,7 @@ export const defaultFormOptions: BaseFormOptions = {
     add: null,
     put: null,
     dict: null,
+    upload: null,
   },
   fields: [
     {

package/src/components/base/BaseEditor.vue

@@ -26,6 +26,7 @@
 import "@wangeditor/editor/dist/css/style.css";
 import {
   reactive,
+  inject,
   shallowRef,
   watch,
   onMounted,
@@ -71,21 +72,6 @@ const props = defineProps({
     type: String,
     default: "",
   },
-  // 上传地址
-  uploadFileUrl: {
-    type: String,
-    default: "",
-  },
-  // 上传请求头（如鉴权 token 由宿主注入：{ Authorization: 'Bearer xxx' }）
-  headers: {
-    type: Object,
-    default: () => ({}),
-  },
-  // 上传接口前缀（默认取宿主环境变量 VITE_API_URL，未配置时走同域相对路径）
-  baseURL: {
-    type: String,
-    default:  "/",
-  },
 });
 
 // 定义子组件向父组件传值/事件（change=内容变化，值为 HTML；click=容器点击，入参为原生事件对象）
@@ -100,25 +86,37 @@ const editorRef = shallowRef<IDomEditor | null>(null);
 const wrapRef = ref<HTMLElement | null>(null);
 // 尺寸监听器
 let resizeObserver: ResizeObserver | null = null;
-// 上传需要的字段信息
-const uploadAttr = reactive({
-  fieldName: "file",
-  server: props.baseURL + props.uploadFileUrl,
-  headers: props.headers,
-  meta: {
-    isDelete: "0",
-  },
-  customInsert(res: any, insertFn: any) {
-    insertFn(res.data.url);
-  },
-});
-// 编辑器配置
+// 文件上传函数（由 BaseForm provide，读取 api.upload；单独使用控件且无 BaseForm 时为 null，无法上传）
+const uploadFn = inject<((file: File) => Promise<string>) | null>(
+  "baseFormUpload",
+  null,
+);
+// 执行上传：调用注入的 api.upload 拿到文件访问 URL 后插入编辑器；未注入 / 失败仅打日志
+const handleUpload = async (file: File, insertFn: (url: string) => void) => {
+  if (!uploadFn)
+    return console.error("未注入上传接口（api.upload），无法上传文件");
+  try {
+    const url = await uploadFn(file);
+    if (url) insertFn(url);
+  } catch (err) {
+    console.error("文件上传失败:", err);
+  }
+};
+// 编辑器配置：上传走 customUpload（宿主注入的 api.upload），由宿主自行处理请求头/鉴权/返回结构
 const state = reactive({
   editorConfig: {
     placeholder: props.placeholder,
     MENU_CONF: {
-      uploadImage: uploadAttr,
-      uploadVideo: uploadAttr,
+      uploadImage: {
+        customUpload(file: File, insertFn: (url: string) => void) {
+          return handleUpload(file, insertFn);
+        },
+      },
+      uploadVideo: {
+        customUpload(file: File, insertFn: (url: string) => void) {
+          return handleUpload(file, insertFn);
+        },
+      },
     },
   },
 });

package/src/components/base/BaseSelect.vue

@@ -1,4 +1,5 @@
 <template>
+  12
   <el-select
     v-model="data.valueCopy"
     :placeholder="placeholder"