多选框默认值和可读显示优化

 <!--
  * @Date: 2022-08-30 11:34:19
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2023-02-10 10:06:43
+ * @LastEditTime: 2024-06-06 15:41:04
  * @FilePath: /data-table/src/components/CheckboxField/index.vue
  * @Description: 多项选择控件
 -->
@@ -20,11 +20,15 @@
         <van-checkbox-group v-model="checkbox_value" :direction="item.component_props.direction"
           :max="item.component_props.max" style="width: 100%">
           <div v-for="x in item.component_props.options" :key="x.title" class="checkbox-wrapper">
-            <van-checkbox @click="onClick(x)" :name="x.title" icon-size="1rem" shape="square"
+            <div v-if="item.component_props.readonly">
+              <div v-if="item.component_props.default.includes(x.value)" role="checkbox" class="van-checkbox van-checkbox--vertical" tabindex="0" aria-checked="true" data-v-3722f8ba="" style="margin-bottom: 0.25rem;"><div class="van-checkbox__icon van-checkbox__icon--square van-checkbox__icon--checked" style="font-size: 1rem;"><i class="van-badge__wrapper van-icon van-icon-success" style="border-color: rgb(194, 145, 95); background-color: rgb(194, 145, 95);"><!----><!----><!----></i></div><span class="van-checkbox__label">{{ x.title }}</span></div>
+              <div v-else role="checkbox" class="van-checkbox van-checkbox--vertical" tabindex="0" aria-checked="false" data-v-3722f8ba="" style="margin-bottom: 0.25rem;"><div class="van-checkbox__icon van-checkbox__icon--square" style="font-size: 1rem;"><i class="van-badge__wrapper van-icon van-icon-success" style=""><!----><!----><!----></i></div><span class="van-checkbox__label">{{ x.title }}</span></div>
+            </div>
+            <van-checkbox v-else @click="onClick(x)" :name="x.title" icon-size="1rem" shape="square"
               :checked-color="themeVars.radioColor" style="margin-bottom: 0.25rem">{{ x.title }}</van-checkbox>
-            <van-field v-if="checkbox_value.includes(x.value) && x.is_input" @blur="onBlur(x)" v-model="x.affix"
+            <van-field v-if="checkbox_value.includes(x.value) && x.is_input && (item.component_props.readonly && x.affix)" @blur="onBlur(x)" v-model="x.affix"
               label=" " label-width="5px" :placeholder="x.input_placeholder" :rules="x.input_required ? rules : ''"
-              :required="x.input_required" class="affix-input" />
+              :required="x.input_required" :readonly="item.component_props.readonly" class="affix-input" />
           </div>
         </van-checkbox-group>
       </template>