✨(component): 新增CheckBoxGroup disabled属性

package/component/src/component/checkbox/index.vue

@@ -27,6 +27,7 @@ const props = withDefaults(defineProps<LayCheckboxProps>(), {
 });
 
 const checkboxGroup: any = inject("checkboxGroup", {});
+const checkboxGroupDisabled: boolean = inject("checkboxGroupDisabled", false);
 
 const isGroup = computed(() => {
   return (
@@ -92,7 +93,7 @@ const setArrayModelValue = function (checked: any) {
 };
 
 const handleClick = function () {
-  if (!props.disabled) {
+  if (!props.disabled&&!checkboxGroupDisabled) {
     isChecked.value = !isChecked.value;
   }
 };
@@ -104,7 +105,7 @@ const handleClick = function () {
     <div
       class="layui-unselect layui-form-checkbox"
       :class="{
-        'layui-checkbox-disabled layui-disabled': disabled,
+        'layui-checkbox-disabled layui-disabled': disabled||checkboxGroupDisabled,
         'layui-form-checked': isChecked,
       }"
       :lay-skin="skin"

package/component/src/component/checkboxGroup/index.vue

@@ -10,10 +10,12 @@ import { Recordable } from "../../types";
 
 export interface LayCheckboxGroupProps {
   modelValue?: Recordable[];
+  disabled?:boolean
 }
 
 const props = withDefaults(defineProps<LayCheckboxGroupProps>(), {
   modelValue: () => [],
+  disabled:false
 });
 
 const emit = defineEmits(["update:modelValue", "change"]);
@@ -21,7 +23,7 @@ const emit = defineEmits(["update:modelValue", "change"]);
 const modelValue = ref(props.modelValue);
 
 provide("checkboxGroup", { name: "LayCheckboxGroup", modelValue: modelValue });
-
+provide("checkboxGroupDisabled",props.disabled)
 watch(
   () => modelValue,
   (val) => {
@@ -35,10 +37,11 @@ watch(
   () => props.modelValue,
   (val) => (modelValue.value = val)
 );
+
 </script>
 
 <template>
-  <div class="layui-checkbox-group">
+  <div class="layui-checkbox-group" :class="{'layui-checkbox-group-disabled':disabled}">
     <slot></slot>
   </div>
 </template>

package/document-component/src/document/zh-CN/components/checkbox.md

@@ -133,6 +133,12 @@ export default {
 
 <template>
     <lay-checkbox name="like" skin="primary" value="1" :disabled="disabled" v-model="checked6">禁用</lay-checkbox>
+    <br/><br/>
+    <lay-checkbox-group v-model="checkeds" disabled>
+      <lay-checkbox name="like" skin="primary" value="1">写作</lay-checkbox>
+      <lay-checkbox name="like" skin="primary" value="2">画画</lay-checkbox>
+      <lay-checkbox name="like" skin="primary" value="3">运动</lay-checkbox>
+    </lay-checkbox-group>
 </template>
 
 <script>
@@ -224,6 +230,7 @@ export default {
 | value               | 选中值        | --                   |
 | v-model             | 是否选中      | `true` `false`       |
 | isIndeterminate     | 半选状态      | `true` `false`       |
+| disabled            | 是否禁用      | `true` `false`       |
 
 :::
 
@@ -238,6 +245,17 @@ export default {
 
 :::
 
+::: title CheckboxGroup 属性
+:::
+
+::: table
+
+| 属性                | 描述          | 可选值               |
+| ------------------- | ------------ | ------------------ |
+| disabled            | 是否整体禁用      | `true` `false`      |
+
+:::
+
 ::: contributor checkbox
 :::
 

package/document-component/src/document/zh-CN/guide/changelog.md

@@ -25,6 +25,7 @@
           <li>[新增] formItem 组件 label-width属性，用于控制宽度 by @SmallWai</li> 
           <li>[优化] inputNumber 组件 禁用状态下的样式 by @SmallWai</li>
           <li>[优化] botton 组件 禁用状态下的icon hover样式 by @SmallWai</li>
+          <li>[新增] CheckboxGroup 组件 disabled属性  by @SmallWai</li>
         </ul>
       </li>
     </ul>