Commit b7510301 authored by Mac's avatar Mac

1

parent f6db8716
......@@ -26,8 +26,8 @@
</div>
<div v-if='msg.type==3'>
<q-input clearable standout="bg-primary text-white" v-model="msg.title" @input="$forceUpdate()" maxlength="35" counter
label="卡片标题" style="margin-top: 20px;" />
<q-input clearable standout="bg-primary text-white" v-model="msg.title" @input="$forceUpdate()"
maxlength="35" counter label="卡片标题" style="margin-top: 20px;" />
<div style="margin-top: 20px;display: flex;align-items: flex-start" v-if="msg.appletmsg">
<div style="margin-right: 15px;">卡片样式</div>
<div
......@@ -41,18 +41,20 @@
style="width: auto;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;font-weight: 400;">{{msg.appletmsg.Name}}</span>
</div>
<span>{{msg.title}}</span>
<div style="width: 240px;height: 180px;border: 1px dashed #E3E4E5;display: flex;align-items: center;justify-content: center;background: #FFF;margin-top: 10px;"
<div style="width: 240px;height: 180px;border: 1px dashed #E3E4E5;display: flex;flex-direction: column;align-items: center;justify-content: center;background: #FFF;margin-top: 10px;"
v-if="msg.imgUrl==''">
<p style="padding: 0 10px;text-align: center;">建议图片尺寸为5:4,大小不超过10M,暂不支持动图。</p>
<q-btn class="q-mr-md" label="从图库选择" @click="getChoice()" />
</div>
<div style="width: 240px;height: 180px;margin-top: 10px;" v-if="msg.imgUrl!=''" @click="getChoice()">
<div style="width: 240px;height: 180px;margin-top: 10px;" v-if="msg.imgUrl!=''"
@click="getChoice()">
<el-image v-if="msg.imgUrl" style="width: 100%;height: 100%;" :src="msg.imgUrl"
fit="cover"></el-image>
</div>
</div>
<div class="weapp_card_ft">
<span class="weapp_card_logo"><img
src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAcCAMAAABF0y+mAAAAb1BMVEUAAAB4it11h9x2h9x2h9x2htx8j+R8i+B1h9x2h9x3h92Snv91htt2h9x1h9x4h9x1h9x1h9x2idx1h9t2h9t1htt1h9x1h9x1htx2h9x1h912h9x4h913iN17juOOjuN1iNx2h9t4h958i+B1htvejBiPAAAAJHRSTlMALPLcxKcVEOXXUgXtspU498sx69DPu5+Yc2JeRDwbCYuIRiGBtoolAAAA3ElEQVQoz62S1xKDIBBFWYiFYImm2DWF///G7DJEROOb58U79zi4O8iOo8zuCRfV8EdFgbYE49qFQs8ksJInajOA1wWfYvLcGSueU/oUGBtPpti09uNS68KTMcrQ5jce4kmN/HKn9XVPAo702JEdx9hTUrWUqVrI3KwUmM1NhIWMKdwiGvpGMWZOAj1PZuzAxHwhVSplrajoseBnbyDHAwvrtvKKhdqTtFBkL8wO5ijcsS3G1JMNvQ5mdW7fc0x0+ZcnlJlZiflAomdEyFaM7qeK2JahEjy5ZyU7jC/q/Rz/DgqEuAAAAABJRU5ErkJggg=="
src="../../../assets/images/applettb.png"
alt="" class="icon_weapp_logo_mini"> 小程序</span>
</div>
</div>
......@@ -104,7 +106,7 @@
},
AppletList: [],
getImgChoice: false,
ChooseImgtype:0
ChooseImgtype: 0
}
},
created() {
......@@ -147,9 +149,36 @@
this.getImgChoice = true;
},
SelectId(obj) {
this.msg.imgUrl = obj[0].ImageUrl
console.log(this.msg.imgUrl )
this.getImgChoice = false;
this.getNaturalImgSize(obj[0].ImageUrl, k => {//获取图片比例
let qualified = k.qualified
this.msg.imgUrl = obj[0].ImageUrl;
this.getImgChoice = false;
if (qualified == true) {
this.msg.imgUrl = obj[0].ImageUrl;
this.getImgChoice = false;
} else {
this.$q.notify({
type: 'negative',
message: `请上传图片尺寸为5:4,`,
position: 'top'
})
}
})
},
getNaturalImgSize(img_url, callback) {
img_url = img_url + Date.parse(new Date())
var img = new Image();
img.src = img_url;
img.onload = function () {
// 打印
let qualified = false
if (Number(img.height) / img.width == 0.8) {
qualified = true
}
callback({ qualified: qualified })
};
},
getroute(e) {//选择了小程序 路径赋值
this.AppletList.forEach(x => {
......@@ -180,21 +209,24 @@
background: #fff;
width: 520px;
}
.ChooseApplet .weapp_card_ft {
padding: 0 15px;
border-top: 1px solid #E3E4E5;
line-height: 24px;
margin-top: 10px;
}
.ChooseApplet .weapp_card_logo {
color: #7E8081;
font-size: 14px;
}
.ChooseApplet .icon_weapp_logo_mini {
width: 14px;
height: 14px;
vertical-align: middle;
margin-right: .2em;
margin-top: -0.2em;
}
color: #7E8081;
font-size: 14px;
}
.ChooseApplet .icon_weapp_logo_mini {
width: 14px;
height: 14px;
vertical-align: middle;
margin-right: .2em;
margin-top: -0.2em;
}
</style>
\ No newline at end of file
......@@ -271,7 +271,6 @@
}
},
mounted() {
},
methods: {
getdetails() {
......@@ -393,6 +392,8 @@
this.addMsg.ImageList.push(obj)
})
}
// let a = JSON.stringify(this.addMsg.Content)
// console.log(a)
setContributeInfo(this.addMsg).then(res => {
this.loading = false
......@@ -404,7 +405,7 @@
message: res.Message,
position: 'top'
})
this.goblck()
// this.goblck()
}
}).catch(() => {
this.loading = false
......
<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 style="margin-top: 10px;width: 270px;border: 1px solid #E3E4E5;background: #FFF;padding-top: 10px;">
<div style="padding:0 15px;">
<div style="display: flex;align-items: center;">
<img style="width: 20px;height: 20px;border-radius: 10px;margin-right: 10px;"
:src="Image" fit="cover"></img><span
style="width: auto;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;word-wrap: normal;font-weight: 400;">{{Name}}</span>
</div>
<span>{{title}}</span>
<div style="width: 240px;height: 180px;margin-top: 10px;">
<img style="width: 100%;height: 100%;" :src="imgUrl" fit="cover"></img>
</div>
</div>
<div style=" padding: 0 15px;border-top: 1px solid #E3E4E5;line-height: 24px;margin-top: 10px;">
<span style="color: #7E8081;font-size: 14px;"><img
src="../../../assets/images/applettb.png"
alt=""
style=" width: 14px;height: 14px;vertical-align: middle;margin-right: .2em;margin-top: -0.2em;">
小程序</span>
</div>
</div>
</div>
</template>
<script>
......@@ -34,13 +27,24 @@
data() {
return {
ViewDomain: '',
Image:'',
Name:'',
title:'',
imgUrl:'',
}
},
created() {
console.log(this.$route.query)
if(this.$route.query){
this.Image = this.$route.query.Image;
this.Name = this.$route.query.Name;
this.title = this.$route.query.title;
this.imgUrl = this.$route.query.imgUrl;
}
},
}
</script>
<style scoped>
@import './ue/iframestyle.css';
/* @import './ue/iframestyle.css'; */
</style>
\ No newline at end of file
......@@ -117,14 +117,12 @@
//s视频
fileArray.forEach(item => {
html+="<iframe frameborder='0' width='100%' height='200px' src='https://v.qq.com/iframe/player.html?vid=v326875u4ek' allowfullscreen='true'></iframe>"
// 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);
}
}
......@@ -134,12 +132,7 @@
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>';
html+='<p style="text-align:center"><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 + '/index.html?fileName=' + item.fileName + '&url=' + item.fileUrl +
......@@ -174,10 +167,17 @@
}else if(data.type==2){//图片小程序
html+=`<p><a data-miniprogram-appid="${data.appletmsg.AppID}" data-miniprogram-path="${data.route}" href=""><img src="${data.imgUrl}" alt="" data-width="null" ></a></p>`
}else if(data.type==3){
html+=`<mp-miniprogram data-miniprogram-appid="${data.appletmsg.AppID}" data-miniprogram-path="${data.route}" data-miniprogram-nickname="${data.appletmsg.Name}" data-miniprogram-avatar="${data.imgUrl}" data-miniprogram-title="${data.title}" data-miniprogram-imageurl="${data.imgUrl}" data-miniprogram-type="card" data-miniprogram-servicetype="0"></mp-miniprogram>`
let a=`<mp-miniprogram data-miniprogram-appid="wxacd9f8cc3480d29e" data-miniprogram-path="pages/index/index" data-miniprogram-nickname="赞羊" data-miniprogram-avatar="http://mmbiz.qpic.cn/mmbiz_png/vDPDsxyFvjJ09nKK5HDicbSibuyWIx8l7S3icxkc0kwtJApsYc1hicVSTxbCakhRAuMLpxGibmxH6MeC4kSibBwl3GSQ/640?wx_fmt=png&amp;wxfrom=200" data-miniprogram-title="飞哥地方给对方" data-miniprogram-imageurl="http://mmbiz.qpic.cn/mmbiz_jpg/iamUJ3Ot9utFjb5RP6Fr0ECTbQDnicewkS38JbPCsoFZPUzibXuIj6IhaHOPudWSG0ZxldLIj70QtHVSbwrBaP85g/0?wx_fmt=jpeg" data-miniprogram-type="card" data-miniprogram-servicetype="0"></mp-miniprogram>`
let dataTime = Date.parse(new Date())
// 给公众号的写法
html+=`<mp-miniprogram data-time="${dataTime}" data-miniprogram-appid="${data.appletmsg.AppID}" data-miniprogram-path="${data.route}" data-miniprogram-title="${data.title}" data-miniprogram-imageurl="http://mmbiz.qpic.cn/mmbiz_jpg/iamUJ3Ot9utFjb5RP6Fr0ECTbQDnicewkS38JbPCsoFZPUzibXuIj6IhaHOPudWSG0ZxldLIj70QtHVSbwrBaP85g/0?wx_fmt=jpeg" data-miniprogram-type="card" data-miniprogram-servicetype="0"></mp-miniprogram>`
//自己看的写法
html += '<p><iframe height="320" width="auto" data-time='+ dataTime +' 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?Name=' + data.appletmsg.Name + '&Image=' +
data.appletmsg.Image + '&title=' +data.title+ '&imgUrl=' +data.imgUrl+
'" class="ans-insertaudio-module" module="_insertaudio">' + ' </iframe></p>';
console.log(html)
console.log(a)
}
if (html && html != '') {
......
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