forked from zhurui/management
1 line
9.3 KiB
JSON
1 line
9.3 KiB
JSON
{"remainingRequest":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\vue-loader\\lib\\index.js??vue-loader-options!C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\src\\components\\Tinymce\\index.vue?vue&type=style&index=0&id=0177f75c&lang=scss&scoped=true&","dependencies":[{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\src\\components\\Tinymce\\index.vue","mtime":1622443089431},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\css-loader\\index.js","mtime":499162500000},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\vue-loader\\lib\\loaders\\stylePostLoader.js","mtime":499162500000},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\postcss-loader\\src\\index.js","mtime":499162500000},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\sass-loader\\lib\\loader.js","mtime":1533139052000},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\cache-loader\\dist\\cjs.js","mtime":499162500000},{"path":"C:\\Users\\27446\\Desktop\\up\\front\\dkha-web-sz-main\\node_modules\\vue-loader\\lib\\index.js","mtime":499162500000}],"contextDependencies":[],"result":["\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n.tinymce-container {\n position: relative;\n line-height: normal;\n}\n\n.tinymce-container {\n ::v-deep {\n .mce-fullscreen {\n z-index: 10000;\n }\n }\n}\n\n.tinymce-textarea {\n visibility: hidden;\n z-index: -1;\n}\n\n.editor-custom-btn-container {\n position: absolute;\n right: 4px;\n top: 4px;\n /*z-index: 2005;*/\n}\n\n.fullscreen .editor-custom-btn-container {\n z-index: 10000;\n position: fixed;\n}\n\n.editor-upload-btn {\n display: inline-block;\n}\n",{"version":3,"sources":["index.vue"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqNA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;AACA;AACA;;AAEA;AACA;AACA;AACA;;AAEA;AACA;AACA","file":"index.vue","sourceRoot":"src/components/Tinymce","sourcesContent":["<template>\n <div :class=\"{fullscreen:fullscreen}\" class=\"tinymce-container\" :style=\"{width:containerWidth}\">\n <textarea :id=\"tinymceId\" class=\"tinymce-textarea\" />\n <div class=\"editor-custom-btn-container\">\n <editorImage color=\"#1890ff\" class=\"editor-upload-btn\" @successCBK=\"imageSuccessCBK\" />\n </div>\n </div>\n</template>\n\n<script>\n/**\n * docs:\n * https://panjiachen.github.io/vue-element-admin-site/feature/component/rich-editor.html#tinymce\n */\nimport editorImage from './components/EditorImage'\nimport plugins from './plugins'\nimport toolbar from './toolbar'\nimport load from './dynamicLoadScript'\n\n// why use this cdn, detail see https://github.com/PanJiaChen/tinymce-all-in-one\nconst tinymceCDN = 'https://cdn.jsdelivr.net/npm/tinymce-all-in-one@4.9.3/tinymce.min.js'\n\nexport default {\n name: 'Tinymce',\n components: { editorImage },\n props: {\n id: {\n type: String,\n default: function() {\n return 'vue-tinymce-' + +new Date() + ((Math.random() * 1000).toFixed(0) + '')\n }\n },\n value: {\n type: String,\n default: ''\n },\n toolbar: {\n type: Array,\n required: false,\n default() {\n return []\n }\n },\n menubar: {\n type: String,\n default: 'file edit insert view format table'\n },\n height: {\n type: [Number, String],\n required: false,\n default: 360\n },\n width: {\n type: [Number, String],\n required: false,\n default: 'auto'\n }\n },\n data() {\n return {\n hasChange: false,\n hasInit: false,\n tinymceId: this.id,\n fullscreen: false,\n languageTypeList: {\n 'en': 'en',\n 'zh': 'zh_CN',\n 'es': 'es_MX',\n 'ja': 'ja'\n }\n }\n },\n computed: {\n containerWidth() {\n const width = this.width\n if (/^[\\d]+(\\.[\\d]+)?$/.test(width)) { // matches `100`, `'100'`\n return `${width}px`\n }\n return width\n }\n },\n watch: {\n value(val) {\n if (!this.hasChange && this.hasInit) {\n this.$nextTick(() =>\n window.tinymce.get(this.tinymceId).setContent(val || ''))\n }\n }\n },\n mounted() {\n this.init()\n },\n activated() {\n if (window.tinymce) {\n this.initTinymce()\n }\n },\n deactivated() {\n this.destroyTinymce()\n },\n destroyed() {\n this.destroyTinymce()\n },\n methods: {\n init() {\n // dynamic load tinymce from cdn\n load(tinymceCDN, (err) => {\n if (err) {\n this.$message.error(err.message)\n return\n }\n this.initTinymce()\n })\n },\n initTinymce() {\n const _this = this\n window.tinymce.init({\n selector: `#${this.tinymceId}`,\n language: this.languageTypeList['en'],\n height: this.height,\n body_class: 'panel-body ',\n object_resizing: false,\n toolbar: this.toolbar.length > 0 ? this.toolbar : toolbar,\n menubar: this.menubar,\n plugins: plugins,\n end_container_on_empty_block: true,\n powerpaste_word_import: 'clean',\n code_dialog_height: 450,\n code_dialog_width: 1000,\n advlist_bullet_styles: 'square',\n advlist_number_styles: 'default',\n imagetools_cors_hosts: ['www.tinymce.com', 'codepen.io'],\n default_link_target: '_blank',\n link_title: false,\n nonbreaking_force_tab: true, // inserting nonbreaking space need Nonbreaking Space Plugin\n init_instance_callback: editor => {\n if (_this.value) {\n editor.setContent(_this.value)\n }\n _this.hasInit = true\n editor.on('NodeChange Change KeyUp SetContent', () => {\n this.hasChange = true\n this.$emit('input', editor.getContent())\n })\n },\n setup(editor) {\n editor.on('FullscreenStateChanged', (e) => {\n _this.fullscreen = e.state\n })\n },\n // it will try to keep these URLs intact\n // https://www.tiny.cloud/docs-3x/reference/configuration/Configuration3x@convert_urls/\n // https://stackoverflow.com/questions/5196205/disable-tinymce-absolute-to-relative-url-conversions\n convert_urls: false\n // 整合七牛上传\n // images_dataimg_filter(img) {\n // setTimeout(() => {\n // const $image = $(img);\n // $image.removeAttr('width');\n // $image.removeAttr('height');\n // if ($image[0].height && $image[0].width) {\n // $image.attr('data-wscntype', 'image');\n // $image.attr('data-wscnh', $image[0].height);\n // $image.attr('data-wscnw', $image[0].width);\n // $image.addClass('wscnph');\n // }\n // }, 0);\n // return img\n // },\n // images_upload_handler(blobInfo, success, failure, progress) {\n // progress(0);\n // const token = _this.$store.getters.token;\n // getToken(token).then(response => {\n // const url = response.data.qiniu_url;\n // const formData = new FormData();\n // formData.append('token', response.data.qiniu_token);\n // formData.append('key', response.data.qiniu_key);\n // formData.append('file', blobInfo.blob(), url);\n // upload(formData).then(() => {\n // success(url);\n // progress(100);\n // })\n // }).catch(err => {\n // failure('出现未知问题，刷新页面，或者联系程序员')\n // console.log(err);\n // });\n // },\n })\n },\n destroyTinymce() {\n const tinymce = window.tinymce.get(this.tinymceId)\n if (this.fullscreen) {\n tinymce.execCommand('mceFullScreen')\n }\n\n if (tinymce) {\n tinymce.destroy()\n }\n },\n setContent(value) {\n window.tinymce.get(this.tinymceId).setContent(value)\n },\n getContent() {\n window.tinymce.get(this.tinymceId).getContent()\n },\n imageSuccessCBK(arr) {\n arr.forEach(v => window.tinymce.get(this.tinymceId).insertContent(`<img class=\"wscnph\" src=\"${v.url}\" >`))\n }\n }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n.tinymce-container {\n position: relative;\n line-height: normal;\n}\n\n.tinymce-container {\n ::v-deep {\n .mce-fullscreen {\n z-index: 10000;\n }\n }\n}\n\n.tinymce-textarea {\n visibility: hidden;\n z-index: -1;\n}\n\n.editor-custom-btn-container {\n position: absolute;\n right: 4px;\n top: 4px;\n /*z-index: 2005;*/\n}\n\n.fullscreen .editor-custom-btn-container {\n z-index: 10000;\n position: fixed;\n}\n\n.editor-upload-btn {\n display: inline-block;\n}\n</style>\n"]}]} |