refactor: define props with pure types via a generic type argument

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/599/head
Ryan Wang 2022-08-15 17:56:13 +08:00
parent 91ae05fc72
commit cf85449b25
44 changed files with 450 additions and 570 deletions

View File

@ -1,5 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Component, PropType } from "vue"; import type { Component } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { Type } from "./interface"; import type { Type } from "./interface";
import { import {
@ -18,22 +18,18 @@ const TypeIcons: Record<Type, Component> = {
error: IconCloseCircle, error: IconCloseCircle,
}; };
const props = defineProps({ const props = withDefaults(
type: { defineProps<{
type: String as PropType<Type>, type?: Type;
default: "default", title?: string;
}, description?: string;
title: { closable?: boolean;
type: String, }>(),
}, {
description: { type: "default",
type: String, closable: true,
}, }
closable: { );
type: Boolean,
default: true,
},
});
const emit = defineEmits(["close"]); const emit = defineEmits(["close"]);

View File

@ -35,41 +35,30 @@
</button> </button>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { RouteLocationRaw } from "vue-router"; import type { RouteLocationRaw } from "vue-router";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import type { Size, Type } from "./interface"; import type { Size, Type } from "./interface";
const props = defineProps({ const props = withDefaults(
type: { defineProps<{
type: String as PropType<Type>, type?: Type;
default: "default", size?: Size;
}, circle?: boolean;
size: { block?: boolean;
type: String as PropType<Size>, disabled?: boolean;
default: "md", loading?: boolean;
}, route?: RouteLocationRaw;
circle: { }>(),
type: Boolean, {
default: false, type: "default",
}, size: "md",
block: { circle: false,
type: Boolean, block: false,
default: false, disabled: false,
}, loading: false,
disabled: { }
type: Boolean, );
default: false,
},
loading: {
type: Boolean,
default: false,
},
route: {
type: Object as PropType<RouteLocationRaw>,
},
});
const router = useRouter(); const router = useRouter();
const emit = defineEmits(["click"]); const emit = defineEmits(["click"]);

View File

@ -1,14 +1,8 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue"; defineProps<{
title?: string;
defineProps({ bodyClass?: string[];
title: { }>();
type: String,
},
bodyClass: {
type: Object as PropType<string[]>,
},
});
</script> </script>
<template> <template>

View File

@ -1,19 +1,15 @@
<script lang="ts" setup> <script lang="ts" setup>
const props = defineProps({ const props = withDefaults(
checked: { defineProps<{
type: Boolean, checked?: boolean;
default: false, value?: string | number | boolean;
}, label?: string;
value: { name?: string;
type: [String, Number, Boolean], }>(),
}, {
label: { checked: false,
type: String, }
}, );
name: {
type: String,
},
});
const id = ["checkbox", props.name, props.value] const id = ["checkbox", props.name, props.value]
.filter((item) => !!item) .filter((item) => !!item)

View File

@ -1,29 +1,20 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VCheckbox } from "./index"; import { VCheckbox } from "./index";
import type { PropType } from "vue";
const props = defineProps({ const props = withDefaults(
modelValue: { defineProps<{
type: Object as PropType<Array<string>>, modelValue?: string[];
default: () => { options?: Array<Record<string, string>>;
return []; valueKey?: string;
}, labelKey?: string;
}, name?: string;
options: { }>(),
type: Object as PropType<Array<Record<string, string>>>, {
}, modelValue: () => [],
valueKey: { valueKey: "value",
type: String, labelKey: "label",
default: "value", }
}, );
labelKey: {
type: String,
default: "label",
},
name: {
type: String,
},
});
const emit = defineEmits(["update:modelValue", "change"]); const emit = defineEmits(["update:modelValue", "change"]);

View File

