Commit 623b19b2 authored by Mac's avatar Mac

1

parent f6ef0ecc
...@@ -9,17 +9,18 @@ ...@@ -9,17 +9,18 @@
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;"> <q-card-section class="q-pt-none" style="margin-top: 15px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId" @input="$forceUpdate()" <q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
ref="ID" :options="allclassifyList" label="分组" :dense="false" emit-value map-options /> @input="$forceUpdate()" ref="ID" :options="allclassifyList" label="分组" :dense="false"
<q-input clearable standout="bg-primary text-white" v-model="addMsg.TextModel.Title" @input="$forceUpdate()" emit-value map-options />
label="文本标题" style="margin-top: 20px;" /> <q-input clearable standout="bg-primary text-white" v-model="addMsg.TextModel.Title"
<q-input clearable standout="bg-primary text-white" v-model="addMsg.TextModel.Content" @input="$forceUpdate()" @input="$forceUpdate()" label="文本标题" style="margin-top: 20px;" />
type="textarea" label="文本内容" style="margin-top: 20px;" /> <q-input clearable standout="bg-primary text-white" v-model="addMsg.TextModel.Content"
@input="$forceUpdate()" type="textarea" label="文本内容" style="margin-top: 20px;" />
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel()" /> <q-btn class="q-mr-md" label="取消" @click="getcancel()" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="savewb()" /> <q-btn color="accent" class="q-mr-md" label="确定" @click="savewb()" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -33,8 +34,9 @@ ...@@ -33,8 +34,9 @@
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;"> <q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId" @input="$forceUpdate()" <q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
ref="Id" :options="allclassifyList" label="分组" :dense="false" emit-value map-options /> @input="$forceUpdate()" ref="Id" :options="allclassifyList" label="分组" :dense="false"
emit-value map-options />
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<div style="width:70px">上传图片:</div> <div style="width:70px">上传图片:</div>
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
...@@ -56,7 +58,7 @@ ...@@ -56,7 +58,7 @@
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" /> <q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="saveImage()" /> <q-btn color="accent" class="q-mr-md" label="确定" @click="saveImage()" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -70,8 +72,9 @@ ...@@ -70,8 +72,9 @@
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;"> <q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId" @input="$forceUpdate()" <q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
ref="Id" :options="allclassifyList" label="分组" :dense="false" emit-value map-options /> @input="$forceUpdate()" ref="Id" :options="allclassifyList" label="分组" :dense="false"
emit-value map-options />
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<div style="width:70px">上传图片:</div> <div style="width:70px">上传图片:</div>
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
...@@ -86,12 +89,14 @@ ...@@ -86,12 +89,14 @@
<div style="margin-top: 20px;"> <div style="margin-top: 20px;">
图片大小不超过2M,图片名不能重复,支持JPG,JPEG及PNG格式 图片大小不超过2M,图片名不能重复,支持JPG,JPEG及PNG格式
</div> </div>
<q-input filled clearable standout="bg-primary text-white" v-model="addMsg.ImgTextModel.Title" @input="$forceUpdate()" <q-input filled clearable standout="bg-primary text-white"
label="添加标题" :rules="[val => !!val || '请输入标题']" style="margin-top: 20px;" /> v-model="addMsg.ImgTextModel.Title" @input="$forceUpdate()" label="添加标题"
<q-input filled clearable standout="bg-primary text-white" v-model="addMsg.ImgTextModel.Description" type="textarea" @input="$forceUpdate()" :rules="[val => !!val || '请输入标题']" style="margin-top: 20px;" />
label="添加描述" <q-input filled clearable standout="bg-primary text-white"
style="margin-top: 20px;" /> v-model="addMsg.ImgTextModel.Description" type="textarea" @input="$forceUpdate()"
<q-input filled clearable standout="bg-primary text-white" v-model="addMsg.ImgTextModel.ImgLink" @input="$forceUpdate()" label="添加描述" style="margin-top: 20px;" />
<q-input filled clearable standout="bg-primary text-white"
v-model="addMsg.ImgTextModel.ImgLink" @input="$forceUpdate()"
label="请输入跳转链接,且必须以http://或https://开头" style="margin-top: 20px;" label="请输入跳转链接,且必须以http://或https://开头" style="margin-top: 20px;"
:rules="[ val => !!val || '请输入跳转链接']" /> :rules="[ val => !!val || '请输入跳转链接']" />
</div> </div>
...@@ -101,7 +106,7 @@ ...@@ -101,7 +106,7 @@
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" /> <q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="saveImagetext()" /> <q-btn color="accent" class="q-mr-md" label="确定" @click="saveImagetext()" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -115,8 +120,9 @@ ...@@ -115,8 +120,9 @@
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;"> <q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId" @input="$forceUpdate()" <q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
ref="Id" :options="allclassifyList" label="分组" :dense="false" emit-value map-options /> @input="$forceUpdate()" ref="Id" :options="allclassifyList" label="分组" :dense="false"
emit-value map-options />
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<div style="width:70px">上传音频:</div> <div style="width:70px">上传音频:</div>
<audio controls="controls" v-if='addMsg.AudioModel.AudioPath' style="margin-top: 10px;"> <audio controls="controls" v-if='addMsg.AudioModel.AudioPath' style="margin-top: 10px;">
...@@ -126,20 +132,21 @@ ...@@ -126,20 +132,21 @@
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<el-upload class="avatar-uploader " action="" :before-upload="uploadFile" <el-upload class="avatar-uploader " action="" :before-upload="uploadFile"
:show-file-list="false"> :show-file-list="false">
<q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传"></q-btn> <q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传">
</q-btn>
</el-upload> </el-upload>
<div style="margin-top: 20px;"> <div style="margin-top: 20px;">
(音频上传大小不超过2MB,播放长度不超过60s,支持AMR,MP3格式。) (音频上传大小不超过2MB,播放长度不超过60s,支持AMR,MP3格式。)
</div> </div>
</div> </div>
</div> </div>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" /> <q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="saveaudio()" /> <q-btn color="accent" class="q-mr-md" label="确定" @click="saveaudio()" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -153,33 +160,152 @@ ...@@ -153,33 +160,152 @@
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;"> <q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId" @input="$forceUpdate()" <q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
ref="Id" :options="allclassifyList" label="分组" :dense="false" emit-value map-options /> @input="$forceUpdate()" ref="Id" :options="allclassifyList" label="分组" :dense="false"
emit-value map-options />
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<div style="width:70px">上传视频:</div> <div style="width:70px">上传视频:</div>
<video width="320" height="240" controls="controls" v-if="addMsg.VideoModel.VideoPath!=''" > <video width="320" height="240" controls="controls" v-if="addMsg.VideoModel.VideoPath!=''">
<source :src="addMsg.VideoModel.VideoPath" type="video/ogg" /> <source :src="addMsg.VideoModel.VideoPath" type="video/ogg" />
<source :src="addMsg.VideoModel.VideoPath" type="video/mp4" /> <source :src="addMsg.VideoModel.VideoPath" type="video/mp4" />
<source :src="addMsg.VideoModel.VideoPath" type="video/webm" /> <source :src="addMsg.VideoModel.VideoPath" type="video/webm" />
</video> </video>
<div style="margin-top: 15px;"> <div style="margin-top: 15px;">
<el-upload class="avatar-uploader " action="" :before-upload="uploadFile" <el-upload class="avatar-uploader " action="" :before-upload="uploadFile"
:show-file-list="false"> :show-file-list="false">
<q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传"></q-btn> <q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传">
</q-btn>
</el-upload> </el-upload>
<div style="margin-top: 20px;"> <div style="margin-top: 20px;">
(视频上传大小不超过10M,支持MP4格式) (视频上传大小不超过10M,支持MP4格式)
</div> </div>
</div> </div>
</div> </div>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-actions align="right" class="bg-white"> <q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" /> <q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="savevideo()" /> <q-btn color="accent" class="q-mr-md" label="确定" @click="savevideo()" />
</q-card-actions>
</q-card>
</q-dialog>
</div>
<!-- 小程序 -->
<div v-if="type==6">
<q-dialog v-model="Isadd" persistent>
<q-card style="width: 850px; max-width: 80vw;">
<q-card-section>
<div class="text-h6">新建/修改小程序</div>
</q-card-section>
<q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<div class="col row wrap q-mr-lg q-col-gutter-md">
<div class="col-8">
<div style="width: 100%;border: 1px solid #ffe1b6;
background: #fff1de;
padding: 10px;
margin-bottom: 20px;">
在企业微信里发送小程序(必须在微信公众平台通过审核和发布的),请先将其关联到企业微信,再到本系统添加该小程序,否则发送失败,客户接收不到。如果没有微信小程序,请前往微信小程序进行注册。
<a href="https://mp.weixin.qq.com/cgi-bin/wx" target="_blank"
style="color: #1890ff;">
立即前往
</a>
</div>
<q-select filled stack-label option-value="Id" option-label="Name"
v-model="addMsg.MediaGroupId" @input="$forceUpdate()" ref="Id"
:options="allclassifyList" label="分组" :dense="false" emit-value map-options />
<q-input filled clearable standout="bg-primary text-white"
v-model="addMsg.AppletModel.AppletId" @input="$forceUpdate()" label="小程序appID"
:rules="[val => !!val || '请输入小程序appID']" style="margin-top: 20px;" />
<q-input filled clearable standout="bg-primary text-white"
v-model="addMsg.AppletModel.Page" @input="$forceUpdate()" label="小程序路径"
:rules="[val => !!val || '请输入小程序路径']" style="margin-top: 10px;" />
<q-input filled clearable standout="bg-primary text-white"
v-model="addMsg.AppletModel.Title" @input="$forceUpdate()" label="添加标题"
:rules="[val => !!val || '请输入标题']" style="margin-top: 10px;" />
<div style="margin-top: 15px;">
<div style="width:70px">上传图片:</div>
<div style="margin-top: 15px;">
<el-upload class="avatar-uploader materialupload" action=""
:before-upload="uploadFile"
accept="image/gif,image/jpeg,image/png,image/jpg,image/bmp"
:show-file-list="false">
<i class="el-icon-plus avatar-uploader-icon" style="font-size: 30px;"
v-if=" addMsg.AppletModel.ImagePath==''"></i>
<q-img v-else :src="addMsg.AppletModel.ImagePath"
style="width: 110px;height: 110px;border-radius: 6px;display: flex;">
</q-img>
</el-upload>
<div style="margin-top: 20px;">
(图片大小不超过1M,图片名不能重复,支持JPG,JPEG及PNG格式)
</div>
</div>
</div>
</div>
<div class="col-4">
<q-img src="../../../assets/images/example.png"
style="width: 244px;height: 287px;display: flex;"></q-img>
<div style="width: 244px;text-align: center;margin-top: 15px;">示例</div>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="确定" @click="saveapplet()" />
</q-card-actions>
</q-card>
</q-dialog>
</div>
<!-- 文件素材 -->
<div v-if="type==7">
<q-dialog v-model="Isadd" persistent>
<q-card style="width: 520px; max-width: 80vw;" class="addscfile">
<q-card-section>
<div class="text-h6">新建/修改文件素材</div>
</q-card-section>
<q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="Id" option-label="Name" v-model="addMsg.MediaGroupId"
@input="$forceUpdate()" ref="Id" :options="allclassifyList" label="分组" :dense="false"
emit-value map-options />
<div style="margin-top: 15px;">
<div style="width:70px">上传文件:</div>
<div class="iconfontfile " v-if="addMsg.FileModel && addMsg.FileModel.FilePath!=''"
@click="showUpLoadFile(addMsg.FileModel)">
<i v-if="addMsg.FileModel.FilePath.substring(addMsg.FileModel.FilePath.lastIndexOf('.')+1,addMsg.FileModel.FilePath.length).toUpperCase()=='PDF'" class="iconfont icon-pdf"></i>
<i v-else-if="addMsg.FileModel.FilePath.substring(addMsg.FileModel.FilePath.lastIndexOf('.')+1,addMsg.FileModel.FilePath.length).toUpperCase()=='TXT'" class="iconfont icon-txt"></i>
<i v-else-if="addMsg.FileModel.FilePath.substring(addMsg.FileModel.FilePath.lastIndexOf('.')+1,addMsg.FileModel.FilePath.length).toUpperCase()=='DOCX' ||
addMsg.FileModel.FilePath.substring(addMsg.FileModel.FilePath.lastIndexOf('.')+1,addMsg.FileModel.FilePath.length).toUpperCase()=='DOC'
" class="iconfont icon-word"></i>
<i v-else class="iconfont icon-excel"></i>
</div>
<div style="margin-top: 15px;">
<el-upload class="avatar-uploader " action="" :before-upload="uploadFile"
:show-file-list="false">
<q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传">
</q-btn>
</el-upload>
<div style="margin-top: 20px;">
(上传文件大小不超过20MB,支持DOC、DOCX、XLS、XLSX、CSV、PPT、PPTX、TXT、PDF及Xmind格式。)
</div>
</div>
</div>
</q-card-section>
<q-separator />
<q-card-actions align="right" class="bg-white">
<q-btn class="q-mr-md" label="取消" @click="getcancel" />
<q-btn color="accent" class="q-mr-md" label="添加" @click="savefile()" />
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
...@@ -254,18 +380,33 @@ ...@@ -254,18 +380,33 @@
Description: '', Description: '',
ImgLink: '', ImgLink: '',
}; };
}else if (this.type == 4) {//音频 } else if (this.type == 4) {//音频
this.addMsg.AudioModel = { this.addMsg.AudioModel = {
AudioName: '', AudioName: '',
AudioPath: '', AudioPath: '',
}; };
}else if (this.type == 5) {//视频 } else if (this.type == 5) {//视频
this.addMsg.VideoModel = { this.addMsg.VideoModel = {
VideoName: '', VideoName: '',
VideoPath: '', VideoPath: '',
}; };
} else if (this.type == 6) {//小程序
this.addMsg.AppletModel = {
AppletId: '',
Page: '',
Title: '',
ImageName: '',
ImagePath: '',
};
} else if (this.type == 7) {//小程序
this.addMsg.FileModel = {
FileName: '',
FilePath: '',
};
} }
}, },
setWeChat() { setWeChat() {
setWeChatMediumInfo(this.addMsg).then(res => { setWeChatMediumInfo(this.addMsg).then(res => {
...@@ -312,18 +453,31 @@ ...@@ -312,18 +453,31 @@
this.setWeChat() this.setWeChat()
}, },
uploadFile(files) {//图片上传 uploadFile(files) {//图片上传
if (this.type == 2 || this.type == 3) {//图文和图片的时候处理 if (this.type == 2 || this.type == 3 || this.type == 6) {//图文和图片、小程序的时候处理
let types = ['image/jpeg', 'image/jpg', 'image/png']; let types = ['image/jpeg', 'image/jpg', 'image/png'];
const isImage = types.includes(files.type); const isImage = types.includes(files.type);
const isLtSize = files.size / 1024 / 1024 < 2; if (this.type == 2 || this.type == 3) {
if (!isLtSize) { const isLtSize = files.size / 1024 / 1024 < 2;
this.$q.notify({ if (!isLtSize) {
type: 'negative', this.$q.notify({
message: `上传图片大小不能超过 2MB!`, type: 'negative',
position: 'top' message: `上传图片大小不能超过 2MB!`,
}) position: 'top'
return false; })
return false;
}
} else {
const isLtSize = files.size / 1024 / 1024 < 1;
if (!isLtSize) {
this.$q.notify({
type: 'negative',
message: `上传图片大小不能超过 1MB!`,
position: 'top'
})
return false;
}
} }
if (!isImage) { if (!isImage) {
this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
...@@ -333,21 +487,24 @@ ...@@ -333,21 +487,24 @@
} else { } else {
wechatUploadSelfFile('wechatcatalogue', files, res => { wechatUploadSelfFile('wechatcatalogue', files, res => {
if (res.Code == 1) { if (res.Code == 1) {
if(this.type == 2 ){ if (this.type == 2) {
this.addMsg.ImageModel.ImageName = res.FileName; this.addMsg.ImageModel.ImageName = res.FileName;
this.addMsg.ImageModel.ImagePath = res.FileUrl; this.addMsg.ImageModel.ImagePath = res.FileUrl;
}else{ } else if (this.type == 3) {
this.addMsg.ImgTextModel.ImgName = res.FileName; this.addMsg.ImgTextModel.ImgName = res.FileName;
this.addMsg.ImgTextModel.ImgPath = res.FileUrl; this.addMsg.ImgTextModel.ImgPath = res.FileUrl;
} else {
this.addMsg.AppletModel.ImageName = res.FileName;
this.addMsg.AppletModel.ImagePath = res.FileUrl;
} }
this.$forceUpdate(); this.$forceUpdate();
} }
}) })
} }
} }
if(this.type == 4){//音频上传 if (this.type == 4) {//音频上传
// 文件类型进行判断 // 文件类型进行判断
const isAudio = files.type === "audio/mp3" || files.type === "audio/mpeg"; const isAudio = files.type === "audio/mp3" || files.type === "audio/mpeg";
const isLt2M = files.size / 1024 / 1024 < 2; const isLt2M = files.size / 1024 / 1024 < 2;
const isTime60S = this.getTimes(files) >= 60 ? true : false; const isTime60S = this.getTimes(files) >= 60 ? true : false;
...@@ -385,7 +542,7 @@ ...@@ -385,7 +542,7 @@
} }
} }
} }
if(this.type == 5){//视频上传 if (this.type == 5) {//视频上传
// 文件类型进行判断 // 文件类型进行判断
const isLt10M = files.size / 1024 / 1024 < 10; const isLt10M = files.size / 1024 / 1024 < 10;
console.log(files) console.log(files)
...@@ -413,10 +570,39 @@ ...@@ -413,10 +570,39 @@
} }
}) })
} }
if (this.type == 7) {//文件
const isLt20M = files.size / 1024 / 1024 < 20;
let ft = files.name.substring(files.name.lastIndexOf('.') + 1, files.name.length).toUpperCase();
let stringArr = 'DOCX|DOC|XLSX|XLS|PPT|PPTX|PDF'
if (stringArr.indexOf(ft) == '-1') {
this.$q.notify({
type: 'negative',
message: `请上传正确的文件格式!`,
position: 'top'
})
return false;
}
if (!isLt20M) {
this.$q.notify({
type: 'negative',
message: `文件大小不能超过20MB哦!`,
position: 'top'
})
return false;
}
wechatUploadSelfFile('wechatcatalogue', files, res => {
if (res.Code == 1) {
console.log(res)
this.addMsg.FileModel.FileName = res.FileName;
this.addMsg.FileModel.FilePath = res.FileUrl;
this.$forceUpdate();
}
})
}
}, },
getTimes(file) {//获取音频妙数 getTimes(file) {//获取音频妙数
var content = file; var content = file;
let audioDuration= 0 let audioDuration = 0
//获取录音时长 //获取录音时长
var url = URL.createObjectURL(content); var url = URL.createObjectURL(content);
//经测试,发现audio也可获取视频的时长 //经测试,发现audio也可获取视频的时长
...@@ -447,7 +633,7 @@ ...@@ -447,7 +633,7 @@
this.setWeChat() this.setWeChat()
}, },
saveImagetext(){//图文提交 saveImagetext() {//图文提交
if (this.addMsg.MediaGroupId == '') { if (this.addMsg.MediaGroupId == '') {
this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
...@@ -480,11 +666,11 @@ ...@@ -480,11 +666,11 @@
}) })
return return
} }
var Expression=/http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/; var Expression = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
var objExp=new RegExp(Expression); var objExp = new RegExp(Expression);
if(objExp.test(this.addMsg.ImgTextModel.ImgLink)){ if (objExp.test(this.addMsg.ImgTextModel.ImgLink)) {
// plus.runtime.openWeb(this.link) // plus.runtime.openWeb(this.link)
}else{ } else {
this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
message: `上传的链接开头非http或https`, message: `上传的链接开头非http或https`,
...@@ -495,7 +681,7 @@ ...@@ -495,7 +681,7 @@
this.setWeChat() this.setWeChat()
}, },
saveaudio(){//音频 saveaudio() {//音频
if (this.addMsg.MediaGroupId == '') { if (this.addMsg.MediaGroupId == '') {
this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
...@@ -514,7 +700,7 @@ ...@@ -514,7 +700,7 @@
} }
this.setWeChat() this.setWeChat()
}, },
savevideo(){//视频 savevideo() {//视频
if (this.addMsg.MediaGroupId == '') { if (this.addMsg.MediaGroupId == '') {
this.$q.notify({ this.$q.notify({
type: 'negative', type: 'negative',
...@@ -532,7 +718,90 @@ ...@@ -532,7 +718,90 @@
return return
} }
this.setWeChat() this.setWeChat()
} },
saveapplet() {//小程序
if (this.addMsg.MediaGroupId == '') {
this.$q.notify({
type: 'negative',
message: `请选择分组选择`,
position: 'top'
})
return
}
if (this.addMsg.AppletModel.AppletId == '') {
this.$q.notify({
type: 'negative',
message: `请填写小程序ID`,
position: 'top'
})
return
}
if (this.addMsg.AppletModel.Page == '') {
this.$q.notify({
type: 'negative',
message: `请填写路径`,
position: 'top'
})
return
}
if (this.addMsg.AppletModel.Title == '') {
this.$q.notify({
type: 'negative',
message: `请填写小程序标题`,
position: 'top'
})
return
}
if (this.addMsg.AppletModel.ImagePath == '') {
this.$q.notify({
type: 'negative',
message: `请填写上传图片`,
position: 'top'
})
return
}
this.setWeChat()
},
savefile() {//文件
if (this.addMsg.MediaGroupId == '') {
this.$q.notify({
type: 'negative',
message: `请选择分组选择`,
position: 'top'
})
return
}
if (this.addMsg.FileModel.FilePath == '') {
this.$q.notify({
type: 'negative',
message: `请上传文件`,
position: 'top'
})
return
}
this.setWeChat()
},
showUpLoadFile(i) {
// 文件类型进行判断
if (
i.FileName.substring(
i.FileName.lastIndexOf(".") + 1,
i.FileName.length
).toUpperCase() == "PDF" ||
i.FileName.substring(
i.FileName.lastIndexOf(".") + 1,
i.FileName.length
).toUpperCase() == "TXT"
) {
this.previewPDF(i.Url);
} else {
window.open(
"https://view.officeapps.live.com/op/view.aspx?src=" + i.FilePath
);
}
},
} }
} }
...@@ -627,4 +896,15 @@ ...@@ -627,4 +896,15 @@
text-overflow: ellipsis; text-overflow: ellipsis;
width: 208px; width: 208px;
} }
.addscfile .icon-excel,
.addscfile .icon-pdf,
.addscfile .icon-txt,
.addscfile .icon-wenjian,
.addscfile .icon-yasuobao,
.addscfile .icon-shipin,
.addscfile .icon-word {
font-size: 38px;
color: green;
line-height: 75px;
}
</style> </style>
\ No newline at end of file
<template>
<div class="appletmaterial" style="padding: 0;margin: 0;">
<div class="page-content">
<div>
<q-btn color="accent" style="float:right;" size="sm" class="q-mr-md" icon="add" label="添加小程序"
@click="goadd()"></q-btn>
</div>
<div style="width: 100%;display: flex;align-items: center;flex-wrap: wrap;padding: 10px 20px;" v-if="dataList.length>0">
<q-card class="imgcard" v-for="(x,y) in dataList" :key='y'
:style="{border:x.check==true?'2px solid #91d5ff':'2px solid #FFF'}"
@click="dataList[y].check = !dataList[y].check,$forceUpdate();">
<q-card-section>
<div
style="display:flex;align-items: center;justify-content: space-between;margin-bottom: 5px;">
<span>{{x.UpdateTime}}</span>
<!-- <q-btn class="q-mr-md" label="编辑" size="xs" color="accent" style="margin-right: 0;" @click.stop="goedit(x)" /> -->
<i class="el-icon-edit-outline" style="font-size: 20px;color: #1890ff;"
@click.stop="goedit(x)"></i>
</div>
<q-img :src="x.AppletModel && x.AppletModel.ImagePath?x.AppletModel.ImagePath:''" class="imgstyle">
<div class="absolute-bottom text-subtitle1 text-center onetext"
style="padding: 0;padding: 0 5px;font-size: 12px;">
{{x.AppletModel&& x.AppletModel.Title?x.AppletModel.Title:''}}
</div>
</q-img>
<div class="onetext" style="margin-top: 5px;">上传者:{{x.UpdateByName}}</div>
<div class="onetext" style="margin-top: 5px;">分钟:{{x.MediumGroupName}}</div>
</q-card-section>
</q-card>
<div style="width: 100%;height: 50px;line-height: 50px;text-align: center;" v-if="dataList.length==0">暂无数据</div>
</div>
<div style="width: 100%;height: 50px;line-height: 50px;text-align: center;" v-if="dataList.length==0">暂无数据</div>
</div>
<div v-if="Isadd==true">
<alladdsc :allclassifyList="allclassifyList" type='6' @editsuccess="getchildren" :editobj='editobj' @getcancel='Isadd=false'></alladdsc>
</div>
</div>
</template>
<script>
import alladdsc from './allAddSC'
export default {
name: "appletmaterial",
components: {
alladdsc,
},
props: {
dataList: {
type: Array,
default: [],
},
allclassifyList:{
type: Array,
default: [],
}
},
data() {
return {
loading: false,
Isadd: false,
editobj:null
}
},
created() {
},
methods: {
goadd() {
this.Isadd = true;
this.editobj=null
},
goedit(row){
this.editobj= {}
this.editobj.Id = row.Id;
this.editobj.MediaGroupId = row.MediaGroupId;
this.editobj.Type = row.Type;
this.editobj.AppletModel = JSON.parse(JSON.stringify(row.AppletModel)) ;
this.Isadd = true
},
getchildren(){
this.$emit('editsuccess')
this.Isadd = false
},
}
}
</script>
<style>
.appletmaterial .Sysuser_Date .el-input--prefix .el-input__inner {
background-color: red;
border: 0;
}
.appletmaterial .state-item {
padding: 2px 5px;
border-radius: 3px;
text-align: center;
font-size: 10px;
}
.appletmaterial .frIdlist {
padding: 3px 10px;
border-radius: 3px;
background: #EEEEEF;
align-items: center;
justify-content: center;
margin-right: 5px;
margin-bottom: 5px;
cursor: pointer;
}
.class-popover .q-pr-lg {
padding-right: 0;
margin-top: 20px;
}
.appletmaterial .el-date-editor.el-input {
width: 100%;
}
.appletmaterial .el-date-editor.el-input input {
background-color: transparent !important;
}
.appletmaterial .el-range-editor .el-range-input {
background: none;
}
.Sysuser_Date .el-input__inner {
background: transparent !important;
border: 0 !important;
}
.appletmaterial .el-drawer.rtl {
overflow: inherit;
}
.appletmaterial .imgcard {
width: 240px;
margin: 0 15px 15px 0
}
.appletmaterial .imgstyle {
width: 100%;
height: 120px;
border-radius: 0;
}
.appletmaterial .onetext {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width: 208px;
}
</style>
\ No newline at end of file
...@@ -3,13 +3,14 @@ ...@@ -3,13 +3,14 @@
<div class="page-content"> <div class="page-content">
<div> <div>
<q-btn color="accent" style="float:right;" size="sm" class="q-mr-md" icon="add" label="上传视频" <q-btn color="accent" style="float:right;" size="sm" class="q-mr-md" icon="add" label="上传文件"
@click="goadd()"></q-btn> @click="goadd()"></q-btn>
</div> </div>
<div style="width: 100%;display: flex;align-items: center;flex-wrap: wrap;padding: 10px 20px;"> <div style="width: 100%;display: flex;align-items: center;flex-wrap: wrap;padding: 10px 20px;"
<q-card class="imgcard" v-for="(x,y) in data" :key='y' v-if="dataList.length>0">
<q-card class="imgcard" v-for="(x,y) in dataList" :key='y'
:style="{border:x.check==true?'2px solid #91d5ff':'2px solid #FFF'}" :style="{border:x.check==true?'2px solid #91d5ff':'2px solid #FFF'}"
@click="data[y].check = !data[y].check"> @click="dataList[y].check = !dataList[y].check,$forceUpdate()">
<q-card-section> <q-card-section>
<div <div
style="display:flex;align-items: center;justify-content: space-between;margin-bottom: 5px;"> style="display:flex;align-items: center;justify-content: space-between;margin-bottom: 5px;">
...@@ -18,156 +19,105 @@ ...@@ -18,156 +19,105 @@
<i class="el-icon-edit-outline" style="font-size: 20px;color: #1890ff;" <i class="el-icon-edit-outline" style="font-size: 20px;color: #1890ff;"
@click.stop="goedit(x)"></i> @click.stop="goedit(x)"></i>
</div> </div>
<div class="iconfontfile " v-if="x.Content!=''" <div class="iconfontfile " v-if="x.FileModel && x.FileModel.FilePath!=''"
:class="x.Content.substring(x.Content.lastIndexOf('.')+1,x.Content.length).toUpperCase()=='PDF'? 'icon-pdf' : 'icon-excel'" @click.stop="showUpLoadFile(x.FileModel)">
@click="showUpLoadFile()"> <i v-if="x.FileModel.FilePath.substring(x.FileModel.FilePath.lastIndexOf('.')+1,x.FileModel.FilePath.length).toUpperCase()=='PDF'"
class="iconfont icon-pdf"></i>
<i v-else-if="x.FileModel.FilePath.substring(x.FileModel.FilePath.lastIndexOf('.')+1,x.FileModel.FilePath.length).toUpperCase()=='TXT'"
class="iconfont icon-txt"></i>
<i v-else-if="x.FileModel.FilePath.substring(x.FileModel.FilePath.lastIndexOf('.')+1,x.FileModel.FilePath.length).toUpperCase()=='DOCX' ||
x.FileModel.FilePath.substring(x.FileModel.FilePath.lastIndexOf('.')+1,x.FileModel.FilePath.length).toUpperCase()=='DOC'
" class="iconfont icon-word"></i>
<i v-else class="iconfont icon-excel"></i>
</div> </div>
<div class="onetext" style="margin-top: 5px;">上传者:{{x.CreatorName}}</div> <div class="onetext" style="margin-top: 5px;">上传者:{{x.UpdateByName}}</div>
<div class="onetext" style="margin-top: 5px;">来源:{{x.source}}</div> <div class="onetext" style="margin-top: 5px;">分组:{{x.MediumGroupName}}</div>
</q-card-section> </q-card-section>
</q-card> </q-card>
</div> </div>
</div> <div style="width: 100%;height: 50px;line-height: 50px;text-align: center;" v-if="dataList.length==0">暂无数据
<q-dialog v-model="Isadd" persistent> </div>
<q-card style="width: 520px; max-width: 80vw;">
<q-card-section>
<div class="text-h6">新建图文</div>
</q-card-section>
<q-separator />
<q-card-section class="q-pt-none" style="margin-top: 15px;padding: 20px;">
<q-select filled stack-label option-value="ID" option-label="Name" v-model="addMsg.classifyId"
ref="ID" :options="classifyList" label="分组" :dense="false" emit-value map-options />
<div style="margin-top: 15px;">
<div style="width:70px">上传文件:</div>
<div class="iconfontfile " v-if="addMsg.Url!=''"
:class="addMsg.Url.substring(addMsg.Url.lastIndexOf('.')+1,addMsg.Url.length).toUpperCase()=='PDF'? 'icon-pdf' : 'icon-excel'"
@click="showUpLoadFile()">
</div>
<div style="margin-top: 15px;">
<el-upload class="avatar-uploader " action="" :before-upload="uploadFile"
:show-file-list="false">
<q-btn color="accent" size="sm" class="q-mr-md" icon="cloud_upload" label="上传"></q-btn>
</el-upload>
<div style="margin-top: 20px;">
(上传文件大小不超过20MB,支持DOC、DOCX、XLS、XLSX、CSV、PPT、PPTX、TXT、PDF及Xmind格式。)
</div>
</div>
</div>
</q-card-section> </div>
<q-separator /> <div v-if="Isadd==true">
<q-card-actions align="right" class="bg-white"> <alladdsc :allclassifyList="allclassifyList" type='7' @editsuccess="getchildren" :editobj='editobj'
<q-btn class="q-mr-md" label="取消" @click="Isadd = false" /> @getcancel='Isadd=false'></alladdsc>
<q-btn color="accent" class="q-mr-md" label="添加" @click="submit()" /> </div>
</q-card-actions>
</q-card>
</q-dialog>
</div> </div>
</template> </template>
<script> <script>
import {
UploadSelfFile import alladdsc from './allAddSC'
} from "../../../api/common/common"; //上传图片
const addobj = { Id: 0, classifyId: '', Url: '', }
export default { export default {
name: "filematerial", name: "filematerial",
components: {
alladdsc,
},
props: {
dataList: {
type: Array,
default: [],
},
allclassifyList: {
type: Array,
default: [],
}
},
data() { data() {
return { return {
loading: false, loading: false,
Isadd: false, Isadd: false,
data: [{ editobj: null
Type: 1,
title: '测试文本.png',
Content: 'http://192.168.20.214:8130/EduSystem/Test/Upload/course/202108060532494570000000006.docx',
source: '本地上传',
CreatorName: '小张',
check: false,
UpdateTime: '2021-08-04 15:48'
}, {
Type: 1,
title: '测试文本.png',
Content: 'http://192.168.20.214:8130/EduSystem/Test/Upload/course/202108060532494570000000006.docx',
source: '本地上传',
CreatorName: '小张',
check: false,
UpdateTime: '2021-08-04 15:48'
}, {
Type: 1,
title: '测试文本.png',
Content: 'http://192.168.20.214:8130/EduSystem/Test/Upload/course/202108060532494570000000006.docx',
source: '本地上传',
CreatorName: '小张',
check: false,
UpdateTime: '2021-08-04 15:48'
},],
pageCount: 0,
msg: {
pageIndex: 1,
pageSize: 18,
},
classifyList: [
{ Name: '活动', ID: 1, },
{ Name: '产品', ID: 2, },
{ Name: '校园', ID: 3, },
],
addMsg: Object.assign({}, addobj),
audioDuration: 0,
} }
}, },
created() { created() {
console.log('进去所有页面')
}, },
methods: { methods: {
changePage(e) {
},
goadd() { goadd() {
this.Isadd = true; this.Isadd = true;
this.addMsg = Object.assign({}, addobj) this.editobj = null
}, },
goedit(x) { goedit(row) {
this.Isadd = true; this.editobj = {}
this.addMsg.Url = x.Content this.editobj.Id = row.Id;
this.editobj.MediaGroupId = row.MediaGroupId;
this.editobj.Type = row.Type;
this.editobj.FileModel = JSON.parse(JSON.stringify(row.FileModel));
this.Isadd = true
},
getchildren() {
this.$emit('editsuccess')
this.Isadd = false
}, },
uploadFile(file) {
showUpLoadFile(i) {
// 文件类型进行判断 // 文件类型进行判断
const isLt20M = file.size / 1024 / 1024 < 20;
let ft = file.name.substring(file.name.lastIndexOf('.') + 1, file.name.length).toUpperCase(); if (
let stringArr = 'DOCX|DOC|XLSX|XLS|PPT|PPTX|PDF' i.FileName.substring(
if (stringArr.indexOf(ft) == '-1') { i.FileName.lastIndexOf(".") + 1,
this.$q.notify({ i.FileName.length
type: 'negative', ).toUpperCase() == "PDF" ||
message: `请上传正确的文件格式!`, i.FileName.substring(
position: 'top' i.FileName.lastIndexOf(".") + 1,
}) i.FileName.length
return false; ).toUpperCase() == "TXT"
} ) {
if (!isLt20M) { this.previewPDF(i.Url);
this.$q.notify({ } else {
type: 'negative', window.open(
message: `文件大小不能超过20MB哦!`, "https://view.officeapps.live.com/op/view.aspx?src=" + i.FilePath
position: 'top' );
})
return false;
} }
UploadSelfFile("course", file, res => {
if (res.Code == 1) {
this.addMsg.Url = res.FileUrl;
}
});
}, },
submit() {//提交
}
} }
} }
...@@ -242,19 +192,17 @@ ...@@ -242,19 +192,17 @@
width: 260px; width: 260px;
} }
.iconfontfile {
display: inline-block;
width: 32px;
height: 32px;
border-radius: 50%;
color: #e95252 !important;
background-color: rgba(251, 251, 251, 0.9);
}
.icon-excel,
.icon-pdf { .filematerial .icon-excel,
text-align: center; .filematerial .icon-pdf,
.filematerial .icon-txt,
.filematerial .icon-wenjian,
.filematerial .icon-yasuobao,
.filematerial .icon-shipin,
.filematerial .icon-word {
font-size: 38px; font-size: 38px;
color: green; color: green;
line-height: 75px;
} }
</style> </style>
\ No newline at end of file
...@@ -41,7 +41,7 @@ ...@@ -41,7 +41,7 @@
 <appletmaterial :dataList='dataList' :allclassifyList='allclassifyList' @editsuccess="getchildren"></appletmaterial>  <appletmaterial :dataList='dataList' :allclassifyList='allclassifyList' @editsuccess="getchildren"></appletmaterial>
</div> </div>
<div v-if="tabCheck=='7'"> <div v-if="tabCheck=='7'">
 <filematerial></filematerial>  <filematerial :dataList='dataList' :allclassifyList='allclassifyList' @editsuccess="getchildren"></filematerial>
</div> </div>
</div> </div>
<!-- <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="PageCount" :input="true" @input="changePage" /> --> <!-- <q-pagination class="full-width justify-end" v-model="msg.pageIndex" color="primary" :max="PageCount" :input="true" @input="changePage" /> -->
......
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