cnhis-design-vue 3.4.0-beta.3 → 3.4.0-beta.7

package/es/components/steps-wheel/src/StepsWheel.vue2.js

@@ -13,35 +13,20 @@ import '../../../shared/hooks/useScrollLoading.js';
 import { defaultCssVars } from './constants/index.js';
 import script from '../../../shared/components/SlotRender/SlotRender.js';
 
-const _hoisted_1 = {
-  class: "stepBox"
-};
+const _hoisted_1 = { class: "stepBox" };
 const _hoisted_2 = ["title"];
 const _hoisted_3 = ["onMouseenter", "onMouseleave"];
-const _hoisted_4 = {
-  style: {
-    position: "absolute",
-    left: "50%",
-    top: "50%",
-    translate: "-50% -50%"
-  }
-};
+const _hoisted_4 = { style: { position: "absolute", left: "50%", top: "50%", translate: "-50% -50%" } };
 const _hoisted_5 = ["onMouseenter", "onMouseleave"];
 const _hoisted_6 = ["title"];
 const _hoisted_7 = ["title"];
 const _hoisted_8 = ["title"];
 const _hoisted_9 = {
   key: 0,
-  style: {
-    "height": "48px"
-  }
-};
-const _hoisted_10 = {
-  key: 1
-};
-const _hoisted_11 = {
-  key: 1
+  style: { "height": "48px" }
 };
