perf(icon): 新增 prefix 前缀, 支持自定义图标

docs/docs/zh-CN/components/checkbox.md

@@ -51,7 +51,30 @@ export default {
 
 :::
 
+::: demo
 
+<template>
+  <lay-form>
+    <lay-checkbox name="like" skin="primary" label="1" :disabled="disabled">禁用</lay-checkbox>
+ </lay-form>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const disabled = ref(false)
+
+    return {
+      disabled 
+    }
+  }
+}
+</script>
+
+:::
 
 ::: demo
 
@@ -82,14 +105,14 @@ export default {
 
 <lay-field title="Checkbox attributes" style="margin-top:40px"/>
 
-|          |      |                         |     |
+|          |      |                         |  
-| -------- | ---- | ----------------------- | --- |
+| -------- | ---- | ----------------------- | 
-| name       | 尺寸 | 超小屏幕 (手机<768px)   | 12  |
+| name       | 原始属性 name | --  | 
-| skin       | 尺寸 | 超小屏幕 (手机<768px)   | 12  |
+| skin       | 主题 | --  |
-| label       | 尺寸 | 超小屏幕 (手机<768px)   | 12  |
+| label       | 选中值 | --   | 
 
 <lay-field title="Checkbox events" style="margin-top:40px"/>
 
-|          |      |                         |     |
+|          |      |                         |  
-| -------- | ---- | ----------------------- | --- |
+| -------- | ---- | ----------------------- | 
-| change   | 切换事件 | 超小屏幕 (手机<768px)   | 12  |
+| change   | 切换事件 | -- | 

docs/docs/zh-CN/components/collapse.md

@@ -14,7 +14,7 @@ import { ref } from 'vue'
 export default {
   setup() {
 
-    const openKeys = ref(["1","2"])
+    const openKeys = ref(["1","2","3"])
 
     return {
       openKeys

docs/docs/zh-CN/components/icon.md

@@ -1052,3 +1052,4 @@ export default {
 |      |      |                   |
 | ---- | ---- | ----------------- |
 | type | 图标 | `layui-icon-home` |
+| prefix | 前缀 | `layui-icon` |

src/module/checkbox/index.vue

@@ -31,7 +31,7 @@ const props =
     skin?: string
     label?: string
     checked?: Boolean
-    disabled?: Boolean
+    disabled?: boolean
   }>()
 
 const customChecked = ref(false)

src/module/checkboxGroup/index.vue

@@ -1,48 +1,8 @@
 <template>
-  <span @click="handleClick">
+
-    <input type="checkbox" :name="name" title="写作" :value="label" />
-    <div
-      class="layui-unselect"
-      :class="[
-        {
-          'layui-checkbox-disbaled layui-disabled': disabled,
-        },
-        'layui-form-checkbox',
-        props.modelValue.includes(props.label) ? 'layui-form-checked' : '',
-      ]"
-      :lay-skin="skin"
-    >
-      <span><slot /></span>
-      <i v-if="skin == 'primary'" class="layui-icon layui-icon-ok" />
-      <i v-if="!skin" class="layui-icon layui-icon-ok" />
-    </div>
-  </span>
 </template>
 
 <script setup name="LayCheckbox" lang="ts">
 import { defineProps, ref, watch } from 'vue'
 
-const props = defineProps<{
-  modelValue: string[]
-  label: string
-  disabled?: boolean
-  name?: string
-  skin?: string
-}>()
-
-const hasValue = ref(false)
-
-const emit = defineEmits(['update:modelValue'])
-
-const handleClick = function () {
-  if (!props.disabled) {
-    if (!props.modelValue.includes(props.label)) {
-      props.modelValue.push(props.label)
-    } else {
-      let index = props.modelValue.indexOf(props.label)
-      props.modelValue.splice(index, 1)
-    }
-    emit('update:modelValue', props.modelValue)
-  }
-}
 </script>

src/module/collapseItem/index.vue

@@ -13,7 +13,7 @@
 </template>
 
 <script setup name="LayCollapseItem" lang="ts">
-import { defineProps, inject, Ref, ref } from 'vue'
+import { defineProps, inject, ref } from 'vue'
 
 const props = defineProps<{
   id: string

src/module/icon/index.vue

@@ -1,11 +1,17 @@
 <template>
-  <i class="layui-icon" :class="[type]" />
+  <i :class="[prefix, type]" />
 </template>
 
 <script setup name="LayIcon" lang="ts">
 import { defineProps } from 'vue'
 
-const props = defineProps<{
+const props = withDefaults(
+  defineProps<{
     type?: string
-}>()
+    prefix?: string
+  }>(),
+  {
+    prefix: 'layui-icon',
+  }
+)
 </script>