@duxweb/dvha-pro 1.0.25 → 1.0.26

package/dist/cjs/components/image/posterEditor.cjs

@@ -1 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("vue"),u=require("naive-ui"),I=require("../card/card.cjs");require("clsx");require("@duxweb/dvha-core");require("@vueuse/core");require("mime");require("vue-router");require("@overlastic/vue");require("vue-echarts");require("vue3-ace-editor");require("ace-builds/src-noconflict/mode-vue");require("ace-builds/src-noconflict/mode-javascript");require("ace-builds/src-noconflict/mode-html");require("ace-builds/src-noconflict/mode-json");require("ace-builds/src-noconflict/mode-json5");require("ace-builds/src-noconflict/theme-tomorrow_night");require("ace-builds/src-noconflict/theme-tomorrow");require("ace-builds/src-noconflict/ext-searchbox");require("ace-builds/src-noconflict/ext-language_tools");require("ace-builds/src-noconflict/mode-snippets");require("vue-cropper");require("jinrishici");require("lodash-es");require("vue-draggable-plus");require("aieditor");require("vee-validate");require("@vee-validate/i18n");require("colorizr");require("echarts");require("@ant-design/colors");require("@unocss/preset-icons/browser");require("@unocss/preset-typography");require("unocss/preset-wind4");require("@vee-validate/i18n/dist/locale/en.json");require("@vee-validate/i18n/dist/locale/zh_CN.json");require("vue-command-palette");require("@duxweb/dvha-naiveui");require("../../pages/page404.cjs");require("@iconify-json/tabler/icons.json");require("./elements/index.cjs");const T=require("./hooks/usePosterEditor.cjs"),B=require("./components/CanvasRuler.cjs"),R=require("./pages/LeftToolbar.cjs"),F=require("./pages/RightPanel.cjs");require("dayjs");require("@tanstack/vue-query");require("pinia");const H=require("../upload/image.cjs"),W=a.defineComponent({name:"DuxPosterEditor",props:{data:{type:String,default:""},width:{type:Number,default:750},height:{type:Number,default:1e3},backgroundColor:{type:String,default:"#ffffff"},backgroundImage:{type:String,default:""},onDataUpdate:Function,onSave:Function},setup(t){const l=a.ref(),i=a.ref(),{initCanvas:v,destroy:g,setCallbacks:p,addElement:q,deleteSelectedElements:m,updateElementProperty:d,alignElements:h,canMoveUp:f,canMoveDown:b,canMoveToFront:C,canMoveToBack:N,clearCanvas:k,loadData:s,canvasData:n,selectedElements:x,canvasScale:c,currentElementData:o,currentElementConfig:E,hasMultipleSelection:S,updateCanvasSettings:y,updateCanvasBackground:U,updateCanvasBackgroundImage:V,saveData:w,exportJson:D}=T.usePosterEditor({width:t.width,height:t.height,backgroundColor:t.backgroundColor,backgroundImage:t.backgroundImage});p({onDataChange:t?.onDataUpdate});const M=e=>{const r=P=>{o.value&&d(o.value.id,e.key,P)};switch(e.type){case"text":return a.createVNode(u.NInput,{value:e.value,placeholder:e.options?.placeholder,"onUpdate:value":r},null);case"number":return a.createVNode(u.NInputNumber,{value:e.value,min:e.options?.min,max:e.options?.max,step:e.options?.step,"onUpdate:value":r},null);case"color":return a.createVNode(u.NColorPicker,{value:e.value,"onUpdate:value":r},null);case"select":return a.createVNode(u.NSelect,{value:e.value,options:e.options?.choices||[],"onUpdate:value":r},null);case"switch":return a.createVNode(u.NSwitch,{value:e.value,"onUpdate:value":r},null);case"slider":return a.createVNode(u.NSlider,{value:e.value,min:e.options?.min,max:e.options?.max,step:e.options?.step,"onUpdate:value":r},null);case"image":return a.createVNode(H.DuxImageUpload,{value:e.value,onUpdateValue:r},null);default:return null}};return a.watch(()=>t.data,e=>{e&&s(e)},{immediate:!1}),a.onMounted(()=>{l.value&&i.value&&(v(l.value,i.value),s(t.data))}),a.onUnmounted(()=>{g()}),()=>a.createVNode(I.DuxCard,{class:"h-full",shadow:!0},{default:()=>[a.createVNode("div",{class:"h-full flex"},[a.createVNode(R.LeftToolbar,{onAddElement:q,canvasWidth:n.value.width,canvasHeight:n.value.height},null),a.createVNode("div",{ref:i,class:"flex-1 p-6  pl-12 pt-12 flex items-center justify-center overflow-hidden relative",style:"background: linear-gradient(45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(-45deg, rgba(0,0,0, 0.1) 25%, transparent 25%), linear-gradient(45deg, transparent 75%, rgba(0,0,0, 0.1) 75%), linear-gradient(-45deg, transparent 75%, rgba(0,0,0, 0.1) 75%); background-size: 20px 20px; background-position: 0 0, 0 10px, 10px -10px, -10px 0px;"},[a.createVNode(B.CanvasRuler,{canvasScale:c.value,canvasWidth:n.value.width,canvasHeight:n.value.height},null),a.createVNode("div",{class:"bg-default shadow-lg",style:"position: relative;"},[a.createVNode("canvas",{ref:l,style:"display: block;"},null)])]),a.createVNode(F.RightPanel,{onClearCanvas:k,hasMultipleSelection:S.value,selectedElementsCount:x.value.length,currentElementData:o.value||void 0,currentElementConfig:E.value||void 0,canMoveUp:f.value,canMoveDown:b.value,canMoveToFront:C.value,canMoveToBack:N.value,canvasWidth:n.value.width,canvasHeight:n.value.height,canvasBackgroundColor:n.value.backgroundColor,canvasBackgroundImage:n.value.backgroundImage,onDeleteSelectedElements:m,onAlignElements:e=>h(e),onUpdateElementProperty:d,onUpdateCanvasSize:(e,r)=>y(e,r),onUpdateCanvasBackground:U,onUpdateCanvasBackgroundImage:V,onSaveData:async()=>{await w(),await t?.onSave?.()},onExportJson:D,onRenderToolbarControl:M,canvasScale:c.value},null)])]})}});exports.DuxPosterEditor=W;