Skip to content

R
rs-cloud-platform-ui
Commit e71f47be authored by obt's avatar obt
Browse files
Options

kindeditor更新

parent 8a6dae04
Show whitespace changes
Inline Side-by-side
Showing with 659 additions and 308 deletions
src/components/CustomForm/index.vue
View file @ e71f47be
......@@ -24,7 +24,7 @@
</div>
<div v-else-if="item.type && item.type == 'kindEditor'">
<kind-editor ref="kindEditor" :html="html" @input="getContent"></kind-editor>
<kind-editor id="editor_id" :content.sync="content" :afterChange="afterChange()" :loadStyleMode="false"@on-content-change="onContentChange"></kind-editor>
</div>
<!-- 输入框 -->
......@@ -42,7 +42,7 @@
<script>
import MyUpload from "@/components/Upload/singleImageX"//上传组件
import CustomInput from "@/components/CustomInput"//自定义组件
import KindEditor from "@/components/Kindeditor"//富文本
import KindEditor from "@/components/Kindeditor";
export default {
name: "CustomForm",
......@@ -59,8 +59,6 @@ export default {
},
data() {
return {
html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
// html: '#',
content: ""
}
},
......@@ -71,8 +69,11 @@ export default {
}
},
methods: {
getContent(val) {
console.log('富文本', val)
onContentChange (val) {
console.log(val)
},
afterChange () {
},
resetParams(val) {
this.getForm.formVal.jumpType = val;
......
src/components/Kindeditor/index.vue
View file @ e71f47be
<!--
* @Author: your name
* @Date: 2020-12-03 11:23:35
* @LastEditTime: 2020-12-03 14:15:19
* @Date: 2020-12-04 13:31:26
* @LastEditTime: 2020-12-04 13:47:41
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\index.vue
* @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\kindeditor.vue
-->
<template>
<div class="margin-top-20">
<textarea :id="id" name="content" v-model="outContent"></textarea>
<input @change="selectedFile" style="visibility: hidden;height:0;" type="file" name id="inputFile"/>
<div class="kindeditor">
<textarea :id="id" name="content" style="visibility: hidden;height:0;" v-model="outContent"></textarea>
</div>
</template>
<script>
import axios from 'axios';
import "kindeditor/themes/default/default.css";
import "kindeditor/kindeditor-all-min.js";
import "kindeditor/lang/zh-CN.js";
// 以下四个配置文件见下文
import items from "./config/items";
import htmlTags from "./config/htmlTags";
import fontSizeTable from "./config/fontSizeTable";
import otherConfig from "./config/otherConfig";
<script>
import 'kindeditor/kindeditor-all.js'
import 'kindeditor/lang/zh-CN.js'
import 'kindeditor/themes/default/default.css'
export default {
name: "kindeditor-component",
props: {
// 编辑器内容 url
html: {
type: String,
default: ""
name: 'kindeditor',
data () {
return {
editor: null,
outContent: this.content
}
},
// 编辑器内容
props: {
content: {
type: String,
default: ""
default: ''
},
// 编辑器id
id: {
type: String,
// required: true,
default: "kindeditor-id"
required: true
},
// 宽
width: {
......@@ -52,258 +42,332 @@ export default {
// 高
height: {
type: String,
default: "400"
default: "500"
},
// 最小宽
minWidth: {
type: Number,
default: 650
type: Number
},
// 最小高
minHeight: {
type: Number,
default: 400
type: Number
},
// toolbar 工具栏配置
items: {
type: Array,
default: function() {
return [...items];
default: function () {
return [
'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',
'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',
'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',
'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
'anchor', 'link', 'unlink', '|', 'about'
]
}
},
// 标签配置
noDisableItems: {
type: Array,
default: function () {
return ['source', 'fullscreen']
}
},
filterMode: {
type: Boolean,
default: true
},
htmlTags: {
type: Object,
default: function() {
return { ...htmlTags };
default: function () {
return {
font: ['color', 'size', 'face', '.background-color'],
span: ['style'],
div: ['class', 'align', 'style'],
table: ['class', 'border', 'cellspacing', 'cellpadding', 'width', 'height', 'align', 'style'],
'td,th': ['class', 'align', 'valign', 'width', 'height', 'colspan', 'rowspan', 'bgcolor', 'style'],
a: ['class', 'href', 'target', 'name', 'style'],
embed: ['src', 'width', 'height', 'type', 'loop', 'autostart', 'quality',
'style', 'align', 'allowscriptaccess', '/'],
img: ['src', 'width', 'height', 'border', 'alt', 'title', 'align', 'style', '/'],
hr: ['class', '/'],
br: ['/'],
'p,ol,ul,li,blockquote,h1,h2,h3,h4,h5,h6': ['align', 'style'],
'tbody,tr,strong,b,sub,sup,em,i,u,strike': []
}
},
//字号配置
fontSizeTable: {
type: Array,
default: function() {
return [...fontSizeTable];
}
},
// 语言配置
wellFormatMode: {
type: Boolean,
default: true
},
resizeType: {
type: Number,
default: 0
},
themeType: {
type: String,
default: 'default'
},
langType: {
type: String,
default: "zh-CN"
default: 'zh-CN'
},
// 主题配置
themeType: {
designMode: {
type: Boolean,
default: true
},
fullscreenMode: {
type: Boolean,
default: false
},
basePath: {
type: String
},
themesPath: {
type: String
},
pluginsPath: {
type: String,
default: ''
},
langPath: {
type: String
},
minChangeSize: {
type: Number,
default: 5
},
loadStyleMode: {
type: Boolean,
default: true
},
urlType: {
type: String,
default: ''
},
newlineTag: {
type: String,
default: 'p'
},
pasteType: {
type: Number,
default: 2
},
dialogAlignType: {
type: String,
default: 'page'
},
shadowMode: {
type: Boolean,
default: true
},
zIndex: {
type: Number,
default: 811213
},
useContextmenu: {
type: Boolean,
default: true
},
syncType: {
type: String,
default: "default"
default: 'form'
},
indentChar: {
type: String,
default: '\t'
},
cssPath: {
type: [ String, Array ]
},
cssData: {
type: String
},
// body 的样式
bodyClass: {
type: String,
default: "ke-content"
default: 'ke-content'
},
// 其他配置项
...otherConfig
colorTable: {
type: Array
},
data() {
return {
editor: null,
outContent: this.content
};
afterCreate: {
type: Function
},
watch: {
content(val) {
this.editor && val !== this.outContent && this.editor.html(val);
},
// 分发编辑器内容改变事件
outContent(val) {
this.$emit("update:content", val);
this.$emit("on-content-change", val);
this.$emit("input", val);
},
// 初始化编辑器内容
html(val) {
if (
this.html &&
(this.html.startsWith("https://") || this.html.startsWith("http://"))
) {
this.loadUrl(val);
} else {
this.outContent = "";
this.outContent ? this.editor.appendHtml(this.outContent) : "";
}
afterChange: {
type: Function
},
afterTab: {
type: Function
},
afterFocus: {
type: Function
},
afterBlur: {
type: Function
},
afterUpload: {
type: Function
},
uploadJson: {
type: String
},
fileManagerJson: {
type: Function
},
allowPreviewEmoticons: {
type: Boolean,
default: true
},
allowImageUpload: {
type: Boolean,
default: true
},
allowFlashUpload: {
type: Boolean,
default: true
},
allowMediaUpload: {
type: Boolean,
default: true
},
allowFileUpload: {
type: Boolean,
default: true
},
allowFileManager: {
type: Boolean,
default: false
},
fontSizeTable: {
type: Array,
default: function () {
return ['9px', '10px', '12px', '14px', '16px', '18px', '24px', '32px']
}
},
created() {
if (
this.html &&
(this.html.startsWith("https://") || this.html.startsWith("http://"))
) {
this.loadUrl(this.html);
} else {
this.outContent = "";
setTimeout(() => {
this.outContent ? this.editor.appendHtml(this.outContent) : "";
}, 1000);
imageTabIndex: {
type: Number,
default: 0
},
formatUploadUrl: {
type: Boolean,
default: true
},
fullscreenShortcut: {
type: Boolean,
default: false
},
extraFileUploadParams: {
type: Array,
default: function () {
return []
}
},
mounted() {
// 初始访问时创建
this.initEditor();
// 添加焦点
// this.editor.focus();
// 添加点击图片回调函数
this.editor.clickToolbar("image", () => {
// 禁用自带的图片弹窗
this.editor.hideDialog();
// 打开文件
this.handleOpenFile();
});
},
activated() {
// keep-alive 进入时创建
this.initEditor();
},
deactivated() {
// keep-alive 离开时移除
this.removeEditor();
},
beforeDestroy() {
// 实例销毁之前移除
this.removeEditor();
},
methods: {
// 打开文件
handleOpenFile() {
let input = document.getElementById("inputFile");
// 解决同一个文件不能监听的问题
input.addEventListener(
"click",
function() {
this.value = "";
},
false
);
// 点击input
input.click();
},
// 选择好文件
async selectedFile($event) {
const file = $event.target.files[0];
// 把图片上传到后端服务器 拿到url uploadImage 是自己后端上传图片的接口
// 调用appendHtml方法把图片追加到富文本
// const url= await uploadImage (file)
// this.editor.appendHtml(
// `<img style="max-width:100%;" src="https://${data.Location}">`
// );
},
// 编辑器内容上传到cos，调用返回url
async content2Url() {
// 把html片段上传到后端服务器 拿到url uploadHtml 是自己后端上传的接口
// try {
// const res = await uploadHtml(this.outContent)
// return res
// } catch (error) {
// this.$message({
// message: error.data.message,
// type: 'error'
// })
// }
},
// 加载html填充编辑器内容
loadUrl(url) {
if (url && url.length > 0) {
axios.get(url)
.then(response => {
// 处理HTML显示
this.outContent = response.data;
this.editor.appendHtml(this.outContent);
this.$emit("subLoadUrlToHtml", response.data);
})
.catch(() => {
this.outContent = "服务器数据加载失败，请重试!";
this.editor.appendHtml(this.outContent);
});
filePostName: {
type: String,
default: 'imgFile'
},
fillDescAfterUploadImage: {
type: Boolean,
default: false
},
afterSelectFile: {
type: Function
},
pagebreakHtml: {
type: String,
default: '<hr style=”page-break-after: always;” class=”ke-pagebreak” />'
},
allowImageRemote: {
type: Boolean,
default: true
},
autoHeightMode: {
type: Boolean,
default: false
},
fixToolBar: {
type: Boolean,
default: false
},
tabIndex: {
type: Number
}
},
// 移除编辑器实例
removeEditor() {
window.KindEditor.remove(`#${this.id}`);
},
// 初始化编辑器
initEditor() {
this.removeEditor();
this.editor = window.KindEditor.create("#" + this.id, {
width: this.width,
height: this.height,
minWidth: this.minWidth,
minHeight: this.minHeight,
items: this.items,
noDisableItems: this.noDisableItems,
filterMode: this.filterMode,
htmlTags: this.htmlTags,
wellFormatMode: this.wellFormatMode,
resizeType: this.resizeType,
themeType: this.themeType,
langType: this.langType,
designMode: this.designMode,
fullscreenMode: this.fullscreenMode,
basePath: this.basePath,
themesPath: this.themesPath,
pluginsPath: this.pluginsPath,
langPath: this.langPath,
minChangeSize: this.minChangeSize,
loadStyleMode: this.loadStyleMode,
urlType: this.urlType,
newlineTag: this.newlineTag,
pasteType: this.pasteType,
dialogAlignType: this.dialogAlignType,
shadowMode: this.shadowMode,
zIndex: this.zIndex,
useContextmenu: this.useContextmenu,
syncType: this.syncType,
indentChar: this.indentChar,
cssPath: this.cssPath,
cssData: this.cssData,
bodyClass: this.bodyClass,
colorTable: this.colorTable,
afterCreate: this.afterCreate,
// 编辑器内容改变回调
afterChange: () => {
this.editor ? (this.outContent = this.editor.html()) : "";
},
afterTab: this.afterTab,
afterFocus: this.afterFocus,
afterBlur: this.afterBlur,
afterUpload: this.afterUpload,
uploadJson: this.uploadJson,
fileManagerJson: this.fileManagerJson,
allowPreviewEmoticons: this.allowPreviewEmoticons,
allowImageUpload: this.allowImageUpload,
allowFlashUpload: this.allowFlashUpload,
allowMediaUpload: this.allowMediaUpload,
allowFileUpload: this.allowFileUpload,
allowFileManager: this.allowFileManager,
fontSizeTable: this.fontSizeTable,
imageTabIndex: this.imageTabIndex,
formatUploadUrl: this.formatUploadUrl,
fullscreenShortcut: this.fullscreenShortcut,
extraFileUploadParams: this.extraFileUploadParams,
filePostName: this.filePostName,
fillDescAfterUploadImage: this.fillDescAfterUploadImage,
afterSelectFile: this.afterSelectFile,
pagebreakHtml: this.pagebreakHtml,
allowImageRemote: this.allowImageRemote,
autoHeightMode: this.autoHeightMode,
fixToolBar: this.fixToolBar,
tabIndex: this.tabIndex
});
watch: {
content (val) {
this.editor && val !== this.outContent && this.editor.html(val)
},
outContent (val) {
this.$emit('update:content', val)
this.$emit('on-content-change', val)
}
},
mounted () {
var _this = this
_this.editor = window.KindEditor.create('#' + this.id, {
width: _this.width,
height: _this.height,
minWidth: _this.minWidth,
minHeight: _this.minHeight,
items: _this.items,
noDisableItems: _this.noDisableItems,
filterMode: _this.filterMode,
htmlTags: _this.htmlTags,
wellFormatMode: _this.wellFormatMode,
resizeType: _this.resizeType,
themeType: _this.themeType,
langType: _this.langType,
designMode: _this.designMode,
fullscreenMode: _this.fullscreenMode,
basePath: _this.basePath,
themesPath: _this.cssPath,
pluginsPath: _this.pluginsPath,
langPath: _this.langPath,
minChangeSize: _this.minChangeSize,
loadStyleMode: _this.loadStyleMode,
urlType: _this.urlType,
newlineTag: _this.newlineTag,
pasteType: _this.pasteType,
dialogAlignType: _this.dialogAlignType,
shadowMode: _this.shadowMode,
zIndex: _this.zIndex,
useContextmenu: _this.useContextmenu,
syncType: _this.syncType,
indentChar: _this.indentChar,
cssPath: _this.cssPath,
cssData: _this.cssData,
bodyClass: _this.bodyClass,
colorTable: _this.colorTable,
afterCreate: _this.afterCreate,
afterChange: function () {
_this.afterChange
_this.outContent = this.html()
},
afterTab: _this.afterTab,
afterFocus: _this.afterFocus,
afterBlur: _this.afterBlur,
afterUpload: _this.afterUpload,
uploadJson: _this.uploadJson,
fileManagerJson: _this.fileManagerJson,
allowPreviewEmoticons: _this.allowPreviewEmoticons,
allowImageUpload: _this.allowImageUpload,
allowFlashUpload: _this.allowFlashUpload,
allowMediaUpload: _this.allowMediaUpload,
allowFileUpload: _this.allowFileUpload,
allowFileManager: _this.allowFileManager,
fontSizeTable: _this.fontSizeTable,
imageTabIndex: _this.imageTabIndex,
formatUploadUrl: _this.formatUploadUrl,
fullscreenShortcut: _this.fullscreenShortcut,
extraFileUploadParams: _this.extraFileUploadParams,
filePostName: _this.filePostName,
fillDescAfterUploadImage: _this.fillDescAfterUploadImage,
afterSelectFile: _this.afterSelectFile,
pagebreakHtml: _this.pagebreakHtml,
allowImageRemote: _this.allowImageRemote,
autoHeightMode: _this.autoHeightMode,
fixToolBar: _this.fixToolBar,
tabIndex: _this.tabIndex
})
}
};
}
</script>
\ No newline at end of file
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
\ No newline at end of file
src/components/Kindeditor/indexdemo.vue 0 → 100644
View file @ e71f47be
<!--
* @Author: your name
* @Date: 2020-12-03 11:23:35
* @LastEditTime: 2020-12-03 14:15:19
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\components\Kindeditor\index.vue
-->
<template>
<div class="margin-top-20">
<textarea :id="id" name="content" v-model="outContent"></textarea>
<input @change="selectedFile" style="visibility: hidden;height:0;" type="file" name id="inputFile"/>
</div>
</template>
<script>
import axios from 'axios';
import "kindeditor/themes/default/default.css";
import "kindeditor/kindeditor-all-min.js";
import "kindeditor/lang/zh-CN.js";
// 以下四个配置文件见下文
import items from "./config/items";
import htmlTags from "./config/htmlTags";
import fontSizeTable from "./config/fontSizeTable";
import otherConfig from "./config/otherConfig";
export default {
name: "kindeditor-component",
props: {
// 编辑器内容 url
html: {
type: String,
default: ""
},
// 编辑器内容
content: {
type: String,
default: ""
},
// 编辑器id
id: {
type: String,
// required: true,
default: "kindeditor-id"
},
// 宽
width: {
type: String,
default: `100%`
},
// 高
height: {
type: String,
default: "400"
},
// 最小宽
minWidth: {
type: Number,
default: 650
},
// 最小高
minHeight: {
type: Number,
default: 400
},
// toolbar 工具栏配置
items: {
type: Array,
default: function() {
return [...items];
}
},
// 标签配置
htmlTags: {
type: Object,
default: function() {
return { ...htmlTags };
}
},
//字号配置
fontSizeTable: {
type: Array,
default: function() {
return [...fontSizeTable];
}
},
// 语言配置
langType: {
type: String,
default: "zh-CN"
},
// 主题配置
themeType: {
type: String,
default: "default"
},
// body 的样式
bodyClass: {
type: String,
default: "ke-content"
},
// 其他配置项
...otherConfig
},
data() {
return {
editor: null,
outContent: this.content
};
},
watch: {
content(val) {
this.editor && val !== this.outContent && this.editor.html(val);
},
// 分发编辑器内容改变事件
outContent(val) {
this.$emit("update:content", val);
this.$emit("on-content-change", val);
this.$emit("input", val);
},
// 初始化编辑器内容
html(val) {
if (
this.html &&
(this.html.startsWith("https://") || this.html.startsWith("http://"))
) {
this.loadUrl(val);
} else {
this.outContent = "";
this.outContent ? this.editor.appendHtml(this.outContent) : "";
}
}
},
created() {
if (
this.html &&
(this.html.startsWith("https://") || this.html.startsWith("http://"))
) {
this.loadUrl(this.html);
} else {
this.outContent = "";
setTimeout(() => {
this.outContent ? this.editor.appendHtml(this.outContent) : "";
}, 1000);
}
},
mounted() {
// 初始访问时创建
this.initEditor();
// 添加焦点
// this.editor.focus();
// 添加点击图片回调函数
this.editor.clickToolbar("image", () => {
// 禁用自带的图片弹窗
this.editor.hideDialog();
// 打开文件
this.handleOpenFile();
});
},
activated() {
// keep-alive 进入时创建
this.initEditor();
},
deactivated() {
// keep-alive 离开时移除
this.removeEditor();
},
beforeDestroy() {
// 实例销毁之前移除
this.removeEditor();
},
methods: {
// 打开文件
handleOpenFile() {
let input = document.getElementById("inputFile");
// 解决同一个文件不能监听的问题
input.addEventListener(
"click",
function() {
this.value = "";
},
false
);
// 点击input
input.click();
},
// 选择好文件
async selectedFile($event) {
const file = $event.target.files[0];
// 把图片上传到后端服务器 拿到url uploadImage 是自己后端上传图片的接口
// 调用appendHtml方法把图片追加到富文本
// const url= await uploadImage (file)
// this.editor.appendHtml(
// `<img style="max-width:100%;" src="https://${data.Location}">`
// );
},
// 编辑器内容上传到cos，调用返回url
async content2Url() {
// 把html片段上传到后端服务器 拿到url uploadHtml 是自己后端上传的接口
// try {
// const res = await uploadHtml(this.outContent)
// return res
// } catch (error) {
// this.$message({
// message: error.data.message,
// type: 'error'
// })
// }
},
// 加载html填充编辑器内容
loadUrl(url) {
if (url && url.length > 0) {
axios.get(url)
.then(response => {
// 处理HTML显示
this.outContent = response.data;
this.editor.appendHtml(this.outContent);
this.$emit("subLoadUrlToHtml", response.data);
})
.catch(() => {
this.outContent = "服务器数据加载失败，请重试!";
this.editor.appendHtml(this.outContent);
});
}
},
// 移除编辑器实例
removeEditor() {
window.KindEditor.remove(`#${this.id}`);
},
// 初始化编辑器
initEditor() {
this.removeEditor();
this.editor = window.KindEditor.create("#" + this.id, {
width: this.width,
height: this.height,
minWidth: this.minWidth,
minHeight: this.minHeight,
items: this.items,
noDisableItems: this.noDisableItems,
filterMode: this.filterMode,
htmlTags: this.htmlTags,
wellFormatMode: this.wellFormatMode,
resizeType: this.resizeType,
themeType: this.themeType,
langType: this.langType,
designMode: this.designMode,
fullscreenMode: this.fullscreenMode,
basePath: this.basePath,
themesPath: this.themesPath,
pluginsPath: this.pluginsPath,
langPath: this.langPath,
minChangeSize: this.minChangeSize,
loadStyleMode: this.loadStyleMode,
urlType: this.urlType,
newlineTag: this.newlineTag,
pasteType: this.pasteType,
dialogAlignType: this.dialogAlignType,
shadowMode: this.shadowMode,
zIndex: this.zIndex,
useContextmenu: this.useContextmenu,
syncType: this.syncType,
indentChar: this.indentChar,
cssPath: this.cssPath,
cssData: this.cssData,
bodyClass: this.bodyClass,
colorTable: this.colorTable,
afterCreate: this.afterCreate,
// 编辑器内容改变回调
afterChange: () => {
this.editor ? (this.outContent = this.editor.html()) : "";
},
afterTab: this.afterTab,
afterFocus: this.afterFocus,
afterBlur: this.afterBlur,
afterUpload: this.afterUpload,
uploadJson: this.uploadJson,
fileManagerJson: this.fileManagerJson,
allowPreviewEmoticons: this.allowPreviewEmoticons,
allowImageUpload: this.allowImageUpload,
allowFlashUpload: this.allowFlashUpload,
allowMediaUpload: this.allowMediaUpload,
allowFileUpload: this.allowFileUpload,
allowFileManager: this.allowFileManager,
fontSizeTable: this.fontSizeTable,
imageTabIndex: this.imageTabIndex,
formatUploadUrl: this.formatUploadUrl,
fullscreenShortcut: this.fullscreenShortcut,
extraFileUploadParams: this.extraFileUploadParams,
filePostName: this.filePostName,
fillDescAfterUploadImage: this.fillDescAfterUploadImage,
afterSelectFile: this.afterSelectFile,
pagebreakHtml: this.pagebreakHtml,
allowImageRemote: this.allowImageRemote,
autoHeightMode: this.autoHeightMode,
fixToolBar: this.fixToolBar,
tabIndex: this.tabIndex
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
</style>
\ No newline at end of file
src/views/webSiteManagement/aboutUs/index.vue
View file @ e71f47be
<!--
* @Author: your name
* @Date: 2020-12-01 09:07:41
* @LastEditTime: 2020-12-03 15:40:18
* @LastEditTime: 2020-12-04 13:52:59
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud\src\views\webSiteManagement\aboutUs.vue
......@@ -36,7 +36,7 @@
</el-form-item>
<el-form-item label="*公司简介">
<el-col :span="20">
<Kind-editor ref="kindeditor" :html="form.html" @input="getContent"></Kind-editor>
<kind-editor id="editor_id" :content.sync="form.introduce" :afterChange="afterChange()" :loadStyleMode="false"@on-content-change="onContentChange"></kind-editor>
</el-col>
</el-form-item>
<el-form-item>
......@@ -61,7 +61,6 @@ export default {
title: '',
email: '',
address: '',
html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
introduce: ''
}
};
......@@ -70,18 +69,11 @@ export default {
},
methods: {
// 获取编辑器内容
getContent(introduce) {
this.form.introduce = introduce
onContentChange (val) {
console.log(val)
},
// 编辑器内容转换成在线url
async getcontent2Url() {
try {
const htmlUrl = await this.$refs.kindeditor.content2Url()
return htmlUrl
} catch (error) {
console.log(error)
}
afterChange () {
},
onSubmit() {
console.log('submit!');
......
src/views/webSiteManagement/industryApplication/applicationList/addApp/index.vue
View file @ e71f47be
<!--
* @Author: your name
* @Date: 2020-12-04 09:09:37
* @LastEditTime: 2020-12-04 10:47:14
* @LastEditTime: 2020-12-04 13:55:15
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\industryApplication\applicationList\addApp\index.vue
......@@ -78,7 +78,8 @@
</el-radio-group>
</el-form-item>
<el-form-item label="*上传样例">
<el-upload class="upload-demo" action="#" :auto-upload="false" :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove" multiple :limit="100" :on-exceed="handleExceed" :http-request="onUploadRequest" :file-list="form.fileList">
<el-upload class="upload-demo" action="#" :auto-upload="false" :on-preview="handlePreview" :on-remove="handleRemove"
:before-remove="beforeRemove" multiple :limit="100" :on-exceed="handleExceed" :http-request="onUploadRequest" :file-list="form.fileList">
<el-button size="small" type="primary">点击上传</el-button>
<div slot="tip" class="el-upload__tip">只能上传jpg/png文件，且不超过500kb</div>
</el-upload>
......@@ -89,7 +90,7 @@
<div class="title">应用简介</div>
<div class="form">
<el-form-item label="*产品简介">
<Kind-editor ref="kindeditor" :html="form.html" @input="getContent"></Kind-editor>
<kind-editor id="editor_id" :content.sync="form.editorText" :afterChange="afterChange()" :loadStyleMode="false"@on-content-change="onContentChange"></kind-editor>
</el-form-item>
</div>
</div>
......@@ -126,8 +127,7 @@ export default {
isSample: '是',
isCustomized: '是',
fileList: [],
content: '',
html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
editorText: '直接初始化值', // 双向同步的变量
}
}
},
......@@ -138,23 +138,16 @@ export default {
this.$bus.$emit('hideThreeRoute',true)
},
methods: {
onContentChange (val) {
console.log(val)
},
afterChange () {
},
backup(){
this.$parent.componentName='appList'
this.$bus.$emit('hideThreeRoute',true)
},
// 获取编辑器内容
getContent(content) {
this.form.content = content
},
// 编辑器内容转换成在线url
async getcontent2Url() {
try {
const htmlUrl = await this.$refs.kindeditor.content2Url()
return htmlUrl
} catch (error) {
console.log(error)
}
},
// 上传样例
onUploadRequest(data) {
console.log("uploadData=>",data)
......
src/views/webSiteManagement/newsCategory/newsCreator/index.vue
View file @ e71f47be
<!--
* @Author: Jenkins
* @Date: 2020-12-02 14:49:10
* @LastEditTime: 2020-12-03 16:16:11
* @LastEditTime: 2020-12-04 13:53:59
* @LastEditors: Please set LastEditors
* @Description: 创建新闻
* @FilePath: \rs-cloud-platform-ui\src\views\webSiteManagement\newsCategory\newsCreator\index.vue
......@@ -39,7 +39,7 @@
</el-form-item>
<el-form-item label="*资讯详情">
<el-col :span="20">
<Kind-editor ref="kindeditor" :html="form.html" @input="getContent"></Kind-editor>
<kind-editor id="editor_id" :content.sync="form.content" :afterChange="afterChange()" :loadStyleMode="false"@on-content-change="onContentChange"></kind-editor>
</el-col>
</el-form-item>
<el-form-item label="*排序">
......@@ -74,7 +74,6 @@ export default {
region: '',
sort: '',
content: '',
html: 'https://ebusiness-1255313385.cosbj.myqcloud.com/image/20190823/center2019082304054532.html',
},
}
},
......@@ -82,18 +81,11 @@ export default {
},
methods: {
// 获取编辑器内容
getContent(content) {
this.form.content = content
onContentChange (val) {
console.log(val)
},
// 编辑器内容转换成在线url
async getcontent2Url() {
try {
const htmlUrl = await this.$refs.kindeditor.content2Url()
return htmlUrl
} catch (error) {
console.log(error)
}
afterChange () {
},
onPreview(url){
this.form.coverImg = url
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment