Commit 7c4e1244 authored by Mac's avatar Mac

1

parent 897ccdf6
......@@ -605,6 +605,8 @@ div.edui-box {
.edui-default .edui-for-inserttable .edui-icon {
background-position: -580px -20px;
background: url(../images/form.png);
background-size: 100% 100%;
}
.edui-default .edui-for-autotypeset .edui-icon {
......@@ -656,6 +658,8 @@ div.edui-box {
.edui-default .edui-for-link .edui-icon {
/*background-position: -500px 0;*/
background-position: -65px -121px;
background: url(../images/Hyperlinks.png);
background-size: 100% 100%;
}
.edui-default .edui-for-code .edui-icon {
......@@ -758,6 +762,8 @@ div.edui-box {
.edui-default .edui-for-unlink .edui-icon {
/*background-position: -640px 0;*/
background-position: -95px -120px;
background: url(../images/Unlink.png);
background-size: 100% 100%;
}
.edui-default .edui-for-touppercase .edui-icon {
......@@ -1733,6 +1739,8 @@ div.edui-box {
/*鍘婚櫎浜嗚〃鎯呯殑涓嬫媺绠ご*/
.edui-default .edui-for-emotion .edui-icon {
background-position: -60px -20px;
background: url(../images/expression.png);
background-size: 100% 100%;
}
.edui-default .edui-for-emotion .edui-popup-content iframe
{
......
......@@ -45,7 +45,9 @@
'bold', 'italic', 'underline',
'forecolor',//字体颜色
'justifyleft', 'justifycenter', 'justifyright',
'self-image','self-attachment','self-video'
'self-image','self-attachment','self-video',
'emotion',
'inserttable',
//'music'
//'attachment', //附件
// 'source', '|',
......@@ -59,7 +61,7 @@
//'customstyle', 'paragraph',
//'directionalityltr', 'directionalityrtl', 'indent', '|',
//'touppercase', 'tolowercase', '|',
// 'link', 'unlink',
'link', 'unlink',
//'anchor', '|',
//'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
//'simpleupload',
......@@ -67,7 +69,7 @@
//'insertvideo',
//'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
//'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|',
//'inserttable', 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
// 'deletetable', 'insertparagraphbeforetable', 'insertrow', 'deleterow', 'insertcol', 'deletecol', 'mergecells', 'mergeright', 'mergedown', 'splittocells', 'splittorows', 'splittocols', 'charts', '|',
//'print', 'preview', 'searchreplace', 'drafts', 'help'
]]
//当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准
......@@ -444,7 +446,11 @@
tt: [],
u: [],
ul: ['class', 'style'],
video: ['autoplay', 'controls', 'loop', 'preload', 'src', 'height', 'width', 'class', 'style']
video: ['autoplay', 'controls', 'loop', 'preload', 'src', 'height', 'width', 'class', 'style'],
source: ['src', 'type'],
embed: ['type', 'class', 'pluginspage', 'src', 'width', 'height', 'align', 'style', 'wmode', 'play',
+ 'autoplay','loop', 'menu', 'allowscriptaccess', 'allowfullscreen', 'controls', 'preload'],
iframe: ['src', 'class', 'height', 'width', 'max-width', 'max-height', 'align', 'frameborder', 'allowfullscreen']
}
};
......
......@@ -24,6 +24,7 @@
border-radius: 9px;
padding: 15px;
margin-right: 30px;
height: auto;
}
.appmsg_account {
......@@ -87,15 +88,18 @@
</q-list>
</q-btn-dropdown>
<q-btn push label="视频" @click="getavideo"/>
<q-btn push label="音频" />
<q-btn push label="超链接" />
<q-btn push label="音频" @click="getaudio"/>
<q-btn push label="超链接" @click="hyperlinks"/>
<q-btn push label="小程序" />
</q-btn-group>
</div>
<q-input clearable standout="bg-primary text-white" v-model="Name" label="标题" maxlength="64" />
<q-input clearable standout="bg-primary text-white" v-model="Name" label="标题" maxlength="64" style="margin-top: 20px;"/>
<q-input clearable standout="bg-primary text-white" v-model="author" label="作者" maxlength="8"
style="margin-top: 20px;" />
<div style="margin-top: 20px;">
<contributionUE :config="config" ref="UE_cb"></contributionUE>
</div>
</div>
......@@ -137,17 +141,31 @@
},
getavideo(){
let datas= {"title":"测试视频文件","description":"","down_url":"http:\/\/203.205.137.159\/vweixinp.tc.qq.com\/1007_07ec2b9f113343d1985494ee31688230.f10.mp4?vkey=526C5946588325C4891A7B7233587BF890ED42DF7CE4A9EB82BBC62938B42CA9F8130A70CC44823A0EDFF57397FEDD256F881D2C7271D83DEE8C880DFEE72892FF1B5171EAA20502369AECC8201160A37CFE16A9D855F34F&sha=0&save=1","newcat":"","newsubcat":"","tags":[],"cover_url":"","vid":"1007_07ec2b9f113343d1985494ee31688230"}
let datas= {"title":"测试视频文件","description":"","down_url":"http:\/\/203.205.136.113\/vweixinp.tc.qq.com\/1007_07ec2b9f113343d1985494ee31688230.f10.mp4?vkey=BFF307E7918FE7E2F5F05186CCF66BE375D1AF3ECD6BB02829646BFEFAD1386EDBDA72CAA1756CF47FD935F6944B9E745DC42BCE97E08B0FB8F0604F23258B28A2196CBF8AF10C356ADDB023820898B88B8219D607378B16&sha=0&save=1","newcat":"","newsubcat":"","tags":[],"cover_url":"","vid":"1007_07ec2b9f113343d1985494ee31688230"}
let url = datas.down_url
console.log(url,'1111111')
// url='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/EduSystem/Test/Upload/wechatcatalogue/1629369734000_377.mp4'
url='https://v.qq.com/txp/iframe/player.html?vid=c0870mnzyms'
console.log(url,'url')
url='https://vt-im-bucket.oss-cn-chengdu.aliyuncs.com/EduSystem/Test/Upload/wechatcatalogue/1628560736000_500.mp4'
let data = [{
fileName:datas.title,
fileUrl: url
}]
this.$refs.UE_cb.attachmentSelected2(data)
this.$refs.UE_cb.insertVideo(data)
},
getaudio(){
let url="http://192.168.20.214:8130/EduSystem/Test/Upload/wechatcatalogue/202110180631201650000000015.mp3" //音频
let data = [{
fileName:'测试哈',
fileUrl: url
}]
this.$refs.UE_cb.insertaudio(data)
},
hyperlinks(){
// <a target="_blank" href="http://mp.weixin.qq.com/s?__biz=MzU3OTUwMjg4OQ==&amp;mid=2247489291&amp;idx=1&amp;sn=3c31ecd91398b9ba04baf03451add5bd&amp;chksm=fd64414dca13c85b2e42aa6e8ec071538dccf54edd7d6580fd7f9cfeef67823ce3f6f33e9dd3#rd" data-itemshowtype="0" tab="innerlink">散步看日本「会津若松」</a>
let data = [{
fileName:'散步看日本「会津若松」',
fileUrl: "http://mp.weixin.qq.com/s?__biz=MzU3OTUwMjg4OQ==&amp;mid=2247489291&amp;idx=1&amp;sn=3c31ecd91398b9ba04baf03451add5bd&amp;chksm=fd64414dca13c85b2e42aa6e8ec071538dccf54edd7d6580fd7f9cfeef67823ce3f6f33e9dd3#rd"
}]
this.$refs.UE_cb.hyperlinks(data)
}
}
}
......
<template>
<div class="graphicType">
<section class="wx-edui-media-wrp custom_select_card_wrp">
<section class="js_editor_audio audio_iframe res_iframe js_uneditable custom_select_card"
src="/cgi-bin/readtemplate?t=tmpl/audio_tmpl&amp;name=202110180631201650000000015.mp3&amp;play_length=00:03"
isaac2="1" low_size="5.57" source_size="5.6" high_size="23.73" name="202110180631201650000000015.mp3"
play_length="3000" voice_encode_fileid="MzU3OTUwMjg4OV8xMDAwMDU2OTM=" data-topic_id=""
data-topic_name="" data-pluginname="insertaudio" contenteditable="false">
<!-- 图文类型的音频卡片 -->
<section class="appmsg_card_context appmsg_card_active audio_card js_audio_card">
<strong class="audio_card_title">202110180631201650000000015.mp3</strong>
<span class="weui-flex"><span class="weui-flex__item"><span class="audio_card_opr">
<span class="audio_card_progress_wrp"><span class="audio_card_progress"><span
class="audio_card_progress_inner"></span></span></span></span>
<span class="audio_card_tips" aria-labelledby="时长"><em
class="audio_card_length_current">00:00</em>
<em class="audio_card_length_total">00:03</em>
</span></span><span aria-labelledby="播放开关" class="audio_card_switch"><em
class="weui-audio-btn" role="button"></em></span></span><span
class="audio_album_null js_no_album">未加入话题</span><span class="audio_album_null js_album_name"
style="display: none;"></span><span class="audio_action js_audio_action"
style="display: none;"><span class="audio_action_item js_replace_album"
style="display: none;"><em class="audio_action_icon_switch"></em>修改话题</span><span
class="audio_action_item js_add_album"><em
class="audio_action_icon_add"></em>添加话题</span></span>
</section>
</section>
</section>
</div>
</template>
<script>
export default {
data() {
return {
ViewDomain: '',
}
},
created() {
console.log(this.$route.query)
},
}
</script>
<style scoped>
@import './ue/iframestyle.css';
</style>
\ No newline at end of file
<style>
</style>
<template id="app-rich-text">
<div class="app-rich-text">
<textarea style="width: 100%" :id="id"></textarea>
</div>
</template>
<script>
// import appAttachment from '../attachment/app-attachment'
// import appAttachment from '../attachment/app-attachment'
export default {
props: {
value: null,
......@@ -59,7 +57,7 @@
isInputChange: false,
uploadType: "1", //1-上传图片,2-上传附件,3-上传音频
//默认图片域名
defaultImgDomain: "https://imgfile.oytour.com/static/",
defaultImgDomain: "",
ViewDomain: "",
};
},
......@@ -80,7 +78,7 @@
}, 100);
return;
}
("监听到变化",newVal)
("监听到变化", newVal)
this.ue.setContent(newVal);
} else {
this.tempContent = newVal;
......@@ -99,84 +97,56 @@
focus() {
this.ue.focus(true)
},
//关闭上传文件弹窗
attachmentClosed() {
this.attachmentDialogVisible = false;
},
//选择文件弹窗
attachmentSelected(fileArray) {
insertVideo(fileArray) {//插入视频
if (fileArray && fileArray.length) {
let html = '';
//图片
if (this.uploadType == 1) {
//s视频
fileArray.forEach(item => {
html += '<img src="' + item.fileUrl + '" style="max-width: 100%;">';
html += '<p style="text-align:center"><iframe frameborder="0" src="' + item.fileUrl + '" allowFullScreen="true" align="center" height="280" width="420"></iframe></p>';
})
console.log(html)
if (html && html != '') {
// html.setAttr('style','display:block;margin:0 auto;');
this.ue.execCommand('inserthtml', html);
}
//附件
else {
fileArray.forEach(item => {
var obj = this.getIcon(item.fileName);
if (obj.fileType == 4) {
html += this.audioIframeStr(item);
console.log(this.audioIframeStr(item))
} else {
html += this.getIconContent(item);
}
// else if (obj.fileType == 1 || obj.fileType == 2 || obj.fileType == 3) {
// html += this.fileIframeList(item, obj.fileType);
// }
},
insertaudio(fileArray) {//插入音频
if (fileArray && fileArray.length) {
let html = '';
//音频
fileArray.forEach(item => {
// html += '<p style="text-align:center"><iframe frameborder="0" src="' + item.fileUrl + '" allowFullScreen="true" align="center"></iframe></p>';
html += '<p><iframe height="auto" width="100%" frameborder="0" allowtransparency="true" ' +
' style="background-color:transparent;border-radius: 3px;overflow: hidden;z-index: 0;" scrolling="no" ' +
' src="http://localhost:8181/#/teacher/contribution/graphicType?fileName=' + item.fileName + '&url=' + item.fileUrl + '&fileType=3' +
'" class="ans-insertaudio-module" module="_insertaudio">' + ' </iframe></p>';;
})
}
console.log(html)
if (html && html != '') {
this.ue.execCommand('inserthtml', html);
}
}
this.attachmentDialogVisible = false;
},
attachmentSelected2(fileArray){
hyperlinks(fileArray) {
if (fileArray && fileArray.length) {
let html = '';
//s视
//
fileArray.forEach(item => {
html += '<p style="text-align:center"><iframe frameborder="0" src="' + item.fileUrl + '" allowFullScreen="true" align="center" height="280" width="420"></iframe></p>';
// html += '<p><iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=c0870mnzyms" allowFullScreen="true"></iframe></p>';
// html+= '<video' +
// ' src="' + item.fileUrl + '"' +
// ' width="' + 420 + '"' +
// ' height="' + 280 + '"' +
// ' autoplay' +
// ' controls="controls">'
// '</video>';
html += `<p><a target="_self" href="${item.fileUrl}" data-itemshowtype="0" tab="innerlink" style='text-decoration:none;color: #576b95;' _href="${item.fileUrl}">${item.fileName}</a></p>`;
})
console.log(html)
if (html && html != '') {
// html.setAttr('style','display:block;margin:0 auto;');
this.ue.execCommand('inserthtml', html);
}
}
},
//获取图标配置内容
getIconContent(item) {
var iconObj = this.getIcon(item.fileName);
var fileUrl = encodeURIComponent(item.fileUrl);
let dataUrl =
`${this.ViewDomain + '/read.html?fileName=' + item.fileName + '&url=' + fileUrl + '&fileType=' + iconObj.fileType}`;
var linkAttr = "";
if (iconObj.fileType == 1 || iconObj.fileType == 2 || iconObj.fileType == 3) {
linkAttr = ` class='attachNew' accessKey='${dataUrl}'`;
}
var str=
`<p ${linkAttr}>`+
`<span ${linkAttr} contenteditable="false" style="display:inline-block;margin-top:10px;background: #F7F8FA;padding: 14px 16px;min-width: 572px;overflow: hidden;cursor:pointer;-webkit-box-align: center;text-align:left;cursor:pointer;" name="${iconObj.dataType}" data="${item.fileName}">`+
`<img ${linkAttr} src="${iconObj.iconUrl}" style="width:42px; height:42px; overflow:hidden; margin-right:14px;border-radius:4px;float:left;">`+
`<span ${linkAttr} style="font-size:14px; color:#181E33; line-height:20px; display:block; overflow:hidden; text-overflow:ellipsis;margin-top:15px;">${item.fileName}</span>`+
`</span>`+
`</p>`;
return str;
},
//获取文件图标和类型
getIcon(fileName) {
var obj = {
......@@ -190,7 +160,7 @@
return obj;
}
var index = fileName.lastIndexOf('.');
var type = fileName.substr(index+1);
var type = fileName.substr(index + 1);
type = type.toLowerCase();
obj.dataType = type;
if (type === 'video' || type === 'svideo') {
......@@ -227,71 +197,11 @@
return obj;
},
//音频[MP3]
audioIframeStr(data) {
var fileUrl = encodeURIComponent(data.fileUrl);
return '<p><iframe height="62px" width="auto" frameborder="0" allowtransparency="true" ' +
' style="background-color:transparent;border-radius: 3px;overflow: hidden;z-index: 0;margin-top:20px" scrolling="no" ' +
' src="' + this.ViewDomain + '/index.html?fileName=' + data.fileName + '&url=' + fileUrl +
'" class="ans-insertaudio-module" module="_insertaudio">' + ' </iframe></p>';
},
//视频、PDF、WORD、PPT、EXCEL
fileIframeList(data, fileType) {
//视频1 音频 2 ppt/word 3
var fileUrl = encodeURIComponent(data.fileUrl);
return '<p><iframe height="62px" width="auto" frameborder="0" allowtransparency="true" ' +
' style="background-color:transparent;border-radius: 3px;overflow: hidden;z-index: 0;" scrolling="no" ' +
' src="' + this.ViewDomain + '/read.html?fileName=' + data.fileName + '&url=' + fileUrl + '&fileType=' +
fileType +
'" class="ans-insertaudio-module" module="_insertaudio">' + ' </iframe></p>';
},
reloadNewValue(){
this.isInputChange=false
},
loadUe() {
const _this = this;
//上传附件
if (_this.isShowInsertImage) {
UE.registerUI('self-image', (editor, uiName) => {
return new UE.ui.Button({
name: uiName,
title: _this.labelIcon,
onclick() {
_this.ue = editor
_this.uploadType = "1"
_this.attachmentDialogVisible = true;
},
});
});
}
//上传附件
if (_this.isShowAttachment) {
UE.registerUI('self-attachment', (editor, uiName) => {
return new UE.ui.Button({
name: uiName,
title: "附件",
onclick() {
_this.ue = editor
_this.uploadType = "2"
_this.attachmentDialogVisible = true;
},
});
});
}
//是否显示音频
if (_this.isShowVoice) {
UE.registerUI('self-video', (editor, uiName) => {
return new UE.ui.Button({
name: uiName,
title: "音频",
onclick() {
_this.ue = editor
_this.uploadType = "3"
_this.attachmentDialogVisible = true;
},
});
});
}
this.ue = UE.getEditor(this.id, this.config);
this.ue.addListener('ready', editor => {
......@@ -309,7 +219,7 @@
this.isInputChange = true;
this.$emit('input', this.ue.getContent());
});
this.ue.addListener('contentChange', (editor,e) => {
this.ue.addListener('contentChange', (editor, e) => {
this.isInputChange = true;
this.$emit('input', this.ue.getContent());
});
......@@ -320,10 +230,10 @@
this.ue.addListener('focus', editor => {
this.$emit('focus');
});
this.ue.addListener('selectionchange',editor=>{
this.ue.addListener('selectionchange', editor => {
// console.log(this.ue.selection.getStart() )
})
this.ue.addListener('click',(editor,a)=>{
this.ue.addListener('click', (editor, a) => {
// console.log(editor,a)
// console.log(this.ue.getContent())
......@@ -333,3 +243,5 @@
}
</script>
<style scoped>
</style>
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -1234,6 +1234,8 @@ const routes = [{
import("pages/teacher/contribution/addimageText")
},
{
path: "/stuMan/activeList",//学管 活动列表
component: () =>
......@@ -1440,6 +1442,11 @@ const routes = [{
component: () =>
import("pages/course/chapterEditor.vue")
},
{
path: "/teacher/contribution/graphicType",//投稿设置 新增修改图文
component: () =>
import("pages/teacher/contribution/graphicType")
},
{
path: "*",
component: () =>
......
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