hy-dispatch-ui-v3 0.1.0 → 0.1.2

package/es/components/appButton/style/appButton.scss

@@ -0,0 +1,289 @@
+.hy-button {
+  height: 32px;
+  border: 0;
+  outline: none;
+  appearance: none;
+  -webkit-appearance: none;
+  margin: 0;
+  font: inherit;
+  color: inherit;
+  box-sizing: border-box;
+  white-space: nowrap;
+  font-size: 14px;
+
+  &:disabled,
+  &.is-disabled {
+    cursor: not-allowed;
+    opacity: 0.55;
+  }
+  &.is-loading {
+    cursor: default;
+  }
+  &.hy-button--large {
+    height: 40px;
+  }
+  &.hy-button--small {
+    height: 24px;
+    font-size: 12px;
+  }
+
+  & + & {
+    margin-left: 16px;
+  }
+}
+
+.button_default {
+  background: rgba(94, 157, 180, 0.32);
+
+  .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(94, 157, 180, 0.4) 0%,
+      rgba(94, 157, 180, 1) 50%,
+      rgba(94, 157, 180, 0.4) 100%
+    );
+  }
+
+  .hy-button__inner {
+    background: #003a48;
+    box-shadow:
+      inset 0 0 5px 1px rgba(0, 138, 157, 0.5),
+      inset 0 0 2px 0 rgba(0, 147, 157, 0.5);
+  }
+
+  .hy-button__text {
+    color: #fff;
+  }
+
+  .hy-button__mask {
+    background: radial-gradient(
+      ellipse at center bottom,
+      #7ebbd2 0%,
+      rgb(17, 108, 114) 30%,
+      transparent 60%
+    );
+  }
+
+  &:hover .hy-button__inner {
+    box-shadow:
+      inset 0 0 5px 1px rgba(0, 138, 157, 0.5),
+      inset 0 0 2px 0 rgba(0, 147, 157, 0.5),
+      inset 0 0 5px 1px rgba(0, 138, 157, 0.5),
+      inset 0 0 2px 0 rgba(0, 147, 157, 0.5);
+  }
+
+  &:disabled .hy-button__border,
+  &.is-disabled .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(94, 157, 180, 0.18) 0%,
+      rgba(94, 157, 180, 0.42) 50%,
+      rgba(94, 157, 180, 0.18) 100%
+    );
+  }
+
+  &:disabled .hy-button__inner,
+  &.is-disabled .hy-button__inner {
+    background: #3e5a64;
+    box-shadow:
+      inset 0 0 4px 1px rgba(0, 138, 157, 0.2),
+      inset 0 0 2px 0 rgba(0, 147, 157, 0.16);
+  }
+
+  &:disabled .hy-button__text,
+  &.is-disabled .hy-button__text {
+    color: rgba(255, 255, 255, 0.68);
+  }
+}
+
+.button_function {
+  background: rgba(45, 242, 255, 0.32);
+
+  .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(45, 242, 255, 0.4) 0%,
+      rgba(45, 242, 255, 1) 50%,
+      rgba(45, 242, 255, 0.4) 100%
+    );
+  }
+
+  .hy-button__inner {
+    background: #003a48;
+    box-shadow:
+      inset 0 0 5px 1px rgba(97, 248, 255, 0.5),
+      inset 0 0 2px 0 rgba(159, 248, 255, 0.5);
+  }
+
+  .hy-button__text {
+    color: #fff;
+  }
+
+  .hy-button__mask {
+    background: radial-gradient(
+      ellipse at center bottom,
+      #2df2ff 0%,
+      #1798a1 30%,
+      transparent 60%
+    );
+  }
+
+  &:hover .hy-button__inner {
+    box-shadow:
+      inset 0 0 5px 1px rgba(97, 248, 255, 0.5),
+      inset 0 0 2px 0 rgba(159, 248, 255, 0.5),
+      inset 0 0 5px 1px rgba(97, 248, 255, 0.5),
+      inset 0 0 2px 0 rgba(159, 248, 255, 0.5);
+  }
+
+  &:disabled .hy-button__border,
+  &.is-disabled .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(45, 242, 255, 0.18) 0%,
+      rgba(45, 242, 255, 0.42) 50%,
+      rgba(45, 242, 255, 0.18) 100%
+    );
+  }
+
+  &:disabled .hy-button__inner,
+  &.is-disabled .hy-button__inner {
+    background: #10575c;
+    box-shadow:
+      inset 0 0 4px 1px rgba(97, 248, 255, 0.2),
+      inset 0 0 2px 0 rgba(159, 248, 255, 0.16);
+  }
+
+  &:disabled .hy-button__text,
+  &.is-disabled .hy-button__text {
+    color: rgba(255, 255, 255, 0.68);
+  }
+}
+
+.button_addTo {
+  background: rgba(44, 232, 152, 0.32);
+
+  .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(171, 255, 185, 0.4) 0%,
+      rgba(171, 255, 185, 1) 50%,
+      rgba(171, 255, 185, 0.4) 100%
+    );
+  }
+
+  .hy-button__inner {
+    background: #004823;
+    box-shadow:
+      inset 0 0 5px 1px rgba(97, 255, 179, 0.5),
+      inset 0 0 2px 0 rgba(159, 255, 209, 0.5);
+  }
+
+  .hy-button__text {
+    color: #fff;
+  }
+
+  .hy-button__mask {
+    background: radial-gradient(
+      ellipse at center bottom,
+      #20e080 0%,
+      #109060 30%,
+      transparent 60%
+    );
+  }
+
+  &:hover .hy-button__inner {
+    box-shadow:
+      inset 0 0 5px 1px rgba(97, 255, 179, 0.5),
+      inset 0 0 2px 0 rgba(159, 255, 209, 0.5),
+      inset 0 0 5px 1px rgba(97, 255, 179, 0.5),
+      inset 0 0 2px 0 rgba(159, 255, 209, 0.5);
+  }
+
+  &:disabled .hy-button__border,
+  &.is-disabled .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(171, 255, 185, 0.18) 0%,
+      rgba(171, 255, 185, 0.42) 50%,
+      rgba(171, 255, 185, 0.18) 100%
+    );
+  }
+
+  &:disabled .hy-button__inner,
+  &.is-disabled .hy-button__inner {
+    background: #1d3d2d;
+    box-shadow:
+      inset 0 0 4px 1px rgba(97, 255, 179, 0.2),
+      inset 0 0 2px 0 rgba(159, 255, 209, 0.16);
+  }
+
+  &:disabled .hy-button__text,
+  &.is-disabled .hy-button__text {
+    color: rgba(255, 255, 255, 0.68);
+  }
+}
+
+.button_delete {
+  background: rgba(255, 77, 77, 0.32);
+
+  .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(255, 77, 77, 0.4) 0%,
+      rgba(255, 77, 77, 1) 50%,
+      rgba(255, 77, 77, 0.4) 100%
+    );
+  }
+
+  .hy-button__inner {
+    background: #4f0000;
+    box-shadow:
+      inset 0 0 5px 1px rgba(255, 97, 97, 0.5),
+      inset 0 0 2px 0 rgba(255, 159, 159, 0.5);
+  }
+
+  .hy-button__text {
+    color: #fff;
+  }
+
+  .hy-button__mask {
+    background: radial-gradient(
+      ellipse at center bottom,
+      #ff0000 0%,
+      #b41414 30%,
+      transparent 60%
+    );
+  }
+
+  &:hover .hy-button__inner {
+    box-shadow:
+      inset 0 0 5px 1px rgba(255, 97, 97, 0.5),
+      inset 0 0 2px 0 rgba(255, 159, 159, 0.5),
+      inset 0 0 5px 1px rgba(255, 97, 97, 0.5),
+      inset 0 0 2px 0 rgba(255, 159, 159, 0.5);
+  }
+
+  &:disabled .hy-button__border,
+  &.is-disabled .hy-button__border {
+    background: linear-gradient(
+      90deg,
+      rgba(255, 77, 77, 0.18) 0%,
+      rgba(255, 77, 77, 0.42) 50%,
+      rgba(255, 77, 77, 0.18) 100%
+    );
+  }
+
+  &:disabled .hy-button__inner,
+  &.is-disabled .hy-button__inner {
+    background: #4b0c0c;
+    box-shadow:
+      inset 0 0 4px 1px rgba(255, 97, 97, 0.2),
+      inset 0 0 2px 0 rgba(255, 159, 159, 0.16);
+  }
+
+  &:disabled .hy-button__text,
+  &.is-disabled .hy-button__text {
+    color: rgba(255, 255, 255, 0.68);
+  }
+}

package/es/components/appConfigProvider/appConfigProvider.vue.mjs

@@ -0,0 +1,91 @@
+import { defineComponent, computed, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { ElConfigProvider } from 'element-plus';
+import * as ElementLocale from 'element-plus/es/locales.mjs';
+import { provideGlobalConfig } from '../../hooks/useGlobalConfig.mjs';
+
+const __default__ = defineComponent({
+  name: "AppConfigProvider"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: {
+    locale: {
+      type: String,
+      required: false,
+      default: "zhCn"
+    },
+    api: {
+      type: [Object, Function],
+      required: false
+    },
+    userAvatarMap: {
+      type: Map,
+      required: false,
+      default: () => /* @__PURE__ */ new Map()
+    },
+    size: {
+      type: String,
+      required: false,
+      default: "default"
+    },
+    zIndex: {
+      type: Number,
+      required: false
+    },
+    button: {
+      type: Object,
+      required: false
+    },
+    link: {
+      type: Object,
+      required: false
+    },
+    dialog: {
+      type: Object,
+      required: false
+    },
+    message: {
+      type: Object,
+      required: false
+    },
+    emptyValues: {
+      type: String,
+      required: false
+    },
+    valueOnClear: {
+      type: [String, Number, null],
+      required: false
+    },
+    table: {
+      type: Object,
+      required: false
+    }
+  },
+  setup(__props) {
+    const props = __props;
+    const globalConfig = provideGlobalConfig(props);
+    const config = computed(() => {
+      const { locale, api, userAvatarMap, ...config2 } = globalConfig.value;
+      return {
+        locale: ElementLocale[locale] || ElementLocale["zhCn"],
+        ...config2
+      };
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(
+        unref(ElConfigProvider),
+        mergeProps(config.value, { namespace: "hy-el" }),
+        {
+          default: withCtx(({ config: config2 }) => [
+            renderSlot(_ctx.$slots, "default", { config: config2 })
+          ]),
+          _: 3
+          /* FORWARDED */
+        },
+        16
+        /* FULL_PROPS */
+      );
+    };
+  }
+});
+
+export { _sfc_main as default };

package/es/components/appConfigProvider/index.mjs

@@ -0,0 +1,6 @@
+import _sfc_main from './appConfigProvider.vue.mjs';
+import { withInstall } from '../../utils/handler.mjs';
+
+const AppConfigProvider = withInstall(_sfc_main);
+
+export { AppConfigProvider, AppConfigProvider as default };

package/es/components/appConfirmDialog/appConfirmDialog.vue.mjs

@@ -1,15 +1,14 @@
-import { defineComponent, ref, openBlock, createBlock, unref, mergeProps, withCtx, createElementVNode, createVNode, normalizeClass, toDisplayString, createElementBlock, createTextVNode, createCommentVNode } from 'vue';
-import { ElDialog, ElIcon, ElButton } from 'element-plus';
+import { defineComponent, useModel, ref, openBlock, createBlock, unref, mergeProps, withCtx, createElementVNode, createVNode, normalizeClass, toDisplayString, createElementBlock, createTextVNode, createCommentVNode, withModifiers, mergeModels } from 'vue';
+import { ElDialog, ElIcon } from 'element-plus';
 import { Warning, CircleClose } from '@element-plus/icons-vue';
+import { AppButton } from '../appButton/index.mjs';
 import { useLocale } from '../../hooks/useLocale.mjs';
 
-import "./style/appConfirmDialog.scss";
-
 const __default__ = defineComponent({
   name: "AppConfirmDialog"
 });
 const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
-  props: {
+  props: /* @__PURE__ */ mergeModels({
     width: {
       type: [String, Number],
       default: 500
@@ -28,15 +27,15 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     },
     showClose: {
       type: Boolean,
-      default: true
+      default: false
     },
     showCancel: {
       type: Boolean,
       default: true
     },
-    cancelClass: {
+    cancelType: {
       type: String,
-      default: "button_default"
+      default: "default"
     },
     cancelText: {
       type: String
@@ -45,40 +44,78 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       type: Boolean,
       default: true
     },
-    submitClass: {
+    submitType: {
       type: String,
-      default: "button_delete"
+      default: "primary"
     },
     submitText: {
       type: String
     },
-    textAlign: {
+    iconColor: {
       type: String,
-      default: "center"
-    },
-    onCancel: {
-      type: Function
+      default: "rgb(var(--hy-main))"
     },
-    onSubmit: {
-      type: Function
-    }
-  },
-  emits: ["on-submit", "on-close"],
+    onClose: Function,
+    onCancel: Function,
+    onSubmit: Function
+  }, {
+    "modelValue": { type: Boolean, default: false },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ mergeModels(["hide"], ["update:modelValue"]),
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
+    const emits = __emit;
     const { t } = useLocale();
-    const visible = ref(false);
+    const visible = useModel(__props, "modelValue");
+    const loading = ref(false);
     async function onSubmitHandler() {
+      if (loading.value) return;
+      loading.value = true;
       if (props.onSubmit) {
-        await props.onSubmit();
+        try {
+          await props.onSubmit();
+        } catch (err) {
+          console.error(err);
+          loading.value = false;
+          return;
+        }
       }
       visible.value = false;
+      loading.value = false;
+      emits("hide");
     }
-    async function onCloseHandler() {
+    async function onCancelHandler() {
+      if (loading.value) return;
+      loading.value = true;
       if (props.onCancel) {
-        await props.onCancel();
+        try {
+          await props.onCancel();
+        } catch (err) {
+          console.error(err);
+          loading.value = false;
+          return;
+        }
       }
       visible.value = false;
+      loading.value = false;
+      emits("hide");
+    }
+    async function onCloseHandler() {
+      if (loading.value) return;
+      loading.value = true;
+      if (props.onClose) {
+        try {
+          await props.onClose();
+        } catch (err) {
+          console.error(err);
+          loading.value = false;
+          return;
+        }
+      }
+      visible.value = false;
+      loading.value = false;
+      emits("hide");
     }
     __expose({
       show: () => {
@@ -97,11 +134,14 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         "close-on-click-modal": false,
         "close-on-press-escape": false,
         "show-close": false,
-        top: "15%",
-        class: "app-confirm-dialog"
+        top: "15%"
       }, _ctx.$attrs), {
         header: withCtx(() => [
-          createElementVNode("div", { class: "h-[38px] flex items-center justify-between border-b border-border pl-4 pr-[10px]" }, [
+          createElementVNode("div", {
+            class: "h-[38px] flex items-center justify-between border-b border-border pl-4 pr-[10px]",
+            onClick: withModifiers(() => {
+            }, ["stop"])
+          }, [
             createElementVNode(
               "span",
               { class: "text-sm text-main font-bold" },
@@ -109,60 +149,66 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
               1
               /* TEXT */
             ),
-            __props.showClose ? (openBlock(), createElementBlock("div", {
-              key: 0,
-              class: "flex items-center clickBox",
-              onClick: onCloseHandler
-            }, [
-              createVNode(unref(ElIcon), {
-                size: "18",
-                color: "var(--danger)"
-              }, {
-                default: withCtx(() => [
-                  createVNode(unref(CircleClose))
-                ]),
-                _: 1
-                /* STABLE */
-              })
-            ])) : createCommentVNode("v-if", true)
-          ])
+            __props.showClose ? (openBlock(), createElementBlock(
+              "div",
+              {
+                key: 0,
+                class: normalizeClass(["flex items-center clickBox", { "cursor-not-allowed": loading.value }]),
+                onClick: onCloseHandler
+              },
+              [
+                createVNode(unref(ElIcon), {
+                  size: "18",
+                  color: "rgb(var(--hy-danger-2))"
+                }, {
+                  default: withCtx(() => [
+                    createVNode(unref(CircleClose))
+                  ]),
+                  _: 1
+                  /* STABLE */
+                })
+              ],
+              2
+              /* CLASS */
+            )) : createCommentVNode("v-if", true)
+          ], 8, ["onClick"])
         ]),
         default: withCtx(() => [
-          createElementVNode("div", { class: "h-[253px] flex flex-col items-center justify-between pt-[37px] pb-[27px]" }, [
+          createElementVNode("div", { class: "flex flex-col items-center justify-between pt-[37px] pb-[27px]" }, [
             createElementVNode("div", { class: "flex flex-col items-center text-main" }, [
               createVNode(unref(ElIcon), {
                 size: "40",
-                color: "var(--main)"
+                color: __props.iconColor
               }, {
                 default: withCtx(() => [
                   createVNode(unref(Warning))
                 ]),
                 _: 1
                 /* STABLE */
-              }),
+              }, 8, ["color"]),
               createElementVNode(
                 "div",
                 {
-                  class: normalizeClass(["text-base font-bold mt-[10px] mb-[26px]", __props.titleClass])
+                  class: normalizeClass(["text-base text-center font-bold mt-[10px] mb-[26px]", __props.titleClass])
                 },
                 toDisplayString(__props.title),
                 3
                 /* TEXT, CLASS */
               ),
               createElementVNode("div", {
-                class: "max-w-[240px] text-smword-break",
+                class: "max-w-[300px] text-smword-break text-center break-all",
                 innerHTML: __props.content
               }, null, 8, ["innerHTML"])
             ]),
             __props.showSubmit || __props.showCancel ? (openBlock(), createElementBlock("div", {
               key: 0,
-              class: "flex gap-4 mt-3"
+              class: "pt-[32px]"
             }, [
-              __props.showCancel ? (openBlock(), createBlock(unref(ElButton), {
+              __props.showCancel ? (openBlock(), createBlock(unref(AppButton), {
                 key: 0,
-                class: normalizeClass([__props.cancelClass, "buttonBox"]),
-                type: "primary",
-                onClick: onCloseHandler
+                type: __props.cancelType,
+                disabled: loading.value,
+                onClick: onCancelHandler
               }, {
                 default: withCtx(() => [
                   createTextVNode(
@@ -173,11 +219,11 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
                 ]),
                 _: 1
                 /* STABLE */
-              }, 8, ["class"])) : createCommentVNode("v-if", true),
-              __props.showSubmit ? (openBlock(), createBlock(unref(ElButton), {
+              }, 8, ["type", "disabled"])) : createCommentVNode("v-if", true),
+              __props.showSubmit ? (openBlock(), createBlock(unref(AppButton), {
                 key: 1,
-                class: normalizeClass([__props.submitClass, "buttonBox mx-2"]),
-                type: "primary",
+                type: __props.submitType,
+                disabled: loading.value,
                 onClick: onSubmitHandler
               }, {
                 default: withCtx(() => [
@@ -189,7 +235,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
                 ]),
                 _: 1
                 /* STABLE */
-              }, 8, ["class"])) : createCommentVNode("v-if", true)
+              }, 8, ["type", "disabled"])) : createCommentVNode("v-if", true)
             ])) : createCommentVNode("v-if", true)
           ])
         ]),
@@ -201,4 +247,3 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
 });
 
 export { _sfc_main as default };
-//# sourceMappingURL=appConfirmDialog.vue.mjs.map