npm - @maketribe/ms-app - Versions diffs - 3.2.37 → 3.2.39 - Mend

@maketribe/ms-app 3.2.37 → 3.2.39

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (45) hide show

package/dist/cjs/modules/cms/pages/cms-contents/components/article-list.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"article-list.vue.js","sources":["../../../../../../../src/modules/cms/pages/cms-contents/components/article-list.vue"],"sourcesContent":["<template>\r\n <MKDataTable :data-table=\"articlesDv\" :auto-load=\"false\" class=\"mk-cms-article-list\">\r\n <el-empty v-if=\"part && part.cmsPartTypeId == 1\" description=\"外链栏目下无文章内容\" />\r\n <MKTableView v-else-if=\"part\" :data-table=\"articlesDv\">\r\n <el-scrollbar class=\"mk-cms-article-list__content\" style=\"box-sizing: border-box;font-size: 0;\"\r\n v-if=\"articlesDv.getList().length > 0\">\r\n <el-card class=\"mk-cms-article-list__item\" v-for=\"article in articlesDv.getList()\" :key=\"article.id\">\r\n <div class=\"mk-cms-article-list__item__content\">\r\n <div class=\"left\">\r\n <el-image class=\"cover-image\" :src=\"article.cover\" fit=\"contain\">\r\n <template #error>\r\n <MKSvgIcon iconClass=\"Picture\" />\r\n </template>\r\n </el-image>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"top\">\r\n <div class=\"title\" :title=\"article.title\"> {{ article.title }}</div>\r\n <div class=\"tags\">\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useTop && article.isTop == 1\"\r\n @click=\"changeArticleStatus(article, 'isTop', 0)\">置顶</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useNew && article.isNew == 1\"\r\n @click=\"changeArticleStatus(article, 'isNew', 0)\">最新</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useHotRecommend && article.isHotRecommend == 1\"\r\n @click=\"changeArticleStatus(article, 'isHotRecommend', 0)\">热门推荐</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.usePartRecommend && article.isPartRecommend == 1\"\r\n @click=\"changeArticleStatus(article, 'isPartRecommend', 0)\">栏目推荐</el-tag>\r\n </div>\r\n </div>\r\n <div class=\"sub-title\" v-if=\"article.subTitle\" :title=\"article.subTitle\"> {{ article.subTitle }}</div>\r\n <div class=\"desc\">\r\n {{ article.desc }}\r\n </div>\r\n <div class=\"footer\">\r\n <div class=\"ext\">\r\n <div class=\"author\">\r\n <MKSvgIcon iconClass=\"UserFilled\"></MKSvgIcon>\r\n 作者 : {{ article.author \|\| \"-\" }}\r\n </div>\r\n <div class=\"publish-time\" v-if=\"article.releaseDate\">\r\n <MKSvgIcon iconClass=\"Timer\"></MKSvgIcon>\r\n 发布时间： {{ article.releaseDate }}\r\n </div>\r\n </div>\r\n <div class=\"tools\">\r\n <el-button type=\"primary\" size=\"large\" @click=\"editArticleHandle(article)\" text>\r\n 编辑\r\n </el-button>\r\n <el-button type=\"danger\" size=\"large\" @click=\"deleteArticleHandle(article)\" text>\r\n 删除\r\n </el-button>\r\n <!-- <a v-if=\"CmsSettings.publish.mode == 'static' && article.url\" :href=\"article.url\" target=\"_blank\">\r\n <el-button type=\"primary\" size=\"large\" text>访问</el-button>\r\n </a> -->\r\n <a :href=\"'/api/cms/content/preview/content/' + article.cmsPartId + '/' + article.id\"\r\n v-if=\"CmsSettings.publish.mode == 'static'\" target=\"_blank\">\r\n <el-button type=\"primary\" size=\"large\" text>预览</el-button>\r\n </a>\r\n <el-dropdown>\r\n <el-button type=\"primary\" size=\"large\" text>\r\n 更多\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-if=\"CmsSettings.publish.mode == 'static' && article.url\">\r\n <a style=\"text-decoration: none;color: #606266;\"\r\n v-if=\"CmsSettings.publish.mode == 'static' && article.url\" :href=\"article.url\"\r\n target=\"_blank\">\r\n 访问\r\n </a>\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"publishArticleHandle(article)\">\r\n 发布\r\n </el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useTop && article.isTop == 0\"\r\n @click=\"changeArticleStatus(article, 'isTop', 1)\">设为置顶</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useNew && article.isNew == 0\"\r\n @click=\"changeArticleStatus(article, 'isNew', 1)\">设为最新</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useHotRecommend && article.isHotRecommend == 0\"\r\n @click=\"changeArticleStatus(article, 'isHotRecommend', 1)\">设为热门推荐</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.usePartRecommend && article.isPartRecommend == 0\"\r\n @click=\"changeArticleStatus(article, 'isPartRecommend', 1)\">设为栏目推荐</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </el-card>\r\n </el-scrollbar>\r\n <el-empty v-if=\"articlesDv.getList().length <= 0\" description=\"暂无文章内容\" />\r\n </MKTableView>\r\n </MKDataTable>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { MKTableView } from \"../../../../../components\"\r\nimport { CmsArticlesTable, CmsArticlesForm } from \"../../../dataviews\"\r\nimport { reactive, defineProps, watch, onMounted } from \"vue\";\r\nimport { Dialoger, isWhereFilter, Messager } from '@maketribe/dm'\r\nimport { useRouter } from \"vue-router\";\r\nimport { useCmsSettings } from \"../../../cms-settings\"\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings();\r\n\r\n// 文章\r\nconst articlesDv = reactive(new CmsArticlesTable()) as CmsArticlesTable;\r\n// 发布文章表单\r\nconst articleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\n// 草稿文章\r\nconst draftArticleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\n\r\n// 参数\r\nconst props = defineProps({\r\n part: { type: Object, default: null }\r\n})\r\n\r\nconst router = useRouter();\r\n\r\n//改变文章指定，最新，推荐状态\r\nconst changeArticleStatus = async (article: any, item: string, status: number) => {\r\n const text: Record<string, string[]> = {\r\n \"isTop\": ['取消置顶', '设为置顶'],\r\n \"isNew\": ['取消最新', '设为最新'],\r\n \"isHotRecommend\": ['取消热门推荐', '设为热门推荐'],\r\n \"isPartRecommend\": ['取消栏目推荐', '设为栏目推荐'],\r\n }\r\n\r\n const isConfirm = await Dialoger.confirm({\r\n title: \"修改文章状态\",\r\n message: `是否${text[item][status]}?`,\r\n type: \"warning\"\r\n })\r\n if (!isConfirm) {\r\n return\r\n }\r\n try {\r\n\r\n articlesDv.getLoadingManager().startLoading();\r\n await articleForm.editRecord(article.id)\r\n const isSuccess = await articleForm.simpleSubmit({\r\n id: article.id,\r\n [item]: status\r\n })\r\n\r\n if (isSuccess) {\r\n articlesDv.load();\r\n }\r\n } finally {\r\n articlesDv.getLoadingManager().completeLoading();\r\n }\r\n\r\n\r\n}\r\n\r\n// 初始化\r\nonMounted(() => {\r\n articleForm.init();\r\n draftArticleForm.init();\r\n\r\n // 监听栏目数据变化\r\n watch(() => props.part, (item: any) => {\r\n if (item.cmsPartTypeId != 1) {\r\n \r\n const dataFilter = articlesDv.dataFilter;\r\n\r\n if (isWhereFilter(dataFilter)) {\r\n\r\n const defaultGroup = dataFilter.getDefaultGroup();\r\n\r\n defaultGroup.clear();\r\n defaultGroup.addCondition(\"cmsPartId\", \"=\", item.id);\r\n // 只查草稿\r\n defaultGroup.addCondition(\"isDraft\", \"=\", 1);\r\n }\r\n\r\n articlesDv.load()\r\n }\r\n }, { immediate: true })\r\n})\r\n\r\n/*\r\n 删除文章\r\n /\r\nconst deleteArticleHandle = async (item: any) => {\r\n const isConfirm = await Dialoger.confirm({\r\n title: \"删除文章?\",\r\n message: \"是否删除文章？\",\r\n type: \"warning\"\r\n })\r\n\r\n if (!isConfirm) { return; }\r\n await articlesDv.deleteAfterRefresh(item.id);\r\n}\r\n\r\n/\r\n 编辑文章\r\n /\r\nconst editArticleHandle = (item: any, isEdit = false) => {\r\n router.push({ path: \"/cms/article\", query: { id: isEdit ? undefined : item.id, partId: isEdit ? item.id : undefined } })\r\n}\r\n\r\n// 添加记录\r\narticlesDv.addRecordEvent.on(() => editArticleHandle(props.part, true))\r\n\r\n/\r\n fault文章\r\n * @param article \r\n */\r\nconst publishArticleHandle = async (article: any) => {\r\n\r\n try {\r\n\r\n if (await Dialoger.confirm({ title: \"文章发布\", message: \"是否发布文章？\", type: \"warning\" })) {\r\n\r\n articlesDv.getLoadingManager().startLoading();\r\n\r\n // 调用发布接口\r\n const response: any = await CmsArticlesForm.publish(CmsSettings.publish.mode, article.cmsPartId, article.id);\r\n\r\n if (response.data.code !== 200) {\r\n Messager.error({ message: response.data.msg });\r\n return;\r\n }\r\n\r\n Messager.success({ message: \"发布成功\" });\r\n }\r\n\r\n } finally {\r\n articlesDv.getLoadingManager().completeLoading();\r\n }\r\n}\r\n\r\n\r\n</script>\r\n"],"names":["useCmsSettings","reactive","CmsArticlesTable","CmsArticlesForm","useRouter","Dialoger","onMounted","watch","isWhereFilter","Messager"],"mappings":"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"}
1	+ {"version":3,"file":"article-list.vue.js","sources":["../../../../../../../src/modules/cms/pages/cms-contents/components/article-list.vue"],"sourcesContent":["<template>\r\n <MKDataTable :data-table=\"articlesDv\" :auto-load=\"false\" class=\"mk-cms-article-list\">\r\n <el-empty v-if=\"part && part.cmsPartTypeId == 1\" description=\"外链栏目下无文章内容\" />\r\n <MKTableView v-else-if=\"part\" :data-table=\"articlesDv\">\r\n <el-scrollbar class=\"mk-cms-article-list__content\" style=\"box-sizing: border-box;font-size: 0;\"\r\n v-if=\"articlesDv.getList().length > 0\">\r\n <el-card class=\"mk-cms-article-list__item\" v-for=\"article in articlesDv.getList()\" :key=\"article.id\">\r\n <div class=\"mk-cms-article-list__item__content\">\r\n <div class=\"left\">\r\n <el-image class=\"cover-image\" :src=\"article.cover\" fit=\"contain\">\r\n <template #error>\r\n <MKSvgIcon iconClass=\"Picture\" />\r\n </template>\r\n </el-image>\r\n </div>\r\n <div class=\"right\">\r\n <div class=\"top\">\r\n <div class=\"title\" :title=\"article.title\"> {{ article.title }}</div>\r\n <div class=\"tags\">\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useTop && article.isTop == 1\"\r\n @click=\"changeArticleStatus(article, 'isTop', 0)\">置顶</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useNew && article.isNew == 1\"\r\n @click=\"changeArticleStatus(article, 'isNew', 0)\">最新</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.useHotRecommend && article.isHotRecommend == 1\"\r\n @click=\"changeArticleStatus(article, 'isHotRecommend', 0)\">热门推荐</el-tag>\r\n <el-tag class=\"tag\" v-if=\"CmsSettings.content.usePartRecommend && article.isPartRecommend == 1\"\r\n @click=\"changeArticleStatus(article, 'isPartRecommend', 0)\">栏目推荐</el-tag>\r\n </div>\r\n </div>\r\n <div class=\"sub-title\" v-if=\"article.subTitle\" :title=\"article.subTitle\"> {{ article.subTitle }}</div>\r\n <div class=\"desc\">\r\n {{ article.desc }}\r\n </div>\r\n <div class=\"footer\">\r\n <div class=\"ext\">\r\n <div class=\"author\">\r\n <MKSvgIcon iconClass=\"UserFilled\"></MKSvgIcon>\r\n 作者 : {{ article.author \|\| \"-\" }}\r\n </div>\r\n <div class=\"publish-time\" v-if=\"article.releaseDate\">\r\n <MKSvgIcon iconClass=\"Timer\"></MKSvgIcon>\r\n 新闻日期： {{ article.releaseDate }}\r\n </div>\r\n </div>\r\n <div class=\"tools\">\r\n <el-button type=\"primary\" size=\"large\" @click=\"editArticleHandle(article)\" text>\r\n 编辑\r\n </el-button>\r\n <el-button type=\"danger\" size=\"large\" @click=\"deleteArticleHandle(article)\" text>\r\n 删除\r\n </el-button>\r\n <!-- <a v-if=\"CmsSettings.publish.mode == 'static' && article.url\" :href=\"article.url\" target=\"_blank\">\r\n <el-button type=\"primary\" size=\"large\" text>访问</el-button>\r\n </a> -->\r\n <a :href=\"'/api/cms/content/preview/content/' + article.cmsPartId + '/' + article.id\"\r\n v-if=\"CmsSettings.publish.mode == 'static'\" target=\"_blank\">\r\n <el-button type=\"primary\" size=\"large\" text>预览</el-button>\r\n </a>\r\n <el-dropdown>\r\n <el-button type=\"primary\" size=\"large\" text>\r\n 更多\r\n </el-button>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item v-if=\"CmsSettings.publish.mode == 'static' && article.url\">\r\n <a style=\"text-decoration: none;color: #606266;\"\r\n v-if=\"CmsSettings.publish.mode == 'static' && article.url\" :href=\"article.url\"\r\n target=\"_blank\">\r\n 访问\r\n </a>\r\n </el-dropdown-item>\r\n <el-dropdown-item @click=\"publishArticleHandle(article)\">\r\n 发布\r\n </el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useTop && article.isTop == 0\"\r\n @click=\"changeArticleStatus(article, 'isTop', 1)\">设为置顶</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useNew && article.isNew == 0\"\r\n @click=\"changeArticleStatus(article, 'isNew', 1)\">设为最新</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.useHotRecommend && article.isHotRecommend == 0\"\r\n @click=\"changeArticleStatus(article, 'isHotRecommend', 1)\">设为热门推荐</el-dropdown-item>\r\n <el-dropdown-item v-if=\"CmsSettings.content.usePartRecommend && article.isPartRecommend == 0\"\r\n @click=\"changeArticleStatus(article, 'isPartRecommend', 1)\">设为栏目推荐</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </el-card>\r\n </el-scrollbar>\r\n <el-empty v-if=\"articlesDv.getList().length <= 0\" description=\"暂无文章内容\" />\r\n </MKTableView>\r\n </MKDataTable>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { MKTableView } from \"../../../../../components\"\r\nimport { CmsArticlesTable, CmsArticlesForm } from \"../../../dataviews\"\r\nimport { reactive, defineProps, watch, onMounted } from \"vue\";\r\nimport { Dialoger, isWhereFilter, Messager } from '@maketribe/dm'\r\nimport { useRouter } from \"vue-router\";\r\nimport { useCmsSettings } from \"../../../cms-settings\"\r\n// cms 配置\r\nconst CmsSettings = useCmsSettings();\r\n\r\n// 文章\r\nconst articlesDv = reactive(new CmsArticlesTable()) as CmsArticlesTable;\r\n// 发布文章表单\r\nconst articleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\n// 草稿文章\r\nconst draftArticleForm = reactive(new CmsArticlesForm()) as CmsArticlesForm;\r\n\r\n// 参数\r\nconst props = defineProps({\r\n part: { type: Object, default: null }\r\n})\r\n\r\nconst router = useRouter();\r\n\r\n//改变文章指定，最新，推荐状态\r\nconst changeArticleStatus = async (article: any, item: string, status: number) => {\r\n const text: Record<string, string[]> = {\r\n \"isTop\": ['取消置顶', '设为置顶'],\r\n \"isNew\": ['取消最新', '设为最新'],\r\n \"isHotRecommend\": ['取消热门推荐', '设为热门推荐'],\r\n \"isPartRecommend\": ['取消栏目推荐', '设为栏目推荐'],\r\n }\r\n\r\n const isConfirm = await Dialoger.confirm({\r\n title: \"修改文章状态\",\r\n message: `是否${text[item][status]}?`,\r\n type: \"warning\"\r\n })\r\n if (!isConfirm) {\r\n return\r\n }\r\n try {\r\n\r\n articlesDv.getLoadingManager().startLoading();\r\n await articleForm.editRecord(article.id)\r\n const isSuccess = await articleForm.simpleSubmit({\r\n id: article.id,\r\n [item]: status\r\n })\r\n\r\n if (isSuccess) {\r\n articlesDv.load();\r\n }\r\n } finally {\r\n articlesDv.getLoadingManager().completeLoading();\r\n }\r\n\r\n\r\n}\r\n\r\n// 初始化\r\nonMounted(() => {\r\n articleForm.init();\r\n draftArticleForm.init();\r\n\r\n // 监听栏目数据变化\r\n watch(() => props.part, (item: any) => {\r\n if (item.cmsPartTypeId != 1) {\r\n \r\n const dataFilter = articlesDv.dataFilter;\r\n\r\n if (isWhereFilter(dataFilter)) {\r\n\r\n const defaultGroup = dataFilter.getDefaultGroup();\r\n\r\n defaultGroup.clear();\r\n defaultGroup.addCondition(\"cmsPartId\", \"=\", item.id);\r\n // 只查草稿\r\n defaultGroup.addCondition(\"isDraft\", \"=\", 1);\r\n }\r\n\r\n articlesDv.load()\r\n }\r\n }, { immediate: true })\r\n})\r\n\r\n/*\r\n 删除文章\r\n /\r\nconst deleteArticleHandle = async (item: any) => {\r\n const isConfirm = await Dialoger.confirm({\r\n title: \"删除文章?\",\r\n message: \"是否删除文章？\",\r\n type: \"warning\"\r\n })\r\n\r\n if (!isConfirm) { return; }\r\n await articlesDv.deleteAfterRefresh(item.id);\r\n}\r\n\r\n/\r\n 编辑文章\r\n /\r\nconst editArticleHandle = (item: any, isEdit = false) => {\r\n router.push({ path: \"/cms/article\", query: { id: isEdit ? undefined : item.id, partId: isEdit ? item.id : undefined } })\r\n}\r\n\r\n// 添加记录\r\narticlesDv.addRecordEvent.on(() => editArticleHandle(props.part, true))\r\n\r\n/\r\n fault文章\r\n * @param article \r\n */\r\nconst publishArticleHandle = async (article: any) => {\r\n\r\n try {\r\n\r\n if (await Dialoger.confirm({ title: \"文章发布\", message: \"是否发布文章？\", type: \"warning\" })) {\r\n\r\n articlesDv.getLoadingManager().startLoading();\r\n\r\n // 调用发布接口\r\n const response: any = await CmsArticlesForm.publish(CmsSettings.publish.mode, article.cmsPartId, article.id);\r\n\r\n if (response.data.code !== 200) {\r\n Messager.error({ message: response.data.msg });\r\n return;\r\n }\r\n\r\n Messager.success({ message: \"发布成功\" });\r\n }\r\n\r\n } finally {\r\n articlesDv.getLoadingManager().completeLoading();\r\n }\r\n}\r\n\r\n\r\n</script>\r\n"],"names":["useCmsSettings","reactive","CmsArticlesTable","CmsArticlesForm","useRouter","Dialoger","onMounted","watch","isWhereFilter","Messager"],"mappings":"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"}

