Browse Source

feat: form Editor component

main
xingyu 2 years ago
parent
commit
110a352a1c
  1. 2
      src/components/Form/src/componentMap.ts
  2. 1
      src/components/Form/src/types/index.ts
  3. 7
      src/views/system/notice/NoticeModal.vue
  4. 3
      src/views/system/notice/notice.data.ts

2
src/components/Form/src/componentMap.ts

@ -32,6 +32,7 @@ import { BasicUpload } from '@/components/Upload'
import { StrengthMeter } from '@/components/StrengthMeter'
import { IconPicker } from '@/components/Icon'
import { CountdownInput } from '@/components/CountDown'
import { Tinymce } from '@/components/Tinymce'
const componentMap = new Map<ComponentType, Component>()
@ -71,6 +72,7 @@ componentMap.set('InputCountDown', CountdownInput)
componentMap.set('Upload', BasicUpload)
componentMap.set('Divider', Divider)
componentMap.set('Editor', Tinymce)
export function add(compName: ComponentType, component: Component) {
componentMap.set(compName, component)

1
src/components/Form/src/types/index.ts

@ -115,3 +115,4 @@ export type ComponentType =
| 'Rate'
| 'Divider'
| 'ApiTransfer'
| 'Editor'

7
src/views/system/notice/NoticeModal.vue

@ -1,15 +1,10 @@
<template>
<BasicModal v-bind="$attrs" @register="registerModal" :title="isUpdate ? t('action.edit') : t('action.create')" @ok="handleSubmit">
<BasicForm @register="registerForm">
<template #editor="{ model, field }">
<Tinymce v-model="model[field]" width="100%" />
</template>
</BasicForm>
<BasicForm @register="registerForm" />
</BasicModal>
</template>
<script lang="ts" setup name="SystemNoticeModal">
import { ref, unref } from 'vue'
import { Tinymce } from '@/components/Tinymce'
import { useI18n } from '@/hooks/web/useI18n'
import { useMessage } from '@/hooks/web/useMessage'
import { BasicForm, useForm } from '@/components/Form'

3
src/views/system/notice/notice.data.ts

@ -90,7 +90,6 @@ export const formSchema: FormSchema[] = [
{
label: '内容',
field: 'content',
component: 'Input',
slot: 'editor'
component: 'Editor'
}
]