Commit bc5295c6 authored by LikG21's avatar LikG21

游戏配置更换

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