@ -1,5 +1,4 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { onBeforeUnmount, onMounted, shallowRef, watch } from "vue"; import { onBeforeUnmount, onMounted, shallowRef, watch } from "vue";
import type { EditorStateConfig } from "@codemirror/state"; import type { EditorStateConfig } from "@codemirror/state";
import { EditorState } from "@codemirror/state"; import { EditorState } from "@codemirror/state";
@ -12,24 +11,20 @@ const languages = {
yaml: StreamLanguage.define(yaml), yaml: StreamLanguage.define(yaml),
}; };
const props = defineProps({ const props = withDefaults(
modelValue: { defineProps<{
type: String, modelValue?: string;
default: "", height?: string;
}, language?: "yaml";
height: { extensions?: EditorStateConfig["extensions"];
type: String, }>(),
default: "auto", {
}, modelValue: "",
language: { height: "auto",
type: String as PropType<"yaml">, language: "yaml",
default: "yaml", extensions: () => [],
}, }
extensions: { );
type: Array as PropType<EditorStateConfig["extensions"]>,
default: () => [],
},
});
const emit = defineEmits<{ const emit = defineEmits<{
(e: "update:modelValue", value: string): void; (e: "update:modelValue", value: string): void;

View File

@ -8,47 +8,32 @@ import {
IconForbidLine, IconForbidLine,
IconInformation, IconInformation,
} from "@/icons/icons"; } from "@/icons/icons";
import type { PropType } from "vue";
import { computed, ref } from "vue"; import { computed, ref } from "vue";
import type { Type } from "@/components/dialog/interface"; import type { Type } from "@/components/dialog/interface";
import type { Type as ButtonType } from "@/components/button/interface"; import type { Type as ButtonType } from "@/components/button/interface";
const props = defineProps({ const props = withDefaults(
type: { defineProps<{
type: String as PropType<Type>, type?: Type;
default: "info", title?: string;
}, description?: string;
title: { confirmText?: string;
type: String, confirmType?: ButtonType;
default: "提示", cancelText?: string;
}, visible?: boolean;
description: { onConfirm?: () => void;
type: String, onCancel?: () => void;
default: "", }>(),
}, {
confirmText: { type: "info",
type: String, title: "提示",
default: "确定", description: "",
}, confirmText: "确定",
confirmType: { confirmType: "primary",
type: String as PropType<ButtonType>, cancelText: "取消",
default: "primary", visible: false,
}, }
cancelText: { );
type: String,
default: "取消",
},
visible: {
type: Boolean,
default: false,
},
onConfirm: {
type: Function as PropType<() => void>,
},
onCancel: {
type: Function as PropType<() => void>,
},
});
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,9 +1,7 @@
<script lang="ts" setup> <script lang="ts" setup>
defineProps({ defineProps<{
title: { title?: string;
type: String, }>();
},
});
</script> </script>
<template> <template>
<div class="flex items-center justify-between bg-white p-4 h-14"> <div class="flex items-center justify-between bg-white p-4 h-14">

View File

@ -1,24 +1,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { Size } from "./interface"; import type { Size } from "./interface";
const props = defineProps({ const props = withDefaults(
modelValue: { defineProps<{
type: String, modelValue?: string;
}, size?: Size;
size: { disabled?: boolean;
type: String as PropType<Size>, placeholder?: string;
default: "md", }>(),
}, {
disabled: { size: "md",
type: Boolean, disabled: false,
default: false, }
}, );
placeholder: {
type: String,
},
});
const emit = defineEmits(["update:modelValue"]); const emit = defineEmits(["update:modelValue"]);

View File

@ -1,13 +1,9 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { provide } from "vue"; import { provide } from "vue";
const props = defineProps({ const props = defineProps<{
openIds: { openIds?: string[];
type: Object as PropType<string[]>, }>();
required: false,
},
});
provide<string[] | undefined>("openIds", props.openIds); provide<string[] | undefined>("openIds", props.openIds);
</script> </script>

View File

@ -2,20 +2,18 @@
import { IconArrowRight } from "../../icons/icons"; import { IconArrowRight } from "../../icons/icons";
import { computed, inject, ref, useSlots } from "vue"; import { computed, inject, ref, useSlots } from "vue";
const props = defineProps({ const props = withDefaults(
id: { defineProps<{
type: String, id?: string;
default: "", title?: string;
}, active?: boolean;
title: { }>(),
type: String, {
default: "", id: "",
}, title: "",
active: { active: false,
type: Boolean, }
default: false, );
},
});
const emit = defineEmits(["select"]); const emit = defineEmits(["select"]);

View File

@ -1,28 +1,21 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed, nextTick, ref, watch } from "vue"; import { computed, nextTick, ref, watch } from "vue";
import { IconClose } from "../../icons/icons"; import { IconClose } from "../../icons/icons";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible?: boolean;
default: false, title?: string;
}, width?: number;
title: { fullscreen?: boolean;
type: String, bodyClass?: string[];
}, }>(),
width: { {
type: Number, visible: false,
default: 500, width: 500,
}, fullscreen: false,
fullscreen: { }
type: Boolean, );
default: false,
},
bodyClass: {
type: Object as PropType<string[]>,
},
});
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,22 +1,20 @@
<script lang="ts" setup> <script lang="ts" setup>
import { UseOffsetPagination } from "@vueuse/components"; import { UseOffsetPagination } from "@vueuse/components";
import { IconArrowLeft, IconArrowRight } from "../../icons/icons"; import { IconArrowLeft, IconArrowRight } from "../../icons/icons";
import { defineProps, ref, toRefs, watch } from "vue"; import { ref, toRefs, watch } from "vue";
const props = defineProps({ const props = withDefaults(
page: { defineProps<{
type: Number, page?: number;
default: 1, size?: number;
}, total?: number;
size: { }>(),
type: Number, {
default: 10, page: 1,
}, size: 10,
total: { total: 0,
type: Number, }
default: 0, );
},
});
const { page, size, total } = toRefs(props); const { page, size, total } = toRefs(props);