package/dist/cjs/modules/ms/components/rich-text-editor/rich-text-editor.js CHANGED Viewed

@@ -34,7 +34,6 @@ const RichTextEditor = /* @__PURE__ */ vue.defineComponent({
         //"undo redo | styles | fontfamily |  fontsize forecolor | bold italic underline strikethrough | alignleft aligncenter alignright | material | outdent indent | link | table | hr | removeformat  | code fullscreen"
         toolbar: props.toolbar,
         inline: props.inline,
-        forced_root_block: " ",
         valid_elements: "*[*]",
         // 允许所有元素和属性
         extended_valid_elements: "script[src|async|defer|type|charset]",
@@ -50,7 +49,6 @@ const RichTextEditor = /* @__PURE__ */ vue.defineComponent({
         language: "zh-Hans",
         skin_url: "ms",
         content_css: "ms",
-        end_container_on_empty_block: ">",
         content_style: content,
         // quickbars_insert_toolbar: 'image',
         // quickbars_selection_toolbar: 'forecolor backcolor fontsize | bold italic underline |  fontfamily',
@@ -79,9 +77,9 @@ const RichTextEditor = /* @__PURE__ */ vue.defineComponent({
       vue.watch(vue.computed(() => props.modelValue), (modelValue) => {
         for (const instance2 of tinymceInstance) {
           if (instance2.getContent() !== modelValue) {
-            instance2.setContent(modelValue || "<p></p>");
+            instance2.setContent(modelValue || "<div></div");
           } else if (!modelValue) {
-            instance2.setContent("<p></p>");
+            instance2.setContent("<div></div>");
           }
         }
       }, {

package/dist/cjs/modules/ms/components/rich-text-editor/rich-text-editor.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"rich-text-editor.js","sources":["../../../../../../src/modules/ms/components/rich-text-editor/rich-text-editor.tsx"],"sourcesContent":["import { Ref, computed, defineComponent, getCurrentInstance, onBeforeUnmount, onMounted, ref, unref, watch, withCtx } from \"vue\";\r\nimport { MKMaterialSelect } from \"../material-select\";\r\nimport TinyMCE from \"tinymce\";\r\nimport \"tinymce/themes/silver/theme.js\";\r\nimport \"tinymce/models/dom/model.min.js\";\r\nimport \"tinymce/icons/default/icons.min.js\";\r\nimport \"tinymce/plugins/link\";\r\n// import \"tinymce/plugins/table\";\r\nimport \"tinymce/plugins/fullscreen\";\r\nimport \"tinymce/plugins/code\";\r\n// import \"tinymce/plugins/image\";\r\nimport \"tinymce/plugins/quickbars\";\r\nimport \"tinymce/plugins/lists\";\r\nimport \"./langs/zh-Hans.js\";\r\n\r\nimport \"./skins/ui/ms/skin.js\";\r\nimport \"./skins/ui/ms/content.js\";\r\nimport \"./skins/content/ms/content.js\";\r\n\r\nimport contentStyle from \"./content.css?raw\";\r\n\r\nimport { richTextEditorEmits, richTextEditorProps } from \"./rich-text-editor-options\";\r\n\r\nexport default defineComponent({\r\n\tname: \"MKRichTextEditor\",\r\n\tprops: richTextEditorProps,\r\n\temits: richTextEditorEmits,\r\n\tsetup(props, { emit }) {\r\n\t\tconst richTextEditorEl: Ref<HTMLElement \| null> = ref(null);\r\n\r\n\t\tconst instance = getCurrentInstance();\r\n\r\n // 这个方法暂时没用上\r\n\t\t// function escapeHtml(text: string) {\r\n\t\t// \treturn text.replace(/&/g, \"&\").replace(/</g, \"<\").replace(/>/g, \">\").replace(/\"/g, \""\").replace(/'/g, \"'\");\r\n\t\t// }\r\n\r\n\t\tonMounted(async () => {\r\n\t\t\tconst tinymceInstance = await TinyMCE.init({\r\n\t\t\t\ttarget: unref(richTextEditorEl)!,\r\n\t\t\t\tpromotion: false, \r\n menubar: false,\r\n\t\t\t\tplugins:props.plugins,\r\n //\"undo redo \| styles \| fontfamily \| fontsize forecolor \| bold italic underline strikethrough \| alignleft aligncenter alignright \| material \| outdent indent \| link \| table \| hr \| removeformat \| code fullscreen\"\r\n toolbar: props.toolbar,\r\n inline: props.inline,\r\n\t\t\t\~~tforced_root_block: \" \",\r\n\t\t\t\~~tvalid_elements: \"[]\", // 允许所有元素和属性\r\n\t\t\t\textended_valid_elements: \"script[src\|async\|defer\|type\|charset]\", // 允许 script 标签的特定属性\r\n\t\t\t\tcustom_elements: \"~script\", // 允许自定义标签\r\n\t\t\t\tvalid_children: \"+body[script]\", // 允许 body 包含 script 标签\r\n\t\t\t\tcleanup: false,\r\n\t\t\t\tapply_source_formatting: false,\r\n\t\t\t\tverify_html: false,\r\n\t\t\t\tfont_family_formats:\r\n\t\t\t\t\t\"微软雅黑='微软雅黑';宋体='宋体';黑体='黑体';仿宋='仿宋';楷体='楷体';隶书='隶书';幼圆='幼圆';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\",\r\n\t\t\t\tlanguage: \"zh-Hans\",\r\n skin_url:\"ms\",\r\n content_css:\"ms\"~~,\r~~\~~n end_container_on_empty_block:\">\",\~~r\n content_style:contentStyle,\r\n // quickbars_insert_toolbar: 'image',\r\n // quickbars_selection_toolbar: 'forecolor backcolor fontsize \| bold italic underline \| fontfamily',\r\n // powerpaste_word_import: 'clean',\r\n // powerpaste_html_import: 'clean',\r\n\t\t\t\tsetup: (editor) => {\r\n\t\t\t\t\t\r\n\t\t\t\t\teditor.on(\"change\", function () {\r\n\t\t\t\t\t\t// console.log(\"Content changed:\", editor.getContent());\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.ui.registry.addButton(\"material\", {\r\n\t\t\t\t\t\ticon: \"image\",\r\n\t\t\t\t\t\tonAction: async () => {\r\n\t\t\t\t\t\t\tconst response = await MKMaterialSelect();\r\n\t\t\t\t\t\t\tif (!response.success) {\r\n\t\t\t\t\t\t\t\treturn;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\teditor.insertContent(`<img src=\"${response.path}\" alt=\"${response.data!.id}\">`);\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.on(\"paste\", (event, ...args) => {\r\n\t\t\t\t\t\t// console.log(event, ...args);\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.on(\"change input undo redo\", () => {\r\n\t\t\t\t\t\temit(\"update:model-value\", editor.getContent());\r\n\t\t\t\t\t});\r\n\t\t\t\t},\r\n\t\t\t});\r\n\t\t\twatch(\r\n\t\t\t\tcomputed(() => props.modelValue),\r\n\t\t\t\t(modelValue) => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tif (instance.getContent() !== modelValue) {\r\n\t\t\t\t\t\t\tinstance.setContent(modelValue \|\| \"<p></~~p>\~~");\r\n\t\t\t\t\t\t}\r\n else if(!modelValue){\r\n instance.setContent(\"<p></p>\");\r\n }\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\t{ immediate: true }\r\n\t\t\t);\r\n\t\t\twatch(\r\n\t\t\t\tcomputed(() => props.disabled),\r\n\t\t\t\t(disabled) => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tinstance.mode.set(disabled ? \"readonly\" : \"design\");\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\t{ immediate: true }\r\n\t\t\t);\r\n\r\n\t\t\twithCtx(() => {\r\n\t\t\t\tonBeforeUnmount(() => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tinstance.destroy();\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t\t}, instance);\r\n\t\t});\r\n\t\treturn () => {\r\n\t\t\treturn (\r\n\t\t\t\t<div class=\"mk-rich-text-editor\">\r\n\t\t\t\t\t<div class=\"mk-rich-text-editor__wrapper\" ref={((el: HTMLElement) => (richTextEditorEl.value = el)) as any} />\r\n\t\t\t\t</div>\r\n\t\t\t);\r\n\t\t};\r\n\t},\r\n});\r\n"],"names":["defineComponent","name","props","richTextEditorProps","emits","richTextEditorEmits","setup","emit","richTextEditorEl","ref","instance","getCurrentInstance","onMounted","tinymceInstance","TinyMCE","init","target","unref","promotion","menubar","plugins","toolbar","inline","~~forced_root_block","~~valid_elements","extended_valid_elements","custom_elements","valid_children","cleanup","apply_source_formatting","verify_html","font_family_formats","language","skin_url","content_css","~~end_container_on_empty_block","~~content_style","contentStyle","editor","on","ui","registry","addButton","icon","onAction","response","MKMaterialSelect","success","insertContent","path","data","id","event","args","getContent","watch","computed","modelValue","setContent","immediate","disabled","mode","set","withCtx","onBeforeUnmount","destroy","_createVNode","el","value"],"mappings":";;;;;;;;;;;;;;;;;;AAuBA,MAAeA,qDAAgB;AAAA,EAC9BC,MAAM;AAAA,EACNC,OAAOC,sBAAmB;AAAA,EAC1BC,OAAOC,sBAAmB;AAAA,EAC1BC,MAAMJ,OAAO;AAAA,IAAEK;AAAAA,EAAK,GAAG;AACtB,UAAMC,mBAA4CC,QAAI,IAAI;AAE1D,UAAMC,WAAWC,IAAAA;AAOjBC,QAAAA,UAAU,YAAY;AACrB,YAAMC,kBAAkB,MAAMC,QAAQC,KAAK;AAAA,QAC1CC,QAAQC,IAAK,MAACT,gBAAgB;AAAA,QAC9BU,WAAW;AAAA,QACPC,SAAS;AAAA,QACbC,SAAQlB,MAAMkB;AAAAA;AAAAA,QAEVC,SAASnB,MAAMmB;AAAAA,QACfC,QAAQpB,MAAMoB;AAAAA,QAClBC,~~mBAAmB;AAAA,QACnBC,~~gBAAgB;AAAA;AAAA,QAChBC,yBAAyB;AAAA;AAAA,QACzBC,iBAAiB;AAAA;AAAA,QACjBC,gBAAgB;AAAA;AAAA,QAChBC,SAAS;AAAA,QACTC,yBAAyB;AAAA,QACzBC,aAAa;AAAA,QACbC,qBACC;AAAA,QACDC,UAAU;AAAA,QACNC,UAAS;AAAA,QACTC,aAAY;AAAA,QACZC,~~8BAA6B;AAAA,QAC7BC,~~eAAcC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,~~QAKlB/B~~,~~OAAQgC~~,YAAW;AAElBA,iBAAOC,GAAG,UAAU,WAAY;AAAA,UAC/B,CACA;AACDD,iBAAOE,GAAGC,SAASC,UAAU,YAAY;AAAA,YACxCC,MAAM;AAAA,YACNC,UAAU,YAAY;AACrB,oBAAMC,WAAW,MAAMC,MAAAA;AACvB,kBAAI,CAACD,SAASE,SAAS;AACtB;AAAA,cACD;AACAT,qBAAOU,cAAc,aAAaH,SAASI,IAAI,UAAUJ,SAASK,KAAMC,EAAE,IAAI;AAAA,YAC/E;AAAA,UACD,CAAC;AACDb,iBAAOC,GAAG,SAAS,CAACa,UAAUC,SAAS;AAAA,UACtC,CACA;AACDf,iBAAOC,GAAG,0BAA0B,MAAM;~~AACzChC~~,iBAAK,~~sBAAsB+B~~,OAAOgB,WAAY,CAAA;AAAA,UAC/C,CAAC;AAAA,QACF;AAAA,MACD,CAAC;AACDC,UAAAA,MACCC,IAAAA,SAAS,~~MAAMtD~~,~~MAAMuD~~,UAAU,GAC9BA,gBAAe;AACf,~~mBAAW/C~~,aAAYG,iBAAiB;AACvC,cAAIH,~~UAAS4C~~,WAAY,MAAKG,YAAY;~~AACzC/C~~,YAAAA,~~UAASgD~~,WAAWD,cAAc,~~SAAS~~;AAAA,~~UAC5C~~,WACc,CAACA,YAAW;~~AAClB/C~~,YAAAA,~~UAASgD~~,WAAW,~~SAAS~~;AAAA,~~UAC/B~~;AAAA,QACP;AAAA,MACD,GACA;AAAA,QAAEC,WAAW;AAAA,MAAK,CACnB;AACAJ,UAAAA,MACCC,IAAAA,SAAS,~~MAAMtD~~,~~MAAM0D~~,QAAQ,GAC5BA,cAAa;AACb,~~mBAAWlD~~,aAAYG,iBAAiB;AACvCH,UAAAA,~~UAASmD~~,KAAKC,IAAIF,WAAW,aAAa,QAAQ;AAAA,QACnD;AAAA,MACD,GACA;AAAA,QAAED,WAAW;AAAA,MAAK,CACnB;AAEAI,UAAAA,QAAQ,MAAM;AACbC,YAAAA,gBAAgB,MAAM;AACrB,~~qBAAWtD~~,aAAYG,iBAAiB;AACvCH,YAAAA,~~UAASuD~~,QAAO;AAAA,UACjB;AAAA,QACD,CAAC;AAAA,MACD,~~GAAEvD~~,QAAQ;AAAA,IACZ,CAAC;AACD,WAAO,MAAM;AACZ,~~aAAAwD~~,IAAAA,YAAA,OAAA;AAAA,QAAA,SAAA;AAAA,MAAA,GAAA,CAAAA,IAAA,YAAA,OAAA;AAAA,QAAA,SAAA;AAAA,QAAA,OAEmDC,~~QAAqB3D~~,~~iBAAiB4D~~,QAAQD;AAAAA,MAAG,GAAA,IAAA,CAAA,CAAA;AAAA;EAItG;AACD,CAAC;;"}
1	+ {"version":3,"file":"rich-text-editor.js","sources":["../../../../../../src/modules/ms/components/rich-text-editor/rich-text-editor.tsx"],"sourcesContent":["import { Ref, computed, defineComponent, getCurrentInstance, onBeforeUnmount, onMounted, ref, unref, watch, withCtx } from \"vue\";\r\nimport { MKMaterialSelect } from \"../material-select\";\r\nimport TinyMCE from \"tinymce\";\r\nimport \"tinymce/themes/silver/theme.js\";\r\nimport \"tinymce/models/dom/model.min.js\";\r\nimport \"tinymce/icons/default/icons.min.js\";\r\nimport \"tinymce/plugins/link\";\r\n// import \"tinymce/plugins/table\";\r\nimport \"tinymce/plugins/fullscreen\";\r\nimport \"tinymce/plugins/code\";\r\n// import \"tinymce/plugins/image\";\r\nimport \"tinymce/plugins/quickbars\";\r\nimport \"tinymce/plugins/lists\";\r\nimport \"./langs/zh-Hans.js\";\r\n\r\nimport \"./skins/ui/ms/skin.js\";\r\nimport \"./skins/ui/ms/content.js\";\r\nimport \"./skins/content/ms/content.js\";\r\n\r\nimport contentStyle from \"./content.css?raw\";\r\n\r\nimport { richTextEditorEmits, richTextEditorProps } from \"./rich-text-editor-options\";\r\n\r\nexport default defineComponent({\r\n\tname: \"MKRichTextEditor\",\r\n\tprops: richTextEditorProps,\r\n\temits: richTextEditorEmits,\r\n\tsetup(props, { emit }) {\r\n\t\tconst richTextEditorEl: Ref<HTMLElement \| null> = ref(null);\r\n\r\n\t\tconst instance = getCurrentInstance();\r\n\r\n // 这个方法暂时没用上\r\n\t\t// function escapeHtml(text: string) {\r\n\t\t// \treturn text.replace(/&/g, \"&\").replace(/</g, \"<\").replace(/>/g, \">\").replace(/\"/g, \""\").replace(/'/g, \"'\");\r\n\t\t// }\r\n\r\n\t\tonMounted(async () => {\r\n\t\t\tconst tinymceInstance = await TinyMCE.init({\r\n\t\t\t\ttarget: unref(richTextEditorEl)!,\r\n\t\t\t\tpromotion: false, \r\n menubar: false,\r\n\t\t\t\tplugins:props.plugins,\r\n //\"undo redo \| styles \| fontfamily \| fontsize forecolor \| bold italic underline strikethrough \| alignleft aligncenter alignright \| material \| outdent indent \| link \| table \| hr \| removeformat \| code fullscreen\"\r\n toolbar: props.toolbar,\r\n inline: props.inline,\r\n\t\t\t\tvalid_elements: \"[]\", // 允许所有元素和属性\r\n\t\t\t\textended_valid_elements: \"script[src\|async\|defer\|type\|charset]\", // 允许 script 标签的特定属性\r\n\t\t\t\tcustom_elements: \"~script\", // 允许自定义标签\r\n\t\t\t\tvalid_children: \"+body[script]\", // 允许 body 包含 script 标签\r\n\t\t\t\tcleanup: false,\r\n\t\t\t\tapply_source_formatting: false,\r\n\t\t\t\tverify_html: false,\r\n\t\t\t\tfont_family_formats:\r\n\t\t\t\t\t\"微软雅黑='微软雅黑';宋体='宋体';黑体='黑体';仿宋='仿宋';楷体='楷体';隶书='隶书';幼圆='幼圆';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\",\r\n\t\t\t\tlanguage: \"zh-Hans\",\r\n skin_url:\"ms\",\r\n content_css:\"ms\", \r\n content_style:contentStyle,\r\n // quickbars_insert_toolbar: 'image',\r\n // quickbars_selection_toolbar: 'forecolor backcolor fontsize \| bold italic underline \| fontfamily',\r\n // powerpaste_word_import: 'clean',\r\n // powerpaste_html_import: 'clean',\r\n\t\t\t\tsetup: (editor) => {\r\n\t\t\t\t\t\r\n\t\t\t\t\teditor.on(\"change\", function () {\r\n\t\t\t\t\t\t// console.log(\"Content changed:\", editor.getContent());\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.ui.registry.addButton(\"material\", {\r\n\t\t\t\t\t\ticon: \"image\",\r\n\t\t\t\t\t\tonAction: async () => {\r\n\t\t\t\t\t\t\tconst response = await MKMaterialSelect();\r\n\t\t\t\t\t\t\tif (!response.success) {\r\n\t\t\t\t\t\t\t\treturn;\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t\teditor.insertContent(`<img src=\"${response.path}\" alt=\"${response.data!.id}\">`);\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.on(\"paste\", (event, ...args) => {\r\n\t\t\t\t\t\t// console.log(event, ...args);\r\n\t\t\t\t\t});\r\n\t\t\t\t\teditor.on(\"change input undo redo\", () => {\r\n\t\t\t\t\t\temit(\"update:model-value\", editor.getContent());\r\n\t\t\t\t\t});\r\n\t\t\t\t},\r\n\t\t\t});\r\n\t\t\twatch(\r\n\t\t\t\tcomputed(() => props.modelValue),\r\n\t\t\t\t(modelValue) => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tif (instance.getContent() !== modelValue) {\r\n\t\t\t\t\t\t\tinstance.setContent(modelValue \|\| \"<div></div\");\r\n\t\t\t\t\t\t}\r\n else if(!modelValue){\r\n instance.setContent(\"<div></div>\");\r\n }\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\t{ immediate: true }\r\n\t\t\t);\r\n\t\t\twatch(\r\n\t\t\t\tcomputed(() => props.disabled),\r\n\t\t\t\t(disabled) => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tinstance.mode.set(disabled ? \"readonly\" : \"design\");\r\n\t\t\t\t\t}\r\n\t\t\t\t},\r\n\t\t\t\t{ immediate: true }\r\n\t\t\t);\r\n\r\n\t\t\twithCtx(() => {\r\n\t\t\t\tonBeforeUnmount(() => {\r\n\t\t\t\t\tfor (const instance of tinymceInstance) {\r\n\t\t\t\t\t\tinstance.destroy();\r\n\t\t\t\t\t}\r\n\t\t\t\t});\r\n\t\t\t}, instance);\r\n\t\t});\r\n\t\treturn () => {\r\n\t\t\treturn (\r\n\t\t\t\t<div class=\"mk-rich-text-editor\">\r\n\t\t\t\t\t<div class=\"mk-rich-text-editor__wrapper\" ref={((el: HTMLElement) => (richTextEditorEl.value = el)) as any} />\r\n\t\t\t\t</div>\r\n\t\t\t);\r\n\t\t};\r\n\t},\r\n});\r\n"],"names":["defineComponent","name","props","richTextEditorProps","emits","richTextEditorEmits","setup","emit","richTextEditorEl","ref","instance","getCurrentInstance","onMounted","tinymceInstance","TinyMCE","init","target","unref","promotion","menubar","plugins","toolbar","inline","valid_elements","extended_valid_elements","custom_elements","valid_children","cleanup","apply_source_formatting","verify_html","font_family_formats","language","skin_url","content_css","content_style","contentStyle","editor","on","ui","registry","addButton","icon","onAction","response","MKMaterialSelect","success","insertContent","path","data","id","event","args","getContent","watch","computed","modelValue","setContent","immediate","disabled","mode","set","withCtx","onBeforeUnmount","destroy","_createVNode","el","value"],"mappings":";;;;;;;;;;;;;;;;;;AAuBA,MAAeA,qDAAgB;AAAA,EAC9BC,MAAM;AAAA,EACNC,OAAOC,sBAAmB;AAAA,EAC1BC,OAAOC,sBAAmB;AAAA,EAC1BC,MAAMJ,OAAO;AAAA,IAAEK;AAAAA,EAAK,GAAG;AACtB,UAAMC,mBAA4CC,QAAI,IAAI;AAE1D,UAAMC,WAAWC,IAAAA;AAOjBC,QAAAA,UAAU,YAAY;AACrB,YAAMC,kBAAkB,MAAMC,QAAQC,KAAK;AAAA,QAC1CC,QAAQC,IAAK,MAACT,gBAAgB;AAAA,QAC9BU,WAAW;AAAA,QACPC,SAAS;AAAA,QACbC,SAAQlB,MAAMkB;AAAAA;AAAAA,QAEVC,SAASnB,MAAMmB;AAAAA,QACfC,QAAQpB,MAAMoB;AAAAA,QAClBC,gBAAgB;AAAA;AAAA,QAChBC,yBAAyB;AAAA;AAAA,QACzBC,iBAAiB;AAAA;AAAA,QACjBC,gBAAgB;AAAA;AAAA,QAChBC,SAAS;AAAA,QACTC,yBAAyB;AAAA,QACzBC,aAAa;AAAA,QACbC,qBACC;AAAA,QACDC,UAAU;AAAA,QACNC,UAAS;AAAA,QACTC,aAAY;AAAA,QACZC,eAAcC;AAAAA;AAAAA;AAAAA;AAAAA;AAAAA,QAKlB7B,OAAQ8B,YAAW;AAElBA,iBAAOC,GAAG,UAAU,WAAY;AAAA,UAC/B,CACA;AACDD,iBAAOE,GAAGC,SAASC,UAAU,YAAY;AAAA,YACxCC,MAAM;AAAA,YACNC,UAAU,YAAY;AACrB,oBAAMC,WAAW,MAAMC,MAAAA;AACvB,kBAAI,CAACD,SAASE,SAAS;AACtB;AAAA,cACD;AACAT,qBAAOU,cAAc,aAAaH,SAASI,IAAI,UAAUJ,SAASK,KAAMC,EAAE,IAAI;AAAA,YAC/E;AAAA,UACD,CAAC;AACDb,iBAAOC,GAAG,SAAS,CAACa,UAAUC,SAAS;AAAA,UACtC,CACA;AACDf,iBAAOC,GAAG,0BAA0B,MAAM;AACzC9B,iBAAK,sBAAsB6B,OAAOgB,WAAY,CAAA;AAAA,UAC/C,CAAC;AAAA,QACF;AAAA,MACD,CAAC;AACDC,UAAAA,MACCC,IAAAA,SAAS,MAAMpD,MAAMqD,UAAU,GAC9BA,gBAAe;AACf,mBAAW7C,aAAYG,iBAAiB;AACvC,cAAIH,UAAS0C,WAAY,MAAKG,YAAY;AACzC7C,YAAAA,UAAS8C,WAAWD,cAAc,YAAY;AAAA,UAC/C,WACc,CAACA,YAAW;AAClB7C,YAAAA,UAAS8C,WAAW,aAAa;AAAA,UACnC;AAAA,QACP;AAAA,MACD,GACA;AAAA,QAAEC,WAAW;AAAA,MAAK,CACnB;AACAJ,UAAAA,MACCC,IAAAA,SAAS,MAAMpD,MAAMwD,QAAQ,GAC5BA,cAAa;AACb,mBAAWhD,aAAYG,iBAAiB;AACvCH,UAAAA,UAASiD,KAAKC,IAAIF,WAAW,aAAa,QAAQ;AAAA,QACnD;AAAA,MACD,GACA;AAAA,QAAED,WAAW;AAAA,MAAK,CACnB;AAEAI,UAAAA,QAAQ,MAAM;AACbC,YAAAA,gBAAgB,MAAM;AACrB,qBAAWpD,aAAYG,iBAAiB;AACvCH,YAAAA,UAASqD,QAAO;AAAA,UACjB;AAAA,QACD,CAAC;AAAA,MACD,GAAErD,QAAQ;AAAA,IACZ,CAAC;AACD,WAAO,MAAM;AACZ,aAAAsD,IAAAA,YAAA,OAAA;AAAA,QAAA,SAAA;AAAA,MAAA,GAAA,CAAAA,IAAA,YAAA,OAAA;AAAA,QAAA,SAAA;AAAA,QAAA,OAEmDC,QAAqBzD,iBAAiB0D,QAAQD;AAAAA,MAAG,GAAA,IAAA,CAAA,CAAA;AAAA;EAItG;AACD,CAAC;;"}

package/dist/esm/components/basic/doc-editor/core/nodes/RichElementNode.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ElementNode } from 'lexical'\r\n\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\n\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"RichElementNode.js","sources":["../../../../../../../src/components/basic/doc-editor/core/nodes/RichElementNode.ts"],"sourcesContent":["\r\n\r\n\r\n\r\n\r\nimport type { DOMConversionMap, SerializedElementNode, NodeKey, Spread, EditorConfig, DOMExportOutput, DOMConversion, LexicalNode } from 'lexical'\r\nimport { $isTextNode, ElementNode } from 'lexical'\r\n\r\n/*\r\n 节点序列化 \r\n /\r\nexport type SerializedRichElementNode = Spread<{ tag: string, style?: string, class?: string \| null }, SerializedElementNode>\r\n\r\n/\r\n 格子\r\n /\r\nexport class RichElementNode extends ElementNode {\r\n\r\n __tagName: string\r\n __class?: string \| null \| undefined\r\n __style: string\r\n\r\n static getType(): string { return \"rich-element\"; }\r\n\r\n static clone(node: RichElementNode): RichElementNode {\r\n return new RichElementNode(node.__tagName, node.__class, node.__style, node.__key)\r\n }\r\n\r\n static importJSON(serializedNode: SerializedRichElementNode): RichElementNode {\r\n return new RichElementNode(serializedNode.tag, serializedNode.class, serializedNode.style)\r\n }\r\n\r\n static importDOM(): DOMConversionMap \| null {\r\n return {\r\n div: $covertRichElementDOM,\r\n section: $covertRichElementDOM,\r\n b: () => ({\r\n conversion: convertBringAttentionToElement,\r\n priority: 4\r\n }),\r\n code: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n em: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n i: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n s: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n span: () => ({\r\n conversion: convertSpanElement,\r\n priority: 4\r\n }),\r\n strong: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sub: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n sup: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n }),\r\n u: () => ({\r\n conversion: convertTextFormatElement,\r\n priority: 4\r\n })\r\n }\r\n }\r\n\r\n /\r\n \r\n * @param tagName \r\n * @param className \r\n * @param style \r\n * @param key \r\n /\r\n constructor(tagName: string, className?: string \| null, style?: string, key?: NodeKey) {\r\n super(key)\r\n this.__tagName = tagName,\r\n this.__class = className;\r\n this.__style = style \|\| \"\";\r\n }\r\n\r\n\r\n /\r\n 导出JSON\r\n * @returns \r\n /\r\n exportJSON(): SerializedRichElementNode {\r\n return {\r\n ...super.exportJSON(),\r\n type: this.getType(),\r\n tag: this.__tagName,\r\n class: this.__class,\r\n style: this.__style,\r\n version: 1\r\n }\r\n }\r\n\r\n /\r\n 导出DOM\r\n * @returns \r\n /\r\n exportDOM(): DOMExportOutput {\r\n\r\n const element = document.createElement(this.__tagName)\r\n\r\n if (this.__class) {\r\n element.setAttribute(\"class\", this.__class)\r\n }\r\n\r\n if (this.__style) {\r\n element.setAttribute(\"style\", this.__style)\r\n }\r\n\r\n return { element }\r\n }\r\n\r\n /\r\n 创建渲染DOM\r\n * @param config \r\n * @returns \r\n /\r\n createDOM(config: EditorConfig): HTMLElement {\r\n return this.exportDOM().element as HTMLElement;\r\n }\r\n\r\n}\r\n\r\n\r\n/\r\n 转换DOM\r\n * @param node \r\n * @returns \r\n */\r\nconst $covertRichElementDOM = (domNode: HTMLElement): DOMConversion<HTMLElement> \| null => {\r\n return {\r\n conversion: () => {\r\n return {\r\n node: new RichElementNode(domNode.tagName, domNode.getAttribute(\"class\"), domNode.getAttribute(\"style\") \|\| \"\")\r\n };\r\n },\r\n priority: 3\r\n };\r\n}\r\n\r\nconst nodeNameToTextFormat: any = {\r\n code: \"code\",\r\n em: \"italic\",\r\n i: \"italic\",\r\n s: \"strikethrough\",\r\n strong: \"bold\",\r\n sub: \"subscript\",\r\n sup: \"superscript\",\r\n u: \"underline\"\r\n};\r\n\r\nfunction convertBringAttentionToElement(domNode: HTMLElement) {\r\n const b = domNode;\r\n const hasNormalFontWeight = b.style.fontWeight === \"normal\";\r\n return {\r\n forChild: applyTextFormatFromStyle(b.style, hasNormalFontWeight ? void 0 : \"bold\", domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertTextFormatElement(domNode: HTMLElement) {\r\n const format = nodeNameToTextFormat[domNode.nodeName.toLowerCase()];\r\n if (format === void 0) {\r\n return {\r\n node: null\r\n };\r\n }\r\n return {\r\n forChild: applyTextFormatFromStyle(domNode.style, format, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction convertSpanElement(domNode: HTMLElement) {\r\n const span = domNode;\r\n const style = span.style;\r\n return {\r\n forChild: applyTextFormatFromStyle(style, null, domNode),\r\n node: null\r\n };\r\n}\r\n\r\nfunction applyTextFormatFromStyle(style: any, shouldApply: any, domNode: HTMLElement) {\r\n const fontWeight = style.fontWeight;\r\n const textDecoration = style.textDecoration.split(\" \");\r\n const hasBoldFontWeight = fontWeight === \"700\" \|\| fontWeight === \"bold\";\r\n const hasLinethroughTextDecoration = textDecoration.includes(\"line-through\");\r\n const hasItalicFontStyle = style.fontStyle === \"italic\";\r\n const hasUnderlineTextDecoration = textDecoration.includes(\"underline\");\r\n const verticalAlign = style.verticalAlign;\r\n\r\n return (lexicalNode: LexicalNode) => {\r\n\r\n if (!$isTextNode(lexicalNode)) {\r\n return lexicalNode;\r\n }\r\n\r\n if (hasBoldFontWeight && !lexicalNode.hasFormat(\"bold\")) {\r\n lexicalNode.toggleFormat(\"bold\");\r\n }\r\n if (hasLinethroughTextDecoration && !lexicalNode.hasFormat(\"strikethrough\")) {\r\n lexicalNode.toggleFormat(\"strikethrough\");\r\n }\r\n if (hasItalicFontStyle && !lexicalNode.hasFormat(\"italic\")) {\r\n lexicalNode.toggleFormat(\"italic\");\r\n }\r\n if (hasUnderlineTextDecoration && !lexicalNode.hasFormat(\"underline\")) {\r\n lexicalNode.toggleFormat(\"underline\");\r\n }\r\n if (verticalAlign === \"sub\" && !lexicalNode.hasFormat(\"subscript\")) {\r\n lexicalNode.toggleFormat(\"subscript\");\r\n }\r\n if (verticalAlign === \"super\" && !lexicalNode.hasFormat(\"superscript\")) {\r\n lexicalNode.toggleFormat(\"superscript\");\r\n }\r\n if (shouldApply && !lexicalNode.hasFormat(shouldApply)) {\r\n lexicalNode.toggleFormat(shouldApply);\r\n }\r\n\r\n // let styleStr = \"\";\r\n\r\n // if(style.color){\r\n // styleStr += `color:${style.color};`\r\n // }\r\n // if(style.fontSize){\r\n // styleStr += `font-size:${style.fontSize};`\r\n // }\r\n // if(style.fontFamily){\r\n // styleStr += `font-family:${style.fontFamily};`\r\n // }\r\n // if(style.backgroundColor){\r\n // styleStr += `background-color:${style.backgroundColor};`\r\n // }\r\n\r\n // 行内样式\r\n const inlineStyle = domNode.getAttribute(\"style\")\r\n if (inlineStyle) {\r\n lexicalNode.setStyle(inlineStyle);\r\n }\r\n\r\n return lexicalNode;\r\n };\r\n}\r\n"],"names":[],"mappings":"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"}

package/dist/esm/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, watch, openBlock, createElementBlock, createVNode, unref, toDisplayString, createCommentVNode } from "vue";
+import { defineComponent, ref, computed, watch, openBlock, createElementBlock, normalizeClass, unref, createVNode, toDisplayString, createCommentVNode } from "vue";
 import { useCanShowPlaceholder } from "../../composables/useCanShowPlaceholder.js";
 import "@lexical/overflow";
 import "@lexical/text";
@@ -16,10 +16,10 @@ import "@lexical/rich-text";
 import { $generateNodesFromDOM, $generateHtmlFromNodes } from "@lexical/html";
 import _sfc_main$1 from "./ContentEditable.vue.js";
 import DecoratedTeleports from "./DecoratedTeleports.js";
-const _hoisted_1 = { class: "mk-doc-editor__stage__editable" };
-const _hoisted_2 = {
+const _hoisted_1 = {
   key: 0,
-  class: "mk-doc-editor__stage__placeholder mk-doc__paragraph"
+  class: "mk-doc-editor__stage__placeholder mk-doc__paragraph",
+  style: { "user-select": "text", "white-space": "pre-wrap", "word-break": "break-word" }
 };
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
@@ -64,11 +64,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     watch(htmlContent, (value) => emit("change", value));
     useRichTextSetup(editor);
     return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", _hoisted_1, [
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["mk-doc-editor__stage__editable", { placeholder: unref(canShowPlaceholder) && contentIsEmpty.value }])
+      }, [
         createVNode(_sfc_main$1),
-        unref(canShowPlaceholder) && contentIsEmpty.value ? (openBlock(), createElementBlock("div", _hoisted_2, toDisplayString(props.placeholder), 1)) : createCommentVNode("", true),
+        unref(canShowPlaceholder) && contentIsEmpty.value ? (openBlock(), createElementBlock("div", _hoisted_1, toDisplayString(__props.placeholder), 1)) : createCommentVNode("", true),
         createVNode(unref(DecoratedTeleports))
-      ]);
+      ], 2);
     };
   }
 });