+const _hoisted_10 = { key: 1 };
+const _hoisted_11 = { key: 1 };
 var _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "StepsWheel",
   props: {
@@ -99,10 +84,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     const lastNodeRenderShow = computed(() => {
       return props.lastNodeRender;
     });
-    const {
-      noDataMsg,
-      nextNodeRender
-    } = toRefs(props);
+    const { noDataMsg, nextNodeRender } = toRefs(props);
     const stepItemRef = ref(null);
     const countBoxWidth = computed(() => {
       var _a;
@@ -181,15 +163,11 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       return false;
     };
     const lineCircleLeft = (stepItem) => {
-      const {
-        list = []
-      } = props.stepInfo;
+      const { list = [] } = props.stepInfo;
       return stepItem.rowIndex % 2 == 0 && stepItem.nodeType == "frist" && stepItem.nodeIndex !== list.length;
     };
     const lineCircleRight = (stepItem) => {
-      const {
-        list = []
-      } = props.stepInfo;
+      const { list = [] } = props.stepInfo;
       return stepItem.rowIndex % 2 != 0 && stepItem.nodeType == "last" && stepItem.nodeIndex !== list.length;
     };
     const lineActiveShow = (stepItem, index) => {
@@ -218,9 +196,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       return res;
     };
     const lastLineHidden = (index) => {
-      const {
-        cols
-      } = props.stepInfo;
+      const { cols } = props.stepInfo;
       let arr = format2DArray(stepInfoList.value, cols);
       let lastRow = arr[arr.length - 1].filter((v) => v);
       if (nodeRowCount.value % 2 == 0) {
@@ -230,9 +206,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     const handleFinishLastNodeCss = (index) => {
-      const {
-        cols
-      } = props.stepInfo;
+      const { cols } = props.stepInfo;
       let arr = format2DArray(stepInfoList.value, cols);
       let lastRow = arr[arr.length - 1].filter((v) => v);
       if (nodeRowCount.value % 2 == 0) {
@@ -242,9 +216,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
     };
     const handleFinishLastNodeLine = (index, type) => {
-      const {
-        cols
-      } = props.stepInfo;
+      const { cols } = props.stepInfo;
       let arr = format2DArray(stepInfoList.value, cols);
       let lastRow = arr[arr.length - 1].filter((v) => v);
       if (nodeRowCount.value % 2 == 0) {
@@ -262,10 +234,7 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
     const handlerActive = (stepItem, index, position) => {
       var _a, _b;
       if (((_a = props.singleNodeRender) == null ? void 0 : _a.field) && ((_b = props.singleNodeRender) == null ? void 0 : _b.details) && Object.prototype.toString.call(props.singleNodeRender.details) === "[object Object]" && Object.keys(props.singleNodeRender.details).length) {
-        const {
-          details,
-          field
-        } = props.singleNodeRender;
+        const { details, field } = props.singleNodeRender;
         if (details[stepItem[field]] && Object.prototype.toString.call(details[stepItem[field]]) === "[object Object]" && Object.keys(details[stepItem[field]]).length) {
           let styleObj = {};
           switch (position) {
@@ -338,175 +307,219 @@ var _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return {};
     };
-    watch(() => props.stepInfo, (val) => {
-      handleNode(val.list || [], val.cols);
-    }, {
-      immediate: true,
-      deep: true
-    });
-    watch(() => props.lastNodeColor, (val) => {
-      if (val && Object.prototype.toString.call(val) === "[object Object]" && Object.keys(val).length) {
-        const defaultCss = Object.assign({}, defaultCssVars, {
-          "--c-success-color": val.color || "#5dc055",
-          "--c-success-title-color": val.background || "#fff"
-        });
-        cssVars = useTheme(defaultCss, "StepsWheel");
-      }
-    }, {
-      immediate: true,
-      deep: true
-    });
+    watch(
+      () => props.stepInfo,
+      (val) => {
+        handleNode(val.list || [], val.cols);
+      },
+      { immediate: true, deep: true }
+    );
+    watch(
+      () => props.lastNodeColor,
+      (val) => {
+        if (val && Object.prototype.toString.call(val) === "[object Object]" && Object.keys(val).length) {
+          const defaultCss = Object.assign({}, defaultCssVars, {
+            "--c-success-color": val.color || "#5dc055",
+            "--c-success-title-color": val.background || "#fff"
+          });
+          cssVars = useTheme(defaultCss, "StepsWheel");
+        }
+      },
+      { immediate: true, deep: true }
+    );
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", {
         class: "step-wheel-box",
-        style: normalizeStyle({
-          minWidth: unref(countBoxWidth),
-          ...unref(cssVars)
-        })
-      }, [stepInfoList.value.length ? (openBlock(), createElementBlock("div", {
-        key: 0,
-        class: normalizeClass(["stepOut", {
-          placementLeft: __props.placement === "left",
-          placementRight: __props.placement === "right"
-        }])
-      }, [createElementVNode("ul", _hoisted_1, [(openBlock(true), createElementBlock(Fragment, null, renderList(stepInfoList.value, (stepItem, index) => {
-        var _a;
-        return openBlock(), createElementBlock("li", {
-          ref_for: true,
-          ref_key: "stepItemRef",
-          ref: stepItemRef,
-          key: (stepItem == null ? void 0 : stepItem.stepId) || index,
-          class: normalizeClass(["stepItem", {
-            [`stepItem_${index + 1}`]: true,
-            [`${stepItem == null ? void 0 : stepItem.stepId}`]: (stepItem == null ? void 0 : stepItem.stepId) ? true : false
-          }])
-        }, [stepItem ? (openBlock(), createElementBlock(Fragment, {
-          key: 0
-        }, [createCommentVNode(" \u6B65\u9AA4\u5934\u90E8\u4FE1\u606F "), withDirectives(createElementVNode("div", {
-          class: normalizeClass(["stepTopBox", {
-            finished: handleFinishLastNodeCss(index),
-            stepTopBox_right: __props.placement === "right",
-            stepTopBox_left: __props.placement === "left"
-          }]),
-          style: normalizeStyle({
-            ...handlerActive(stepItem, index, "title")
-          })
-        }, [renderSlot(_ctx.$slots, "stepTopBox", {
-          stepItem
-        }, () => [createElementVNode("span", {
-          title: stepItem.title
-        }, toDisplayString(stepItem.title), 9, _hoisted_2)])], 6), [[vShow, stepItem.title]]), createCommentVNode(" \u6B65\u9AA4\u6761\u7684\u8282\u70B9\uFF0C\u6B64\u5904\u4E3A\u5706\u5708 "), __props.toolTipShow && stepItem.tipShow ? (openBlock(), createBlock(unref(NTooltip), {
+        style: normalizeStyle({ minWidth: unref(countBoxWidth), ...unref(cssVars) })
+      }, [
+        stepInfoList.value.length ? (openBlock(), createElementBlock("div", {
           key: 0,
-          placement: "top",
-          delay: 0,
-          "show-arrow": true,
-          show: stepItem.tipVisible,
-          trigger: "manual",
-          style: normalizeStyle({
-            opacity: "0.88"
-          }),
-          onMouseenter: ($event) => mouseEnter(stepItem),
-          onMouseleave: ($event) => mouseLeave(stepItem)
-        }, {
-          trigger: withCtx(() => [createElementVNode("div", {
-            class: normalizeClass(["icon", {
-              finished: handleFinishLastNodeCss(index)
-            }]),
-            style: normalizeStyle({
-              ...handlerActive(stepItem, index, "icon")
-            }),
-            onMouseenter: ($event) => mouseEnter(stepItem),
-            onMouseleave: ($event) => mouseLeave(stepItem)
-          }, null, 46, _hoisted_3)]),
-          default: withCtx(() => [renderSlot(_ctx.$slots, "nodeTipBox", {
-            stepItem,
-            stepId: stepItem.stepId
-          })]),
-          _: 2
-        }, 1032, ["show", "style", "onMouseenter", "onMouseleave"])) : (openBlock(), createElementBlock("div", {
-          key: 1,
-          class: normalizeClass(["icon", {
-            finished: handleFinishLastNodeCss(index)
-          }]),
-          style: normalizeStyle({
-            ...handlerActive(stepItem, index, "icon")
-          })
-        }, null, 6)), createCommentVNode(" \u6B65\u9AA4\u6761\u8FDE\u63A5\u7EBF\uFF0C\u52A8\u6001\u663E\u793A  "), stepItem.nodeType !== "last" ? withDirectives((openBlock(), createElementBlock("div", {
-          key: 2,
-          class: normalizeClass(["line", {
-            finished: handleFinishLastNodeLine(index)
-          }]),
-          style: normalizeStyle({
-            ...handlerActive(stepItem, index, "line")
-          })
-        }, [createElementVNode("div", _hoisted_4, [createVNode(unref(script), {
-          renderer: isOddRow(index) ? (_a = stepInfoList.value[index + 1]) == null ? void 0 : _a.spaceRenderer : stepItem.spaceRenderer
-        }, null, 8, ["renderer"])])], 6)), [[vShow, lastLineHidden(index)]]) : createCommentVNode("v-if", true), createCommentVNode(" \u6B65\u9AA4\u6761\u5F2F\u66F2\u8FDE\u7EBF\uFF0C\u52A8\u6001\u6E32\u67D3 "), lineCircleLeft(stepItem) || lineCircleRight(stepItem) ? (openBlock(), createElementBlock("div", {
-          key: 3,
-          class: normalizeClass({
-            lineCircleFinished: handleFinishLastNodeLine(index, "circle"),
-            lineCircleRight: lineCircleRight(stepItem),
-            lineCircleLeft: lineCircleLeft(stepItem),
-            lineCirclePlacementRight: lineCircleRight(stepItem) && __props.placement === "right",
-            lineCirclePlacementLeft: lineCircleLeft(stepItem) && __props.placement === "left"
-          }),
-          style: normalizeStyle({
-            ...handlerActive(stepItem, index, "circle")
-          })
-        }, [createElementVNode("div", {
-          style: normalizeStyle({
-            position: "absolute",
-            left: lineCircleLeft(stepItem) ? "0" : "100%",
-            top: "50%",
-            translate: "-50% -50%"
-          })
-        }, [createVNode(unref(script), {
-          renderer: stepItem.spaceRenderer
-        }, null, 8, ["renderer"])], 4)], 6)) : createCommentVNode("v-if", true), createCommentVNode(" \u6B65\u9AA4\u5E95\u90E8\u4FE1\u606F "), createElementVNode("div", {
-          class: normalizeClass(["stepBottomBox", {
-            stepBottomBox_right: __props.placement === "right",
-            stepBottomBox_left: __props.placement === "left"
-          }]),
-          onMouseenter: ($event) => mouseEnter(stepItem),
-          onMouseleave: ($event) => mouseLeave(stepItem)
-        }, [renderSlot(_ctx.$slots, "stepBottomBox", {
-          stepItem
-        }, () => [createCommentVNode(" \u6B65\u9AA4\u540D\u79F0  "), withDirectives(createElementVNode("p", {
-          class: normalizeClass(["stepLabel", {
-            labelFinsh: handleFinishLastNodeCss(index),
-            stepLabel_right: __props.placement === "right",
-            stepLabel_left: __props.placement === "left"
-          }]),
-          title: stepItem.label
-        }, toDisplayString(stepItem.label), 11, _hoisted_6), [[vShow, stepItem.label]]), createElementVNode("div", {
-          class: normalizeClass({
-            stepBottomCustomBox: true,
-            alignItemsEnd: __props.placement === "left",
-            alignItemsStart: __props.placement === "right"
-          })
-        }, [renderSlot(_ctx.$slots, "stepBottomCustomBox", {
-          stepItem
-        }, () => [createElementVNode("div", {
-          class: normalizeClass({
-            stepBottomDefaultBox: true,
-            alignItemsEnd: __props.placement === "left",
-            alignItemsStart: __props.placement === "right"
-          }),
-          style: {
-            width: "100%",
-            display: "flex",
-            flexDirection: "column"
-          }
-        }, [withDirectives(createElementVNode("p", {
-          class: "stepExtra",
-          title: stepItem.person
-        }, toDisplayString(stepItem.person), 9, _hoisted_7), [[vShow, stepItem.person]]), createCommentVNode(" \u6B65\u9AA4\u65F6\u95F4  "), withDirectives(createElementVNode("p", {
-          class: "statusTime",
-          title: stepItem.statusTime
-        }, toDisplayString(stepItem.statusTime), 9, _hoisted_8), [[vShow, stepItem.statusTime]])], 2)])], 2)]), fillBoxShow(stepItem) ? (openBlock(), createElementBlock("div", _hoisted_9)) : createCommentVNode("v-if", true)], 42, _hoisted_5)], 64)) : (openBlock(), createElementBlock("div", _hoisted_10, [createCommentVNode("null\u5143\u7D20\u5360\u4F4D")]))], 2);
-      }), 128))])], 2)) : (openBlock(), createElementBlock("div", _hoisted_11, [createVNode(unref(NEmpty), {
-        description: unref(noDataMsg)
-      }, null, 8, ["description"])]))], 4);
+          class: normalizeClass(["stepOut", { placementLeft: __props.placement === "left", placementRight: __props.placement === "right" }])
+        }, [
+          createElementVNode("ul", _hoisted_1, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(stepInfoList.value, (stepItem, index) => {
+              var _a;
+              return openBlock(), createElementBlock("li", {
+                ref_for: true,
+                ref_key: "stepItemRef",
+                ref: stepItemRef,
+                key: (stepItem == null ? void 0 : stepItem.stepId) || index,
+                class: normalizeClass(["stepItem", {
+                  [`stepItem_${index + 1}`]: true,
+                  [`${stepItem == null ? void 0 : stepItem.stepId}`]: (stepItem == null ? void 0 : stepItem.stepId) ? true : false
+                }])
+              }, [
+                stepItem ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                  createCommentVNode(" \u6B65\u9AA4\u5934\u90E8\u4FE1\u606F "),
+                  withDirectives(createElementVNode("div", {
+                    class: normalizeClass(["stepTopBox", {
+                      finished: handleFinishLastNodeCss(index),
+                      stepTopBox_right: __props.placement === "right",
+                      stepTopBox_left: __props.placement === "left"
+                    }]),
+                    style: normalizeStyle({
+                      ...handlerActive(stepItem, index, "title")
+                    })
+                  }, [
+                    renderSlot(_ctx.$slots, "stepTopBox", { stepItem }, () => [
+                      createElementVNode("span", {
+                        title: stepItem.title
+                      }, toDisplayString(stepItem.title), 9, _hoisted_2)
+                    ])
+                  ], 6), [
+                    [vShow, stepItem.title]
+                  ]),
+                  createCommentVNode(" \u6B65\u9AA4\u6761\u7684\u8282\u70B9\uFF0C\u6B64\u5904\u4E3A\u5706\u5708 "),
+                  __props.toolTipShow && stepItem.tipShow ? (openBlock(), createBlock(unref(NTooltip), {
+                    key: 0,
+                    placement: "top",
+                    delay: 0,
+                    "show-arrow": true,
+                    show: stepItem.tipVisible,
+                    trigger: "manual",
+                    style: normalizeStyle({ opacity: "0.88" }),
+                    onMouseenter: ($event) => mouseEnter(stepItem),
+                    onMouseleave: ($event) => mouseLeave(stepItem)
+                  }, {
+                    trigger: withCtx(() => [
+                      createElementVNode("div", {
+                        class: normalizeClass(["icon", {
+                          finished: handleFinishLastNodeCss(index)
+                        }]),
+                        style: normalizeStyle({
+                          ...handlerActive(stepItem, index, "icon")
+                        }),
+                        onMouseenter: ($event) => mouseEnter(stepItem),
+                        onMouseleave: ($event) => mouseLeave(stepItem)
+                      }, null, 46, _hoisted_3)
+                    ]),
+                    default: withCtx(() => [
+                      renderSlot(_ctx.$slots, "nodeTipBox", {
+                        stepItem,
+                        stepId: stepItem.stepId
+                      })
+                    ]),
+                    _: 2
+                  }, 1032, ["show", "style", "onMouseenter", "onMouseleave"])) : (openBlock(), createElementBlock("div", {
+                    key: 1,
+                    class: normalizeClass(["icon", {
+                      finished: handleFinishLastNodeCss(index)
+                    }]),
+                    style: normalizeStyle({
+                      ...handlerActive(stepItem, index, "icon")
+                    })
+                  }, null, 6)),
+                  createCommentVNode(" \u6B65\u9AA4\u6761\u8FDE\u63A5\u7EBF\uFF0C\u52A8\u6001\u663E\u793A  "),
+                  stepItem.nodeType !== "last" ? withDirectives((openBlock(), createElementBlock("div", {
+                    key: 2,
+                    class: normalizeClass(["line", {
+                      finished: handleFinishLastNodeLine(index)
+                    }]),
+                    style: normalizeStyle({
+                      ...handlerActive(stepItem, index, "line")
+                    })
+                  }, [
+                    createElementVNode("div", _hoisted_4, [
+                      createVNode(unref(script), {
+                        renderer: isOddRow(index) ? (_a = stepInfoList.value[index + 1]) == null ? void 0 : _a.spaceRenderer : stepItem.spaceRenderer
+                      }, null, 8, ["renderer"])
+                    ])
+                  ], 6)), [
+                    [vShow, lastLineHidden(index)]
+                  ]) : createCommentVNode("v-if", true),
+                  createCommentVNode(" \u6B65\u9AA4\u6761\u5F2F\u66F2\u8FDE\u7EBF\uFF0C\u52A8\u6001\u6E32\u67D3 "),
+                  lineCircleLeft(stepItem) || lineCircleRight(stepItem) ? (openBlock(), createElementBlock("div", {
+                    key: 3,
+                    class: normalizeClass({
+                      lineCircleFinished: handleFinishLastNodeLine(index, "circle"),
+                      lineCircleRight: lineCircleRight(stepItem),
+                      lineCircleLeft: lineCircleLeft(stepItem),
+                      lineCirclePlacementRight: lineCircleRight(stepItem) && __props.placement === "right",
+                      lineCirclePlacementLeft: lineCircleLeft(stepItem) && __props.placement === "left"
+                    }),
+                    style: normalizeStyle({
+                      ...handlerActive(stepItem, index, "circle")
+                    })
+                  }, [
+                    createElementVNode("div", {
+                      style: normalizeStyle({
+                        position: "absolute",
+                        left: lineCircleLeft(stepItem) ? "0" : "100%",
+                        top: "50%",
+                        translate: "-50% -50%"
+                      })
+                    }, [
+                      createVNode(unref(script), {
+                        renderer: stepItem.spaceRenderer
+                      }, null, 8, ["renderer"])
+                    ], 4)
+                  ], 6)) : createCommentVNode("v-if", true),
+                  createCommentVNode(" \u6B65\u9AA4\u5E95\u90E8\u4FE1\u606F "),
+                  createElementVNode("div", {
+                    class: normalizeClass(["stepBottomBox", {
+                      stepBottomBox_right: __props.placement === "right",
+                      stepBottomBox_left: __props.placement === "left"
+                    }]),
+                    onMouseenter: ($event) => mouseEnter(stepItem),
+                    onMouseleave: ($event) => mouseLeave(stepItem)
+                  }, [
+                    renderSlot(_ctx.$slots, "stepBottomBox", { stepItem }, () => [
+                      createCommentVNode(" \u6B65\u9AA4\u540D\u79F0  "),
+                      withDirectives(createElementVNode("p", {
+                        class: normalizeClass(["stepLabel", {
+                          labelFinsh: handleFinishLastNodeCss(index),
+                          stepLabel_right: __props.placement === "right",
+                          stepLabel_left: __props.placement === "left"
+                        }]),
+                        title: stepItem.label
+                      }, toDisplayString(stepItem.label), 11, _hoisted_6), [
+                        [vShow, stepItem.label]
+                      ]),
+                      createElementVNode("div", {
+                        class: normalizeClass({
+                          stepBottomCustomBox: true,
+                          alignItemsEnd: __props.placement === "left",
+                          alignItemsStart: __props.placement === "right"
+                        })
+                      }, [
+                        renderSlot(_ctx.$slots, "stepBottomCustomBox", { stepItem }, () => [
+                          createElementVNode("div", {
+                            class: normalizeClass({
+                              stepBottomDefaultBox: true,
+                              alignItemsEnd: __props.placement === "left",
+                              alignItemsStart: __props.placement === "right"
+                            }),
+                            style: { width: "100%", display: "flex", flexDirection: "column" }
+                          }, [
+                            withDirectives(createElementVNode("p", {
+                              class: "stepExtra",
+                              title: stepItem.person
+                            }, toDisplayString(stepItem.person), 9, _hoisted_7), [
+                              [vShow, stepItem.person]
+                            ]),
+                            createCommentVNode(" \u6B65\u9AA4\u65F6\u95F4  "),
+                            withDirectives(createElementVNode("p", {
+                              class: "statusTime",
+                              title: stepItem.statusTime
+                            }, toDisplayString(stepItem.statusTime), 9, _hoisted_8), [
+                              [vShow, stepItem.statusTime]
+                            ])
+                          ], 2)
+                        ])
+                      ], 2)
+                    ]),
+                    fillBoxShow(stepItem) ? (openBlock(), createElementBlock("div", _hoisted_9)) : createCommentVNode("v-if", true)
+                  ], 42, _hoisted_5)
+                ], 64)) : (openBlock(), createElementBlock("div", _hoisted_10, [
+                  createCommentVNode("null\u5143\u7D20\u5360\u4F4D")
+                ]))
+              ], 2);
+            }), 128))
+          ])
+        ], 2)) : (openBlock(), createElementBlock("div", _hoisted_11, [
+          createVNode(unref(NEmpty), { description: unref(noDataMsg) }, null, 8, ["description"])
+        ]))
+      ], 4);
     };
   }
 });