View File

@ -1,20 +1,12 @@
<script lang="ts" setup> <script lang="ts" setup>
import { computed } from "vue"; import { computed } from "vue";
const props = defineProps({ const props = defineProps<{
modelValue: { modelValue?: string | number | boolean;
type: [String, Number, Boolean], value?: string | number | boolean;
}, label?: string;
value: { name?: string;
type: [String, Number, Boolean], }>();
},
label: {
type: String,
},
name: {
type: String,
},
});
const emit = defineEmits(["update:modelValue", "change"]); const emit = defineEmits(["update:modelValue", "change"]);

View File

@ -1,26 +1,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VRadio } from "./index"; import { VRadio } from "./index";
import type { PropType } from "vue";
defineProps({ withDefaults(
modelValue: { defineProps<{
type: [String, Number, Boolean], modelValue?: string | number | boolean;
}, options?: Array<Record<string, string | number | boolean>>;
options: { valueKey?: string;
type: Object as PropType<Array<Record<string, string | number | boolean>>>, labelKey?: string;
}, name?: string;
valueKey: { }>(),
type: String, {
default: "value", valueKey: "value",
}, labelKey: "label",
labelKey: { }
type: String, );
default: "label",
},
name: {
type: String,
},
});
const emit = defineEmits(["update:modelValue", "change"]); const emit = defineEmits(["update:modelValue", "change"]);

View File

@ -1,9 +1,7 @@
<script lang="ts" setup> <script lang="ts" setup>
defineProps({ defineProps<{
value: { value?: string | number | boolean;
type: [String, Number, Boolean], }>();
},
});
</script> </script>
<template> <template>

View File

@ -1,24 +1,19 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { Size } from "./interface"; import type { Size } from "./interface";
const props = defineProps({ const props = withDefaults(
modelValue: { defineProps<{
type: String, modelValue?: string;
}, size?: Size;
size: { disabled?: boolean;
type: String as PropType<Size>, placeholder?: string;
default: "md", }>(),
}, {
disabled: { size: "md",
type: Boolean, disabled: false,
default: false, }
}, );
placeholder: {
type: String,
},
});
const emit = defineEmits(["update:modelValue"]); const emit = defineEmits(["update:modelValue"]);

View File

