✨(component): 完善 ts 类型
This commit is contained in:
parent
dbf9374b6b
commit
e8f8c8c2ea
@ -1,5 +1,5 @@
|
|||||||
export type ButtonType = "primary" | "normal" | "warm" | "danger";
|
export type ButtonType = "primary" | "normal" | "warm" | "danger";
|
||||||
export type ButtonSize = "lg" | "sm" | "xs";
|
export type ButtonSize = "lg" | "md" | "sm" | "xs";
|
||||||
export type ButtonBorder = "green" | "blue" | "orange" | "red" | "black";
|
export type ButtonBorder = "green" | "blue" | "orange" | "red" | "black";
|
||||||
export type ButtonNativeType = "button" | "submit" | "reset";
|
export type ButtonNativeType = "button" | "submit" | "reset";
|
||||||
|
|
||||||
|
@ -74,10 +74,11 @@ import LayInput from "../input/index.vue";
|
|||||||
import LayScroll from "../scroll/index.vue";
|
import LayScroll from "../scroll/index.vue";
|
||||||
import LayDropdown from "../dropdown/index.vue";
|
import LayDropdown from "../dropdown/index.vue";
|
||||||
import { ref, onMounted, watch, useSlots } from "vue";
|
import { ref, onMounted, watch, useSlots } from "vue";
|
||||||
|
import { CascaderSize } from "./interface";
|
||||||
|
|
||||||
export type DropdownTrigger = "click" | "hover" | "focus" | "contextMenu";
|
export type DropdownTrigger = "click" | "hover" | "focus" | "contextMenu";
|
||||||
|
|
||||||
export interface LayCascaderProps {
|
export interface CascaderProps {
|
||||||
options?: Array<any> | null;
|
options?: Array<any> | null;
|
||||||
modelValue?: string;
|
modelValue?: string;
|
||||||
decollator?: string;
|
decollator?: string;
|
||||||
@ -85,11 +86,11 @@ export interface LayCascaderProps {
|
|||||||
onlyLastLevel?: boolean;
|
onlyLastLevel?: boolean;
|
||||||
replaceFields?: { label: string; value: string; children: string };
|
replaceFields?: { label: string; value: string; children: string };
|
||||||
allowClear?: boolean;
|
allowClear?: boolean;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: CascaderSize;
|
||||||
trigger?: DropdownTrigger | DropdownTrigger[];
|
trigger?: DropdownTrigger | DropdownTrigger[];
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayCascaderProps>(), {
|
const props = withDefaults(defineProps<CascaderProps>(), {
|
||||||
options: null,
|
options: null,
|
||||||
modelValue: "",
|
modelValue: "",
|
||||||
decollator: "/",
|
decollator: "/",
|
||||||
|
1
package/component/src/component/cascader/interface.ts
Normal file
1
package/component/src/component/cascader/interface.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export type CascaderSize = "lg" | "md" | "sm" | "xs";
|
@ -8,6 +8,7 @@ export default {
|
|||||||
import { LayIcon } from "@layui/icons-vue";
|
import { LayIcon } from "@layui/icons-vue";
|
||||||
import { computed, inject, useSlots } from "vue";
|
import { computed, inject, useSlots } from "vue";
|
||||||
import "./index.less";
|
import "./index.less";
|
||||||
|
import { CheckboxSize } from "./interface";
|
||||||
|
|
||||||
export interface LayCheckboxProps {
|
export interface LayCheckboxProps {
|
||||||
name?: string;
|
name?: string;
|
||||||
@ -17,7 +18,7 @@ export interface LayCheckboxProps {
|
|||||||
isIndeterminate?: boolean;
|
isIndeterminate?: boolean;
|
||||||
modelValue?: boolean | Array<string | number | object>;
|
modelValue?: boolean | Array<string | number | object>;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: CheckboxSize;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayCheckboxProps>(), {
|
const props = withDefaults(defineProps<LayCheckboxProps>(), {
|
||||||
|
@ -0,0 +1 @@
|
|||||||
|
export type CheckboxSize = "lg" | "md" | "sm" | "xs";
|
@ -29,7 +29,7 @@ provide("checkboxGroup", {
|
|||||||
});
|
});
|
||||||
|
|
||||||
watch(
|
watch(
|
||||||
() => modelValue,
|
() => modelValue,
|
||||||
(val) => {
|
(val) => {
|
||||||
emit("change", modelValue.value);
|
emit("change", modelValue.value);
|
||||||
emit("update:modelValue", modelValue.value);
|
emit("update:modelValue", modelValue.value);
|
||||||
|
@ -8,25 +8,25 @@ export default {
|
|||||||
import "./index.less";
|
import "./index.less";
|
||||||
import { withDefaults, provide, ref, watch } from "vue";
|
import { withDefaults, provide, ref, watch } from "vue";
|
||||||
|
|
||||||
export interface LayCollapseProps {
|
export interface CollapseProps {
|
||||||
modelValue?: number | string | [];
|
|
||||||
accordion?: boolean;
|
accordion?: boolean;
|
||||||
|
modelValue?: number | string | number[] | string[];
|
||||||
collapseTransition?: boolean;
|
collapseTransition?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayCollapseProps>(), {
|
const props = withDefaults(defineProps<CollapseProps>(), {
|
||||||
modelValue: () => [],
|
modelValue: () => [],
|
||||||
accordion: false,
|
accordion: false,
|
||||||
collapseTransition: true,
|
collapseTransition: true,
|
||||||
});
|
});
|
||||||
|
|
||||||
// 监听传入的值
|
|
||||||
watch(
|
watch(
|
||||||
() => props.modelValue,
|
() => props.modelValue,
|
||||||
(val, oldVal) => {
|
(val) => {
|
||||||
activeValues.value = ([] as any[]).concat(val);
|
activeValues.value = ([] as any[]).concat(val);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
const emit = defineEmits(["update:modelValue", "change"]);
|
const emit = defineEmits(["update:modelValue", "change"]);
|
||||||
|
|
||||||
const activeValues = ref<Array<any>>(([] as any[]).concat(props.modelValue));
|
const activeValues = ref<Array<any>>(([] as any[]).concat(props.modelValue));
|
||||||
|
@ -8,13 +8,13 @@ export default {
|
|||||||
import LayTransition from "../transition/index.vue";
|
import LayTransition from "../transition/index.vue";
|
||||||
import { withDefaults, inject, computed, ref } from "vue";
|
import { withDefaults, inject, computed, ref } from "vue";
|
||||||
|
|
||||||
export interface LayCollapseItemProps {
|
export interface CollapseItemProps {
|
||||||
id: number | string;
|
id: number | string;
|
||||||
title: string;
|
title: string;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayCollapseItemProps>(), {
|
const props = withDefaults(defineProps<CollapseItemProps>(), {
|
||||||
disabled: false,
|
disabled: false,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -41,12 +41,9 @@ const props = withDefaults(defineProps<LayCountupProps>(), {
|
|||||||
let localStartVal: Ref<number> = ref(props.startVal);
|
let localStartVal: Ref<number> = ref(props.startVal);
|
||||||
const isNumber = (val: string) => !isNaN(parseFloat(val));
|
const isNumber = (val: string) => !isNaN(parseFloat(val));
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* from: https://github.com/PanJiaChen/vue-countTo/blob/master/src/vue-countTo.vue
|
* from: https://github.com/PanJiaChen/vue-countTo/blob/master/src/vue-countTo.vue
|
||||||
* @description 格式化数字
|
* */
|
||||||
* @param num 要格式化的数字
|
|
||||||
* @returns 格式化后的数字
|
|
||||||
*/
|
|
||||||
const formatNumber = (num: number | string): string => {
|
const formatNumber = (num: number | string): string => {
|
||||||
if (typeof num != "number") return "0";
|
if (typeof num != "number") return "0";
|
||||||
num = num.toFixed(props.decimalPlaces);
|
num = num.toFixed(props.decimalPlaces);
|
||||||
@ -69,6 +66,7 @@ const printVal = useTransition(localStartVal, {
|
|||||||
disabled: !props.useEasing,
|
disabled: !props.useEasing,
|
||||||
transition:
|
transition:
|
||||||
typeof props.easingFn === "string"
|
typeof props.easingFn === "string"
|
||||||
|
// @ts-ignore
|
||||||
? TransitionPresets[props.easingFn]
|
? TransitionPresets[props.easingFn]
|
||||||
: props.easingFn,
|
: props.easingFn,
|
||||||
});
|
});
|
||||||
|
@ -11,6 +11,7 @@ import { computed, ref, useSlots, watch } from "vue";
|
|||||||
import { useI18n } from "../../language";
|
import { useI18n } from "../../language";
|
||||||
import PasswordIcon from "./svg/Password.vue";
|
import PasswordIcon from "./svg/Password.vue";
|
||||||
import UnPasswordIcon from "./svg/unPassword.vue";
|
import UnPasswordIcon from "./svg/unPassword.vue";
|
||||||
|
import { InputSize } from "./interface";
|
||||||
|
|
||||||
export interface LayInputProps {
|
export interface LayInputProps {
|
||||||
name?: string;
|
name?: string;
|
||||||
@ -25,7 +26,7 @@ export interface LayInputProps {
|
|||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
readonly?: boolean;
|
readonly?: boolean;
|
||||||
password?: boolean;
|
password?: boolean;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: InputSize;
|
||||||
maxlength?: number;
|
maxlength?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
1
package/component/src/component/input/interface.ts
Normal file
1
package/component/src/component/input/interface.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export type InputSize = "lg" | "md" | "sm" | "xs";
|
@ -10,6 +10,7 @@ import layInput from "../input/index.vue";
|
|||||||
import { LayIcon } from "@layui/icons-vue";
|
import { LayIcon } from "@layui/icons-vue";
|
||||||
import layButton from "../button/index.vue";
|
import layButton from "../button/index.vue";
|
||||||
import { ref, watch, withDefaults, computed, Ref } from "vue";
|
import { ref, watch, withDefaults, computed, Ref } from "vue";
|
||||||
|
import { InputNumberSize } from "./interface";
|
||||||
|
|
||||||
export interface LayInputNumberProps {
|
export interface LayInputNumberProps {
|
||||||
modelValue?: number;
|
modelValue?: number;
|
||||||
@ -20,7 +21,7 @@ export interface LayInputNumberProps {
|
|||||||
position?: "right";
|
position?: "right";
|
||||||
min?: number;
|
min?: number;
|
||||||
max?: number;
|
max?: number;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: InputNumberSize;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayInputNumberProps>(), {
|
const props = withDefaults(defineProps<LayInputNumberProps>(), {
|
||||||
|
1
package/component/src/component/inputNumber/interface.ts
Normal file
1
package/component/src/component/inputNumber/interface.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export type InputNumberSize = "lg" | "md" | "sm" | "xs";
|
@ -1,5 +1,6 @@
|
|||||||
<script lang="ts">
|
<script lang="ts">
|
||||||
import { computed, inject } from "vue";
|
import { computed, inject } from "vue";
|
||||||
|
import { RadioSize } from "./interface";
|
||||||
export default {
|
export default {
|
||||||
name: "LayRadio",
|
name: "LayRadio",
|
||||||
};
|
};
|
||||||
@ -10,7 +11,7 @@ import "./index.less";
|
|||||||
|
|
||||||
export interface LayRadioProps {
|
export interface LayRadioProps {
|
||||||
name?: string;
|
name?: string;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: RadioSize;
|
||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
modelValue?: string | boolean | number;
|
modelValue?: string | boolean | number;
|
||||||
value?: string | boolean | number;
|
value?: string | boolean | number;
|
||||||
|
@ -0,0 +1 @@
|
|||||||
|
export type RadioSize = "lg" | "md" | "sm" | "xs";
|
@ -8,7 +8,7 @@ export default {
|
|||||||
import { computed, onMounted, ref, watch } from "vue";
|
import { computed, onMounted, ref, watch } from "vue";
|
||||||
import "./index.less";
|
import "./index.less";
|
||||||
|
|
||||||
export interface LayRippletProps {
|
export interface RippleProps {
|
||||||
type?: "out" | "inset";
|
type?: "out" | "inset";
|
||||||
color?: string;
|
color?: string;
|
||||||
borderRadius?: string;
|
borderRadius?: string;
|
||||||
@ -18,7 +18,7 @@ export interface LayRippletProps {
|
|||||||
center?: boolean;
|
center?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
const props = withDefaults(defineProps<LayRippletProps>(), {
|
const props = withDefaults(defineProps<RippleProps>(), {
|
||||||
type: "inset",
|
type: "inset",
|
||||||
color: "currentColor",
|
color: "currentColor",
|
||||||
borderRadius: "0",
|
borderRadius: "0",
|
||||||
|
@ -28,6 +28,7 @@ import LaySelectOption, {
|
|||||||
LaySelectOptionProps,
|
LaySelectOptionProps,
|
||||||
} from "../selectOption/index.vue";
|
} from "../selectOption/index.vue";
|
||||||
import { arrayExpression } from "@babel/types";
|
import { arrayExpression } from "@babel/types";
|
||||||
|
import { SelectSize } from "./interface";
|
||||||
|
|
||||||
export interface LaySelectProps {
|
export interface LaySelectProps {
|
||||||
name?: string;
|
name?: string;
|
||||||
@ -39,7 +40,7 @@ export interface LaySelectProps {
|
|||||||
modelValue?: any;
|
modelValue?: any;
|
||||||
multiple?: boolean;
|
multiple?: boolean;
|
||||||
items?: LaySelectOptionProps[];
|
items?: LaySelectOptionProps[];
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: SelectSize;
|
||||||
collapseTagsTooltip?: boolean;
|
collapseTagsTooltip?: boolean;
|
||||||
minCollapsedNum?: number;
|
minCollapsedNum?: number;
|
||||||
allowClear?: boolean;
|
allowClear?: boolean;
|
||||||
|
1
package/component/src/component/select/interface.ts
Normal file
1
package/component/src/component/select/interface.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export type SelectSize = "lg" | "md" | "sm" | "xs";
|
@ -18,6 +18,7 @@ import {
|
|||||||
} from "vue";
|
} from "vue";
|
||||||
import { isObject, reactiveOmit, useResizeObserver } from "@vueuse/core";
|
import { isObject, reactiveOmit, useResizeObserver } from "@vueuse/core";
|
||||||
import { LayIcon } from "@layui/icons-vue";
|
import { LayIcon } from "@layui/icons-vue";
|
||||||
|
import { TagInputSize } from "./inerface";
|
||||||
|
|
||||||
export interface TagData {
|
export interface TagData {
|
||||||
value?: string | number;
|
value?: string | number;
|
||||||
@ -36,7 +37,7 @@ export interface LayTagInputProps {
|
|||||||
max?: number;
|
max?: number;
|
||||||
minCollapsedNum?: number;
|
minCollapsedNum?: number;
|
||||||
collapseTagsTooltip?: boolean;
|
collapseTagsTooltip?: boolean;
|
||||||
size?: "lg" | "md" | "sm" | "xs";
|
size?: TagInputSize;
|
||||||
tagProps?: LayTagProps;
|
tagProps?: LayTagProps;
|
||||||
disabledInput?: boolean;
|
disabledInput?: boolean;
|
||||||
}
|
}
|
||||||
|
1
package/component/src/component/tagInput/inerface.ts
Normal file
1
package/component/src/component/tagInput/inerface.ts
Normal file
@ -0,0 +1 @@
|
|||||||
|
export type TagInputSize = "lg" | "md" | "sm" | "xs";
|
Loading…
Reference in New Issue
Block a user