Commit ee2bed6e authored by Chen Jiping's avatar Chen Jiping

完善

parent 6d421345
......@@ -6,3 +6,8 @@
height: 100%;
}
.border {
border-radius: 20px;
border-style: dashed;
}
......@@ -16,60 +16,73 @@
<nz-form-item>
<nz-form-control [nzSpan]="15" nzOffset="3">
<div *ngFor="let it of item.exercises; let i = index" class="card-item" style="padding: 0.5vw;">
<div class="border">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{i}}.contents">内容</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
(click)="addContentItem(it.contents)">
<i nz-icon nzType="plus-circle" nzTheme="outline"></i>添加
</button>
</nz-form-control>
</nz-form-item>
<div >
<!--
<nz-divider nzText="练习-{{i+1}}" nzOrientation="left"></nz-divider>
-->
<!--
<button style="margin: 10px;" nz-button nzType="danger" (click)="delExercisesItem(i)">
<span>删除</span>
</button>
-->
<div nz-form>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="it.contents">内容</nz-form-label>
<nz-form-control [nzSpan]="6">
<button nz-button nzType="dashed" class="add-btn" id="add-btn"
(click)="addContentItem(it.contents)">
<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 [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 it.contents;let j = index">
<td>{{j+1}}</td>
<td><input type="text" nz-input placeholder="请录入内容" [(ngModel)]="data.val" (blur)="save()"></td>
<td>
<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>
<app-audio-recorder id="data.audio_url"
[audioUrl]="data.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, data, 'audio_url')">
</app-audio-recorder>
</td>
<td>
<a (click)="delContentItem(it.contents, j)">delete</a>
</td>
</tr>
</tbody>
</nz-table>
<div *ngFor="let data of it.contents;let j = index" class="card-item" style="padding: 0.5vw;">
<div class="border">
<nz-divider nzText="内容-{{j+1}}" nzOrientation="left"></nz-divider>
<nz-form-item>
<nz-form-label [nzSpan]="6" >内容形式</nz-form-label>
<nz-form-control [nzSpan]="6">
<nz-radio-group [(ngModel)]="data.contentType" (ngModelChange)="setContentType($event, data)">
<label nz-radio nzValue="T">文字</label>
<label nz-radio nzValue="P">图片</label>
</nz-radio-group>
</nz-form-control>
</nz-form-item>
<div *ngIf="data.contentType == 'T'">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.val">文本</nz-form-label>
<nz-form-control [nzSpan]="6">
<input nz-input type="text" id="{{j}}.val" placeholder="请录入内容" [(ngModel)]="data.val" (blur)="save()">
</nz-form-control>
</nz-form-item>
</div>
<div *ngIf="data.contentType == 'P'">
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.pic_url">图片</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-upload-image-with-preview
style="width: 100%"
[picUrl]="data.pic_url"
(imageUploaded)="onImageUploadSuccess($event, data, 'pic_url')"
></app-upload-image-with-preview>
</nz-form-control>
</nz-form-item>
</div>
</nz-form-item>
<nz-form-item>
<nz-form-label [nzSpan]="6" nzFor="{{j}}.pic_url">音频</nz-form-label>
<nz-form-control [nzSpan]="6">
<app-audio-recorder id="{{j}}.audio_url"
[audioUrl]="data.audio_url"
(audioUploaded)="onAudioUploadSuccess($event, data, 'audio_url')">
</app-audio-recorder>
</nz-form-control>
</nz-form-item>
<nz-form-item>
<button style="margin: 10px;" nz-button nzType="danger" (click)="delContentItem(it.contents, j)">
<span>删除</span>
</button>
</nz-form-item>
</div>
</div>
</div>
......
......@@ -37,6 +37,8 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
this.addExercisesItem();
}
console.log('data', this.item);
this.init();
this.refresh();
......@@ -156,6 +158,7 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
*/
getDefaultContentItem(){
let content = {
contentType:"T",
val:"",
pic_url:"",
audio_url:""
......@@ -163,5 +166,19 @@ export class FormComponent implements OnInit, OnChanges, OnDestroy {
return content;
}
setContentType(e, item){
item['contentType'] = e;
if("T" == e){
item['pic_url'] = "";
}
else if("P" == e){
item['val'] = "";
}
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