Commit 7c4e1244 authored by Mac's avatar Mac

1

parent 897ccdf6
...@@ -605,6 +605,8 @@ div.edui-box { ...@@ -605,6 +605,8 @@ div.edui-box {
.edui-default .edui-for-inserttable .edui-icon { .edui-default .edui-for-inserttable .edui-icon {
background-position: -580px -20px; background-position: -580px -20px;
background: url(../images/form.png);
background-size: 100% 100%;
} }
.edui-default .edui-for-autotypeset .edui-icon { .edui-default .edui-for-autotypeset .edui-icon {
...@@ -656,6 +658,8 @@ div.edui-box { ...@@ -656,6 +658,8 @@ div.edui-box {
.edui-default .edui-for-link .edui-icon { .edui-default .edui-for-link .edui-icon {
/*background-position: -500px 0;*/ /*background-position: -500px 0;*/
background-position: -65px -121px; background-position: -65px -121px;
background: url(../images/Hyperlinks.png);
background-size: 100% 100%;
} }
.edui-default .edui-for-code .edui-icon { .edui-default .edui-for-code .edui-icon {
...@@ -758,6 +762,8 @@ div.edui-box { ...@@ -758,6 +762,8 @@ div.edui-box {
.edui-default .edui-for-unlink .edui-icon { .edui-default .edui-for-unlink .edui-icon {
/*background-position: -640px 0;*/ /*background-position: -640px 0;*/
background-position: -95px -120px; background-position: -95px -120px;
background: url(../images/Unlink.png);
background-size: 100% 100%;
} }
.edui-default .edui-for-touppercase .edui-icon { .edui-default .edui-for-touppercase .edui-icon {
...@@ -1733,6 +1739,8 @@ div.edui-box { ...@@ -1733,6 +1739,8 @@ div.edui-box {
/*鍘婚櫎浜嗚〃鎯呯殑涓嬫媺绠ご*/ /*鍘婚櫎浜嗚〃鎯呯殑涓嬫媺绠ご*/
.edui-default .edui-for-emotion .edui-icon { .edui-default .edui-for-emotion .edui-icon {
background-position: -60px -20px; background-position: -60px -20px;
background: url(../images/expression.png);
background-size: 100% 100%;
} }
.edui-default .edui-for-emotion .edui-popup-content iframe .edui-default .edui-for-emotion .edui-popup-content iframe
{ {
......
...@@ -45,7 +45,9 @@ ...@@ -45,7 +45,9 @@
'bold', 'italic', 'underline', 'bold', 'italic', 'underline',
'forecolor',//字体颜色 'forecolor',//字体颜色
'justifyleft', 'justifycenter', 'justifyright', 'justifyleft', 'justifycenter', 'justifyright',
'self-image','self-attachment','self-video' 'self-image','self-attachment','self-video',
'emotion',
'inserttable',
//'music' //'music'
//'attachment', //附件 //'attachment', //附件
// 'source', '|', // 'source', '|',
...@@ -59,7 +61,7 @@ ...@@ -59,7 +61,7 @@
//'customstyle', 'paragraph', //'customstyle', 'paragraph',
//'directionalityltr', 'directionalityrtl', 'indent', '|', //'directionalityltr', 'directionalityrtl', 'indent', '|',
//'touppercase', 'tolowercase', '|', //'touppercase', 'tolowercase', '|',
// 'link', 'unlink', 'link', 'unlink',
//'anchor', '|', //'anchor', '|',
//'imagenone', 'imageleft', 'imageright', 'imagecenter', '|', //'imagenone', 'imageleft', 'imageright', 'imagecenter', '|',
//'simpleupload', //'simpleupload',
...@@ -67,7 +69,7 @@ ...@@ -67,7 +69,7 @@
//'insertvideo', //'insertvideo',
//'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|', //'emotion', 'scrawl', 'insertvideo', 'music', 'attachment', 'map', 'gmap', 'insertframe', 'insertcode', 'webapp', 'pagebreak', 'template', 'background', '|',
//'horizontal', 'date', 'time', 'spechars', 'snapscreen', 'wordimage', '|', //'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' //'print', 'preview', 'searchreplace', 'drafts', 'help'
]] ]]
//当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准 //当鼠标放在工具栏上时显示的tooltip提示,留空支持自动多语言配置,否则以配置值为准
...@@ -444,7 +446,11 @@ ...@@ -444,7 +446,11 @@
tt: [], tt: [],
u: [], u: [],
ul: ['class', 'style'], 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 @@ ...@@ -24,6 +24,7 @@
border-radius: 9px; border-radius: 9px;
padding: 15px; padding: 15px;
margin-right: 30px; margin-right: 30px;
height: auto;
} }
.appmsg_account { .appmsg_account {
...@@ -87,15 +88,18 @@ ...@@ -87,15 +88,18 @@
</q-list> </q-list>
</q-btn-dropdown> </q-btn-dropdown>
<q-btn push label="视频" @click="getavideo"/> <q-btn push label="视频" @click="getavideo"/>
<q-btn push label="音频" /> <q-btn push label="音频" @click="getaudio"/>
<q-btn push label="超链接" /> <q-btn push label="超链接" @click="hyperlinks"/>
<q-btn push label="小程序" /> <q-btn push label="小程序" />
</q-btn-group> </q-btn-group>
</div> </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" <q-input clearable standout="bg-primary text-white" v-model="author" label="作者" maxlength="8"
style="margin-top: 20px;" /> style="margin-top: 20px;" />
<div style="margin-top: 20px;">
<contributionUE :config="config" ref="UE_cb"></contributionUE> <contributionUE :config="config" ref="UE_cb"></contributionUE>
</div>
</div> </div>
...@@ -137,17 +141,31 @@ ...@@ -137,17 +141,31 @@
}, },
getavideo(){ 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 let url = datas.down_url
console.log(url,'1111111') console.log(url,'url')
// url='https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/EduSystem/Test/Upload/wechatcatalogue/1629369734000_377.mp4' url='https://vt-im-bucket.oss-cn-chengdu.aliyuncs.com/EduSystem/Test/Upload/wechatcatalogue/1628560736000_500.mp4'
url='https://v.qq.com/txp/iframe/player.html?vid=c0870mnzyms'
let data = [{ let data = [{
fileName:datas.title, fileName:datas.title,
fileUrl: url 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"> <template id="app-rich-text">
<div class="app-rich-text"> <div class="app-rich-text">
<textarea style="width: 100%" :id="id"></textarea> <textarea style="width: 100%" :id="id"></textarea>
</div> </div>
</template> </template>
<script> <script>
// import appAttachment from '../attachment/app-attachment' // import appAttachment from '../attachment/app-attachment'
export default { export default {
props: { props: {
value: null, value: null,
...@@ -59,7 +57,7 @@ ...@@ -59,7 +57,7 @@
isInputChange: false, isInputChange: false,
uploadType: "1", //1-上传图片,2-上传附件,3-上传音频 uploadType: "1", //1-上传图片,2-上传附件,3-上传音频
//默认图片域名 //默认图片域名
defaultImgDomain: "https://imgfile.oytour.com/static/", defaultImgDomain: "",
ViewDomain: "", ViewDomain: "",
}; };
}, },
...@@ -80,7 +78,7 @@ ...@@ -80,7 +78,7 @@
}, 100); }, 100);
return; return;
} }
("监听到变化",newVal) ("监听到变化", newVal)
this.ue.setContent(newVal); this.ue.setContent(newVal);
} else { } else {
this.tempContent = newVal; this.tempContent = newVal;
...@@ -99,84 +97,56 @@ ...@@ -99,84 +97,56 @@
focus() { focus() {
this.ue.focus(true) this.ue.focus(true)
}, },
//关闭上传文件弹窗 insertVideo(fileArray) {//插入视频
attachmentClosed() {
this.attachmentDialogVisible = false;
},
//选择文件弹窗
attachmentSelected(fileArray) {
if (fileArray && fileArray.length) { if (fileArray && fileArray.length) {
let html = ''; let html = '';
//图片 //s视频
if (this.uploadType == 1) {
fileArray.forEach(item => { 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 != '') { if (html && html != '') {
this.ue.execCommand('inserthtml', html); this.ue.execCommand('inserthtml', html);
} }
} }
this.attachmentDialogVisible = false;
}, },
attachmentSelected2(fileArray){ hyperlinks(fileArray) {
if (fileArray && fileArray.length) { if (fileArray && fileArray.length) {
let html = ''; let html = '';
//s视 //
fileArray.forEach(item => { 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><a target="_self" href="${item.fileUrl}" data-itemshowtype="0" tab="innerlink" style='text-decoration:none;color: #576b95;' _href="${item.fileUrl}">${item.fileName}</a></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>';
}) })
console.log(html) console.log(html)
if (html && html != '') { if (html && html != '') {
// html.setAttr('style','display:block;margin:0 auto;'); // html.setAttr('style','display:block;margin:0 auto;');
this.ue.execCommand('inserthtml', html); 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) { getIcon(fileName) {
var obj = { var obj = {
...@@ -190,7 +160,7 @@ ...@@ -190,7 +160,7 @@
return obj; return obj;
} }
var index = fileName.lastIndexOf('.'); var index = fileName.lastIndexOf('.');
var type = fileName.substr(index+1); var type = fileName.substr(index + 1);
type = type.toLowerCase(); type = type.toLowerCase();
obj.dataType = type; obj.dataType = type;
if (type === 'video' || type === 'svideo') { if (type === 'video' || type === 'svideo') {
...@@ -227,71 +197,11 @@ ...@@ -227,71 +197,11 @@
return obj; 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() { loadUe() {
const _this = this; 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 = UE.getEditor(this.id, this.config);
this.ue.addListener('ready', editor => { this.ue.addListener('ready', editor => {
...@@ -309,7 +219,7 @@ ...@@ -309,7 +219,7 @@
this.isInputChange = true; this.isInputChange = true;
this.$emit('input', this.ue.getContent()); this.$emit('input', this.ue.getContent());
}); });
this.ue.addListener('contentChange', (editor,e) => { this.ue.addListener('contentChange', (editor, e) => {
this.isInputChange = true; this.isInputChange = true;
this.$emit('input', this.ue.getContent()); this.$emit('input', this.ue.getContent());
}); });
...@@ -320,10 +230,10 @@ ...@@ -320,10 +230,10 @@
this.ue.addListener('focus', editor => { this.ue.addListener('focus', editor => {
this.$emit('focus'); this.$emit('focus');
}); });
this.ue.addListener('selectionchange',editor=>{ this.ue.addListener('selectionchange', editor => {
// console.log(this.ue.selection.getStart() ) // console.log(this.ue.selection.getStart() )
}) })
this.ue.addListener('click',(editor,a)=>{ this.ue.addListener('click', (editor, a) => {
// console.log(editor,a) // console.log(editor,a)
// console.log(this.ue.getContent()) // console.log(this.ue.getContent())
...@@ -333,3 +243,5 @@ ...@@ -333,3 +243,5 @@
} }
</script> </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 = [{ ...@@ -1234,6 +1234,8 @@ const routes = [{
import("pages/teacher/contribution/addimageText") import("pages/teacher/contribution/addimageText")
}, },
{ {
path: "/stuMan/activeList",//学管 活动列表 path: "/stuMan/activeList",//学管 活动列表
component: () => component: () =>
...@@ -1440,6 +1442,11 @@ const routes = [{ ...@@ -1440,6 +1442,11 @@ const routes = [{
component: () => component: () =>
import("pages/course/chapterEditor.vue") import("pages/course/chapterEditor.vue")
}, },
{
path: "/teacher/contribution/graphicType",//投稿设置 新增修改图文
component: () =>
import("pages/teacher/contribution/graphicType")
},
{ {
path: "*", path: "*",
component: () => 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