Commit 9fbe2096 authored by Tt's avatar Tt

后台页面完成

parent 67c3cec7
<div class="model-content">
<div style="padding: 10px;">
<div *ngFor="let li of item.list; let i = index">
<div style="border: 1px solid #000;margin:10px;padding:20px">
<h1>第 {{ i+1 }}题</h1>
<hr />
<h2>题干</h2>
<app-audio-recorder [audioUrl]="li.stem.audio" (audioUploaded)="onStemAudioUploadSuccess($event, li.stem)">
</app-audio-recorder>
<hr />
<div style="display: flex;">
<div *ngFor="let rt of li.right; let m = index">
<h2 style="margin-left:10px">正确选项</h2>
<div style="border: 1px solid #000;margin:10px;padding:20px;width: 300px;height: 330px;">
<span>文本: </span>
<input type="text" nz-input [(ngModel)]="rt.text" (blur)="save()">
<span>图片 </span>
<app-upload-image-with-preview [picUrl]="rt.pic"
(imageUploaded)="onImageUploadSuccess($event,rt, 'pic_url_2')">
</app-upload-image-with-preview>
<div style="padding: 10px 0">
显示
<nz-radio-group [(ngModel)]="rt.type" (ngModelChange)="save()">
<label nz-radio nzValue="text">文字</label>
<label nz-radio nzValue="pic">图片</label>
</nz-radio-group>
</div>
</div>
</div>
<div *ngFor="let rt of li.error; let n = index">
<h2 style="margin-left:10px">错误选项</h2>
<div style="border: 1px solid #000;margin:10px;padding:20px;width: 300px;height: 330px;">
<span>文本: </span>
<input type="text" nz-input [(ngModel)]="rt.text" (blur)="save()">
<span>图片 </span>
<app-upload-image-with-preview [picUrl]="rt.pic"
(imageUploaded)="onImageUploadSuccess($event, rt,'pic_url_2')">
</app-upload-image-with-preview>
<div style="padding: 10px 0">
显示
<nz-radio-group [(ngModel)]="rt.type" (ngModelChange)="save()">
<label nz-radio nzValue="text">文字</label>
<label nz-radio nzValue="pic">图片</label>
</nz-radio-group>
</div>
<div>
<button *ngIf="n != 0" nzType="default" nz-button nzDanger
(click)="onDeleteError(li.id,rt.id)">删除按钮</button>
</div>
</div>
</div>
<button *ngIf="li.error.length < 3" nzType="default" nz-button
style="color: blue;border:1px solid blue;margin:5px" (click)="onAddError(li.id)">增加题目</button>
</div>
<hr />
<button (click)="onDeleteItem(li.id)" nzType="default" nz-button nzDanger
style="color: red;border:1px solid red;margin:5px">删除题目</button>
<button (click)="onMoveUp(li.id)" *ngIf="li.id != 0" nzType="default" nz-button
style="color: blue;border:1px solid blue;margin:5px">上移</button>
<button (click)="onMoveDown(li.id)" *ngIf="li.id != item.list.length -1 " nzType="default" nz-button
style="color: blue;border:1px solid blue;margin:5px">下移</button>
</div>
<div style="margin:10px">
<button (click)="onAddItem()" nzType="default" nz-button
style="color: green;border:1px solid green;margin:5px">新建卡片</button>
</div>
</div>
<!-- <div style="padding: 10px;">
<div style="width: 300px;" align='center'>
<span>图1: </span>
<app-upload-image-with-preview
[picUrl]="item.pic_url"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url')">
<app-upload-image-with-preview [picUrl]="item.pic_url" (imageUploaded)="onImageUploadSuccess($event, 'pic_url')">
</app-upload-image-with-preview>
</div>
<div style="width: 300px; margin-top: 5px;" align='center'>
<span>图2: </span>
<app-upload-image-with-preview
[picUrl]="item.pic_url_2"
<app-upload-image-with-preview [picUrl]="item.pic_url_2"
(imageUploaded)="onImageUploadSuccess($event, 'pic_url_2')">
</app-upload-image-with-preview>
</div>
......@@ -25,12 +91,10 @@
<div style="margin-top: 5px">
<span>音频: </span>
<app-audio-recorder
[audioUrl]="item.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, 'audio_url')"
></app-audio-recorder>
<app-audio-recorder [audioUrl]="item.audio_url" (audioUploaded)="onAudioUploadSuccess($event, 'audio_url')">
</app-audio-recorder>
</div>
</div>
</div> -->
</div>
</div>
\ No newline at end of file
......@@ -33,9 +33,85 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.save();
}
ngOnInit() {
onDeleteError(listId, id) {
this.item.list[listId].error = this.item.list[listId].error.filter(li => {
return li.id != id;
})
for (let i = 0; i < this.item.list[listId].error.length; i++) {
this.item.list.error[i].id = 2000 + i + 1;
}
this.save();
}
onAddError(listId) {
this.item.list[listId].error.push({
id: 2000 + (this.item.list[listId].error.length + 1),
text: "",
pic: "",
type: "pic",
})
this.save();
}
onAddItem() {
this.item.list.push(this.createItem())
this.save();
}
onDeleteItem(listId) {
this.item.list.splice(listId, 1);
for (let i = 0; i < this.item.list.length; i++) {
this.item.list[i].id = i;
}
this.save();
}
onMoveUp(listId) {
this.item.list[listId - 1].id = listId;
this.item.list[listId].id = listId - 1;
this.item.list.sort((A, B) => {
return A.id - B.id;
})
this.save();
}
onMoveDown(listId) {
this.item.list[listId + 1].id = listId;
this.item.list[listId].id = listId + 1;
this.item.list.sort((A, B) => {
return A.id - B.id;
})
this.save();
}
this.item = {};
createItem() {
return {
id: this.item.list.length,
stem: {
audio: "",
},
right: [{
id: 1001,
text: "",
pic: "",
type: "pic",
}],
error: [{
id: 2001,
text: "",
pic: "",
type: "pic",
}, {
id: 2002,
text: "",
pic: "",
type: "pic",
}, {
id: 2003,
text: "",
pic: "",
type: "pic",
}]
}
}
ngOnInit() {
this.item = { list: [] };
// 获取存储的数据
(<any>window).courseware.getData((data) => {
......@@ -64,12 +140,22 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
/**
* 储存图片数据
* 题干音频
* @param e
*/
onImageUploadSuccess(e, key) {
onStemAudioUploadSuccess(e, stem) {
stem.audio = e.url;
this.save();
}
this.item[key] = e.url;
/**
* 储存图片数据
* @param e
*/
onImageUploadSuccess(e, item, key) {
item.pic = e.url;
// this.item[key] = e.url;
this.save();
}
......
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