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

package/dist/index.esm.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 (中国标准时间)
  */
 import { inject, provide, onUnmounted, getCurrentInstance, effectScope, watchEffect, nextTick as nextTick$1, hasInjectionContext, customRef, reactive, isReactive, watch, toRaw, computed, toRef, ref, defineComponent, onMounted, h, unref, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, shallowRef, markRaw, triggerRef, createCommentVNode, createElementVNode, toDisplayString, onBeforeUnmount, resolveComponent, Fragment, withDirectives, createBlock, vShow, createVNode, render as render$1, shallowReactive, mergeProps as mergeProps$1, withCtx, createTextVNode, renderList, Transition, withModifiers, toRefs, Teleport, resolveDynamicComponent, onActivated, onDeactivated } from 'vue';
 import Schema from '@fox-js/validator';
@@ -7906,14 +7906,17 @@ const DateUtils = {
    * 返回日期格式字符串
    * @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);
   },
   /**
    * 时间比较
@@ -11858,6 +11861,10 @@ const tableProps = {
   params: {
     type: [Object]
   },
+  // row class name
+  rowClassName: {
+    type: Function
+  },
   // cell class name
   cellClassName: {
     type: Function
@@ -12095,7 +12102,7 @@ function component$l(componentName, scope, Item) {
     // setup
     setup(props, context) {
       const { locale } = useFoxI18n(scope);
-      const { emitEvent } = defineItem(
+      const { emitEvent, broadcast } = defineItem(
         {
           componentName,
           // 获取value
@@ -12366,6 +12373,7 @@ function component$l(componentName, scope, Item) {
             expandedRows.splice(0, size, row);
           }
         }
+        setTimeout(setChildCellClassNames, 0);
       };
       const settingId = context.attrs.id ?? props.prop ?? context.attrs.name;
       const settingModel = useSettingModel();
@@ -12463,10 +12471,14 @@ function component$l(componentName, scope, Item) {
         return cols;
       });
       const cellClassNames = 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") {
@@ -12488,8 +12500,20 @@ function component$l(componentName, scope, Item) {
         }
         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 {
@@ -12497,6 +12521,49 @@ function component$l(componentName, scope, Item) {
         }
         triggerRef(cellClassNames);
       };
+      const clearCellClassName = () => {
+        cellClassNames.value.clear();
+        triggerRef(cellClassNames);
+      };
+      const rowClassNames = 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);
+        }
+        triggerRef(rowClassNames);
+      };
+      const clearRowClassName = () => {
+        rowClassNames.value.clear();
+        triggerRef(rowClassNames);
+      };
       const tableRef = ref();
       useExpose({
         // 清空selection
@@ -12610,7 +12677,13 @@ function component$l(componentName, scope, Item) {
         // 移除列属性配置
         removeColumnSetting,
         // 设置cell class name
-        setCellClassName
+        setCellClassName,
+        // 清空cell className
+        clearCellClassName,
+        // 设置row class name
+        setRowClassName,
+        // 清空row class name
+        clearRowClassName
       });
       return () => {
         const attrs = filterInheritAttr(context.attrs);
@@ -12622,7 +12695,8 @@ function component$l(componentName, scope, Item) {
           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) {
@@ -14564,7 +14638,7 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
   "fill-opacity": "0.9"
 }, null, -1), F = [
   A
-], G0 = /* @__PURE__ */ defineComponent({
+], X6 = /* @__PURE__ */ defineComponent({
   __name: "Uploader",
   props: {
     class: { type: String, default: "" },
@@ -14602,13 +14676,13 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       role: "presentation"
     }, F, 14, V));
   }
-}), P3 = ["aria-labelledby"], D3 = /* @__PURE__ */ createElementVNode("path", {
+}), L3 = ["aria-labelledby"], B3 = /* @__PURE__ */ 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__ */ defineComponent({
+}, null, -1), V3 = [
+  B3
+], ds = /* @__PURE__ */ defineComponent({
   __name: "MoreH",
   props: {
     class: { type: String, default: "" },
@@ -14644,15 +14718,15 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       viewBox: "0 0 1024 1024",
       "aria-labelledby": c.name,
       role: "presentation"
-    }, H3, 14, P3));
+    }, V3, 14, L3));
   }
-}), x4 = ["aria-labelledby"], z4 = /* @__PURE__ */ createElementVNode("path", {
+}), C4 = ["aria-labelledby"], v4 = /* @__PURE__ */ 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__ */ defineComponent({
+}, null, -1), $4 = [
+  v4
+], $s = /* @__PURE__ */ defineComponent({
   __name: "Loading",
   props: {
     class: { type: String, default: "" },
@@ -14688,15 +14762,15 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       viewBox: "0 0 1024 1024",
       "aria-labelledby": c.name,
       role: "presentation"
-    }, N4, 14, x4));
+    }, $4, 14, C4));
   }
