From 08228c73d14f35c005c105cd37da75ded7b0daae Mon Sep 17 00:00:00 2001
From: Kinplemelon <wujiu529@gmail.com>
Date: Thu, 19 Dec 2024 16:51:51 +0800
Subject: [PATCH] fix(schema): optimize input with placeholder select

---
 src/components/InputWithPlaceholderSelect.vue | 29 ++++++++++++++++---
 src/components/SchemaForm.tsx                 |  2 ++
 src/components/SchemaFormItem.tsx             |  2 ++
 .../Rule/bridge/useComponentsHandlers.ts      |  4 ---
 src/hooks/Schema/useSchemaForm.ts             | 10 ++++++-
 src/types/enum.ts                             |  1 +
 6 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/src/components/InputWithPlaceholderSelect.vue b/src/components/InputWithPlaceholderSelect.vue
index 4706d62f3..572586e6c 100644
--- a/src/components/InputWithPlaceholderSelect.vue
+++ b/src/components/InputWithPlaceholderSelect.vue
@@ -22,12 +22,15 @@
 </template>
 
 <script setup lang="ts">
+import { NUM_REG } from '@/common/constants'
 import useSQLAvailablePlaceholder from '@/hooks/Rule/useSQLAvailablePlaceholder'
+import { PropType } from '@/types/enum'
+import { Property } from '@/types/schemaForm'
 import { escapeRegExp } from 'lodash'
 import { computed, defineEmits, defineProps, ref, watch } from 'vue'
 
 const props = defineProps<{
-  modelValue?: string
+  modelValue?: string | number | boolean
   [key: string]: any
   customPlaceholders?: Array<string>
   /**
@@ -36,17 +39,35 @@ const props = defineProps<{
    * the options are added at the end of the list.
    */
   options?: Array<string | number>
+  oneOf?: Array<Property>
 }>()
 
 const emit = defineEmits<{
-  (e: 'update:modelValue', v: string): void
+  (e: 'update:modelValue', v: string | number | boolean): void
   (e: 'input', v: any): void
 }>()
 
+const getValueForEmit = (val: string) => {
+  if (!props.oneOf || props.oneOf.length === 0) {
+    return val
+  }
+  const oneOfBoolean = props.oneOf.find(({ type }) => type === PropType.Boolean)
+  const oneOfNum = props.oneOf.find(({ type }) =>
+    [PropType.Integer, PropType.Number].includes(type),
+  )
+  if (oneOfBoolean && /^(true|false)$/i.test(val)) {
+    return /^true/i.test(val)
+  }
+  if (oneOfNum && NUM_REG.test(val)) {
+    return Number(val)
+  }
+  return val
+}
+
 const inputValue = computed({
-  get: () => props.modelValue || '',
+  get: () => props.modelValue?.toString() || '',
   set: (value: string) => {
-    emit('update:modelValue', value)
+    emit('update:modelValue', getValueForEmit(value))
   },
 })
 
diff --git a/src/components/SchemaForm.tsx b/src/components/SchemaForm.tsx
index ac6a310c6..011f1647b 100644
--- a/src/components/SchemaForm.tsx
+++ b/src/components/SchemaForm.tsx
@@ -353,6 +353,7 @@ const SchemaForm = defineComponent({
                 placeholder={property.default?.toString()}
                 modelValue={modelValue}
                 type={inputType}
+                oneOf={property.oneOf}
                 {...handleUpdateModelValue}
                 clearable
                 {...customProps}
@@ -401,6 +402,7 @@ const SchemaForm = defineComponent({
                 disabled={isPropertyDisabled}
                 placeholder={property.default?.toString()}
                 modelValue={modelValue}
+                oneOf={property.oneOf}
                 {...handleUpdateModelValue}
                 clearable={clearableValue}
                 options={property.symbols}
diff --git a/src/components/SchemaFormItem.tsx b/src/components/SchemaFormItem.tsx
index 4cd64ff7d..9ec2b5bf0 100644
--- a/src/components/SchemaFormItem.tsx
+++ b/src/components/SchemaFormItem.tsx
@@ -154,6 +154,7 @@ export default defineComponent({
                 disabled={isDisabled}
                 type={inputType}
                 clearable
+                oneOf={props.property?.oneOf}
                 {...customProps}
               />
             )
@@ -190,6 +191,7 @@ export default defineComponent({
                 clearable
                 {...customProps}
                 options={props.symbols}
+                oneOf={props.property?.oneOf}
               />
             )
           }
diff --git a/src/hooks/Rule/bridge/useComponentsHandlers.ts b/src/hooks/Rule/bridge/useComponentsHandlers.ts
index 9be62d6b9..378f347a8 100644
--- a/src/hooks/Rule/bridge/useComponentsHandlers.ts
+++ b/src/hooks/Rule/bridge/useComponentsHandlers.ts
@@ -78,10 +78,6 @@ export default (
         prop.is_template
       ) {
         setComponentProps(prop, { completionProvider })
-      } else if (prop.type === 'boolean' && prop.is_template) {
-        prop.type = 'enum'
-        prop.symbols = [true, false]
-        prop.default ??= ''
       } else if (prop.type === 'object' && !prop.properties && prop.is_template) {
         setComponentProps(prop, { supportPlaceholder: ['key', 'value'] })
       }
diff --git a/src/hooks/Schema/useSchemaForm.ts b/src/hooks/Schema/useSchemaForm.ts
index ee01145d3..245bac3b9 100644
--- a/src/hooks/Schema/useSchemaForm.ts
+++ b/src/hooks/Schema/useSchemaForm.ts
@@ -117,6 +117,7 @@ export default function useSchemaForm(
     }
     return property
   }
+  const simpleTypes = ['string', 'number', 'boolean', 'integer']
   const getComponents = (objForGetComponent: { path?: string; ref?: string | Array<string> }) => {
     let lastLabel = ''
     /**
@@ -209,7 +210,14 @@ export default function useSchemaForm(
               }
               return item
             }) as Property[]
-            property.is_template = getIsTemplateFromOneOfArr(property.oneOf)
+            property.is_template = property.is_template ?? getIsTemplateFromOneOfArr(property.oneOf)
+            const isSimpleOneof = oneOf.every(({ type }) => simpleTypes.includes(type))
+            if (isSimpleOneof && property.is_template) {
+              const withBoolean = oneOf.find(({ type }) => type === 'boolean')
+              property.type = withBoolean ? 'enum' : 'string'
+              property.symbols = withBoolean ? [true, false] : undefined
+              property.default = property.default ?? (withBoolean ? '' : undefined)
+            }
           }
           if (!label) {
             property.label = lastLabel
diff --git a/src/types/enum.ts b/src/types/enum.ts
index cbcef4fe5..477bd4a05 100644
--- a/src/types/enum.ts
+++ b/src/types/enum.ts
@@ -280,6 +280,7 @@ export enum PropType {
   Boolean = 'boolean',
   Duration = 'duration',
   Number = 'number',
+  Integer = 'integer',
   IPPort = 'ip_port',
   ByteSize = 'byteSize',
   Object = 'object',