@farris/ui-vue/components/external-container/index.umd.cjs

Farris Vue, a Farris Design based Vue3 component library.

(function(m,a){typeof exports=="object"&&typeof module<"u"?a(exports,require("vue"),require("../dynamic-resolver/index.umd.js"),require("../designer-canvas/index.umd.js"),require("../common/index.umd.js"),require("../property-panel/index.umd.js"),require("../loading/index.umd.js"),require("../notify/index.umd.js"),require("../schema-selector/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","../dynamic-resolver/index.umd.js","../designer-canvas/index.umd.js","../common/index.umd.js","../property-panel/index.umd.js","../loading/index.umd.js","../notify/index.umd.js","../schema-selector/index.umd.js"],a):(m=typeof globalThis<"u"?globalThis:m||self,a(m["external-container"]={},m.Vue,m.dynamicResolver,m.designerCanvas,m.common,m.propertyPanel,m.loading,m.notify,m.schemaSelector))})(this,function(m,a,R,I,B,k,D,E,V){"use strict";const $=new Map([["appearance",R.resolveAppearance]]);function A(i,n,e,t){const o=e.parentComponentInstance;return o&&t&&(o.schema.type===I.DgControl["list-nav"].type?n.appearance={class:"position-relative h-100"}:n.appearance={class:"position-relative",style:"height:300px"}),n}const O={$schema:"https://json-schema.org/draft/2020-12/schema",$id:"https://farris-design.gitee.io/external-container.schema.json",title:"external-container",description:"A Farris Visual Component",type:"object",properties:{id:{description:"The unique identifier for a external-container",type:"string"},type:{description:"The type string of external-container",type:"string",default:"external-container"},appearance:{description:"",type:"object",properties:{class:{type:"string"},style:{type:"string",default:""}},default:{}},visible:{description:"",type:"boolean",default:!0},url:{description:"The url that load the schema from",type:"string"},externalComponent:{description:"The unique identifier for component",type:"ojbect",default:{}}},required:["id","type","externalComponent"],events:{onCommunication:"通讯事件"}},P={customClass:{type:String,default:""},customStyle:{type:String,default:""},componentType:{type:String,default:""},url:{type:String,default:""},schema:{type:Object},useIsolateJs:{type:Boolean,default:!1},externalComponent:{type:Object,default:{}}},b=R.createPropsResolver(P,O,$,A),j=a.defineComponent({name:"FExternalContainer",props:P,emits:[],setup(i,n){return()=>a.createVNode("div",{class:i.customClass,style:i.customStyle},[n.slots.default&&n.slots.default()])}}),J={convertFrom:(i,n)=>{var e;return(e=i.externalComponent)==null?void 0:e.name},convertTo:(i,n,e)=>{e&&(i.externalComponent||(i.externalComponent={}),Object.assign(i.externalComponent,{id:e.id,nameSpace:e.nameSpace,code:e.code,name:e.name,fileName:e.fileName,bizobjectID:e.bizobjectID,relativePath:e.relativePath,projectName:e.projectName}))}};class L extends k.BaseControlProperty{constructor(n,e){super(n,e)}getPropertyConfig(n,e){return this.propertyConfig.categories.basic=this.getBasicPropConfig(n),this.propertyConfig.categories.appearance=this.getAppearanceConfig(n),this.propertyConfig.categories.content=this.getContentConfig(n),this.propertyConfig.categories.eventsEditor=this.getEventPropConfig(n),this.propertyConfig}getContentConfig(n){const e=this;return{description:"外部表单",title:"内容",properties:{externalComponent:{description:"引入的外部表单",title:"引入表单",type:"string",editor:{type:"schema-selector",title:"选择表单",requiredTip:"请选择表单",modalHeight:600,modalWidth:950,editorParams:{formBasicInfo:this.formSchemaUtils.getFormMetadataBasicInfo()},viewOptions:this.formSchemaUtils.designerMode==="PC_RTC"?[{id:"total",title:"全部",type:"Card",dataSource:"Total",pagination:!0}]:[{id:"recommend",title:"推荐",type:"Card",dataSource:"Recommand",pagination:!0},{id:"total",title:"全部",type:"Card",dataSource:"Total",pagination:!0}],repositoryToken:B.FormSchemaRepositorySymbol,validateFunction:t=>{if(t.id)return e.checkFormValidtion(t)}},$converter:J}},setPropertyRelates(t){(t==null?void 0:t.propertyID)==="externalComponent"&&e.syncCommunicationAfterFormChanged(t,n)}}}checkFormValidtion(n){const e=this.designerHostService.formSchemaUtils.getFormMetadataBasicInfo(),t=D.FLoadingService.show();return this.designerHostService.metadataService.getPickMetadata(e.relativePath,n).then(o=>{t.value.close();const d=JSON.parse(o==null?void 0:o.metadata.content).Contents,{templateId:u,name:s}=d.module;if(["list-component","tree-component","list-view-component"].includes(u))return!0;const v=`表单【${s}】不属于组件类模板，无法被引入到当前表单。`;return this.designerHostService.messagerService.warning(v),!1},o=>{var f;return t.value.close(),this.designerHostService.messagerService.error(((f=o==null?void 0:o.response)==null?void 0:f.data.Message)||`查询表单【${n.name}】失败`),!1})}getEventPropConfig(n){const e=[{label:"onCommunication",name:"通讯事件"}],t=this,o=t.eventsEditorUtils.formProperties(n,t.viewModelId,e);return{title:"事件",hideTitle:!0,properties:t.createBaseEventProperty(o),refreshPanelAfterChanged:!0,tabId:"commands",tabName:"交互",setPropertyRelates(d,u){const s=d.propertyValue;delete n[t.viewModelId],s&&(s.setPropertyRelates=this.setPropertyRelates,t.eventsEditorUtils.saveRelatedParameters(n,t.viewModelId,s.events,s))}}}syncCommunicationAfterFormChanged(n,e){if(!e.onCommunication)return;const t=e.onCommunication.replace(/communication:/g,"").split(";");if(!(t!=null&&t.length))return;const o=this.designerHostService.formSchemaUtils.getFormSchema(),f=o.module.communications||[];let d=!1;if(t.map(u=>{const s=f.find(v=>v.id===u);s!=null&&s.source&&s.source.formId!==e.externalComponent.id&&(s.needDelete=!0,d=!0)}),o.module.communications=o.module.communications.filter(u=>!u.needDelete),d){e.onCommunication="";const u=new E.FNotifyService;u.globalConfig={position:"top-center"},u.warning({message:"切换引入表单后，请重新配置组件通讯。"})}}}function z(i,n){const e=i.schema;function t(){return!1}function o(){return!0}function f(){return!0}function d(){return!0}function u(){return"position:relative;padding:0 !important;border:0;overflow:hidden;"}function s(c){return new L(c,n).getPropertyConfig(e,i.componentInstance.value)}function v(){n!=null&&n.formSchemaUtils&&n.formSchemaUtils.externalFormSchema.delete(i.schema.id)}return{canAccepts:t,checkCanDeleteComponent:o,checkCanMoveComponent:f,hideNestedPaddingInDesginerView:d,getStyles:u,getPropsConfig:s,onRemoveComponent:v}}const _=a.defineComponent({name:"FImportExteranlSchema",emits:["close","submit"],setup(i,n){const e=a.inject("designer-host-service");let t;const o=a.ref(),f=new E.FNotifyService;f.globalConfig={position:"top-center"};const d=a.inject("FLoadingService"),u=e.formSchemaUtils.getFormMetadataBasicInfo(),s=a.ref();async function v(l){const g=e.formSchemaUtils.getFormMetadataBasicInfo(),S=d.show();return e.metadataService.getPickMetadata(g.relativePath,l).then(r=>{var U;(U=S.value)==null||U.close();const y=JSON.parse(r==null?void 0:r.metadata.content).Contents,{templateId:h,name:x}=y.module;if(["list-component","tree-component","list-view-component"].includes(h))return!0;const T=`表单【${x}】不属于组件类模板，无法被引入到当前表单。`;return e.messagerService.warning(T),!1},r=>{var p,y;return e.messagerService.error(((p=r==null?void 0:r.response)==null?void 0:p.data.Message)||`查询表单【${l.name}】失败`),(y=S.value)==null||y.close(),!1})}async function c(){if(!o.value){f.warning("请选择表单");return}if(await v(o.value))return!0}function C(){var g,S;const l={id:o.value.id,nameSpace:o.value.nameSpace,code:o.value.code,name:o.value.name,fileName:o.value.fileName,bizobjectID:o.value.bizobjectID,relativePath:o.value.relativePath,projectName:o.value.projectName};n.emit("submit",l),(g=t==null?void 0:t.modalRef)!=null&&g.value.close&&((S=t==null?void 0:t.modalRef)==null||S.value.close())}function N(){var l,g;(l=t==null?void 0:t.modalRef)!=null&&l.value.close&&((g=t==null?void 0:t.modalRef)==null||g.value.close()),n.emit("close")}function w(l){o.value=l!=null&&l.length?l[0]:null}function M(){const l={formBasicInfo:u},g=e.formSchemaUtils.designerMode==="PC_RTC"?[{id:"total",title:"全部",type:"Card",dataSource:"Total",pagination:!1}]:[{id:"recommend",title:"推荐",type:"Card",dataSource:"Recommand",pagination:!1},{id:"total",title:"全部",type:"Card",dataSource:"Total",pagination:!1}];return()=>a.createVNode(V.FSchemaSelector,{ref:s,injectSymbolToken:B.FormSchemaRepositorySymbol,"view-type":"Tabs","view-options":g,editorParams:l,designerHostService:e,"show-footer":!0,onSelectionChange:w,"validate-function":c,onSubmit:C,onCancel:N},{default:()=>[a.createTextVNode(" ")]})}function F(l){l.stopPropagation(),o.value="",t=e.modalService.open({title:"选择表单",width:950,height:600,fitContent:!1,showButtons:!1,render:M(),enableEsc:!1,draggable:!0})}return()=>a.createVNode("div",{class:"f-import-exteranl-component-button no-drag"},[a.createVNode("div",{class:"f-import-exteranl-component-button-center",onClick:F},[a.createVNode("div",{class:"f-icon f-icon-add mr-2"},null),a.createVNode("span",null,[a.createTextVNode("引入已有表单")])])])}}),q=a.defineComponent({name:"FExternalContainerDesign",props:P,emits:[],setup(i,n){const e=a.ref(),t=a.inject("designer-host-service"),o=a.inject("design-item-context"),f=z(o,t),d=I.useDesignerComponent(e,o,f),u=a.inject("FMessageBoxService"),s=a.inject("FLoadingService"),v=t.formSchemaUtils,c=a.ref(i.externalComponent),C=a.ref(),N=a.computed(()=>{var r,p;return(p=(r=C.value)==null?void 0:r.module)==null?void 0:p.components[0]}),w=a.computed(()=>!C.value);a.provide("external-container-id",d.value.schema.id);function M(){const r={id:c.value.id,code:c.value.code,name:c.value.name,fileName:c.value.fileName,nameSpace:c.value.nameSpace,content:C.value,nameLanguage:c.value.nameLanguage};v.externalFormSchema.set(d.value.schema.id,r)}async function F(){var p;const r=t.formSchemaUtils.getFormMetadataBasicInfo();if((p=c.value)!=null&&p.id){const y=s==null?void 0:s.show({message:"数据加载中，请稍候..."});return t.metadataService.getPickMetadata(r.relativePath,c.value).then(h=>{var x;if((x=h==null?void 0:h.metadata)!=null&&x.content){const T=JSON.parse(h.metadata.content);C.value=T.Contents,M()}else u.error(`找不到元数据【${c.value.name}】(${c.value.id})。`);y.value.close()},h=>{var x;u.error(((x=h==null?void 0:h.response)==null?void 0:x.data.Message)||`查询表单【${c.value.name}】失败`),y.value.close()})}}a.watch(()=>i.externalComponent,async r=>{var p;!c.value||!r||JSON.stringify(c.value)!==JSON.stringify(r)?(c.value=r,await F(),(p=o==null?void 0:o.setupContext)==null||p.emit("dragEnd")):c.value=r},{deep:!0}),a.onMounted(()=>{e.value.componentInstance=d,C.value||F()}),n.expose(d.value);function l(){return a.createVNode(a.Fragment,null,[a.createVNode(I.FDesignerItem,{modelValue:N.value,"onUpdate:modelValue":r=>N.value=r,"external-form-schema":C.value},null)])}async function g(r){var p;d.value.schema.externalComponent=r,c.value=r,await F(),(p=o==null?void 0:o.setupContext)==null||p.emit("dragEnd")}function S(){return a.createVNode(_,{onSubmit:g},null)}return()=>a.createVNode("div",{ref:e,style:"height: inherit;"},[w.value?S():l()])}}),H={install(i){i.component(j.name,j)},register(i,n,e,t){i["external-container"]=j,n["external-container"]=b},registerDesigner(i,n,e){i["external-container"]=q,n["external-container"]=b}};m.FExternalContainer=j,m.FExternalContainerDesign=q,m.default=H,m.externalContainerProps=P,m.propsResolver=b,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});