hy-dispatch-ui-v3 0.2.66 → 0.2.68

package/lib/components/hyTableForm/style/batchTableForm.scss

@@ -7,7 +7,6 @@
     height: 340px;
     position: relative;
     border-radius: 8px;
-    border: 1px dashed rgba(var(--hy-auxiliary));
     box-sizing: border-box;
     &:hover {
       border-color: rgba(var(--hy-theme));
@@ -29,34 +28,22 @@
         height: 200%;
         /* 绘制网格线：使用青色，透明度调低，让它融合在 #14273a 背景里 */
         background-image:
-          /* 纵向线 */ linear-gradient(
-                90deg,
-                rgba(0, 229, 255, 0.1) 1px,
-                transparent 1px
-        ),
-          /* 横向线 */
-        linear-gradient(rgba(0, 229, 255, 0.1) 1px, transparent 1px);
-  
+          /* 纵向线 */
+          linear-gradient(90deg, rgba(0, 229, 255, 0.1) 1px, transparent 1px),
+          /* 横向线 */ linear-gradient(rgba(0, 229, 255, 0.1) 1px, transparent 1px);
+
         /* 网格尺寸 40px */
         background-size: 40px 40px;
-  
+
         /* 3D 倒伏效果 */
         transform: rotateX(60deg);
-  
+
         /* 动效：无限流动 */
         animation: grid-flow 20s linear infinite;
-  
+
         /* 遮罩：四周渐隐，让网格不那么生硬 */
-        mask-image: radial-gradient(
-                circle at 50% 50%,
-                black 10%,
-                transparent 80%
-        );
-        -webkit-mask-image: radial-gradient(
-                circle at 50% 50%,
-                black 10%,
-                transparent 80%
-        );
+        mask-image: radial-gradient(circle at 50% 50%, black 10%, transparent 80%);
+        -webkit-mask-image: radial-gradient(circle at 50% 50%, black 10%, transparent 80%);
       }
       &::after {
         display: block;
@@ -66,14 +53,10 @@
         left: 0;
         width: 100%;
         height: 100%;
-        background: radial-gradient(
-                circle at 50% 50%,
-                rgba(0, 229, 255, 0.05) 0%,
-                transparent 70%
-        );
+        background: radial-gradient(circle at 50% 50%, rgba(0, 229, 255, 0.05) 0%, transparent 70%);
       }
     }
-  
+
     .hy-el-upload {
       width: 100%;
       height: 100%;
@@ -84,17 +67,21 @@
         flex-direction: column;
         align-items: center;
         justify-content: center;
-        border: none;
+        border: 1px dashed rgba(var(--hy-auxiliary));
         &:hover {
-          border-color: var(--theme);
           .type-icon-box {
             transform: translateY(-10px);
           }
         }
+        &.is-dragover {
+          border: 1px solid rgba(var(--hy-theme)) !important;
+          box-shadow: 0px 0px 6px 0px rgba(var(--hy-theme));
+          background-color: var(--hy-el-fill-color-blank) !important;
+        }
       }
     }
   }
-  
+
   .hy-batch-table-form-step-box {
     width: 100%;
     height: 260px;
@@ -103,6 +90,7 @@
     padding-top: 24px;
     border-radius: 8px;
     background-color: rgba(var(--hy-background-2), 0.5);
+    box-sizing: border-box;
     .hy-el-step {
       .hy-el-step__description {
         padding-left: 0px !important;
@@ -122,6 +110,7 @@
     border: 1px dashed rgba(var(--hy-auxiliary), 0.5);
     border-radius: 4px;
     background: rgba(var(--hy-background-2), 0.5);
+    box-sizing: border-box;
   }
 
   .hy-batch-table-form-upload-bg {
@@ -141,13 +130,9 @@
       height: 200%;
       /* 绘制网格线：使用青色，透明度调低，让它融合在 #14273a 背景里 */
       background-image:
-        /* 纵向线 */ linear-gradient(
-              90deg,
-              rgba(0, 229, 255, 0.1) 1px,
-              transparent 1px
-      ),
-        /* 横向线 */
-      linear-gradient(rgba(0, 229, 255, 0.1) 1px, transparent 1px);
+        /* 纵向线 */
+        linear-gradient(90deg, rgba(0, 229, 255, 0.1) 1px, transparent 1px),
+        /* 横向线 */ linear-gradient(rgba(0, 229, 255, 0.1) 1px, transparent 1px);
 
       /* 网格尺寸 40px */
       background-size: 40px 40px;
@@ -159,16 +144,8 @@
       animation: grid-flow 20s linear infinite;
 
       /* 遮罩：四周渐隐，让网格不那么生硬 */
-      mask-image: radial-gradient(
-              circle at 50% 50%,
-              black 10%,
-              transparent 80%
-      );
-      -webkit-mask-image: radial-gradient(
-              circle at 50% 50%,
-              black 10%,
-              transparent 80%
-      );
+      mask-image: radial-gradient(circle at 50% 50%, black 10%, transparent 80%);
+      -webkit-mask-image: radial-gradient(circle at 50% 50%, black 10%, transparent 80%);
     }
     &::after {
       display: block;
@@ -178,12 +155,7 @@
       left: 0;
       width: 100%;
       height: 100%;
-      background: radial-gradient(
-              circle at 50% 50%,
-              rgba(0, 229, 255, 0.05) 0%,
-              transparent 70%
-      );
+      background: radial-gradient(circle at 50% 50%, rgba(0, 229, 255, 0.05) 0%, transparent 70%);
     }
   }
 }