-}), g6 = ["aria-labelledby"], f6 = /* @__PURE__ */ createElementVNode("path", {
+}), _0 = ["aria-labelledby"], w0 = /* @__PURE__ */ 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__ */ defineComponent({
+}, null, -1), S0 = [
+  w0
+], N7 = /* @__PURE__ */ defineComponent({
   __name: "Close",
   props: {
     class: { type: String, default: "" },
@@ -14732,15 +14806,15 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       viewBox: "0 0 1026 1024",
       "aria-labelledby": c.name,
       role: "presentation"
-    }, y6, 14, g6));
+    }, S0, 14, _0));
   }
-}), P6 = ["aria-labelledby"], D6 = /* @__PURE__ */ createElementVNode("path", {
+}), L0 = ["aria-labelledby"], B0 = /* @__PURE__ */ 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__ */ defineComponent({
+}, null, -1), V0 = [
+  B0
+], M7 = /* @__PURE__ */ defineComponent({
   __name: "Checklist",
   props: {
     class: { type: String, default: "" },
@@ -14776,15 +14850,15 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       viewBox: "0 0 1024 1024",
       "aria-labelledby": c.name,
       role: "presentation"
-    }, H6, 14, P6));
+    }, V0, 14, L0));
   }
-}), b0 = ["aria-labelledby"], x0 = /* @__PURE__ */ createElementVNode("path", {
+}), N6 = ["aria-labelledby"], C6 = /* @__PURE__ */ 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__ */ defineComponent({
+}, null, -1), v6 = [
+  C6
+], J7 = /* @__PURE__ */ defineComponent({
   __name: "ArrowRight",
   props: {
     class: { type: String, default: "" },
@@ -14820,7 +14894,7 @@ const V = ["aria-labelledby"], A = /* @__PURE__ */ createElementVNode("path", {
       viewBox: "0 0 1024 1024",
       "aria-labelledby": c.name,
       role: "presentation"
-    }, z0, 14, b0));
+    }, v6, 14, N6));
   }
 });
 
@@ -15365,7 +15439,7 @@ function component$f(componentName, scope, MoreIcon, taro = false) {
 }
 
 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 = {
@@ -15628,7 +15702,7 @@ function component$d(componentName, scope, LoadingIcon) {
 }
 
 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 = {
   // 步骤栏方向
@@ -16275,7 +16349,7 @@ function component$c(componentName, scope, DoneIcon, MarkIcon) {
 }
 
 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");
@@ -16283,14 +16357,22 @@ function component$b(componentName, scope) {
   return {
     // 属性
     props: {
+      // class
+      class: {
+        type: [String]
+      },
       // 标题
       title: {
         type: [String]
       },
+      // 隐藏header
+      hideHeader: {
+        type: [Boolean]
+      },
       // 是否可拖动
       draggable: {
         type: [Boolean],
-        default: true
+        default: () => true
       },
       // 是否加入body
       appendToBody: {
@@ -16300,12 +16382,12 @@ function component$b(componentName, scope) {
       // 是否可以通过点击 modal 关闭 Dialog
       closeOnClickModal: {
         type: [Boolean],
-        default: false
+        default: () => false
       },
       // 是否可以通过按下 ESC 关闭 Dialog
       closeOnPressEscape: {
         type: [Boolean],
-        default: true
+        default: () => true
       }
     },
     // setup
@@ -16324,7 +16406,7 @@ function component$b(componentName, scope) {
       };
       return () => {
         const attrs = context.attrs;
-        const dialogData = {
+        const data = {
           ...attrs,
           title: props.title,
           draggable: props.draggable,
@@ -16335,12 +16417,19 @@ function component$b(componentName, scope) {
           "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 h(ElDialog, dialogData, children);
+        return h(ElDialog, data, children);
       };
     }
   };
@@ -16651,7 +16740,7 @@ const { componentName: componentName$d, create: create$e } = createComponent("po
 const _sfc_main$e = create$e(
   component$a(componentName$d, {
     FoxOverLay: OverLay,
-    Close: S7
+    Close: N7
   })
 );
 
@@ -17430,7 +17519,7 @@ function component$8(componentName, scope, Loading) {
 }
 
 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) {
@@ -17814,7 +17903,7 @@ const component$7 = (componentName, scope, Loading) => {
 };
 
 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 {
@@ -18710,7 +18799,7 @@ const component$3 = (componentName, scope, addIcon, taro = false) => {
 };
 
 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;
@@ -20300,6 +20389,10 @@ const popoverDialogProps = {
   // custom style
   customStyle: {
     type: [Object]
+  },
+  // leave hide(鼠标离开，自动隐藏)
+  leaveHide: {
+    type: [Boolean]
   }
 };
 
@@ -20687,6 +20780,16 @@ function component$2(componentName, scope, taro = false) {
           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
       });
@@ -20718,6 +20821,9 @@ function component$2(componentName, scope, taro = false) {
           style: styles.value,
           onAnimationend
         };
+        if (props.leaveHide) {
+          data["onMouseleave"] = onMouseleave;
+        }
         const dialogNode = h("div", data, { default: () => children });
         rootNodes.push(dialogNode);
         return rootNodes;