hy-dispatch-ui-v3 0.2.67 → 0.2.68

package/lib/components/hyButton/style/button.scss

@@ -37,7 +37,7 @@
     background: rgba(94, 157, 180, 0.32);
     border: 1px solid rgba(94, 157, 180, 1);
     box-shadow: 0px 0px 0px 2px rgba(94, 157, 180, 0.5);
-  
+
     .hy-button__border {
       background: linear-gradient(
         90deg,
@@ -46,27 +46,22 @@
         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%
-      );
+      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),
@@ -74,7 +69,7 @@
         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(
@@ -84,7 +79,7 @@
         rgba(94, 157, 180, 0.18) 100%
       );
     }
-  
+
     &:disabled .hy-button__inner,
     &.is-disabled .hy-button__inner {
       background: #3e5a64;
@@ -92,18 +87,18 @@
         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);
     }
   }
-  
+
   &.hy-button_function {
     background: rgba(45, 242, 255, 0.32);
     border: 1px solid rgba(45, 242, 255, 1);
     box-shadow: 0px 0px 0px 2px rgba(45, 242, 255, 0.5);
-  
+
     .hy-button__border {
       background: linear-gradient(
         90deg,
@@ -112,27 +107,22 @@
         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%
-      );
+      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),
@@ -140,7 +130,7 @@
         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(
@@ -150,7 +140,7 @@
         rgba(45, 242, 255, 0.18) 100%
       );
     }
-  
+
     &:disabled .hy-button__inner,
     &.is-disabled .hy-button__inner {
       background: #10575c;
@@ -158,18 +148,18 @@
         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);
     }
   }
-  
+
   &.hy-button_addTo {
     background: rgba(44, 232, 152, 0.32);
     border: 1px solid rgba(44, 232, 152, 1);
     box-shadow: 0px 0px 0px 2px rgba(44, 232, 152, 0.5);
-  
+
     .hy-button__border {
       background: linear-gradient(
         90deg,
@@ -178,27 +168,22 @@
         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%
-      );
+      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),
@@ -206,7 +191,7 @@
         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(
@@ -216,7 +201,7 @@
         rgba(171, 255, 185, 0.18) 100%
       );
     }
-  
+
     &:disabled .hy-button__inner,
     &.is-disabled .hy-button__inner {
       background: #1d3d2d;
@@ -224,18 +209,18 @@
         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);
     }
   }
-  
+
   &.hy-button_delete {
     background: rgba(255, 77, 77, 0.32);
     border: 1px solid rgba(255, 77, 77, 1);
     box-shadow: 0px 0px 0px 2px rgba(255, 77, 77, 0.5);
-  
+
     .hy-button__border {
       background: linear-gradient(
         90deg,
@@ -244,27 +229,22 @@
         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%
-      );
+      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),
@@ -272,7 +252,7 @@
         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(
@@ -282,7 +262,7 @@
         rgba(255, 77, 77, 0.18) 100%
       );
     }
-  
+
     &:disabled .hy-button__inner,
     &.is-disabled .hy-button__inner {
       background: #4b0c0c;
@@ -290,7 +270,7 @@
         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);
@@ -301,7 +281,7 @@
     background: rgba(45, 255, 211, 0.32);
     border: 1px solid rgba(45, 255, 211, 1);
     box-shadow: 0px 0px 0px 2px rgba(45, 255, 211, 0.5);
-  
+
     .hy-button__border {
       background: linear-gradient(
         90deg,
@@ -310,27 +290,22 @@
         rgba(45, 255, 211, 0.4) 100%
       );
     }
-  
+
     .hy-button__inner {
       background: #002932;
       box-shadow:
         inset 0 0 5px 1px rgba(45, 255, 211, 0.5),
         inset 0 0 2px 0 rgba(45, 255, 211, 0.5);
     }
-  
+
     .hy-button__text {
       color: #fff;
     }
-  
+
     .hy-button__mask {
-      background: radial-gradient(
-        ellipse at center bottom,
-        #2DFFD3 0%,
-        #189177 30%,
-        transparent 60%
-      );
+      background: radial-gradient(ellipse at center bottom, #2dffd3 0%, #189177 30%, transparent 60%);
     }
-  
+
     &:hover .hy-button__inner {
       box-shadow:
         inset 0 0 5px 1px rgba(45, 255, 211, 0.5),
@@ -338,7 +313,7 @@
         inset 0 0 5px 1px rgba(45, 255, 211, 0.5),
         inset 0 0 2px 0 rgba(45, 255, 211, 0.5);
     }
-  
+
     &:disabled .hy-button__border,
     &.is-disabled .hy-button__border {
       background: linear-gradient(
@@ -348,7 +323,7 @@
         rgba(45, 255, 211, 0.18) 100%
       );
     }
-  
+
     &:disabled .hy-button__inner,
     &.is-disabled .hy-button__inner {
       background: #4b0c0c;
@@ -356,7 +331,7 @@
         inset 0 0 4px 1px rgba(45, 255, 211, 0.2),
         inset 0 0 2px 0 rgba(24, 145, 119, 0.16);
     }
-  
+
     &:disabled .hy-button__text,
     &.is-disabled .hy-button__text {
       color: rgba(255, 255, 255, 0.68);
@@ -364,7 +339,6 @@
   }
 }
 