-

package/lib/components/hyTableForm/style/tableForm.scss

@@ -19,6 +19,7 @@
     border-radius: 4px;
     padding: 2px;
     font-size: 0.75rem;
+    box-sizing: border-box;
     .hy-table-form-tab-button {
       display: flex;
       align-items: center;
@@ -28,15 +29,15 @@
       border-radius: 2px;
       cursor: pointer;
       transition: all 0.3s linear;
+      box-sizing: border-box;
       &:hover {
         color: rgba(var(--hy-main));
       }
       &.is-select {
         color: rgba(var(--hy-main));
-        background: linear-gradient(180deg, rgba(var(--hy-theme)) 0%, #2A4968 100%);
+        background: linear-gradient(180deg, rgba(var(--hy-theme)) 0%, #2a4968 100%);
         border-image: linear-gradient(180deg, rgba(var(--hy-theme)) 80%, rgba(var(--hy-auxiliary))) 1 1;
       }
     }
   }
 }
-

package/lib/components/hyTableForm/tableForm.vue.js

@@ -5,8 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
 require('../index.js');
 require('../../utils/index.js');
+require('../../hooks/index.js');
 var index = require('./js/index.js');
 var useAppTable = require('../hyTable/js/useAppTable.js');
+var useResizeObserver = require('../../hooks/useResizeObserver.js');
 var useAppForm = require('../hyForm/js/useAppForm.js');
 var is = require('../../utils/is.js');
 var handler = require('../../utils/handler.js');
@@ -75,16 +77,8 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    vue.onMounted(() => {
-      vue.watch(
-        () => dataSource.value,
-        () => {
-          emits("tableDataChange", dataSource.value);
-        },
-        { deep: true, immediate: true }
-      );
-    });
     const tableRef = vue.useTemplateRef("tableRef");
+    const formContainerRef = vue.useTemplateRef("formContainerRef");
     const formRef = vue.useTemplateRef("formRef");
     const dataSource = vue.ref([]);
     const tabList = vue.ref([
@@ -110,7 +104,11 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         }
       ]
     });
