types(VForm): Adding VForm types

src/components/Form/index.ts

@@ -1,8 +1,8 @@
-import BfFrom from './src/BfForm.vue'
+import VFrom from './src/VForm.vue'
 
-export interface BfFormExpose {
+export interface VFormExpose {
   count: number
   sayHello: () => void
 }
 
-export { BfFrom }
+export { VFrom }

src/components/Form/src/BfForm.vue

@@ -1,16 +0,0 @@
-<script lang="tsx" setup>
-// import { ref } from 'vue'
-// import { ElCol, ElRow } from 'element-plus'
-// import { propTypes } from '@/utils/propTypes'
-import { array } from 'vue-types'
-
-defineProps({
-  schema: array<BfFormSchema>()
-})
-</script>
-
-<template>
-  <div>hahah</div>
-</template>
-
-<style lang="less" scoped></style>

src/components/Form/src/VForm.vue

@@ -0,0 +1,43 @@
+<script lang="tsx">
+import { PropType, defineComponent, onMounted, ref, unref } from 'vue'
+import { ElForm } from 'element-plus'
+// import { COMPONENT_MAP } from './componentMap'
+import { propTypes } from '@/utils/propTypes'
+
+export default defineComponent({
+  name: 'VForm',
+  props: {
+    // 生成Form的布局结构数组
+    schema: {
+      type: Array as PropType<VFormSchema[]>,
+      require: true,
+      default: () => []
+    },
+    // 是否需要栅格布局
+    isCol: propTypes.bool.def(true),
+    // 表单数据对象
+    model: {
+      type: Object as PropType<Recordable>,
+      default: () => ({})
+    },
+    // 是否自动设置placeholder
+    autoSetPlaceholder: propTypes.bool.def(true),
+    // 是否自定义内容
+    isCustom: propTypes.bool.def(false)
+  },
+  setup() {
+    const formRef = ref<ComponentRef<typeof ElForm>>()
+    onMounted(() => {
+      console.log(unref(formRef)?.clearValidate)
+    })
+
+    // function renderWrap() {}
+
+    // function renderFormItem() {}
+
+    return () => <ElForm ref={formRef}></ElForm>
+  }
+})
+</script>
+
+<style lang="less" scoped></style>

src/components/Form/src/componentMap.ts

@@ -0,0 +1,42 @@
+import type { Component } from 'vue'
+import {
+  ElCascader,
+  ElCheckboxGroup,
+  ElColorPicker,
+  ElDatePicker,
+  ElInput,
+  ElInputNumber,
+  ElRadioGroup,
+  ElRate,
+  ElSelect,
+  ElSelectV2,
+  ElSlider,
+  ElSwitch,
+  ElTimePicker,
+  ElTimeSelect,
+  ElTransfer,
+  ElAutocomplete,
+  ElDivider
+} from 'element-plus'
+
+const COMPONENT_MAP: Recordable<Component, ComponentName> = {
+  Radio: ElRadioGroup,
+  Checkbox: ElCheckboxGroup,
+  Input: ElInput,
+  Autocomplete: ElAutocomplete,
+  InputNumber: ElInputNumber,
+  Select: ElSelect,
+  Cascader: ElCascader,
+  Switch: ElSwitch,
+  Slider: ElSlider,
+  TimePicker: ElTimePicker,
+  DatePicker: ElDatePicker,
+  Rate: ElRate,
+  ColorPicker: ElColorPicker,
+  Transfer: ElTransfer,
+  Divider: ElDivider,
+  TimeSelect: ElTimeSelect,
+  SelectV2: ElSelectV2
+}
+
+export { COMPONENT_MAP }

src/components/Form/src/helper.ts

@@ -0,0 +1,8 @@
+/**
+ *
+ * @param schema 对应组件数据
+ * @description 用于自动设置placeholder
+ */
+export function setTextPlaceholder(schema: VFormSchema) {
+  console.log(schema)
+}