@qxs-bns/components 0.0.71 → 0.0.72

package/es/package.json.mjs

@@ -1,2 +1,2 @@
-var r="0.0.71";export{r as version};
+var r="0.0.72";export{r as version};
 //# sourceMappingURL=package.json.mjs.map

package/es/src/image-upload/src/image-upload.vue.mjs

@@ -1,2 +1,2 @@
-import{defineComponent as e,mergeModels as i,useAttrs as t,useModel as l,ref as a,computed as r,resolveComponent as s,createElementBlock as p,openBlock as u,normalizeStyle as n,normalizeClass as o,unref as d,createVNode as c,createBlock as m,createCommentVNode as f,mergeProps as v,withCtx as g,renderSlot as h,createElementVNode as y,toDisplayString as b}from"vue";import{UploadImage as x,ZoomIn as q,Delete as $}from"@qxs-bns/icons";import{useNamespace as w,ElUpload as _,ElImageViewer as k,ElMessage as V}from"element-plus";const z={class:"image-slot"},S=["src"],L=["onClick"],U=["onClick"],j={class:"tip-content"};var B=e({name:"QxsImageUpload",__name:"image-upload",props:i({action:{type:String,required:!0},headers:{type:null,required:!1},data:{type:null,required:!1},name:{type:String,required:!1,default:"file"},url:{type:String,required:!1},size:{type:Number,required:!1,default:20},width:{type:Number,required:!1,default:160},accept:{type:String,required:!1,default:"image/jpeg,image/jpg,image/png,image/gif"},height:{type:Number,required:!1,default:90},placeholder:{type:String,required:!1,default:"上传图片"},notip:{type:Boolean,required:!1,default:!1},tipText:{type:String,required:!1,default:""},beforeUpload:{type:null,required:!1},disabled:{type:Boolean,required:!1,default:!1},limit:{type:Number,required:!1,default:1}},{fileList:{type:Array,default:()=>[]},fileListModifiers:{}}),emits:i(["onSuccess","remove"],["update:fileList"]),setup(e,{emit:i}){const B=i,C=t(),M=l(e,"fileList"),N=w("image-upload"),O=a(0),I=a({imageViewerVisible:!1,progress:{preview:"",percent:0}}),Q=r(()=>N.cssVarBlock({ns:N.namespace.value,width:`${e.width||160}px`,height:`${e.height||90}px`})),R=r(()=>e.accept.split(",").map(e=>e.split("/").pop())),T=r(()=>e.tipText||`上传图片支持 ${R.value.join(" / ")} 格式，且图片大小不超过 ${e.size}MB${e.width&&e.height?`，建议图片尺寸为 ${e.width}*${e.height}`:""}`);function A(e){O.value=M.value.indexOf(e),I.value.imageViewerVisible=!0}function D(e){M.value.splice(M.value.indexOf(e),1)}function E(){I.value.imageViewerVisible=!1}const F=i=>{const t=i.name.split(".").pop()??"",l=R.value.includes(t),a=i.size/1024/1024<e.size;return l?a?(I.value.progress.preview=URL.createObjectURL(i),!e.beforeUpload||e.beforeUpload(i)):(V.error(`上传图片大小不能超过 ${e.size}MB！`),!1):(V.error(`上传图片只支持${R.value.join(" / ")}格式！`),!1)},G=e=>{I.value.progress.percent=Math.floor(e.percent)},H=(...e)=>{I.value.progress={preview:"",percent:0},B("onSuccess",...e)};return(e,i)=>{const t=s("QxsIcon");return u(),p("div",{class:o(d(N).e("container")),style:n(Q.value)},[c(d(_),v(d(C),{"file-list":M.value,"onUpdate:fileList":i[0]||(i[0]=e=>M.value=e),drag:"",limit:e.limit,"list-type":"picture-card",headers:e.headers,action:e.action,data:e.data,name:e.name,accept:e.accept,"before-upload":F,"on-progress":G,"on-preview":A,"on-success":H,class:[d(N).e("control"),e.limit<=M.value.length?d(N).e("more-than-limit"):""],"on-remove":D}),{file:g(({file:t})=>[y("img",{class:o(`${d(N).namespace.value}-upload-list__item-thumbnail`),src:t.url},null,10,S),y("span",{class:o(`${d(N).namespace.value}-upload-list__item-actions`)},[y("span",{class:o(`${d(N).namespace.value}-upload-list__item-preview`),onClick:e=>A(t)},[c(d(q),{size:"14px"})],10,L),i[1]||(i[1]=y("span",{style:{width:"1px",height:"14px","background-color":"rgb(255 255 255 / 50%)"}},null,-1)),e.disabled?f("v-if",!0):(u(),p("span",{key:0,class:o(`${d(N).namespace.value}-upload-list__item-delete`),onClick:e=>D(t)},[c(d($),{size:"14px"})],10,U))],2)]),tip:g(()=>[h(e.$slots,"tip",{},()=>[e.notip?f("v-if",!0):(u(),p("div",{key:0,class:o(`${d(N).namespace.value}-upload__tip-text`)},[y("div",j,b(T.value),1)],2))])]),default:g(()=>[h(e.$slots,"default",{},()=>[y("div",z,[c(t,{size:"32px",icon:d(x)},null,8,["icon"]),y("p",null,b(e.placeholder),1)])])]),_:3},16,["file-list","limit","headers","action","data","name","accept","class"]),I.value.imageViewerVisible?(u(),m(d(k),{key:0,"url-list":M.value.map(e=>e.url).filter(e=>void 0!==e),"initial-index":O.value,teleported:"",onClose:E},null,8,["url-list","initial-index"])):f("v-if",!0)],6)}}});export{B as default};
+import{defineComponent as e,mergeModels as i,useAttrs as a,useModel as t,ref as l,computed as r,onUnmounted as s,resolveComponent as p,createElementBlock as n,openBlock as u,normalizeStyle as o,normalizeClass as c,unref as d,createVNode as m,createBlock as v,createCommentVNode as f,mergeProps as g,withCtx as h,renderSlot as b,createElementVNode as _,toDisplayString as w}from"vue";import{UploadImage as y,ZoomIn as $,Delete as x}from"@qxs-bns/icons";import{useNamespace as q,ElUpload as L,ElImageViewer as U,ElMessage as k}from"element-plus";const V={class:"image-slot"},z=["src"],j=["onClick"],C=["onClick"],R={class:"tip-content"};var B=e({name:"QxsImageUpload",__name:"image-upload",props:i({action:{type:String,required:!0},headers:{type:null,required:!1},data:{type:null,required:!1},name:{type:String,required:!1,default:"file"},size:{type:Number,required:!1,default:20},width:{type:Number,required:!1,default:160},height:{type:Number,required:!1,default:90},accept:{type:String,required:!1,default:"image/jpeg,image/jpg,image/png,image/gif"},placeholder:{type:String,required:!1,default:"上传图片"},notip:{type:Boolean,required:!1,default:!1},tipText:{type:String,required:!1,default:""},beforeUpload:{type:null,required:!1},disabled:{type:Boolean,required:!1,default:!1},limit:{type:Number,required:!1,default:1}},{fileList:{type:Array,default:()=>[]},fileListModifiers:{}}),emits:i(["success","remove"],["update:fileList"]),setup(e,{emit:i}){const B=i,O=a(),S=t(e,"fileList"),M=q("image-upload"),N=l(0),T=l({imageViewerVisible:!1,progress:{preview:"",percent:0}}),I=r(()=>M.cssVarBlock({ns:M.namespace.value,width:`${e.width}px`,height:`${e.height}px`})),Q=r(()=>e.accept.split(",").map(e=>e.split("/").pop())),A=r(()=>{if(e.tipText)return e.tipText;return`上传图片支持 ${Q.value.join(" / ")} 格式，且图片大小不超过 ${e.size}MB`+(e.width&&e.height?`，建议图片尺寸为 ${e.width}×${e.height}`:"")});function D(e){N.value=S.value.indexOf(e),T.value.imageViewerVisible=!0}function E(e){S.value.splice(S.value.indexOf(e),1)}function F(){T.value.imageViewerVisible=!1}const G=i=>{if(!i||!i.name)return k.error("文件信息无效！"),!1;const a=i.name.split(".").pop()?.toLowerCase()??"";if(!Q.value.some(e=>e?.toLowerCase()===a))return k.error(`上传图片只支持 ${Q.value.join(" / ")} 格式！`),!1;if(i.size/1024/1024>e.size)return k.error(`上传图片大小不能超过 ${e.size}MB！`),!1;try{T.value.progress.preview=URL.createObjectURL(i)}catch(e){console.warn("创建预览失败:",e)}return!e.beforeUpload||e.beforeUpload(i)},H=e=>{T.value.progress.percent=Math.floor(e.percent)},J=(...e)=>{T.value.progress.preview&&URL.revokeObjectURL(T.value.progress.preview),T.value.progress={preview:"",percent:0},B("success",...e)};return s(()=>{T.value.progress.preview&&URL.revokeObjectURL(T.value.progress.preview)}),(e,i)=>{const a=p("QxsIcon");return u(),n("div",{class:c(d(M).e("container")),style:o(I.value)},[m(d(L),g(d(O),{"file-list":S.value,"onUpdate:fileList":i[0]||(i[0]=e=>S.value=e),drag:"",limit:e.limit,"list-type":"picture-card",headers:e.headers,action:e.action,data:e.data,name:e.name,accept:e.accept,"before-upload":G,"on-progress":H,"on-preview":D,"on-success":J,class:[d(M).e("control"),e.limit<=S.value.length?d(M).e("more-than-limit"):""],"on-remove":E}),{file:h(({file:i})=>[_("img",{class:c(`${d(M).namespace.value}-upload-list__item-thumbnail`),src:i.url},null,10,z),_("span",{class:c(`${d(M).namespace.value}-upload-list__item-actions`)},[_("span",{class:c([`${d(M).namespace.value}-upload-list__item-preview`,`${d(M).namespace.value}-image-upload__action-btn`,`${d(M).namespace.value}-image-upload__action-btn--preview`]),onClick:e=>D(i)},[m(d($),{size:"14px"})],10,j),_("span",{class:c(`${d(M).namespace.value}-upload-list__item-divider`)},null,2),e.disabled?f("v-if",!0):(u(),n("span",{key:0,class:c([`${d(M).namespace.value}-upload-list__item-delete`,`${d(M).namespace.value}-image-upload__action-btn`,`${d(M).namespace.value}-image-upload__action-btn--delete`]),onClick:e=>E(i)},[m(d(x),{size:"14px"})],10,C))],2)]),tip:h(()=>[b(e.$slots,"tip",{},()=>[e.notip?f("v-if",!0):(u(),n("div",{key:0,class:c(`${d(M).namespace.value}-upload__tip-text`)},[_("div",R,w(A.value),1)],2))])]),default:h(()=>[b(e.$slots,"default",{},()=>[_("div",V,[m(a,{size:"32px",icon:d(y)},null,8,["icon"]),_("p",null,w(e.placeholder),1)])])]),_:3},16,["file-list","limit","headers","action","data","name","accept","class"]),T.value.imageViewerVisible?(u(),v(d(U),{key:0,"url-list":S.value.map(e=>e.url).filter(e=>void 0!==e),"initial-index":N.value,teleported:"",onClose:F},null,8,["url-list","initial-index"])):f("v-if",!0)],6)}}});export{B as default};
 //# sourceMappingURL=image-upload.vue.mjs.map