-    const isExpandValidate = vue.ref(false);
+    const statistics = vue.ref({
+      success: 0,
+      failed: 0,
+      total: dataSource.value.length
+    });
     const tableFormColumns = vue.computed(() => {
       if (!props.tableColumns) return [];
       return [...props.tableColumns, ...operatorColumn.value];
@@ -118,25 +116,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
     const expandColumn = vue.computed(() => {
       return props.tableColumns.find((item) => item.type === "expand");
     });
-    const statistics = vue.computed(() => {
-      return dataSource.value.reduce(
-        ({ success, failed, total }, data) => {
-          if (!data.errorMsg) {
-            success++;
-          } else {
-            failed++;
-          }
-          return { success, failed, total };
-        },
-        { success: 0, failed: 0, total: dataSource.value.length }
-      );
-    });
     function setData(dataSource2) {
       if (!tableRef.value) return;
       tableRef.value.setData(dataSource2);
     }
     function rowClassName({ row, rowIndex }) {
-      if (row.errorMsg) {
+      if (row.errorMsg && row.errorMsg.message) {
         return "hy-el-table-v2__row-error";
       }
     }
@@ -147,21 +132,40 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         setData(dataSource.value);
       } else {
         const data = dataSource.value.filter((data2) => {
-          return !!data2.errorMsg;
+          return data2.errorMsg && data2.errorMsg.message;
         });
         setData(data);
       }
     }
-    async function onExpandRowChange(row) {
+    let formClientHeight, removeResize, tableScrollTop, expanding;
+    async function onExpandRowChange2(row, isExpanded) {
       if (props.onExpandRowChange) {
         props.onExpandRowChange(row);
       }
       await vue.nextTick();
-      if (!formRef.value) return;
+      if (!formRef.value || !isExpanded) {
+        removeResize && removeResize();
+        return;
+      }
+      const instance = useResizeObserver.useResizeObserver(formContainerRef.value, async () => {
+        if (!formContainerRef.value) return;
+        const [key] = tableRef.value.getRowExpansion();
+        if (formClientHeight === formContainerRef.value.clientHeight) return;
+        if (!key) return;
+        removeResize && removeResize();
+        expanding = true;
+        tableRef.value.toggleRowExpansion(key, false);
+        await vue.nextTick();
+        tableRef.value.toggleRowExpansion(key, true);
+        await new Promise((resolve) => setTimeout(resolve, 1));
+        tableRef.value.scrollToTop(tableScrollTop);
+        expanding = false;
+      });
+      formClientHeight = formContainerRef.value.clientHeight;
+      removeResize = instance.removeResize;
       const valid = await initValidateHandler([row]);
       if (valid) return;
-      formRef.value.validate();
-      isExpandValidate.value = true;
+      triggerValidate();
     }
     function onDeleteRowHandler(params) {
       const { $index } = params;
@@ -185,6 +189,14 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         ...statistics.value
       });
     }
+    function onScrollHandler(params) {
+      if (expanding) return;
+      tableScrollTop = params.scrollTop;
+    }
+    const validateTriggerId = vue.ref(0);
+    function triggerValidate() {
+      validateTriggerId.value++;
+    }
     async function initValidateHandler(dataSource2) {
       let promiseList = [];
       for (const data of dataSource2) {
@@ -192,7 +204,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
           new Promise(async (resolve, reject) => {
             try {
               await index.doValidate(data, props.formColumns, props.rules);
-              data.errorMsg = data.errorMsg && !data.errorMsg.prop ? data.errorMsg : null;
+              if (!data.errorMsg) {
+                data.errorMsg = { prop: "", message: "" };
+              } else if (!data.errorMsg.prop) {
+                data.errorMsg.prop = data.errorMsg.prop;
+                data.errorMsg.message = data.errorMsg.message;
+              }
               data.errorMap = /* @__PURE__ */ new Map();
               resolve();
             } catch (error) {
@@ -202,8 +219,11 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
                   prop: item.field,
                   message: item.message || `${item.field} is required`
                 };
-                if (!data.errorMsg) {
+                if (data && !data.errorMsg) {
                   data.errorMsg = errData;
+                } else if (data && !data.errorMsg.prop && !data.errorMsg.message) {
+                  data.errorMsg.prop = errData.errorMsg.prop;
+                  data.errorMsg.message = errData.errorMsg.message;
                 }
                 errorMap.set(errData.prop, errData.message);
               });
@@ -223,7 +243,12 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       }
       try {
         await index.doValidate(row, props.formColumns, props.rules);
-        row.errorMsg = null;
+        if (!row.errorMsg) {
+          row.errorMsg = { prop: "", message: "" };
+        } else {
+          row.errorMsg.prop = "";
+          row.errorMsg.message = "";
+        }
         row.errorMap = /* @__PURE__ */ new Map();
       } catch (error) {
         let errMsg = null;
@@ -239,8 +264,14 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
           errorMap2.set(errData.prop, errData.message);
         });
         row.errorMap = errorMap2;
-        row.errorMsg = errMsg;
+        if (!row.errorMsg) {
+          row.errorMsg = { prop: "", message: "" };
+        } else {
+          row.errorMsg.prop = errMsg.prop;
+          row.errorMsg.message = errMsg.message;
+        }
       }
+      await vue.nextTick();
       const { onlyId, errorMsg, errorMap, children, ...data } = row;
       emits("validate", {
         row: data,
@@ -250,6 +281,30 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         ...statistics.value
       });
     }
