hy-dispatch-ui-v3 0.1.6 → 0.2.1

package/es/components/appForm/cpns/appFormItem.vue.mjs

@@ -0,0 +1,312 @@
+import { computed, unref, openBlock, createBlock, normalizeStyle, withCtx, createCommentVNode, createElementVNode, renderSlot, toDisplayString, createElementBlock, createVNode, Fragment, mergeProps } from 'vue';
+import { ElFormItem, ElIcon, ElSelect, ElRadioGroup, ElCheckboxGroup, ElSwitch, ElInputNumber } from 'element-plus';
+import { QuestionFilled } from '@element-plus/icons-vue';
+import { AppDatePicker } from '../../appDatePicker/index.mjs';
+import { AppOrgCascader } from '../../appOrgCascader/index.mjs';
+import { columnShowHandler, columnItemStyle, isRequired, renderText, isDisabled, optionsHandler } from '../js/index.mjs';
+import { setValueByProp, getValueByProp } from '../../../utils/form.mjs';
+import { AppTooltip } from '../../appTooltip/index.mjs';
+import { AppInput } from '../../appInput/index.mjs';
+import { isArray } from '../../../utils/is.mjs';
+import { funRunHandler } from '../../../utils/handler.mjs';
+
+const _sfc_main = {
+  __name: "appFormItem",
+  props: {
+    model: {
+      type: Object,
+      default: () => ({})
+    },
+    column: {
+      type: Object,
+      default: () => ({})
+    },
+    parentProp: {
+      type: String
+    },
+    index: {
+      type: Number
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const columnProp = computed(() => {
+      let field = isArray(props.column.field) ? props.column.field[0] : props.column.field;
+      if (props.parentProp) {
+        field = [props.parentProp, props.index, field];
+      }
+      return field;
+    });
+    const bindValue = computed({
+      get() {
+        const prop = isArray(props.column.field) ? props.column.field[0] : props.column.field;
+        return getValueByProp(props.model, prop);
+      },
+      set(val) {
+        const prop = isArray(props.column.field) ? props.column.field[0] : props.column.field;
+        setValueByProp(props.model, prop, val);
+      }
+    });
+    const bindValue2 = computed({
+      get() {
+        const prop = isArray(props.column.field) ? props.column.field[1] : props.column.field;
+        return getValueByProp(props.model, prop);
+      },
+      set(val) {
+        const prop = isArray(props.column.field) ? props.column.field[1] : props.column.field;
+        setValueByProp(props.model, prop, val);
+      }
+    });
+    function onChangeHandler(...args) {
+      const { onChange } = props.column;
+      if (!onChange) return;
+      onChange(props.column, props.model);
+    }
+    return (_ctx, _cache) => {
+      return unref(columnShowHandler)(props, __props.column) ? (openBlock(), createBlock(unref(ElFormItem), {
+        key: 0,
+        rules: __props.column.rules,
+        prop: columnProp.value,
+        style: normalizeStyle(unref(columnItemStyle)(props, __props.column))
+      }, {
+        default: withCtx(() => [
+          createCommentVNode(" \u8868\u5355\u9879label "),
+          createElementVNode("div", { class: "w-full flex justify-between text-main" }, [
+            createElementVNode("div", { class: "flex items-center" }, [
+              renderSlot(_ctx.$slots, __props.column.labelSlot, {
+                column: __props.column,
+                model: __props.model,
+                required: unref(isRequired)(props, __props.column)
+              }, () => [
+                createElementVNode(
+                  "span",
+                  { class: "text-main" },
+                  toDisplayString(__props.column.label),
+                  1
+                  /* TEXT */
+                )
+              ]),
+              unref(isRequired)(props, __props.column) ? (openBlock(), createElementBlock("span", {
+                key: 0,
+                class: "label-required"
+              })) : createCommentVNode("v-if", true),
+              unref(funRunHandler)(__props.column.help) ? (openBlock(), createBlock(unref(AppTooltip), {
+                key: 1,
+                "is-always": "",
+                content: unref(funRunHandler)(__props.column.help)
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(ElIcon), {
+                    size: "14",
+                    color: "rgba(var(--hy-theme))",
+                    class: "ml-1.5"
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(unref(QuestionFilled))
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })
+                ]),
+                _: 1
+                /* STABLE */
+              }, 8, ["content"])) : createCommentVNode("v-if", true)
+            ]),
+            __props.column.rightSlot && _ctx.$slots[__props.column.rightSlot] ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: "ml-2"
+            }, [
+              renderSlot(_ctx.$slots, __props.column.rightSlot, {
+                column: __props.column,
+                model: __props.model,
+                required: unref(isRequired)(props, __props.column)
+              })
+            ])) : createCommentVNode("v-if", true)
+          ]),
+          createCommentVNode(" \u5185\u5BB9\u4EC5\u67E5\u770B "),
+          __props.column.readonly || __props.readonly || !__props.column.type && !__props.column.slot ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: "w-full text-main h-[32px]"
+          }, [
+            unref(renderText)(props, __props.column) ? (openBlock(), createElementBlock(
+              "span",
+              { key: 0 },
+              toDisplayString(unref(renderText)(props, __props.column)),
+              1
+              /* TEXT */
+            )) : (openBlock(), createElementBlock("span", {
+              key: 1,
+              class: "text-auxiliary"
+            }, "- -"))
+          ])) : (openBlock(), createElementBlock(
+            Fragment,
+            { key: 1 },
+            [
+              createCommentVNode(" \u81EA\u5B9A\u4E49\u5177\u540D\u63D2\u69FD "),
+              __props.column.slot && _ctx.$slots[__props.column.slot] ? renderSlot(_ctx.$slots, __props.column.slot, {
+                key: 0,
+                column: __props.column,
+                model: __props.model,
+                required: unref(isRequired)(props, __props.column)
+              }) : __props.column.type === "input" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 1 },
+                [
+                  createCommentVNode(" \u8F93\u5165\u6846 "),
+                  createVNode(unref(AppInput), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "select" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 2 },
+                [
+                  createCommentVNode(" \u9009\u62E9\u6846 "),
+                  createVNode(unref(ElSelect), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    options: unref(optionsHandler)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled", "options"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "date-picker" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 3 },
+                [
+                  createCommentVNode(" \u65E5\u671F\u9009\u62E9\u6846 "),
+                  ["datetimerange", "daterange", "monthrange", "yearrange"].includes(
+                    __props.column.attrs?.type
+                  ) && unref(isArray)(__props.column.field) ? (openBlock(), createBlock(unref(AppDatePicker), mergeProps({
+                    key: 0,
+                    start: bindValue.value,
+                    "onUpdate:start": ($event) => bindValue.value = $event,
+                    end: bindValue2.value,
+                    "onUpdate:end": ($event) => bindValue2.value = $event,
+                    "is-range": true,
+                    style: { "width": "100%" }
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["start", "onUpdate:start", "end", "onUpdate:end", "disabled"])) : (openBlock(), createBlock(unref(AppDatePicker), mergeProps({
+                    key: 1,
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event,
+                    "is-range": false,
+                    style: { "width": "100%" }
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"]))
+                ],
+                64
+                /* STABLE_FRAGMENT */
+              )) : __props.column.type === "radio" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 4 },
+                [
+                  createCommentVNode(" \u5355\u9009 "),
+                  createVNode(unref(ElRadioGroup), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    options: unref(optionsHandler)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled", "options"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "checkbox" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 5 },
+                [
+                  createCommentVNode(" \u591A\u9009 "),
+                  createVNode(unref(ElCheckboxGroup), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    options: unref(optionsHandler)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled", "options"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "switch" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 6 },
+                [
+                  createCommentVNode(" \u5F00\u5173 "),
+                  createVNode(unref(ElSwitch), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "input-number" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 7 },
+                [
+                  createCommentVNode(" \u6570\u5B57\u8F93\u5165\u6846 "),
+                  createVNode(unref(ElInputNumber), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : __props.column.type === "org-cascader" ? (openBlock(), createElementBlock(
+                Fragment,
+                { key: 8 },
+                [
+                  createCommentVNode(" \u90E8\u95E8\u7EA7\u8054\u9009\u62E9\u6846 "),
+                  createVNode(unref(AppOrgCascader), mergeProps({
+                    modelValue: bindValue.value,
+                    "onUpdate:modelValue": ($event) => bindValue.value = $event,
+                    class: "w-full"
+                  }, __props.column.attrs, {
+                    disabled: unref(isDisabled)(props, __props.column),
+                    onChange: onChangeHandler
+                  }), null, 16, ["modelValue", "onUpdate:modelValue", "disabled"])
+                ],
+                2112
+                /* STABLE_FRAGMENT, DEV_ROOT_FRAGMENT */
+              )) : createCommentVNode("v-if", true)
+            ],
+            64
+            /* STABLE_FRAGMENT */
+          ))
+        ]),
+        _: 3
+        /* FORWARDED */
+      }, 8, ["rules", "prop", "style"])) : createCommentVNode("v-if", true);
+    };
+  }
+};
+
+export { _sfc_main as default };

package/es/components/appForm/cpns/arrayItem.vue.mjs

@@ -0,0 +1,305 @@
+import { computed, useTemplateRef, ref, resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeClass, renderSlot, unref, toDisplayString, createBlock, withCtx, createVNode, createCommentVNode, normalizeStyle, Fragment, renderList, createSlots, mergeProps } from 'vue';
+import { ElIcon } from 'element-plus';
+import { Delete, Top, Bottom, CirclePlus } from '@element-plus/icons-vue';
+import { isRequired, renderArrayItemLabel, renderAddLabel } from '../js/index.mjs';
+import _sfc_main$1 from './appFormItem.vue.mjs';
+import { resetAppFormValue } from '../js/useAppForm.mjs';
+import { useLocale } from '../../../hooks/useLocale.mjs';
+import { setValueByProp, getValueByProp } from '../../../utils/form.mjs';
+import { isNumber, isArray } from '../../../utils/is.mjs';
+import { funRunHandler } from '../../../utils/handler.mjs';
+import { AppTooltip } from '../../appTooltip/index.mjs';
+
+const _sfc_main = {
+  __name: "arrayItem",
+  props: {
+    model: {
+      type: Object,
+      default: () => ({})
+    },
+    column: {
+      type: Object,
+      default: () => ({})
+    },
+    columnNum: {
+      type: Number,
+      default: 1
+    },
+    loading: {
+      type: Boolean,
+      default: false
+    },
+    readonly: {
+      type: Boolean,
+      default: false
+    },
+    size: {
+      type: String,
+      default: "default"
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const { t } = useLocale();
+    const bindValue = computed({
+      get() {
+        const prop = props.column.field;
+        return getValueByProp(props.model, prop);
+      },
+      set(val) {
+        const prop = props.column.field;
+        setValueByProp(props.model, prop, val);
+      }
+    });
+    const containerRef = useTemplateRef("containerRef");
+    ref(0);
+    ref(false);
+    ref(null);
+    const containerStyle = computed(() => {
+      const columnNum = isNumber(props.column.columnNum) && props.column.columnNum > 0 ? props.column.columnNum : isNumber(props.columnNum) && props.columnNum > 0 ? props.columnNum || 1 : 1;
+      return {
+        gridTemplateColumns: `repeat(${columnNum}, minmax(0, 1fr))`
+      };
+    });
+    function onAddItemHandler() {
+      if (!isArray(bindValue.value)) {
+        bindValue.value = [];
+      }
+      bindValue.value.push(resetAppFormValue(props.column.children));
+    }
+    function onDeleteItemHandler(index) {
+      bindValue.value.splice(index, 1);
+    }
+    function onSwapItemHandler(index, index2) {
+      const list = bindValue.value;
+      list[index] = list.splice(index2, 1, list[index])[0];
+    }
+    return (_ctx, _cache) => {
+      const _component_QuestionFilled = resolveComponent("QuestionFilled");
+      return openBlock(), createElementBlock("div", null, [
+        createElementVNode(
+          "div",
+          {
+            class: normalizeClass(["w-full flex justify-between text-main", [__props.size === "small" ? "text-xs" : "text-sm"]])
+          },
+          [
+            createElementVNode("div", { class: "flex items-center" }, [
+              renderSlot(_ctx.$slots, __props.column.labelSlot, {
+                column: __props.column,
+                model: __props.model,
+                required: unref(isRequired)(props, __props.column)
+              }, () => [
+                createElementVNode(
+                  "span",
+                  { class: "text-main" },
+                  toDisplayString(__props.column.label),
+                  1
+                  /* TEXT */
+                )
+              ]),
+              unref(funRunHandler)(__props.column.help) ? (openBlock(), createBlock(unref(AppTooltip), {
+                key: 0,
+                "is-always": "",
+                content: unref(funRunHandler)(__props.column.help)
+              }, {
+                default: withCtx(() => [
+                  createVNode(unref(ElIcon), {
+                    size: "14",
+                    color: "rgba(var(--hy-theme))",
+                    class: "ml-1.5"
+                  }, {
+                    default: withCtx(() => [
+                      createVNode(_component_QuestionFilled)
+                    ]),
+                    _: 1
+                    /* STABLE */
+                  })
+                ]),
+                _: 1
+                /* STABLE */
+              }, 8, ["content"])) : createCommentVNode("v-if", true)
+            ]),
+            __props.column.rightSlot && _ctx.$slots[__props.column.rightSlot] ? (openBlock(), createElementBlock("div", {
+              key: 0,
+              class: "ml-2"
+            }, [
+              renderSlot(_ctx.$slots, __props.column.rightSlot, {
+                column: __props.column,
+                model: __props.model,
+                required: unref(isRequired)(props, __props.column)
+              })
+            ])) : createCommentVNode("v-if", true)
+          ],
+          2
+          /* CLASS */
+        ),
+        createElementVNode(
+          "div",
+          {
+            class: "overflow-y-auto scroll-body",
+            style: normalizeStyle({ maxHeight: `${__props.column.height || 500}px` })
+          },
+          [
+            (openBlock(true), createElementBlock(
+              Fragment,
+              null,
+              renderList(bindValue.value, (item, index) => {
+                return openBlock(), createElementBlock(
+                  "div",
+                  {
+                    key: index,
+                    class: normalizeClass(["bg-background-2 rounded-[6px] border border-border my-1.5", [__props.size === "small" ? "px-4 pt-2" : " pt-3 px-5"]])
+                  },
+                  [
+                    createElementVNode("div", { class: "flex items-center min-h-[36px]" }, [
+                      createElementVNode("div", { class: "flex items-center gap-2 text-xs" }, [
+                        createElementVNode(
+                          "div",
+                          { class: "w-4 h-4 rounded-full border-[2px] border-theme text-theme font-bold flex items-center justify-center" },
+                          toDisplayString(index + 1),
+                          1
+                          /* TEXT */
+                        ),
+                        renderSlot(_ctx.$slots, __props.column.itemLabelSlot, {
+                          column: __props.column,
+                          index
+                        }, () => [
+                          createElementVNode(
+                            "span",
+                            { class: "text-auxiliary" },
+                            toDisplayString(unref(renderArrayItemLabel)(props, __props.column, index)),
+                            1
+                            /* TEXT */
+                          )
+                        ])
+                      ]),
+                      createElementVNode("div", { class: "flex items-center gap-3 ml-auto" }, [
+                        bindValue.value.length > 1 || props.column.emptyChildren ? (openBlock(), createElementBlock("div", {
+                          key: 0,
+                          class: "clickBox bg-background py-0.5 px-1.5 rounded",
+                          onClick: ($event) => onDeleteItemHandler(index)
+                        }, [
+                          createVNode(unref(ElIcon), {
+                            size: "14",
+                            color: "rgb(var(--hy-danger-2))"
+                          }, {
+                            default: withCtx(() => [
+                              createVNode(unref(Delete))
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          })
+                        ], 8, ["onClick"])) : createCommentVNode("v-if", true),
+                        bindValue.value.length > 1 ? (openBlock(), createElementBlock("div", {
+                          key: 1,
+                          class: "flex flex-col justify-center"
+                        }, [
+                          index !== 0 ? (openBlock(), createBlock(unref(ElIcon), {
+                            key: 0,
+                            size: "16",
+                            class: "text-auxiliary hover:text-main clickBox",
+                            onClick: ($event) => onSwapItemHandler(index, index - 1)
+                          }, {
+                            default: withCtx(() => [
+                              createVNode(unref(Top))
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          }, 8, ["onClick"])) : createCommentVNode("v-if", true),
+                          index !== bindValue.value.length - 1 ? (openBlock(), createBlock(unref(ElIcon), {
+                            key: 1,
+                            size: "16",
+                            class: "text-auxiliary hover:text-main clickBox",
+                            onClick: ($event) => onSwapItemHandler(index, index + 1)
+                          }, {
+                            default: withCtx(() => [
+                              createVNode(unref(Bottom))
+                            ]),
+                            _: 1
+                            /* STABLE */
+                          }, 8, ["onClick"])) : createCommentVNode("v-if", true)
+                        ])) : createCommentVNode("v-if", true)
+                      ])
+                    ]),
+                    createElementVNode(
+                      "div",
+                      {
+                        ref_for: true,
+                        ref_key: "containerRef",
+                        ref: containerRef,
+                        class: "grid gap-x-6",
+                        style: normalizeStyle(containerStyle.value)
+                      },
+                      [
+                        (openBlock(true), createElementBlock(
+                          Fragment,
+                          null,
+                          renderList(__props.column.children, (citem, cindex) => {
+                            return openBlock(), createBlock(_sfc_main$1, {
+                              key: cindex,
+                              model: item,
+                              column: citem,
+                              "parent-prop": __props.column.field,
+                              index,
+                              loading: __props.loading,
+                              readonly: __props.readonly
+                            }, createSlots({
+                              _: 2
+                              /* DYNAMIC */
+                            }, [
+                              renderList(_ctx.$slots, (_, slotName) => {
+                                return {
+                                  name: slotName,
+                                  fn: withCtx((scope) => [
+                                    renderSlot(_ctx.$slots, slotName, mergeProps({ ref_for: true }, scope))
+                                  ])
+                                };
+                              })
+                            ]), 1032, ["model", "column", "parent-prop", "index", "loading", "readonly"]);
+                          }),
+                          128
+                          /* KEYED_FRAGMENT */
+                        ))
+                      ],
+                      4
+                      /* STYLE */
+                    )
+                  ],
+                  2
+                  /* CLASS */
+                );
+              }),
+              128
+              /* KEYED_FRAGMENT */
+            ))
+          ],
+          4
+          /* STYLE */
+        ),
+        createElementVNode("div", { class: "flex justify-center mt-2.5" }, [
+          createElementVNode("span", {
+            onClick: ($event) => onAddItemHandler(),
+            class: "flex items-center justify-center clickBox text-success"
+          }, [
+            createVNode(unref(ElIcon), null, {
+              default: withCtx(() => [
+                createVNode(unref(CirclePlus))
+              ]),
+              _: 1
+              /* STABLE */
+            }),
+            createElementVNode(
+              "span",
+              { style: { "margin-left": "6px" } },
+              toDisplayString(unref(renderAddLabel)(props, __props.column)),
+              1
+              /* TEXT */
+            )
+          ], 8, ["onClick"])
+        ])
+      ]);
+    };
+  }
+};
+
+export { _sfc_main as default };