package/dist/esm/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll } from 'lexical'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes);\r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n })\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\">\r\n {{~~props.~~placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AAUA~~,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAAS;AAET,UAAA,qBAAqB,sBAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAc,IAAI,EAAE;AAGpB,UAAA,iBAAiB,SAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAAC,SAAa;AAGvB,UAAA,YAAY,SAAS,MAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQ;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAA,KAAK,QAAO;AAEL,oBAAA,sBAAsB,QAAO,OAAO,gBAAgB,KAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;~~AAEW~~;AACG,8BAAA,MAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJ,gCAAA,MAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJ,eAAW,MAAI;AACb,aAAO,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACxD,oBAAY,KAAK,MAAM;AACT,sBAAA,QAAQ,uBAAuB,MAAM;AAAA,QAAA,CAClD;AAAA,MAAA,CACF;AAAA,IAAA,CACF;AAID,UAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlD,UAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnD,qBAAiB,MAAM~~;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../../src/components/basic/doc-editor/core/plugins/LexicalRichTextPlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { ref,defineProps,computed,defineEmits,watch } from \"vue\"\r\nimport { useCanShowPlaceholder, useLexicalComposer, useRichTextSetup,useMounted } from '../../composables'\r\nimport { $getSelection ,$selectAll,$createParagraphNode } from 'lexical'\r\nimport { $insertNodeToNearestRoot } from '@lexical/utils'\r\nimport { $generateHtmlFromNodes,$generateNodesFromDOM } from '@lexical/html'\r\nimport ContentEditable from \"./ContentEditable.vue\"\r\nimport DecoratedTeleports from \"./DecoratedTeleports\"\r\n\r\n// 事件\r\nconst emit = defineEmits([\"change\"]);\r\n\r\n// 参数\r\nconst props = defineProps({\r\n content:{ type:String,default:`` },\r\n placeholder:{ type:String,default:`` }\r\n})\r\n\r\nconst editor = useLexicalComposer()\r\n\r\nconst canShowPlaceholder = useCanShowPlaceholder(editor)\r\n\r\nconst parser = new DOMParser();\r\n\r\n// html 内容\r\nconst htmlContent = ref(\"\");\r\n\r\n// 空内容\r\nconst contentIsEmpty = computed(()=>htmlContent.value == `<p class=\"mk-doc__paragraph\"><br></p>` \|\| !htmlContent.value);\r\n\r\n// 设置 HTML\r\nconst setHtml = (html : any)=>{\r\n\r\n // 内容不同则重置 \r\n if(htmlContent.value != html){\r\n\r\n let nodes : Array<any> = [];\r\n\r\n htmlContent.value = html;\r\n\r\n editor.update(()=>{\r\n\r\n if(html.trim()){\r\n // Once you have the DOM instance it's easy to generate LexicalNodes.\r\n nodes = $generateNodesFromDOM(editor,parser.parseFromString(html.trim(),\"text/html\"));\r\n // console.log($generateNodesFromDOM,parser.parseFromString(html.trim(),\"text/html\"));\r\n }\r\n\r\n // 设置权限替换\r\n $selectAll();\r\n $getSelection()?.insertText(\"\")\r\n if(nodes.length > 0){\r\n $getSelection()?.insertNodes(nodes); \r\n }\r\n })\r\n }\r\n}\r\n\r\nuseMounted(()=>{\r\n return editor.registerUpdateListener(({ editorState }) => {\r\n editorState.read(() => {\r\n htmlContent.value = $generateHtmlFromNodes(editor);\r\n })\r\n })\r\n})\r\n\r\n\r\n// 初始化\r\nwatch(()=>props.content,setHtml,{ immediate:true });\r\n\r\n// 监听内容变化\r\nwatch(htmlContent,(value:any)=>emit('change',value));\r\n\r\n// 使用富文本\r\nuseRichTextSetup(editor)\r\n\r\n</script>\r\n\r\n<template>\r\n <div class=\"mk-doc-editor__stage__editable\" :class=\"{placeholder:canShowPlaceholder && contentIsEmpty}\">\r\n <ContentEditable />\r\n <template v-if=\"canShowPlaceholder && contentIsEmpty\">\r\n <div class=\"mk-doc-editor__stage__placeholder mk-doc__paragraph\" style=\"user-select: text;white-space: pre-wrap;word-break: break-word;\">\r\n {{placeholder}}\r\n </div>\r\n </template>\r\n <DecoratedTeleports />\r\n </div>\r\n\r\n</template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,UAAM,OAAO;AAGb,UAAM,QAAQ;AAKd,UAAM,SAAS;AAET,UAAA,qBAAqB,sBAAsB,MAAM;AAEjD,UAAA,SAAS,IAAI;AAGb,UAAA,cAAc,IAAI,EAAE;AAGpB,UAAA,iBAAiB,SAAS,MAAI,YAAY,SAAS,2CAA2C,CAAC,YAAY,KAAK;AAGhH,UAAA,UAAU,CAAC,SAAa;AAGvB,UAAA,YAAY,SAAS,MAAK;AAE3B,YAAI,QAAqB,CAAA;AAEzB,oBAAY,QAAQ;AAEpB,eAAO,OAAO,MAAI;;AAEb,cAAA,KAAK,QAAO;AAEL,oBAAA,sBAAsB,QAAO,OAAO,gBAAgB,KAAK,KAAK,GAAE,WAAW,CAAC;AAAA,UAEtF;AAGW;AACG,8BAAA,MAAA,mBAAG,WAAW;AACzB,cAAA,MAAM,SAAS,GAAE;AACJ,gCAAA,MAAA,mBAAG,YAAY;AAAA,UAC/B;AAAA,QAAA,CACD;AAAA,MACH;AAAA,IAAA;AAGJ,eAAW,MAAI;AACb,aAAO,OAAO,uBAAuB,CAAC,EAAE,kBAAkB;AACxD,oBAAY,KAAK,MAAM;AACT,sBAAA,QAAQ,uBAAuB,MAAM;AAAA,QAAA,CAClD;AAAA,MAAA,CACF;AAAA,IAAA,CACF;AAID,UAAM,MAAI,MAAM,SAAQ,SAAQ,EAAE,WAAU,MAAM;AAGlD,UAAM,aAAY,CAAC,UAAY,KAAK,UAAS,KAAK,CAAC;AAGnD,qBAAiB,MAAM;;;;;;;;;;;;"}

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/commands.js CHANGED Viewed

