Commit 2637e618 authored by Chen Jiping's avatar Chen Jiping

完成模板

parent 7b9a904b
......@@ -128,5 +128,8 @@
}
}
},
"defaultProject": "ng-template-generator"
"defaultProject": "ng-template-generator",
"cli": {
"analytics": "1f204c63-0345-49a5-a648-061ecc332858"
}
}
\ No newline at end of file
<div class="model-content">
<div style="position: absolute; left: 200px; top: 100px; width: 800px;">
<input type="text" nz-input [(ngModel)]="item.text" (blur)="save()">
<div nz-row>
<div nz-col nzOffset="2" [nzSpan]="16">
<div nz-row>
<div nz-col nzOffset='4' [nzSpan]="12"><h1 nz-title>课程内容编辑</h1></div>
</div>
<div nz-form>
<div id='title-anchor'>
<nz-divider nzText="课程名称" nzOrientation="left"></nz-divider>
<nz-form-item>
<nz-form-label [nzSpan]="3" nzFor="val1">标题1</nz-form-label>
<nz-form-control [nzSpan]="6">
<nz-input-group nzAddOnBefore="Part">
<input type="text" id="val1" nz-input [(ngModel)]="item.title.val1" (blur)="save()">
</nz-input-group>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="3" nzFor="val2">标题2</nz-form-label>
<nz-form-control [nzSpan]="6">
<input nz-input type="text" id="val2" [(ngModel)]="item.title.val2" (blur)="save()">
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="3" nzFor="audioUrl">发音</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder
[audioUrl]="item.title.audioUrl" id="audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, item.title, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
</div>
<div id='listen-anchor'>
<nz-divider nzText="听力材料" nzOrientation="left"></nz-divider>
<nz-form-item>
<nz-form-control [nzSpan]="6" nzOffset="3">
<app-audio-recorder id="item.listenAudioUrl"
[audioUrl]="item.listenAudioUrl"
(audioUploaded)="onAudioUploadSuccess($event, item, 'listenAudioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
</div>
<div id='word-anchor'>
<nz-divider nzText="单词信息" nzOrientation="left"></nz-divider>
<div *ngFor="let exercises of item.exercisesArr; let i = index">
<nz-card nzType="inner" style="margin-top:16px;" nzTitle="单词 {{i + 1}}">
<div nz-form id="word-anchor-{{i + 1}}">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="world">单词</nz-form-label>
<nz-form-control [nzSpan]="6">
<input type="text" nz-input placeholder="Please input word" [(ngModel)]="exercises.word" (blur)="save()">
</nz-form-control>
<nz-form-label [nzSpan]="6" nzFor="answerIndex">答案顺序</nz-form-label>
<nz-form-control [nzSpan]="4">
<input type="number" max='4' min="1" nz-input [(ngModel)]="exercises.answerIndex" (blur)="save()">
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="picUrl">图片</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')"
style="width: 100%"
[picUrl]="exercises.picUrl"
(imageUploaded)="onImageUploadSuccess($event, exercises, 'picUrl')"
></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>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="audioUrl">发音</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="exercises.audioUrl"
[audioUrl]="exercises.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, exercises, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词组合</nz-form-label>
<nz-form-control [nzSpan]="6">
<input type="text" nz-input [(ngModel)]="exercises.letterCombinations.val" placeholder="Please input letter combinations" (blur)="save()">
</nz-form-control>
<nz-form-label [nzSpan]="6">单词组合发音</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="exercises.letterCombinations.audioUrl"
[audioUrl]="exercises.letterCombinations.audioUrl"
(audioUploaded)="onAudioUploadSuccess($event, exercises.letterCombinations, 'audioUrl')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6">单词拆分</nz-form-label>
<nz-form-control [nzSpan]="12">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
(click)="addLetter(exercises)">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-control [nzOffset]="2" [nzSpan]="16">
<nz-table #lettersTable nzBordered nzTitle="按照单词填空需要进行拆分填写" [nzData]="exercises.letters" [nzShowPagination]=false>
<thead>
<tr>
<th>序号</th>
<th>字母组合</th>
<th>是否填空字母</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of lettersTable.data;let j = index">
<td>{{ j+1 }}</td>
<td><input type="text" nz-input placeholder="请录入字母(组合)" [(ngModel)]="data.val" (blur)="save()"></td>
<td>
<nz-radio-group [(ngModel)]="data.isFill" (ngModelChange)="save()">
<label nz-radio nzValue="1"></label>
<label nz-radio nzValue="0"></label>
</nz-radio-group>
</td>
<td>
<a (click)="delLetter(exercises, j)">delete</a>
</td>
</tr>
</tbody>
</nz-table>
</nz-form-control>
</nz-form-item>
</div>
</nz-card>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
......@@ -10,7 +10,7 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap
export class FormComponent implements OnInit, OnChanges, OnDestroy {
// 储存数据用
saveKey = "test_0011";
saveKey = "YM-22";
// 储存对象
item;
......@@ -51,16 +51,64 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
init() {
if(!this.item.title){
this.item.title = {};
}
if(!this.item.exercisesArr){
this.item.exercisesArr = [];
//初始化四道练习题
for(let i = 0; i < 4; ++ i){
let exercises = this.getDefaultExercises();
this.item.exercisesArr.push(exercises);
}
}
console.log('data', this.item);
}
/**
* 获取默认练习题
*/
getDefaultExercises(){
let exercises = {
audioUrl:'',
picUrl:'',
world:'',
answerIndex:null,
letterCombinations:{
val:'',
audioUrl:''
},
letters:[]
};
return exercises;
}
/**
* 获取默认的字母
*/
getDefaultLetter(){
let letter = {
val:'',
isFill:'0'
};
return letter;
}
/**
* 储存图片数据
* @param e
*/
onImageUploadSuccess(e, key) {
onImageUploadSuccess(e, item, key) {
this.item[key] = e.url;
item[key] = e.url;
this.save();
}
......@@ -68,19 +116,35 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存音频数据
* @param e
*/
onAudioUploadSuccess(e, key) {
onAudioUploadSuccess(e, item, key) {
this.item[key] = e.url;
item[key] = e.url;
this.save();
}
addLetter(exercises) {
let letter = this.getDefaultLetter();
exercises.letters = [...exercises.letters, letter];
this.save();
}
delLetter(exercises, index) {
if (index !== -1) {
exercises.letters.splice(index, 1);
exercises.letters = [...exercises.letters];
this.save();
}
}
/**
* 储存数据
*/
save() {
(<any> window).courseware.setData(this.item, null, this.saveKey);
this.changeDetectorRef.detectChanges();
this.refresh();
}
......
import {
Label,
MySprite, ShapeRect
} from './Unit';
export class Exercises {
/**练习题背景 */
bg: ShapeRect = null;
/**单词背景 */
wordBg: MySprite = null;
/**小黄圈内单词组合 */
letterCombinations: MySprite = null;
/**答案顺序标签 */
answerIndexLabel: Label = null;
answerShowed = false;
/**单词图片 */
wordPic : MySprite = null;
/**单词拆分背景 */
wordSplitPic:ShapeRect = null;
/**单词发音 */
wordAudioUrl:'';
/**字母(组合)发音 */
letterAudioUrl:'';
/**单词拆分的字母(组合) */
letterArr = [];
showed = false;
setShow(){
for(let i = 0; i < this.letterArr.length; ++ i){
this.letterArr[i].alpha = 1;
this.letterArr[i].fontColor = '#C8161E';
}
this.showed = true;
}
}
\ No newline at end of file
......@@ -17,3 +17,14 @@
src: url("../../assets/font/BRLNSDB.TTF") ;
}
@font-face
{
font-family: 'FUTURAB';
src: url("../../assets/font/FUTURAB.TTF") ;
}
@font-face
{
font-family: 'MMTextBook-Bold';
src: url("../../assets/font/MMTextBook-Bold.otf") ;
}
\ No newline at end of file
This diff is collapsed.
const res = [
// ['bg', "assets/play/bg.jpg"],
['btn_left', "assets/play/btn_left.png"],
['btn_right', "assets/play/btn_right.png"],
// ['text_bg', "assets/play/text_bg.png"],
['play', "assets/play/play.png"],
['stop', "assets/play/stop.png"],
['titlePart1Bg', "assets/play/title-part1-bg.png"],
['wordBgL', "assets/play/word_bg_l.png"],
['wordBgM', "assets/play/word_bg_m.png"],
['wordBgS', "assets/play/word_bg_s.png"],
['letter', "assets/play/letter.png"],
['answer', "assets/play/answer.png"],
];
......
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