Commit 6968ff34 authored by hw_023_test's avatar hw_023_test

test commit

parent 3695f7ce
......@@ -128,5 +128,8 @@
}
}
},
"defaultProject": "ng-template-generator"
}
"defaultProject": "ng-template-generator",
"cli": {
"analytics": false
}
}
\ No newline at end of file
......@@ -22,8 +22,8 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy {
@Input()
withRmBtn = false;
uploadUrl;
uploadData;
uploadUrl = (window as any).courseware.uploadUrl();
uploadData = (window as any).courseware.uploadData();
@Input()
needRemove = false;
......@@ -55,13 +55,7 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy {
constructor( private nzMessageService: NzMessageService ) {
this.uploadUrl = (<any> window).courseware.uploadUrl();
this.uploadData = (<any> window).courseware.uploadData();
window['air'].getUploadCallback = (url, data) => {
this.uploadUrl = url;
this.uploadData = data;
};
}
init() {
......
......@@ -29,19 +29,10 @@ export class UploadImageWithPreviewComponent implements OnDestroy, OnChanges {
@Input()
disableUpload = false;
uploadUrl;
uploadData;
uploadUrl = (<any> window).courseware.uploadUrl();
uploadData = (<any> window).courseware.uploadData();
constructor(private nzMessageService: NzMessageService) {
this.uploadUrl = (<any> window).courseware.uploadUrl();
this.uploadData = (<any> window).courseware.uploadData();
window['air'].getUploadCallback = (url, data) => {
this.uploadUrl = url;
this.uploadData = data;
};
}
ngOnChanges() {
if (!this.picItem) {
......
......@@ -47,8 +47,8 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
item: any;
// videoItem = null;
uploadUrl;
uploadData;
uploadUrl = (window as any).courseware.uploadUrl();
uploadData = (window as any).courseware.uploadData();
constructor(private nzMessageService: NzMessageService,
private sanitization: DomSanitizer
......@@ -58,16 +58,6 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
this.uploading = false;
this.videoFile = null;
this.uploadUrl = (<any> window).courseware.uploadUrl();
this.uploadData = (<any> window).courseware.uploadData();
window['air'].getUploadCallback = (url, data) => {
this.uploadUrl = url;
this.uploadData = data;
};
}
ngOnChanges() {
// if (!this.videoFile || this.showUploadBtn) {
......
@import '../style/common_mixin.css';
.model-content {
width: 100%;
height: 100%;
}
<div class="model-content">
<div class="question-box">
<h2>请填写题目以及对应音频</h2>
<div class="question-content">
<div class="question-text">
<input type="text" nz-input placeholder="点击输入题目" [(ngModel)]="item.contentObj.question_text" (blur)="save()">
</div>
<div class="question-audio">
<app-audio-recorder
[audioUrl] = "item.contentObj.question_audio"
(audioUploaded) = "onQAudioUploadSuccessByItem($event,item)"
></app-audio-recorder>
</div>
</div>
</div>
<div class="split-line"></div>
<div class="card">
<h2>请上传图片,上传音频并按顺序填写单词及相对应音频</h2>
<div *ngFor="let it of picArr;let i = index" nz-col nzSpan = "8" class="card-contents">
<div class="card-box">
<h5 style="font-weight: 700;"> 第{{i+1}}页 </h5>
<div class="card-content">
<div class="card-pic">
<app-upload-image-with-preview
[picUrl] = "it['pic_url']"
(imageUploaded) = "onImageUploadSuccessByItem($event,it)"
></app-upload-image-with-preview>
</div>
<div class="card-audio">
<app-audio-recorder
[audioUrl] = "it.audio_url"
(audioUploaded) = "onAudioUploadSuccessByItem($event,it)"
class="audio"
></app-audio-recorder>
</div>
<div class="card-text">
<div class="card-text-item" *ngFor="let word of it.wordArr;let j = index">
<input type="text" nz-input placeholder="点击输入单词" [(ngModel)]="word.text" (blur)="saveItem()" class="item">
<app-audio-recorder
[audioUrl] = "word.audio_url"
(audioUploaded) = "onAudioUploadSuccessByItem($event,word)"
class="item"
></app-audio-recorder>
</div>
<button nz-button nzType="primary" class="add-word-btn" (click)="addWord(it)">添加单词</button>
</div>
</div>
<button style="margin-bottom: 10px;" nz-button nzType="danger" (click)="deleteItem(it)">删除这一页</button>
</div>
</div>
</div>
<div style="position: absolute; left: 200px; top: 100px; width: 800px;">
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<div nz-col nzSpan="1" class="add-btn-box">
<button nz-button nzType="dashed" class="add-btn" (click)="addPic()">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加一组
</button>
</div>
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')"
></app-upload-image-with-preview>
<app-audio-recorder
[audioUrl]="item.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'audio_url')"
></app-audio-recorder>
<app-custom-hot-zone></app-custom-hot-zone>
<app-upload-video></app-upload-video>
<app-lesson-title-config></app-lesson-title-config>
</div>
</div>
\ No newline at end of file
@import '../style/common_mixin';
.model-content {
width: 100%;
max-width: 1080px;
height: auto;
box-sizing: border-box;
padding: 20px;
border: 1px dashed #1E90FF;
overflow: hidden;
margin: 0 auto;
.question-box{
.question-content{
.question-text{
margin-bottom: 10px;
}
}
}
.split-line{
width: 100%;
height: 1px;
margin-top: 10px;
margin-bottom: 10px;
border: 1px dashed #1E90FF;
}
.card{
.card-contents{
width: 100%;
margin-top: 10px;
.card-box{
// width: 30vw;
width: 100%;
border: 1px dashed #ccc;
box-sizing: border-box;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
border-radius: 5px;
.card-content{
width: 90%;
height: 100%;
.card-pic{
width: 100%;
margin: auto;
}
.card-audio{
width: 100%;
margin-top: 10px;
display: flex;
justify-content: center;
}
.card-text{
width: 100%;
margin: auto;
margin-top: 10px;
margin-bottom: 10px;
.card-text-item{
width: 100%;
display: flex;
input{
margin-bottom: 10px;
margin-right: 10px;
}
}
.add-word-btn{
width: 100%;
}
}
}
}
}
}
.add-btn-box{
width: 100%;
text-align: center;
margin-top: 10px;
margin-bottom: 10px;
.add-btn{
}
}
}
......@@ -5,17 +5,40 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
@Component({
selector: 'app-form',
templateUrl: './form.component.html',
styleUrls: ['./form.component.css']
styleUrls: ['./form.component.scss']
})
export class FormComponent implements OnInit, OnChanges, OnDestroy {
picArr = [];
// wordArr = [];
// 储存数据用
saveKey = "test_0011";
saveKey = 'test_0011';
// 储存对象
item;
_item: any;
KEY = 'test_0011';
constructor(private appRef: ApplicationRef,private changeDetectorRef: ChangeDetectorRef) {
// @Input()
set item(item) {
this._item = item;
// this.init();
}
get item() {
return this._item;
}
@Output()
update = new EventEmitter();
constructor(private appRef: ApplicationRef,
public changeDetectorRef: ChangeDetectorRef) {
}
......@@ -23,70 +46,216 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
ngOnInit() {
this.item = {};
this.item.contentObj = {};
// 获取存储的数据
(<any> window).courseware.getData((data) => {
const getData = (<any> window).courseware.getData;
getData((data) => {
if (data) {
this.item = data;
// this.item.contentObj.picArr.forEach(ele => {
// ele.wordArr = [];
// console.log('item', ele);
// });
} else {
this.item = {};
}
if ( !this.item.contentObj ) {
this.item.contentObj = {};
}
// console.log('~data:', data);
this.init();
this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges();
this.refresh();
}, this.saveKey);
}, this.KEY);
// this.initData();
}
ngOnChanges() {
}
ngOnDestroy() {
}
init() {
if (this.item.contentObj.picArr) {
this.picArr = this.item.contentObj.picArr;
} else {
this.picArr = this.getDefaultPicArr();
this.item.contentObj.picArr = this.picArr;
}
// if (this.item.contentObj.picArr.wordArr) {
// this.wordArr = this.item.contentObj.picArr.wordArr;
// } else {
// this.wordArr = this.getDefaultPicArr();
// this.item.contentObj.picArr.wordArr = this.wordArr;
// }
console.log('item:' , this.item);
// console.log('This', this.item.contentObj.picArr);
// this.picArr = this.getDefaultPicArr();
// this.item.contentObj.picArr = this.picArr;
// console.log('this.item:;', this.picArr);
}
getDefaultPicArr() {
const arr = [];
// for (let i = 0; i < 4; i ++) {
// const data = {};
// data['pic_url'] = '';
//
// const soundArr = [];
// for (let i = 0; i < 3; i++) {
// const tmpData = {};
// tmpData['answer'] = false;
// tmpData['audio_url'] = '';
// soundArr.push(tmpData);
// }
// data['soundArr'] = soundArr;
//
// arr.push(data);
// }
return arr;
}
initData() {
}
deleteItem(data) {
const index = this.picArr.indexOf(data);
if (index !== -1) {
this.picArr.splice(index, 1);
}
// this.update.emit(this.item);
this.save();
}
/**
* 储存图片数据
* @param e
*/
onImageUploadSuccess(e, key) {
this.item[key] = e.url;
this.save();
onImageUploadSuccessByItem(e, item, id = null) {
if (id != null) {
item[id + '_pic_url'] = e.url;
} else {
item.pic_url = e.url;
}
this.save();
// this.update.emit(this.item);
// console.log('this.item: ', this.item);
}
onAudioUploadSuccessByItem(e, item, id = null) {
if (id != null) {
item[id + '_audio_url'] = e.url;
} else {
item.audio_url = e.url;
}
// this.update.emit(this.item);
this.save();
}
/**
* 储存音频数据
* @param e
*/
onAudioUploadSuccess(e, key) {
onQAudioUploadSuccessByItem(e, item, id = null) {
this.item[key] = e.url;
if (id != null) {
item[id + '_contentObj.question_audio'] = e.url;
} else {
item.contentObj.question_audio = e.url;
}
// this.update.emit(this.item);
this.save();
}
addPic() {
this.picArr.push({
pic_url: '',
audio_url: '',
// text: '',
// radioValue: 'true',
wordArr: [],
});
this.saveItem();
}
addWord(data) {
// this.wordArr.push({
// text: '',
// });
const index = this.picArr.indexOf(data);
console.log(index);
// this.picArr.forEach(ele => {
// ele.wordArr.push({text: ''});
// });
this.picArr[index].wordArr.push({text: ''});
this.saveItem();
}
// radioClick(it, radioValue) {
// it.radioValue = radioValue;
/**
* 储存数据
*/
// this.saveItem();
// }
clickCheckBox() {
console.log(' in clickCheckBox');
this.saveItem();
}
saveItem() {
// this.update.emit(this.item);
console.log('start');
this.save();
console.log(this.picArr);
}
saveNew(i) {
if(this.item.contentObj.picArr[i].optionType === "A"){
delete this.item.contentObj.picArr[i].pic_url
} else {
delete this.item.contentObj.picArr[i].text
}
(<any> window).courseware.setData(this.item, null, this.KEY);
}
save() {
(<any> window).courseware.setData(this.item, null, this.saveKey);
(<any> window).courseware.setData(this.item, null, this.KEY);
this.refresh();
}
/**
* 刷新 渲染页面
*/
refresh() {
setTimeout(() => {
this.appRef.tick();
......
This diff is collapsed.
......@@ -3,15 +3,32 @@ const res = [
// ['bg', "assets/play/bg.jpg"],
['btn_left', "assets/play/btn_left.png"],
['btn_right', "assets/play/btn_right.png"],
['Rectangle@2x','assets/play/Rectangle@2x.png'],
['Sound_Close_Btn@2x','assets/play/Sound_Close_Btn@2x.png'],
['Bg_Mask@2x','assets/play/Bg_Mask@2x.png'],
['Rectangle_3@2x','assets/play/Rectangle_3@2x.png'],
['Sound_Open_Btn@2x','assets/play/Sound_Open_Btn@2x.png'],
['Rectangle_4@2x','assets/play/Rectangle_4@2x.png'],
['Word_Card_Box@2x','assets/play/Word_Card_Box@2x.png'],
['Checked_Spot','assets/play/Checked_Spot.png'],
['Unchecked_Spot','assets/play/Unchecked_Spot.png'],
['star','assets/play/star.png'],
['petal_1', "assets/default/petal_1.png"],
['petal_2', "assets/default/petal_2.png"],
['petal_3', "assets/default/petal_3.png"],
// ['text_bg', "assets/play/text_bg.png"],
];
const resAudio = [
['click', "assets/play/music/click.mp3"],
['finish', "assets/play/music/finish.mp3"],
['star', "assets/play/music/star.mp3"],
['wrong', "assets/play/music/wrong.mp3"],
];
......
This diff is collapsed.
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