@@ -1,6 +1,8 @@
 import { createCommand } from "lexical";
 const INSERT_TEMPLATE_COMMAND = createCommand("INSERT_TEMPLATE_COMMAND");
+const INSERT_HTMLTEMPLATE_COMMAND = createCommand("INSERT_HTMLTEMPLATE_COMMAND");
 export {
+  INSERT_HTMLTEMPLATE_COMMAND,
   INSERT_TEMPLATE_COMMAND
 };
 //# sourceMappingURL=commands.js.map

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/commands.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"commands.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/commands.ts"],"sourcesContent":["\r\n\r\nimport { type LexicalCommand, createCommand} from 'lexical'\r\n\r\n/*\r\n 插入模版块指令\r\n */\r\nexport const INSERT_TEMPLATE_COMMAND: LexicalCommand<string> = createCommand('INSERT_TEMPLATE_COMMAND')\r\n"],"names":[],"mappings":";AAOa,MAAA,0BAAkD,cAAc,yBAAyB;"}
1	+ {"version":3,"file":"commands.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/commands.ts"],"sourcesContent":["\r\n\r\nimport { type LexicalCommand, createCommand} from 'lexical'\r\n\r\n/*\r\n 插入模版块指令\r\n /\r\nexport const INSERT_TEMPLATE_COMMAND: LexicalCommand<string> = createCommand('INSERT_TEMPLATE_COMMAND')\r\n\r\n/\r\n 插入HTML模版块指令\r\n */\r\nexport const INSERT_HTMLTEMPLATE_COMMAND: LexicalCommand<string> = createCommand('INSERT_HTMLTEMPLATE_COMMAND')\r\n"],"names":[],"mappings":";AAOa,MAAA,0BAAkD,cAAc,yBAAyB;AAKzF,MAAA,8BAAsD,cAAc,6BAA6B;"}

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/composables.js CHANGED Viewed

