(component): 修复 slider 警告

This commit is contained in:
就眠儀式 2022-10-18 00:39:03 +08:00
parent d9116dc47e
commit e141750076
34 changed files with 81 additions and 80 deletions

View File

@ -30,8 +30,8 @@ const classes = computed(() => {
});
const styles = computed<StyleValue>(() => {
return [props.color ? `background-color: ${props.color}` : ""];
});
return [props.color ? `background-color: ${props.color}` : ""]
})
</script>
<template>

View File

@ -72,7 +72,7 @@ const selectedKey = computed({
const indent = computed(() => {
return props.indent;
})
});
watch(
() => props.collapse,

View File

@ -67,7 +67,7 @@ import LayCarousel from "../carousel/index.vue";
import LayCarouselItem from "../carouselItem/index.vue";
import { LayIcon } from "@layui/icons-vue";
export interface LayNoticeBarProps {
export interface NoticeBarProps {
mode?: string;
text?: string;
textlist?: any[];
@ -82,7 +82,7 @@ export interface LayNoticeBarProps {
rightIcon?: string;
}
const props = withDefaults(defineProps<LayNoticeBarProps>(), {
const props = withDefaults(defineProps<NoticeBarProps>(), {
color: () => "var(--color-warning)",
background: () => "var(--color-warning-light-9)",
text: "",

View File

@ -9,7 +9,7 @@ import "./index.less";
import { Ref, ref, watch, useSlots, computed } from "vue";
import { useI18n } from "../../language";
export interface LayPageProps {
export interface PageProps {
total: number;
limit: number;
theme?: string;
@ -24,7 +24,7 @@ export interface LayPageProps {
modelValue?: number;
}
const props = withDefaults(defineProps<LayPageProps>(), {
const props = withDefaults(defineProps<PageProps>(), {
limit: 10,
pages: 10,
modelValue: 1,

View File

@ -20,11 +20,11 @@ export default {
import { useSlots } from "vue";
import "./index.less";
export interface LayPageHeaderProps {
export interface PageHeaderProps {
content?: string;
backText?: string;
}
const props = withDefaults(defineProps<LayPageHeaderProps>(), {
const props = withDefaults(defineProps<PageHeaderProps>(), {
content: "",
backText: "返回",
});

View File

@ -9,11 +9,11 @@ import "./index.less";
import { computed } from "vue";
import { PanelShadow } from "./interface";
export interface LayPanelProps {
export interface PanelProps {
shadow?: PanelShadow;
}
const props = withDefaults(defineProps<LayPanelProps>(), {
const props = withDefaults(defineProps<PanelProps>(), {
shadow: "always",
});

View File

@ -44,10 +44,9 @@ import {
useResizeObserver,
useThrottleFn,
} from "@vueuse/core";
import { PopperTrigger } from '../tooltip/index.vue';
export type PopperTrigger = "click" | "hover" | "focus" | "contextMenu";
export interface LayPopperProps {
export interface PopperProps {
el: HTMLElement;
content?: string | Number;
position?: string;
@ -62,7 +61,7 @@ export interface LayPopperProps {
popperStyle?: StyleValue;
}
const props = withDefaults(defineProps<LayPopperProps>(), {
const props = withDefaults(defineProps<PopperProps>(), {
position: "top",
isDark: true,
disabled: false,

View File

@ -0,0 +1 @@
export type PopperTrigger = "click" | "hover" | "focus" | "contextMenu";

View File

@ -8,7 +8,7 @@ export default {
import "./index.less";
import { computed } from "vue";
export interface LayProgressProps {
export interface ProgressProps {
percent: number | string;
theme?: string;
color?: string;
@ -20,7 +20,7 @@ export interface LayProgressProps {
circleWidth?: number;
}
const props = withDefaults(defineProps<LayProgressProps>(), {
const props = withDefaults(defineProps<ProgressProps>(), {
circle: false,
circleSize: 150,
circleWidth: 6,
@ -140,4 +140,4 @@ const getPathD = computed(() => {
</span>
</div>
</div>
</template>
</template>

View File

@ -7,11 +7,11 @@ export default {
<script setup lang="ts">
import "./index.less";
export interface LayQuoteProps {
export interface QuoteProps {
type?: string;
}
const props = defineProps<LayQuoteProps>();
const props = defineProps<QuoteProps>();
</script>
<template>

View File

@ -9,7 +9,7 @@ export default {
<script setup lang="ts">
import "./index.less";
export interface LayRadioProps {
export interface RadioProps {
name?: string;
size?: RadioSize;
disabled?: boolean;
@ -18,7 +18,7 @@ export interface LayRadioProps {
label?: string;
}
const props = withDefaults(defineProps<LayRadioProps>(), {
const props = withDefaults(defineProps<RadioProps>(), {
size: "md",
});

View File

@ -7,13 +7,13 @@ export default {
<script setup lang="ts">
import { provide, ref, watch } from "vue";
export interface LayRadioGroupProps {
export interface RadioGroupProps {
modelValue?: string | boolean | number;
name?: string;
disabled?: boolean;
}
const props = withDefaults(defineProps<LayRadioGroupProps>(), {
const props = withDefaults(defineProps<RadioGroupProps>(), {
disabled: false,
});
@ -21,6 +21,7 @@ const emit = defineEmits(["update:modelValue", "change"]);
const modelValue = ref(props.modelValue);
const disabled = ref(props.disabled);
provide("radioGroup", {
name: "LayRadioGroup",
modelValue: modelValue,

View File

@ -8,7 +8,7 @@ export default {
import { computed, ref, watch, withDefaults } from "vue";
import "./index.less";
export interface LayRateProps {
export interface RateProps {
theme?: string;
length?: number;
modelValue: number;
@ -21,7 +21,7 @@ export interface LayRateProps {
icons?: string[];
}
const props = withDefaults(defineProps<LayRateProps>(), {
const props = withDefaults(defineProps<RateProps>(), {
length: 5,
modelValue: 0,
readonly: false,

View File

@ -8,7 +8,7 @@ export default {
import "./index.less";
import { useSlots } from "vue";
export interface LayResultProps {
export interface ResultProps {
title?: string;
status?: "success" | "failure";
describe?: string;
@ -16,7 +16,7 @@ export interface LayResultProps {
const slots = useSlots();
const props = withDefaults(defineProps<LayResultProps>(), {
const props = withDefaults(defineProps<ResultProps>(), {
title: "提交信息",
status: "success",
describe: "请核对并修改以下信息后,再重新提交。",

View File

@ -7,14 +7,15 @@ export default {
<script setup lang="ts">
import { computed, onMounted, ref, watch } from "vue";
import "./index.less";
import { RippleTrigger, RippleType } from "./interface";
export interface RippleProps {
type?: "out" | "inset";
type?: RippleType;
color?: string;
borderRadius?: string;
spreadWidth?: string;
spreadSize?: string;
trigger?: "always" | "mouseenter" | "click";
trigger?: RippleTrigger;
center?: boolean;
}
@ -128,4 +129,4 @@ watch(
></div>
<slot></slot>
</div>
</template>
</template>

View File

@ -0,0 +1,2 @@
export type RippleType = "out" | "inset";
export type RippleTrigger = "always" | "mouseenter" | "click"

View File

@ -8,11 +8,11 @@ export default {
import { computed } from "vue";
import "./index.less";
export interface LayRowProps {
export interface RowProps {
space?: string | number;
}
const props = defineProps<LayRowProps>();
const props = defineProps<RowProps>();
const classes = computed(() => {
return [props.space ? `layui-col-space${props.space}` : ""];

View File

@ -38,16 +38,16 @@ export default {
<script lang="ts" setup>
import "./index.less";
import { toRefs, onMounted, nextTick, reactive, onUnmounted, ref } from "vue";
import { onMounted, nextTick, reactive, onUnmounted, ref } from "vue";
export interface LayScrollProps {
export interface ScrollProps {
height?: string;
trackColor?: string;
thumbColor?: string;
thumbWidth?: number;
}
const props = withDefaults(defineProps<LayScrollProps>(), {
const props = withDefaults(defineProps<ScrollProps>(), {
height: "100%",
trackColor: "rgba(0,0,0,0)",
thumbColor: "#eeeeee",
@ -103,7 +103,9 @@ const monitorScrollBar = function () {
// @ts-ignore
let MutationObserver =
window.MutationObserver ||
// @ts-ignore
window.WebKitMutationObserver ||
// @ts-ignore
window.MozMutationObserver;
const observer: any = new MutationObserver((mutations) => {
initScrollListner();

View File

@ -27,10 +27,9 @@ import LayDropdown from "../dropdown/index.vue";
import LaySelectOption, {
LaySelectOptionProps,
} from "../selectOption/index.vue";
import { arrayExpression } from "@babel/types";
import { SelectSize } from "./interface";
export interface LaySelectProps {
export interface SelectProps {
name?: string;
disabled?: boolean;
placeholder?: string;
@ -53,7 +52,7 @@ export interface SelectEmits {
(e: "search", value: string): void;
}
const props = withDefaults(defineProps<LaySelectProps>(), {
const props = withDefaults(defineProps<SelectProps>(), {
modelValue: null,
placeholder: "请选择",
showEmpty: true,

View File

@ -16,25 +16,22 @@ import {
useSlots,
} from "vue";
export interface LaySelectOptionProps {
export interface SelectOptionProps {
label?: string;
value: string | number | object;
disabled?: boolean;
keyword?: string;
}
const props = withDefaults(defineProps<LaySelectOptionProps>(), {
const props = withDefaults(defineProps<SelectOptionProps>(), {
disabled: false,
keyword: "",
label: "",
});
const openState: Ref<boolean> = inject("openState") as Ref<boolean>;
const selectedValue: WritableComputedRef<any> = inject(
"selectedValue"
) as WritableComputedRef<any>;
const searchValue: Ref<string> = inject("searchValue") as Ref<string>;
const selectRef: Ref<HTMLElement> = inject("selectRef") as Ref<HTMLElement>;
const selectedValue: WritableComputedRef<any> = inject("selectedValue") as WritableComputedRef<any>;
const multiple: ComputedRef = inject("multiple") as ComputedRef;
const handleSelect = () => {

View File

@ -8,11 +8,11 @@ export default {
import { computed, CSSProperties } from "vue";
import "./index.less";
export interface LaySideProps {
export interface SideProps {
width?: string | number;
}
const props = withDefaults(defineProps<LaySideProps>(), {
const props = withDefaults(defineProps<SideProps>(), {
width: "200px",
});

View File

@ -9,13 +9,13 @@ import "./index.less";
import { withDefaults } from "vue";
import LaySkeletonItem from "../skeletonItem/index.vue";
export interface LaySkeletonProps {
export interface SkeletonProps {
rows?: number;
loading?: boolean;
animated?: boolean;
}
const props = withDefaults(defineProps<LaySkeletonProps>(), {
const props = withDefaults(defineProps<SkeletonProps>(), {
rows: 4,
loading: false,
animated: false,

View File

@ -8,11 +8,11 @@ export default {
import { withDefaults } from "vue";
import { LayIcon } from "@layui/icons-vue";
export interface LaySkeletonProps {
export interface SkeletonProps {
type?: string;
}
const props = withDefaults(defineProps<LaySkeletonProps>(), {
const props = withDefaults(defineProps<SkeletonProps>(), {
type: "p",
});
</script>

View File

@ -1,17 +1,16 @@
<script lang="ts">
export default {
name: "StandardVue",
};
}
</script>
<script setup lang="ts">
import { Ref, ref } from "vue";
import { on, off } from "evtd";
// import { throttle, handle_select } from "./utils/index";
import LayTooltip from "../tooltip/index.vue";
import { throttle, handle_select, makeDots } from "./utils/index";
interface Prop {
export interface StandardProps {
val?: number | Array<number>;
disabled?: boolean;
step?: number;
@ -20,7 +19,7 @@ interface Prop {
showDots?: boolean;
}
const props = withDefaults(defineProps<Prop>(), {
const props = withDefaults(defineProps<StandardProps>(), {
disabled: false,
val: 0,
step: 0,
@ -47,7 +46,7 @@ function handle_mousedown() {
const tracker = ref<HTMLElement | null>(null);
let standard_style: Ref<number> = ref<number>(props.val as number);
const emit = defineEmits(["link-val-hook"]);
const tooptipHide = ref<Boolean>(true);
const tooptipHide = ref<boolean>(true);
function standardMove(e: MouseEvent) {
tooptipHide.value = false;

View File

@ -1,16 +1,16 @@
<script lang="ts">
export default {
name: "StandardRange",
};
}
</script>
<script setup lang="ts">
import { ref, toRef, Ref } from "vue";
import { on, off } from "evtd";
// import { throttle } from "./utils/index";
import LayTooltip from "../tooltip/index.vue";
import { throttle, makeDots } from "./utils/index";
interface Prop {
export interface StandardRangeProps {
rangeValue: Array<number>;
disabled?: boolean;
step?: number;
@ -19,7 +19,7 @@ interface Prop {
showDots?: boolean;
}
const props = withDefaults(defineProps<Prop>(), {
const props = withDefaults(defineProps<StandardRangeProps>(), {
step: 0,
min: 0,
max: 100,
@ -53,7 +53,7 @@ function handle_select(e: Event): void {
const tracker = ref<HTMLElement | null>(null);
const emit = defineEmits(["link-val-hook"]);
const tooptipHide = ref<Boolean>(true);
const tooptipHide = ref<boolean>(true);
function rangeMove(e: MouseEvent) {
// tooptipHide.value = false;

View File

@ -1,7 +1,7 @@
<script lang="ts">
export default {
name: "Vertical",
};
}
</script>
<script setup lang="ts">
@ -10,7 +10,7 @@ import { on, off } from "evtd";
import { throttle } from "./utils/index";
import LayTooltip from "../tooltip/index.vue";
interface Prop {
export interface VerticalProps {
val?: number | Array<number>;
disabled?: boolean;
step?: number;
@ -19,7 +19,7 @@ interface Prop {
showDots: boolean;
}
const props = withDefaults(defineProps<Prop>(), {
const props = withDefaults(defineProps<VerticalProps>(), {
disabled: true,
val: 0,
step: 0,
@ -49,7 +49,7 @@ function handle_mousedown() {
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);
const tooptipHide = ref<boolean>(true);
function verticalMove(e: MouseEvent) {
tooptipHide.value = false;

View File

@ -1,16 +1,16 @@
<script lang="ts">
export default {
name: "VerticalRange",
};
}
</script>
<script setup lang="ts">
import { ref, toRef, Ref } from "vue";
import { on, off } from "evtd";
// import { throttle } from "./utils/index";
import LayTooltip from "../tooltip/index.vue";
import { throttle, makeDots } from "./utils/index";
interface Prop {
export interface VerticalRangeProps {
rangeValue: Array<number>;
disabled?: boolean;
step?: number;
@ -19,7 +19,7 @@ interface Prop {
showDots?: boolean;
}
const props = withDefaults(defineProps<Prop>(), {
const props = withDefaults(defineProps<VerticalRangeProps>(), {
step: 0,
min: 0,
max: 100,
@ -52,7 +52,7 @@ function handle_select(e: Event): void {
const tracker = ref<HTMLElement | null>(null);
const emit = defineEmits(["link-val-hook"]);
const tooptipHide = ref<Boolean>(true);
const tooptipHide = ref<boolean>(true);
function rangeMove(e: MouseEvent) {
// tooptipHide.value = false;

View File

@ -12,7 +12,7 @@ import StandardRange from "./StandardRange.vue";
import Vertical from "./Vertical.vue";
import VerticalRange from "./VerticalRange.vue";
export interface LaySliderProps {
export interface SliderProps {
vertical?: boolean;
modelValue?: number | Array<number>;
min?: number;
@ -26,7 +26,7 @@ export interface LaySliderProps {
const emit = defineEmits(["update:modelValue"]);
const props = withDefaults(defineProps<LaySliderProps>(), {
const props = withDefaults(defineProps<SliderProps>(), {
vertical: false,
modelValue: 0,
disabled: false,

View File

@ -25,4 +25,4 @@ export function makeDots(props: any) {
}
dots.push(100);
return dots;
}
}

View File

@ -1 +1 @@
export type SwitchSize = "lg" | "md" | "sm" | "xs";
export type SwitchSize = "lg" | "md" | "sm" | "xs";

View File

@ -16,4 +16,4 @@ export interface TabsContext {
removeItem: (id: string) => void;
}
export type TabPosition = "top" | "bottom" | "left" | "right";
export type TabPosition = "top" | "bottom" | "left" | "right";

View File

@ -9,7 +9,7 @@ import { LayIcon } from "@layui/icons-vue";
import LayPage from "../page/index.vue";
import { computed, WritableComputedRef } from "vue";
export interface LayTablePageProps {
export interface TablePageProps {
showPage?: boolean;
showSkip?: boolean;
showLimit?: boolean;
@ -23,7 +23,7 @@ export interface LayTablePageProps {
theme?: string;
}
const props = withDefaults(defineProps<LayTablePageProps>(), {
const props = withDefaults(defineProps<TablePageProps>(), {
showPage: true,
showLimit: true,
showSkip: true,

View File

@ -12,7 +12,7 @@ import LayCheckbox from "../checkbox/index.vue";
import LayTooltip from "../tooltip/index.vue";
import LayRadio from "../radio/index.vue";
export interface LayTableRowProps {
export interface TableRowProps {
index: number;
indentSize: number;
currentIndentSize: number;
@ -48,7 +48,7 @@ const emit = defineEmits([
"update:selectedKey",
]);
const props = withDefaults(defineProps<LayTableRowProps>(), {
const props = withDefaults(defineProps<TableRowProps>(), {
checkbox: false,
childrenColumnName: "children",
cellStyle: "",

View File

@ -909,4 +909,4 @@ onBeforeUnmount(() => {
</div>
</div>
</div>
</template>
</template>