Commit b60ce741 authored by Li Mingzhe's avatar Li Mingzhe

feat:首次提交

parent 8a51c964
...@@ -128,5 +128,8 @@ ...@@ -128,5 +128,8 @@
} }
} }
}, },
"defaultProject": "ng-template-generator" "defaultProject": "ng-template-generator",
} "cli": {
"analytics": "0be521b1-4907-457d-9a8c-d0f5b1a1ea35"
}
}
\ No newline at end of file
This diff is collapsed.
import { ErrorHandler } from '@angular/core';
export class MyErrorHandler implements ErrorHandler {
handleError(error) {
console.log(error.stack);
(<any> window).courseware.sendErrorLog(error);
}
}
\ No newline at end of file
import { BrowserModule } from '@angular/platform-browser'; import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core'; import { NgModule } from '@angular/core';
import {MyErrorHandler} from './MyError';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { NgZorroAntdModule, NZ_I18N, zh_CN } from 'ng-zorro-antd'; import { NgZorroAntdModule, NZ_I18N, zh_CN } from 'ng-zorro-antd';
...@@ -52,10 +50,7 @@ registerLocaleData(zh); ...@@ -52,10 +50,7 @@ registerLocaleData(zh);
BrowserAnimationsModule, BrowserAnimationsModule,
FontAwesomeModule FontAwesomeModule
], ],
providers: [ providers: [{ provide: NZ_I18N, useValue: zh_CN }],
{provide: ErrorHandler, useClass: MyErrorHandler},
{ provide: NZ_I18N, useValue: zh_CN }
],
bootstrap: [AppComponent] bootstrap: [AppComponent]
}) })
export class AppModule { export class AppModule {
......
...@@ -22,8 +22,8 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { ...@@ -22,8 +22,8 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy {
@Input() @Input()
withRmBtn = false; withRmBtn = false;
uploadUrl; uploadUrl = (window as any).courseware.uploadUrl();
uploadData; uploadData = (window as any).courseware.uploadData();
@Input() @Input()
needRemove = false; needRemove = false;
...@@ -55,13 +55,7 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy { ...@@ -55,13 +55,7 @@ export class AudioRecorderComponent implements OnInit, OnChanges, OnDestroy {
constructor( private nzMessageService: NzMessageService ) { 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() { init() {
......
This diff is collapsed.
<div class="p-image-children-editor"> <div class="p-image-children-editor">
<h5 style="margin-left: 2.5%;"> preview: </h5> <h5 style="margin-left: 2.5%;"> preview: </h5>
<div class="preview-box" #wrap> <div class="preview-box" #wrap>
<canvas id="canvas" #canvas></canvas> <canvas id="canvas" #canvas></canvas>
</div> </div>
<div nz-row nzType="flex" nzAlign="middle"> <div nz-row nzType="flex" nzAlign="middle">
<div nz-col nzSpan="5" nzOffset="1"> <div nz-col nzSpan="5" nzOffset="1">
...@@ -17,53 +20,41 @@ ...@@ -17,53 +20,41 @@
(imageUploaded)="onBackgroundUploadSuccess($event)"> (imageUploaded)="onBackgroundUploadSuccess($event)">
</app-upload-image-with-preview> </app-upload-image-with-preview>
</div> </div>
</div> </div>
<div nz-col nzSpan="5" nzOffset="1" class="img-box"
*ngFor="let it of hotZoneArr; let i = index">
<div
style="margin: auto; padding: 5px; margin-top: 30px; width:90%; border: 2px dashed #ddd; border-radius: 10px">
<span style="margin-left: 40%;"> item-{{i + 1}}
</span>
<button style="float: right;" nz-button nzType="danger" nzSize="small" (click)="deleteBtnClick(i)">
X
</button>
<nz-divider style="margin-top: 10px;"></nz-divider> <div nz-col nzSpan="5" nzOffset="1" class="img-box"
*ngFor="let it of hotZoneArr; let i = index" >
<div style=" height: 40px;">
<h5> item-{{i+1}}
<i style="margin-left: 20px; margin-top: 2px; float: right; cursor:pointer" (click)="deleteItem($event, i)"
nz-icon [nzTheme]="'twotone'" [nzType]="'close-circle'" [nzTwotoneColor]="'#ff0000'"></i>
</h5>
</div>
<div style="margin-top: -20px; margin-bottom: 5px">
<nz-radio-group [ngModel]="it.itemType" (ngModelChange)="radioChange($event, it)">
<label *ngIf="isHasRect" nz-radio nzValue="rect">矩形</label>
<label *ngIf="isHasPic" nz-radio nzValue="pic">图片</label>
<label *ngIf="isHasText" nz-radio nzValue="text">文本</label>
</nz-radio-group>
</div>
<div *ngIf="it.itemType == 'pic'"> <!--<div class="img-box-upload">-->
<app-upload-image-with-preview <!--<app-upload-image-with-preview-->
[picUrl]="it?.pic_url" <!--[picUrl]="it.pic_url"-->
(imageUploaded)="onItemImgUploadSuccess($event, it)"> <!--(imageUploaded)="onImgUploadSuccessByImg($event, it)">-->
</app-upload-image-with-preview> <!--</app-upload-image-with-preview>-->
</div> <!--</div>-->
<div *ngIf="it.itemType == 'text'">
<input type="text" nz-input [(ngModel)]="it.text" (blur)="saveText(it)">
</div>
<div style="width: 100%; margin-top: 5px;"> <!--<app-audio-recorder-->
<app-audio-recorder <!--[audioUrl]="it.audio_url ? it.audio_url : null "-->
[audioUrl]="it.audio_url" <!--(audioUploaded)="onAudioUploadSuccessByImg($event, it)"-->
(audioUploaded)="onItemAudioUploadSuccess($event, it)" <!--&gt;</app-audio-recorder>-->
></app-audio-recorder>
</div>
</div>
</div> </div>
<div nz-col nzSpan="5" nzOffset="1"> <div nz-col nzSpan="5" nzOffset="1">
<div class="bg-box"> <div class="bg-box">
...@@ -84,7 +75,7 @@ ...@@ -84,7 +75,7 @@
<div class="save-box"> <div class="save-box">
<button class="save-btn" nz-button nzType="primary" [nzSize]="'large'" nzShape="round" <button class="save-btn" nz-button nzType="primary" [nzSize]="'large'" nzShape="round"
(click)="saveClick()" > (click)="saveClick()">
<i nz-icon nzType="save"></i> <i nz-icon nzType="save"></i>
Save Save
</button> </button>
...@@ -92,9 +83,7 @@ ...@@ -92,9 +83,7 @@
</div> </div>
</div>
<label style="opacity: 0; position: absolute; top: 0px; font-family: 'BRLNSR_1'">1</label> </div>
...@@ -87,13 +87,6 @@ h5 { ...@@ -87,13 +87,6 @@ h5 {
@font-face
{
font-family: 'BRLNSR_1';
src: url("/assets/font/BRLNSR_1.TTF") ;
}
......
...@@ -29,19 +29,10 @@ export class UploadImageWithPreviewComponent implements OnDestroy, OnChanges { ...@@ -29,19 +29,10 @@ export class UploadImageWithPreviewComponent implements OnDestroy, OnChanges {
@Input() @Input()
disableUpload = false; disableUpload = false;
uploadUrl; uploadUrl = (<any> window).courseware.uploadUrl();
uploadData; uploadData = (<any> window).courseware.uploadData();
constructor(private nzMessageService: NzMessageService) { 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() { ngOnChanges() {
if (!this.picItem) { if (!this.picItem) {
......
...@@ -47,8 +47,8 @@ export class UploadVideoComponent implements OnChanges, OnDestroy { ...@@ -47,8 +47,8 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
item: any; item: any;
// videoItem = null; // videoItem = null;
uploadUrl; uploadUrl = (window as any).courseware.uploadUrl();
uploadData; uploadData = (window as any).courseware.uploadData();
constructor(private nzMessageService: NzMessageService, constructor(private nzMessageService: NzMessageService,
private sanitization: DomSanitizer private sanitization: DomSanitizer
...@@ -58,16 +58,6 @@ export class UploadVideoComponent implements OnChanges, OnDestroy { ...@@ -58,16 +58,6 @@ export class UploadVideoComponent implements OnChanges, OnDestroy {
this.uploading = false; this.uploading = false;
this.videoFile = null; 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() { ngOnChanges() {
// if (!this.videoFile || this.showUploadBtn) { // if (!this.videoFile || this.showUploadBtn) {
......
<div class="model-content"> <div class="model-content">
<div nz-row>
<div nz-col nzOffset='4'><h1 nz-title>课程内容编辑</h1></div>
<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 nz-form>
<nz-form-item>
</div> <nz-form-control [nzSpan]="6" nzOffset="3" class="add-btn-box">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
\ No newline at end of file (click)="addPracticeItem()">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<nz-form-control [nzSpan]="15" nzOffset="3">
<div *ngFor="let it of item.practices; let i = index" class="card-item" style="padding: 0.5vw;">
<div class="border">
<nz-divider nzText="练习-{{i+1}}" nzOrientation="left"></nz-divider>
<div nz-form>
<nz-form-item>
<nz-form-label [nzSpan]="6" 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>
<nz-form-label [nzSpan]="6" nzFor="it.answers">答案</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
(click)="addAnswerItem(it.answers, it)">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<div nz-col [nzSpan]="22" nzOffset="1">
<nz-table #answersTable [nzData]="it.answers" [nzHideOnSinglePage]="true" [nzBordered]="true" [nzNoResult]=''>
<thead>
<tr>
<th>序号</th>
<th>答案类型</th>
<th>备选答案</th>
<th>是否正确</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of answersTable.data;let j = index">
<td>{{j+1}}</td>
<td>
<nz-radio-group [(ngModel)]="data.type" (ngModelChange)="setAnswerType($event, data)">
<label nz-radio nzValue="T">文字</label>
<label nz-radio nzValue="P">图片</label>
</nz-radio-group>
</td>
<td *ngIf="data.type == 'T'"><input type="text" nz-input placeholder="请录入备选答案" [(ngModel)]="data.val" (blur)="save()"></td>
<td *ngIf="data.type == 'P'">
<app-upload-image-with-preview
style="width: 100%"
[picUrl]="data.pic_url"
(imageUploaded)="onImageUploadSuccess($event, data, 'pic_url')"
></app-upload-image-with-preview>
</td>
<td>
<nz-radio-group [(ngModel)]="data.correct" (ngModelChange)="save()">
<label nz-radio nzValue="0"></label>
<label nz-radio nzValue="1"></label>
</nz-radio-group>
</td>
<td>
<a (click)="delAnswerItem(it.answers, j, it)">delete</a>
</td>
</tr>
</tbody>
</nz-table>
</div>
</nz-form-item>
</div>
<button style="margin: 10px;" nz-button nzType="danger" (click)="delPracticeItem(i)">
<span>删除</span>
</button>
</div>
</div>
</nz-form-control>
</nz-form-item>
</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,ElementRef, HostListener,ChangeDetectorRef} from '@angular/core';
import { NzTableModule } from 'ng-zorro-antd/table';
@Component({ @Component({
...@@ -10,7 +10,7 @@ import {Component, EventEmitter, Input, OnDestroy, OnChanges, OnInit, Output, Ap ...@@ -10,7 +10,7 @@ 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 = "DF-L220";
// 储存对象 // 储存对象
item; item;
...@@ -24,6 +24,8 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -24,6 +24,8 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.item = {}; this.item = {};
this.item.practices = [];
// 获取存储的数据 // 获取存储的数据
(<any> window).courseware.getData((data) => { (<any> window).courseware.getData((data) => {
...@@ -31,9 +33,14 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -31,9 +33,14 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.item = data; this.item = data;
} }
if(!this.item.practices){
this.item.practices = [];
}
console.log('item', this.item);
this.init(); this.init();
this.changeDetectorRef.markForCheck(); this.changeDetectorRef.markForCheck();
this.changeDetectorRef.detectChanges(); this.changeDetectorRef.detectChanges();
this.refresh(); this.refresh();
}, this.saveKey); }, this.saveKey);
...@@ -58,10 +65,10 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -58,10 +65,10 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
* 储存图片数据 * 储存图片数据
* @param e * @param e
*/ */
onImageUploadSuccess(e, key) { onImageUploadSuccess(e, item, key) {
this.item[key] = e.url; item[key] = e.url;
this.save(); this.save();
} }
/** /**
...@@ -93,5 +100,99 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy { ...@@ -93,5 +100,99 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
}, 1); }, 1);
} }
/**
* 添加练习
*/
addPracticeItem(){
let practice = this.getDefaultPracticeItem();
this.item.practices.push(practice);
this.save();
}
delPracticeItem(index){
if (index !== -1) {
this.item.practices.splice(index, 1);
this.save();
}
}
/**
* 获取缺省的练习题内容
*/
getDefaultPracticeItem(){
let practice = {
audio_url:"",
answers:[]
}
return practice;
}
/**
* 添加答案
*/
addAnswerItem(answers, practice){
let answer = this.getDefaultAnswerItem();
practice.answers = [...answers, answer];
this.save();
}
/**
* 删除答案
* @param answers
* @param index
*/
delAnswerItem(answers, index, practice){
if (index !== -1) {
answers.splice(index, 1);
practice.answers = [...answers];
this.save();
}
}
/**
* 获取缺省的答案
*/
getDefaultAnswerItem(){
let answer = {
val:"",
pic_url:"",
correct:'0',
type:'T'
}
return answer;
}
onAudioUploadSuccessByItem(e, item, key) {
console.log(item);
item[key] = e.url;
this.save();
}
setAnswerType(e, item){
if(e == 'P'){
item.val = "";
}
else if(e == 'T'){
item.pic_url = "";
}
else{
item.val = "";
item.pic_url = "";
}
this.save();
}
} }
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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