@@ -4,7 +4,7 @@ import { $generateNodesFromDOM } from "@lexical/html";
 import { Dialoger } from "@maketribe/dm";
 import { ElInput, ElButton } from "element-plus";
 import { Search } from "@element-plus/icons-vue";
-import { INSERT_TEMPLATE_COMMAND } from "./commands.js";
+import { INSERT_TEMPLATE_COMMAND, INSERT_HTMLTEMPLATE_COMMAND } from "./commands.js";
 import "@lexical/text";
 import { mergeRegister, $insertNodeToNearestRoot } from "@lexical/utils";
 import { useMounted } from "../../core/composables/useMounted.js";
@@ -25,12 +25,25 @@ const registerDocTemplate = (options) => {
   }
 };
 const parser = new DOMParser();
+const createTemplateNodes = (editor, html) => {
+  var dom = parser.parseFromString(html.trim(), "text/html");
+  for (let index = 0; index < dom.body.children.length; index++) {
+    const element = dom.body.children[index];
+    if (!element.classList.contains(`mk-doc__grid`)) {
+      element.classList.add(`mk-doc__grid`);
+      if (!element.classList.contains(`mk-doc__text-grid`)) {
+        element.classList.add(`mk-doc__text-grid`);
+      }
+    }
+  }
+  return $generateNodesFromDOM(editor, dom);
+};
 const useTemplate = () => {
   const editor = useLexicalComposer();
   const findTemplateNodesByName = (name) => {
     const template = Templates.find((item) => item.name == name);
     if (template != null) {
-      return $generateNodesFromDOM(editor, parser.parseFromString(template.template.trim(), "text/html"));
+      return createTemplateNodes(editor, template.template);
     }
     throw new Error("未知的模版：【" + name + "】");
   };
@@ -48,7 +61,18 @@ const useTemplate = () => {
         }
         return true;
       }, COMMAND_PRIORITY_EDITOR)
-    );
+    ), // 插入HTML模版
+    editor.registerCommand(INSERT_HTMLTEMPLATE_COMMAND, (html) => {
+      const selection = $getSelection();
+      const elementNode = $isNodeSelection(selection) ? selection == null ? void 0 : selection.getNodes()[0] : null;
+      const templateNodes = createTemplateNodes(editor, html);
+      if (elementNode) {
+        templateNodes.forEach((node) => elementNode.append(node));
+      } else {
+        templateNodes.forEach((node) => $insertNodeToNearestRoot(node));
+      }
+      return true;
+    }, COMMAND_PRIORITY_EDITOR);
   });
 };
 const showTemplateSelectDialog = function() {
@@ -118,9 +142,54 @@ const showTemplateSelectDialog = function() {
     });
   });
 };
