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

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

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

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

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

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

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