cnhis-design-vue 3.2.4-release.1 → 3.2.4-release.3

package/es/components/form-render/src/components/renderer/formItem.js

@@ -1 +1 @@
-import{defineComponent as e,inject as l,computed as r,ref as t,onUnmounted as o,createVNode as n,mergeProps as a,unref as i}from"vue";import{arrayed as u,widthAppend as s}from"../../../../../shared/utils/index.js";import{isVoidField as d}from"@formily/core";import{observe as m,autorun as f}from"@formily/reactive";import{connect as v,mapProps as p}from"@formily/vue";import{useDebounceFn as c}from"@vueuse/core";import{isString as b,isArray as y,isNumber as _,isFunction as h,uniq as g}from"lodash-es";import{NFormItem as x}from"naive-ui";import I from"../../../../annotation-edit/index.js";import"../../../index.js";import F from"../tooltipMessage.vue.js";import{InjectionFormUUID as k,InjectionFormGraph as j,InjectionAnnotation as R,InjectionAnnotationShortcuts as M,InjectionFormGlobalProps as L,InjectionFormGlobalEmit as q}from"../../constants/index.js";import{useComplexOptionsSpan as E}from"../../hooks/useComplexOptions.js";import{validateMessageParser as K,editorUnescape as N}from"../../utils/index.js";import{dotEscape as S,createFieldAddressId as W}from"../../utils/schema.js";import{useFormField as A}from"../../hooks/useFormField.js";const O=v(e({name:"FormRenderItem",props:{label:String,propertyKey:String,remark:String,span:{type:Number,default:6},suffixFields:{type:Array},labelRender:Function,annotation:{},fieldItem:{type:Object}},setup(e,{slots:u,attrs:v}){const{field:p,fieldKey:K,fieldAddress:O}=A(),T=l(k),C=r((()=>S(`${T}-${O.value}`))),P=t(!1);if(d(p.value)&&y(e.suffixFields)){const r=l(j);o(m(r,c((()=>{d(p.value)&&y(e.suffixFields)&&(P.value=e.suffixFields.some((e=>{const l=p.value.form.query(e).take();return l&&Reflect.get(l,"required")})))}),100)))}else o(f((()=>{P.value=Reflect.get(p.value,"required")})));const V=l(R),$=r({get(){var l,r;return null!=(r=null==(l=V.value)?void 0:l[e.propertyKey])?r:""},set(l){V.value={property:e.propertyKey,value:l}}}),w=l(M);const B=r((()=>V.value&&!1!==e.annotation)),H=r((()=>e.label&&" "!==e.label)),U=r((()=>{let l=0;return B.value&&(l+=18),e.remark&&(l+=18),l})),z=l(L,{}),D=r((()=>{var l;const r=null==(l=e.fieldItem)?void 0:l.bordered;return null==r?z.bordered:r})),G=l("n-form",{}),J=r((()=>{var e,l,r,t;if("left"!==(null!=(l=v.labelPlacement)?l:null==(e=G.props)?void 0:e.labelPlacement))return"";let o=null!=(t=v.labelWidth)?t:null==(r=G.props)?void 0:r.labelWidth;return o&&"auto"!==o?(o=parseInt(o+""),isNaN(o)||!_(o)?"":s(o-12-U.value-(P.value?11:0))):""})),Q=r((()=>h(e.labelRender)?"":b(e.label)?e.label:""));function X(){return H.value?n("section",{class:"form-render__formItemLabel"},[n("span",{class:"form-render__formItemLabel--text",style:{marginRight:s(U.value),maxWidth:J.value},title:Q.value},[h(e.labelRender)?e.labelRender(e.label):e.label]),U.value?n("section",{class:"form-render__formItemLabel--operation"},[e.remark?n("div",{class:"form-render__formItemLabel--tooltip"},[n(F,{message:e.remark},null)]):null,B.value?n(I,{class:"form-render__formItemLabel--annotation",modelValue:$.value,"onUpdate:modelValue":e=>$.value=e,shortcuts:i(w)},null):null]):null]):null}const{getSpan:Y}=E();function Z(){var l,r,t;const o=null==(l=e.fieldItem)?void 0:l.editor_title;return b(o)&&o?n("section",{style:"display:flex;flex-direction:column;gap:4px"},[null==(t=u.default)?void 0:t.call(u),n("div",{innerHTML:N(o)},null)]):null==(r=u.default)?void 0:r.call(u)}const ee=l(L),le=l(q);function re(){const e=[p.value.path+""];return p.value.form.query("*").forEach((l=>{(l.address+"").includes(p.value.address+"")&&((l.path+"").includes(p.value.path+"")||e.push(l.path+""))})),e}const te=r({get:()=>!(!(null==ee?void 0:ee.selectMode)||!y(null==ee?void 0:ee.selectedFields))&&ee.selectedFields.includes(p.value.path+""),set(e){if(!y(null==ee?void 0:ee.selectedFields))return;let l=[...ee.selectedFields];e?(l.push(...re()),l=g(l)):re().forEach((e=>{const r=l.indexOf(e);r>-1&&l.splice(r,1)})),null==le||le("update:selectedFields",l)}}),oe=r((()=>(null==ee?void 0:ee.selectMode)&&!(p.value.parent&&"LINEBAR"!==p.value.parent.componentType)));function ne(){(null==ee?void 0:ee.selectMode)&&(te.value=!te.value)}return()=>{return n(x,a({class:["form-render__formItem",{"form-render--no-border":!D.value,"form-render--underline":"underline"===D.value,"form-render__formItemMask":oe.value,"form-render__formItemMask--selected":oe.value&&te.value}],style:{"--form-item-column":"inner"===(null==(l=e.fieldItem)?void 0:l.childWidthMode)?e.span:Y(T,p.value.address,!1)+e.span}},{id:C.value,uuid:T,onClick:ne,"widget-type":p.value.componentType,"field-key":S(K.value),"field-address":W(O.value),required:P.value}),{...u,default:Z,label:X});var l}}}),p({title:"label"},((e,l)=>{const r=d(l)?void 0:u(l.selfErrors).length?function(e,l){if(!b(l.defined_error_msg)||!l.defined_error_msg)return e.map((e=>K(e,l))).join(",");return K(l.defined_error_msg,l)}(u(l.selfErrors),e.fieldItem):void 0;return{...e,fieldItem:void 0,feedback:r,"validation-status":r?"error":void 0}})));export{O as FORM_ITEM};
+import{defineComponent as e,inject as l,computed as r,ref as t,onUnmounted as o,createVNode as a,mergeProps as n,unref as i}from"vue";import{arrayed as d,widthAppend as s}from"../../../../../shared/utils/index.js";import{isVoidField as u}from"@formily/core";import{observe as m,autorun as f}from"@formily/reactive";import{connect as c,mapProps as v}from"@formily/vue";import{useDebounceFn as p}from"@vueuse/core";import{isString as b,isArray as y,isObject as h,isNumber as _,isFunction as k,uniq as g}from"lodash-es";import{NFormItem as F}from"naive-ui";import I from"../../../../annotation-edit/index.js";import"../../../index.js";import x from"../tooltipMessage.vue.js";import{InjectionFormUUID as j,InjectionFormGraph as R,InjectionAnnotation as M,InjectionAnnotationShortcuts as S,InjectionFormGlobalProps as L,InjectionFormGlobalEmit as O}from"../../constants/index.js";import{useComplexOptionsSpan as q}from"../../hooks/useComplexOptions.js";import{validateMessageParser as w,editorUnescape as C}from"../../utils/index.js";import{dotEscape as E,createFieldAddressId as K}from"../../utils/schema.js";import{useFormField as N}from"../../hooks/useFormField.js";const W=c(e({name:"FormRenderItem",props:{label:String,propertyKey:String,remark:String,span:{type:Number,default:6},suffixFields:{type:Array},labelRender:Function,annotation:{},isOptionChildField:Boolean,feedback:String,showFeedback:{type:Boolean,default:void 0},fieldItem:{type:Object}},setup(e,{slots:d,attrs:c}){const{field:v,fieldKey:w,fieldAddress:W}=N(),A=l(j),B=r((()=>E(`${A}-${W.value}`))),T=t(!1);if(u(v.value)&&y(e.suffixFields)){const r=l(R);o(m(r,p((()=>{u(v.value)&&y(e.suffixFields)&&(T.value=e.suffixFields.some((e=>{const l=v.value.form.query(e).take();return l&&Reflect.get(l,"required")})))}),100)))}else o(f((()=>{T.value=Reflect.get(v.value,"required")})));const P=l(M),V=r({get(){var l,r;return null!=(r=null==(l=P.value)?void 0:l[e.propertyKey])?r:""},set(l){P.value={property:e.propertyKey,value:l}}}),$=l(S);const H=r((()=>{var l;const r={color:null==(l=e.fieldItem)?void 0:l.labelColor};return h(c.labelStyle)&&Object.assign(r,c.labelStyle),r})),U=r((()=>P.value&&!1!==e.annotation)),z=r((()=>e.label&&" "!==e.label)),D=r((()=>{let l=0;return U.value&&(l+=18),e.remark&&(l+=18),l})),G=l(L,{}),J=r((()=>{var l;const r=null==(l=e.fieldItem)?void 0:l.bordered;return null==r?G.bordered:r})),Q=l("n-form",{}),X=r((()=>{var e,l,r,t;if("left"!==(null!=(l=c.labelPlacement)?l:null==(e=Q.props)?void 0:e.labelPlacement))return"";let o=null!=(t=c.labelWidth)?t:null==(r=Q.props)?void 0:r.labelWidth;return o&&"auto"!==o?(o=parseInt(o+""),isNaN(o)||!_(o)?"":s(o-12-D.value-(T.value?11:0))):""})),Y=r((()=>k(e.labelRender)?"":b(e.label)?e.label:""));function Z(){return z.value?a("section",{class:"form-render__formItemLabel"},[a("span",{class:"form-render__formItemLabel--text",style:{marginRight:s(D.value),maxWidth:X.value},title:Y.value},[k(e.labelRender)?e.labelRender(e.label):e.label]),D.value?a("section",{class:"form-render__formItemLabel--operation"},[e.remark?a("div",{class:"form-render__formItemLabel--tooltip"},[a(x,{message:e.remark},null)]):null,U.value?a(I,{class:"form-render__formItemLabel--annotation",modelValue:V.value,"onUpdate:modelValue":e=>V.value=e,shortcuts:i($)},null):null]):null]):null}const{getSpan:ee}=q();function le(){var l,r,t;const o=null==(l=e.fieldItem)?void 0:l.editor_title;return b(o)&&o?a("section",{style:"display:flex;flex-direction:column;gap:4px"},[null==(t=d.default)?void 0:t.call(d),a("div",{innerHTML:C(o)},null)]):null==(r=d.default)?void 0:r.call(d)}const re=l(L),te=l(O);function oe(){const e=[v.value.path+""];return v.value.form.query("*").forEach((l=>{(l.address+"").includes(v.value.address+"")&&((l.path+"").includes(v.value.path+"")||e.push(l.path+""))})),e}const ae=r({get:()=>!(!(null==re?void 0:re.selectMode)||!y(null==re?void 0:re.selectedFields))&&re.selectedFields.includes(v.value.path+""),set(e){if(!y(null==re?void 0:re.selectedFields))return;let l=[...re.selectedFields];e?(l.push(...oe()),l=g(l)):oe().forEach((e=>{const r=l.indexOf(e);r>-1&&l.splice(r,1)})),null==te||te("update:selectedFields",l)}}),ne=r((()=>(null==re?void 0:re.selectMode)&&!(v.value.parent&&"LINEBAR"!==v.value.parent.componentType)));function ie(){(null==re?void 0:re.selectMode)&&(ae.value=!ae.value)}const de=r((()=>e.isOptionChildField?!!e.feedback&&" "!==e.feedback&&e.showFeedback:e.showFeedback));return()=>{return a(F,n({class:["form-render__formItem",{"form-render--no-border":!J.value,"form-render--underline":"underline"===J.value,"form-render__formItemMask":ne.value,"form-render__formItemMask--selected":ne.value&&ae.value}],style:{"--form-item-column":"inner"===(null==(l=e.fieldItem)?void 0:l.childWidthMode)?e.span:ee(A,v.value.address,!1)+e.span},showFeedback:de.value,feedback:e.feedback,labelStyle:H.value},{id:B.value,uuid:A,onClick:ie,"widget-type":v.value.componentType,"field-key":E(w.value),"field-address":K(W.value),required:T.value}),{...d,default:le,label:Z});var l}}}),v({title:"label"},((e,l)=>{const r=u(l)?void 0:d(l.selfErrors).length?function(e,l){if(!b(l.defined_error_msg)||!l.defined_error_msg)return e.map((e=>w(e,l))).join(",");return w(l.defined_error_msg,l)}(d(l.selfErrors),e.fieldItem):void 0;return{...e,fieldItem:void 0,feedback:r,"validation-status":r?"error":void 0}})));export{W as FORM_ITEM};

package/es/components/form-render/src/types/fieldItem.d.ts

@@ -132,6 +132,7 @@ export declare type FieldItem = {
     linebarWidth: string;
     linebarDirection: 'horizontal' | 'vertical';
     linebarTextDirection: 'horizontal' | 'vertical';
+    labelColor: string;
     fieldType: SchemaTypes;
     content: string | FormRenderer | Record<string, FormRenderer>;
     lazyRequest: boolean;