+const showHtmlTemplateDialog = function() {
+  return new Promise((resolve) => {
+    const contentInputValue = ref("");
+    const handleCancelClick = () => {
+      dialogInstance.destroy();
+    };
+    const handleConfirmClick = () => {
+      dialogInstance.destroy();
+      resolve(contentInputValue.value);
+    };
+    const dialogInstance = Dialoger.customRender({
+      title: "自定义HTML模版内容",
+      class: "mk-doc-editor__module-template_dialog",
+      width: "700px",
+      onClose: () => {
+        dialogInstance.destroy();
+      },
+      body: () => {
+        return createVNode(ElInput, {
+          "modelValue": contentInputValue.value,
+          "onUpdate:modelValue": ($event) => contentInputValue.value = $event,
+          "type": "textarea",
+          "autosize": {
+            minRows: 10,
+            maxRows: 20
+          }
+        }, null);
+      },
+      footer: () => {
+        return createVNode(Fragment, null, [createVNode(ElButton, {
+          "onClick": handleCancelClick
+        }, {
+          default: () => [createTextVNode("取消")]
+        }), createVNode(ElButton, {
+          "type": "primary",
+          "onClick": handleConfirmClick
+        }, {
+          default: () => [createTextVNode("确定")]
+        })]);
+      }
+    });
+  });
+};
 export {
   Templates,
+  createTemplateNodes,
   registerDocTemplate,
+  showHtmlTemplateDialog,
   showTemplateSelectDialog,
   useTemplate
 };

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/composables.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/composables.tsx"],"sourcesContent":["import { $getSelection, $isNodeSelection, COMMAND_PRIORITY_EDITOR, ElementNode, LexicalEditor, LexicalNode } from \"lexical\";\r\nimport { $generateNodesFromDOM } from \"@lexical/html\";\r\nimport { ref,Fragment } from \"vue\";\r\nimport { Dialoger } from \"@maketribe/dm\";\r\nimport { ElButton,ElInput } from \"element-plus\";\r\nimport { Search } from \"@element-plus/icons-vue\";\r\nimport { INSERT_TEMPLATE_COMMAND } from \"./commands\"\r\nimport { useMounted,useLexicalComposer } from \"../../core/composables\";\r\nimport { $insertNodeToNearestRoot, mergeRegister } from \"@lexical/utils\";\r\n\r\n/*\r\n 模版类型\r\n /\r\nexport type TemplateType = {\r\n name:string,\r\n title:string,\r\n cover:string,\r\n template:string,\r\n editorCss?:string\|null\|undefined,\r\n}\r\n\r\n/\r\n 模版定义\r\n /\r\nexport const Templates:TemplateType[] = [];\r\n\r\n/\r\n 注册模版\r\n * @param options \r\n /\r\nexport const registerDocTemplate = (options:TemplateType) => {\r\n\r\n if(Templates.findIndex(item=>item.name == options.name) >= 0){\r\n console.warn(`模版【${options.title}】重复注册！`);\r\n }\r\n else{\r\n Templates.push(options);\r\n }\r\n}\r\n\r\n/\r\n 卸载模块\r\n * @param name \r\n /\r\nexport const unRegisterDocTemplate = (name:string) => {\r\n\r\n for(let i = 0;i < Templates.length; i++){\r\n if(Templates[i].name == name){\r\n Templates.splice(i,1);\r\n break;\r\n }\r\n }\r\n}\r\n\r\n// dom 解析器\r\nconst parser = new DOMParser();\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n /\r\nexport const useTemplate = () => {\r\n\r\n // 编辑器\r\n const editor = useLexicalComposer()\r\n\r\n const findTemplateNodesByName = (name:string):LexicalNode[] => {\r\n\r\n const template = Templates.find(item=>item.name == name);\r\n\r\n if(template != null){\r\n return $generateNodesFromDOM(editor,parser.parseFromString(template.template.trim(),\"text/html\"));\r\n }\r\n\r\n throw new Error(\"未知的模版：【\" + name + \"】\");\r\n }\r\n\r\n // 编辑器挂载\r\n useMounted(()=>{\r\n\r\n return mergeRegister(\r\n // 插入模版\r\n editor.registerCommand<string>(INSERT_TEMPLATE_COMMAND,(name) => {\r\n\r\n const selection = $getSelection()\r\n const elementNode = $isNodeSelection(selection) ? selection?.getNodes()[0] as ElementNode : null;\r\n const templateNodes = findTemplateNodesByName(name)\r\n\r\n if (elementNode) {\r\n templateNodes.forEach(node=> elementNode.append(node))\r\n }\r\n else{\r\n templateNodes.forEach(node=> $insertNodeToNearestRoot(node))\r\n }\r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n )\r\n })\r\n\r\n\r\n}\r\n\r\n\r\n/\r\n 显示模块模版选择\r\n * @returns \r\n */\r\nexport const showTemplateSelectDialog = function():Promise<string> {\r\n\r\n return new Promise<string>((resolve:any)=> {\r\n\r\n const selectOption = ref<TemplateType\|null>(null);\r\n const searchInputValue = ref(\"\");\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve(selectOption.value?.name);\r\n };\r\n\r\n // 点击块\r\n const clickHandle = (item:any)=>{\r\n selectOption.value = item;\r\n }\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"模版选择\",\r\n class: \"mk-doc-editor__module-template_dialog\",\r\n width: \"700px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n\r\n // 循环体\r\n const templateListComponent = Templates.filter(item=>{\r\n if(searchInputValue.value){\r\n return item.name.indexOf(searchInputValue.value) >= 0 \|\| item.title.indexOf(searchInputValue.value) >= 0\r\n }\r\n else{\r\n return true;\r\n }\r\n }).map(item=>{\r\n\r\n return <div \r\n class={`mk-doc-editor__module-template_dialog_list-item ${(item.cover ? 'cover':'')} ${(selectOption.value?.name == item.name ? 'active':'')}`} \r\n onClick={()=>clickHandle(item)}>\r\n {item.cover ? <img src={item.cover} /> :null}\r\n <div class=\"mk-doc-editor__module-template_dialog_list-item_title\">{item.title}</div>\r\n </div>\r\n })\r\n\r\n return <div class=\"mk-doc-editor__module-template_dialog_warp\">\r\n <ElInput v-model={searchInputValue.value} prefix-icon={Search} clearable={true} />\r\n <div class=\"mk-doc-editor__module-template_dialog_list-body\">\r\n {templateListComponent}\r\n </div>\r\n </div>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick} disabled={!selectOption.value}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["Templates","registerDocTemplate","options","findIndex","item","name","console","warn","title","push","parser","DOMParser","useTemplate","editor","useLexicalComposer","findTemplateNodesByName","template","find","$generateNodesFromDOM","parseFromString","trim","Error","useMounted","mergeRegister","registerCommand","INSERT_TEMPLATE_COMMAND","selection","$getSelection","elementNode","$isNodeSelection","getNodes","templateNodes","forEach","node","append","$insertNodeToNearestRoot","COMMAND_PRIORITY_EDITOR","showTemplateSelectDialog","Promise","resolve","selectOption","ref","searchInputValue","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","clickHandle","Dialoger","customRender","class","width","onClose","body","templateListComponent","filter","indexOf","map","_createVNode","cover","onClick","ElInput","$event","Search","footer","_Fragment","ElButton","default","_createTextVNode"],"mappings":"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"}
1	+ {"version":3,"file":"composables.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/composables.tsx"],"sourcesContent":["import { $getSelection, $isNodeSelection, COMMAND_PRIORITY_EDITOR, ElementNode, LexicalEditor, LexicalNode } from \"lexical\";\r\nimport { $generateNodesFromDOM } from \"@lexical/html\";\r\nimport { ref,Fragment } from \"vue\";\r\nimport { Dialoger } from \"@maketribe/dm\";\r\nimport { ElButton,ElInput } from \"element-plus\";\r\nimport { Search } from \"@element-plus/icons-vue\";\r\nimport { INSERT_TEMPLATE_COMMAND,INSERT_HTMLTEMPLATE_COMMAND } from \"./commands\"\r\nimport { useMounted,useLexicalComposer } from \"../../core/composables\";\r\nimport { $insertNodeToNearestRoot, mergeRegister } from \"@lexical/utils\";\r\n\r\n/*\r\n 模版类型\r\n /\r\nexport type TemplateType = {\r\n name:string,\r\n title:string,\r\n cover:string,\r\n template:string,\r\n editorCss?:string\|null\|undefined,\r\n}\r\n\r\n/\r\n 模版定义\r\n /\r\nexport const Templates:TemplateType[] = [];\r\n\r\n/\r\n 注册模版\r\n * @param options \r\n /\r\nexport const registerDocTemplate = (options:TemplateType) => {\r\n\r\n if(Templates.findIndex(item=>item.name == options.name) >= 0){\r\n console.warn(`模版【${options.title}】重复注册！`);\r\n }\r\n else{\r\n Templates.push(options);\r\n }\r\n}\r\n\r\n/\r\n 卸载模块\r\n * @param name \r\n /\r\nexport const unRegisterDocTemplate = (name:string) => {\r\n\r\n for(let i = 0;i < Templates.length; i++){\r\n if(Templates[i].name == name){\r\n Templates.splice(i,1);\r\n break;\r\n }\r\n }\r\n}\r\n\r\n// dom 解析器\r\nconst parser = new DOMParser();\r\n\r\n// 创建节点\r\nexport const createTemplateNodes = (editor:LexicalEditor,html:string)=>{\r\n\r\n var dom = parser.parseFromString(html.trim(),\"text/html\");\r\n \r\n for (let index = 0; index < dom.body.children.length; index++) {\r\n const element = dom.body.children[index];\r\n if(!element.classList.contains(`mk-doc__grid`)){\r\n element.classList.add(`mk-doc__grid`);\r\n if(!element.classList.contains(`mk-doc__text-grid`)){\r\n element.classList.add(`mk-doc__text-grid`)\r\n }\r\n }\r\n \r\n }\r\n\r\n return $generateNodesFromDOM(editor,dom);\r\n}\r\n\r\n/\r\n \r\n * @param name \r\n * @returns \r\n /\r\nexport const useTemplate = () => {\r\n\r\n // 编辑器\r\n const editor = useLexicalComposer()\r\n\r\n const findTemplateNodesByName = (name:string):LexicalNode[] => {\r\n\r\n const template = Templates.find(item=>item.name == name);\r\n\r\n if(template != null){\r\n return createTemplateNodes(editor, template.template);\r\n }\r\n\r\n throw new Error(\"未知的模版：【\" + name + \"】\");\r\n }\r\n\r\n // 编辑器挂载\r\n useMounted(()=>{\r\n\r\n return mergeRegister(\r\n // 插入模版\r\n editor.registerCommand<string>(INSERT_TEMPLATE_COMMAND,(name) => {\r\n\r\n const selection = $getSelection()\r\n const elementNode = $isNodeSelection(selection) ? selection?.getNodes()[0] as ElementNode : null;\r\n const templateNodes = findTemplateNodesByName(name)\r\n\r\n if (elementNode) {\r\n templateNodes.forEach(node=> elementNode.append(node))\r\n }\r\n else{\r\n templateNodes.forEach(node=> $insertNodeToNearestRoot(node))\r\n }\r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n ),\r\n // 插入HTML模版\r\n editor.registerCommand<string>(INSERT_HTMLTEMPLATE_COMMAND,(html) => {\r\n\r\n const selection = $getSelection()\r\n const elementNode = $isNodeSelection(selection) ? selection?.getNodes()[0] as ElementNode : null;\r\n const templateNodes = createTemplateNodes(editor, html);\r\n if (elementNode) {\r\n templateNodes.forEach(node=> elementNode.append(node))\r\n }\r\n else{\r\n templateNodes.forEach(node=> $insertNodeToNearestRoot(node))\r\n }\r\n return true\r\n },COMMAND_PRIORITY_EDITOR)\r\n })\r\n\r\n\r\n}\r\n\r\n\r\n/\r\n 显示模块模版选择\r\n * @returns \r\n /\r\nexport const showTemplateSelectDialog = function():Promise<string> {\r\n\r\n return new Promise<string>((resolve:any)=> {\r\n\r\n const selectOption = ref<TemplateType\|null>(null);\r\n const searchInputValue = ref(\"\");\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve(selectOption.value?.name);\r\n };\r\n\r\n // 点击块\r\n const clickHandle = (item:any)=>{\r\n selectOption.value = item;\r\n }\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"模版选择\",\r\n class: \"mk-doc-editor__module-template_dialog\",\r\n width: \"700px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n\r\n // 循环体\r\n const templateListComponent = Templates.filter(item=>{\r\n if(searchInputValue.value){\r\n return item.name.indexOf(searchInputValue.value) >= 0 \|\| item.title.indexOf(searchInputValue.value) >= 0\r\n }\r\n else{\r\n return true;\r\n }\r\n }).map(item=>{\r\n\r\n return <div \r\n class={`mk-doc-editor__module-template_dialog_list-item ${(item.cover ? 'cover':'')} ${(selectOption.value?.name == item.name ? 'active':'')}`} \r\n onClick={()=>clickHandle(item)}>\r\n {item.cover ? <img src={item.cover} /> :null}\r\n <div class=\"mk-doc-editor__module-template_dialog_list-item_title\">{item.title}</div>\r\n </div>\r\n })\r\n\r\n return <div class=\"mk-doc-editor__module-template_dialog_warp\">\r\n <ElInput v-model={searchInputValue.value} prefix-icon={Search} clearable={true} />\r\n <div class=\"mk-doc-editor__module-template_dialog_list-body\">\r\n {templateListComponent}\r\n </div>\r\n </div>\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick} disabled={!selectOption.value}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n\r\n\r\n/\r\n html模版弹窗\r\n * @returns \r\n */\r\nexport const showHtmlTemplateDialog = function():Promise<string> {\r\n\r\n return new Promise<string>((resolve:any)=> {\r\n\r\n const contentInputValue = ref(\"\");\r\n\r\n // 取消编辑\r\n const handleCancelClick = () => {\r\n dialogInstance.destroy();\r\n };\r\n\r\n // 确认编辑\r\n const handleConfirmClick = () => {\r\n dialogInstance.destroy();\r\n resolve(contentInputValue.value);\r\n };\r\n\r\n const dialogInstance = Dialoger.customRender({\r\n title: \"自定义HTML模版内容\",\r\n class: \"mk-doc-editor__module-template_dialog\",\r\n width: \"700px\",\r\n onClose: () => {\r\n dialogInstance.destroy();\r\n },\r\n body: () => {\r\n return <ElInput v-model={contentInputValue.value} type=\"textarea\" autosize={{minRows:10,maxRows:20}} />\r\n },\r\n footer: () => {\r\n return <Fragment>\r\n <ElButton onClick={handleCancelClick}>取消</ElButton>\r\n <ElButton type=\"primary\" onClick={handleConfirmClick}>\r\n 确定\r\n </ElButton>\r\n </Fragment>\r\n },\r\n });\r\n });\r\n}\r\n"],"names":["Templates","registerDocTemplate","options","findIndex","item","name","console","warn","title","push","parser","DOMParser","createTemplateNodes","editor","html","dom","parseFromString","trim","index","body","children","length","element","classList","contains","add","$generateNodesFromDOM","useTemplate","useLexicalComposer","findTemplateNodesByName","template","find","Error","useMounted","mergeRegister","registerCommand","INSERT_TEMPLATE_COMMAND","selection","$getSelection","elementNode","$isNodeSelection","getNodes","templateNodes","forEach","node","append","$insertNodeToNearestRoot","COMMAND_PRIORITY_EDITOR","INSERT_HTMLTEMPLATE_COMMAND","showTemplateSelectDialog","Promise","resolve","selectOption","ref","searchInputValue","handleCancelClick","dialogInstance","destroy","handleConfirmClick","value","clickHandle","Dialoger","customRender","class","width","onClose","templateListComponent","filter","indexOf","map","_createVNode","cover","onClick","ElInput","$event","Search","footer","_Fragment","ElButton","default","_createTextVNode","showHtmlTemplateDialog","contentInputValue","minRows","maxRows"],"mappings":"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"}

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/index.vue.js CHANGED Viewed

@@ -11,8 +11,8 @@ import "@lexical/dragon";
 import "@lexical/plain-text";
 import "@lexical/rich-text";
 import { registerDocEditorToolbarExtend } from "../../core/index.js";
-import { useTemplate, showTemplateSelectDialog } from "./composables.js";
-import { INSERT_TEMPLATE_COMMAND } from "./commands.js";
+import { useTemplate, showTemplateSelectDialog, showHtmlTemplateDialog } from "./composables.js";
+import { INSERT_TEMPLATE_COMMAND, INSERT_HTMLTEMPLATE_COMMAND } from "./commands.js";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "index",
   setup(__props) {
@@ -25,6 +25,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       },
       sort: 90
     });
