@fox-js/foxui-pc 4.1.1-7 → 4.1.1-9

package/dist/index.umd.js

@@ -1,6 +1,6 @@
 
 /*!
- * @fox-js/foxui-desktop v4.0.0 Wed Nov 13 2024 22:02:56 GMT+0800 (中国标准时间)
+ * @fox-js/foxui-desktop v4.0.0 Mon Dec 02 2024 10:29:50 GMT+0800 (中国标准时间)
  */
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('@fox-js/validator'), require('element-plus'), require('@element-plus/icons-vue'), require('@fox-js/i18n')) :
@@ -7905,14 +7905,17 @@
      * 返回日期格式字符串
      * @param {Number} 0返回今天的日期、1返回明天的日期，2返回后天得日期，依次类推
      * @param {Date} 起点日期
+     * @param {formatTemplate} 格式化模版
      * @return {string} '2014-12-31'
+     *
      */
-    getDay(i, startDate) {
+    getDay(i, startDate, formatTemplate) {
       i = i || 0;
       let date = startDate ?? /* @__PURE__ */ new Date();
       const diff = i * (1e3 * 60 * 60 * 24);
       date = new Date(date.getTime() + diff);
-      return this.date2Str(date);
+      formatTemplate = formatTemplate ?? "YYYY-MM-DD";
+      return this.format(date, formatTemplate);
     },
     /**
      * 时间比较
@@ -11857,6 +11860,10 @@
     params: {
       type: [Object]
     },
+    // row class name
+    rowClassName: {
+      type: Function
+    },
     // cell class name
     cellClassName: {
       type: Function
@@ -12094,7 +12101,7 @@
       // setup
       setup(props, context) {
         const { locale } = i18n.useFoxI18n(scope);
-        const { emitEvent } = defineItem(
+        const { emitEvent, broadcast } = defineItem(
           {
             componentName,
             // 获取value
@@ -12365,6 +12372,7 @@
               expandedRows.splice(0, size, row);
             }
           }
+          setTimeout(setChildCellClassNames, 0);
         };
         const settingId = context.attrs.id ?? props.prop ?? context.attrs.name;
         const settingModel = useSettingModel();
@@ -12462,10 +12470,14 @@
           return cols;
         });
         const cellClassNames = vue.shallowRef(/* @__PURE__ */ new Map());