@ -1,23 +1,20 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { Align, Direction, Spacing } from "./interface"; import type { Align, Direction, Spacing } from "./interface";
import { SpacingSize } from "./interface"; import { SpacingSize } from "./interface";
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
const props = defineProps({ const props = withDefaults(
spacing: { defineProps<{
type: String as PropType<Spacing>, spacing?: Spacing;
default: "xs", direction?: Direction;
}, align?: Align;
direction: { }>(),
type: String as PropType<Direction>, {
default: "row", spacing: "xs",
}, direction: "row",
align: { align: "center",
type: String as PropType<Align>, }
default: "center", );
},
});
const wrapperClasses = computed(() => { const wrapperClasses = computed(() => {
const { direction, align } = props; const { direction, align } = props;

View File

@ -1,10 +1,12 @@
<script lang="ts" setup> <script lang="ts" setup>
const props = defineProps({ const props = withDefaults(
modelValue: { defineProps<{
type: Boolean, modelValue?: boolean;
default: false, }>(),
}, {
}); modelValue: false,
}
);
const emit = defineEmits(["update:modelValue", "change"]); const emit = defineEmits(["update:modelValue", "change"]);

View File

@ -2,14 +2,10 @@
import type { ComputedRef } from "vue"; import type { ComputedRef } from "vue";
import { computed, inject } from "vue"; import { computed, inject } from "vue";
const props = defineProps({ const props = defineProps<{
id: { id?: string;
type: String, label?: string;
}, }>();
label: {
type: String,
},
});
const activeId = inject<ComputedRef<string | number | undefined>>("activeId"); const activeId = inject<ComputedRef<string | number | undefined>>("activeId");

View File

@ -1,32 +1,23 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { Direction, Type } from "./interface"; import type { Direction, Type } from "./interface";
const props = defineProps({ const props = withDefaults(
activeId: { defineProps<{
type: [Number, String], activeId?: number | string;
}, items?: Array<Record<string, string>>;
items: { type?: Type;
type: Object as PropType<Array<Record<string, string>>>, direction?: Direction;
}, idKey?: string;
type: { labelKey?: string;
type: String as PropType<Type>, }>(),
default: "default", {
}, type: "default",
direction: { direction: "row",
type: String as PropType<Direction>, idKey: "id",
default: "row", labelKey: "label",
}, }
idKey: { );
type: String,
default: "id",
},
labelKey: {
type: String,
default: "label",
},
});
const emit = defineEmits(["update:activeId", "change"]); const emit = defineEmits(["update:activeId", "change"]);

View File

@ -1,30 +1,24 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { ComputedRef, PropType } from "vue"; import type { ComputedRef } from "vue";
import { computed, provide, useSlots } from "vue"; import { computed, provide, useSlots } from "vue";
import { VTabbar } from "./index"; import { VTabbar } from "./index";
import type { Direction, Type } from "./interface"; import type { Direction, Type } from "./interface";
const props = defineProps({ const props = withDefaults(
activeId: { defineProps<{
type: [Number, String], activeId?: number | string;
}, type?: Type;
type: { direction?: Direction;
type: String as PropType<Type>, idKey?: string;
default: "default", labelKey?: string;
}, }>(),
direction: { {
type: String as PropType<Direction>, type: "default",
default: "row", direction: "row",
}, idKey: "id",
idKey: { labelKey: "label",
type: String, }
default: "id", );
},
labelKey: {
type: String,
default: "label",
},
});
provide<ComputedRef<string | number | undefined>>( provide<ComputedRef<string | number | undefined>>(
"activeId", "activeId",

View File

@ -1,18 +1,17 @@
<script lang="ts" setup> <script lang="ts" setup>
import type { PropType } from "vue";
import { computed } from "vue"; import { computed } from "vue";
import type { Theme } from "./interface"; import type { Theme } from "./interface";
const props = defineProps({ const props = withDefaults(
theme: { defineProps<{
type: String as PropType<Theme>, theme?: Theme;
default: "default", rounded?: boolean;
}, }>(),
rounded: { {
type: Boolean, theme: "default",
default: false, rounded: false,
}, }
}); );
const classes = computed(() => { const classes = computed(() => {
return [`tag-${props.theme}`, { "tag-rounded": props.rounded }]; return [`tag-${props.theme}`, { "tag-rounded": props.rounded }];

View File

@ -1,20 +1,16 @@
<script lang="ts" setup> <script lang="ts" setup>
defineProps({ withDefaults(
modelValue: { defineProps<{
type: String, modelValue?: string;
}, disabled?: boolean;
disabled: { placeholder?: string;
type: Boolean, rows?: number;
default: false, }>(),
}, {
placeholder: { disabled: false,
type: String, rows: 3,
}, }
rows: { );
type: Number,
default: 3,
},
});
const emit = defineEmits(["update:modelValue"]); const emit = defineEmits(["update:modelValue"]);

View File

@ -1,12 +1,14 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VAlert, VButton, VModal, VSpace } from "@halo-dev/components"; import { VAlert, VButton, VModal, VSpace } from "@halo-dev/components";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -8,12 +8,14 @@ import {
VTag, VTag,
} from "@halo-dev/components"; } from "@halo-dev/components";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,12 +1,14 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VModal, VSpace } from "@halo-dev/components"; import { VButton, VModal, VSpace } from "@halo-dev/components";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,12 +1,14 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VCard, VModal } from "@halo-dev/components"; import { VButton, VCard, VModal } from "@halo-dev/components";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -10,13 +10,14 @@ import AttachmentLocalStrategyEditingModal from "./AttachmentLocalStrategyEditin
import AttachmentAliOSSStrategyEditingModal from "./AttachmentAliOSSStrategyEditingModal.vue"; import AttachmentAliOSSStrategyEditingModal from "./AttachmentAliOSSStrategyEditingModal.vue";
import { ref } from "vue"; import { ref } from "vue";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);
const strategies = ref([ const strategies = ref([

View File

@ -8,12 +8,14 @@ import { ref } from "vue";
const FilePond = vueFilePond(FilePondPluginImagePreview); const FilePond = vueFilePond(FilePondPluginImagePreview);
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,17 +1,16 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VModal, VSpace } from "@halo-dev/components"; import { VButton, VModal, VSpace } from "@halo-dev/components";
import type { PropType } from "vue";
const props = defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, category: unknown | null;
}, }>(),
category: { {
type: Object as PropType<unknown | null>, visible: false,
default: null, category: undefined,
}, }
}); );
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -8,7 +8,6 @@ import {
VTabItem, VTabItem,
VTabs, VTabs,
} from "@halo-dev/components"; } from "@halo-dev/components";
import type { PropType } from "vue";
import { ref, unref, watch } from "vue"; import { ref, unref, watch } from "vue";
import type { Post } from "@halo-dev/admin-api"; import type { Post } from "@halo-dev/admin-api";
@ -17,16 +16,16 @@ interface FormState {
saving: boolean; saving: boolean;
} }
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, post: Post | Record<string, unknown> | null;
}, }>(),
post: { {
type: Object as PropType<Post | Record<string, unknown> | null>, visible: false,
default: null, post: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close", "previous", "next"]); const emit = defineEmits(["update:visible", "close", "previous", "next"]);

View File

@ -1,18 +1,16 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VModal, VSpace } from "@halo-dev/components"; import { VButton, VModal, VSpace } from "@halo-dev/components";
import type { PropType } from "vue";
const props = defineProps({
visible: {
type: Boolean,
default: false,
},
tag: {
type: Object as PropType<unknown | null>,
default: null,
},
});
withDefaults(
defineProps<{
visible: boolean;
tag: unknown | null;
}>(),
{
visible: false,
tag: undefined,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);
const onVisibleChange = (visible: boolean) => { const onVisibleChange = (visible: boolean) => {

View File

@ -2,24 +2,22 @@
import { VButton, VModal, VSpace } from "@halo-dev/components"; import { VButton, VModal, VSpace } from "@halo-dev/components";
import type { Menu } from "@halo-dev/api-client"; import type { Menu } from "@halo-dev/api-client";
import { v4 as uuid } from "uuid"; import { v4 as uuid } from "uuid";
import type { PropType } from "vue";
import { computed, ref, watch } from "vue"; import { computed, ref, watch } from "vue";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
import { submitForm } from "@formkit/core"; import { reset, submitForm } from "@formkit/core";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
import { useMagicKeys } from "@vueuse/core"; import { useMagicKeys } from "@vueuse/core";
import { reset } from "@formkit/core";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, menu: Menu | null;
}, }>(),
menu: { {
type: Object as PropType<Menu | null>, visible: false,
default: null, menu: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,25 +1,23 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VModal, VSpace } from "@halo-dev/components"; import { VButton, VModal, VSpace } from "@halo-dev/components";
import type { PropType } from "vue";
import { computed, ref, watch, watchEffect } from "vue"; import { computed, ref, watch, watchEffect } from "vue";
import type { MenuItem } from "@halo-dev/api-client"; import type { MenuItem } from "@halo-dev/api-client";
import { v4 as uuid } from "uuid"; import { v4 as uuid } from "uuid";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
import { submitForm } from "@formkit/core"; import { reset, submitForm } from "@formkit/core";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
import { useMagicKeys } from "@vueuse/core"; import { useMagicKeys } from "@vueuse/core";
import { reset } from "@formkit/core";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, menuItem: MenuItem | null;
}, }>(),
menuItem: { {
type: Object as PropType<MenuItem | null>, visible: false,
default: null, menuItem: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close", "saved"]); const emit = defineEmits(["update:visible", "close", "saved"]);

View File

@ -1,16 +1,17 @@
<script lang="ts" setup> <script lang="ts" setup>
import { IconList, IconSettings, VButton, VSpace } from "@halo-dev/components"; import { IconList, IconSettings, VButton, VSpace } from "@halo-dev/components";
import Draggable from "vuedraggable"; import Draggable from "vuedraggable";
import type { PropType } from "vue";
import { ref } from "vue"; import { ref } from "vue";
import type { MenuTreeItem } from "@/modules/interface/menus/utils"; import type { MenuTreeItem } from "@/modules/interface/menus/utils";
defineProps({ withDefaults(
menuTreeItems: { defineProps<{
type: Array as PropType<MenuTreeItem[]>, menuTreeItems: MenuTreeItem[];
default: () => [], }>(),
}, {
}); menuTreeItems: () => [],
}
);
const emit = defineEmits(["change", "open-editing", "delete"]); const emit = defineEmits(["change", "open-editing", "delete"]);

View File

@ -7,18 +7,19 @@ import {
VSpace, VSpace,
} from "@halo-dev/components"; } from "@halo-dev/components";
import MenuEditingModal from "./MenuEditingModal.vue"; import MenuEditingModal from "./MenuEditingModal.vue";
import type { PropType } from "vue";
import { defineExpose, onMounted, ref } from "vue"; import { defineExpose, onMounted, ref } from "vue";
import type { Menu } from "@halo-dev/api-client"; import type { Menu } from "@halo-dev/api-client";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
import { useRouteQuery } from "@vueuse/router"; import { useRouteQuery } from "@vueuse/router";
const props = defineProps({ const props = withDefaults(
selectedMenu: { defineProps<{
type: Object as PropType<Menu | null>, selectedMenu: Menu | null;
default: null, }>(),
}, {
}); selectedMenu: null,
}
);
const emit = defineEmits(["select", "update:selectedMenu"]); const emit = defineEmits(["select", "update:selectedMenu"]);

View File

@ -6,12 +6,14 @@ import { apiClient } from "@halo-dev/admin-shared";
const FilePond = VueFilePond(); const FilePond = VueFilePond();
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -9,25 +9,22 @@ import {
VTag, VTag,
} from "@halo-dev/components"; } from "@halo-dev/components";
import ThemeInstallModal from "./ThemeInstallModal.vue"; import ThemeInstallModal from "./ThemeInstallModal.vue";
import type { PropType } from "vue";
import { onMounted, ref } from "vue"; import { onMounted, ref } from "vue";
import type { Theme } from "@halo-dev/api-client"; import type { Theme } from "@halo-dev/api-client";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, selectedTheme: Theme | null;
}, activatedTheme: Theme | null;
selectedTheme: { }>(),
type: Object as PropType<Theme | null>, {
default: null, visible: false,
}, selectedTheme: null,
activatedTheme: { activatedTheme: null,
type: Object as PropType<Theme | null>, }
default: null, );
},
});
const emit = defineEmits(["update:visible", "close", "update:selectedTheme"]); const emit = defineEmits(["update:visible", "close", "update:selectedTheme"]);

