This commit is contained in:
2022-12-09 16:41:41 +08:00
parent c1cce5a7c2
commit ff7aa8774f
2003 changed files with 156639 additions and 140 deletions

View File

@@ -0,0 +1 @@
xE<>A<0E>0 Q<>=<3D>/<10><>LO<4C><4F>F<EFBFBD>d<EFBFBD>[<5B>! <20><>iWl<57>I<EFBFBD>*V<><56><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><02>K-<2D><>g"“<><C293><18>v<EFBFBD>6n<36>т_<D182><5F><EFBFBD><EFBFBD>b]<5D>Ic<49><63>ԭT<D4AD><54>0<EFBFBD>ؙ<EFBFBD><D899>;<<3C>A<EFBFBD><41>/<2F><><07><>)<29>

View File

@@ -0,0 +1,186 @@
<script lang="ts">
export default {
name: "VerticalRange",
};
</script>
<script setup lang="ts">
import { ref, toRef, Ref } from "vue";
import { on, off } from "evtd";
import LayTooltip from "../tooltip/index.vue";
import { throttle, makeDots } from "./utils/index";
export interface VerticalRangeProps {
rangeValue: Array<number>;
disabled?: boolean;
step?: number;
min?: number;
max?: number;
showDots?: boolean;
}
const props = withDefaults(defineProps<VerticalRangeProps>(), {
step: 0,
min: 0,
max: 100,
disabled: false,
showDots: false,
});
let rv = toRef(props, "rangeValue");
const moveAction = throttle(rangeMove);
let currbtn = -1;
function handle_mousedown() {
currbtn = -1;
tooptipHide.value = false;
on("selectstart", window, handle_select, { once: true });
on("mouseup", window, handle_mouseup);
on("mousemove", window, moveAction);
}
function handle_mouseup() {
tooptipHide.value = true;
off("selectstart", document, handle_select);
off("mouseup", window, handle_mouseup);
off("mousemove", window, moveAction);
}
function handle_select(e: Event): void {
e.preventDefault();
}
const tracker = ref<HTMLElement | null>(null);
const emit = defineEmits(["link-val-hook"]);
const tooptipHide = ref<boolean>(true);
function rangeMove(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) {
rv.value[0] = props.min;
} else {
let rate = (distance / tracker_rect.height) * 100;
let idx = -1;
if (currbtn === -1) {
currbtn = moveNeighbors(Math.floor(rate), rv);
idx = currbtn;
} else {
idx = currbtn;
}
calcWithStep(rate, rv, idx);
if (rv.value[1] > props.max) {
rv.value[1] = props.max;
}
if (rv.value[0] < props.min) {
rv.value[0] = props.min;
}
}
emit("link-val-hook", rv.value);
}
function moveNeighbors(rate: number, rangeValues: any) {
let d1 = Math.abs(rate - rangeValues.value[0]);
let d2 = Math.abs(rate - rangeValues.value[1]);
if (d1 > d2) {
return 1;
} else {
return 0;
}
}
function calcWithStep(
rate: number | undefined,
val: Ref<number> | Ref<number[]>,
idx: number = -1
) {
if (typeof rate === "undefined") return false;
if (typeof val.value === "object") {
let r = rate - val.value[idx];
if (Math.abs(r) < props.step) {
return false;
}
if (props.step === 0) val.value[idx] = Math.floor(rate);
if (Array.isArray(val.value)) {
if (r < 0 && props.step !== 0) {
val.value[idx] -= props.step;
} else {
val.value[idx] += props.step;
}
cross(val);
}
}
}
function cross(val: any) {
if (val.value[0] > val.value[1]) {
let tmp = val.value[0];
val.value[0] = val.value[1];
val.value[1] = tmp;
currbtn = currbtn === 0 ? 1 : 0;
}
}
// 断点
const dots = makeDots(props);
const focusDot = (item: number) => {
let currbtn = moveNeighbors(item, rv);
rv.value[currbtn] = item;
emit("link-val-hook", rv.value);
};
</script>
<template>
<div class="layui-slider-vertical">
<div
ref="tracker"
@mousedown.stop="handle_mousedown"
class="layui-slider-vrange"
:class="[disabled ? 'layui-slider-disabled' : '']"
>
<lay-tooltip :content="'' + rv[1]" :is-can-hide="tooptipHide">
<div
:style="{ bottom: rv[1] + '%' }"
class="layui-slider-vertical-btn"
:class="[props.disabled ? 'layui-slider-disabled disable-btn' : '']"
></div>
</lay-tooltip>
<lay-tooltip :content="'' + rv[0]" :is-can-hide="tooptipHide">
<div
:style="{ bottom: rv[0] + '%' }"
class="layui-slider-vertical-btn"
:class="[props.disabled ? 'layui-slider-disabled disable-btn' : '']"
></div>
</lay-tooltip>
<div class="layui-slider-vertical-line"></div>
<div
:style="{
height: rv[1] - rv[0] + '%',
bottom: rv[0] + '%',
}"
class="layui-slider-vertical-rate"
:class="[props.disabled ? 'layui-slider-disabled disable-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>