-        const defaultCellClassName = ({ column, rowIndex }) => {
-          const key = `${rowIndex}_${column.property}`;
-          const cellClassName = cellClassNames.value.get(key) ?? "";
-          return cellClassName;
+        const defaultCellClassName = ({ row, column, rowIndex, columnIndex }) => {
+          const rowIndexColumnPropkey = `${rowIndex}_${column.property}`;
+          const indexKey = `${rowIndex}_${columnIndex}`;
+          let cellClassName = cellClassNames.value.get(rowIndexColumnPropkey);
+          if (!cellClassName) {
+            cellClassName = cellClassNames.value.get(indexKey);
+          }
+          return cellClassName ?? "";
         };
         const getCellClassNameProperty = (clsName) => {
           if (typeof clsName === "function") {
@@ -12487,8 +12499,20 @@
           }
           return defaultCellClassName;
         };
-        const setCellClassName = (rowIndex, columnName, cellClassName) => {
-          const key = `${rowIndex}_${columnName}`;
+        const setChildCellClassNames = () => {
+          cellClassNames.value.entries().forEach(([key, value]) => {
+            const name = `${key}_item`;
+            broadcast.emitToChildren(
+              {
+                name
+              },
+              "setCustomClassName",
+              value
+            );
+          });
+        };
+        const setCellClassName = (rowIndex, column, cellClassName) => {
+          const key = `${rowIndex}_${column}`;
           if (cellClassName) {
             cellClassNames.value.set(key, cellClassName);
           } else {
@@ -12496,6 +12520,49 @@
           }
           vue.triggerRef(cellClassNames);
         };
+        const clearCellClassName = () => {
+          cellClassNames.value.clear();
+          vue.triggerRef(cellClassNames);
+        };
+        const rowClassNames = vue.shallowRef(/* @__PURE__ */ new Map());
+        const defaultRowClassName = ({ rowIndex }) => {
+          const key = `${rowIndex}`;
+          const rowClassName = cellClassNames.value.get(key) ?? "";
+          return rowClassName;
+        };
+        const getRowClassNameProperty = (clsName) => {
+          if (typeof clsName === "function") {
+            return (args) => {
+              const ret = [];
+              let s = defaultRowClassName(args);
+              if (s) {
+                ret.push(s);
+              }
+              s = clsName(args);
+              if (s) {
+                ret.push(s);
+              }
+              if (ret.length === 0) {
+                return "";
+              }
+              return ret.join(" ");
+            };
+          }
+          return defaultRowClassName;
+        };
+        const setRowClassName = (rowIndex, rowClassName) => {
+          const key = `${rowIndex}`;
+          if (rowClassName) {
+            rowClassNames.value.set(key, rowClassName);
+          } else {
+            rowClassNames.value.delete(key);
+          }
+          vue.triggerRef(rowClassNames);
+        };
+        const clearRowClassName = () => {
+          rowClassNames.value.clear();
+          vue.triggerRef(rowClassNames);
+        };
         const tableRef = vue.ref();
         useExpose({
           // 清空selection
@@ -12609,7 +12676,13 @@
           // 移除列属性配置
           removeColumnSetting,
           // 设置cell class name
-          setCellClassName
+          setCellClassName,
+          // 清空cell className
+          clearCellClassName,
+          // 设置row class name
+          setRowClassName,
+          // 清空row class name
+          clearRowClassName
         });
         return () => {
           const attrs = filterInheritAttr(context.attrs);
@@ -12621,7 +12694,8 @@
             data: source.value,
             ref: tableRef,
             class: classes.value,
-            [`cell-class-name`]: getCellClassNameProperty(props.cellClassName)
+            [`cell-class-name`]: getCellClassNameProperty(props.cellClassName),
+            [`row-class-name`]: getRowClassNameProperty(props.rowClassName)
           };
           const tableChildren = {};
           if (context.slots.default) {
@@ -14563,7 +14637,7 @@
     "fill-opacity": "0.9"
   }, null, -1), F = [
     A
-  ], G0 = /* @__PURE__ */ vue.defineComponent({
+  ], X6 = /* @__PURE__ */ vue.defineComponent({
     __name: "Uploader",
     props: {
       class: { type: String, default: "" },
@@ -14601,13 +14675,13 @@
         role: "presentation"
       }, F, 14, V));
     }
-  }), P3 = ["aria-labelledby"], D3 = /* @__PURE__ */ vue.createElementVNode("path", {
+  }), L3 = ["aria-labelledby"], B3 = /* @__PURE__ */ vue.createElementVNode("path", {
     d: "M834.7 920.1h-643c-23.7 0-43-19.2-43-43 0-23.7 19.2-43 43-43h643c23.7 0 43 19.2 43 43 0 23.7-19.3 43-43 43zm0-729.2h-643c-23.7 0-43-19.2-43-43 0-23.7 19.2-43 43-43h643c23.7 0 43 19.2 43 43s-19.3 43-43 43zm0 354.6h-643c-23.7 0-43-19.2-43-43 0-23.7 19.2-43 43-43h643c23.7 0 43 19.2 43 43 0 23.7-19.3 43-43 43z",
     fill: "currentColor",
     "fill-opacity": "0.9"
-  }, null, -1), H3 = [
-    D3
-  ], os = /* @__PURE__ */ vue.defineComponent({
+  }, null, -1), V3 = [
+    B3
+  ], ds = /* @__PURE__ */ vue.defineComponent({
     __name: "MoreH",
     props: {
       class: { type: String, default: "" },
@@ -14643,15 +14717,15 @@
         viewBox: "0 0 1024 1024",
         "aria-labelledby": c.name,
         role: "presentation"
-      }, H3, 14, P3));
+      }, V3, 14, L3));
     }