package/es/src/image-upload/src/image-upload.vue.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image-upload.vue.mjs","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, UploadImage, ZoomIn } from '@qxs-bns/icons'\nimport { ElImageViewer, ElMessage, ElUpload, useNamespace } from 'element-plus'\nimport { computed, ref, useAttrs } from 'vue'\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义\nconst emits = defineEmits<{\n  onSuccess: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\n// 类型定义\nexport interface ImageUploadProps {\n  action: UploadProps['action']\n  headers?: UploadProps['headers']\n  data?: UploadProps['data']\n  name?: UploadProps['name']\n  url?: string\n  size?: number\n  width?: number\n  accept?: string\n  height?: number\n  placeholder?: string\n  notip?: boolean\n  tipText?: string\n  beforeUpload?: UploadProps['beforeUpload']\n  disabled?: boolean\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width || 160}px`,\n    height: `${height || 90}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(\n  () =>\n    tipText\n    || `上传图片支持 ${exts.value.join(\n      ' / ',\n    )} 格式，且图片大小不超过 ${size}MB${width && height ? `，建议图片尺寸为 ${width}*${height}` : ''}`,\n)\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileExt = file.name.split('.').pop() ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n    return false\n  }\n\n  if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  uploadData.value.progress.preview = URL.createObjectURL(file)\n\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('onSuccess', ...args)\n}\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <ElUpload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon\n            size=\"32px\"\n            :icon=\"UploadImage\"\n          />\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"`${nsEl.namespace.value}-upload-list__item-preview`\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\" />\n          </span>\n          <span style=\"width: 1px; height: 14px; background-color: rgb(255 255 255 / 50%);\" />\n          <span\n            v-if=\"!disabled\"\n            :class=\"`${nsEl.namespace.value}-upload-list__item-delete`\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\" />\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </ElUpload>\n\n    <ElImageViewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","fileExt","name","isTypeOk","includes","isSizeOk","URL","createObjectURL","beforeUpload","ElMessage","error","onProgress","evt","Math","floor","onSuccess","args","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","ElUpload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","UploadImage","placeholder","_createBlock","ElImageViewer","item","filter","v","teleported","onClose"],"mappings":"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"}
+{"version":3,"file":"image-upload.vue.mjs","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, UploadImage, ZoomIn } from '@qxs-bns/icons'\nimport { ElImageViewer, ElMessage, ElUpload, useNamespace } from 'element-plus'\nimport { computed, onUnmounted, ref, useAttrs } from 'vue'\n\n// 类型定义\nexport interface ImageUploadProps {\n  /** 上传地址（必需） */\n  action: UploadProps['action']\n  /** 请求头 */\n  headers?: UploadProps['headers']\n  /** 上传时附带的额外参数 */\n  data?: UploadProps['data']\n  /** 上传的文件字段名 */\n  name?: UploadProps['name']\n  /** 文件大小限制（MB） */\n  size?: number\n  /** 图片显示宽度（px） */\n  width?: number\n  /** 图片显示高度（px） */\n  height?: number\n  /** 接受的文件类型 */\n  accept?: string\n  /** 上传区域提示文字 */\n  placeholder?: string\n  /** 是否隐藏提示文字 */\n  notip?: boolean\n  /** 自定义提示文字 */\n  tipText?: string\n  /** 上传前的钩子函数 */\n  beforeUpload?: UploadProps['beforeUpload']\n  /** 是否禁用 */\n  disabled?: boolean\n  /** 最大上传数量 */\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  action,\n  headers,\n  data,\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义 - 统一事件命名\nconst emits = defineEmits<{\n  success: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width}px`,\n    height: `${height}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(() => {\n  if (tipText) {\n    return tipText\n  }\n\n  const formatText = `上传图片支持 ${exts.value.join(' / ')} 格式，且图片大小不超过 ${size}MB`\n  const sizeText = width && height ? `，建议图片尺寸为 ${width}×${height}` : ''\n\n  return formatText + sizeText\n})\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  // 参数校验\n  if (!file || !file.name) {\n    ElMessage.error('文件信息无效！')\n    return false\n  }\n\n  // 文件类型校验\n  const fileExt = file.name.split('.').pop()?.toLowerCase() ?? ''\n  const isTypeOk = exts.value.some(ext => ext?.toLowerCase() === fileExt)\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持 ${exts.value.join(' / ')} 格式！`)\n    return false\n  }\n\n  // 文件大小校验\n  const fileSizeMB = file.size / 1024 / 1024\n  if (fileSizeMB > size) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  // 设置预览\n  try {\n    uploadData.value.progress.preview = URL.createObjectURL(file)\n  }\n  catch (error) {\n    console.warn('创建预览失败:', error)\n  }\n\n  // 执行自定义校验\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  // 清理预览 URL，防止内存泄漏\n  if (uploadData.value.progress.preview) {\n    URL.revokeObjectURL(uploadData.value.progress.preview)\n  }\n\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('success', ...args)\n}\n\n// 组件卸载时清理资源\nonUnmounted(() => {\n  if (uploadData.value.progress.preview) {\n    URL.revokeObjectURL(uploadData.value.progress.preview)\n  }\n})\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <ElUpload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon\n            size=\"32px\"\n            :icon=\"UploadImage\"\n          />\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"[\n              `${nsEl.namespace.value}-upload-list__item-preview`,\n              `${nsEl.namespace.value}-image-upload__action-btn`,\n              `${nsEl.namespace.value}-image-upload__action-btn--preview`,\n            ]\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\" />\n          </span>\n          <span :class=\"`${nsEl.namespace.value}-upload-list__item-divider`\" />\n          <span\n            v-if=\"!disabled\"\n            :class=\"[\n              `${nsEl.namespace.value}-upload-list__item-delete`,\n              `${nsEl.namespace.value}-image-upload__action-btn`,\n              `${nsEl.namespace.value}-image-upload__action-btn--delete`,\n            ]\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\" />\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </ElUpload>\n\n    <ElImageViewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","name","ElMessage","error","fileExt","toLowerCase","some","URL","createObjectURL","console","warn","beforeUpload","onProgress","evt","Math","floor","onSuccess","args","revokeObjectURL","onUnmounted","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","ElUpload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","UploadImage","placeholder","_createBlock","ElImageViewer","item","filter","v","teleported","onClose"],"mappings":"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"}