View File

@@ -0,0 +1,5 @@
import { _ as _sfc_main$2E } from "../checkbox/index2.js";
import { w as withInstall } from "../badge/index2.js";
import "vue";
const component = withInstall(_sfc_main$2E);
export { component as default };

View File

@@ -0,0 +1,16 @@
<script lang="ts">
export default {
name: "AboutIcon",
};
</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-about" />
</template>

View File

@@ -0,0 +1,43 @@
import { w as withInstall } from "../badge/index2.js";
import { defineComponent, useSlots, openBlock, createElementBlock, createElementVNode, renderSlot, normalizeClass, toDisplayString, unref, Fragment, createTextVNode } from "vue";
var index = /* @__PURE__ */ (() => '.lay-page-header{display:flex;line-height:24px}.lay-page-header__left{display:flex;cursor:pointer;margin-right:40px;position:relative;color:var(--global-neutral-color-8)}.lay-page-header__left:after{content:"";position:absolute;width:1px;height:16px;right:-20px;top:50%;transform:translateY(-50%);background-color:var(--global-neutral-color-8)}.lay-page-header__left:hover .layui-icon-return,.lay-page-header__left:hover .lay-page-header__title{color:var(--global-checked-color)!important}.lay-page-header__left .layui-icon-return{font-size:14px;margin-right:6px;align-self:center}.lay-page-header__title{font-size:14px}.lay-page-header__content{font-size:18px;color:#393d49}\n')();
const _hoisted_1 = { class: "lay-page-header" };
const _hoisted_2 = { class: "lay-page-header__title" };
const _hoisted_3 = { class: "lay-page-header__content" };
const __default__ = {
name: "LayPageHeader"
};
const _sfc_main = defineComponent({
...__default__,
props: {
content: { default: "" },
backText: { default: "\u8FD4\u56DE" },
backIcon: { default: "layui-icon-return" }
},
emits: ["back"],
setup(__props, { emit: emits }) {
const slots = useSlots();
return (_ctx, _cache) => {
return openBlock(), createElementBlock("div", _hoisted_1, [
createElementVNode("div", {
class: "lay-page-header__left",
onClick: _cache[0] || (_cache[0] = ($event) => emits("back"))
}, [
renderSlot(_ctx.$slots, "backIcon", {}, () => [
createElementVNode("i", {
class: normalizeClass(["layui-icon", [__props.backIcon]])
}, null, 2)
]),
createElementVNode("div", _hoisted_2, toDisplayString(__props.backText), 1)
]),
createElementVNode("div", _hoisted_3, [
unref(slots).default ? renderSlot(_ctx.$slots, "default", { key: 0 }) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
createTextVNode(toDisplayString(__props.content), 1)
], 64))
])
]);
};
}
});
const component = withInstall(_sfc_main);
export { component as default };

