修复 src 结构

src/component/checkbox/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 || "LayCheckbox", Component);
+};
+
+export default Component as IDefineComponent;

src/component/checkbox/index.vue

@@ -0,0 +1,111 @@
+<script lang="ts">
+export default {
+  name: "LayCheckbox",
+};
+</script>
+
+<script setup lang="ts">
+import { computed, defineProps, inject } from "vue";
+import "./index.less";
+
+export interface LayCheckboxProps {
+  name?: string;
+  skin?: string;
+  label: string | object;
+  modelValue?: boolean | Array<string | object>;
+  disabled?: boolean;
+}
+
+const props = withDefaults(defineProps<LayCheckboxProps>(), {
+  modelValue: false,
+  disabled: false,
+});
+
+const checkboxGroup: any = inject("checkboxGroup", {});
+
+const isGroup = computed(() => {
+  return (
+    checkboxGroup != undefined && checkboxGroup?.name === "LayCheckboxGroup"
+  );
+});
+
+const emit = defineEmits(["update:modelValue", "change"]);
+
+const isChecked = computed({
+  get() {
+    if (isGroup.value) {
+      return checkboxGroup.modelValue.value.includes(props.label);
+    } else {
+      if (Array.isArray(props.modelValue)) {
+        return props.modelValue.includes(props.label);
+      } else {
+        return props.modelValue;
+      }
+    }
+  },
+  set(val) {
+    if (isGroup.value) {
+      setGroupModelValue(val);
+    } else {
+      if (Array.isArray(props.modelValue)) {
+        setArrayModelValue(val);
+      } else {
+        emit("change", val);
+        emit("update:modelValue", val);
+      }
+    }
+  },
+});
+
+const arrayModelValue = computed(() => {
+  if (Array.isArray(props.modelValue)) {
+    return [...props.modelValue];
+  } else {
+    return [];
+  }
+});
+
+const setGroupModelValue = function (checked: any) {
+  let groupModelValue = [...checkboxGroup.modelValue.value];
+  if (!checked) {
+    groupModelValue.splice(groupModelValue.indexOf(props.label), 1);
+  } else {
+    groupModelValue.push(props.label);
+  }
+  checkboxGroup.modelValue.value = groupModelValue;
+};
+
+const setArrayModelValue = function (checked: any) {
+  let arr = [...arrayModelValue.value];
+  if (!checked) {
+    arr.splice(arr.indexOf(props.label), 1);
+  } else {
+    arr.push(props.label);
+  }
+  emit("change", arr);
+  emit("update:modelValue", arr);
+};
+
+const handleClick = function () {
+  if (!props.disabled) {
+    isChecked.value = !isChecked.value;
+  }
+};
+</script>
+
+<template>
+  <span @click.stop="handleClick">
+    <input type="checkbox" :name="name" :value="label" />
+    <div
+      class="layui-unselect layui-form-checkbox"
+      :class="{
+        'layui-checkbox-disbaled layui-disabled': disabled,
+        'layui-form-checked': isChecked,
+      }"
+      :lay-skin="skin"
+    >
+      <span v-if="$slots?.default"><slot></slot></span>
+      <i class="layui-icon layui-icon-ok"></i>
+    </div>
+  </span>
+</template>