+    registerDocEditorToolbarExtend({
+      icon: "html-code",
+      text: "HTML模版",
+      action: async () => {
+        editor.dispatchCommand(INSERT_HTMLTEMPLATE_COMMAND, await showHtmlTemplateDialog());
+      },
+      sort: 89
+    });
     useTemplate();
     return (_ctx, _cache) => {
       return null;

package/dist/esm/components/basic/doc-editor/plugins/TemplatePlugin/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from '../../core/composables'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { showTemplateSelectDialog,useTemplate } from \"./composables\"\r\nimport { INSERT_TEMPLATE_COMMAND } from \"./commands\"\r\n\r\n~~\r\n~~ // 编辑器\r\n const editor = useLexicalComposer()\r\n\r\n // 注册到工具条\r\n registerDocEditorToolbarExtend({\r\n icon:\"richtext\",\r\n text:\"模版\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_TEMPLATE_COMMAND,await showTemplateSelectDialog())\r\n },\r\n sort:90\r\n } as ToolbarExtendPlugin)\r\n\r\n ~~useTemplate~~();\r\n\r\n</script>\r\n\r\n<template></template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;~~AASE~~,UAAM,SAAS;AAGgB,mCAAA;AAAA,MAC7B,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAO,YAAU;AACf,eAAO,gBAAgB,yBAAwB,MAAM,yBAA0B,CAAA;AAAA,MACjF;AAAA,MACA,MAAK;AAAA,IAAA,CACiB;AAEZ;;;;;;"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../../src/components/basic/doc-editor/plugins/TemplatePlugin/index.vue"],"sourcesContent":["<script setup lang=\"ts\">\r\n\r\nimport { useLexicalComposer } from '../../core/composables'\r\nimport { registerDocEditorToolbarExtend,type ToolbarExtendPlugin } from \"../../core\"\r\nimport { showTemplateSelectDialog,showHtmlTemplateDialog, useTemplate } from \"./composables\"\r\nimport { INSERT_TEMPLATE_COMMAND,INSERT_HTMLTEMPLATE_COMMAND } from \"./commands\"\r\n\r\n // 编辑器\r\n const editor = useLexicalComposer()\r\n\r\n // 注册到工具条\r\n registerDocEditorToolbarExtend({\r\n icon:\"richtext\",\r\n text:\"模版\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_TEMPLATE_COMMAND,await showTemplateSelectDialog())\r\n },\r\n sort:90\r\n } as ToolbarExtendPlugin)\r\n // 注册到工具条\r\n registerDocEditorToolbarExtend({\r\n icon:\"html-code\",\r\n text:\"HTML模版\",\r\n action:async ()=>{\r\n editor.dispatchCommand(INSERT_HTMLTEMPLATE_COMMAND,await showHtmlTemplateDialog())\r\n },\r\n sort:89\r\n } as ToolbarExtendPlugin)\r\n\r\n useTemplate();\r\n</script>\r\n\r\n<template></template>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAQE,UAAM,SAAS;AAGgB,mCAAA;AAAA,MAC7B,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAO,YAAU;AACf,eAAO,gBAAgB,yBAAwB,MAAM,yBAA0B,CAAA;AAAA,MACjF;AAAA,MACA,MAAK;AAAA,IAAA,CACiB;AAEO,mCAAA;AAAA,MAC7B,MAAK;AAAA,MACL,MAAK;AAAA,MACL,QAAO,YAAU;AACf,eAAO,gBAAgB,6BAA4B,MAAM,uBAAwB,CAAA;AAAA,MACnF;AAAA,MACA,MAAK;AAAA,IAAA,CACiB;AAEZ;;;;;;"}

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js CHANGED Viewed

@@ -1,4 +1,4 @@
-const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 20px;\r\n}\r\n\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text img{\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n} */\r\n.mk-doc-active-grid-mark{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\np{ margin: 0; }\r\n\r\n/* 段落的编辑样式 */\r\n.mk-doc__paragraph>br{ \r\n  display: none;\r\n}\r\n.mk-doc__paragraph::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n';
+const DocEditorEditCss = '\r\n.mk-doc__img {\r\n  cursor: pointer;\r\n  z-index: 1;\r\n  position: relative;\r\n}\r\n\r\n.mk-doc__grid{\r\n  outline: 2px solid #eff5ff;\r\n  position: relative;\r\n  cursor: pointer;\r\n  white-space:initial;\r\n  word-break:initial;\r\n  min-height: 20px;\r\n}\r\n\r\n/* 文本框可编辑文字 */\r\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\r\n  cursor: text;\r\n}\r\n\r\n/* 图文环绕容器下的文本框不做选中 */\r\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\r\n  outline: 0;\r\n  padding-top: 0;\r\n}\r\n.mk-doc__grid.mk-doc__image-text img{\r\n  position: relative;\r\n  z-index: 1;\r\n}\r\n\r\n\r\n\r\n/* 避免模块下的a标签点击 */\r\n.mk-doc__grid.mk-doc__module-grid a{\r\n  pointer-events: none;\r\n}\r\n\r\n/* 给布局下的格子加内边距方便编辑 */\r\n/* .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\r\n  margin: 10px;\r\n} */\r\n.mk-doc-active-grid-mark{\r\n  text-align: center;\r\n  background-color: #eff5ff;\r\n  color: #4284ff;\r\n  left: -20px;\r\n  top: 0px;\r\n  pointer-events: all;\r\n  font-size: 14px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  z-index: 999; \r\n  width: 20px;\r\n  cursor: pointer;\r\n  font-size: 12px;\r\n  padding: 5px 0;\r\n}\r\n\r\n/* 块选中 */\r\n.mk-doc__embedBlock {\r\n  position: relative;\r\n  z-index: 1;\r\n  padding: 1px;\r\n  cursor: pointer;\r\n}\r\n.mk-doc__embedBlockFocus {\r\n  outline: 2px solid rgb(60, 132, 244);\r\n}\r\n\r\n.mk-doc__embedBlock >*{\r\n  pointer-events: none;\r\n}\r\n\r\np{ margin: 0; }\r\n\r\n/* 段落的编辑样式 */\r\n.mk-doc__paragraph>br{ \r\n  display: none;\r\n}\r\n.mk-doc__paragraph::after{ \r\n  content: "↩︎";\r\n  margin-left: 8px;\r\n  color: #ccc;\r\n}\r\n.placeholder .mk-doc__paragraph::after{ \r\n  display: none;\r\n}\r\n';
 export {
   DocEditorEditCss as default
 };

package/dist/esm/components/basic/doc-editor/themes/doc-editor-edit.css.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"doc-editor-edit.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor-edit.css?raw"],"sourcesContent":["export default \"\\r\\n.mk-doc__img {\\r\\n cursor: pointer;\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.mk-doc__grid{\\r\\n outline: 2px solid #eff5ff;\\r\\n position: relative;\\r\\n cursor: pointer;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n min-height: 20px;\\r\\n}\\r\\n\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text img{\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n}\\r\\n\\r\\n\\r\\n\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n/ .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n} /\\r\\n.mk-doc-active-grid-mark{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\np{ margin: 0; }\\r\\n\\r\\n/* 段落的编辑样式 */\\r\\n.mk-doc__paragraph>br{ \\r\\n display: none;\\r\\n}\\r\\n.mk-doc__paragraph::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}
1	+ {"version":3,"file":"doc-editor-edit.css.js","sources":["../../../../../../src/components/basic/doc-editor/themes/doc-editor-edit.css?raw"],"sourcesContent":["export default \"\\r\\n.mk-doc__img {\\r\\n cursor: pointer;\\r\\n z-index: 1;\\r\\n position: relative;\\r\\n}\\r\\n\\r\\n.mk-doc__grid{\\r\\n outline: 2px solid #eff5ff;\\r\\n position: relative;\\r\\n cursor: pointer;\\r\\n white-space:initial;\\r\\n word-break:initial;\\r\\n min-height: 20px;\\r\\n}\\r\\n\\r\\n/* 文本框可编辑文字 /\\r\\n.mk-doc__grid.mk-doc__text-grid :not(.mk-doc__grid){\\r\\n cursor: text;\\r\\n}\\r\\n\\r\\n/ 图文环绕容器下的文本框不做选中 /\\r\\n.mk-doc__grid.mk-doc__image-text .mk-doc__text-grid{\\r\\n outline: 0;\\r\\n padding-top: 0;\\r\\n}\\r\\n.mk-doc__grid.mk-doc__image-text img{\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n}\\r\\n\\r\\n\\r\\n\\r\\n/ 避免模块下的a标签点击 /\\r\\n.mk-doc__grid.mk-doc__module-grid a{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\n/ 给布局下的格子加内边距方便编辑 /\\r\\n/ .mk-doc__grid.mk-doc__layout-grid >.mk-doc__grid{\\r\\n margin: 10px;\\r\\n} /\\r\\n.mk-doc-active-grid-mark{\\r\\n text-align: center;\\r\\n background-color: #eff5ff;\\r\\n color: #4284ff;\\r\\n left: -20px;\\r\\n top: 0px;\\r\\n pointer-events: all;\\r\\n font-size: 14px;\\r\\n display: flex;\\r\\n align-items: center;\\r\\n justify-content: center;\\r\\n z-index: 999; \\r\\n width: 20px;\\r\\n cursor: pointer;\\r\\n font-size: 12px;\\r\\n padding: 5px 0;\\r\\n}\\r\\n\\r\\n/ 块选中 /\\r\\n.mk-doc__embedBlock {\\r\\n position: relative;\\r\\n z-index: 1;\\r\\n padding: 1px;\\r\\n cursor: pointer;\\r\\n}\\r\\n.mk-doc__embedBlockFocus {\\r\\n outline: 2px solid rgb(60, 132, 244);\\r\\n}\\r\\n\\r\\n.mk-doc__embedBlock >{\\r\\n pointer-events: none;\\r\\n}\\r\\n\\r\\np{ margin: 0; }\\r\\n\\r\\n/* 段落的编辑样式 */\\r\\n.mk-doc__paragraph>br{ \\r\\n display: none;\\r\\n}\\r\\n.mk-doc__paragraph::after{ \\r\\n content: \\\"↩︎\\\";\\r\\n margin-left: 8px;\\r\\n color: #ccc;\\r\\n}\\r\\n.placeholder .mk-doc__paragraph::after{ \\r\\n display: none;\\r\\n}\\r\\n\""],"names":[],"mappings":"AAAA,MAAe,mBAAA;"}

package/dist/esm/modules/cms/components/part-tree/index.vue.js CHANGED Viewed

@@ -72,6 +72,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const i18n = useI18n();
     const dataTree = reactive(new CmsPartTree());
+    const isDrag = ref(false);
     const selectNodeId = ref(optionSettings.curSelectId);
     watch(() => optionSettings.curSelectId, () => {
       selectNodeId.value = optionSettings.curSelectId;
@@ -119,6 +120,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     __expose({ dataTree });
     return (_ctx, _cache) => {
       const _component_MKSvgIcon = resolveComponent("MKSvgIcon");
+      const _component_el_switch = resolveComponent("el-switch");
       const _component_ElIcon = resolveComponent("ElIcon");
       const _component_el_dropdown_item = resolveComponent("el-dropdown-item");
       const _component_el_dropdown_menu = resolveComponent("el-dropdown-menu");
@@ -128,7 +130,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           createElementVNode("div", null, [
             createVNode(_component_MKSvgIcon, { iconClass: "Notebook" }),
             createTextVNode(" 栏目 ")
-          ])
+          ]),
+          createVNode(_component_el_switch, {
+            modelValue: isDrag.value,
+            "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => isDrag.value = $event),
+            "inline-prompt": "",
+            "active-text": "开启排序",
+            "inactive-text": "关闭排序"
+          }, null, 8, ["modelValue"])
         ]),
         createElementVNode("div", _hoisted_3, [
           createVNode(unref(ElScrollbar), { style: { "height": "100%" } }, {
@@ -143,7 +152,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                     "data-tree": dataTree,
                     onNodeClick: selectPart,
                     defaultExpandAll: "",
-                    draggable: "",
+                    draggable: isDrag.value,
                     ref_key: "treeRef",
                     ref: treeRef,
                     currentNodeKey: selectNodeId.value
@@ -200,7 +209,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                       }, 1024)
                     ]),
                     _: 1
-                  }, 8, ["data-tree", "currentNodeKey"])
+                  }, 8, ["data-tree", "draggable", "currentNodeKey"])
                 ]),
                 _: 1
               }, 8, ["data-table"])

