From 2d321bd4810d8d8829b5a07ee351a98f6e373208 Mon Sep 17 00:00:00 2001
From: Arthur Darkstone <arthurlli@qq.com>
Date: Mon, 9 Dec 2024 18:50:18 +0800
Subject: [PATCH] feat: enhance component adapter with custom Checkbox and
 RadioGroup handling

---
 apps/web-ele/src/adapter/component/index.ts | 45 ++++++++++++++++++---
 1 file changed, 40 insertions(+), 5 deletions(-)

diff --git a/apps/web-ele/src/adapter/component/index.ts b/apps/web-ele/src/adapter/component/index.ts
index a819535ad7f..9c5dcb9116b 100644
--- a/apps/web-ele/src/adapter/component/index.ts
+++ b/apps/web-ele/src/adapter/component/index.ts
@@ -19,8 +19,9 @@ import {
   ElInput,
   ElInputNumber,
   ElNotification,
+  ElRadio,
   ElRadioGroup,
-  ElSelect,
+  ElSelectV2,
   ElSpace,
   ElSwitch,
   ElTimePicker,
@@ -38,6 +39,12 @@ const withDefaultPlaceholder = <T extends Component>(
   };
 };
 
+type TKV = {
+  [key: string]: any;
+  label: string;
+  value: any;
+};
+
 // 这里需要自行根据业务组件库进行适配，需要用到的组件都需要在这里类型说明
 export type ComponentType =
   | 'Checkbox'
@@ -62,9 +69,23 @@ async function initComponentAdapter() {
     // import('xxx').then((res) => res.Button),
 
     Checkbox: ElCheckbox,
-    CheckboxGroup: ElCheckboxGroup,
+    CheckboxGroup: (props, { attrs, slots }) => {
+      return h(
+        ElCheckboxGroup,
+        { ...props, attrs },
+        props.options
+          ? () =>
+              props.options?.map((option: TKV) => {
+                return h(ElCheckbox, {
+                  label: option.label,
+                  value: option.value,
+                });
+              })
+          : slots,
+      );
+    },
     // 自定义默认按钮
-    DefaulButton: (props, { attrs, slots }) => {
+    DefaultButton: (props, { attrs, slots }) => {
       return h(ElButton, { ...props, attrs, type: 'info' }, slots);
     },
     // 自定义主要按钮
@@ -74,8 +95,22 @@ async function initComponentAdapter() {
     Divider: ElDivider,
     Input: withDefaultPlaceholder(ElInput, 'input'),
     InputNumber: withDefaultPlaceholder(ElInputNumber, 'input'),
-    RadioGroup: ElRadioGroup,
-    Select: withDefaultPlaceholder(ElSelect, 'select'),
+    RadioGroup: (props, { attrs, slots }) => {
+      return h(
+        ElRadioGroup,
+        { ...props, attrs },
+        props.options
+          ? () =>
+              props.options?.map((option: TKV) => {
+                return h(ElRadio, {
+                  label: option.label,
+                  value: option.value,
+                });
+              })
+          : slots,
+      );
+    },
+    Select: withDefaultPlaceholder(ElSelectV2, 'select'),
     Space: ElSpace,
     Switch: ElSwitch,
     TimePicker: ElTimePicker,