Commit 83a966f9 authored by wangwei's avatar wangwei

Revert: Merge branch 'master' into my

parent 60402fb4
...@@ -26,12 +26,7 @@ ...@@ -26,12 +26,7 @@
<div class="dialog-card"> <div class="dialog-card">
序号:{{index}} 序号:{{index}}
</div> </div>
<img :src="moIMG.lookUrl" v-if="data.key === 'look1'" class="image"> <img :src="data.imgUrl" class="image">
<img :src="moIMG.playRadioUrl" v-if="data.key === 'radio1'" class="image">
<img :src="moIMG.playVideoUrl" v-if="data.key === 'play1'" class="image">
<img :src="moIMG.RefuelingUrl" v-if="data.key === 'refueling1'" class="image">
<img :src="moIMG.showBabyUrl" v-if="data.key === 'show1'" class="image">
<img :src="moIMG.RefuelingUrl2" v-if="data.key === 'refueling2'" class="image">
</el-card> </el-card>
</div> </div>
</div> </div>
...@@ -794,12 +789,7 @@ ...@@ -794,12 +789,7 @@
<script> <script>
import mouldImg from '../../util/mouldImgUrl' import mouldImg from '../../util/mouldImgUrl'
import {uploadFileApi} from "../../service/api"; import {uploadFileApi} from "../../service/api";
import lookUrl from '../../assets/mould/example/look.png'
import playRadioUrl from '../../assets/mould/example/playRadio.png'
import playVideoUrl from '../../assets/mould/example/playVideo.png'
import RefuelingUrl from '../../assets/mould/example/Refueling.png'
import showBabyUrl from '../../assets/mould/example/showBaby.png'
import RefuelingUrl2 from '../../assets/mould/example/RefuelingUrl2.png'
export default { export default {
name: "editor", name: "editor",
props:[ props:[
...@@ -808,14 +798,6 @@ ...@@ -808,14 +798,6 @@
], ],
data(){ data(){
return { return {
moIMG:{
lookUrl:lookUrl,
playRadioUrl:playRadioUrl,
playVideoUrl:playVideoUrl,
RefuelingUrl:RefuelingUrl,
showBabyUrl:showBabyUrl,
RefuelingUrl2:RefuelingUrl2
},
// 放大缩小参数 // 放大缩小参数
bigNum:50, bigNum:50,
// 弹窗参数 // 弹窗参数
......
...@@ -7,280 +7,182 @@ ...@@ -7,280 +7,182 @@
:modal="false" :modal="false"
:center="true" :center="true"
:fullscreen="true"> :fullscreen="true">
<el-container> <el-tabs v-model="activeName2" type="card" >
<el-aside class="left-block" width="180px"> <el-tab-pane label="基本信息" name="base">
<div class="list-title"> <base-block :formData="formData"/>
模板列表 </el-tab-pane>
</div> <el-tab-pane label="课程内容" name="content">
<div class="page-list"> <lesson-content :formData="formData"/>
<div v-for="data in mouldList" @click="addMould(data)" :key="data.key"> </el-tab-pane>
<el-card shadow="hover" class="box" :body-style="{ padding: '0px' }"> <el-tab-pane label="爸妈看一看" name="look">
<img :src="data.imgUrl" class="image"> <look-block :formData="formData.content"/>
<div style="padding: 14px;"> </el-tab-pane>
<span>{{data.title}}</span> <el-tab-pane label="宝贝玩一玩" name="play">
<div class="bottom clearfix"> <play-block :formData="formData.content"/>
</div> </el-tab-pane>
</div> <el-tab-pane label="磨磨小耳朵" name="fun">
</el-card> <fun-block :formData="formData.content"/>
</div> </el-tab-pane>
</div> </el-tabs>
</el-aside> <span slot="footer" class="dialog-footer">
<el-main class="main-block"> <el-button @click="editorObj.show= false">取 消</el-button>
<div class="main-btns"> <el-button type="primary" @click="onSave">保 存</el-button>
<el-button type="primary" @click="showDialog = true"> </span>
课程基本信息编辑
</el-button>
<el-button style="float: right;" type="success" @click="onSave()">
保存
</el-button>
</div>
<div class="editor-block">
<editor :selectedMould="selectedMould" :editorObj="editorObj"/>
</div>
</el-main>
</el-container>
<el-dialog
title="信息编辑"
:modal="false"
:visible.sync="showDialog">
<el-form ref="form" :model="form" label-width="80px">
<el-form-item label="标题">
<el-input v-model="form.title"></el-input>
</el-form-item>
<el-form-item label="单词量">
<el-input-number v-model="form.words_num"></el-input-number>
</el-form-item>
<el-form-item label="分龄分级">
<el-select v-model="age" placeholder="请选择">
<el-option
label="全部"
:value="2">
</el-option>
<el-option
label="0-3岁"
:value="0">
</el-option>
<el-option
label="4-6岁"
:value="1">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="封面">
<el-upload
class="upload-demo"
action="/api/public/upload"
list-type="picture-card"
:http-request="uploadCover"
multiple
:limit="1"
:disabled="(fileUid && progress < 99)"
:file-list="imgList">
</el-upload>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button type="success" @click="showDialog = false">确 定</el-button>
</div>
</el-dialog>
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import addUrl from '../../assets/editor/Group 7.png' import {getElemenetDetailApi,editElementApi,addElementApi} from "../../service/api";
import {MOULDLIST} from "../../util/resourceMould"; import baseBlock from '../mould/baseBlock'
import editor from './editor' import lookBlock from '../mould/lookBlock'
import {addElementApi,editElementApi,getElemenetDetailApi,uploadFileApi} from "../../service/api"; import playBlock from '../mould/playBlock'
import funBlock from '../mould/funBlock'
import lessonContent from '../mould/lessonContent'
export default { export default {
props:[ props:[
'editorObj' 'editorObj'
], ],
components:{ components:{
editor lessonContent,
baseBlock,
lookBlock,
playBlock,
funBlock
}, },
data(){ data() {
return{ return {
selectedMould:[], activeName2:'base',
addUrl:addUrl, formData:{
showDialog:false,
imgList:[],
mouldList:MOULDLIST,
age:0,
fileUid:null,
form:{
category_id:this.editorObj.category_id,
title:'', title:'',
content:'',
min_age:0,
max_age:3,
cover:'', cover:'',
content:{
base:{},
tips:{
content:'',
title1:'',
title1_content:'',
title2:'',
title2_content:''
},
look:{
content:'',
},
play:{
type:false,
audio:[],
audio2:[],
video:[],
video2:[],
change:false,
change2:false,
age:false
},
fun:{
type:false,
audio:[],
audio2:[],
video:[],
video2:[],
change:false,
change2:false,
age:false
}
},
type:0
} }
} }
}, },
computed:{
progress(){
return this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num <100 ? this.$store.state.progressList.find(i=>{return i.id === this.fileUid}).num : 100
}
},
methods:{ methods:{
addMould(data){
this.selectedMould.push(JSON.parse(JSON.stringify(data)))
},
uploadCover(a){
this.$store.dispatch('setProgress',{type:'new',id:a.file.uid});
uploadFileApi({file:a.file,type:'local'}).then(res=>{
this.form.cover = process.env.IMAGE_URL_HEAD + res.url;
this.imgList.push({name:res.url,url:process.env.IMAGE_URL_HEAD + res.url})
})
},
onSave(){ onSave(){
if (!this.form.title) { if(this.editorObj.type===1){
this.$message({ let json = {
type: 'error', category_id:this.editorObj.category_id,
message: '请完成基本信息编辑!' title:this.formData.title,
}); content:JSON.stringify(this.formData.content),
return cover:this.formData.cover
} };
if(this.age === 0 ){ editElementApi(json,this.editorObj.id).then(res=>{
this.form.min_age = 0; this.$message({
this.form.max_age = 3 type: 'success',
}else if(this.age === 1){ message: '保存成功!'
this.form.min_age = 4;
this.form.max_age = 6
}else{
this.form.min_age = 0;
this.form.max_age = 100
}
this.form.content = JSON.stringify(this.selectedMould);
this.category_id = this.editorObj.category_id;
switch (this.editorObj.type) {
case 0:
addElementApi(this.form , '0').then(res=>{
this.$message({
type: 'success',
message: '添加成功!'
});
this.editorObj.show = false;
this.$emit('reflash')
}); });
break; this.$emit('reflash');
case 1: this.editorObj.show=false
editElementApi(this.form , this.editorObj.id).then(res=>{ })
this.$message({ }else if(this.editorObj.type===0){
type: 'success', let json = {
message: '修改成功!' category_id:this.editorObj.category_id,
}); title:this.formData.title,
this.editorObj.show = false; content:JSON.stringify(this.formData.content),
this.$emit('reflash') cover:this.formData.cover
};
addElementApi(json,0).then(res=>{
this.$message({
type: 'success',
message: '保存成功!'
}); });
} this.$emit('reflash');
}, })
initPage(){
switch (this.editorObj.type) {
case 0:
this.selectedMould=[];
this.form = {
category_id:this.editorObj.category_id,
title:'',
content:'',
cover:'',
words_num: 0
};
break;
case 1:
getElemenetDetailApi(this.editorObj.id).then(res=>{
if(res.max_age=== 3 ){
this.age = 0
}else if(res.max_age === 6){
this.age = 1
}else{
this.age = ''
}
this.form = {
category_id:res.category_id,
content:res.content,
cover:res.cover,
title:res.title,
words_num: res.words_num
};
this.selectedMould = JSON.parse(res.content)
})
} }
} }
}, },
watch:{ watch:{
'editorObj'(){ 'editorObj.show'(t){
this.initPage() if(t){
let value = this.editorObj.id
if(value){
getElemenetDetailApi(value).then(res=>{
res.content = JSON.parse(res.content);
this.formData = res
})
}else{
this.formData={
title:'',
cover:'',
content:{
base:{},
tips:{
content:'',
title1:'',
title1_content:'',
title2:'',
title2_content:''
},
look:{
content:'',
},
play:{
type:false,
audio:[],
audio2:[],
video:[],
video2:[],
change:false,
change2:false,
age:false
},
fun:{
type:false,
audio:[],
audio2:[],
video:[],
video2:[],
change:false,
change2:false,
age:false
}
},
type:0
}
}
}
} }
}, }
} }
</script> </script>
<style scoped lang="less"> <style scoped lang="less">
@import "../../util/public"; @import "../../util/public";
.el-container{
height: 900px;
overflow: auto;
.el-main{
padding: 10px;
background: #f5f8ff;
}
.main-block{
position: relative;
.main-btns {
margin-top: 68px;
margin-bottom: 10px;
}
.editor-block{
position: absolute;
top: 118px;
bottom: 0;
left: 0;
right: 0;
padding: 10px;
}
}
.left-block{
font-size: 14px;
border: 1px solid #f0f0f0;
color: #333333;
text-align: center;
.list-title{
padding: 5px;
}
.page-list{
padding: 10px 0;
background: #e8e8e8;
.box{
margin: 15px 5px;
cursor: pointer;
&:hover{
box-shadow: 0 0 20px #ff9a22;
}
img{
width: 100%;
}
}
.title{
font-size: 12px;
text-align: center;
}
&-add{
cursor: pointer;
padding: 10px 0;
font-size: 12px;
color: #CCCCCC;
}
}
}
}
</style>
<style>
.el-upload--picture-card,.el-upload-list--picture-card .el-upload-list__item{
width: 50px;
height: 50px;
line-height: 58px;
}
</style> </style>
...@@ -180,6 +180,7 @@ ...@@ -180,6 +180,7 @@
}); });
return false return false
} }
let str = `<p style="text-align: center"><img class="mce-object mce-object-audio" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="280" height="55" data-mce-p-controls="controls" data-mce-html="%0A%3Csource%20src%3D%22https%3A//cdn.singsingenglish.com/${this.radio[0].url}%22%20type%3D%22audio/mpeg%22%20/%3E" data-mce-object="audio"></p>`; let str = `<p style="text-align: center"><img class="mce-object mce-object-audio" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="280" height="55" data-mce-p-controls="controls" data-mce-html="%0A%3Csource%20src%3D%22https%3A//cdn.singsingenglish.com/${this.radio[0].url}%22%20type%3D%22audio/mpeg%22%20/%3E" data-mce-object="audio"></p>`;
console.log(str); console.log(str);
this.insertContent(str); this.insertContent(str);
......
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