@javaguns/flow-ui/es/src/flow-widget/flow-node-zoom/flow-zoom.vue.mjs

``` <template> <a-spin :spinning="loading"> <FlowDesigner ref="flowDesigner" top="50px"> </FlowDesigner> </a-spin> </template> <script lang="ts" setup> import { ref, provide, onMounted } from 'vue'; import { FlowDesigner, LoadingKey } from '@j

import { defineComponent as s, ref as f, reactive as _, openBlock as v, createElementBlock as V, normalizeStyle as w, createElementVNode as t, toDisplayString as z, unref as O } from "vue";
import "./style/index.css";
const E = { class: "flow-zoom-container" }, M = s({ name: "flow-zoom" }), y = /* @__PURE__ */ s({
  ...M,
  props: {
    min: { default: 50 },
    max: { default: 200 },
    top: { default: 70 }
  },
  emits: ["update:modelValue"],
  setup(c, { emit: m }) {
    const u = c, i = 100, l = 50, a = 200;
    let o = f(i);
    const r = _({
      // 存在自定义nav时候需要减去nav高度
      top: Number(u.top) + "px"
    }), n = m, p = () => {
      let e = o.value;
      e -= 10, e <= l && (e = l), o.value = e, n("update:modelValue", e);
    }, d = () => {
      let e = o.value;
      e += 10, e >= a && (e = a), o.value = e, n("update:modelValue", e);
    };
    return (e, Z) => (v(), V("div", {
      class: "flow-zoom-wrap",
      style: w(r)
    }, [
      t("div", E, [
        t("div", {
          class: "flow-zoom-less",
          onClick: p
        }),
        t("span", null, z(O(o)) + "%", 1),
        t("div", {
          class: "flow-zoom-more",
          onClick: d
        })
      ])
    ], 4));
  }
});
export {
  y as default
};