use-editor-config.js 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081
  1. import { computed, reactive } from 'vue'
  2. import { isArray, isEmpty } from '@cip/utils/util'
  3. import { defaultMenus } from '@cip/components/cip-form-input/basic/editor/config'
  4. /**
  5. *
  6. * @param securityConfig
  7. * @returns {UnwrapNestedRefs<{showFullScreen: ComputedRef<unknown>, pasteIgnoreImg: ComputedRef<unknown>, emotions: ComputedRef<unknown>, fontNames: ComputedRef<unknown>, pasteFilterStyle: ComputedRef<unknown>, menuTooltipPosition: ComputedRef<unknown>, fontSizes: ComputedRef<unknown>, menus: ComputedRef<unknown>, placeholder: ComputedRef<unknown>, customUploadImg: ComputedRef<unknown>, colors: ComputedRef<unknown>, showMenuTooltips: ComputedRef<unknown>}>}
  8. */
  9. export const useEditorConfig = (securityConfig) => {
  10. const height = computed(() => {
  11. // 编辑器高度配置
  12. return securityConfig.value.height ?? null
  13. })
  14. const menus = computed(() => {
  15. // 编辑器菜单配置
  16. const menu = securityConfig.value.menus
  17. if (isEmpty(menu) || menu === '') return defaultMenus
  18. if (!isArray(menu)) return menu.split(',')
  19. return menu
  20. })
  21. const colors = computed(() => {
  22. // 编辑器字体及背景色配置
  23. return securityConfig.value.colors ?? null
  24. })
  25. const fontNames = computed(() => {
  26. // 编辑器字体配置
  27. return securityConfig.value.fontNames ?? null
  28. })
  29. const fontSizes = computed(() => {
  30. // 编辑器字号配置
  31. return securityConfig.value.fontSizes ?? null
  32. })
  33. const emotions = computed(() => {
  34. // 编辑器表情图标配置
  35. return securityConfig.value.emotions ?? null
  36. })
  37. const showFullScreen = computed(() => {
  38. // 配置全屏功能按钮是否展示
  39. return securityConfig.value.showFullScreen ?? true
  40. })
  41. const showMenuTooltips = computed(() => {
  42. // 是否显示菜单栏提示
  43. return securityConfig.value.showMenuTooltips ?? true
  44. })
  45. const menuTooltipPosition = computed(() => {
  46. // 菜单栏提示上标(up)还是下标(down)
  47. return securityConfig.value.menuTooltipPosition ?? 'up'
  48. })
  49. const pasteFilterStyle = computed(() => {
  50. // 是否开启粘贴样式过滤
  51. return securityConfig.value.pasteFilterStyle ?? true
  52. })
  53. const pasteIgnoreImg = computed(() => {
  54. // 是否忽略粘贴内容的图片
  55. return securityConfig.value.pasteIgnoreImg ?? null
  56. })
  57. const customUploadImg = computed(() => {
  58. // 自定义上传图片
  59. return securityConfig.value.customUploadImg ?? null
  60. })
  61. const placeholder = computed(() => {
  62. // 默认占位符
  63. return securityConfig.value.placeholder ?? null
  64. })
  65. return reactive({
  66. height,
  67. menus,
  68. colors,
  69. fontSizes,
  70. emotions,
  71. fontNames,
  72. showFullScreen,
  73. showMenuTooltips,
  74. menuTooltipPosition,
  75. pasteFilterStyle,
  76. pasteIgnoreImg,
  77. customUploadImg,
  78. placeholder
  79. })
  80. }