Commit bc5295c6 authored by LikG21's avatar LikG21

游戏配置更换

parent b1dd2c8f
......@@ -11,14 +11,14 @@
padding: 20px;
}
.letterList-title {
.option-title {
color: #000;
font-size: 18px;
min-width: 70px;
/* margin-right: 10px; */
}
.letterList-content {
.option-content {
border: 1px dashed #333;
border-radius: 1px;
padding: 20px;
......@@ -76,7 +76,7 @@
<div class="model-content">
<div style="padding: 10px;background-color: #fff;">
<!-- <div class="border-dashed" style="margin: 20px;width: 1000px;">
<!-- <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>
......@@ -129,21 +129,18 @@
(click)="deleteBgAudio()">删除背景音</span>
</div>
</div>
</div> -->
</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}}
题目:
</div>
<div>
</div>
<!-- <div>
<div>
<div class="word-type-option-title" style="margin-top:10px;">题目音频:</div>
<div style="display:flex ;">
<div>
......@@ -155,186 +152,105 @@
<span>{{ question.audioName}}</span>
</div>
</div>
</div> -->
</div>
<!-- <div style="margin-top:20px">
<div style="margin-top:20px">
<div class="word-type-option-title">倒计时: </div>
<input type="number" nz-input [(ngModel)]="question.duration" (blur)="save()">
</div> -->
</div>
<div class="word-type-option-title" style="display: flex; margin-top:20px;">
题干:
<!-- <div *ngFor="let question of question; let j = index" style="margin-left: 30px;"> -->
<div class="word-type-option-title" style="margin-top:20px;">
选项内容:
</div>
<div>
<div style="margin-left: 30px;">
<nz-radio-group [(ngModel)]="question.type" (ngModelChange)="ngChange(i)">
<label nz-radio nzValue="img">
<span [style]="{color:question.type=='img' ? '#169BD5':'#000'}">图片</span>
</label>
<label nz-radio nzValue="txt">
<span [style]="{color:question.type=='txt' ? '#169BD5':'#000'}">文本</span>
</label>
</nz-radio-group>
<div *ngFor="let option of question.options; let j = index">
<div style="display: flex;margin-top:20px">
<div class="option-title">
选项{{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]="{
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: 15px;margin-left: 28px;">
<div class="option-img">
<div *ngIf="question.type=='img'" style="width: 200px;">
<span style="font-size: 20px;">图片:</span>
<app-upload-image-with-preview [picUrl]="question.image"
(imageUploaded)="onImageUploadSuccess($event, 'image',question)">
</app-upload-image-with-preview>
<!-- <div style="margin-top: 20px;">
<div class="word-type-option-title">
选项类型:
</div>
</div>
<div class="option-text">
<div *ngIf="question.type=='txt'" style="width: 200px">
<span style="font-size: 20px;">文本</span>
<input style="width: 600px;" type="text" nz-input [(ngModel)]="question.text" (blur)="save()">
<div style="margin-top: 5px;">
<nz-radio-group [(ngModel)]="option.type" (ngModelChange)="ngChange(i,j)">
<label nz-radio nzValue="img">
<span [style]="{color:option.type=='img' ? '#169BD5':'#000'}">图片</span>
</label>
<label nz-radio nzValue="txt">
<span [style]="{color:option.type=='txt' ? '#169BD5':'#000'}">文字</span>
</label>
</nz-radio-group>
</div>
</div>
<!-- <div class="option-time">
</div> -->
</div>
</div>
<!-- </div> -->
</div>
<div>
<span style="font-size: 18px; color: #000;">选项类型:</span>
<nz-radio-group style="margin-left: 30px;" [(ngModel)]="question.optionsType"
(ngModelChange)="ngChange(i)">
<label nz-radio nzValue="img">
<span [style]="{color:question.optionsType=='img' ? '#169BD5':'#000'}">图片</span>
</label>
<label nz-radio nzValue="shortTxt">
<span [style]="{color:question.optionsType=='shortTxt' ? '#169BD5':'#000'}">短文本</span>
</label>
<label nz-radio nzValue="longTxt">
<span [style]="{color:question.optionsType=='longTxt' ? '#169BD5':'#000'}">长文本</span>
</label>
</nz-radio-group>
</div>
<div *ngIf="question.optionsType=='img' || question.optionsType=='shortTxt'">
<div *ngFor="let letterList of question.letterList.slice(0,2); let j = index">
<div style="display: flex;margin-top:20px">
<div class="letterList-title">
选项{{j+1}}
</div>
<div class="letterList-content" style="padding: 15px 30px;">
<div style="margin-top: 15px;margin-left: 28px;">
<div class="option-img">
<div *ngIf="question.optionsType=='img'" style="width: 200px;">
<span style="font-size: 20px;">图片:</span>
<app-upload-image-with-preview [picUrl]="letterList.image"
(imageUploaded)="onImageUploadSuccess($event, 'image',letterList)">
</app-upload-image-with-preview>
</div>
<div style="margin-top: 25px;">
<div class="option-img">
<div 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 class="option-text">
<div *ngIf="question.optionsType=='shortTxt'" style="width: 200px">
<span style="font-size: 20px;">短文本</span>
<input style="width: 400px;" type="text" nz-input [(ngModel)]="letterList.shortText"
(blur)="save()">
</div>
</div>
<div class="option-text">
<div style="width: 200px">
<span style="font-size: 20px;">文本</span>
<input type="text" nz-input [(ngModel)]="option.text" (blur)="save()">
</div>
<!-- <div class="option-time">
</div> -->
</div>
</div>
<div class="letterList-btns">
<button class="btn-red" nz-button nzType="default" nzDanger
(click)="removeoption(i,j)">减少选项</button>
<button *ngIf="question.optionsType=='img' && question.letterList.length <= 1 " class="btn-blue"
style="margin-top: 10px;" nz-button nzType="default" nzDanger
(click)="copyOption(i,j)">复制选项</button>
<button *ngIf="question.optionsType=='shortTxt' && question.letterList.length <= 1 "
class="btn-blue" style="margin-top: 10px;" nz-button nzType="default" nzDanger
(click)="copyOption(i,j)">复制选项</button>
</div>
</div>
</div>
</div>
<div *ngIf="question.optionsType=='longTxt'">
<div *ngFor="let letterList of question.letterList; let j = index">
<div style="display: flex;margin-top:20px">
<div class="letterList-title">
选项{{j+1}}
</div>
<div class="letterList-content" style="padding: 15px 30px;">
<div style="margin-top: 15px;margin-left: 28px;">
<div class="option-text">
<div *ngIf="question.optionsType=='longTxt'" style="width: 200px">
<span style="font-size: 20px;">长文本</span>
<input style="width: 600px;" type="text" nz-input [(ngModel)]="letterList.longText"
(blur)="save()">
<div class="option-audio">
<span style="font-size: 20px;">选项音频:</span>
<div style="display: flex">
<div>
<app-audio-recorder [audioUrl]="option.audio"
(audioUploaded)="onAudioUploadSuccess($event,'audio',option,'audioName')">
</app-audio-recorder>
</div>
<div style="margin: 5px">
<span>
{{ option.audioName}}
</span>
</div>
</div>
<!-- <div class="option-time">
</div> -->
</div>
<div class="option-time">
</div>
</div>
<div class="letterList-btns">
<button class="btn-red" nz-button nzType="default" nzDanger
(click)="removeoption(i,j)">减少选项</button>
<button *ngIf="question.optionsType=='longTxt' && question.letterList.length <= 2" class="btn-blue"
style="margin-top: 10px;" nz-button nzType="default" nzDanger
(click)="copyOption(i,j)">复制选项</button>
</div>
</div>
<div class="option-btns">
<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>
</div>
</div>
</div>
<div style="margin-left: 69px;margin-top: 15px;">
<button *ngIf="question.optionsType=='img' && question.letterList.length <= 1 " class="btn-blue" nz-button
nzType="default" nzDanger (click)="addoption(i)">+增加选项</button>
<button *ngIf="question.optionsType=='shortTxt' && question.letterList.length <= 1 " class="btn-blue"
nz-button nzType="default" nzDanger (click)="addoption(i)">+增加选项</button>
<button *ngIf="question.optionsType=='longTxt' && question.letterList.length <= 2" class="btn-blue"
nz-button nzType="default" nzDanger (click)="addoption(i)">+增加选项</button>
</div>
<div *ngIf="question.letterList != ''">
<span style="font-size: 18px; color: #000;">正确答案:</span>
<nz-radio-group style="margin-left: 30px;" [(ngModel)]="question.index" (ngModelChange)="ngChange(i)">
<label nz-radio nzValue="0">
<span [style]="{color:question.letterList.answer=='0' ? '#169BD5':'#000'}">选项1</span>
</label>
<label nz-radio nzValue="1" *ngIf="question.letterList.length > 1">
<span [style]="{color:question.letterList.answer=='1' ? '#169BD5':'#000'}">选项2</span>
</label>
<label nz-radio nzValue="2" *ngIf="question.letterList.length > 2 && question.optionsType=='longTxt'">
<span [style]="{color:question.letterList.answer=='2' ? '#169BD5':'#000'}">选项3</span>
</label>
</nz-radio-group>
<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>
<!-- <button class="btn-blue" style="margin-top:10px;width: 1000px; height: 50px;" nz-button nzType="default" nzDanger
(click)="addquestion()">+增加题目</button> -->
</div>
......
......@@ -9,7 +9,7 @@ import { MetaFormCreator } from './mataFormCreator';
})
export class FormComponent extends ComponentBase implements OnInit, OnChanges, OnDestroy {
// 储存数据用
saveKey = "hy_06";
saveKey = "hy_08";
item = {
onlineFlg: false,
......@@ -21,6 +21,7 @@ export class FormComponent extends ComponentBase implements OnInit, OnChanges, O
bgAudioName: "",
audioName: ""
};
isVisible = false;
deleteTitle = "是否删除题目";
deleteCallback = function () { };
......@@ -39,35 +40,29 @@ export class FormComponent extends ComponentBase implements OnInit, OnChanges, O
init(): void {
/* console.log(new MetaFormCreator().create()); */
console.log(new MetaFormCreator().create());
}
removeoption(i, j) {
if ((this.item.questions[i].optionsType == "img" || this.item.questions[i].optionsType == "shortTxt") && this.item.questions[i].letterList.length > 2) {
this.openDelete("确定减少选项?", () => {
this.item.questions[i].letterList.splice(j, 2);
this.save();
})
} else {
this.openDelete("确定减少选项?", () => {
this.item.questions[i].letterList.splice(j, 1);
this.save();
})
}
this.openDelete("确定删除选项?", () => {
this.item.questions[i].options.splice(j, 1);
this.save();
})
}
copyOption(i, j) {
let data = this.item.questions[i].letterList[j];
this.item.questions[i].letterList.push(JSON.parse(JSON.stringify(data)));
let data = this.item.questions[i].options[j];
this.item.questions[i].options.push(JSON.parse(JSON.stringify(data)));
this.save();
}
addoption(i) {
this.item.questions[i].letterList.push({
answer: '',
this.item.questions[i].options.push({
type: "",
image: "",
shortText: "",
longText: "",
})
audio: "",
text: "",
right: false
});
this.save();
}
......@@ -80,32 +75,19 @@ export class FormComponent extends ComponentBase implements OnInit, OnChanges, O
addquestion() {
this.item.questions.push({
optionsType: "img",
questionAudio: "",
duration: 120,
type: "img",
image: "",
index: '',
audio: "",
text: "",
right: false,
letterList: [],
options: []
});
this.save();
}
deleteBgAudio() {
this.item.bgAudio = "";
this.item.bgAudioName = "";
this.save();
}
button1() {
console.log(this.item, '456')
}
ngChange(i) {
for (let a = 0; a < this.item.questions[i].letterList.length; a++) {
this.item.questions[i].letterList[a].answer = false
}
this.item.questions[i].letterList[this.item.questions[i].index].answer = true
ngChange(i, j) {
this.save();
}
}
\ No newline at end of file
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