-
 .hy-button-text {
   --hy-button-text-color: rgba(var(--hy-auxiliary));
   --hy-button-font-size: 14px;

package/lib/components/hyCheckboxGroup/checkboxGroup.vue.js

@@ -0,0 +1,123 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+require('../../utils/index.js');
+var is = require('../../utils/is.js');
+
+import "./style/checkboxGroup.scss";
+
+const __default__ = vue.defineComponent({
+  name: "HycheckboxGroup"
+});
+const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
+  props: /* @__PURE__ */ vue.mergeModels({
+    options: {
+      type: Array,
+      default: () => []
+    },
+    props: {
+      type: Object,
+      default: () => ({})
+    },
+    size: {
+      type: String,
+      default: "default"
+    },
+    columnNum: {
+      type: Number,
+      default: 4
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    }
+  }, {
+    "modelValue": { type: Array, default: [] },
+    "modelModifiers": {}
+  }),
+  emits: /* @__PURE__ */ vue.mergeModels(["change"], ["update:modelValue"]),
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const emits = __emit;
+    const modelValue = vue.useModel(__props, "modelValue");
+    const checkboxProps = vue.computed(() => {
+      return {
+        value: "value",
+        label: "label",
+        disabled: "disabled",
+        ...props.props || {}
+      };
+    });
+    const selectedMap = vue.ref({});
+    async function onSelectedHandler(item) {
+      if (item[checkboxProps.value.disabled] || props.disabled) return;
+      const value = item[checkboxProps.value.value];
+      let list = is.isArray(modelValue.value) ? [...modelValue.value] : [];
+      if (selectedMap.value[value]) {
+        list = list.filter((v) => v !== value);
+      } else {
+        list.push(value);
+      }
+      modelValue.value = [...list];
+      emits("change", list);
+    }
+    vue.watch(
+      () => modelValue.value,
+      (list) => {
+        selectedMap.value = (list || []).reduce((obj, value) => {
+          obj[value] = true;
+          return obj;
+        }, {});
+      },
+      { deep: true, immediate: true }
+    );
+    __expose({});
+    return (_ctx, _cache) => {
+      return vue.openBlock(), vue.createElementBlock(
+        "div",
+        {
+          class: "hy-checkbox-group",
+          style: vue.normalizeStyle({ "grid-template-columns": `repeat(${__props.columnNum}, minmax(0, 1fr))` })
+        },
+        [
+          (vue.openBlock(true), vue.createElementBlock(
+            vue.Fragment,
+            null,
+            vue.renderList(__props.options, (item, index) => {
+              return vue.openBlock(), vue.createElementBlock("div", {
+                key: index,
+                class: vue.normalizeClass(["hy-checkbox-item", [
+                  __props.size === "large" ? "hy-checkbox-item-large" : __props.size === "small" ? "hy-checkbox-item-small" : "hy-checkbox-item-default",
+                  {
+                    "is-selected": selectedMap.value[item[checkboxProps.value.value]],
+                    "opacity-90 !cursor-not-allowed": item[checkboxProps.value.disabled] || __props.disabled
+                  }
+                ]]),
+                onClick: ($event) => onSelectedHandler(item)
+              }, [
+                vue.renderSlot(_ctx.$slots, "default", {
+                  item,
+                  index
+                }, () => [
+                  vue.createTextVNode(
+                    vue.toDisplayString(item[checkboxProps.value.label]),
+                    1
+                    /* TEXT */
+                  )
+                ])
+              ], 10, ["onClick"]);
+            }),
+            128
+            /* KEYED_FRAGMENT */
+          ))
+        ],
+        4
+        /* STYLE */
+      );
+    };
+  }
+});
+
+exports.default = _sfc_main;

package/lib/components/hyCheckboxGroup/index.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var checkboxGroup = require('./checkboxGroup.vue.js');
+require('../../utils/index.js');
+var handler = require('../../utils/handler.js');
+
+const HyCheckboxGroup = handler.withInstall(checkboxGroup.default);
+
+exports.HyCheckboxGroup = HyCheckboxGroup;
+exports.default = HyCheckboxGroup;

package/lib/components/hyCheckboxGroup/style/checkboxGroup.scss

@@ -0,0 +1,58 @@
+.hy-checkbox-group {
+  width: 100%;
+  display: grid;
+  flex-wrap: wrap;
+  row-gap: 4px;
+  column-gap: 4px;
+  font-size: 12px;
+  line-height: 1;
+  border: 1px solid rgba(var(--hy-border));
+  border-radius: 4px;
+  padding: 3px;
+  box-sizing: border-box;
+  .hy-checkbox-item {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: rgba(var(--hy-auxiliary));
+    border: 1px solid transparent;
+    border-radius: 2px;
+    background-color: rgba(var(--hy-background-2));
+    box-sizing: border-box;
+    position: relative;
+    cursor: pointer;
+    user-select: none;
+    overflow: hidden;
+
+    &.hy-checkbox-item-large {
+      height: 40px;
+      font-size: 14px;
+    }
+    &.hy-checkbox-item-small {
+      height: 24px;
+      font-size: 12px;
+    }
+    &.hy-checkbox-item-default {
+      height: 28px;
+      font-size: 12px;
+    }
+    &.is-selected {
+      font-weight: bold;
+      color: rgba(var(--hy-theme));
+      border: 1px solid rgba(var(--hy-theme));
+      &::before {
+        content: '';
+        display: block;
+        position: absolute;
+        top: 0;
+        right: 0;
+        width: 0;
+        height: 0;
+        border-top: 6px solid rgba(var(--hy-theme));
+        border-left: 6px solid transparent;
+        border-bottom: 6px solid transparent;
+        text-align: center;
+      }
+    }
+  }
+}

package/lib/components/hyConfigProvider/configProvider.vue.js

@@ -4,53 +4,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
 var elementPlus = require('element-plus');
-var ElementLocale = require('element-plus/es/locales.mjs');
+var zh_CN = require('element-plus/es/locale/lang/zh-cn');
+var en_US = require('element-plus/es/locale/lang/en');
 require('../../hooks/index.js');
 var useGlobalConfig = require('../../hooks/useGlobalConfig.js');
-
-function _interopNamespaceDefault(e) {
-  var n = Object.create(null);
-  if (e) {
-    Object.keys(e).forEach(function (k) {
-      if (k !== 'default') {
-        var d = Object.getOwnPropertyDescriptor(e, k);
-        Object.defineProperty(n, k, d.get ? d : {
-          enumerable: true,
-          get: function () { return e[k]; }
-        });
-      }
-    });
-  }
-  n.default = e;
-  return Object.freeze(n);
-}
-
-var ElementLocale__namespace = /*#__PURE__*/_interopNamespaceDefault(ElementLocale);
+var useLocale = require('../../hooks/useLocale.js');
 
 const __default__ = vue.defineComponent({
   name: "HyConfigProvider"
 });
 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()
-    },
-    permissionMap: {
-      type: Map,
-      required: false,
-      default: () => /* @__PURE__ */ new Map()
-    },
     size: {
       type: String,
       required: false,
@@ -88,22 +52,45 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       type: Object,
       required: false
     },
-    audioPlayer: {
-      type: Object,
-      required: false
-    },
-    videoPlayer: {
+    /**
+     * @param {
+     *    locale: 'zh_CN' | 'en_US'
+     *    api: object | function
+     *    userAvatarMap: Map<string, string>,
+     *    permissionMap: Map<string, boolean>,
+     *    audioPlayer: {
+            type: 'default' | 'analyse',
+            speed: 0.5 | 1.0 | 1.5 | 2.0 | 3.0,
+            playRules: 1 | 2 | 3,
+            showPlayRules: boolean,
+            showPicture: boolean,
+            showDownloadFiles: boolean,
+            downloadFn: () => void,
+          }
+     *    videoPlayer: {
+            type: 'default' | 'analyse',
+            speed: 0.5 | 1.0 | 1.5 | 2.0 | 3.0,
+            playRules: 1 | 2 | 3,
+            showPlayRules: boolean,
+            showDownloadFiles: boolean,
+            showShrink: boolean,
+            vlcProtocol: 'hyvlc',
+            vlcAddress: string,
+            downloadFn: () => void,
+          }
+     *    ensureHyIcon: (icon: string) => void
+     *    tooltip: {
+            isAlways: boolean,
+            overLine: number,
+          }
+     *    mapConfig: object
+     *    baseMainStore: function
+     *    currentBus: object
+     * } hyConfig
+     */
+    hyConfig: {
       type: Object,
-      required: false
-    },
-    ensureHyIcon: Function,
-    tooltip: {
-      type: Object,
-      required: false
-    },
-    mapConfig: {
-      type: Object,
-      required: false
+      default: () => ({})
     }
   },
   setup(__props) {
@@ -111,7 +98,6 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     const globalConfig = useGlobalConfig.provideGlobalConfig(props, null, !vue.unref(useGlobalConfig.useGlobalConfig()));
     const config = vue.computed(() => {
       const {
-        locale,
         size,
         zIndex,
         button,
@@ -123,8 +109,9 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         valueOnClear,
         table
       } = globalConfig.value;
+      const locale = globalConfig.value.locale || globalConfig.value.hyConfig && globalConfig.value.hyConfig.locale || "zh_CN";
       return {
-        locale: ElementLocale__namespace[locale] || ElementLocale__namespace["zhCn"],
+        locale: locale === "en_US" ? en_US : zh_CN,
         size,
         zIndex,
         button,
@@ -137,6 +124,13 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         table
       };
     });
+    vue.watch(
+      () => props.hyConfig.locale,
+      (lang) => {
+        useLocale.setLang(lang);
+      },
+      { immediate: true }
+    );
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createBlock(
         vue.unref(elementPlus.ElConfigProvider),