-  }), x4 = ["aria-labelledby"], z4 = /* @__PURE__ */ vue.createElementVNode("path", {
+  }), C4 = ["aria-labelledby"], v4 = /* @__PURE__ */ vue.createElementVNode("path", {
     d: "M784 902.4c9.6 19.2 6.4 41.6-12.8 54.4-19.2 9.6-41.6 3.2-51.2-12.8-9.6-19.2-6.4-41.6 12.8-54.4 16-12.8 38.4-8 51.2 12.8zM550.4 984c0 22.4-16 38.4-38.4 38.4s-38.4-16-38.4-38.4v-24c0-22.4 19.2-38.4 41.6-38.4 19.2 0 35.2 16 38.4 38.4v25.6h-3.2zm-240-43.2c-9.6 19.2-35.2 25.6-54.4 16-19.2-9.6-25.6-35.2-16-51.2l28.8-51.2c9.6-19.2 35.2-25.6 54.4-16s25.6 35.2 12.8 54.4l-25.6 48zM121.6 784c-19.2 9.6-41.6 3.2-54.4-16-9.6-19.2-6.4-41.6 12.8-54.4l76.8-44.8c19.2-9.6 41.6-3.2 54.4 16 9.6 19.2 3.2 41.6-16 54.4L121.6 784zM38.4 552C16 552 0 536 0 513.6s16-38.4 38.4-38.4H160c22.4 0 38.4 19.2 38.4 38.4 0 22.4-16 38.4-38.4 38.4H38.4zm44.8-241.6c-19.2-9.6-25.6-35.2-16-51.2 9.6-19.2 35.2-25.6 54.4-16L256 320c19.2 9.6 25.6 35.2 16 54.4s-35.2 25.6-54.4 16l-134.4-80zm160-185.6 92.8 160c9.6 19.2 35.2 25.6 54.4 12.8s25.6-35.2 12.8-54.4l-92.8-160C297.6 64 275.2 60.8 256 70.4c-16 12.8-22.4 33.6-12.8 54.4zM473.6 40c0-22.4 16-38.4 38.4-38.4s38.4 19.2 38.4 38.4v184c0 22.4-19.2 38.4-38.4 38.4-22.4 0-38.4-19.2-38.4-38.4V40zm240 43.2c9.6-19.2 35.2-25.6 54.4-16 19.2 9.6 25.6 35.2 16 51.2l-92.8 160c-9.6 19.2-35.2 25.6-54.4 16-19.2-9.6-25.6-35.2-12.8-54.4l89.6-156.8zm188.8 160-160 92.8c-19.2 9.6-25.6 35.2-16 54.4 12.8 19.2 35.2 25.6 54.4 12.8l160-92.8c19.2-9.6 25.6-35.2 12.8-54.4-9.6-16-32-25.6-51.2-12.8zM985.6 472c22.4 0 38.4 16 38.4 38.4s-16 38.4-38.4 38.4H800c-22.4 0-38.4-19.2-38.4-38.4 0-22.4 19.2-38.4 38.4-38.4h185.6z",
     fill: "currentColor",
     "fill-opacity": "0.9"
-  }, null, -1), N4 = [
-    z4
-  ], zs = /* @__PURE__ */ vue.defineComponent({
+  }, null, -1), $4 = [
+    v4
+  ], $s = /* @__PURE__ */ vue.defineComponent({
     __name: "Loading",
     props: {
       class: { type: String, default: "" },
@@ -14687,15 +14761,15 @@
         viewBox: "0 0 1024 1024",
         "aria-labelledby": c.name,
         role: "presentation"
-      }, N4, 14, x4));
+      }, $4, 14, C4));
     }
-  }), g6 = ["aria-labelledby"], f6 = /* @__PURE__ */ vue.createElementVNode("path", {
+  }), _0 = ["aria-labelledby"], w0 = /* @__PURE__ */ vue.createElementVNode("path", {
     d: "M981.577 1024c-11.703 0-23.406-2.926-32.183-11.703L13.166 76.07c-14.629-17.555-14.629-46.812 0-64.366 17.554-14.629 46.811-14.629 64.365 0L1013.76 947.93c17.554 17.555 17.554 43.886 0 61.44-8.777 11.703-20.48 14.629-32.183 14.629zm-936.228 0c-11.703 0-23.406-2.926-32.183-11.703-17.555-17.554-17.555-43.886 0-61.44L949.394 14.63c17.555-17.555 43.886-17.555 61.44 0 17.555 17.554 17.555 43.885 0 61.44L74.606 1012.297C68.754 1021.074 57.05 1024 45.349 1024z",
     fill: "currentColor",
     "fill-opacity": "0.9"
-  }, null, -1), y6 = [
-    f6
-  ], S7 = /* @__PURE__ */ vue.defineComponent({
+  }, null, -1), S0 = [
+    w0
+  ], N7 = /* @__PURE__ */ vue.defineComponent({
     __name: "Close",
     props: {
       class: { type: String, default: "" },
@@ -14731,15 +14805,15 @@
         viewBox: "0 0 1026 1024",
         "aria-labelledby": c.name,
         role: "presentation"
-      }, y6, 14, g6));
+      }, S0, 14, _0));
     }
