[完成] 徽章组件

src/index.ts

@@ -19,6 +19,8 @@ import LayPanel from "./module/panel/index"
 import LayProgress from "./module/panel/index"
 import LayCol from "./module/col/index"
 import LayRow from "./module/row/index"
+import LayInput from "./module/input/index"
+import LayBadge from "./module/badge/index"
 
 const components: Record<string, IDefineComponent> = {
   LayRadio,
@@ -37,6 +39,8 @@ const components: Record<string, IDefineComponent> = {
   LayButtonContainer,
   LayRow,
   LayCol,
+  LayInput,
+  LayBadge
 }
 
 const install = (app: App, options?: InstallOptions): void => {
@@ -66,6 +70,8 @@ export {
   LayButtonContainer,
   LayRow,
   LayCol,
+  LayInput,
+  LayBadge,
   install,
 }
 

src/module/badge/index.ts

@@ -0,0 +1,9 @@
+import type { App } from 'vue'
+import Component from './index.vue'
+import type { IDefineComponent } from '../type/index'
+
+Component.install = (app: App) => {
+  app.component(Component.name || 'LayBadge', Component)
+}
+
+export default Component as IDefineComponent

src/module/badge/index.vue

@@ -0,0 +1,26 @@
+<template>
+    <span :class="classList" :style="styleList">
+        <slot v-if="type != 'dot'"></slot>
+    </span>
+</template>
+
+<script setup name="LayBadge" lang="ts">
+import { defineProps } from '@vue/runtime-core'
+
+const props =
+  defineProps<{
+   	type: string
+	theme: string
+	color: string
+  }>()
+
+const classList = [{
+				    'layui-badge': !props.type,
+                    'layui-badge-dot': props.type == 'dot',
+                    'layui-badge-rim': props.type == 'rim',
+                },
+				'layui-bg-' + props.theme];
+
+const styleList = props.color ? 'background-color: ' + props.color : '';
+
+</script>

src/module/icon/index.vue

@@ -2,7 +2,9 @@
     <i class="layui-icon" :class="[type]"></i>
 </template>
 
-<script setup name="LayButton" lang="ts">
+<script setup name="LayIcon" lang="ts">
+import { defineProps } from '@vue/runtime-core'
+
 const props =
   defineProps<{
     type?: string

src/module/input/index.ts

@@ -0,0 +1,9 @@
+import type { App } from 'vue'
+import Component from './index.vue'
+import type { IDefineComponent } from '../type/index'
+
+Component.install = (app: App) => {
+  app.component(Component.name || 'LayInput', Component)
+}
+
+export default Component as IDefineComponent

src/module/input/index.vue

@@ -0,0 +1,12 @@
+<template>
+    <input type="text" class="layui-input" />
+</template>
+
+<script setup name="LayInput" lang="ts">
+import { defineProps } from '@vue/runtime-core'
+
+const props =
+  defineProps<{
+    type?: string
+  }>()
+</script>