Commit 54c7c94b authored by 邵世尧's avatar 邵世尧

提交

parent 3695f7ce
...@@ -128,5 +128,8 @@ ...@@ -128,5 +128,8 @@
} }
} }
}, },
"defaultProject": "ng-template-generator" "defaultProject": "ng-template-generator",
} "cli": {
"analytics": "e7311e9d-af0d-4d41-a1ad-7a7b3902a73a"
}
}
\ No newline at end of file
<div class="model-content"> <div class="model-content">
<div nz-row>
<div nz-col nzOffset='4'>
<h1 nz-title>课程内容编辑</h1>
</div>
</div>
<div nz-form>
<nz-divider nzText="课程标题" nzOrientation="left"></nz-divider>
<nz-form-label nzFor="t_val1">标题1</nz-form-label>
<input style="width: 80%; margin-bottom: 0.5vw" type="text" nz-input placeholder="" [(ngModel)]="item.title.t_val1" (blur)="save()">
<br><nz-form-label nzFor="t_val2">标题2</nz-form-label>
<input style="width: 80%; margin-bottom: 0.5vw" type="text" nz-input placeholder="" [(ngModel)]="item.title.t_val2" (blur)="save()">
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="item.title.audio_url" [audioUrl]="item.title.audio_url"
(audioUploaded)="onAudioUploadSuccessByItem($event, item.title,'audio_url')">
</app-audio-recorder>
</nz-form-control>
<nz-divider nzText="总音频" nzOrientation="left"></nz-divider>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="item.title.allmusic_audio" [audioUrl]="item.title.allmusic_audio"
(audioUploaded)="onAudioUploadSuccessByItem($event, item.title,'allmusic_audio')">
</app-audio-recorder>
</nz-form-control>
<div style="position: absolute; left: 200px; top: 100px; width: 800px;">
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<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>
<div>
\ No newline at end of file <nz-divider nzText="句子" nzOrientation="left"></nz-divider>
<nz-form-item>
<nz-form-control [nzSpan]="20" nzOffset="2">
<div *ngFor="let it of wordArr; let i = index" class="card-item" style="padding: 0.5vw;">
<div class="border">
<h5 style="width: 100%; line-height: 40px; text-align: center;"> 句组-{{i+1}}</h5>
<div nz-form>
<nz-form-item>
<nz-radio-group [(ngModel)]="it.left.num" (ngModelChange)="save()">
<label nz-radio nzValue="Y"></label>
<label nz-radio nzValue="N"></label>
</nz-radio-group>
<div *ngIf="it.num== 'Y'" style="width: 33%">
<nz-form-label nzFor="xuhao">序号</nz-form-label>
<input style="width: 20%; margin-bottom: 0.5vw" type="text" nz-input placeholder="" [(ngModel)]="it.xuhao" (blur)="saveItem()">
</div>
<div *ngIf="it.num== 'N'" style="width: 80%">
<br>
</div>
<nz-form-label [nzSpan]="3" nzFor="it.left.word_val">句子</nz-form-label>
<nz-form-control [nzSpan]="20">
<input type="text" nz-input placeholder="请录入句子" [(ngModel)]="it.left.word_val"
(blur)="saveWordItem(i,'left')">
</nz-form-control>
</nz-form-item>
<div style="width: 100%;">
<app-upload-image-with-preview id="it.left.word_pic_url"
[picUrl]="it.left.word_pic_url"
(imageUploaded)="onImageUploadSuccessByItem($event, it.left,'word_pic_url')"
></app-upload-image-with-preview>
</div>
<nz-form-item>
<nz-form-label [nzSpan]="3" nzFor="it.audio_url">发音</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="it.audio_url" [audioUrl]="it.audio_url"
(audioUploaded)="onAudioUploadSuccessByItem($event, it,'audio_url')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<div nz-col [nzSpan]="15" nzOffset="2">
<nz-table [nzData]="it.left.letters" [nzHideOnSinglePage]="true" [nzBordered]="true">
<thead>
<tr>
<th>单词</th>
<th>颜色</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of it.left.letters;let j = index">
<td>{{data.letter_val}}</td>
<td>
<nz-select [(ngModel)]="data.letter_color" (ngModelChange)="saveItem()">
<!--<nz-option nzValue="C01" nzLabel="绿色"></nz-option>-->
<nz-option nzValue="C02" nzLabel="红色"></nz-option>
<!--<nz-option nzValue="C03" nzLabel="巧克力色"></nz-option>-->
<nz-option nzValue="C04" nzLabel="黑色"></nz-option>
</nz-select>
</td>
</tr>
</tbody>
</nz-table>
</div>
</nz-form-item>
</div>
<button style="margin: 10px;" nz-button nzType="danger" (click)="deleteItem(i)">
<span>删除</span>
</button>
</div>
</div>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-control [nzSpan]="3" nzOffset="3" class="add-btn-box">
<button nz-button nzType="dashed" class="add-btn" id="add-btn" (click)="addItem()">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
</div>
</div>
</div>
\ No newline at end of file
import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef, ChangeDetectorRef} from '@angular/core'; import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, ApplicationRef, ChangeDetectorRef, ViewChild, ElementRef} from '@angular/core';
import { NzMessageService } from 'ng-zorro-antd';
...@@ -10,11 +11,13 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap ...@@ -10,11 +11,13 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
export class FormComponent implements OnInit, OnChanges, OnDestroy { export class FormComponent implements OnInit, OnChanges, OnDestroy {
// 储存数据用 // 储存数据用
saveKey = "test_0011"; saveKey = "ym-23";
// 储存对象 // 储存对象
item; item;
wordArr = [];
num
constructor(private appRef: ApplicationRef,private changeDetectorRef: ChangeDetectorRef) { constructor(private appRef: ApplicationRef,private changeDetectorRef: ChangeDetectorRef) {
} }
...@@ -22,19 +25,39 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -22,19 +25,39 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
ngOnInit() { ngOnInit() {
this.item = {}; this.item = {};
this.item.title = {
t_val1:"",
t_val2:"",
audio_url:"",
allmusic_audio:""
};
this.item.wordArr=[];
// 获取存储的数据 // 获取存储的数据
(<any> window).courseware.getData((data) => { (<any> window).courseware.getData((data) => {
if (data) { if (data) {
console.log('~data:', data);
this.item = data; this.item = data;
} }
if ( !this.item.wordArr ) {
this.item.wordArr = [];
}
console.log('~data:', data);
this.init(); this.init();
this.changeDetectorRef.markForCheck(); this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
this.refresh(); this.refresh();
console.log('~data:', data);
}, this.saveKey); }, this.saveKey);
...@@ -51,6 +74,23 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -51,6 +74,23 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
init() { init() {
//标题
if(!this.item.title){
this.item.title = {
t_val1:"",
t_val2:"",
audio_url:"",
allmusic_audio:"",
};
}
if (this.item.wordArr) {
this.wordArr = this.item.wordArr;
} else {
this.wordArr = this.getDefaultWordArr();
this.item.wordArr = this.wordArr;
}
} }
...@@ -68,13 +108,20 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -68,13 +108,20 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存音频数据 * 储存音频数据
* @param e * @param e
*/ */
onAudioUploadSuccess(e, key) { onAudioUploadSuccess(e, item, key) {
item[key] = e.url;
this.item[key] = e.url;
this.save(); this.save();
} }
onAudioUploadSuccessByItem(e, item, key) {
item[key] = e.url;
this.save();
}
onImageUploadSuccessByItem(e, item,key) {
item[key] = e.url;
this.save();
}
/** /**
* 储存数据 * 储存数据
...@@ -93,5 +140,93 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -93,5 +140,93 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}, 1); }, 1);
} }
deleteItem(index) {
if (index !== -1) {
this.wordArr.splice(index, 1);
}
// this.update.emit(this.item);
this.save();
}
addItem() {
if(this.wordArr.length<4){
let item = this.wordItemData();
this.wordArr.push(item);
}
this.saveItem();
/*暂时注销
let item = this.wordItemData();
this.wordArr.push(item);
this.saveItem();*/
}
// addLetterItem(letters){
// let letter = this.letterData();
// letters.push(letter);
// this.save();
// }
deleteLetterItem(letters, index){
console.log(letters);
if (index !== -1) {
letters.splice(index, 1);
}
this.save();
}
wordItemData() {
return {
left: {
word_val: '',
letters: [],
word_pic_url:'',
num:'Y',
},
audio_url: '',
};
}
// letterData() {
// return {
// letter_val: '',
// letter_color: 'C04',
// is_: false
// };
// }
saveWordItem(index,type) {
let val = this.wordArr[index][type].word_val.split(" ");
this.wordArr[index][type].letters = [];
for(let i=0;i<val.length;i++){
if(val[i]){
this.wordArr[index][type].letters.push({
letter_val: val[i],
letter_color: 'C04',
letter_font: 'BRLNSDB',
is_: '0'
});
}
}
this.save();
}
saveItem() {
this.save();
}
getDefaultWordArr() {
let arr = [];
return arr;
}
} }
...@@ -16,4 +16,14 @@ ...@@ -16,4 +16,14 @@
font-family: 'BRLNSDB'; font-family: 'BRLNSDB';
src: url("../../assets/font/BRLNSDB.TTF") ; src: url("../../assets/font/BRLNSDB.TTF") ;
} }
@font-face
{
font-family: 'FUTURAB';
src: url("../../assets/font/FUTURAB.TTF") ;
}
@font-face
{
font-family: 'GOTHICB_1';
src: url("../../assets/font/GOTHICB_1.TTF") ;
}
\ No newline at end of file
This diff is collapsed.
const res = [ const res = [
// ['bg', "assets/play/bg.jpg"], ['bg', "assets/play/bg.png"],
['btn_left', "assets/play/btn_left.png"], ['title1', "assets/play/Rectangle 3.png"],
['btn_right', "assets/play/btn_right.png"], ['juzi', "assets/play/Rectangle 2.png"],
// ['text_bg', "assets/play/text_bg.png"], ['stop', "assets/play/暂停键.png"],
['start', "assets/play/播放按钮.png"],
['dhBg', "assets/play/dhbg.png"],
['dh', "assets/play/dh.png"],
// ['text_bg', "assets/play/text_bg.png"],
]; ];
...@@ -11,7 +19,9 @@ const res = [ ...@@ -11,7 +19,9 @@ const res = [
const resAudio = [ const resAudio = [
['click', "assets/play/music/click.mp3"], ['audio', "assets/play/music/audio.mp3"],
['click', "assets/play/music/click.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