Commit a298aee7 authored by Tt's avatar Tt

表单修改完成

parent 85c5f34c
This diff is collapsed.
......@@ -67,12 +67,12 @@ export class ComponentBase {
* 储存音频数据
* @param e
*/
onAudioUploadSuccess(e, key, it = this.item) {
onAudioUploadSuccess(e, key, it = this.item) {
let url = e.url;
let sp = url.split(".mp3");
let u = sp[0] + "_l.mp3";
it[key] = u;
it["audioName"] = e.name || "";
it[key + "Name"] = e.name || "";
this.save();
}
......
......@@ -76,43 +76,12 @@
<div class="model-content">
<div style="padding: 10px;background-color: #fff;">
<div class="border-dashed" style="margin: 20px;width: 1000px;">
<span style="font-size: 20px;">标题: </span>
<input type="text" nz-input [(ngModel)]="item.title" (blur)="save()">
<span style="font-size: 20px;">题目说明: </span>
<input type="text" nz-input [(ngModel)]="item.questionText" (blur)="save()">
<span style="font-size: 20px;">题目说明音频: </span>
<div style="display:flex ;">
<div>
<app-audio-recorder [audioUrl]="item.questionTextAudio"
(audioUploaded)="onAudioUploadSuccess($event, 'questionTextAudio')"></app-audio-recorder>
</div>
<div style="margin: 5px">
<span>{{ item.audioName}}</span>
</div>
</div>
</div>
<div class="border-dashed" style="margin: 20px;width: 1000px;">
<div style="font-size: 20px;">游戏模式: </div>
<nz-radio-group [(ngModel)]="item.onlineFlg" (ngModelChange)="save()">
<label nz-radio [nzValue]="true">
<span [style]="{color:item.onlineFlg==true ? '#169BD5':'#000'}">联机版</span>
</label>
<label nz-radio [nzValue]="false">
<span [style]="{color:item.onlineFlg==false ? '#169BD5':'#000'}">单机版</span>
</label>
</nz-radio-group>
</div>
<div style="margin: 20px;width: 1000px;">
<div *ngFor="let question of item.questions; let i = index">
<div style="display: flex;margin-top: 20px;">
<div class="border-solid" style="min-width: 1000px;">
<div class="word-type-title">
题目{{i+1}}
{{ question.title }}
</div>
......@@ -120,8 +89,8 @@
<div class="word-type-option-title" style="margin-top:10px;">题目音频:</div>
<div style="display:flex ;">
<div>
<app-audio-recorder [audioUrl]="question.questionAudio"
(audioUploaded)="onAudioUploadSuccess($event, 'questionAudio',question)">
<app-audio-recorder [audioUrl]="question.audio"
(audioUploaded)="onAudioUploadSuccess($event, 'audio',question)">
</app-audio-recorder>
</div>
<div style="margin: 5px">
......@@ -131,29 +100,27 @@
</div>
<div style="margin-top:20px">
<div class="word-type-option-title">倒计时: </div>
<input type="number" nz-input [(ngModel)]="question.duration" (blur)="save()">
<div class="word-type-option-title">题目文本: </div>
<input type="text" nz-input [(ngModel)]="question.text" (blur)="save()">
</div>
<div class="word-type-option-title" style="margin-top:20px;">
选项内容:
鱼群:
</div>
<div *ngFor="let option of question.options; let j = index">
<div style="display: flex;margin-top:20px">
<div class="option-title">
选项{{j+1}}
{{j+1}}
</div>
<div class="option-content" style="padding: 15px 30px;">
<div style="margin:-15px -30px;width: calc(100%+60px);height: 40px;padding:10px 20px;" [style]="{
<!-- <div style="margin:-15px -30px;width: calc(100%+60px);height: 40px;padding:10px 20px;" [style]="{
backgroundColor: option.right ?'#169BD5':'#eee'}">
<label nz-checkbox [(ngModel)]="option.right" (ngModelChange)="save()"
[style]="{color: option.right ?'#fff':'#000'}">正确答案</label>
</div>
<div style="margin-top: 20px;">
<div class="word-type-option-title">
选项类型:
......@@ -168,26 +135,25 @@
</label>
</nz-radio-group>
</div>
</div>
<div style="margin-top: 25px;">
<div class="option-img">
</div> -->
<div>
<!-- <div class="option-img">
<div *ngIf="option.type=='img'" style="width: 200px;">
<span style="font-size: 20px;">图片:</span>
<app-upload-image-with-preview [picUrl]="option.image"
(imageUploaded)="onImageUploadSuccess($event, 'image',option)">
</app-upload-image-with-preview>
</div>
</div>
</div> -->
<div class="option-text">
<div *ngIf="option.type=='txt'" style="width: 200px">
<span style="font-size: 20px;">文本</span>
<span style="font-size: 20px;">文本</span>
<input type="text" nz-input [(ngModel)]="option.text" (blur)="save()">
</div>
</div>
<div class="option-audio">
<span style="font-size: 20px;">选项音频:</span>
<span style="font-size: 20px;">鱼音频</span>
<div style="display: flex">
<div>
<app-audio-recorder [audioUrl]="option.audio"
......@@ -206,27 +172,27 @@
</div>
</div>
<div class="option-btns">
<button class="btn-red" nz-button nzType="default" nzDanger (click)="removeoption(i,j)">删除选项</button>
<button class="btn-red" nz-button nzType="default" nzDanger (click)="removeoption(i,j)">删除</button>
<button class="btn-blue" style="margin-top: 10px;" nz-button nzType="default" nzDanger
(click)="copyOption(i,j)">复制选项</button>
(click)="copyOption(i,j)">复制</button>
</div>
</div>
</div>
<div style="margin-left: 69px;margin-top: 15px;">
<button class="btn-blue" nz-button nzType="default" nzDanger (click)="addoption(i)">+增加选项</button>
<button class="btn-blue" nz-button nzType="default" nzDanger (click)="addoption(i)">+增加</button>
</div>
</div>
<div style="margin:0 20px">
<!-- <div style="margin:0 20px">
<button class="btn-red" nz-button nzType="default" nzDanger (click)="removequestion(i)">删除题目</button>
</div>
</div> -->
</div>
</div>
<!--
<button class="btn-blue" style="margin-top:10px;width: 1000px; height: 50px;" nz-button nzType="default" nzDanger
(click)="addquestion()">+增加题目</button>
(click)="addquestion()">+增加题目</button> -->
</div>
......
......@@ -9,15 +9,25 @@ import { MetaFormCreator } from './mataFormCreator';
})
export class FormComponent extends ComponentBase implements OnInit, OnChanges, OnDestroy {
// 储存数据用
saveKey = "fishing";
saveKey = "ngt07_fish";
item = {
onlineFlg: false,
title: "钓鱼大作战",
questionText: "海洋里有很多鱼,每条鱼身上都藏着魔法信息!亲爱的小玩家,请仔细听游戏指令,找到含有正确魔法信息的鱼,快速完成钓鱼。 在本次的游戏中,你将和其他玩家进行PK,游戏结束,钓鱼数量最多的玩家,将获得胜利。最后根据钓鱼的数量,你将获得相应的能量石奖励!开始挑战吧!",
questionTextAudio: "http://staging-teach.cdn.ireadabc.com/e422c682ff3304a532937db64573caa4.mp3",
questions: [],
audioName: ""
questions: [
{
title: '左侧船',
text: "",
audio: "",
audioName: "",
options: [],
},
{
title: '右侧船',
text: "",
audio: "",
audioName: "",
options: [],
}
],
};
isVisible = false;
......@@ -55,30 +65,16 @@ export class FormComponent extends ComponentBase implements OnInit, OnChanges, O
addoption(i) {
this.item.questions[i].options.push({
type: "",
type: "txt",
image: "",
audio: "",
audioName: "",
text: "",
right: false
});
this.save();
}
removequestion(i) {
this.openDelete("确定删除题目?", () => {
this.item.questions.splice(i, 1);
this.save();
})
}
addquestion() {
this.item.questions.push({
questionAudio: "",
duration: 120,
options: []
});
this.save();
}
ngChange(i, j) {
this.save();
......
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