+    vue.provide("validateTriggerId", validateTriggerId);
+    vue.onMounted(() => {
+      vue.watch(
+        () => dataSource.value,
+        () => {
+          emits("tableDataChange", dataSource.value);
+          const { success, failed } = dataSource.value.reduce(
+            ({ success: success2, failed: failed2 }, data) => {
+              if (data.errorMsg && data.errorMsg.message) {
+                failed2++;
+              } else {
+                success2++;
+              }
+              return { success: success2, failed: failed2 };
+            },
+            { success: 0, failed: 0 }
+          );
+          statistics.value.success = success;
+          statistics.value.failed = failed;
+          statistics.value.total = dataSource.value.length;
+        },
+        { deep: true, immediate: true }
+      );
+    });
     __expose({
       setData(data) {
         dataSource.value = handler.cloneDeep(data, true);
@@ -270,7 +325,6 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
           if (item.onlyId) set.add(item.onlyId);
           return set;
         }, /* @__PURE__ */ new Set());
-        console.log("keySet", Array.from(keySet.values()));
         if (!keySet.size) return;
         for (let i = 0; i < dataSource.value.length; i++) {
           const target = dataSource.value[i];
@@ -297,6 +351,26 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
           ...statistics.value,
           dataSource: dataSource.value
         };
+      },
+      async getOptions() {
+        if (formRef.value) {
+          await formRef.value.getOptions();
+        }
+      },
+      async getOptionsFields(keys) {
+        if (formRef.value) {
+          await formRef.value.getOptionsFields(keys);
+        }
+      },
+      async getOptionsError() {
+        if (formRef.value) {
+          await formRef.value.getOptionsError();
+        }
+      },
+      getOptionsByField(key) {
+        if (formRef.value) {
+          return formRef.value.getOptionsByField(key);
+        }
       }
     });
     return (_ctx, _cache) => {
@@ -395,19 +469,20 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
             showOperate: false,
             showPagination: false,
             expandMode: "accordion",
-            onExpandChange: onExpandRowChange
+            onExpandChange: onExpandRowChange2,
+            onScroll: onScrollHandler
           }), vue.createSlots({
             validateStatus: vue.withCtx(({ row }) => [
               vue.createElementVNode(
                 "div",
                 {
-                  class: vue.normalizeClass(["flex items-center gap-1.5", [row.errorMsg ? "text-danger-2" : "text-success"]])
+                  class: vue.normalizeClass(["flex items-center gap-1.5", [row.errorMsg && row.errorMsg.message ? "text-danger-2" : "text-success"]])
                 },
                 [
                   vue.createElementVNode(
                     "div",
                     {
-                      class: vue.normalizeClass(["w-1.5 h-1.5 rounded-full", [row.errorMsg ? "bg-danger-2" : "bg-success"]])
+                      class: vue.normalizeClass(["w-1.5 h-1.5 rounded-full", [row.errorMsg && row.errorMsg.message ? "bg-danger-2" : "bg-success"]])
                     },
                     null,
                     2
@@ -416,7 +491,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
                   vue.createElementVNode(
                     "div",
                     { class: "text-sm" },
-                    vue.toDisplayString(!row.errorMsg ? "\u51C6\u5907\u5C31\u7EEA" : row.errorMsg.prop ? "\u5185\u5BB9\u6709\u8BEF" : "\u6821\u9A8C\u5931\u8D25"),
+                    vue.toDisplayString(row.errorMsg && row.errorMsg.message ? row.errorMsg.prop ? "\u5185\u5BB9\u6709\u8BEF" : "\u6821\u9A8C\u5931\u8D25" : "\u51C6\u5907\u5C31\u7EEA"),
                     1
                     /* TEXT */
                   )
@@ -441,53 +516,68 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
               fn: vue.withCtx(({ row }) => [
                 vue.createElementVNode("div", { class: "w-full pl-[52px] pr-[62px] pb-2" }, [
                   vue.createElementVNode("div", { class: "h-[32px]" }, [
-                    vue.createElementVNode(
+                    vue.withDirectives(vue.createElementVNode(
                       "div",
                       {
-                        class: vue.normalizeClass(["flex items-center gap-1.5 text-danger-2 transition-all duration-300 overflow-hidden", [row.errorMsg ? "h-full" : "h-0"]])
+                        class: vue.normalizeClass(["flex items-center gap-1.5 text-danger-2 transition-all duration-300 overflow-hidden", [row.errorMsg && row.errorMsg.message ? "h-full" : "h-0"]])
                       },
                       [
-                        row.errorMsg ? (vue.openBlock(), vue.createBlock(vue.unref(index$3.HyIcon), {
-                          key: 0,
+                        vue.createVNode(vue.unref(index$3.HyIcon), {
                           "svg-name": "dispatch-share1-prompt",
                           class: "!w-3 !h-3"
-                        })) : vue.createCommentVNode("v-if", true),
+                        }),
                         vue.createElementVNode(
                           "span",
                           null,
-                          vue.toDisplayString(row.errorMsg ? row.errorMsg.message : ""),
+                          vue.toDisplayString(row.errorMsg && row.errorMsg.message ? row.errorMsg.message : ""),
                           1
                           /* TEXT */
                         )
                       ],
                       2
                       /* CLASS */
-                    )
+                    ), [
+                      [vue.vShow, row.errorMsg && row.errorMsg.message]
+                    ])
                   ]),
-                  vue.createVNode(vue.unref(index$4.HyForm), {
-                    ref_key: "formRef",
-                    ref: formRef,
-                    model: row,
-                    columns: __props.formColumns,
-                    rules: __props.rules,
-                    "show-message": false,
-                    class: "px-0",
-                    columnNum: __props.columnNum,
-                    size: __props.size,
-                    onValidate: (prop, isValid, message) => onValidateHandler(row, { prop, isValid, message })
-                  }, vue.createSlots({
-                    _: 2
-                    /* DYNAMIC */
-                  }, [
-                    vue.renderList(_ctx.$slots, (_, slotName) => {
-                      return {
-                        name: slotName,
-                        fn: vue.withCtx((scope) => [
-                          vue.renderSlot(_ctx.$slots, slotName, vue.normalizeProps(vue.guardReactiveProps(scope)))
-                        ])
-                      };
-                    })
-                  ]), 1032, ["model", "columns", "rules", "columnNum", "size", "onValidate"])
+                  vue.createElementVNode(
+                    "div",
+                    {
+                      ref_key: "formContainerRef",
+                      ref: formContainerRef,
+                      class: "w-full"
+                    },
+                    [
+                      vue.createVNode(vue.unref(index$4.HyForm), {
+                        ref_key: "formRef",
+                        ref: formRef,
+                        model: row,
+                        columns: __props.formColumns,
+                        rules: __props.rules,
+                        "show-message": false,
+                        class: "px-0",
+                        columnNum: __props.columnNum,
+                        size: __props.size,
+                        isTableForm: "",
+                        onValidate: (prop, isValid, message) => onValidateHandler(row, { prop, isValid, message }),
+                        onOptionsStatus: _ctx.$attrs.onOptionsStatus
+                      }, vue.createSlots({
+                        _: 2
+                        /* DYNAMIC */
+                      }, [
+                        vue.renderList(_ctx.$slots, (_, slotName) => {
+                          return {
+                            name: slotName,
+                            fn: vue.withCtx((scope) => [
+                              vue.renderSlot(_ctx.$slots, slotName, vue.normalizeProps(vue.guardReactiveProps(scope)))
+                            ])
+                          };
+                        })
+                      ]), 1032, ["model", "columns", "rules", "columnNum", "size", "onValidate", "onOptionsStatus"])
+                    ],
+                    512
+                    /* NEED_PATCH */
+                  )
                 ])
               ]),
               key: "0"

package/lib/components/hyTimePicker/timePicker.vue.js

@@ -45,7 +45,6 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
   setup(__props, { expose: __expose, emit: __emit }) {
     const props = __props;
     const emits = __emit;
-    const { t } = useLocale.useLocale();
     const appTimePicker = vue.useTemplateRef("appTimePicker");
     const timeValue = vue.useModel(__props, "modelValue");
     const startValue = vue.useModel(__props, "start");
@@ -54,13 +53,13 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
       if (props.startPlaceholder) {
         return props.startPlaceholder;
       }
-      return t("timePicker.startTime");
+      return useLocale.$t("timePicker.startTime");
     });
     const endPlaceholder = vue.computed(() => {
       if (props.endPlaceholder) {
         return props.endPlaceholder;
       }
-      return t("timePicker.endTime");
+      return useLocale.$t("timePicker.endTime");
     });
     const disabledSecondsHandler = vue.computed(() => {
       return (hour, minute, role, comparingDate) => {
@@ -149,7 +148,7 @@ const _sfc_main = /* @__PURE__ */ Object.assign(__default__, {
         valueFormat: timeFormHandler(__props.valueFormat),
         disabledSeconds: disabledSecondsHandler.value,
         "start-placeholder": startPlaceholder.value,
-        "range-separator": vue.unref(t)("timePicker.to"),
+        "range-separator": vue.unref(useLocale.$t)("timePicker.to"),
         "end-placeholder": endPlaceholder.value,
         onChange: onChangeHandler
       }), vue.createSlots({