gepic/dist/core/components/designer/src/modules/preview/index.vue.cjs

基于vue3的设计器,可视化开发页面表单

"use strict";const e=require("vue"),y=require("../../../../builder/src/builder.vue.cjs"),f=require("../../../../../../utils/manager/pluginManager.cjs");require("@vueuse/core");require("../../../../../../hooks/store/index.cjs");const C=require("../../../../../../utils/common/string.cjs"),x={class:"min-w-750px rounded"},w={class:"h-full rounded"},b=e.defineComponent({__name:"index",props:{hideConfirm:{type:Boolean},width:{default:"900px"}},setup(m,{expose:p}){const v=m,h=f.pluginManager.getComponent("monacoEditor"),u=f.pluginManager.getComponent("modal"),i=e.ref(null),o=e.ref(!1),n=e.ref(!1),a=e.ref({}),g=e.inject("pageSchema"),s=e.ref(null),d=e.ref("");function c(){n.value=!1}function k(){o.value=!1}function _(){o.value=!0,d.value=C.getUUID()}async function V(){try{let t=await s.value.validateAll();if(!Object.keys(t).length){alert("请添加表单组件后再尝试！");return}Object.keys(t).length===1&&(t=t.default),a.value=JSON.stringify(t,null,2),n.value=!0,e.nextTick(()=>{var l;(l=i.value)==null||l.setValue(a.value)})}catch(t){console.error(t)}}return p({handleOpen:_}),(t,l)=>(e.openBlock(),e.createBlock(e.unref(u),{modelValue:o.value,"onUpdate:modelValue":l[1]||(l[1]=r=>o.value=r),title:"预览",width:t.width,"hide-confirm":v.hideConfirm,"ok-text":"表单数据",onClose:k,onOk:V},{default:e.withCtx(()=>[e.createElementVNode("div",x,[(e.openBlock(),e.createBlock(e.unref(y),{key:d.value,ref_key:"kb",ref:s,"page-schema":e.unref(g)},null,8,["page-schema"])),e.createVNode(e.unref(u),{modelValue:n.value,"onUpdate:modelValue":l[0]||(l[0]=r=>n.value=r),title:"表单数据",width:"860px",onClose:c,onOk:c},{default:e.withCtx(()=>[e.createElementVNode("div",w,[e.createVNode(e.unref(h),{ref_key:"monacoEditorRef",ref:i,"auto-toggle-theme":"","read-only":"",class:"h-full editor","model-value":a.value},null,8,["model-value"])])]),_:1},8,["modelValue"])])]),_:1},8,["modelValue","width","hide-confirm"]))}});module.exports=b;