View File

@@ -0,0 +1,16 @@
<script lang="ts">
export default {
name: "AndroidIcon",
};
</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-android" />
</template>

View File

@@ -0,0 +1,78 @@
## Introduction
<p>
<a href="https://www.npmjs.com/package/@layui/layui-vue"><img src="https://img.shields.io/npm/v/@layui/layui-vue.svg?sanitize=true" alt="Version"></a>
<a href="https://www.npmjs.com/package/@layui/layui-vue"><img src="https://img.shields.io/npm/l/@layui/layui-vue.svg?sanitize=true" alt="License"></a>
<a href="https://travis-ci.org/sentsin/layui"><img alt="Build Status" src="https://img.shields.io/travis/sentsin/layui/master.svg"></a>
<a href="https://coveralls.io/r/sentsin/layui?branch=master"><img alt="Test Coverage" src="https://img.shields.io/coveralls/sentsin/layui/master.svg"></a>
</p>
**[🔶 Explore the docs »](http://www.layui-vue.com)** **[Join us](https://jq.qq.com/?_wv=1027&k=ffiUQgnE)**
An enterprise-class UI components based on Layui and Vue.
**Run with code Sandbox.**
[![Edit layui-vue](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/11mvy)
## Features
A few of the things you can do with layui vue:
* Writing components using setup script
* Up to 60 high quality components
* Provide Axure design resources
* Support theme customization
* Support internationalization
## Get Started
Use npm to install.
```bash
npm i @layui/layui-vue
```
Before using, you need to mount layui Vue to Vue and introduce index.css style file
```
import App from './App.vue'
import { createApp } from 'vue'
import layui from '@layui/layui-vue'
import '@layui/layui-vue/lib/index.css'
createApp(App).use(layui).mount('#app')
```
We have several examples on the [website](http://layui-vue.pearadmin.com). Here is the first one to get you started:
```
<template>
<lay-button-container>
<lay-button>Hello Word</lay-button>
</lay-button-container>
</template>
```
## Feedback
Feel free to send us feedback on [file an issue](https://github.com/layui-vue/layui-vue/issues/new). Feature requests are always welcome. If you wish to contribute, please take a quick look at the [guidelines](./CONTRIBUTING.md)!
If there's anything you'd like to chat about, please feel free to join our [Gitter chat](https://gitter.im/layui-vue/community)!
## Build Process
- `build` Packaged component library
Please take a look at the [contributing guidelines](./CONTRIBUTING.md) for a detailed process on how to build your application as well as troubleshooting information.
## Contributors
This project follows the [all-contributors](https://github.com/layui-vue/layui-vue/graphs/contributors) specification and is brought to you by these [awesome contributors](https://github.com/layui-vue/layui-vue/graphs/contributors).
<a href="https://github.com/layui-vue/layui-vue/graphs/contributors">
<img src="https://contrib.rocks/image?repo=layui-vue/layui-vue" />
</a>
## Licence
Layui vue is licensed under the [MIT license](https://opensource.org/licenses/MIT).

View File

@@ -0,0 +1,2 @@
x+)JMU044f040031Q<31><51>KI<4B><49>+)f<>S*<2A>G<EFBFBD>arS͒<53>l<EFBFBD>ڏ<EFBFBD><DA8F><EFBFBD><EFBFBD>}BQSV<53>ʠ߷<>ϟ?{<7B>Z<EFBFBD><5A><EFBFBD>mf<6D><66> WT<57>Z<EFBFBD><5A><EFBFBD><EFBFBD>
2<EFBFBD><EFBFBD><EFBFBD>G<EFBFBD>7]<5D><><EFBFBD>ݭ<EFBFBD><DDAD><<3C>ơ'=<3D>2<>