-  }), P6 = ["aria-labelledby"], D6 = /* @__PURE__ */ vue.createElementVNode("path", {
+  }), L0 = ["aria-labelledby"], B0 = /* @__PURE__ */ vue.createElementVNode("path", {
     d: "M159.289 500.622c62.578 0 125.155 17.067 221.867 102.4 8.533 5.69 19.91 5.69 25.6 0 48.355-54.044 238.933-261.689 455.11-329.955 0 0 28.445-5.69 42.667 19.91 8.534 17.067 19.911 34.134-5.689 54.045-22.755 17.067-264.533 179.2-440.888 440.89l-2.845 2.844c-11.378 8.533-68.267 51.2-119.467-14.223-56.888-71.11-85.333-139.377-196.266-196.266-2.845 0-2.845-2.845-5.69-5.69-11.377-11.377-54.044-73.955 25.6-73.955z",
     fill: "currentColor",
     "fill-opacity": "0.9"
-  }, null, -1), H6 = [
-    D6
-  ], C7 = /* @__PURE__ */ vue.defineComponent({
+  }, null, -1), V0 = [
+    B0
+  ], M7 = /* @__PURE__ */ vue.defineComponent({
     __name: "Checklist",
     props: {
       class: { type: String, default: "" },
@@ -14775,15 +14849,15 @@
         viewBox: "0 0 1024 1024",
         "aria-labelledby": c.name,
         role: "presentation"
-      }, H6, 14, P6));
+      }, V0, 14, L0));
     }
-  }), b0 = ["aria-labelledby"], x0 = /* @__PURE__ */ vue.createElementVNode("path", {
+  }), N6 = ["aria-labelledby"], C6 = /* @__PURE__ */ vue.createElementVNode("path", {
     d: "m387.547 980.846 305.006-397.532a117.102 117.102 0 0 0 0-142.628L387.584 43.154a44.837 44.837 0 0 0-71.131 54.492l305.042 397.568a27.538 27.538 0 0 1 0 33.572L316.489 926.318a44.8 44.8 0 0 0 71.058 54.564",
     fill: "currentColor",
     "fill-opacity": "0.9"
-  }, null, -1), z0 = [
-    x0
-  ], U7 = /* @__PURE__ */ vue.defineComponent({
+  }, null, -1), v6 = [
+    C6
+  ], J7 = /* @__PURE__ */ vue.defineComponent({
     __name: "ArrowRight",
     props: {
       class: { type: String, default: "" },
@@ -14819,7 +14893,7 @@
         viewBox: "0 0 1024 1024",
         "aria-labelledby": c.name,
         role: "presentation"
-      }, z0, 14, b0));
+      }, v6, 14, N6));
     }
   });
 
@@ -15364,7 +15438,7 @@
   }
 
   const { create: create$k, componentName: componentName$j, scope: scope$h } = createComponent("tabs-bar");
-  const _sfc_main$k = create$k(component$f(componentName$j, scope$h, os, false));
+  const _sfc_main$k = create$k(component$f(componentName$j, scope$h, ds, false));
 
   const TabsStatesKey = Symbol("TabsStatesKey");
   const tabsContainerProps = {
@@ -15627,7 +15701,7 @@
   }
 
   const { create: create$i, componentName: componentName$h, scope: scope$f } = createComponent("tabs-pane");
-  const _sfc_main$i = create$i(component$d(componentName$h, scope$f, zs));
+  const _sfc_main$i = create$i(component$d(componentName$h, scope$f, $s));
 
   const stepBarProps = {
     // 步骤栏方向
@@ -16274,7 +16348,7 @@
   }
 
   const { componentName: componentName$g, create: create$h, scope: scope$e } = createComponent("steps-bar");
-  const _sfc_main$h = create$h(component$c(componentName$g, scope$e, C7, U7));
+  const _sfc_main$h = create$h(component$c(componentName$g, scope$e, M7, J7));
 
   const InnerPageScopeKey$1 = Symbol.for("InnerPageScopeKey");
   const PageWrapperKey$1 = Symbol.for("PageWrapperKey");
