<script setup lang="ts">
import Editor from '@tinymce/tinymce-vue'
import { upload } from '@/utils/upload'

const props = defineProps({
  height: {
    type: Number,
    default: 600,
  },
})

const ImageUploadHandler = (blobInfo: any) =>
  new Promise((resolve, reject) => {
    upload(blobInfo.blob())
      .then((url) => {
        resolve(url)
      })
      .catch(() => {
        reject('上传失败')
      })
  })

const init = {
  language: 'zh-Hans',
  height: props.height,
  menubar: false,
  statusbar: false,
  // plugins: 'table charmap fullscreen lists link code preview quickbars',
  toolbar:
    'undo redo | fontsizeselect lineheight bold italic underline strikethrough forecolor backcolor | link quickimage image media table | align hangingindent indent outdent numlist bullist | charmap  blockquote hr fullscreen | code preview',
  // font_formats:
  //   '微软雅黑=Microsoft YaHei,Helvetica Neue,PingFang SC,sans-serif;苹果苹方=PingFang SC,Microsoft YaHei,sans-serif;宋体=simsun,serif;仿宋体=FangSong,serif;黑体=SimHei,sans-serif;Arial=arial,helvetica,sans-serif;Times New Roman',
  fontsize_formats: '8px 10px 12px 14px 15px 16px 17px 18px 20px 24px',
  lineheight_formats: '0.5 1 1.2 1.5 2',
  images_upload_handler: ImageUploadHandler,
  automatic_uploads: true,
  quickbars_insert_toolbar: false,
  // style_formats: [{ title: '悬挂缩进', block: 'p', styles: { textIndent: '-2em', paddingLeft: '2em' } }],
  content_style: 'img {max-width:100%;}',
  // plugins: ['paste'],
  // paste_auto_cleanup_on_paste: true,
  // paste_remove_styles: true,
  // paste_remove_styles_if_webkit: true,
  // paste_strip_class_attributes: true,
  // paste_as_text: true,
}
</script>

<template>
  <editor :init="init" v-bind="$attrs" style="width: 100%" />
</template>
