theluyuan/layui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

✨(component): 整理 tag 组件类型

Browse Source
This commit is contained in:
就眠儀式 2022-10-18 00:59:40 +08:00
parent 8e46f6f6b2
commit b077d81569
5 changed files with 18 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
package/component/src/component/splitPanelItem/index.vue
View File

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

4
package/component/src/component/step/index.vue
View File

@ -8,7 +8,7 @@ export default {
import { ref, watch, provide, withDefaults } from "vue"; import { ref, watch, provide, withDefaults } from "vue";
import "./index.less"; import "./index.less";
export interface LayStepProps { export interface StepProps {
active?: number; active?: number;
center?: boolean; center?: boolean;
direction?: string; direction?: string;
@ -18,7 +18,7 @@ export interface LayStepProps {
simple?: boolean; simple?: boolean;
} }
const props = withDefaults(defineProps<LayStepProps>(), { const props = withDefaults(defineProps<StepProps>(), {
active: 0, active: 0,
center: false, center: false,
direction: "horizontal", direction: "horizontal",

4
package/component/src/component/stepItem/index.vue
View File

@ -18,14 +18,14 @@ import {
import { LayIcon } from "@layui/icons-vue"; import { LayIcon } from "@layui/icons-vue";
import type { ComputedRef } from "vue"; import type { ComputedRef } from "vue";
export interface LayStepItemProps { export interface StepItemProps {
title?: string; title?: string;
content?: string; content?: string;
icon?: string; icon?: string;
status?: string; status?: string;
} }
const props = withDefaults(defineProps<LayStepItemProps>(), { const props = withDefaults(defineProps<StepItemProps>(), {
title: "", title: "",
content: "", content: "",
icon: "", icon: "",

17
package/component/src/component/tag/index.vue
View File

@ -8,21 +8,21 @@ import "./index.less";
import { LayIcon } from "@layui/icons-vue"; import { LayIcon } from "@layui/icons-vue";
import { computed, ref } from "vue"; import { computed, ref } from "vue";
import { TinyColor } from "@ctrl/tinycolor"; import { TinyColor } from "@ctrl/tinycolor";
import { tagType } from "./interface"; import { TagShape, TagType, TagVariant } from "./interface";
export interface LayTagProps { export interface TagProps {
type?: tagType; type?: TagType;
color?: string; color?: string;
closable?: boolean; closable?: boolean;
size?: string; size?: string;
bordered?: boolean; bordered?: boolean;
disabled?: boolean; disabled?: boolean;
shape?: "square" | "round"; shape?: TagShape;
maxWidth?: string; maxWidth?: string;
variant?: "dark" | "light" | "plain"; variant?: TagVariant;
} }
const props = withDefaults(defineProps<LayTagProps>(), { const props = withDefaults(defineProps<TagProps>(), {
size: "md", size: "md",
shape: "square", shape: "square",
variant: "dark", variant: "dark",
@ -35,7 +35,6 @@ const visible = ref(true);
const handleClose = (e: MouseEvent) => { const handleClose = (e: MouseEvent) => {
if (props.disabled) return; if (props.disabled) return;
//visible.value = false;
emit("close", e); emit("close", e);
}; };
@ -61,7 +60,7 @@ const styleTag = computed(() => [
}, },
]); ]);
function useTagCustomStyle(props: LayTagProps) { function useTagCustomStyle(props: TagProps) {
return computed(() => { return computed(() => {
let styles: Record<string, string> = {}; let styles: Record<string, string> = {};
@ -120,4 +119,4 @@ function useTagCustomStyle(props: LayTagProps) {
</slot> </slot>
</span> </span>
</span> </span>
</template> </template>

6
package/component/src/component/tag/interface.ts
View File

@ -1,3 +1,7 @@
export const TAG_COLORS = ["primary", "normal", "warm", "danger"] as const; export const TAG_COLORS = ["primary", "normal", "warm", "danger"] as const;
export type tagType = typeof TAG_COLORS[number]; export type TagType = typeof TAG_COLORS[number];
export type TagShape = "square" | "round";
export type TagVariant = "dark" | "light" | "plain";