package/dist/esm/modules/cms/components/part-tree/index.vue.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.vue.js","sources":["../../../../../../src/modules/cms/components/part-tree/index.vue"],"sourcesContent":["<template>\r\n <div class=\"cms-part-tree\">\r\n <div class=\"cms-part-tree__header\">\r\n <div>\r\n <MKSvgIcon iconClass=\"Notebook\" />\r\n 栏目\r\n </div>\r\n </div>\r\n <div class=\"cms-part-tree__body\">\r\n <ElScrollbar style=\"height: 100%;\">\r\n <MKDataTable :auto-load=\"true\" :data-table=\"dataTree\" highlight-current>\r\n <MKTree :data-tree=\"dataTree\" @nodeClick=\"selectPart\" defaultExpandAll draggable ref=\"treeRef\" :currentNodeKey=\"selectNodeId\">\r\n <template #node-main=\"{ data }\">\r\n {{ data.data.title }}\r\n </template>\r\n <template #node-tools=\"{ data }\">\r\n <el-dropdown>\r\n <ElIcon>\r\n <MoreFilled />\r\n </ElIcon>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :icon=\"Edit\" @click=\"handleEditClick(data.data)\">编辑</el-dropdown-item>\r\n <el-dropdown-item :icon=\"Delete\" @click=\"handleDeleteClick(data.data)\">删除</el-dropdown-item>\r\n <el-dropdown-item v-if=\"data.data.cmsPartTypeId != 1\" :icon=\"Plus\"\r\n @click=\"handleAddClick(data.data)\">添加子菜单</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </template>\r\n </MKTree>\r\n </MKDataTable>\r\n </ElScrollbar>\r\n </div>\r\n </div>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { ElMessageBox, ElScrollbar } from \"element-plus\"\r\nimport { Plus, Edit, Delete, MoreFilled } from \"@element-plus/icons-vue\";\r\nimport { reactive, defineProps, watch, defineEmits, ref } from \"vue\";\r\nimport { MKDataTable, MKTree } from \"../../../../components/data-model/data-table\"\r\nimport { CmsPartTree } from \"../../dataviews\";\r\nimport { useI18n } from \"../../../../composables\";\r\nimport { DataTreeNode } from \"@maketribe/dm\";\r\n\r\ndefineOptions({ name: \"MKPartTree\" });\r\nconst treeRef = ref(null);\r\n// 配置选项\r\nconst optionSettings = defineProps<{\r\n curSelectId?:string\|undefined\r\n}>();\r\n\r\n// 事件定义\r\nconst emit = defineEmits([\"edit\", \"add\", \"deleteSuccessfully\", \"select\"]);\r\n\r\nconst i18n = useI18n()!;\r\nconst dataTree = reactive(new CmsPartTree()) as CmsPartTree;\r\nconst selectNodeId = ref(optionSettings.curSelectId);\r\n\r\nwatch(()=>optionSettings.curSelectId,()=>{\r\n selectNodeId.value = optionSettings.curSelectId\r\n})\r\n\r\n// 监听数据变化\r\ndataTree.listChangeEvent.on(() => {\r\n\r\n const list = dataTree.getList();\r\n\r\n if (list.length > 0) {\r\n //默认选择第一条\r\n if(!selectNodeId.value){ selectNodeId.value = list[0].id; }\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n let item = list[i]\r\n \r\n if(item.id == selectNodeId.value){\r\n emit(\"select\", item);\r\n break;\r\n }\r\n item.children?.forEach((child:any)=>list.push(child))\r\n\r\n }\r\n }\r\n})\r\n\r\n/*\r\n 点击添加栏目按钮\r\n * @param item \r\n /\r\nconst handleAddClick = (item: any) => {\r\n emit(\"add\", item);\r\n}\r\n\r\n/\r\n 编辑栏目\r\n * @param item \r\n /\r\nconst handleEditClick = (item: any) => {\r\n emit(\"edit\", item);\r\n}\r\n/\r\n 删除栏目\r\n * @param item \r\n /\r\nconst handleDeleteClick = async (item: any) => {\r\n // 删除提示\r\n const isConfirm = await ElMessageBox.confirm(\r\n i18n.translate(\"mk.dataTablePage.deleteMessage\"),\r\n i18n.translate(\"mk.dataTablePage.deleteTitle\"),\r\n { type: \"warning\" }\r\n )\r\n\r\n if (!isConfirm) {\r\n return;\r\n }\r\n const result = await dataTree.deleteAfterRefresh(item.id);\r\n if (result.data.code == 200) {\r\n emit('deleteSuccessfully', item)\r\n }\r\n}\r\n\r\n/\r\n 选择栏目\r\n * @param data \r\n */\r\nconst selectPart = (data: DataTreeNode) => {\r\n emit(\"select\", data.data);\r\n}\r\n\r\ndefineExpose({ dataTree });\r\n\r\n\r\n</script>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~AA8CM~~,UAAA,UAAU,IAAI,IAAI;AAExB,UAAM,iBAAiB;AAKvB,UAAM,OAAO;AAEb,UAAM,OAAO;AACb,UAAM,WAAW,SAAS,IAAI,YAAa,CAAA;~~AACrC~~,UAAA,eAAe,IAAI,eAAe,WAAW;AAE7C,UAAA,MAAI,eAAe,aAAY,MAAI;AACvC,mBAAa,QAAQ,eAAe;AAAA,IAAA,CACrC;AAGQ,aAAA,gBAAgB,GAAG,MAAM;;AAE1B,YAAA,OAAO,SAAS;AAElB,UAAA,KAAK,SAAS,GAAG;AAEhB,YAAA,CAAC,aAAa,OAAM;AAAe,uBAAA,QAAQ,KAAK,CAAC,EAAE;AAAA,QAAI;AAE1D,iBAAQ,IAAE,GAAE,IAAE,KAAK,QAAO,KAAI;AAExB,cAAA,OAAO,KAAK,CAAC;AAEd,cAAA,KAAK,MAAM,aAAa,OAAM;AAC/B,iBAAK,UAAU,IAAI;AACnB;AAAA,UACF;AACA,qBAAK,aAAL,mBAAe,QAAQ,CAAC,UAAY,KAAK,KAAK,KAAK;AAAA,QAErD;AAAA,MACF;AAAA,IAAA,CACD;AAMK,UAAA,iBAAiB,CAAC,SAAc;AACpC,WAAK,OAAO,IAAI;AAAA,IAAA;AAOZ,UAAA,kBAAkB,CAAC,SAAc;AACrC,WAAK,QAAQ,IAAI;AAAA,IAAA;AAMb,UAAA,oBAAoB,OAAO,SAAc;AAEvC,YAAA,YAAY,MAAM,aAAa;AAAA,QACnC,KAAK,UAAU,gCAAgC;AAAA,QAC/C,KAAK,UAAU,8BAA8B;AAAA,QAC7C,EAAE,MAAM,UAAU;AAAA,MAAA;AAGpB,UAAI,CAAC,WAAW;AACd;AAAA,MACF;AACA,YAAM,SAAS,MAAM,SAAS,mBAAmB,KAAK,EAAE;AACpD,UAAA,OAAO,KAAK,QAAQ,KAAK;AAC3B,aAAK,sBAAsB,IAAI;AAAA,MACjC;AAAA,IAAA;AAOI,UAAA,aAAa,CAAC,SAAuB;AACpC,WAAA,UAAU,KAAK,IAAI;AAAA,IAAA;AAGb,aAAA,EAAE,UAAU~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"index.vue.js","sources":["../../../../../../src/modules/cms/components/part-tree/index.vue"],"sourcesContent":["<template>\r\n <div class=\"cms-part-tree\">\r\n <div class=\"cms-part-tree__header\">\r\n <div>\r\n <MKSvgIcon iconClass=\"Notebook\" />\r\n 栏目\r\n </div>\r\n <el-switch v-model=\"isDrag\" inline-prompt active-text=\"开启排序\"\r\n inactive-text=\"关闭排序\" />\r\n </div>\r\n <div class=\"cms-part-tree__body\">\r\n <ElScrollbar style=\"height: 100%;\">\r\n <MKDataTable :auto-load=\"true\" :data-table=\"dataTree\" highlight-current>\r\n <MKTree :data-tree=\"dataTree\" @nodeClick=\"selectPart\" defaultExpandAll :draggable=\"isDrag\" ref=\"treeRef\" :currentNodeKey=\"selectNodeId\">\r\n <template #node-main=\"{ data }\">\r\n {{ data.data.title }}\r\n </template>\r\n <template #node-tools=\"{ data }\">\r\n <el-dropdown>\r\n <ElIcon>\r\n <MoreFilled />\r\n </ElIcon>\r\n <template #dropdown>\r\n <el-dropdown-menu>\r\n <el-dropdown-item :icon=\"Edit\" @click=\"handleEditClick(data.data)\">编辑</el-dropdown-item>\r\n <el-dropdown-item :icon=\"Delete\" @click=\"handleDeleteClick(data.data)\">删除</el-dropdown-item>\r\n <el-dropdown-item v-if=\"data.data.cmsPartTypeId != 1\" :icon=\"Plus\"\r\n @click=\"handleAddClick(data.data)\">添加子菜单</el-dropdown-item>\r\n </el-dropdown-menu>\r\n </template>\r\n </el-dropdown>\r\n </template>\r\n </MKTree>\r\n </MKDataTable>\r\n </ElScrollbar>\r\n </div>\r\n </div>\r\n</template>\r\n<script setup lang='ts'>\r\nimport { ElMessageBox, ElScrollbar } from \"element-plus\"\r\nimport { Plus, Edit, Delete, MoreFilled } from \"@element-plus/icons-vue\";\r\nimport { reactive, defineProps, watch, defineEmits, ref } from \"vue\";\r\nimport { MKDataTable, MKTree } from \"../../../../components/data-model/data-table\"\r\nimport { CmsPartTree } from \"../../dataviews\";\r\nimport { useI18n } from \"../../../../composables\";\r\nimport { DataTreeNode } from \"@maketribe/dm\";\r\n\r\ndefineOptions({ name: \"MKPartTree\" });\r\nconst treeRef = ref(null);\r\n// 配置选项\r\nconst optionSettings = defineProps<{\r\n curSelectId?:string\|undefined\r\n}>();\r\n\r\n// 事件定义\r\nconst emit = defineEmits([\"edit\", \"add\", \"deleteSuccessfully\", \"select\"]);\r\n\r\nconst i18n = useI18n()!;\r\nconst dataTree = reactive(new CmsPartTree()) as CmsPartTree;\r\n\r\nconst isDrag = ref(false)\r\n\r\nconst selectNodeId = ref(optionSettings.curSelectId);\r\n\r\nwatch(()=>optionSettings.curSelectId,()=>{\r\n selectNodeId.value = optionSettings.curSelectId\r\n})\r\n\r\n// 监听数据变化\r\ndataTree.listChangeEvent.on(() => {\r\n\r\n const list = dataTree.getList();\r\n\r\n if (list.length > 0) {\r\n //默认选择第一条\r\n if(!selectNodeId.value){ selectNodeId.value = list[0].id; }\r\n\r\n for(let i=0;i<list.length;i++){\r\n\r\n let item = list[i]\r\n \r\n if(item.id == selectNodeId.value){\r\n emit(\"select\", item);\r\n break;\r\n }\r\n item.children?.forEach((child:any)=>list.push(child))\r\n\r\n }\r\n }\r\n})\r\n\r\n/*\r\n 点击添加栏目按钮\r\n * @param item \r\n /\r\nconst handleAddClick = (item: any) => {\r\n emit(\"add\", item);\r\n}\r\n\r\n/\r\n 编辑栏目\r\n * @param item \r\n /\r\nconst handleEditClick = (item: any) => {\r\n emit(\"edit\", item);\r\n}\r\n/\r\n 删除栏目\r\n * @param item \r\n /\r\nconst handleDeleteClick = async (item: any) => {\r\n // 删除提示\r\n const isConfirm = await ElMessageBox.confirm(\r\n i18n.translate(\"mk.dataTablePage.deleteMessage\"),\r\n i18n.translate(\"mk.dataTablePage.deleteTitle\"),\r\n { type: \"warning\" }\r\n )\r\n\r\n if (!isConfirm) {\r\n return;\r\n }\r\n const result = await dataTree.deleteAfterRefresh(item.id);\r\n if (result.data.code == 200) {\r\n emit('deleteSuccessfully', item)\r\n }\r\n}\r\n\r\n/\r\n 选择栏目\r\n * @param data \r\n */\r\nconst selectPart = (data: DataTreeNode) => {\r\n emit(\"select\", data.data);\r\n}\r\n\r\ndefineExpose({ dataTree });\r\n\r\n\r\n</script>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgDM,UAAA,UAAU,IAAI,IAAI;AAExB,UAAM,iBAAiB;AAKvB,UAAM,OAAO;AAEb,UAAM,OAAO;AACb,UAAM,WAAW,SAAS,IAAI,YAAa,CAAA;AAErC,UAAA,SAAS,IAAI,KAAK;AAElB,UAAA,eAAe,IAAI,eAAe,WAAW;AAE7C,UAAA,MAAI,eAAe,aAAY,MAAI;AACvC,mBAAa,QAAQ,eAAe;AAAA,IAAA,CACrC;AAGQ,aAAA,gBAAgB,GAAG,MAAM;;AAE1B,YAAA,OAAO,SAAS;AAElB,UAAA,KAAK,SAAS,GAAG;AAEhB,YAAA,CAAC,aAAa,OAAM;AAAe,uBAAA,QAAQ,KAAK,CAAC,EAAE;AAAA,QAAI;AAE1D,iBAAQ,IAAE,GAAE,IAAE,KAAK,QAAO,KAAI;AAExB,cAAA,OAAO,KAAK,CAAC;AAEd,cAAA,KAAK,MAAM,aAAa,OAAM;AAC/B,iBAAK,UAAU,IAAI;AACnB;AAAA,UACF;AACA,qBAAK,aAAL,mBAAe,QAAQ,CAAC,UAAY,KAAK,KAAK,KAAK;AAAA,QAErD;AAAA,MACF;AAAA,IAAA,CACD;AAMK,UAAA,iBAAiB,CAAC,SAAc;AACpC,WAAK,OAAO,IAAI;AAAA,IAAA;AAOZ,UAAA,kBAAkB,CAAC,SAAc;AACrC,WAAK,QAAQ,IAAI;AAAA,IAAA;AAMb,UAAA,oBAAoB,OAAO,SAAc;AAEvC,YAAA,YAAY,MAAM,aAAa;AAAA,QACnC,KAAK,UAAU,gCAAgC;AAAA,QAC/C,KAAK,UAAU,8BAA8B;AAAA,QAC7C,EAAE,MAAM,UAAU;AAAA,MAAA;AAGpB,UAAI,CAAC,WAAW;AACd;AAAA,MACF;AACA,YAAM,SAAS,MAAM,SAAS,mBAAmB,KAAK,EAAE;AACpD,UAAA,OAAO,KAAK,QAAQ,KAAK;AAC3B,aAAK,sBAAsB,IAAI;AAAA,MACjC;AAAA,IAAA;AAOI,UAAA,aAAa,CAAC,SAAuB;AACpC,WAAA,UAAU,KAAK,IAAI;AAAA,IAAA;AAGb,aAAA,EAAE,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}