package/lib/package.json.cjs

@@ -1,2 +1,2 @@
-"use strict";exports.version="0.0.71";
+"use strict";exports.version="0.0.72";
 //# sourceMappingURL=package.json.cjs.map

package/lib/src/image-upload/src/image-upload.vue.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),t=require("@qxs-bns/icons"),l=require("element-plus");const i={class:"image-slot"},a=["src"],r=["onClick"],n=["onClick"],o={class:"tip-content"};var s=e.defineComponent({name:"QxsImageUpload",__name:"image-upload",props:e.mergeModels({action:{type:String,required:!0},headers:{type:null,required:!1},data:{type:null,required:!1},name:{type:String,required:!1,default:"file"},url:{type:String,required:!1},size:{type:Number,required:!1,default:20},width:{type:Number,required:!1,default:160},accept:{type:String,required:!1,default:"image/jpeg,image/jpg,image/png,image/gif"},height:{type:Number,required:!1,default:90},placeholder:{type:String,required:!1,default:"上传图片"},notip:{type:Boolean,required:!1,default:!1},tipText:{type:String,required:!1,default:""},beforeUpload:{type:null,required:!1},disabled:{type:Boolean,required:!1,default:!1},limit:{type:Number,required:!1,default:1}},{fileList:{type:Array,default:()=>[]},fileListModifiers:{}}),emits:e.mergeModels(["onSuccess","remove"],["update:fileList"]),setup(s,{emit:u}){const p=u,c=e.useAttrs(),d=e.useModel(s,"fileList"),m=l.useNamespace("image-upload"),f=e.ref(0),g=e.ref({imageViewerVisible:!1,progress:{preview:"",percent:0}}),v=e.computed(()=>m.cssVarBlock({ns:m.namespace.value,width:`${s.width||160}px`,height:`${s.height||90}px`})),h=e.computed(()=>s.accept.split(",").map(e=>e.split("/").pop())),y=e.computed(()=>s.tipText||`上传图片支持 ${h.value.join(" / ")} 格式，且图片大小不超过 ${s.size}MB${s.width&&s.height?`，建议图片尺寸为 ${s.width}*${s.height}`:""}`);function V(e){f.value=d.value.indexOf(e),g.value.imageViewerVisible=!0}function x(e){d.value.splice(d.value.indexOf(e),1)}function b(){g.value.imageViewerVisible=!1}const q=e=>{const t=e.name.split(".").pop()??"",i=h.value.includes(t),a=e.size/1024/1024<s.size;return i?a?(g.value.progress.preview=URL.createObjectURL(e),!s.beforeUpload||s.beforeUpload(e)):(l.ElMessage.error(`上传图片大小不能超过 ${s.size}MB！`),!1):(l.ElMessage.error(`上传图片只支持${h.value.join(" / ")}格式！`),!1)},w=e=>{g.value.progress.percent=Math.floor(e.percent)},C=(...e)=>{g.value.progress={preview:"",percent:0},p("onSuccess",...e)};return(s,u)=>{const p=e.resolveComponent("QxsIcon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(m).e("container")),style:e.normalizeStyle(v.value)},[e.createVNode(e.unref(l.ElUpload),e.mergeProps(e.unref(c),{"file-list":d.value,"onUpdate:fileList":u[0]||(u[0]=e=>d.value=e),drag:"",limit:s.limit,"list-type":"picture-card",headers:s.headers,action:s.action,data:s.data,name:s.name,accept:s.accept,"before-upload":q,"on-progress":w,"on-preview":V,"on-success":C,class:[e.unref(m).e("control"),s.limit<=d.value.length?e.unref(m).e("more-than-limit"):""],"on-remove":x}),{file:e.withCtx(({file:l})=>[e.createElementVNode("img",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-thumbnail`),src:l.url},null,10,a),e.createElementVNode("span",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-actions`)},[e.createElementVNode("span",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-preview`),onClick:e=>V(l)},[e.createVNode(e.unref(t.ZoomIn),{size:"14px"})],10,r),u[1]||(u[1]=e.createElementVNode("span",{style:{width:"1px",height:"14px","background-color":"rgb(255 255 255 / 50%)"}},null,-1)),s.disabled?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-delete`),onClick:e=>x(l)},[e.createVNode(e.unref(t.Delete),{size:"14px"})],10,n))],2)]),tip:e.withCtx(()=>[e.renderSlot(s.$slots,"tip",{},()=>[s.notip?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(m).namespace.value}-upload__tip-text`)},[e.createElementVNode("div",o,e.toDisplayString(y.value),1)],2))])]),default:e.withCtx(()=>[e.renderSlot(s.$slots,"default",{},()=>[e.createElementVNode("div",i,[e.createVNode(p,{size:"32px",icon:e.unref(t.UploadImage)},null,8,["icon"]),e.createElementVNode("p",null,e.toDisplayString(s.placeholder),1)])])]),_:3},16,["file-list","limit","headers","action","data","name","accept","class"]),g.value.imageViewerVisible?(e.openBlock(),e.createBlock(e.unref(l.ElImageViewer),{key:0,"url-list":d.value.map(e=>e.url).filter(e=>void 0!==e),"initial-index":f.value,teleported:"",onClose:b},null,8,["url-list","initial-index"])):e.createCommentVNode("v-if",!0)],6)}}});exports.default=s;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("vue"),a=require("@qxs-bns/icons"),t=require("element-plus");const l={class:"image-slot"},r=["src"],i=["onClick"],n=["onClick"],s={class:"tip-content"};var o=e.defineComponent({name:"QxsImageUpload",__name:"image-upload",props:e.mergeModels({action:{type:String,required:!0},headers:{type:null,required:!1},data:{type:null,required:!1},name:{type:String,required:!1,default:"file"},size:{type:Number,required:!1,default:20},width:{type:Number,required:!1,default:160},height:{type:Number,required:!1,default:90},accept:{type:String,required:!1,default:"image/jpeg,image/jpg,image/png,image/gif"},placeholder:{type:String,required:!1,default:"上传图片"},notip:{type:Boolean,required:!1,default:!1},tipText:{type:String,required:!1,default:""},beforeUpload:{type:null,required:!1},disabled:{type:Boolean,required:!1,default:!1},limit:{type:Number,required:!1,default:1}},{fileList:{type:Array,default:()=>[]},fileListModifiers:{}}),emits:e.mergeModels(["success","remove"],["update:fileList"]),setup(o,{emit:u}){const p=u,c=e.useAttrs(),d=e.useModel(o,"fileList"),m=t.useNamespace("image-upload"),f=e.ref(0),v=e.ref({imageViewerVisible:!1,progress:{preview:"",percent:0}}),g=e.computed(()=>m.cssVarBlock({ns:m.namespace.value,width:`${o.width}px`,height:`${o.height}px`})),h=e.computed(()=>o.accept.split(",").map(e=>e.split("/").pop())),w=e.computed(()=>{if(o.tipText)return o.tipText;return`上传图片支持 ${h.value.join(" / ")} 格式，且图片大小不超过 ${o.size}MB`+(o.width&&o.height?`，建议图片尺寸为 ${o.width}×${o.height}`:"")});function y(e){f.value=d.value.indexOf(e),v.value.imageViewerVisible=!0}function _(e){d.value.splice(d.value.indexOf(e),1)}function b(){v.value.imageViewerVisible=!1}const V=e=>{if(!e||!e.name)return t.ElMessage.error("文件信息无效！"),!1;const a=e.name.split(".").pop()?.toLowerCase()??"";if(!h.value.some(e=>e?.toLowerCase()===a))return t.ElMessage.error(`上传图片只支持 ${h.value.join(" / ")} 格式！`),!1;if(e.size/1024/1024>o.size)return t.ElMessage.error(`上传图片大小不能超过 ${o.size}MB！`),!1;try{v.value.progress.preview=URL.createObjectURL(e)}catch(e){console.warn("创建预览失败:",e)}return!o.beforeUpload||o.beforeUpload(e)},C=e=>{v.value.progress.percent=Math.floor(e.percent)},x=(...e)=>{v.value.progress.preview&&URL.revokeObjectURL(v.value.progress.preview),v.value.progress={preview:"",percent:0},p("success",...e)};return e.onUnmounted(()=>{v.value.progress.preview&&URL.revokeObjectURL(v.value.progress.preview)}),(o,u)=>{const p=e.resolveComponent("QxsIcon");return e.openBlock(),e.createElementBlock("div",{class:e.normalizeClass(e.unref(m).e("container")),style:e.normalizeStyle(g.value)},[e.createVNode(e.unref(t.ElUpload),e.mergeProps(e.unref(c),{"file-list":d.value,"onUpdate:fileList":u[0]||(u[0]=e=>d.value=e),drag:"",limit:o.limit,"list-type":"picture-card",headers:o.headers,action:o.action,data:o.data,name:o.name,accept:o.accept,"before-upload":V,"on-progress":C,"on-preview":y,"on-success":x,class:[e.unref(m).e("control"),o.limit<=d.value.length?e.unref(m).e("more-than-limit"):""],"on-remove":_}),{file:e.withCtx(({file:t})=>[e.createElementVNode("img",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-thumbnail`),src:t.url},null,10,r),e.createElementVNode("span",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-actions`)},[e.createElementVNode("span",{class:e.normalizeClass([`${e.unref(m).namespace.value}-upload-list__item-preview`,`${e.unref(m).namespace.value}-image-upload__action-btn`,`${e.unref(m).namespace.value}-image-upload__action-btn--preview`]),onClick:e=>y(t)},[e.createVNode(e.unref(a.ZoomIn),{size:"14px"})],10,i),e.createElementVNode("span",{class:e.normalizeClass(`${e.unref(m).namespace.value}-upload-list__item-divider`)},null,2),o.disabled?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("span",{key:0,class:e.normalizeClass([`${e.unref(m).namespace.value}-upload-list__item-delete`,`${e.unref(m).namespace.value}-image-upload__action-btn`,`${e.unref(m).namespace.value}-image-upload__action-btn--delete`]),onClick:e=>_(t)},[e.createVNode(e.unref(a.Delete),{size:"14px"})],10,n))],2)]),tip:e.withCtx(()=>[e.renderSlot(o.$slots,"tip",{},()=>[o.notip?e.createCommentVNode("v-if",!0):(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(`${e.unref(m).namespace.value}-upload__tip-text`)},[e.createElementVNode("div",s,e.toDisplayString(w.value),1)],2))])]),default:e.withCtx(()=>[e.renderSlot(o.$slots,"default",{},()=>[e.createElementVNode("div",l,[e.createVNode(p,{size:"32px",icon:e.unref(a.UploadImage)},null,8,["icon"]),e.createElementVNode("p",null,e.toDisplayString(o.placeholder),1)])])]),_:3},16,["file-list","limit","headers","action","data","name","accept","class"]),v.value.imageViewerVisible?(e.openBlock(),e.createBlock(e.unref(t.ElImageViewer),{key:0,"url-list":d.value.map(e=>e.url).filter(e=>void 0!==e),"initial-index":f.value,teleported:"",onClose:b},null,8,["url-list","initial-index"])):e.createCommentVNode("v-if",!0)],6)}}});exports.default=o;
 //# sourceMappingURL=image-upload.vue.cjs.map

package/lib/src/image-upload/src/image-upload.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"image-upload.vue.cjs","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, UploadImage, ZoomIn } from '@qxs-bns/icons'\nimport { ElImageViewer, ElMessage, ElUpload, useNamespace } from 'element-plus'\nimport { computed, ref, useAttrs } from 'vue'\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义\nconst emits = defineEmits<{\n  onSuccess: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\n// 类型定义\nexport interface ImageUploadProps {\n  action: UploadProps['action']\n  headers?: UploadProps['headers']\n  data?: UploadProps['data']\n  name?: UploadProps['name']\n  url?: string\n  size?: number\n  width?: number\n  accept?: string\n  height?: number\n  placeholder?: string\n  notip?: boolean\n  tipText?: string\n  beforeUpload?: UploadProps['beforeUpload']\n  disabled?: boolean\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width || 160}px`,\n    height: `${height || 90}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(\n  () =>\n    tipText\n    || `上传图片支持 ${exts.value.join(\n      ' / ',\n    )} 格式，且图片大小不超过 ${size}MB${width && height ? `，建议图片尺寸为 ${width}*${height}` : ''}`,\n)\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  const fileExt = file.name.split('.').pop() ?? ''\n  const isTypeOk = exts.value.includes(fileExt)\n  const isSizeOk = file.size / 1024 / 1024 < size\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持${exts.value.join(' / ')}格式！`)\n    return false\n  }\n\n  if (!isSizeOk) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  uploadData.value.progress.preview = URL.createObjectURL(file)\n\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('onSuccess', ...args)\n}\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <ElUpload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon\n            size=\"32px\"\n            :icon=\"UploadImage\"\n          />\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"`${nsEl.namespace.value}-upload-list__item-preview`\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\" />\n          </span>\n          <span style=\"width: 1px; height: 14px; background-color: rgb(255 255 255 / 50%);\" />\n          <span\n            v-if=\"!disabled\"\n            :class=\"`${nsEl.namespace.value}-upload-list__item-delete`\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\" />\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </ElUpload>\n\n    <ElImageViewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","fileExt","name","isTypeOk","includes","isSizeOk","URL","createObjectURL","beforeUpload","ElMessage","error","onProgress","evt","Math","floor","onSuccess","args","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","ElUpload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","UploadImage","placeholder","_createBlock","ElImageViewer","item","filter","v","teleported","onClose"],"mappings":"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"}
+{"version":3,"file":"image-upload.vue.cjs","sources":["../../../../../../packages/components/src/image-upload/src/image-upload.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { UploadFile, UploadFiles, UploadProps } from 'element-plus'\nimport { Delete, UploadImage, ZoomIn } from '@qxs-bns/icons'\nimport { ElImageViewer, ElMessage, ElUpload, useNamespace } from 'element-plus'\nimport { computed, onUnmounted, ref, useAttrs } from 'vue'\n\n// 类型定义\nexport interface ImageUploadProps {\n  /** 上传地址（必需） */\n  action: UploadProps['action']\n  /** 请求头 */\n  headers?: UploadProps['headers']\n  /** 上传时附带的额外参数 */\n  data?: UploadProps['data']\n  /** 上传的文件字段名 */\n  name?: UploadProps['name']\n  /** 文件大小限制（MB） */\n  size?: number\n  /** 图片显示宽度（px） */\n  width?: number\n  /** 图片显示高度（px） */\n  height?: number\n  /** 接受的文件类型 */\n  accept?: string\n  /** 上传区域提示文字 */\n  placeholder?: string\n  /** 是否隐藏提示文字 */\n  notip?: boolean\n  /** 自定义提示文字 */\n  tipText?: string\n  /** 上传前的钩子函数 */\n  beforeUpload?: UploadProps['beforeUpload']\n  /** 是否禁用 */\n  disabled?: boolean\n  /** 最大上传数量 */\n  limit?: number\n}\n\ninterface UploadProgress {\n  preview: string\n  percent: number\n}\n\n// 组件名称\ndefineOptions({\n  name: 'QxsImageUpload',\n})\n\n// Props 定义\nconst {\n  action,\n  headers,\n  data,\n  name = 'file',\n  size = 20,\n  width = 160,\n  height = 90,\n  limit = 1,\n  placeholder = '上传图片',\n  notip = false,\n  accept = 'image/jpeg,image/jpg,image/png,image/gif',\n  beforeUpload,\n  tipText = '',\n  disabled = false,\n} = defineProps<ImageUploadProps>()\n\n// Emits 定义 - 统一事件命名\nconst emits = defineEmits<{\n  success: [res: any, uploadFile: UploadFile, uploadFiles: UploadFiles]\n  remove: [file: UploadFile]\n}>()\n\nconst attrs = useAttrs()\n\nconst fileList = defineModel('fileList', {\n  type: Array as () => UploadFile[],\n  default: () => [],\n})\n\n// 命名空间\nconst nsEl = useNamespace('image-upload')\n\nconst initialIndex = ref(0)\n// 响应式数据\nconst uploadData = ref<{\n  imageViewerVisible: boolean\n  progress: UploadProgress\n}>({\n  imageViewerVisible: false,\n  progress: {\n    preview: '',\n    percent: 0,\n  },\n})\n\nconst cssVar = computed(() => {\n  return nsEl.cssVarBlock({\n    ns: nsEl.namespace.value,\n    width: `${width}px`,\n    height: `${height}px`,\n  })\n})\n\n// 计算属性\nconst exts = computed(() =>\n  accept.split(',').map(ext => ext.split('/').pop()),\n)\n\nconst tipMessage = computed(() => {\n  if (tipText) {\n    return tipText\n  }\n\n  const formatText = `上传图片支持 ${exts.value.join(' / ')} 格式，且图片大小不超过 ${size}MB`\n  const sizeText = width && height ? `，建议图片尺寸为 ${width}×${height}` : ''\n\n  return formatText + sizeText\n})\n\n// 方法\nfunction onPreview(file: UploadFile) {\n  initialIndex.value = fileList.value.indexOf(file)\n  uploadData.value.imageViewerVisible = true\n}\nfunction onRemove(file: UploadFile) {\n  fileList.value.splice(fileList.value.indexOf(file), 1)\n}\n\nfunction previewClose() {\n  uploadData.value.imageViewerVisible = false\n}\n\nconst handleBeforeUpload: UploadProps['beforeUpload'] = (file) => {\n  // 参数校验\n  if (!file || !file.name) {\n    ElMessage.error('文件信息无效！')\n    return false\n  }\n\n  // 文件类型校验\n  const fileExt = file.name.split('.').pop()?.toLowerCase() ?? ''\n  const isTypeOk = exts.value.some(ext => ext?.toLowerCase() === fileExt)\n\n  if (!isTypeOk) {\n    ElMessage.error(`上传图片只支持 ${exts.value.join(' / ')} 格式！`)\n    return false\n  }\n\n  // 文件大小校验\n  const fileSizeMB = file.size / 1024 / 1024\n  if (fileSizeMB > size) {\n    ElMessage.error(`上传图片大小不能超过 ${size}MB！`)\n    return false\n  }\n\n  // 设置预览\n  try {\n    uploadData.value.progress.preview = URL.createObjectURL(file)\n  }\n  catch (error) {\n    console.warn('创建预览失败:', error)\n  }\n\n  // 执行自定义校验\n  return beforeUpload ? beforeUpload(file) : true\n}\n\nconst onProgress: UploadProps['onProgress'] = (evt) => {\n  uploadData.value.progress.percent = Math.floor(evt.percent)\n}\n\nconst onSuccess: UploadProps['onSuccess'] = (...args) => {\n  // 清理预览 URL，防止内存泄漏\n  if (uploadData.value.progress.preview) {\n    URL.revokeObjectURL(uploadData.value.progress.preview)\n  }\n\n  uploadData.value.progress = {\n    preview: '',\n    percent: 0,\n  }\n  emits('success', ...args)\n}\n\n// 组件卸载时清理资源\nonUnmounted(() => {\n  if (uploadData.value.progress.preview) {\n    URL.revokeObjectURL(uploadData.value.progress.preview)\n  }\n})\n</script>\n\n<template>\n  <div\n    :class=\"nsEl.e('container')\"\n    :style=\"cssVar\"\n  >\n    <ElUpload\n      v-bind=\"attrs\"\n      v-model:file-list=\"fileList\"\n      drag\n      :limit=\"limit\"\n      list-type=\"picture-card\"\n      :headers=\"headers\"\n      :action=\"action\"\n      :data=\"data\"\n      :name=\"name\"\n      :accept=\"accept\"\n      :before-upload=\"handleBeforeUpload\"\n      :on-progress=\"onProgress\"\n      :on-preview=\"onPreview\"\n      :on-success=\"onSuccess\"\n      :class=\"[nsEl.e('control'), limit <= fileList.length ? nsEl.e('more-than-limit') : '']\"\n      :on-remove=\"onRemove\"\n    >\n      <slot>\n        <div class=\"image-slot\">\n          <QxsIcon\n            size=\"32px\"\n            :icon=\"UploadImage\"\n          />\n          <p>{{ placeholder }}</p>\n        </div>\n      </slot>\n      <template #file=\"{ file }\">\n        <img\n          :class=\"`${nsEl.namespace.value}-upload-list__item-thumbnail`\"\n          :src=\"file.url\"\n        >\n        <span :class=\"`${nsEl.namespace.value}-upload-list__item-actions`\">\n          <span\n            :class=\"[\n              `${nsEl.namespace.value}-upload-list__item-preview`,\n              `${nsEl.namespace.value}-image-upload__action-btn`,\n              `${nsEl.namespace.value}-image-upload__action-btn--preview`,\n            ]\"\n            @click=\"onPreview(file)\"\n          >\n            <ZoomIn size=\"14px\" />\n          </span>\n          <span :class=\"`${nsEl.namespace.value}-upload-list__item-divider`\" />\n          <span\n            v-if=\"!disabled\"\n            :class=\"[\n              `${nsEl.namespace.value}-upload-list__item-delete`,\n              `${nsEl.namespace.value}-image-upload__action-btn`,\n              `${nsEl.namespace.value}-image-upload__action-btn--delete`,\n            ]\"\n            @click=\"onRemove(file)\"\n          >\n            <Delete size=\"14px\" />\n          </span>\n        </span>\n      </template>\n      <template #tip>\n        <slot name=\"tip\">\n          <div\n            v-if=\"!notip\"\n            :class=\"`${nsEl.namespace.value}-upload__tip-text`\"\n          >\n            <div class=\"tip-content\">\n              {{ tipMessage }}\n            </div>\n          </div>\n        </slot>\n      </template>\n    </ElUpload>\n\n    <ElImageViewer\n      v-if=\"uploadData.imageViewerVisible\"\n      :url-list=\"fileList.map((item: UploadFile) => item.url).filter((v: string | undefined) => v !== undefined)\"\n      :initial-index=\"initialIndex\"\n      teleported\n      @close=\"previewClose\"\n    />\n  </div>\n</template>\n"],"names":["emits","__emit","attrs","useAttrs","fileList","_useModel","__props","nsEl","useNamespace","initialIndex","ref","uploadData","imageViewerVisible","progress","preview","percent","cssVar","computed","cssVarBlock","ns","namespace","value","width","height","exts","split","map","ext","pop","tipMessage","tipText","join","size","onPreview","file","indexOf","onRemove","splice","previewClose","handleBeforeUpload","name","ElMessage","error","fileExt","toLowerCase","some","URL","createObjectURL","console","warn","beforeUpload","onProgress","evt","Math","floor","onSuccess","args","revokeObjectURL","onUnmounted","_createElementBlock","class","_normalizeClass","_unref","e","style","_createVNode","ElUpload","_mergeProps","$event","drag","limit","headers","action","data","accept","length","_withCtx","_createElementVNode","src","url","onClick","ZoomIn","disabled","Delete","tip","_renderSlot","_ctx","notip","_hoisted_5","_toDisplayString","_hoisted_1","_component_QxsIcon","icon","UploadImage","placeholder","_createBlock","ElImageViewer","item","filter","v","teleported","onClose"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@qxs-bns/components",
   "type": "module",
-  "version": "0.0.71",
+  "version": "0.0.72",
   "description": "Vue 3 Component Library",
   "license": "MIT",
   "homepage": "https://trry-hub.github.io/qxs-bns/",
@@ -44,9 +44,9 @@
     "@amap/amap-jsapi-loader": "^1.0.1",
     "@iconify/vue": "^5.0.0",
     "@qxs-bns/directives": "0.0.19",
-    "@qxs-bns/hooks": "0.0.5",
+    "@qxs-bns/hooks": "0.0.6",
     "@qxs-bns/icons": "0.0.9",
-    "@qxs-bns/utils": "0.0.26",
+    "@qxs-bns/utils": "0.0.27",
     "@vueuse/core": "^11.3.0",
     "echarts": "^5.5.1",
     "lodash-es": "^4.17.21",