@@ -16282,14 +16356,22 @@
     return {
       // 属性
       props: {
+        // class
+        class: {
+          type: [String]
+        },
         // 标题
         title: {
           type: [String]
         },
+        // 隐藏header
+        hideHeader: {
+          type: [Boolean]
+        },
         // 是否可拖动
         draggable: {
           type: [Boolean],
-          default: true
+          default: () => true
         },
         // 是否加入body
         appendToBody: {
@@ -16299,12 +16381,12 @@
         // 是否可以通过点击 modal 关闭 Dialog
         closeOnClickModal: {
           type: [Boolean],
-          default: false
+          default: () => false
         },
         // 是否可以通过按下 ESC 关闭 Dialog
         closeOnPressEscape: {
           type: [Boolean],
-          default: true
+          default: () => true
         }
       },
       // setup
@@ -16323,7 +16405,7 @@
         };
         return () => {
           const attrs = context.attrs;
-          const dialogData = {
+          const data = {
             ...attrs,
             title: props.title,
             draggable: props.draggable,
@@ -16334,12 +16416,19 @@
             "close-on-press-escape": props.closeOnPressEscape,
             "before-close": beforeClose
           };
+          const classes = ["fox-dialog-item "];
+          if (props.hideHeader) {
+            classes.push("hide-header");
+          }
+          if (props.class) {
+            classes.push(props.class);
+          }
+          data.class = classes.join(" ");
           const children = {};
           if (typeof context.slots.default === "function") {
-            const node = context.slots.default();
-            children.default = () => node;
+            children.default = context.slots.default;
           }
-          return vue.h(elementPlus.ElDialog, dialogData, children);
+          return vue.h(elementPlus.ElDialog, data, children);
         };
       }
     };
@@ -16650,7 +16739,7 @@
   const _sfc_main$e = create$e(
     component$a(componentName$d, {
       FoxOverLay: OverLay,
-      Close: S7
+      Close: N7
     })
   );
 
@@ -17429,7 +17518,7 @@
   }
 
   const { componentName: componentName$b, create: create$b, scope: scope$b } = createComponent("infinite-loading");
-  const _sfc_main$b = create$b(component$8(componentName$b, scope$b, zs));
+  const _sfc_main$b = create$b(component$8(componentName$b, scope$b, $s));
 
   const MIN_DISTANCE = 10;
   function getDirection(x, y) {
@@ -17813,7 +17902,7 @@
   };
 
   const { componentName: componentName$a, create: create$a, scope: scope$a } = createComponent("pull-refresh");
-  const _sfc_main$a = create$a(component$7(componentName$a, scope$a, zs));
+  const _sfc_main$a = create$a(component$7(componentName$a, scope$a, $s));
 
   function component$6(componentName, scope) {
     return {
@@ -18709,7 +18798,7 @@
   };
 
   const { componentName: componentName$6, create: create$6, scope: scope$6 } = createComponent("floating-button");
-  const _sfc_main$6 = create$6(component$3(componentName$6, scope$6, G0, false));
+  const _sfc_main$6 = create$6(component$3(componentName$6, scope$6, X6, false));
 
   function isWindow(val) {
     return val === window;
@@ -20299,6 +20388,10 @@
     // custom style
     customStyle: {
       type: [Object]
+    },
+    // leave hide(鼠标离开，自动隐藏)
+    leaveHide: {
+      type: [Boolean]
     }
   };
 
@@ -20686,6 +20779,16 @@
             mounted.value = false;
           }
         };
+        const onMouseleave = (e) => {
+          if (!dialogRef.value || visible.value === false) {
+            return;
+          }
+          const { relatedTarget } = e;
+          if (!dialogRef.value.contains(relatedTarget)) {
+            visible.value = false;
+            emit("update:visible", false);
+          }
+        };
         expose({
           doLayout
         });
@@ -20717,6 +20820,9 @@
             style: styles.value,
             onAnimationend
           };
+          if (props.leaveHide) {
+            data["onMouseleave"] = onMouseleave;
+          }
           const dialogNode = vue.h("div", data, { default: () => children });
           rootNodes.push(dialogNode);
           return rootNodes;