UNPKG

@farris/ui-vue

Version:

Farris Vue, a Farris Design based Vue3 component library.

2 lines (1 loc) 14 kB
(function(j,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue"),require("lodash-es"),require("../button-edit/index.umd.js"),require("../notify/index.umd.js"),require("../event-parameter/index.umd.js"),require("../common/index.umd.js")):typeof define=="function"&&define.amd?define(["exports","vue","lodash-es","../button-edit/index.umd.js","../notify/index.umd.js","../event-parameter/index.umd.js","../common/index.umd.js"],t):(j=typeof globalThis<"u"?globalThis:j||self,t(j["json-editor"]={},j.Vue,j.LodashES,j.FButtonEdit,j.notify,j.FEventParameter,j.common))})(this,function(j,t,E,w,R,S,k){"use strict";const J={},q={};function B(e){const{properties:n,title:u,ignore:r}=e,l=r&&Array.isArray(r),y=Object.keys(n).reduce((c,g)=>((!l||!r.find(b=>b===g))&&(c[g]=n[g].type==="object"&&n[g].properties?B(n[g]):E.cloneDeep(n[g].default)),c),{});if(u&&(!l||!r.find(c=>c==="id"))){const c=u.toLowerCase().replace(/-/g,"_");y.id=`${c}_${Math.random().toString().slice(2,6)}`}return y}function I(e,n){const u=B(n);return Object.keys(u).reduce((r,l)=>(Object.prototype.hasOwnProperty.call(e,l)&&(r[l]&&E.isPlainObject(r[l])&&E.isPlainObject(e[l]||!e[l])?Object.assign(r[l],e[l]||{}):r[l]=e[l]),r),u),u}function M(e,n){return Object.keys(e).filter(r=>e[r]!=null).reduce((r,l)=>{if(n.has(l)){const y=n.get(l);if(typeof y=="string")r[y]=e[l];else{const c=y(l,e[l],e);Object.assign(r,c)}}else r[l]=e[l];return r},{})}function $(e,n,u=new Map){const r=I(e,n);return M(r,u)}function _(e={}){function n(i,f,s,a){if(typeof s=="number")return a[i].length===s;if(typeof s=="object"){const p=Object.keys(s)[0],m=s[p];if(p==="not")return Number(a[i].length)!==Number(m);if(p==="moreThan")return Number(a[i].length)>=Number(m);if(p==="lessThan")return Number(a[i].length)<=Number(m)}return!1}function u(i,f,s,a){return a[i]&&a[i].propertyValue&&String(a[i].propertyValue.value)===String(s)}const r=new Map([["length",n],["getProperty",u]]);Object.keys(e).reduce((i,f)=>(i.set(f,e[f]),i),r);function l(i,f){const s=i;return typeof f=="number"?[{target:s,operator:"length",param:null,value:Number(f)}]:typeof f=="boolean"?[{target:s,operator:"getProperty",param:i,value:!!f}]:typeof f=="object"?Object.keys(f).map(a=>{if(a==="length")return{target:s,operator:"length",param:null,value:f[a]};const p=a,m=f[a];return{target:s,operator:"getProperty",param:p,value:m}}):[]}function y(i){return Object.keys(i).reduce((s,a)=>{const p=l(a,i[a]);return s.push(...p),s},[])}function c(i,f){if(r.has(i.operator)){const s=r.get(i.operator);return s&&s(i.target,i.param,i.value,f)||!1}return!1}function g(i,f){return y(i).reduce((p,m)=>p&&c(m,f),!0)}function b(i,f){const s=Object.keys(i),a=s.includes("allOf"),p=s.includes("anyOf"),m=a||p,O=(m?i[m?a?"allOf":"anyOf":"allOf"]:[i]).map(N=>g(N,f));return a?!O.includes(!1):O.includes(!0)}return{parseValueSchema:b}}const L={},U={};_();function z(e,n,u=new Map,r=(c,g,b,i)=>g,l={},y=c=>c){return J[n.title]=n,q[n.title]=r,L[n.title]=l,U[n.title]=y,(c={},g=!0)=>{if(!g)return M(c,u);const b=$(c,n,u),i=Object.keys(e).reduce((f,s)=>(f[s]=e[s].default,f),{});return Object.assign(i,b)}}const H={$schema:"https://json-schema.org/draft/2020-12/schema",$id:"https://farris-design.gitee.io/json-editor.schema.json",title:"json-editor",description:"A Farris Component",type:"object",properties:{type:{description:"The type string of json-editor",type:"string",default:"json-editor"},parameterDescriptors:{description:"Description of parameters to be configured",type:"array",default:[]},formContextData:{description:"Form context data",type:"object",default:{}},beforeOpen:{description:"Before opening the configuration dialog, the callback function is executed",type:"function",default:null},dialogTitle:{description:"Title of the dialog modal",type:"string",default:"JSON编辑器"},keyColumnTitle:{description:"Title for the key column in the table",type:"string",default:"键"},valueColumnTitle:{description:"Title for the value column in the table",type:"string",default:"值"},operationColumnTitle:{description:"Title for the operation column",type:"string",default:"操作"},keyColumnPlaceholder:{description:"Placeholder text for key input fields",type:"string",default:""},valueColumnPlaceholder:{description:"Placeholder text for value input fields",type:"string",default:""},addButtonText:{description:"Text displayed on the add new row button",type:"string",default:"添加"}},required:["id","type"],ignore:[]},G=new Map([]);function W(e,n,u){return n}const D={modelValue:{type:String,default:""},parameterDescriptors:{type:Array,default:[]},formContextData:{type:Object,default:{}},beforeOpen:{type:Function,default:null},dialogTitle:{type:String,default:"JSON编辑器"},keyColumnTitle:{type:String,default:"键"},valueColumnTitle:{type:String,default:"值"},operationColumnTitle:{type:String,default:"操作"},keyColumnPlaceholder:{type:String,default:""},valueColumnPlaceholder:{type:String,default:""},addButtonText:{type:String,default:"添加"}},A=z(D,H,G,W);function Y(e,n,u){const r=t.inject(R.F_NOTIFY_SERVICE_TOKEN,null),{formContextData:l,parameterDescriptors:y,initialize:c,hasDuplicateParameter:g,getNewValue:b}=u;function i(m){n.emit("change",m),n.emit("update:modelValue",m)}function f(){if(g())return r==null||r.warning({message:`配置中存在重复的${e.keyColumnTitle},请修改。`,position:"top-center"}),!1;const m=b();return i(m),!0}const s=t.reactive({title:e.dialogTitle,width:675,height:500,fitContent:!1,showHeader:!0,showCloseButton:!0,showMaxButton:!1,resizeable:!1,draggable:!0,closedCallback:()=>{},buttons:[{class:"btn btn-secondary",text:"取消",handle:()=>!0},{class:"btn btn-primary",text:"确定",handle:()=>f()}]});function a(){i("")}function p(){if(c(),typeof e.beforeOpen=="function"){const m=e.beforeOpen();if(!m)return;m.then(V=>{const C=V==null?void 0:V.formContextData;l.value=C||l.value||{};const O=V==null?void 0:V.parameterDescriptors;y.value=O||y.value||[]})}}return{modalConfigs:s,beforeOpenModalDialog:p,onClear:a,changeValue:i}}const Q={options:{type:Array,default:[]},idField:{type:String,default:"id"},valueField:{type:String,default:"id"},textField:{type:String,default:"name"},titleField:{type:String,default:"name"}},X=t.defineComponent({name:"FEditableComboPopupContainer",props:Q,emits:["select","close"],setup(e,n){const u=t.computed(()=>e.options.length===0);function r(a){n.emit("select",a)}function l(){n.emit("close")}function y(a){return a[e.idField]}function c(a){return a[e.textField]}function g(a){return a[e.titleField]||""}function b(){return t.createVNode("div",{class:"fv-editable-combo-list-close",onClick:l},[t.createVNode("span",null,[t.createTextVNode("关闭")])])}function i(a){return t.createVNode("div",{class:"fv-editable-combo-list-item",key:y(a),title:g(a),onClick:()=>r(a)},[t.createVNode("span",null,[c(a)])])}function f(){return e.options.map(a=>i(a))}function s(){return t.createVNode("div",{class:"fv-editable-combo-list-placeholder"},[t.createVNode("span",null,[t.createTextVNode("无选项")])])}return()=>t.createVNode("div",{class:"fv-editable-combo-list"},[u.value&&s(),f(),b()])}}),Z={modelValue:{type:String,default:""},options:{type:Array,default:[]},idField:{type:String,default:"id"},valueField:{type:String,default:"id"},textField:{type:String,default:"name"},titleField:{type:String,default:"name"},placeholder:{type:String,default:"请选择"},dropDownIcon:{type:String,default:'<span class="f-icon f-icon-arrow-60-down"></span>'},autoApply:{type:Boolean,default:!0},filterOnType:{type:Boolean,default:!0}},K=t.defineComponent({name:"FEditableCombo",props:Z,emits:["update:modelValue","select"],setup(e,n){const u=t.ref(),r=t.ref(""),l=t.computed(()=>Array.isArray(e.options)?e.options.filter(p=>{if(!p||typeof p!="object")return!1;const m=p[e.valueField]||"";return typeof m!="string"?!1:m.includes(r.value)}):[]),y=t.computed(()=>l.value.length>0);function c(p){var m,V;p?(m=u.value)==null||m.showPopup():(V=u.value)==null||V.hidePopup()}function g(p){if(p.code==="Escape"){c(!1);return}e.filterOnType&&(r.value=e.modelValue,y.value?c(!0):c(!1))}function b(){r.value=""}function i(){b(),y.value&&c(!0)}function f(){b()}function s(p){n.emit("update:modelValue",p)}function a(p){if(n.emit("select",p),e.autoApply){const m=p[e.valueField];s(m)}c(!1)}return()=>t.createVNode(w,{ref:u,modelValue:e.modelValue,"onUpdate:modelValue":s,editable:!0,enableClear:!0,placeholder:e.placeholder,buttonContent:e.dropDownIcon,placement:"auto",popupClass:"fv-editable-combo-popup",onClick:i,onClickButton:f,onKeyup:g},{default:()=>[t.createVNode(X,{options:l.value,idField:e.idField,valueField:e.valueField,textField:e.textField,titleField:e.titleField,onSelect:a,onClose:()=>c(!1)},null)]})}}),ee={useParametersComposition:{type:Object,require:!0},jsonEditorProps:{type:Object,default:{}},formContextData:{type:Object,default:{}}},te=t.defineComponent({name:"FJsonEditorModalContainer",props:ee,emits:[],setup(e){const{parameterItems:n,parameterCodeOptions:u,appendNewParameter:r,deleteParameterById:l,onParameterCodeChanged:y}=e.useParametersComposition,c=t.computed(()=>n.value.length===0),g=t.computed(()=>!c.value);function b(){return t.createVNode("div",{class:"fv-json-editor-header"},[t.createVNode("div",{class:"fv-json-editor-key-col"},[e.jsonEditorProps.keyColumnTitle]),t.createVNode("div",{class:"fv-json-editor-value-col"},[e.jsonEditorProps.valueColumnTitle]),t.createVNode("div",{class:"fv-json-editor-operation-col"},[e.jsonEditorProps.operationColumnTitle])])}function i(){return t.createVNode("div",{class:"fv-json-editor-placeholder"},[t.createVNode("div",{class:"fv-json-editor-default-add-button",onClick:r},[t.createVNode("span",{class:"fv-json-editor-default-add-icon f-icon f-icon-add"},null),t.createVNode("span",{class:"fv-json-editor-default-add-text"},[e.jsonEditorProps.addButtonText])])])}function f(C){return t.createVNode(K,{modelValue:C.code,"onUpdate:modelValue":[O=>C.code=O,()=>y(C.id)],options:u.value,placeholder:e.jsonEditorProps.keyColumnPlaceholder},null)}function s(C){var O,T,N;return t.createVNode(S,{modelValue:C.value,"onUpdate:modelValue":F=>C.value=F,editorType:C.editorType,fieldData:(O=e.formContextData)==null?void 0:O.fieldData,varData:(T=e.formContextData)==null?void 0:T.varData,formData:(N=e.formContextData)==null?void 0:N.formData},null)}function a(C){return t.createVNode("div",{class:"fv-json-editor-row"},[t.createVNode("div",{class:"fv-json-editor-key-col"},[f(C)]),t.createVNode("div",{class:"fv-json-editor-value-col"},[s(C)]),t.createVNode("div",{class:"fv-json-editor-operation-col"},[t.createVNode("div",{class:"fv-json-editor-delete-button"},[t.createVNode("span",{class:"fv-json-editor-delete-icon f-icon f-icon-yxs_delete",onClick:()=>l(C.id)},null)])])])}function p(){return n.value.map(C=>a(C))}function m(){return t.createVNode("div",{class:"fv-json-editor-add-button",onClick:r},[t.createVNode("span",{class:"fv-json-editor-add-icon f-icon f-icon-add"},null),t.createVNode("span",{class:"fv-json-editor-add-text"},[e.jsonEditorProps.addButtonText])])}function V(){return t.createVNode("div",{class:"fv-json-editor-body"},[c.value&&i(),p(),g.value&&m()])}return()=>t.createVNode("div",{class:"fv-json-editor"},[b(),V()])}});function ne(e){const n=t.ref([]),u=t.ref([]),r=t.ref(e.parameterDescriptors||[]);t.watch(()=>e.parameterDescriptors,o=>{r.value=o});const{guid:l}=k.useGuid();function y(o){if(n.value=[],u.value=[],!b(o))return;const d=JSON.parse(o);Object.keys(d).forEach(h=>{const P=l(),v=a(h);n.value.push(t.reactive({id:P,code:h,value:i(d[h],P),editorType:v}))})}t.watch(()=>e.modelValue,o=>y(o));function c(){y(e.modelValue)}function g(){const o={};return n.value.forEach(h=>{const P=h==null?void 0:h.code;P&&P.trim().length>0&&(o[P]=f(h.value,h.id))}),Object.keys(o).length===0?"":JSON.stringify(o)}function b(o){try{const d=JSON.parse(o);if(!d||typeof d!="object"||Array.isArray(d))return!1}catch{return!1}return!0}function i(o,d){return typeof o=="object"?(u.value.push(d),JSON.stringify(o)):o}function f(o,d){if(o&&typeof o=="string"&&u.value.includes(d))try{o=JSON.parse(o)}catch{return o}return o===void 0?"":o}function s(o){const d=r.value;return!o||!d?void 0:d.find(P=>P.id===o)}function a(o){const d=s(o);return d==null?void 0:d.editorType}function p(o){if(!o)return"";switch(o){case S.EditorType.Switch:return!1;default:return""}}function m(o){const d=s(o);if(!d)return;const{editorType:h,defaultValue:P}=d;return P!==void 0?P:p(h)}function V(){const o=new Set;for(const d of n.value){const h=d==null?void 0:d.code;if(!(!h||h.trim().length===0)){if(o.has(h))return!0;o.add(h)}}return!1}function C(o){const d=n.value.find(re=>re.id===o);if(!d)return;const h=d.code;if(!h)return;const P=a(h);d.editorType=P||void 0;let v=m(h);v=i(v,o),d.value=v}function O(o){const d=n.value.findIndex(h=>h.id===o);d>=0&&n.value.splice(d,1)}function T(){n.value.push(t.reactive({id:l(),code:"",value:"",editorType:void 0}))}const N=t.computed(()=>r.value.map(o=>{let d=o.label;return o.description&&(d+=`(${o.description})`),{id:o.id,name:d}})),F=t.ref(e.formContextData);return{parameterItems:n,parameterCodeOptions:N,formContextData:F,parameterDescriptors:r,initialize:c,onParameterCodeChanged:C,hasDuplicateParameter:V,deleteParameterById:O,appendNewParameter:T,getNewValue:g}}const x=t.defineComponent({name:"FJsonEditor",props:D,emits:["change","update:modelValue"],setup(e,n){const u=ne(e),{modalConfigs:r,onClear:l,beforeOpenModalDialog:y,changeValue:c}=Y(e,n,u),{formContextData:g}=u;return()=>t.createVNode(w.FButtonEdit,{modelValue:e.modelValue,enableClear:!0,buttonBehavior:"Modal",modalOptions:r,beforeOpen:y,onClear:l,"onUpdate:modelValue":c},{default:()=>[t.createVNode(te,{useParametersComposition:u,jsonEditorProps:e,formContextData:g.value},null)]})}});x.register=(e,n,u,r)=>{e["json-editor"]=x,n["json-editor"]=A};const oe=k.withInstall(x);j.FJsonEditor=x,j.default=oe,j.jsonEditorProps=D,j.propsResolver=A,Object.defineProperties(j,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});