diff --git a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue index 4376cbc9f4..9d862c47bd 100644 --- a/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue +++ b/core/core-frontend/src/custom-component/rich-text/DeRichTextView.vue @@ -61,11 +61,15 @@ import { useEmitt } from '@/hooks/web/useEmitt' import { valueFormatter } from '@/views/chart/components/js/formatter' import { parseJson } from '@/views/chart/components/js/util' import { mappingColor } from '@/views/chart/components/js/panel/common/common_table' +import { CHART_FONT_FAMILY } from '@/views/chart/components/editor/util/chart' +import { useAppearanceStoreWithOut } from '@/store/modules/appearance' const snapshotStore = snapshotStoreWithOut() const errMsg = ref('') const dvMainStore = dvMainStoreWithOut() const { canvasViewInfo } = storeToRefs(dvMainStore) const isError = ref(false) +const appearanceStore = useAppearanceStoreWithOut() + const props = defineProps({ scale: { type: Number, @@ -121,6 +125,21 @@ const canEdit = ref(false) // 初始化配置 const tinymceId = 'tinymce-view-' + element.value.id const myValue = ref('') + +const systemFontFamily = appearanceStore.fontList.map(item => item.name) +const curFontFamily = () => { + let result = '' + CHART_FONT_FAMILY.concat( + appearanceStore.fontList.map(ele => ({ + name: ele.name, + value: ele.name + })) + ).forEach(font => { + result = result + font.name + '=' + font.name + ';' + }) + return result +} + const init = ref({ selector: '#' + tinymceId, toolbar_items_size: 'small', @@ -136,8 +155,7 @@ const init = ref({ 'top-align center-align bottom-align | alignleft aligncenter alignright | bullist numlist |' + ' blockquote subscript superscript removeformat | table image ', toolbar_location: '/', - font_formats: - '微软雅黑=Microsoft YaHei;宋体=SimSun;黑体=SimHei;仿宋=FangSong;华文黑体=STHeiti;华文楷体=STKaiti;华文宋体=STSong;华文仿宋=STFangsong;Andale Mono=andale mono,times;Arial=arial,helvetica,sans-serif;Arial Black=arial black,avant garde;Book Antiqua=book antiqua,palatino;Comic Sans MS=comic sans ms,sans-serif;Courier New=courier new,courier;Georgia=georgia,palatino;Helvetica=helvetica;Impact=impact,chicago;Symbol=symbol;Tahoma=tahoma,arial,helvetica,sans-serif;Terminal=terminal,monaco;Times New Roman=times new roman,times;Trebuchet MS=trebuchet ms,geneva;Verdana=verdana,geneva;Webdings=webdings;Wingdings=wingdings', + font_formats: curFontFamily(), fontsize_formats: '12px 14px 16px 18px 20px 22px 24px 28px 32px 36px 42px 48px 56px 72px', // 字体大小 menubar: false, placeholder: '', @@ -178,6 +196,7 @@ watch( } if (initReady.value && canEdit.value) { snapshotStore.recordSnapshotCache('renderChart', element.value.id) + initFontFamily(myValue.value) } } ) @@ -248,8 +267,19 @@ const assignment = content => { content = content.replace(/href="#\//g, 'href="/#/') content = content.replace(/href=\\"#\//g, 'href=\\"/#/') resetSelect() + initFontFamily(content) return content } +const initFontFamily = htmlText => { + const regex = /font-family:\s*([^;"]+);/g + let match + while ((match = regex.exec(htmlText)) !== null) { + const font = match[1].trim() + if (systemFontFamily.includes(font)) { + appearanceStore.setCurrentFont(font) + } + } +} const fieldSelect = field => { const ed = tinymce.editors[tinymceId] const fieldId = 'changeText-' + guid()