View File

@ -7,12 +7,14 @@ import type { Plugin } from "@halo-dev/api-client";
const FilePond = VueFilePond(); const FilePond = VueFilePond();
defineProps({ withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, }>(),
}, {
}); visible: false,
}
);
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -6,17 +6,18 @@ import {
VSwitch, VSwitch,
VTag, VTag,
} from "@halo-dev/components"; } from "@halo-dev/components";
import type { PropType } from "vue";
import { toRefs } from "vue"; import { toRefs } from "vue";
import { usePluginLifeCycle } from "../composables/use-plugin"; import { usePluginLifeCycle } from "../composables/use-plugin";
import type { Plugin } from "@halo-dev/api-client"; import type { Plugin } from "@halo-dev/api-client";
const props = defineProps({ const props = withDefaults(
plugin: { defineProps<{
type: Object as PropType<Plugin | null>, plugin: Plugin | null;
default: null, }>(),
}, {
}); plugin: null,
}
);
const { plugin } = toRefs(props); const { plugin } = toRefs(props);

View File

@ -1,6 +1,5 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VButton, VModal, VSpace, VTabItem, VTabs } from "@halo-dev/components"; import { VButton, VModal, VSpace, VTabItem, VTabs } from "@halo-dev/components";
import type { PropType } from "vue";
import { computed, ref, watch } from "vue"; import { computed, ref, watch } from "vue";
import { rbacAnnotations } from "@/constants/annotations"; import { rbacAnnotations } from "@/constants/annotations";
import type { Role } from "@halo-dev/api-client"; import type { Role } from "@halo-dev/api-client";
@ -9,20 +8,19 @@ import {
useRoleTemplateSelection, useRoleTemplateSelection,
} from "@/modules/system/roles/composables/use-role"; } from "@/modules/system/roles/composables/use-role";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
import { submitForm } from "@formkit/core"; import { reset, submitForm } from "@formkit/core";
import { useMagicKeys } from "@vueuse/core"; import { useMagicKeys } from "@vueuse/core";
import { reset } from "@formkit/core";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, role: Role | null;
}, }>(),
role: { {
type: Object as PropType<Role | null>, visible: false,
default: null, role: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,5 +1,4 @@
<script lang="ts" name="UserEditingModal" setup> <script lang="ts" name="UserEditingModal" setup>
import type { PropType } from "vue";
import { computed, onMounted, ref, watch } from "vue"; import { computed, onMounted, ref, watch } from "vue";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
import type { Role, User } from "@halo-dev/api-client"; import type { Role, User } from "@halo-dev/api-client";
@ -19,16 +18,16 @@ import cloneDeep from "lodash.clonedeep";
import { useMagicKeys } from "@vueuse/core"; import { useMagicKeys } from "@vueuse/core";
import { reset, submitForm } from "@formkit/core"; import { reset, submitForm } from "@formkit/core";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, user: User | null;
}, }>(),
user: { {
type: Object as PropType<User | null>, visible: false,
default: null, user: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);

View File

@ -1,21 +1,20 @@
<script lang="ts" setup> <script lang="ts" setup>
import { VModal, VButton, IconSave } from "@halo-dev/components"; import { IconSave, VButton, VModal } from "@halo-dev/components";
import { inject, ref } from "vue"; import { inject, ref } from "vue";
import type { User } from "@halo-dev/api-client"; import type { User } from "@halo-dev/api-client";
import type { PropType } from "vue";
import { apiClient } from "@halo-dev/admin-shared"; import { apiClient } from "@halo-dev/admin-shared";
import cloneDeep from "lodash.clonedeep"; import cloneDeep from "lodash.clonedeep";
const props = defineProps({ const props = withDefaults(
visible: { defineProps<{
type: Boolean, visible: boolean;
default: false, user: User | null;
}, }>(),
user: { {
type: Object as PropType<User | null>, visible: false,
default: null, user: null,
}, }
}); );
const emit = defineEmits(["update:visible", "close"]); const emit = defineEmits(["update:visible", "close"]);
const currentUser = inject<User>("currentUser"); const currentUser = inject<User>("currentUser");