init

.svn/pristine/66/6640e13f3416da32518354f9eac27431fae44add.svn-base

@@ -0,0 +1,146 @@
+<script lang="ts">
+export default {
+  name: "Vertical",
+};
+</script>
+
+<script setup lang="ts">
+import { Ref, ref } from "vue";
+import { on, off } from "evtd";
+import { throttle } from "./utils/index";
+import LayTooltip from "../tooltip/index.vue";
+
+export interface VerticalProps {
+  val?: number | Array<number>;
+  disabled?: boolean;
+  step?: number;
+  min?: number;
+  max?: number;
+  showDots: boolean;
+}
+
+const props = withDefaults(defineProps<VerticalProps>(), {
+  disabled: true,
+  val: 0,
+  step: 0,
+  min: 0,
+  max: 100,
+  showDots: false,
+});
+
+const moveAction = throttle(verticalMove);
+
+function handle_mouseup() {
+  off("selectstart", document, handle_select);
+  off("mouseup", window, handle_mouseup);
+  off("mousemove", window, moveAction);
+  tooptipHide.value = true;
+}
+function handle_select(e: Event): void {
+  e.preventDefault();
+}
+
+function handle_mousedown() {
+  on("selectstart", window, handle_select, { once: true });
+  on("mouseup", window, handle_mouseup);
+  on("mousemove", window, moveAction);
+}
+
+const tracker = ref<HTMLElement | null>(null);
+let vertical_style: Ref<number> = ref<number>(props.val as number);
+const emit = defineEmits(["link-val-hook"]);
+const tooptipHide = ref<boolean>(true);
+
+function verticalMove(e: MouseEvent) {
+  tooptipHide.value = false;
+  if (!tracker.value) {
+    return;
+  }
+  let tracker_rect = tracker.value.getBoundingClientRect();
+  let origin_bottom = tracker_rect.bottom;
+  let point_bottom = e.clientY;
+  let distance = (point_bottom - origin_bottom) * -1;
+  if (distance < props.min) {
+    vertical_style.value = props.min;
+  } else {
+    let rate = (distance / tracker_rect.height) * 100;
+    calcWithStep(rate, vertical_style);
+    if (vertical_style.value > props.max) {
+      vertical_style.value = props.max;
+    }
+  }
+  emit("link-val-hook", vertical_style.value);
+}
+
+function calcWithStep(
+  rate: number | undefined,
+  val: Ref<number> | Ref<number[]>
+) {
+  if (typeof rate === "undefined") return false;
+
+  if (typeof val.value === "number") {
+    let r = rate - val.value;
+    if (Math.abs(r) < props.step) {
+      return false;
+    }
+
+    if (props.step === 0) val.value = Math.floor(rate);
+
+    if (r < 0 && props.step !== 0) {
+      val.value -= props.step;
+    } else {
+      val.value += props.step;
+    }
+  }
+}
+// 断点
+const makeDots = () => {
+  if (props.step === 0) return [];
+  let val = 0;
+  let dots = [];
+  let count = Math.floor(100 / props.step) - 1;
+  for (let i = 0; i < count; i++) {
+    val += props.step;
+    dots.push(val);
+  }
+  return dots;
+};
+const dots = makeDots();
+const focusDot = (val: number) => {
+  emit("link-val-hook", val);
+};
+</script>
+
+<template>
+  <div class="layui-slider-vertical">
+    <div
+      @mousedown.stop="handle_mousedown"
+      ref="tracker"
+      :class="[disabled ? 'layui-slider-disabled' : '']"
+      class="layui-slider-vertical-track"
+    >
+      <lay-tooltip :content="'' + val" :is-can-hide="tooptipHide">
+        <div
+          :style="{ bottom: val + '%' }"
+          :class="[props.disabled ? 'layui-slider-disabled disable-btn' : '']"
+          class="layui-slider-vertical-btn"
+        ></div>
+      </lay-tooltip>
+
+      <div
+        :style="{ height: val + '%' }"
+        :class="[props.disabled ? 'layui-slider-disabled disable-line' : '']"
+        class="layui-slider-vertical-rate"
+      ></div>
+      <div class="layui-slider-vertical-line"></div>
+      <div
+        v-show="showDots"
+        @click="focusDot(item)"
+        class="layui-slider-vertical-dots"
+        v-for="(item, index) in dots"
+        :key="index"
+        :style="{ bottom: item + '%' }"
+      ></div>
+    </div>
+  </div>
+</template>

.svn/pristine/66/6644bbe7a22791456bc5fdc4d57bfe1717d3b096.svn-base

@@ -0,0 +1,16 @@
+<script lang="ts">
+export default {
+  name: "HeadsetIcon",
+};
+</script>
+<script setup lang="ts">
+import LayIcon from "../component/icon/index";
+
+const props = defineProps<{
+  color?: string;
+  size?: string;
+}>();
+</script>
+<template>
+  <lay-icon :color="props.color" :size="props.size" type="layui-icon-headset" />
+</template>

.svn/pristine/66/66582288a2b597bdd4ce38c2359c19f1b9bd3f2f.svn-base

@@ -0,0 +1 @@
+.container-demo{width:100%;height:300px;background:#79C48C;border-radius:2px}

.svn/pristine/66/668524690560acd9466cf22d45609d749f8a85d8.svn-base

@@ -0,0 +1,5 @@
+import "../badge/index2.js";
+export { c as default } from "./index2.js";
+import "vue";
+import "../dropdown/index2.js";
+import "../_chunks/@vueuse/index.js";

.svn/pristine/66/66ca360480bd8977e06805f6b9c09196600bd31f.svn-base

@@ -0,0 +1 @@
+x
<01><>MN<4D>0<10>Y<EFBFBD>#<23>@<40>ʢ<EFBFBD><CAA2><EFBFBD><1F>H,<2C><>n:i-9vO<>VQ<56><51>m<EFBFBD>g`<60><>@]<5D><>ϼ<><CFBC><EFBFBD><EFBFBD>q;x<>ln<12>׺"0<>RI^fϕ<>	<09>X<EFBFBD><58><10><02><><12> <20><><EFBFBD>M<EFBFBD>h<EFBFBD><68>'<27>Rދ.I4HdBLb<1E><><EFBFBD><EFBFBD><EFBFBD><0C>-4_<>#<14>+A<><1A><><EFBFBD><EFBFBD><EFBFBD>օ<><11><><EFBFBD><EFBFBD>U><3E> M<1F><><EFBFBD><EFBFBD><EFBFBD><10>3<EFBFBD><33><EFBFBD><EFBFBD><EFBFBD>9<EFBFBD><39>Ƣ"w<>xA:#o<><6F>3<EFBFBD>TA0<41>#r<> <20><>
f<><66>2'<27><>"<22><18>

.svn/pristine/66/66f0794d61b58b131a52e556c44511906fba6a5d.svn-base

@@ -0,0 +1,2 @@
+declare const useMove: (el: HTMLElement, callback: Function) => void;
+export default useMove;