@farris/ui-vue 1.8.0-alpha.0 → 1.8.0-beta.1

package/components/page-footer/index.esm.js

@@ -1,16 +1,16 @@
 var te = Object.defineProperty;
 var se = (a, e, t) => e in a ? te(a, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : a[e] = t;
 var C = (a, e, t) => se(a, typeof e != "symbol" ? e + "" : e, t);
-import { defineComponent as z, ref as h, computed as y, watch as _, createVNode as g, Fragment as G, inject as H, onMounted as oe } from "vue";
-import { resolveAppearance as ne, resolveToolbar as re, createPropsResolver as D, createPageHeaderEventHandlerResolver as ie } from "../dynamic-resolver/index.esm.js";
+import { defineComponent as z, ref as h, computed as y, watch as D, createVNode as g, Fragment as _, inject as H, onMounted as oe } from "vue";
+import { resolveAppearance as ne, resolveToolbar as re, createPropsResolver as G, createPageHeaderEventHandlerResolver as ie } from "../dynamic-resolver/index.esm.js";
 import ae from "../response-toolbar/index.esm.js";
-import { DgControl as $, canvasChanged as le, refreshCanvas as de, useDesignerComponent as ce, FDesignerInnerItem as ue } from "../designer-canvas/index.esm.js";
-import pe, { responseToolbarResolver as q } from "../../designer/response-toolbar/index.esm.js";
-import { cloneDeep as fe } from "lodash-es";
+import { DgControl as $, canvasChanged as le, refreshCanvas as de, UseTemplateDragAndDropRules as ce, useDesignerComponent as ue, FDesignerInnerItem as pe } from "../designer-canvas/index.esm.js";
+import fe, { responseToolbarResolver as q } from "../../designer/response-toolbar/index.esm.js";
+import { cloneDeep as ge } from "lodash-es";
 const L = /* @__PURE__ */ new Map([
   ["appearance", ne],
   ["toolbar", re]
-]), ge = "https://json-schema.org/draft/2020-12/schema", me = "https://farris-design.gitee.io/page-footer.schema.json", he = "page-footer", be = "A Farris Input Component", Ce = "object", ve = {
+]), me = "https://json-schema.org/draft/2020-12/schema", he = "https://farris-design.gitee.io/page-footer.schema.json", be = "page-footer", Ce = "A Farris Input Component", ve = "object", ye = {
   id: {
     description: "The unique identifier for a page-footer",
     type: "string"
@@ -78,20 +78,26 @@ const L = /* @__PURE__ */ new Map([
       }
     }
   }
-}, ye = [
+}, xe = [
   "id",
   "type"
 ], K = {
-  $schema: ge,
-  $id: me,
-  title: he,
-  description: be,
-  type: Ce,
-  properties: ve,
-  required: ye
+  $schema: me,
+  $id: he,
+  title: be,
+  description: Ce,
+  type: ve,
+  properties: ye,
+  required: xe
 };
 function J(a, e, t) {
-  return e;
+  return e.appearance = {
+    class: "f-page-is-footer"
+  }, e.toolbar = {
+    id: `${e.id}-toolbar`,
+    type: "response-toolbar",
+    buttons: []
+  }, e;
 }
 const j = {
   /** 
@@ -141,24 +147,26 @@ const j = {
   /** 按钮组 */
   buttons: { type: Array, default: [] },
   /** 按钮大小 */
-  buttonSize: { type: String, default: "" }
-}, xe = D(j, K, L, J), Ee = ie(), Q = Object.assign({}, j, {
+  buttonSize: { type: String, default: "" },
+  /** 控制是否可见 */
+  visible: { type: Boolean, default: !0 }
+}, we = G(j, K, L, J), Ee = ie(), Q = Object.assign({}, j, {
   componentId: { type: String, default: "" }
-}), we = D(Q, K, L, J), B = /* @__PURE__ */ z({
+}), Ve = G(Q, K, L, J), O = /* @__PURE__ */ z({
   name: "FPageFooter",
   props: j,
   emits: ["click"],
   setup(a, e) {
-    const t = h(a.collapsed), s = y(() => a.collapsedText), r = h(a.contentClass), o = y(() => a.enableCollapse), n = y(() => a.expandedText), l = h(a.headerClass), i = h(a.headerContentClass), d = h(a.headerToolbarClass), u = y(() => a.showHeader), m = h(a.customClass), p = h(a.buttons), S = (f, M) => {
+    const t = h(a.collapsed), s = y(() => a.collapsedText), r = h(a.contentClass), o = y(() => a.enableCollapse), n = y(() => a.expandedText), l = h(a.headerClass), i = h(a.headerContentClass), d = h(a.headerToolbarClass), c = y(() => a.showHeader), m = h(a.customClass), p = h(a.buttons), S = (f, M) => {
       e.emit("click", f, M);
     };
-    function w(f) {
+    function E(f) {
       f && f.stopImmediatePropagation(), t.value = !t.value;
     }
     function T() {
       return o.value && g("div", {
         class: "toolbar--collapse",
-        onClick: (f) => w(f)
+        onClick: (f) => E(f)
       }, [g("span", {
         class: "toobar--collapse-text"
       }, [t.value ? n.value : s.value]), g("i", {
@@ -169,7 +177,7 @@ const j = {
       const f = {
         "f-toolbar": !0
       };
-      return d.value.split(" ").reduce((v, I) => (v[I] = !0, v), f), f;
+      return d.value.split(" ").reduce((v, V) => (v[V] = !0, v), f), f;
     });
     function P() {
       return g("div", {
@@ -180,20 +188,20 @@ const j = {
       const f = {
         "f-content": !0
       };
-      return i.value.split(" ").reduce((v, I) => (v[I] = !0, v), f), f;
+      return i.value.split(" ").reduce((v, V) => (v[V] = !0, v), f), f;
     });
     function R() {
-      return g(G, null, [e.slots.headerContent && g("div", {
+      return g(_, null, [e.slots.headerContent && g("div", {
         class: F.value
       }, [e.slots.headerContent()]), P()]);
     }
-    const k = y(() => {
+    const A = y(() => {
       const f = {
         "f-cmp-footer-header": !0
       };
-      return l.value.split(" ").reduce((v, I) => (v[I] = !0, v), f), f;
+      return l.value.split(" ").reduce((v, V) => (v[V] = !0, v), f), f;
     });
-    function A() {
+    function k() {
       if (a.buttons && a.buttons.length > 0)
         return g("div", {
           style: " display: flex; align-items: center;  justify-content: flex-end; flex-shrink: 0;  background: #fff;box-shadow: none;"
@@ -208,33 +216,33 @@ const j = {
     }
     function U() {
       return g("header", {
-        class: k.value
+        class: A.value
       }, [e.slots.header && e.slots.header(), !e.slots.header && R()]);
     }
-    const N = y(() => {
+    const B = y(() => {
       const f = {
         "f-cmp-footer": !0,
         "f-state-collapse": o.value && t.value,
         "f-cmp-footer-accordion": o.value
       };
-      return m.value.split(" ").reduce((v, I) => (v[I] = !0, v), f), f;
-    }), O = y(() => {
+      return m.value.split(" ").reduce((v, V) => (v[V] = !0, v), f), f;
+    }), N = y(() => {
       const f = {
         "f-cmp-footer-content": !0
       };
-      return r.value.split(" ").reduce((v, I) => (v[I] = !0, v), f), f;
+      return r.value.split(" ").reduce((v, V) => (v[V] = !0, v), f), f;
     });
-    return _(() => a.buttons, (f) => {
+    return D(() => a.buttons, (f) => {
       p.value = f;
     }, {
       deep: !0
-    }), () => g("div", {
-      class: N.value
+    }), () => a.visible ? g("div", {
+      class: B.value
     }, [g("footer", {
       class: "f-cmp-footer-container"
-    }, [u.value && U(), A(), g("div", {
-      class: O.value
-    }, [e.slots.default && e.slots.default()])])]);
+    }, [c.value && U(), k(), g("div", {
+      class: N.value
+    }, [e.slots.default && e.slots.default()])])]) : null;
   }
 });
 function Ie(a) {
@@ -247,15 +255,15 @@ function Ie(a) {
     };
   }
   function r(i, d = "") {
-    const u = e.getViewModelById(i);
-    return u ? u.states.map((m) => s(m, d)) : [];
+    const c = e.getViewModelById(i);
+    return c ? c.states.map((m) => s(m, d)) : [];
   }
   function o(i) {
-    const d = e.getRootViewModelId(), u = r(i);
+    const d = e.getRootViewModelId(), c = r(i);
     if (i === d)
-      return u;
+      return c;
     const m = r(d, "root-component.");
-    return [...u, ...m];
+    return [...c, ...m];
   }
   function n(i) {
     return i.binding && i.binding.path || i.id || "";
@@ -265,7 +273,7 @@ function Ie(a) {
   }
   return { getVariables: o, getControlName: n, getStateMachines: l };
 }
-class Ve {
+class Se {
   constructor(e) {
     C(this, "sessionVariables", [
       {
@@ -450,12 +458,12 @@ class Ve {
   }
   updateExpression(e, t, s, r) {
     const o = t === "Field" ? e.binding.field : e.id, n = this.buildRule(o, s, r, e.type === "form-group" ? e.id : "");
-    let i = this.getExpressionData().find((u) => u.targetType === t && u.target === o);
-    const d = (u) => u.value.trim() === "";
+    let i = this.getExpressionData().find((c) => c.targetType === t && c.target === o);
+    const d = (c) => c.value.trim() === "";
     if (i) {
-      const u = i.rules.find((m) => m.id === n.id);
-      if (u)
-        d(n) ? i.rules = i.rules.filter((m) => m.id !== n.id) : (Object.assign(u, n), r === "validate" && e.type === "form-group" && (u.elementId = e.id));
+      const c = i.rules.find((m) => m.id === n.id);
+      if (c)
+        d(n) ? i.rules = i.rules.filter((m) => m.id !== n.id) : (Object.assign(c, n), r === "validate" && e.type === "form-group" && (c.elementId = e.id));
       else {
         if (d(n))
           return null;
@@ -490,10 +498,10 @@ class Ve {
           showMessage: n === "validate" || n === "dataPicking" || n === "required",
           showMessageType: n === "dataPicking",
           beforeOpen: () => this.onBeforeOpenExpression(e, n, t),
-          onSubmitModal: (u) => {
-            const m = this.updateExpression(e, t, u, n);
+          onSubmitModal: (c) => {
+            const m = this.updateExpression(e, t, c, n);
             if (r) {
-              const p = this.buildRule(l, u, n);
+              const p = this.buildRule(l, c, n);
               r(p);
             }
             return m;
@@ -532,7 +540,7 @@ class Ve {
     };
   }
 }
-class Se {
+class Te {
   constructor(e, t) {
     C(this, "componentId");
     C(this, "viewModelId");
@@ -649,7 +657,7 @@ class Se {
    * @returns 
    */
   getPropertyEditorParams(e, t = [], s = "visible", r = {}, o = {}, n = "") {
-    const { getVariables: l, getControlName: i, getStateMachines: d } = Ie(this.designerHostService), u = this.getRealTargetType(e), m = t && t.length > 0 ? t : ["Const", "Variable", "StateMachine", "Expression"], p = {
+    const { getVariables: l, getControlName: i, getStateMachines: d } = Ie(this.designerHostService), c = this.getRealTargetType(e), m = t && t.length > 0 ? t : ["Const", "Variable", "StateMachine", "Expression"], p = {
       type: "property-editor",
       propertyTypes: m
     };
@@ -662,7 +670,7 @@ class Se {
           }, r);
           break;
         case "Expression":
-          p.expressionConfig = this.getExpressionOptions(e, u, n || s);
+          p.expressionConfig = this.getExpressionOptions(e, c, n || s);
           break;
         case "StateMachine":
           p.stateMachines = d();
@@ -674,8 +682,8 @@ class Se {
             newVariableType: "Boolean",
             variables: l(this.viewModelId),
             parentComponentId: this.componentId === "root-component" ? "" : "root-component",
-            onBeforeOpenVariables: (w) => {
-              w.value = l(this.viewModelId);
+            onBeforeOpenVariables: (E) => {
+              E.value = l(this.viewModelId);
             }
           }, o), this.designerContext.designerMode === "PC_RTC" && (p.newVariablePrefix = "ext_" + p.newVariablePrefix);
           break;
@@ -743,7 +751,7 @@ class Se {
     const s = t && t.parent && t.parent.schema;
     if (!s)
       return;
-    const r = s.contents.findIndex((n) => n.id === e), o = fe(s.contents[r]);
+    const r = s.contents.findIndex((n) => n.id === e), o = ge(s.contents[r]);
     s.contents.splice(r, 1), s.contents.splice(r, 0, o), de();
   }
   /**
@@ -774,17 +782,17 @@ class Se {
     const t = e.propertyValue;
     if (!((t && t.type) === "Expression" && t.expressionInfo))
       return;
-    const { expressionId: o, expressionInfo: n } = t, { targetId: l, targetType: i, expressionType: d, value: u, message: m } = n, p = this.formSchemaUtils.getModule();
+    const { expressionId: o, expressionInfo: n } = t, { targetId: l, targetType: i, expressionType: d, value: c, message: m } = n, p = this.formSchemaUtils.getModule();
     p.expressions = p.expressions || [];
     const { expressions: S } = p;
-    let w = S.find((x) => x.target === l);
-    w || (w = { target: l, rules: [], targetType: i }, S.push(w));
-    const T = w.rules.find((x) => x.type === d);
+    let E = S.find((x) => x.target === l);
+    E || (E = { target: l, rules: [], targetType: i }, S.push(E));
+    const T = E.rules.find((x) => x.type === d);
     if (T)
-      T.value = u, T.message = m;
+      T.value = c, T.message = m;
     else {
-      const x = { id: o, type: d, value: u, message: m };
-      w.rules.push(x);
+      const x = { id: o, type: d, value: c, message: m };
+      E.rules.push(x);
     }
     delete t.expressionInfo;
   }
@@ -802,7 +810,7 @@ class Se {
     !i || !i.rules || (i.rules = i.rules.filter((d) => d.type !== o));
   }
   getExpressionOptions(e, t, s) {
-    return new Ve(this.formSchemaUtils).getExpressionOptions(e, t, s);
+    return new Se(this.formSchemaUtils).getExpressionOptions(e, t, s);
   }
   getRealTargetType(e) {
     return ["response-toolbar-item", "tab-toolbar-item", "section-toolbar-item", "drawer-toolbar-item"].indexOf(e.type) > -1 ? "Button" : e.binding && e.binding.field ? "Field" : "Container";
@@ -821,7 +829,7 @@ class Se {
     }, t;
   }
 }
-class Te extends Se {
+class Me extends Te {
   constructor(e, t) {
     super(e, t);
   }
@@ -842,42 +850,46 @@ class Te extends Se {
     };
   }
 }
-function Me(a, e) {
-  function t(l) {
-    return !1;
-  }
-  function s() {
+function Pe(a, e) {
+  const t = new ce();
+  function s(i) {
     return !1;
   }
   function r() {
-    return !1;
+    const { canMove: i } = t.getTemplateRule(a, e);
+    return i;
   }
   function o() {
+    const { canDelete: i } = t.getTemplateRule(a, e);
+    return i;
+  }
+  function n() {
     return !0;
   }
-  function n(l) {
-    return new Te(l, e).getPropertyConfig(a);
+  function l(i) {
+    const d = new Me(i, e), { schema: c } = a;
+    return d.getPropertyConfig(c);
   }
   return {
-    canAccepts: t,
-    hideNestedPaddingInDesginerView: o,
-    getPropsConfig: n,
-    checkCanDeleteComponent: s,
+    canAccepts: s,
+    hideNestedPaddingInDesginerView: n,
+    getPropsConfig: l,
+    checkCanDeleteComponent: o,
     checkCanMoveComponent: r
   };
 }
-const Pe = /* @__PURE__ */ z({
+const Fe = /* @__PURE__ */ z({
   name: "FPageFooterDesign",
   props: Q,
   emits: [],
   setup(a, e) {
-    const t = h(a.collapsed), s = h(a.collapsedText), r = h(a.contentClass), o = h(a.enableCollapse), n = h(a.expandedText), l = h(a.headerClass), i = h(a.headerContentClass), d = h(a.headerToolbarClass), u = h(a.showHeader), m = h(), p = H("design-item-context"), S = H("designer-host-service"), w = Me(p.schema, S), T = ce(m, p, w), x = h(p.schema.toolbar || {
+    const t = h(a.collapsed), s = h(a.collapsedText), r = h(a.contentClass), o = h(a.enableCollapse), n = h(a.expandedText), l = h(a.headerClass), i = h(a.headerContentClass), d = h(a.headerToolbarClass), c = h(a.showHeader), m = h(), p = H("design-item-context"), S = H("designer-host-service"), E = Pe(p, S), T = ue(m, p, E), x = h(p.schema.toolbar || {
       type: "response-toolbar",
       buttons: []
     }), P = h(q(x.value));
     oe(() => {
       m.value.componentInstance = T;
-    }), e.expose(T.value), _(() => p.schema.toolbar, () => {
+    }), e.expose(T.value), D(() => p.schema.toolbar, () => {
       x.value = p.schema.toolbar || {
         type: "response-toolbar",
         buttons: []
@@ -886,94 +898,94 @@ const Pe = /* @__PURE__ */ z({
       deep: !0
     });
     const F = y(() => [...P.value.items]);
-    function R(c) {
-      c && c.stopImmediatePropagation(), t.value = !t.value;
+    function R(u) {
+      u && u.stopImmediatePropagation(), t.value = !t.value;
     }
-    function k() {
+    function A() {
       return o.value && g("div", {
         class: "toolbar--collapse",
-        onClick: (c) => R(c)
+        onClick: (u) => R(u)
       }, [g("span", {
         class: "toobar--collapse-text"
       }, [t.value ? n.value : s.value]), g("i", {
         class: "f-icon toolbar--collapse-icon"
       }, null)]);
     }
-    const A = y(() => {
-      const c = {
+    const k = y(() => {
+      const u = {
         "f-toolbar": !0
       };
-      return d.value.split(" ").reduce((b, E) => (b[E] = !0, b), c), c;
+      return d.value.split(" ").reduce((b, w) => (b[w] = !0, b), u), u;
     });
     function U() {
       return g("div", {
-        class: A.value
-      }, [e.slots.headerToolbar && e.slots.headerToolbar(), !e.slots.headerToolbar && k()]);
+        class: k.value
+      }, [e.slots.headerToolbar && e.slots.headerToolbar(), !e.slots.headerToolbar && A()]);
     }
-    const N = y(() => {
-      const c = {
+    const B = y(() => {
+      const u = {
         "f-content": !0
       };
-      return i.value.split(" ").reduce((b, E) => (b[E] = !0, b), c), c;
+      return i.value.split(" ").reduce((b, w) => (b[w] = !0, b), u), u;
     });
-    function O() {
-      return g(G, null, [e.slots.headerContent && g("div", {
-        class: N.value
+    function N() {
+      return g(_, null, [e.slots.headerContent && g("div", {
+        class: B.value
       }, [e.slots.headerContent()]), U()]);
     }
     const f = y(() => {
-      const c = {
+      const u = {
         "f-cmp-footer-header": !0
       };
-      return l.value.split(" ").reduce((b, E) => (b[E] = !0, b), c), c;
+      return l.value.split(" ").reduce((b, w) => (b[w] = !0, b), u), u;
     });
-    function M(c, V) {
-      c && V && V.split(" ").reduce((E, ee) => (E[ee] = !0, E), c);
+    function M(u, I) {
+      u && I && I.split(" ").reduce((w, ee) => (w[ee] = !0, w), u);
     }
     const v = y(() => {
-      const c = {
+      const u = {
         "text-right": !0,
         "col-6": !0
       };
-      return M(c, a.buttonClass || ""), c;
+      return M(u, a.buttonClass || ""), u;
     });
-    function I(c, V, b, E) {
-      p && p.setupContext && p.setupContext.emit("selectionChange", c, V, b, E);
+    function V(u, I, b, w) {
+      p && p.setupContext && p.setupContext.emit("selectionChange", u, I, b, w);
     }
     function W() {
       return g("header", {
         class: f.value
-      }, [e.slots.header && e.slots.header(), !e.slots.header && O()]);
+      }, [e.slots.header && e.slots.header(), !e.slots.header && N()]);
     }
     const X = y(() => {
-      const c = {
+      const u = {
         "f-cmp-footer": !0,
         "f-state-collapse": o.value && t.value,
         "f-cmp-footer-accordion": o.value
       };
-      return l.value.split(" ").reduce((b, E) => (b[E] = !0, b), c), c;
+      return l.value.split(" ").reduce((b, w) => (b[w] = !0, b), u), u;
     }), Y = y(() => {
-      const c = {
+      const u = {
         "f-cmp-footer-content": !0
       };
-      return r.value.split(" ").reduce((b, E) => (b[E] = !0, b), c), c;
+      return r.value.split(" ").reduce((b, w) => (b[w] = !0, b), u), u;
     });
     function Z() {
       return g("div", {
         style: " display: flex; align-items: center;  justify-content: flex-end; flex-shrink: 0;  background: #fff;box-shadow: none;"
-      }, [g(ue, {
+      }, [g(pe, {
         class: v.value,
         modelValue: x.value,
-        "onUpdate:modelValue": (c) => x.value = c,
+        "onUpdate:modelValue": (u) => x.value = u,
         canAdd: !1,
         childType: "response-toolbar-item",
         childLabel: "按钮",
         contentKey: "buttons",
         id: x.value.id,
         componentId: a.componentId,
-        onSelectionChange: I
+        onSelectionChange: V
       }, {
-        default: () => [g(pe, {
+        default: () => [g(fe, {
           id: x.value.id,
           customClass: "w-100",
           items: F.value,
@@ -987,27 +999,27 @@ const Pe = /* @__PURE__ */ z({
       class: X.value
     }, [g("footer", {
       class: "f-cmp-footer-container"
-    }, [u.value && W(), Z(), g("div", {
+    }, [c.value && W(), Z(), g("div", {
       class: Y.value
     }, [e.slots.default && e.slots.default()])])]);
   }
-}), Be = {
+}), je = {
   install(a) {
-    a.component(B.name, B);
+    a.component(O.name, O);
   },
   register(a, e, t, s) {
-    a["page-footer"] = B, e["page-footer"] = xe, s["page-footer"] = { eventHandlerResolver: Ee };
+    a["page-footer"] = O, e["page-footer"] = we, s["page-footer"] = { eventHandlerResolver: Ee };
   },
   registerDesigner(a, e, t) {
-    a["page-footer"] = Pe, e["page-footer"] = we;
+    a["page-footer"] = Fe, e["page-footer"] = Ve;
   }
 };
 export {
-  B as FPageFooter,
-  Be as default,
+  O as FPageFooter,
+  je as default,
   Ee as eventHandlerResolver,
   Q as pageFooterDesignerProps,
   j as pageFooterProps,
-  we as propsDesignResolver,
-  xe as propsResolver
+  Ve as propsDesignResolver,
+  we as propsResolver
 };