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

✨(component): update

Browse Source
This commit is contained in:
就眠儀式 2022-10-15 08:58:44 +08:00
parent 8bc1d329cd
commit 8af4ddbf6a
4 changed files with 49 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
package/component/src/component/button/index.vue
View File

@ -8,21 +8,26 @@ export default {
<script setup lang="ts"> <script setup lang="ts">
import "./index.less"; import "./index.less";
import { computed } from "vue"; import { computed } from "vue";
import { ButtonBorder, ButtonEmits, ButtonNativeType, ButtonSize, ButtonType } from "./interface"; import {
import { BooleanOrString, String } from "../../types"; ButtonBorder,
ButtonEmits,
ButtonNativeType,
ButtonSize,
ButtonType,
} from "./interface";
export interface ButtonProps { export interface ButtonProps {
type?: ButtonType; type?: ButtonType;
size?: ButtonSize; size?: ButtonSize;
prefixIcon?: String; prefixIcon?: string;
suffixIcon?: String; suffixIcon?: string;
loadingIcon?: String; loadingIcon?: string;
borderStyle?: String; borderStyle?: string;
border?: ButtonBorder; border?: ButtonBorder;
fluid?: BooleanOrString; fluid?: string | boolean;
radius?: BooleanOrString; radius?: string | boolean;
loading?: BooleanOrString; loading?: string | boolean;
disabled?: BooleanOrString; disabled?: string | boolean;
nativeType?: ButtonNativeType; nativeType?: ButtonNativeType;
} }

13
package/component/src/component/card/index.vue
View File

@ -7,11 +7,10 @@ export default {
<script setup lang="ts"> <script setup lang="ts">
import "./index.less"; import "./index.less";
import { computed, useSlots } from "vue"; import { computed, useSlots } from "vue";
import { String } from "../../types";
import { CardShadow } from "./interface"; import { CardShadow } from "./interface";
export interface CardProps { export interface CardProps {
title?: String; title?: string;
shadow?: CardShadow; shadow?: CardShadow;
} }
@ -19,7 +18,7 @@ const props = withDefaults(defineProps<CardProps>(), {
shadow: "always", shadow: "always",
}); });
const slot = useSlots(); const slots = useSlots();
const classes = computed(() => { const classes = computed(() => {
return { return {
@ -31,19 +30,19 @@ const classes = computed(() => {
<template> <template>
<div class="layui-card" :class="classes"> <div class="layui-card" :class="classes">
<div class="layui-card-header" v-if="slot.title || title || slot.extra"> <div class="layui-card-header" v-if="slots.title || title || slots.extra">
<span class="layui-card-header-title"> <span class="layui-card-header-title">
<slot name="title">{{ title }}</slot> <slot name="title">{{ title }}</slot>
</span> </span>
<span class="layui-card-header-extra" v-if="slot.extra"> <span class="layui-card-header-extra" v-if="slots.extra">
<slot name="extra"></slot> <slot name="extra"></slot>
</span> </span>
</div> </div>
<div class="layui-card-body"> <div class="layui-card-body">
<slot name="body" v-if="slot.body"></slot> <slot name="body" v-if="slots.body"></slot>
<slot v-else></slot> <slot v-else></slot>
</div> </div>
<div class="layui-card-footer" v-if="slot.footer"> <div class="layui-card-footer" v-if="slots.footer">
<slot name="footer"></slot> <slot name="footer"></slot>
</div> </div>
</div> </div>

36
package/component/src/component/carousel/index.vue
View File

@ -6,24 +6,10 @@ export default {
<script setup lang="ts"> <script setup lang="ts">
import "./index.less"; import "./index.less";
import { import { withDefaults, provide, useSlots, ref, computed, VNode, Ref, Component, watch } from "vue";
withDefaults,
provide,
useSlots,
ref,
computed,
VNode,
Ref,
Component,
watch,
} from "vue";
import CarouselItem from "../carouselItem/index.vue"; import CarouselItem from "../carouselItem/index.vue";
const slot = useSlots() as any; export interface CarouselProps {
const slots = slot.default && (slot.default() as any[]);
const props = withDefaults(
defineProps<{
width?: string; width?: string;
height?: string; height?: string;
modelValue: string; modelValue: string;
@ -33,8 +19,9 @@ const props = withDefaults(
interval?: number; interval?: number;
indicator?: string; indicator?: string;
pauseOnHover?: boolean; pauseOnHover?: boolean;
}>(), }
{
const props = withDefaults(defineProps<CarouselProps>(), {
width: "100%", width: "100%",
height: "280px", height: "280px",
anim: "default", anim: "default",
@ -43,8 +30,10 @@ const props = withDefaults(
interval: 3000, interval: 3000,
indicator: "inside", indicator: "inside",
pauseOnHover: true, pauseOnHover: true,
} });
);
const slot = useSlots() as any;
const slots = slot.default && (slot.default() as any[]);
const active = computed({ const active = computed({
get() { get() {
@ -55,12 +44,7 @@ const active = computed({
}, },
}); });
const anim = computed({ const anim = computed(() => props.anim);
get() {
return props.anim;
},
set() {},
});
const emit = defineEmits(["update:modelValue", "change"]); const emit = defineEmits(["update:modelValue", "change"]);